/*
Theme Name: Fairy's Fair Child
Theme URI: https://fairysfair.com
Description: Child theme of Astra for Fairy's Fair — pink/pastel fairy branding.
Author: Fairy's Fair
Template: astra
Version: 0.1.0
Text Domain: fairysfair-child
*/

/* ---- Brand tokens (rev.5: 4 O'clock-inspired wine/editorial re-theme) ---- */
:root{
  --ff-magenta:#8E1E4E;       /* primary wine */
  --ff-magenta-deep:#6B1339;  /* hover / announcement bar / footer band */
  --ff-pink:#F3D9E3;          /* pale blush — circle bg, chips */
  --ff-cream:#FBF7F4;         /* page bg */
  --ff-white:#FFFFFF;
  --ff-ink:#1A1216;           /* near-black warm — text, prices */
  --ff-muted:#7E6A73;
  --ff-success:#2E8B57;
  --ff-warning:#E8A93B;
  --ff-line:#EADDE3;
  --ff-radius:16px;
  --ff-radius-sm:10px;
  --ff-shadow:0 6px 20px rgba(107,19,57,.08);
  --ff-font-display:"Cormorant Garamond","Noto Serif Bengali",Georgia,"Hind Siliguri",serif;
  --ff-font-body:"Poppins","Hind Siliguri",Arial,sans-serif;
}

/* Store-wide delivery announcement bar (TASK-56) */
.ff-announcement-bar{
  background:var(--ff-magenta-deep);
  color:var(--ff-white);
  text-align:center;
  font-family:var(--ff-font-body);
  font-size:0.85rem;
  letter-spacing:.01em;
  padding:6px 12px;
}

body{ background:var(--ff-cream); color:var(--ff-ink); }
body,button,input,select,textarea{ font-family:var(--ff-font-body); }
h1,h2,h3,.site-title,.entry-title,.ast-site-title-wrap .site-title{
  font-family:var(--ff-font-display); font-weight:600; letter-spacing:.005em;
}

/* Price + primary actions */
.woocommerce-Price-amount{ color:var(--ff-ink); font-weight:700; }
.button,.wp-block-button__link,
.woocommerce a.button,.woocommerce button.button.alt,
.woocommerce #respond input#submit{
  background:var(--ff-magenta); color:#fff; border:0;
  border-radius:var(--ff-radius); box-shadow:var(--ff-shadow);
}
.button:hover,.woocommerce a.button:hover,.woocommerce button.button.alt:hover{
  background:#b82a5b; color:#fff;
}

/* Cards */
.woocommerce ul.products li.product{
  background:var(--ff-white); border-radius:var(--ff-radius);
  box-shadow:var(--ff-shadow); padding:12px; transition:transform .15s ease;
}
.woocommerce ul.products li.product:hover{ transform:translateY(-2px); }
.woocommerce ul.products li.product img{ border-radius:var(--ff-radius-sm); }

/* Inputs */
input,select,textarea{ border-radius:var(--ff-radius-sm)!important; }
input:focus,select:focus,textarea:focus{
  outline:none; box-shadow:0 0 0 3px rgba(214,51,108,.20);
}

/* TASK-53: product titles use Quicksand (per design doc). This CSS is what
   actually triggers the browser to load the Quicksand face enqueued in Assets.php. */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.wc-block-grid__product-title,
.wp-block-post-title,
.woocommerce div.product .product_title{
  font-family: "Quicksand", var(--ff-font-body) !important;
}

/* ---- Home page (rev.5 4 O'clock editorial re-theme, front-page.php) ---- */
.ff-home section{ max-width:1180px; margin:0 auto; padding:2.5rem 1rem; }
.ff-home h2{ text-align:center; font-size:clamp(1.5rem,3vw,2.2rem); margin:0 0 1.5rem; }

/* Editorial hero — image + overlay + serif headline (image via option, else wine) */
.ff-home-hero{
  position:relative; text-align:center; color:#fff;
  min-height:clamp(360px,55vh,560px);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.75rem;
  padding:clamp(2rem,5vw,4rem) 1rem; border-radius:var(--ff-radius); overflow:hidden;
  background:var(--ff-magenta-deep);
}
.ff-home-hero.has-image{ background-size:cover; background-position:center; }
.ff-home-hero::after{ content:""; position:absolute; inset:0; z-index:0;
  background:linear-gradient(180deg,rgba(26,18,22,.25),rgba(26,18,22,.55)); }
