/* Liyomera — base tokens, layout, header & footer
   Accent palette (--o-*) and surfaces are injected inline from the Customizer. */

:root {
  --ink:#2A211B; --body:#6B5C52; --muted:#9C8E84;
  --line:#EFE6DE; --line-2:#E5DACF;
  --sage:#6E9A7C; --sage-bg:#EBF2EC; --sale:#E2542F;

  /* fallbacks if inline css is missing */
  --o-50:#FFF6EF; --o-100:#FEEAD9; --o-200:#FBD4B4; --o-400:#F9A86B;
  --o:#F58A4B; --o-600:#E2742F; --o-700:#BE5C20;
  --bg:#FFFFFF; --surface:#FFF6EF; --card:#FFFFFF;

  --r-sm:10px; --r:16px; --r-lg:22px; --r-xl:30px;
  --arch:999px 999px 18px 18px;
  --shadow-sm:0 1px 2px rgba(42,33,27,.04), 0 4px 14px rgba(42,33,27,.05);
  --shadow:0 6px 24px rgba(196,120,60,.10), 0 2px 6px rgba(42,33,27,.05);
  --shadow-lg:0 18px 50px rgba(196,120,60,.16);
  --maxw:1240px;
  --font:'Vazirmatn','IRANYekan',system-ui,sans-serif;
}

*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  background:var(--bg); color:var(--body);
  font-family:var(--font); direction:rtl; line-height:1.8;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
h1,h2,h3,h4{ color:var(--ink); font-weight:800; margin:0 0 .4em; line-height:1.35; letter-spacing:-.01em; }
p{ margin:0 0 1em; }
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; height:auto; display:block; }
ul{ margin:0; padding:0; list-style:none; }
button{ font-family:inherit; cursor:pointer; border:none; background:none; }

