/*
Theme Name:   Atelje Radanov (Astra Child)
Theme URI:    https://radanov.rs
Description:  Child theme for Astra — variant 6 "List-prodavnica" design system, ported from mockups/p6-style.css.
Author:       Atelje Radanov
Template:     astra
Version:      0.1.4
Text Domain:  radanov-child
*/

/* ==========================================================================
   Self-hosted fonts — Vollkorn (variable, wght 400–900) + PT Sans (400/700)
   OFL-licensed; subsets cover Latin, Latin Extended-A, Cyrillic, Cyrillic
   Extended — verified against Serbian diacritics (č ć š đ ž) and Serbian
   Cyrillic (Ђ Ћ Ж Ш) before shipping. Licenses: fonts/OFL-LICENSES.txt.
   No Google Fonts CDN.
   ========================================================================== */

@font-face{
  font-family:'Vollkorn';
  src:url('fonts/vollkorn-roman.woff2') format('woff2-variations'), url('fonts/vollkorn-roman.woff2') format('woff2');
  font-weight:400 900;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:'Vollkorn';
  src:url('fonts/vollkorn-italic.woff2') format('woff2-variations'), url('fonts/vollkorn-italic.woff2') format('woff2');
  font-weight:400 900;
  font-style:italic;
  font-display:swap;
}
@font-face{
  font-family:'PT Sans';
  src:url('fonts/ptsans-regular.woff2') format('woff2');
  font-weight:400;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:'PT Sans';
  src:url('fonts/ptsans-bold.woff2') format('woff2');
  font-weight:700;
  font-style:normal;
  font-display:swap;
}

/* ==========================================================================
   Design tokens — verbatim from mockups/p6-style.css
   ========================================================================== */

:root{
  --paper:#F4EFE2; --ink:#2E2A26; --sage:#6E7A5A; --accent:#A9553B;
  --rule:#2E2A26; --hairline:#D8CDB9; --card:#FAF6EA;
}

/* ==========================================================================
   Base — apply the palette/type system to the live site
   ⚠ Astra selectors below (.ast-container, #masthead, .site-header) are
   Astra's documented structural classes. Verify against the live DOM in
   Stage 1 before assuming a rule takes effect — theme versions drift.
   ========================================================================== */

body{
  background:var(--paper);
  color:var(--ink);
  font-family:'PT Sans',sans-serif;
  font-size:15px;
  line-height:1.6;
}
a{color:var(--ink);text-decoration:none}

h1,h2,h3,h4,h5,h6,
.entry-title,
.site-title{
  font-family:'Vollkorn',serif;
  font-weight:500;
  color:var(--ink);
}

/* content width toward the mockup's 820px sheet */
.ast-container{max-width:900px}
.sheet,.entry-content > .wp-block-group{max-width:820px;margin:0 auto}

/* sticky one-line header — CSS only, no Astra Pro toggle assumed */
#masthead.site-header{
  position:sticky;
  top:0;
  background:rgba(244,239,226,.96);
  -webkit-backdrop-filter:blur(4px);
  backdrop-filter:blur(4px);
  border-bottom:1px solid var(--rule);
  z-index:10;
}
#masthead .site-title,
#masthead .ast-site-identity{
  font-family:'Vollkorn',serif;
  font-size:19px;
  font-weight:500;
}

/* ==========================================================================
   Component classes — ported from mockups/p6-style.css, unchanged.
   Applied by hand via the Gutenberg block "Additional CSS class(es)" field
   per site-design-plan.md Stage 3–5. Kept 1:1 with the mockup on purpose:
   these are the class names the confirmed design was built and approved in.
   ========================================================================== */

.wf-bar{background:var(--ink);color:var(--paper);font-size:12px;padding:8px 16px;display:flex;justify-content:space-between}
.wf-bar a{color:var(--paper);opacity:.8}

.sticky{position:sticky;top:0;background:rgba(244,239,226,.96);backdrop-filter:blur(4px);border-bottom:1px solid var(--rule);z-index:10}
.sticky-in{max-width:820px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;padding:10px 18px}
.sticky .wm{font-family:'Vollkorn',serif;font-size:19px;font-weight:500}
.sticky nav{display:none;gap:20px;font-size:13.5px}
.cart{font-size:13.5px;font-weight:700}