.ff-home-hero > *{ position:relative; z-index:1; }
.ff-home-brand{ font-family:var(--ff-font-display); font-size:clamp(2.2rem,5vw,3.6rem); margin:0; color:#fff; }
.ff-home-tagline{ font-size:1.15rem; opacity:.95; margin:0; }
.ff-home-promise{ font-weight:600; background:rgba(255,255,255,.15); border-radius:999px; padding:.4rem 1rem; margin:0; }
.ff-home-cta,.ff-fb-cta{
  display:inline-block; background:var(--ff-magenta); color:#fff!important;
  padding:.8rem 2rem; border-radius:999px; font-weight:600;
  text-decoration:none; box-shadow:var(--ff-shadow); margin-top:.5rem;
}
.ff-home-cta:hover,.ff-fb-cta:hover{ background:var(--ff-magenta-deep); }

/* Circular category row (Pinteresty), from [product_categories] — CSS only */
.ff-home-categories ul.products{
  list-style:none; display:flex; flex-wrap:nowrap; gap:20px; overflow-x:auto;
  justify-content:safe center; padding:8px 4px 16px; margin:0; scrollbar-width:none;
}
.ff-home-categories ul.products::-webkit-scrollbar{ display:none; }
.ff-home-categories li.product-category{
  width:auto!important; flex:0 0 96px; text-align:center;
  background:none!important; box-shadow:none!important; padding:0!important; margin:0!important;
}
.ff-home-categories li.product-category a{ text-decoration:none; color:var(--ff-ink); }
.ff-home-categories li.product-category img{
  width:88px; height:88px; aspect-ratio:1; object-fit:cover; border-radius:50%;
  background:var(--ff-pink); border:1px solid var(--ff-line); margin:0 auto;
  transition:transform .2s,border-color .2s;
}
.ff-home-categories li.product-category:hover img{ transform:scale(1.05); border-color:var(--ff-magenta); }
.ff-home-categories .woocommerce-loop-category__title{ font-size:.8rem; font-weight:600; margin-top:.5rem; }
.ff-home-categories mark.count,
.ff-home-categories .count{ display:none !important; }

/* Product grid — flat, airy */
.ff-home-products ul.products{
  list-style:none; display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr));
  gap:28px 18px; margin:0; padding:0;
}
.ff-home-products ul.products li.product{
  width:auto!important; margin:0!important; background:none;
  box-shadow:none!important; padding:0!important;
}
.ff-home-products ul.products li.product img{ border-radius:var(--ff-radius-sm); aspect-ratio:1; object-fit:cover; }
.ff-home-products li.product .woocommerce-loop-product__title{ text-align:left; padding-top:.5rem; }

