/*
Theme Name:   Punjabi Libas Child
Theme URI:    https://punjabilibas.com
Description:  Child theme for Punjabi Libas WooCommerce store. Parent: Astra.
Author:       Punjabi Libas
Author URI:   https://punjabilibas.com
Template:     astra
Version:      1.0.0
License:      GNU General Public License v2 or later
Text Domain:  punjabilibas-child
*/

/* ============================================================
   PUNJABI LIBAS — GLOBAL DESIGN TOKENS
   Parent theme: Astra 4.13.4
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;1,300;1,400&family=DM+Sans:opsz,wght@9..40,300;9..40,400;9..40,500&family=Noto+Sans+Gurmukhi:wght@400;600&display=swap');

:root {
  --pl-gold:        #C9973A;
  --pl-gold-light:  #E8C06A;
  --pl-gold-pale:   #F5E6C4;
  --pl-maroon:      #7A1E2E;
  --pl-maroon-dark: #4A0E1A;
  --pl-cream:       #FAF6EE;
  --pl-warm-white:  #FFFDF8;
  --pl-charcoal:    #2A2118;
  --pl-taupe:       #8A7B6A;
  --pl-sage:        #5C6B4A;
  --pl-border:      rgba(201,151,58,0.2);
  --pl-shadow:      0 8px 40px rgba(42,33,24,0.12);

  --pl-font-display: 'Cormorant Garamond', Georgia, serif;
  --pl-font-body:    'DM Sans', sans-serif;
  --pl-font-punjabi: 'Noto Sans Gurmukhi', sans-serif;
}

/* ── Override Astra base fonts ────────────────────────────── */
body,
.ast-single-post .entry-content,
.entry-content {
  font-family: var(--pl-font-body) !important;
  background-color: var(--pl-warm-white) !important;
  color: var(--pl-charcoal) !important;
}

h1, h2, h3, h4, h5, h6,
.ast-blog-single-element,
.entry-title,
.page-title {
  font-family: var(--pl-font-display) !important;
  font-weight: 300 !important;
  color: var(--pl-maroon-dark) !important;
}

/* ── Override Astra link colours ──────────────────────────── */
a { color: var(--pl-maroon); }
a:hover { color: var(--pl-gold); }

/* ── Astra header override ────────────────────────────────── */
.site-header,
#masthead,
.ast-primary-header-bar {
  background: rgba(255,253,248,0.97) !important;
  border-bottom: 1px solid var(--pl-border) !important;
  backdrop-filter: blur(12px);
}