.wrap{ width:100%; max-width:var(--maxw); margin:0 auto; padding:0 28px; }
.fa-num{ font-feature-settings:"ss01"; font-variant-numeric:tabular-nums; }
.screen-reader-text{ position:absolute !important; clip:rect(1px,1px,1px,1px); width:1px; height:1px; overflow:hidden; }
.skip-link{ position:absolute; right:-9999px; top:0; background:var(--o); color:#fff; padding:10px 18px; border-radius:0 0 10px 0; z-index:9999; }
.skip-link:focus{ right:0; }

/* buttons */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:9px; font-weight:700; font-size:15px; line-height:1; padding:14px 26px; border-radius:var(--r-sm); transition:transform .15s, box-shadow .2s, background .2s; }
.btn-primary{ background:var(--o); color:#fff; box-shadow:0 8px 20px rgba(245,138,75,.32); }
.btn-primary:hover{ background:var(--o-600); transform:translateY(-2px); }
.btn-ghost{ background:#fff; color:var(--ink); border:1.5px solid var(--line-2); }
.btn-ghost:hover{ border-color:var(--o-200); color:var(--o-700); }

/* section heading */
.section{ padding:60px 0; }
.section.peach{ background:var(--surface); }
.sec-head{ display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:26px; }
.sec-title{ font-size:clamp(20px,2.4vw,30px); font-weight:800; margin:0; }
.sec-title .accent{ color:var(--o); }
.sec-link{ display:inline-flex; align-items:center; gap:7px; flex:none; white-space:nowrap; color:var(--o-600); font-size:14px; font-weight:600; padding:9px 16px; border-radius:999px; border:1.5px solid var(--o-100); background:var(--o-50); transition:.18s; }
.sec-link:hover{ background:var(--o-100); border-color:var(--o-200); }

/* image placeholder (used when a featured image is missing) */
.ph{ position:relative; overflow:hidden; background:repeating-linear-gradient(135deg,var(--o-50) 0 11px,var(--o-100) 11px 22px); display:grid; place-items:center; }
.ph::after{ content:attr(data-label); font-size:12px; font-weight:600; color:var(--o-700); background:rgba(255,255,255,.78); padding:5px 12px; border-radius:999px; }

.li-ico{ flex:none; }

/* ============ HEADER ============ */
.site-header{ position:sticky; top:0; z-index:50; background:rgba(255,255,255,.88); backdrop-filter:blur(14px); border-bottom:1px solid var(--line); }
.topbar{ background:var(--o); color:#fff; font-size:13px; text-align:center; padding:8px 16px; font-weight:500; }
.topbar a{ color:#fff; font-weight:700; }
.header-main{ display:flex; align-items:center; gap:22px; height:76px; }
.site-branding{ display:flex; align-items:center; gap:10px; }
.logo-mark{ width:38px; height:38px; border-radius:12px; background:linear-gradient(140deg,var(--o-400),var(--o-600)); display:grid; place-items:center; color:#fff; font-weight:800; font-size:20px; box-shadow:0 6px 16px rgba(245,138,75,.4); flex:none; }
.custom-logo{ max-height:48px; width:auto; }
.logo-tx{ line-height:1.1; }
.logo-tx b{ font-size:20px; color:var(--ink); display:block; }
.logo-tx span{ font-size:10px; color:var(--muted); letter-spacing:.28em; font-weight:600; }
.main-nav ul{ display:flex; align-items:center; gap:4px; }
.main-nav a{ padding:9px 14px; border-radius:10px; font-size:15px; font-weight:600; color:var(--body); transition:.16s; display:block; }
.main-nav a:hover, .main-nav .current-menu-item > a{ color:var(--o-700); background:var(--o-50); }
.header-search{ flex:1; max-width:300px; display:flex; align-items:center; gap:9px; background:var(--surface); border:1.5px solid transparent; border-radius:12px; padding:0 14px; height:44px; color:var(--muted); transition:.18s; }
.header-search:focus-within{ border-color:var(--o-200); background:#fff; box-shadow:var(--shadow-sm); }
.header-search input{ border:none; background:none; outline:none; flex:1; font-family:inherit; font-size:14px; color:var(--ink); }
.header-search button{ color:inherit; display:grid; place-items:center; }
.header-actions{ display:flex; align-items:center; gap:6px; margin-inline-start:auto; }
.icon-btn{ position:relative; width:44px; height:44px; border-radius:12px; display:grid; place-items:center; color:var(--ink); transition:.16s; }
.icon-btn:hover{ background:var(--o-50); color:var(--o-700); }
.cart-badge{ position:absolute; top:4px; inset-inline-start:4px; min-width:18px; height:18px; padding:0 4px; border-radius:99px; background:var(--o); color:#fff; font-size:11px; font-weight:700; display:grid; place-items:center; box-shadow:0 0 0 2px #fff; }
.cart-badge.is-empty{ display:none; }
.burger{ display:none; }

/* mobile menu */
.mm-overlay{ position:fixed; inset:0; z-index:100; background:rgba(0,0,0,.4); backdrop-filter:blur(2px); opacity:0; visibility:hidden; transition:.25s; }
.mm-overlay.open{ opacity:1; visibility:visible; }
.mobile-menu{ position:fixed; inset-block:0; inset-inline-end:0; width:min(86vw,340px); z-index:101; background:#fff; box-shadow:-10px 0 40px rgba(0,0,0,.2); display:flex; flex-direction:column; padding:22px; transform:translateX(100%); transition:transform .3s cubic-bezier(.2,.9,.3,1); }
[dir="rtl"] .mobile-menu{ transform:translateX(-100%); }
.mobile-menu.open{ transform:translateX(0) !important; }
.mm-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:22px; }
.mobile-menu .mm-search{ display:flex; align-items:center; gap:9px; background:var(--surface); border-radius:12px; padding:0 14px; height:48px; margin-bottom:18px; color:var(--muted); }
.mobile-menu .mm-search input{ border:none; background:none; outline:none; flex:1; font-family:inherit; font-size:15px; }
.mobile-menu nav ul{ display:flex; flex-direction:column; }
.mobile-menu nav a{ padding:15px 12px; border-radius:12px; font-size:16px; font-weight:600; color:var(--ink); display:block; }
.mobile-menu nav a:hover{ background:var(--o-50); color:var(--o-700); }

/* ============ FOOTER ============ */
.site-footer{ background:var(--ink); color:rgba(255,255,255,.7); padding:56px 0 0; margin-top:40px; }
.footer-top{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:36px; padding-bottom:40px; }
.site-footer .logo-tx b{ color:#fff; }
.site-footer .logo-tx span{ color:rgba(255,255,255,.5); }
.footer-about{ font-size:14px; line-height:1.95; margin:18px 0; max-width:300px; }
.footer-soc{ display:flex; gap:10px; }
.footer-soc a{ width:40px; height:40px; border-radius:11px; background:rgba(255,255,255,.08); display:grid; place-items:center; color:#fff; transition:.16s; }
.footer-soc a:hover{ background:var(--o); }
.ftr-col-title, .site-footer .widget-title{ color:#fff; font-size:15px; margin-bottom:16px; }
.site-footer .widget a, .footer-menu a{ display:block; font-size:14px; padding:7px 0; transition:.14s; color:rgba(255,255,255,.7); }
.site-footer .widget a:hover, .footer-menu a:hover{ color:var(--o-400); padding-inline-start:4px; }
.footer-contact div{ display:flex; align-items:center; gap:10px; font-size:14px; padding:7px 0; }
.footer-contact .ci{ color:var(--o-400); flex:none; }
.footer-bottom{ border-top:1px solid rgba(255,255,255,.1); padding:20px 0; text-align:center; font-size:13px; color:rgba(255,255,255,.5); }

/* toast */
.li-toast{ position:fixed; bottom:24px; inset-inline-start:50%; transform:translate(50%,120px); background:var(--ink); color:#fff; padding:14px 22px; border-radius:14px; font-size:14px; font-weight:600; box-shadow:var(--shadow-lg); z-index:200; display:flex; align-items:center; gap:10px; transition:transform .35s cubic-bezier(.2,.9,.3,1.2); }
.li-toast.show{ transform:translate(50%,0); }
.li-toast .tk{ color:var(--sage); }

/* responsive */
@media (max-width:980px){
  .footer-top{ grid-template-columns:1fr 1fr; gap:28px; }
}
@media (max-width:1024px){
  .main-nav, .header-search{ display:none; }
  .burger{ display:grid; }
}
@media (max-width:560px){
  .wrap{ padding:0 18px; }
  .section{ padding:44px 0; }
  .footer-top{ grid-template-columns:1fr; }
}