/* Trust band + wine footer CTA band */
.ff-home-trust{ text-align:center; background:var(--ff-pink); border-radius:var(--ff-radius); }
.ff-home-delivery{ font-weight:600; }
.ff-home-badges,.ff-fb-badges{ list-style:none; display:flex; gap:1.5rem; justify-content:center; flex-wrap:wrap; padding:0; }
.ff-home-footer-cta{ text-align:center; background:var(--ff-magenta-deep); color:#fff; border-radius:var(--ff-radius); }
.ff-home-footer-cta .ff-home-cta{ background:#fff; color:var(--ff-magenta)!important; }
.ff-home-footer-cta .ff-home-cta:hover{ background:var(--ff-pink); }

/* ---- FB landing (TASK-68, template-fb-landing.php) ---- */
/* Distraction-free: hide Astra header/nav, footer ("Powered by Astra"), announcement. */
.ff-fb-page .site-header,
.ff-fb-page #masthead,
.ff-fb-page .ast-above-header-wrap,
.ff-fb-page .site-footer,
.ff-fb-page #colophon,
.ff-fb-page .ff-announcement-bar{ display:none !important; }
.ff-fb-page .site-content,
.ff-fb-page #content{ padding-top:0 !important; margin-top:0 !important; }

.ff-fb-landing{ max-width:560px; margin:0 auto; padding:0 1rem 3rem; }
.ff-fb-brand{
  text-align:center; font-family:"Baloo 2","Hind Siliguri",sans-serif;
  font-weight:700; font-size:1.35rem; color:var(--ff-magenta);
  padding:1rem 0 .5rem; letter-spacing:.01em;
}
.ff-fb-hero{ display:block; }
.ff-fb-media{ margin:0 0 1rem; }
.ff-fb-media img{ width:100%; height:auto; border-radius:var(--ff-radius); box-shadow:var(--ff-shadow); display:block; }
.ff-fb-title{ margin:0 0 .35rem; font-size:1.6rem; line-height:1.25; text-align:center; }
.ff-fb-price{ font-size:2rem; color:var(--ff-magenta); font-weight:800; text-align:center; margin:0 0 .6rem; }
.ff-fb-urgency{
  text-align:center; background:#fff3e0; color:#b45309; font-weight:600;
  border-radius:999px; padding:.5rem 1rem; margin:0 auto 1rem; display:block; font-size:.95rem;
}
.ff-fb-desc{ color:var(--ff-ink); margin:0 0 1rem; }

/* Same-page COD order form (Bangla, non-savvy-friendly: big fields, one button) */
.ff-fb-form{
  background:var(--ff-white); border-radius:var(--ff-radius);
  box-shadow:var(--ff-shadow); padding:1.4rem; margin-top:.5rem;
  border:2px solid var(--ff-pink);
}
.ff-fb-form-title{ margin:0 0 1rem; font-size:1.25rem; text-align:center; }
.ff-fb-form label{ display:block; font-weight:600; margin-bottom:.2rem; font-size:1rem; }
.ff-fb-form input[type=text],.ff-fb-form input[type=tel],.ff-fb-form textarea{
  width:100%; font-size:1.1rem; padding:.85rem .9rem; margin:.2rem 0 .9rem;
  border:1.5px solid var(--ff-line); border-radius:var(--ff-radius-sm); box-sizing:border-box;
  background:var(--ff-cream);
}
.ff-fb-form input:focus,.ff-fb-form textarea:focus{ border-color:var(--ff-magenta); background:#fff; }
.ff-fb-area{ border:1.5px solid var(--ff-line); border-radius:var(--ff-radius-sm); padding:.7rem .9rem; margin:.25rem 0 1.1rem; }
.ff-fb-area legend{ font-weight:600; padding:0 .3rem; }
.ff-fb-radio{
  display:flex; align-items:center; gap:.6rem; font-weight:500!important;
  padding:.6rem .7rem; margin:.3rem 0; cursor:pointer; border:1.5px solid var(--ff-line);
  border-radius:var(--ff-radius-sm); font-size:1.05rem;
}
.ff-fb-radio:has(input:checked){ border-color:var(--ff-magenta); background:#fff5f9; }
.ff-fb-radio input{ width:1.2rem; height:1.2rem; accent-color:var(--ff-magenta); }
.ff-fb-radio span{ color:var(--ff-muted); font-size:.9rem; margin-left:auto; }
.ff-fb-form .ff-fb-cta{
  width:100%; text-align:center; border:0; cursor:pointer; font-size:1.25rem; font-weight:700;
  padding:1rem; border-radius:var(--ff-radius); color:#fff;
  background:linear-gradient(180deg,#e84a86,var(--ff-magenta));
  box-shadow:0 6px 16px rgba(214,51,108,.35); transition:transform .1s ease;
}
.ff-fb-form .ff-fb-cta:hover{ transform:translateY(-1px); }
.ff-fb-form .ff-fb-cta:active{ transform:translateY(1px); }
.ff-fb-err{ display:block; color:var(--ff-magenta); font-size:.9rem; margin:-.6rem 0 .7rem; font-weight:600; }
.ff-fb-err-form{ background:#fdeaf1; padding:.7rem .9rem; border-radius:var(--ff-radius-sm); margin-bottom:1rem; text-align:center; }
.ff-fb-cod-note{ text-align:center; color:var(--ff-success); font-weight:600; font-size:.95rem; margin:.7rem 0 0; }
.ff-fb-badges{ list-style:none; display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; padding:0; margin:1.5rem 0 0; color:var(--ff-muted); font-size:.9rem; }
.ff-fb-sold-out{ color:var(--ff-warning); font-weight:600; text-align:center; }