/* ==========================================================================
   Glyka global brand colors — makes the whole store congruent with the PDP.
   Change the tokens below to re-skin the entire site.
   ========================================================================== */
:root {
  --glyka-purple: #6B21A8;
  --glyka-purple-dark: #581c87;
  --glyka-purple-light: #7C3AED;
  --glyka-ink: #1a1a1a;
  --glyka-muted: #555;
}

/* ---- Links / accents ---- */
a { color: var(--glyka-purple); }
a:hover, a:focus { color: var(--glyka-purple-dark); }

/* ---- All buttons (theme, blocks, WooCommerce, checkout, cart) ---- */
.wp-block-button__link,
button.button, input.button, a.button, .button,
.ast-button, .ast-custom-button,
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt,
.woocommerce #respond input#submit, .woocommerce #respond input#submit.alt,
.woocommerce-page a.button, .woocommerce-page button.button, .woocommerce-page input.button,
.single_add_to_cart_button,
.checkout-button, #place_order,
.wc-block-components-button, .wp-element-button,
.added_to_cart {
  background-color: var(--glyka-purple) !important;
  border-color: var(--glyka-purple) !important;
  color: #fff !important;
}
.wp-block-button__link:hover,
button.button:hover, input.button:hover, a.button:hover, .button:hover,
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover,
.woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover,
.woocommerce #respond input#submit:hover,
.single_add_to_cart_button:hover,
.checkout-button:hover, #place_order:hover,
.wc-block-components-button:hover, .added_to_cart:hover {
  background-color: var(--glyka-purple-dark) !important;
  border-color: var(--glyka-purple-dark) !important;
  color: #fff !important;
}

/* ---- Mobile header hamburger toggle ---- */
.ast-mobile-menu-trigger-minimal,
.ast-mobile-menu-trigger-fill,
.main-header-menu-toggle,
.menu-toggle {
  color: var(--glyka-purple) !important;
}
.main-header-menu-toggle svg,
.menu-toggle svg,
.ast-mobile-svg { fill: var(--glyka-purple) !important; }
/* Astra draws the hamburger bars with currentColor / borders */
.ast-mobile-menu-trigger-minimal .menu-toggle-icon,
.menu-toggle .menu-toggle-icon { color: var(--glyka-purple) !important; }

/* ---- Nav hover / active ---- */
.main-header-menu a:hover,
.ast-header-navigation-arrow,
#ast-mobile-menu a:hover { color: var(--glyka-purple) !important; }

/* ---- Form field focus ---- */
input:focus, select:focus, textarea:focus,
.input-text:focus, .select2-container--focus .select2-selection {
  border-color: var(--glyka-purple) !important;
  outline-color: var(--glyka-purple) !important;
  box-shadow: 0 0 0 1px var(--glyka-purple) !important;
}

/* ---- WooCommerce notices / messages accent ---- */
.woocommerce-message, .woocommerce-info, .woocommerce-store-notice {
  border-top-color: var(--glyka-purple) !important;
}
.woocommerce-message::before, .woocommerce-info::before {
  color: var(--glyka-purple) !important;
}

/* ---- Misc accent bits ---- */
.woocommerce-checkout #payment,
.select2-results__option--highlighted {
  --wc-primary: var(--glyka-purple);
}
.woocommerce-checkout #payment .payment_methods li input[type="radio"]:checked + label { color: var(--glyka-purple); }
::selection { background: var(--glyka-purple); color: #fff; }

/* ---- GLYKÄ wordmark logo ---- */
.glyka-brand { display: inline-flex; align-items: center; text-decoration: none; }
.glyka-brand-svg { height: clamp(30px, 7vw, 40px); width: auto; display: block; }

/* ---- Scroll-to-top button ---- */
#ast-scroll-top {
  background-color: var(--glyka-purple) !important;
  color: #fff !important;
}
#ast-scroll-top:hover { background-color: var(--glyka-purple-dark) !important; }

/* ===== payment icons (checkout + footer) ===== */
/* ===== glyka-payicons — Indian payment method row ===== */
/* Pair with payment-icons.html. Works in checkout + footer. */

.glyka-payicons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: clamp(6px, 1.5vw, 10px);
  margin: 0 auto;
  padding: 0;
  max-width: 520px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

.glyka-payicon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: clamp(30px, 8vw, 34px);
  padding: 0 clamp(8px, 2vw, 11px);
  background: #fbfbfc;
  border: 1px solid #ececef;
  border-radius: 8px;
  box-shadow: 0 1px 2px rgba(17, 17, 17, 0.04);
  box-sizing: border-box;
}

.glyka-payicon-svg {
  height: clamp(18px, 4.6vw, 20px);
  width: auto;
  display: block;
}

/* Slightly tighter on very small phones so all 7 chips wrap cleanly */
@media (max-width: 360px) {
  .glyka-payicons { gap: 6px; }
  .glyka-payicon { padding: 0 7px; }
}

/* ===== Footer bar (payment icons + legal links) ===== */
.glyka-footer-bar { max-width: 1080px; margin: 0 auto; padding: clamp(20px,4vw,32px) clamp(16px,4vw,40px) 6px; text-align: center; }
.glyka-footer-pay { display: flex; flex-direction: column; align-items: center; gap: 12px; margin-bottom: 20px; }
.glyka-footer-pay-label { font-size: 11px; letter-spacing: 0.6px; text-transform: uppercase; color: #8a8a8a; font-weight: 700; }
.glyka-footer-legal { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 18px; }
.glyka-footer-legal a { color: #666 !important; font-size: 13.5px; text-decoration: none; }
.glyka-footer-legal a:hover { color: var(--glyka-purple) !important; text-decoration: underline; }

/* Header: show the real GLYKÄ logo only, at a sensible size; hide the redundant site-title text. */
.ast-site-identity .site-title,
.site-header .site-title { display: none !important; }
img.custom-logo,
.ast-site-identity img.custom-logo,
.site-branding img.custom-logo { max-height: 44px !important; width: auto !important; height: auto !important; }