/*
Theme Name: Astra Child
Theme URI: https://kanchaya.com/
Description: Child theme for kanchaya.com. Hosts the commerce layer behind the Phase C product pages.
Author: Soham Dighe
Template: astra
Version: 1.18.0
Text Domain: astra-child
*/

/* ------------------------------------------------------------------
   Purchase CTA
   Scoped to .kanchaya-product-cta throughout so nothing can leak into
   the cart or checkout pages, which stay deliberately conventional.
   ------------------------------------------------------------------ */

.kanchaya-product-cta .kanchaya-cta-price {
  font-family: "Noto Serif", serif;
  font-size: 22px;
  color: #0D0807;
  margin: 0 0 16px 0;
}
.kanchaya-product-cta .kanchaya-cta-price del { opacity: 0.5; margin-right: 8px; }

.kanchaya-product-cta .kanchaya-cta-stock,
.kanchaya-product-cta .kanchaya-cta-soldout {
  font-family: "Manrope", sans-serif;
  font-size: 12px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #5F5F58;
  margin: 0 0 12px 0;
}

.kanchaya-product-cta .kanchaya-cta-colour { margin: 0 0 16px 0; }
.kanchaya-product-cta .kanchaya-cta-colour label {
  display: block;
  font-family: "Manrope", sans-serif;
  font-size: 12px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #5F5F58;
  margin-bottom: 6px;
}

.kanchaya-product-cta select,
.kanchaya-product-cta input.qty {
  font-family: "Manrope", sans-serif;
  font-size: 15px;
  padding: 10px 12px;
  border: 1px solid #0D0807;
  border-radius: 0;
  background: transparent;
  color: #0D0807;
}

.kanchaya-product-cta form.cart {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}
.kanchaya-product-cta .quantity { margin: 0; }
.kanchaya-product-cta .kanchaya-cta-notices:empty { display: none; }

/* Match the existing black "View Collection" button exactly. */
.kanchaya-product-cta button.single_add_to_cart_button {
  font-family: "Manrope", sans-serif;
  font-weight: 500;
  font-size: 14px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  background: #0D0807;
  color: #FAF9F7;
  border: 1px solid #0D0807;
  border-radius: 0;
  padding: 14px 28px;
  transition: opacity 0.2s ease-out;
}
.kanchaya-product-cta button.single_add_to_cart_button:hover {
  opacity: 0.8;
  background: #0D0807;
}
.kanchaya-product-cta button.single_add_to_cart_button:focus-visible,
.kanchaya-product-cta select:focus-visible,
.kanchaya-product-cta input.qty:focus-visible {
  outline: 2px solid #0D0807;
  outline-offset: 4px;
}
@media (prefers-reduced-motion: reduce) {
  .kanchaya-product-cta button.single_add_to_cart_button { transition: none; }
}

/* ------------------------------------------------------------------
   Header cart — visible only when it holds something.

   Keyed off Astra's own aria-label, which is "View Shopping Cart, empty"
   at zero and "View Shopping Cart, N items" otherwise
   (astra/inc/compatibility/woocommerce/class-astra-woocommerce.php:3505).

   This beats adding a class in PHP: a.cart-container is a registered
   WooCommerce fragment, so a fragment refresh replaces the node along with
   its aria-label and the rule re-evaluates on its own. Correct today with
   no cache and no AJAX, and still correct if either returns.

   visibility rather than display so the node stays in the layout and in
   the DOM for fragments to target.
   ------------------------------------------------------------------ */
.ast-site-header-cart a.cart-container[aria-label$="empty"] { visibility: hidden; }

/* ------------------------------------------------------------------
   Colour / finish swatches
   Base look for the v1 (Phase C) product pages; assets/v2.css restyles
   these for ported pages.

   Selectors are deliberately specific. These controls live inside
   WooCommerce's .cart form, where theme and plugin rules for `label`
   reach higher specificity than a bare component class and were
   overriding display, text-transform and letter-spacing.
   ------------------------------------------------------------------ */

.kanchaya-cta-colour.kchy-colourfield {
  border: 0;
  padding: 0;
  margin: 0 0 16px 0;
  min-width: 0;
}

.kanchaya-cta-colour .kchy-colourfield__label {
  display: block;
  padding: 0;
  font-family: "Manrope", sans-serif;
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #5F5F58;
}

.kanchaya-cta-colour .kchy-swatches {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 12px;
}

/* Visually hidden but focusable — the chip is the visible control. */
.kanchaya-cta-colour .kchy-swatch__input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.kanchaya-cta-colour .kchy-swatches label.kchy-swatch {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  margin: 0;
  padding: 8px 16px;
  border: 1px solid rgba(13, 8, 7, 0.2);
  background: transparent;
  cursor: pointer;
  text-transform: none;
  letter-spacing: normal;
  transition: border-color 0.2s ease-out;
}

.kanchaya-cta-colour .kchy-swatches label.kchy-swatch:hover {
  border-color: rgba(13, 8, 7, 0.5);
}

/* inline-block, not just a flex item: the dot must keep its size even if
   something upstream knocks the chip out of flex layout. */
.kanchaya-cta-colour .kchy-swatches .kchy-swatch__dot {
  display: inline-block;
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  /* Keeps a pale finish (Ivory, White pearl) from vanishing on a pale ground. */
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.14);
}

.kanchaya-cta-colour .kchy-swatches .kchy-swatch__name {
  font-family: "Manrope", sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.3;
  text-transform: none;
  letter-spacing: normal;
  color: #0D0807;
}

.kanchaya-cta-colour .kchy-swatches .kchy-swatch__input:checked + label.kchy-swatch {
  border-color: #0D0807;
}

.kanchaya-cta-colour .kchy-swatches .kchy-swatch__input:focus-visible + label.kchy-swatch {
  outline: 2px solid #0D0807;
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  .kanchaya-cta-colour .kchy-swatches label.kchy-swatch { transition: none; }
}