.main-header-bar .site-title a,
.main-header-bar .site-title a:hover {
  font-family: var(--pl-font-display) !important;
  font-size: 26px !important;
  color: var(--pl-maroon) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

.main-header-menu .menu-item > a,
.main-navigation .menu-item > a {
  font-family: var(--pl-font-body) !important;
  font-size: 12px !important;
  letter-spacing: .07em !important;
  text-transform: uppercase !important;
  color: var(--pl-charcoal) !important;
  font-weight: 500 !important;
}

.main-header-menu .menu-item > a:hover,
.main-navigation .menu-item > a:hover {
  color: var(--pl-maroon) !important;
}

/* ── WooCommerce — Buttons ────────────────────────────────── */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce .cart .button,
.woocommerce .cart input.button {
  background: var(--pl-maroon) !important;
  color: white !important;
  font-family: var(--pl-font-body) !important;
  font-size: 11px !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
  padding: 12px 24px !important;
  transition: background .25s !important;
  border: none !important;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce .cart .button:hover {
  background: var(--pl-gold) !important;
  color: var(--pl-charcoal) !important;
}

.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce #payment #place_order,
.woocommerce-page #payment #place_order {
  background: var(--pl-maroon) !important;
  color: white !important;
  border-radius: 0 !important;
}

/* ── WooCommerce — Product cards ──────────────────────────── */
.woocommerce ul.products li.product {
  background: white !important;
  transition: transform .3s, box-shadow .3s !important;
  border: none !important;
}

.woocommerce ul.products li.product:hover {
  transform: translateY(-4px) !important;
  box-shadow: var(--pl-shadow) !important;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: var(--pl-font-display) !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  color: var(--pl-charcoal) !important;
  padding: 12px 12px 4px !important;
}

.woocommerce ul.products li.product .price {
  font-family: var(--pl-font-display) !important;
  font-size: 20px !important;
  color: var(--pl-maroon) !important;
  padding: 0 12px !important;
}

.woocommerce ul.products li.product .price del {
  color: var(--pl-taupe) !important;
  font-size: 14px !important;
}

.woocommerce span.onsale {
  background: var(--pl-maroon) !important;
  border-radius: 0 !important;
  font-family: var(--pl-font-body) !important;
  font-size: 10px !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  min-height: auto !important;
  line-height: 1 !important;
  padding: 6px 10px !important;
  min-width: auto !important;
}

/* ── WooCommerce — Product single page ───────────────────── */
.woocommerce div.product .product_title {
  font-family: var(--pl-font-display) !important;
  font-size: clamp(28px, 4vw, 44px) !important;
  font-weight: 300 !important;
  color: var(--pl-maroon-dark) !important;
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
  font-family: var(--pl-font-display) !important;
  font-size: 28px !important;
  color: var(--pl-maroon) !important;
}

.woocommerce div.product .woocommerce-product-details__short-description {
  font-size: 14.5px !important;
  line-height: 1.8 !important;
  color: var(--pl-taupe) !important;
}

.woocommerce #review_form #respond .form-submit input {
  background: var(--pl-maroon) !important;
  border-radius: 0 !important;
}

.woocommerce .star-rating span::before,
.woocommerce .star-rating::before {
  color: var(--pl-gold) !important;
}

/* ── WooCommerce — Cart & Checkout ────────────────────────── */
.woocommerce-cart table.cart,
.woocommerce-checkout form.checkout {
  font-family: var(--pl-font-body) !important;
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea {
  border: 1.5px solid var(--pl-border) !important;
  border-radius: 0 !important;
  font-family: var(--pl-font-body) !important;
  padding: 10px 14px !important;
}

.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus {
  border-color: var(--pl-gold) !important;
  outline: none !important;
  box-shadow: none !important;
}

/* ── Announcement bar ─────────────────────────────────────── */
.pl-announcement-bar {
  background: var(--pl-maroon);
  color: #F5E6C4;
  text-align: center;
  padding: 9px 24px;
  font-size: 12.5px;
  letter-spacing: .05em;
  font-family: var(--pl-font-body);
}

.pl-announcement-bar a {
  color: var(--pl-gold-light);
  text-decoration: underline;
}

/* ── Footer ───────────────────────────────────────────────── */
.site-footer,
#colophon {
  background: var(--pl-charcoal) !important;
  color: rgba(255,255,255,.6) !important;
}

.site-footer a,
#colophon a {
  color: rgba(255,255,255,.55) !important;
}

.site-footer a:hover,
#colophon a:hover {
  color: var(--pl-gold) !important;
}

.ast-footer-copyright {
  color: rgba(255,255,255,.35) !important;
  font-size: 12px !important;
}

/* ── WhatsApp float button ────────────────────────────────── */
.pl-whatsapp-float {
  position: fixed;
  bottom: 28px; right: 28px;
  z-index: 9999;
  background: #25D366;
  color: white !important;
  width: 54px; height: 54px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 26px;
  box-shadow: 0 4px 20px rgba(37,211,102,.45);
  text-decoration: none !important;
  transition: transform .3s;
}

.pl-whatsapp-float:hover {
  transform: scale(1.1);
  color: white !important;
}

/* ── Utility ──────────────────────────────────────────────── */
.pl-tag {
  font-size: 11px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--pl-gold);
  font-weight: 500;
  font-family: var(--pl-font-body);
  display: block;
  margin-bottom: 8px;
}

.pl-divider {
  width: 48px; height: 2px;
  background: var(--pl-gold);
  margin: 12px 0 20px;
}

.pl-divider.center { margin: 12px auto 20px; }