.sheet{max-width:820px;margin:0 auto;padding:0 18px}

.masthead{text-align:center;padding:26px 0 14px;border-bottom:3px double var(--rule)}
.wordmark{font-family:'Vollkorn',serif;font-size:36px;font-weight:500}
.descriptor{font-family:'Vollkorn',serif;font-style:italic;font-size:13.5px;margin-top:2px}
.issue{display:flex;justify-content:space-between;font-size:12px;padding:8px 0;border-bottom:1px solid var(--rule)}

.pagehead{padding:24px 0 14px;border-bottom:1px solid var(--rule)}
.pagehead .crumb{font-size:12px;color:var(--sage);margin-bottom:4px}
.pagehead h1{font-family:'Vollkorn',serif;font-weight:500;font-size:26px;line-height:1.25}
.pagehead .pagesub{font-size:13.5px;color:#59524a;margin-top:4px;max-width:56ch}

.ph{position:relative;display:flex;align-items:center;justify-content:center;background:linear-gradient(150deg,#DCD2BC,#C2BCA0 55%,#A3A98A)}
.ph .cap{position:absolute;bottom:8px;left:10px;font-size:10.5px;color:rgba(46,42,38,.55)}
.ph svg{opacity:.5}

.lead{padding:22px 0 4px}
.lead .ph{aspect-ratio:16/10}
.lead h1{font-family:'Vollkorn',serif;font-weight:500;font-size:25px;line-height:1.3;margin:16px 0 4px}
.lead p{font-size:14.5px;max-width:56ch}
.lead .cta{margin:14px 0 22px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}

.price{font-family:'Vollkorn',serif;font-size:16px}
.btn{display:inline-block;background:var(--accent);color:#FBF4E8;border-radius:6px;padding:10px 20px;font-size:14px;font-weight:700;border:none;cursor:pointer;font-family:'PT Sans',sans-serif}
.btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--hairline);font-weight:400}
.btn.big{width:100%;text-align:center;padding:13px 20px;font-size:15px}

.delivery{text-align:center;font-family:'Vollkorn',serif;font-style:italic;font-size:15px;padding:12px 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}

.chips{display:flex;flex-wrap:wrap;gap:8px;padding:16px 0 0}
.chip{border:1px solid var(--hairline);border-radius:18px;padding:6px 15px;font-size:13px;background:var(--card);cursor:pointer}
.chip.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.sorrow{font-size:12.5px;color:#7c7465;padding:8px 0 0}
.sorrow a{color:#7c7465;border-bottom:1px solid var(--hairline)}

h2.rubrika{font-family:'Vollkorn',serif;font-weight:500;font-size:15px;text-align:center;margin:30px 0 4px;position:relative}
h2.rubrika span{background:var(--paper);padding:0 14px;position:relative}
h2.rubrika::before{content:"";position:absolute;left:0;right:0;top:50%;border-top:1px solid var(--hairline)}
.rubrika-sub{text-align:center;font-size:12.5px;color:var(--sage);margin-bottom:16px}

.ledger{list-style:none}
.entry{display:grid;grid-template-columns:68px 1fr auto;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--hairline)}
.entry .thumb{width:68px;height:86px;background:linear-gradient(160deg,#DED4C0,#C4BCA2)}
.entry .num{font-family:'Vollkorn',serif;font-size:11.5px;color:var(--sage)}
.entry .name{font-family:'Vollkorn',serif;font-size:17.5px}
.entry .desc{font-size:13px;color:#59524a;margin-top:1px;max-width:46ch}
.entry .right{text-align:right;white-space:nowrap}
.entry .right .price{display:block;margin-bottom:6px}
.entry .right .btn{padding:7px 16px;font-size:13px}

.tiers{margin:4px 0 8px}
.tier{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid var(--hairline)}
.tier .name{font-family:'Vollkorn',serif;font-size:17px}
.tier .desc{font-size:13px;color:#59524a}
.tier .right{text-align:right;white-space:nowrap}
.tier .right .price{display:block;margin-bottom:6px}

.atelier{padding:36px 0;text-align:center;max-width:520px;margin:0 auto}
.atelier p{font-family:'Vollkorn',serif;font-size:16.5px;line-height:1.7}
.atelier a{display:inline-block;margin-top:12px;font-size:13px;border-bottom:1px solid var(--hairline)}

.payline{padding:14px 0;border-top:1px solid var(--hairline);font-size:12.5px;color:#59524a;text-align:center}

footer{border-top:3px double var(--rule);padding:24px 0 48px;font-size:13px;color:#59524a;text-align:center}
footer .fm{font-family:'Vollkorn',serif;font-size:17px;color:var(--ink);margin-bottom:6px}
.quiet{margin-top:16px;font-family:'Vollkorn',serif;font-style:italic;font-size:12.5px}
.legal{margin-top:14px;font-size:11.5px;display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* subpage building blocks */
.split{display:grid;gap:24px;padding:22px 0 8px}

.prose{max-width:58ch;padding:6px 0 10px}
.prose p{margin:0 0 14px;font-size:14.5px}
.prose .lede{font-family:'Vollkorn',serif;font-style:italic;font-size:17px;line-height:1.6}
.prose .sig{font-family:'Vollkorn',serif;font-style:italic;color:var(--sage)}

.form{display:grid;gap:16px;padding:6px 0 10px}
.field{display:flex;flex-direction:column;gap:5px}
.field label{font-size:12.5px;color:var(--sage)}
.field input,.field select,.field textarea{
  background:var(--card);border:1px solid var(--hairline);border-radius:6px;
  padding:11px 12px;font-family:'PT Sans',sans-serif;font-size:14.5px;color:var(--ink);width:100%;
}
.field textarea{min-height:84px;resize:vertical}
.field .hint{font-size:12px;color:#7c7465}
.form-note{background:var(--card);border:1px solid var(--hairline);border-radius:8px;padding:13px 15px;font-size:13px;color:#59524a}

.pills{display:flex;flex-wrap:wrap;gap:8px}
.pill input{position:absolute;opacity:0;pointer-events:none}
.pill span{display:inline-block;border:1px solid var(--hairline);border-radius:18px;padding:7px 15px;font-size:13.5px;background:var(--card);cursor:pointer}
.pill input:checked + span{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.pill small{display:block;font-size:11px;color:inherit;opacity:.75}

.cartline{display:grid;grid-template-columns:68px 1fr auto;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--hairline)}
.cartline .thumb{width:68px;height:86px;background:linear-gradient(160deg,#DED4C0,#C4BCA2)}
.cartline .name{font-family:'Vollkorn',serif;font-size:16.5px}
.cartline .meta{font-size:12.5px;color:#59524a}
.cartline .remove{font-size:12px;color:#7c7465;border-bottom:1px solid var(--hairline)}
.totals{padding:12px 0;border-bottom:3px double var(--rule)}
.totals .row{display:flex;justify-content:space-between;padding:4px 0;font-size:14px}
.totals .row.total .price{font-size:18px}
.totals .row .muted-val{color:#7c7465;font-size:13px}

.infoblock{padding:16px 0;border-bottom:1px solid var(--hairline);font-size:14.5px}
.infoblock .k{font-size:12.5px;color:var(--sage)}
.map{aspect-ratio:16/9;background:linear-gradient(150deg,#E2DBC8,#CCC7AE);position:relative;display:flex;align-items:center;justify-content:center;font-size:12px;color:#7c7465;margin:16px 0}

/* muted register — saučešće (ToV § 6.5): accent withdrawn, everything quieter */
body.muted .btn{background:var(--ink)}
body.muted .ph{background:linear-gradient(150deg,#E0DCD0,#CBC7B8)}

/* Stage 5 — the front page carries its own in-page footer (contact block,
   discreet-clients line, legal links) built in Stage 3. Once the site-wide
   Astra footer also got the Kontakt/Saučešće/Venčanja links (Stage 5 step 7),
   the front page ended up showing both, stacked. Hide the site-wide footer
   only on the front page — every other page still needs it. */
body.home .site-footer{display:none}

/* ==========================================================================
   WooCommerce — strip the default purple, align buttons to the token system.
   Selectors below are WooCommerce's standard, documented markup classes.
   ========================================================================== */

.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce #respond input#submit.alt{
  background:var(--accent);
  color:#FBF4E8;
  border-radius:6px;
  font-family:'PT Sans',sans-serif;
  font-weight:700;
  border:none;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover{
  background:var(--ink);
  color:var(--paper);
}
.woocommerce span.onsale{display:none} /* manifesto: no sale badges */
.woocommerce ul.products li.product .price ins,
.woocommerce ul.products li.product .price del{font-family:'Vollkorn',serif}

@media(min-width:700px){
  .sticky nav{display:flex}
  .lead{display:grid;grid-template-columns:1.3fr 1fr;gap:30px;align-items:center}
  .lead .ph{aspect-ratio:4/5}
  .entry{grid-template-columns:88px 1fr auto}
  .entry .thumb{width:88px;height:110px}
  .split{grid-template-columns:1.1fr 1fr;gap:36px}
  .form.cols{grid-template-columns:1fr 1fr}
  .form.cols .wide{grid-column:1/-1}
}

/* ==========================================================================
   Stage 4 — Woo templates: single product, cart, checkout, order-received.
   Real template files aren't overridden here (checkout correctness matters
   too much to risk it) — this reskins WooCommerce's actual default markup
   with the token palette/type system, and removes purple/clutter via CSS.
   Structural removals (related products, upsells, meta, cross-sells, tabs)
   are done via standard hook removals in functions.php.
   ========================================================================== */

/* Kill Woo's default purple everywhere, incl. any surviving block remnants */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce-page a.button,
.woocommerce-page button.button,
.woocommerce-page input.button,
.wc-block-components-button{
  background:var(--accent);color:var(--paper);border:none;border-radius:3px;
  font-family:'PT Sans',sans-serif;box-shadow:none;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover{background:var(--ink);color:var(--paper)}

/* Single product — buy block first, calm, editorial text below */
.single-product div.product .summary{padding-top:6px}
.single-product div.product p.price,
.single-product div.product .woocommerce-variation-price{
  font-family:'Vollkorn',serif;font-size:24px;color:var(--ink);margin:10px 0 2px;
}
.single-product div.product .price ins{text-decoration:none}
.single-product div.product .woocommerce-product-details__short-description{
  font-size:14.5px;max-width:48ch;margin-bottom:16px;color:var(--ink);
}
.single-product div.product table.variations{width:auto;margin-bottom:10px}
.single-product div.product table.variations td{padding:4px 0}
.single-product div.product table.variations label{
  font-size:12.5px;color:var(--sage);text-transform:none;font-weight:normal;
}
.single-product div.product table.variations select{
  font-family:'PT Sans',sans-serif;border:1px solid var(--hairline);border-radius:18px;
  padding:7px 15px;font-size:13.5px;background:var(--card);color:var(--ink);
}
/* Native <select> stands in for the mockup's pill buttons — a variation-
   swatches plugin would be needed for true pill/radio controls; flagged as
   a scoped simplification rather than left unstyled. */
.single-product div.product .single_variation_wrap{margin-top:6px}
.single-product div.product .woocommerce-variation-add-to-cart,
.single-product div.product .cart{margin-top:14px}
.single-product div.product .single_add_to_cart_button,
.single-product div.product button.single_add_to_cart_button{
  padding:12px 22px;font-size:14px;cursor:pointer;
}
.single-product div.product .quantity .qty{
  border:1px solid var(--hairline);border-radius:3px;background:var(--card);
  font-family:'PT Sans',sans-serif;padding:10px;
}
/* Product meta (SKU/category row) — hidden here as a safety net regardless
   of whether the functions.php hook removal fires before Astra's own Woo
   template layer renders it. */
.single-product div.product .product_meta{display:none}

/* Editorial flower text, printed inline below the buy block instead of a
   clickable tab — see radanov_child_inline_description() in functions.php.
   Astra's product gallery is float-based (not flex/grid) — without
   clear:both this wraps up alongside the floated image instead of sitting
   on its own full-width row below it. */
.single-product div.product .prose{
  clear:both;width:100%;margin-top:30px;padding-top:22px;border-top:1px solid var(--hairline);
}
.single-product div.product .prose h3{
  font-family:'Vollkorn',serif;font-weight:500;font-size:15px;text-align:center;margin:0 0 14px;
}

/* Cart — classic shortcode template ([woocommerce_cart], not the block) */
.woocommerce-cart table.shop_table{border:none;font-size:14px;width:100%}
.woocommerce-cart table.shop_table thead{display:none}
.woocommerce-cart table.shop_table td{border:none;border-bottom:1px solid var(--hairline);padding:14px 8px}
.woocommerce-cart table.shop_table tr:last-child td{border-bottom:none}
.woocommerce-cart table.shop_table td.product-thumbnail img{width:68px;height:86px;object-fit:cover}
.woocommerce-cart table.shop_table td.product-remove a{color:#7c7465;font-size:12px;border:none}
.woocommerce-cart table.shop_table td.product-name a{font-family:'Vollkorn',serif;font-size:16.5px;color:var(--ink)}
.woocommerce-cart table.shop_table td.product-price,
.woocommerce-cart table.shop_table td.product-subtotal{font-family:'Vollkorn',serif}
.woocommerce-cart .cart-collaterals .cart_totals{border-top:3px double var(--rule);padding-top:12px;max-width:100%;float:none}
.woocommerce-cart .cart_totals table{border:none}
.woocommerce-cart .cart_totals table td,
.woocommerce-cart .cart_totals table th{border:none;padding:6px 0;font-size:14px}
.woocommerce-cart .cart_totals .order-total .woocommerce-Price-amount{font-size:18px}
.woocommerce-cart .wc-proceed-to-checkout .checkout-button{
  display:block;width:100%;text-align:center;padding:14px 20px;font-size:15px;
}

/* Checkout — classic shortcode template ([woocommerce_checkout]) */
.woocommerce-checkout .woocommerce-billing-fields h3,
.woocommerce-checkout .woocommerce-shipping-fields h3,
.woocommerce-checkout #order_review_heading{
  font-family:'Vollkorn',serif;font-weight:500;font-size:15px;text-align:center;margin:30px 0 14px;
}
.woocommerce-checkout .form-row label{font-size:12.5px;color:var(--sage)}
.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row select,
.woocommerce-checkout .form-row textarea{
  font-family:'PT Sans',sans-serif;border:1px solid var(--hairline);border-radius:6px;
  padding:10px 12px;background:var(--card);color:var(--ink);width:100%;
}
.woocommerce-checkout table.shop_table{border:none}
.woocommerce-checkout table.shop_table td,
.woocommerce-checkout table.shop_table th{border:none;border-bottom:1px solid var(--hairline)}
.woocommerce-checkout #place_order{width:100%;padding:14px 20px;font-size:15px}
.woocommerce-checkout #payment{background:var(--card);border:1px solid var(--hairline);border-radius:8px;padding:4px 15px}
.woocommerce-checkout #payment ul.payment_methods{border:none}

/* Order received / confirmation */
.woocommerce-order-received .woocommerce-thankyou-order-received{
  font-family:'Vollkorn',serif;font-style:italic;font-size:17px;line-height:1.6;color:var(--ink);
}
.woocommerce-order-received ul.woocommerce-order-overview{
  list-style:none;display:flex;flex-wrap:wrap;gap:18px;padding:14px 0;margin:14px 0;
  border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);
}
.woocommerce-order-received ul.woocommerce-order-overview li{font-size:13px;color:#59524a}
.woocommerce-order-received ul.woocommerce-order-overview li strong{
  display:block;font-family:'Vollkorn',serif;font-size:15px;color:var(--ink);
}
.woocommerce-order-received table.shop_table{border:none;margin:14px 0}
.woocommerce-order-received table.shop_table td,
.woocommerce-order-received table.shop_table th{border:none;border-bottom:1px solid var(--hairline)}
.woocommerce-order-received .prose{margin-top:18px}
