/*
Theme Name: آرت بلاگ
Theme URI: https://artdes.ir
Author: آرت دیزاین
Author URI: https://artdes.ir
Description: قالب سبک و کدنویسی‌شده وردپرس برای بلاگ و فروشگاه اینترنتی. بدون وابستگی به صفحه‌سازها، سریع و بهینه برای سئو.
Version: 1.0
Requires at least: 5.8
Requires PHP: 7.4
Text Domain: digiamooz
Tags: blog, education, custom-menu, custom-logo, translation-ready, rtl-language-support
*/

/* ========================================
   0. RESET
======================================== */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth; overflow-x:hidden;}
body{margin:0; overflow-x:hidden;}
img{max-width:100%; display:block;}
ul{list-style:none; margin:0; padding:0;}
a{text-decoration:none; color:inherit;}
button{font:inherit; cursor:pointer; border:none; background:none;}
input{font:inherit;}
figure{margin:0;}

/* ========================================
   1. DESIGN TOKENS
======================================== */
:root{
  --ink:#15131f;
  --bg:#f7f6fc;
  --surface:#ffffff;
  --primary:#5b3df5;
  --primary-dark:#4327c9;
  --primary-light:#eee9ff;
  --accent:#ffb648;
  --muted:#726f8c;
  --border:#e9e6f5;
  --radius-lg:20px;
  --radius-md:14px;
  --radius-sm:10px;
  --shadow:0 14px 34px -20px rgba(21,19,31,.35);
  --font-body:'Vazirmatn', Tahoma, sans-serif;
  --maxw:1180px;
}
/* category accent colors – cycle by index */
.cat-c0{--cat:#5b3df5;} .cat-c1{--cat:#ff8a5c;} .cat-c2{--cat:#16b8a6;}
.cat-c3{--cat:#ffb648;} .cat-c4{--cat:#ec4899;} .cat-c5{--cat:#2b8aef;}

body{
  font-family:var(--font-body);
  background:var(--bg);
  color:var(--ink);
  line-height:1.9;
  font-size:16px;
}
.container{max-width:var(--maxw); margin:0 auto; padding:0 22px;}

/* ========================================
   2. HEADER
======================================== */
.site-header{
  background:var(--surface);
  border-bottom:1px solid var(--border);
  position:sticky; top:0; z-index:50;
}
.header-inner{
  display:flex; align-items:center; justify-content:space-between;
  gap:24px; padding:18px 0;
}
.site-branding{display:flex; align-items:center; gap:12px;}
.screen-reader-text{display:none;}
.site-branding img.custom-logo{max-height:70px; width:auto;}
.site-title{font-size:22px; font-weight:800; color:var(--ink); letter-spacing:-.3px;}
.site-title span{color:var(--primary);}
.site-description{font-size:12.5px; color:var(--muted); margin-top:2px;}

.main-navigation{flex:1; display:flex; justify-content:center;}
.main-navigation ul{display:flex; gap:6px;}
.main-navigation a{
  display:inline-block; padding:9px 16px; border-radius:99px;
  font-size:14.5px; font-weight:600; color:var(--ink);
  transition:background .2s, color .2s;
}
.main-navigation a:hover, .main-navigation .current-menu-item > a{
  background:var(--primary-light); color:var(--primary-dark);
}

.header-actions{display:flex; align-items:center; gap:10px;}
.header-cta{
  display:inline-flex; align-items:center; gap:8px;
  background:var(--primary); color:#fff !important;
  padding:10px 20px; border-radius:99px; font-size:13.5px; font-weight:700;
  transition:background .2s, transform .2s;
}
.header-cta:hover{background:var(--primary-dark); transform:translateY(-1px);}
.search-toggle{
  width:42px; height:42px; border-radius:50%;
  background:var(--bg); display:flex; align-items:center; justify-content:center;
  color:var(--ink); transition:background .2s;
}
.search-toggle:hover{background:var(--primary-light); color:var(--primary-dark);}
.menu-toggle{display:none; width:42px; height:42px; border-radius:50%; background:var(--bg); align-items:center; justify-content:center;}

.header-search-panel{
  max-height:0; overflow:hidden; background:var(--bg);
  border-bottom:1px solid transparent;
  transition:max-height .3s ease, border-color .3s ease;
}
.header-search-panel.is-open{max-height:110px; border-color:var(--border);}
.header-search-panel form{
  max-width:var(--maxw); margin:0 auto; padding:18px 22px;
  display:flex; gap:10px;
}
.header-search-panel input[type="search"]{
  flex:1; padding:13px 18px; border-radius:var(--radius-sm);
  border:1.5px solid var(--border); background:var(--surface); font-size:15px;
}
.header-search-panel input[type="search"]:focus{outline:none; border-color:var(--primary);}
.header-search-panel button{
  padding:13px 22px; border-radius:var(--radius-sm);
  background:var(--primary); color:#fff; font-weight:700;
}

/* ========================================
   3. HERO / PAGE INTRO
======================================== */
.page-intro{
  position:relative; overflow:hidden;
  padding:56px 0 40px;
}
.page-intro::before{
  content:"";
  position:absolute; inset:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='120' viewBox='0 0 400 120'%3E%3Cpolyline points='0,100 50,80 90,90 140,40 190,60 240,20 290,35 340,10 400,25' fill='none' stroke='%235b3df5' stroke-width='2' opacity='0.12'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:left -20px top 10px; background-size:480px;
  pointer-events:none;
}
.page-intro h1{
  font-size:30px; font-weight:800; position:relative; z-index:1;
}
.page-intro p{color:var(--muted); margin-top:8px; max-width:620px; position:relative; z-index:1;}

/* category filter pills row on home */
.category-strip{
  display:flex; gap:10px; flex-wrap:wrap; margin-top:22px; position:relative; z-index:1;
}
.category-strip a{
  display:inline-flex; align-items:center; gap:8px;
  background:var(--surface); border:1px solid var(--border);
  padding:8px 16px; border-radius:99px; font-size:13.5px; font-weight:600;
  transition:transform .15s, box-shadow .15s;
}
.category-strip a:hover{transform:translateY(-2px); box-shadow:var(--shadow);}
.category-strip a::before{
  content:""; width:8px; height:8px; border-radius:50%; background:var(--cat, var(--primary));
}

/* ========================================
   4. LAYOUT
======================================== */
.content-layout{
  display:grid; grid-template-columns:1fr 320px; gap:40px;
  padding:10px 0 10px; align-items:start;
}

/* ========================================
   5. POST CARDS
======================================== */
.post-grid{display:grid; grid-template-columns:1fr 1fr; gap:26px;}
.post-card{
  background:var(--surface); border-radius:var(--radius-lg);
  overflow:hidden; border:1px solid var(--border);
  display:flex; flex-direction:column;
  transition:transform .2s ease, box-shadow .2s ease;
}
.post-card:hover{transform:translateY(-4px); box-shadow:var(--shadow);}
.post-card .thumb{
  position:relative; aspect-ratio:16/10; overflow:hidden;
  background:var(--primary-light);
}
.post-card .thumb::after{
  content:""; position:absolute; inset-inline-start:0; top:0; height:4px; width:100%;
  background:var(--cat, var(--primary));
}
.post-card .thumb img{width:100%; height:100%; object-fit:cover;}
.post-card .body{padding:20px 22px 24px; display:flex; flex-direction:column; gap:10px; flex:1;}
.post-cat{
  align-self:flex-start;
  font-size:12px; font-weight:700; color:var(--cat, var(--primary));
  background:color-mix(in srgb, var(--cat, var(--primary)) 12%, white);
  padding:5px 12px; border-radius:99px;
}
.post-card h2, .post-card h3{font-size:18px; font-weight:800; line-height:1.6;}
.post-card h2 a, .post-card h3 a{transition:color .15s;}
.post-card h2 a:hover, .post-card h3 a:hover{color:var(--primary);}
.post-excerpt{color:var(--muted); font-size:14px; flex:1;}
.post-meta{
  display:flex; align-items:center; gap:14px; font-size:12.5px; color:var(--muted);
  border-top:1px dashed var(--border); padding-top:12px; margin-top:4px;
}
.post-meta span{display:flex; align-items:center; gap:5px;}

/* featured (first) post - larger */
.post-card.is-featured{grid-column:1 / -1; flex-direction:row;}
.post-card.is-featured .thumb{width:44%; aspect-ratio:auto;}
.post-card.is-featured .body{width:56%; justify-content:center;}
.post-card.is-featured h2{font-size:24px;}

/* pagination */
.pagination{
  display:flex; justify-content:center; gap:8px; margin-top:44px;
}
.pagination a, .pagination span{
  min-width:40px; height:40px; display:flex; align-items:center; justify-content:center;
  border-radius:var(--radius-sm); background:var(--surface); border:1px solid var(--border);
  font-size:14px; font-weight:600;
}
.pagination .current{background:var(--primary); color:#fff; border-color:var(--primary);}

/* ========================================
   6. SIDEBAR
======================================== */
.widget{
  background:var(--surface); border:1px solid var(--border);
  border-radius:var(--radius-lg); padding:24px; margin-bottom:24px;
}
.widget-title{
  font-size:15px; font-weight:800; margin-bottom:16px;
  display:flex; align-items:center; gap:8px;
}
.widget-title::before{content:""; width:4px; height:16px; background:var(--primary); border-radius:2px;}

.sidebar-search{display:flex; gap:8px;}
.sidebar-search input{
  flex:1; padding:11px 14px; border-radius:var(--radius-sm);
  border:1.5px solid var(--border); font-size:14px;
}
.sidebar-search button{
  padding:11px 16px; border-radius:var(--radius-sm); background:var(--primary); color:#fff; font-weight:700;
}

.cat-list li{margin-bottom:6px;}
.cat-list a{
  display:flex; align-items:center; justify-content:space-between;
  padding:10px 12px; border-radius:var(--radius-sm); font-size:14px; font-weight:600;
  transition:background .15s;
}
.cat-list a:hover{background:var(--bg);}
.cat-list a::before{
  content:""; width:9px; height:9px; border-radius:50%; background:var(--cat, var(--primary));
  margin-left:10px; flex-shrink:0;
}
.cat-list .count{
  background:var(--bg); color:var(--muted); font-size:11.5px; font-weight:700;
  padding:2px 8px; border-radius:99px;
}
.cat-list a{display:flex;}
.cat-list a > span.label{display:flex; align-items:center; flex:1;}

.popular-post{display:flex; gap:12px; margin-bottom:16px; align-items:flex-start;}
.popular-post:last-child{margin-bottom:0;}
.popular-post .thumb{
  width:64px; height:64px; border-radius:var(--radius-sm); overflow:hidden; flex-shrink:0; background:var(--primary-light);
}
.popular-post .thumb img{width:100%; height:100%; object-fit:cover;}
.popular-post h4{font-size:13.5px; font-weight:700; line-height:1.6;}
.popular-post span{font-size:11.5px; color:var(--muted);}

.tag-cloud a{
  display:inline-block; margin:0 6px 8px 0; padding:6px 14px; font-size:12.5px !important;
  background:var(--bg); border-radius:99px; font-weight:600 !important; color:var(--ink) !important;
}

/* ========================================
   7. SINGLE POST
======================================== */
.breadcrumb{font-size:13px; color:var(--muted); margin-bottom:16px;}
.breadcrumb a{color:var(--primary); font-weight:600;}
.single-post-header h1{font-size:30px; font-weight:800; line-height:1.6;}
.single-post-meta{
  display:flex; gap:16px; flex-wrap:wrap; color:var(--muted); font-size:13.5px; margin:16px 0 26px;
}
.single-thumb{
  border-radius:var(--radius-lg); overflow:hidden; margin-bottom:28px;
  aspect-ratio:21/9; background:var(--primary-light);
}
.single-thumb img{width:100%; height:100%; object-fit:cover; min-width:0;}
@media(max-width:640px){ .single-thumb{aspect-ratio:16/10;} }
.entry-content{font-size:16.5px;}
.entry-content h2{font-size:22px; font-weight:800; margin:34px 0 14px; border-right:4px solid var(--primary); padding-right:14px;}
.entry-content h3{font-size:18px; font-weight:700; margin:24px 0 10px; color:var(--primary-dark);}
.entry-content p{margin-bottom:16px; color:var(--ink);}
.entry-content img{border-radius:var(--radius-md); margin:20px 0;}
.entry-content ul, .entry-content ol{margin:0 0 16px; padding-right:22px;}
.entry-content blockquote{
  border-right:4px solid var(--accent); background:var(--bg);
  padding:18px 22px; border-radius:var(--radius-sm); margin:24px 0; color:var(--ink); font-weight:600;
}
.entry-tags{display:flex; gap:8px; flex-wrap:wrap; margin-top:30px;}
.entry-tags a{
  background:var(--primary-light); color:var(--primary-dark); font-size:12.5px; font-weight:700;
  padding:6px 14px; border-radius:99px;
}

/* ========================================
   8. FOOTER (dark teal + gold accent, matches brand reference)
======================================== */
.site-footer{
  background:var(--footer-bg-color, #163832); color:#c9d6d2; margin-top:60px;
  position:relative;
}
.footer-inner{position:relative; z-index:1; padding:56px 0 40px;}
.footer-brand-row{
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px;
  margin-bottom:22px;
  padding-bottom:22px; border-bottom:1px solid rgba(255,255,255,.08);
}
.footer-brand-title{display:flex; align-items:center; gap:10px;}
.footer-logo-mark{
  width:0; height:0; flex-shrink:0;
  border-left:9px solid transparent; border-right:9px solid transparent;
  border-bottom:16px solid var(--footer-gold-color, #d9a441);
}
.footer-brand-row .site-title{color:#fff; font-size:19px; font-weight:800; letter-spacing:.5px;}

.footer-grid{
  display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:32px;
  align-items:start;
}
.footer-brand p{color:inherit; font-size:14px; margin-top:4px; max-width:320px; line-height:1.9; opacity:.85;}
.footer-social{display:flex; flex-wrap:wrap; gap:8px;}
.footer-social a{
  width:32px; height:32px; border-radius:50%;
  background:rgba(255,255,255,.08); color:#fff;
  display:flex; align-items:center; justify-content:center;
  transition:background .2s, transform .2s; flex-shrink:0;
}
.footer-social a:hover{background:var(--footer-gold-color, #d9a441); color:#163832; transform:translateY(-2px);}
.footer-social a svg{width:15px; height:15px;}

.footer-trust-badges{display:flex; flex-wrap:wrap; gap:12px; margin-top:16px;}
.footer-trust-badge{
  display:block; background:#fff; border-radius:8px; padding:6px; line-height:0;
  transition:transform .2s;
}
.footer-trust-badge:hover{transform:translateY(-2px);}
.footer-trust-badge img{height:56px; width:auto; max-width:120px; object-fit:contain;}

.footer-col{min-width:0;}
.footer-col h4{
  color:#fff; font-size:13px; font-weight:700; margin-bottom:16px;
  text-transform:uppercase; letter-spacing:.6px;
  padding-bottom:10px; border-bottom:1px solid rgba(255,255,255,.08);
}
.footer-col ul li{margin-bottom:11px;}
.footer-col a{color:#a9bcb6; font-size:13.5px; transition:color .15s;}
.footer-col a:hover{color:var(--footer-gold-color, #d9a441);}
.footer-col a.current{color:#fff; text-decoration:underline; text-underline-offset:4px;}

.back-to-top{
  display:inline-flex; align-items:center; gap:8px;
  margin-top:26px; padding:10px 20px;
  border:1.5px solid rgba(255,255,255,.25); border-radius:99px;
  color:#fff; font-size:12.5px; font-weight:700; letter-spacing:.3px;
  transition:border-color .2s, background .2s;
}
.back-to-top:hover{border-color:var(--footer-gold-color, #d9a441); background:rgba(255,255,255,.05);}

.footer-bottom{
  position:relative; z-index:1;
  background:var(--footer-gold-color, #d9a441); color:#3a2c0f;
  text-align:center; padding:14px 16px; font-size:12.5px; font-weight:600;
}

.footer-bottom .credit{opacity:.85; font-weight:500;}
.footer-bottom .credit a{color:#3a2c0f; font-weight:700; text-decoration:underline; text-underline-offset:2px;}

/* ========================================
   9. RESPONSIVE
======================================== */
@media(max-width:960px){
  .content-layout{grid-template-columns:1fr;}
  .post-grid{grid-template-columns:1fr;}
  .post-card.is-featured{flex-direction:column;}
  .post-card.is-featured .thumb, .post-card.is-featured .body{width:100%;}
  .footer-grid{grid-template-columns:1fr; gap:26px;}
  .main-navigation{display:none;}
  .menu-toggle{display:flex;}
  .main-navigation.is-open{
    display:flex; position:absolute; top:100%; right:0; left:0;
    background:var(--surface); flex-direction:column; padding:12px 20px; border-bottom:1px solid var(--border);
  }
  .main-navigation.is-open ul{flex-direction:column;}
}
@media(max-width:600px){
  .page-intro h1{font-size:24px;}
  .single-post-header h1{font-size:22px;}
}
/* ========================================
   11. CATEGORY CONTENT BLOCKS (below-header "posts" mode)
======================================== */
.cat-block{padding:10px 0;}
.cat-block:nth-child(odd){background:var(--surface);}
.cat-block-head{
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:24px;
}
.cat-block-head h2{
  font-size:20px; font-weight:800; position:relative; padding-right:14px;
}
.cat-block-head h2::before{
  content:""; position:absolute; right:0; top:3px; bottom:3px; width:4px;
  border-radius:2px; background:var(--cat, var(--primary));
}
.cat-block-more{font-size:13px; font-weight:700; color:var(--cat, var(--primary));}

/* grid style */
.items-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.cat-block-grid-item{
  background:var(--surface); border:1px solid var(--border); border-radius:16px;
  overflow:hidden; display:block; transition:transform .2s, box-shadow .2s;
}
.cat-block-grid-item:hover{transform:translateY(-4px); box-shadow:var(--shadow);}
.cat-block-grid-item .thumb{aspect-ratio:16/10; background:var(--primary-light); display:flex; align-items:center; justify-content:center; font-size:28px;}
.cat-block-grid-item h3{font-size:15.5px; font-weight:700; padding:14px 16px 4px; line-height:1.7;}
.cat-block-grid-item .post-excerpt{font-size:13px; color:var(--muted); padding:0 16px;}
.cat-block-grid-item .date{display:block; font-size:12px; color:var(--muted); padding:10px 16px 16px;}

/* list style */
.items-list{display:flex; flex-direction:column; gap:2px;}
.cat-block-list-item{
  display:flex; align-items:center; gap:16px; padding:14px 10px;
  border-bottom:1px dashed var(--border);
}
.cat-block-list-item .thumb{
  width:64px; height:64px; border-radius:10px; overflow:hidden; flex-shrink:0;
  background:var(--primary-light); display:flex; align-items:center; justify-content:center; font-size:20px;
}
.cat-block-list-item h3{font-size:15px; font-weight:700;}
.cat-block-list-item span{font-size:12px; color:var(--muted);}

/* slider (was: horizontal scroll) — a real carousel with nav arrows */
.cat-block-slider-wrap{position:relative;}
.items-scroll{
  display:flex; align-items:flex-start; gap:18px; overflow-x:auto; padding-bottom:4px;
  scroll-snap-type:x proximity; scroll-behavior:smooth;
  -ms-overflow-style:none; scrollbar-width:none;
}
.items-scroll::-webkit-scrollbar{display:none;}
.cat-block-scroll-item{
  flex:0 0 240px; scroll-snap-align:start;
  background:var(--surface); border:1px solid var(--border); border-radius:16px; overflow:hidden;
}
.cat-block-scroll-item .thumb{aspect-ratio:16/10; background:var(--primary-light); display:flex; align-items:center; justify-content:center; font-size:26px;}
.cat-block-scroll-item h3{font-size:14.5px; font-weight:700; padding:12px 14px 4px; line-height:1.7;}
.cat-block-scroll-item span{display:block; font-size:11.5px; color:var(--muted); padding:0 14px 14px;}

.slider-nav-btn{
  position:absolute; top:50%; transform:translateY(-50%); z-index:5;
  width:40px; height:40px; border-radius:50%; background:var(--surface);
  border:1px solid var(--border); box-shadow:var(--shadow);
  display:flex; align-items:center; justify-content:center; font-size:16px; color:var(--ink);
  transition:background .2s;
}
.slider-nav-btn:hover{background:var(--primary); color:#fff;}
.slider-nav-prev{left:-8px;}
.slider-nav-next{right:-8px;}
@media(max-width:640px){
  .slider-nav-btn{width:34px; height:34px;}
  .slider-nav-prev{left:-4px;} .slider-nav-next{right:-4px;}
}

@media(max-width:960px){
  .items-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:640px){
  .items-grid{grid-template-columns:1fr;}
  .cat-block-scroll-item{flex-basis:200px;}
}

/* ========================================
   12. NEWS TICKER
======================================== */
.news-ticker{background:var(--ink); color:#fff; overflow:hidden;}
.news-ticker-inner{display:flex; align-items:center; gap:16px; padding:10px 0;}
.news-ticker-label{
  flex-shrink:0; background:var(--primary); color:#fff; font-size:12.5px; font-weight:700;
  padding:6px 16px; border-radius:99px;
}
.news-ticker-track-wrap{flex:1; overflow:hidden; position:relative;}
.news-ticker-track{
  display:flex; gap:40px; white-space:nowrap;
  animation:digiamooz-ticker 28s linear infinite;
  width:max-content;
}
.news-ticker-track li a{font-size:16px; color:#d8d4e8; transition:color .15s;}
.news-ticker-track li a:hover{color:var(--accent);}
@keyframes digiamooz-ticker{
  0%{ transform:translateX(100%); }
  100%{ transform:translateX(-100%); }
}

/* ========================================
   13. BANNER BLOCKS (text-over-image, for area under header)
======================================== */
.banner-block{padding:36px 0;}
.banner-block-head{
  display:flex; align-items:center; justify-content:space-between; margin-bottom:20px;
}
.banner-block-head h2{font-size:20px; font-weight:800;}
.banner-view-all{font-size:13px; font-weight:700; color:var(--primary);}

.banner-overlay-text{
  position:absolute; inset-inline:0; bottom:0; z-index:2;
  padding:22px 20px;
  background:linear-gradient(to top, rgba(0,0,0,.82) 10%, rgba(0,0,0,.15) 75%, transparent);
  color:#fff;
}
.banner-cat{
  display:inline-block; background:var(--primary); font-size:11.5px; font-weight:700;
  padding:4px 12px; border-radius:99px; margin-bottom:10px;
}
.banner-overlay-text h3{font-size:17px; font-weight:800; line-height:1.7;}
.banner-date{display:block; font-size:12px; color:#d8d4e8; margin-top:6px;}

/* single */
.banner-single-item{
  position:relative; display:block; border-radius:20px; overflow:hidden;
  aspect-ratio:21/9; background-size:cover; background-position:center; background-color:var(--primary-light);
}
.banner-single-item .banner-overlay-text h3{font-size:24px;}

/* split: 1 big + stacked side items */
.banner-split-layout{display:grid; grid-template-columns:1.6fr 1fr; gap:18px;}
.banner-split-main{
  position:relative; display:block; border-radius:20px; overflow:hidden;
  aspect-ratio:16/11; background-size:cover; background-position:center; background-color:var(--primary-light);
}
.banner-split-main .banner-overlay-text h3{font-size:22px;}
.banner-split-side{display:flex; flex-direction:column; gap:14px;}
.banner-split-side-item{
  position:relative; display:block; border-radius:16px; overflow:hidden; flex:1;
  min-height:110px; background-size:cover; background-position:center; background-color:var(--primary-light);
}
.banner-split-side-item .banner-overlay-text{padding:14px 16px;}
.banner-split-side-item .banner-overlay-text h3{font-size:14.5px;}

/* cards row */
.banner-cards-row{display:grid; grid-template-columns:repeat(4,1fr); gap:16px;}
.banner-card-item{
  position:relative; display:block; border-radius:16px; overflow:hidden;
  aspect-ratio:3/4; background-size:cover; background-position:center; background-color:var(--primary-light);
}
.banner-card-item .banner-overlay-text{padding:14px 16px;}
.banner-card-item .banner-overlay-text h3{font-size:14.5px;}

@media(max-width:860px){
  .banner-split-layout{grid-template-columns:1fr;}
  .banner-split-side{flex-direction:row;}
  .banner-cards-row{grid-template-columns:1fr 1fr;}
}
@media(max-width:560px){
  .banner-split-side{flex-direction:column;}
  .banner-single-item{aspect-ratio:4/3;}
}

/* ========================================
   14. CONTENT BLOCK EXTRAS: full-width band + feature style
======================================== */
.cat-block-fullwidth{background:var(--surface);}
.cat-block-fullwidth .cat-block-head{padding-top:6px;}

.items-feature{display:grid; grid-template-columns:1.5fr 1fr; gap:22px;}
.cat-block-feature-item{
  background:var(--surface); border:1px solid var(--border); border-radius:16px; overflow:hidden; display:flex;
}
.cat-block-feature-item.is-main{grid-row:1 / span 3; flex-direction:column;}
.cat-block-feature-item:not(.is-main){flex-direction:row-reverse; align-items:stretch;}
.cat-block-feature-item .thumb{background:var(--primary-light); display:flex; align-items:center; justify-content:center; font-size:22px;}
.cat-block-feature-item.is-main .thumb{aspect-ratio:16/10;}
.cat-block-feature-item:not(.is-main) .thumb{width:110px; flex-shrink:0;}
.cat-block-feature-item .info{padding:16px; flex:1;}
.cat-block-feature-item.is-main h3{font-size:20px; font-weight:800; margin-bottom:8px;}
.cat-block-feature-item:not(.is-main) h3{font-size:14.5px; font-weight:700;}
.cat-block-feature-item .date{font-size:12px; color:var(--muted); display:block; margin-top:8px;}

@media(max-width:860px){
  .items-feature{grid-template-columns:1fr;}
  .cat-block-feature-item.is-main{grid-row:auto;}
}

/* ========================================
   15. DEFAULT HTML ELEMENTS INSIDE CONTENT
   (so unstyled tables/forms/quotes pasted by the editor still look right)
======================================== */
.entry-content table,
.entry-content .wp-block-table table{
  width:100%; border-collapse:collapse; margin:22px 0; font-size:14.5px;
  border:1px solid var(--border); border-radius:10px; overflow:hidden;
}
.entry-content th, .entry-content td{
  padding:12px 14px; text-align:right; border-bottom:1px solid var(--border);
}
.entry-content thead th{background:var(--bg); font-weight:700; color:var(--ink);}
.entry-content tr:last-child td{border-bottom:none;}
.entry-content table caption{margin-bottom:8px; font-size:13px; color:var(--muted);}

.entry-content input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
.entry-content textarea,
.entry-content select{
  width:100%; padding:12px 14px; border:1.5px solid var(--border); border-radius:10px;
  font-family:inherit; font-size:14.5px; background:var(--surface); color:var(--ink); margin-bottom:12px;
}
.entry-content input:focus, .entry-content textarea:focus, .entry-content select:focus{
  outline:none; border-color:var(--primary);
}
.entry-content button, .entry-content input[type="submit"], .entry-content .wp-block-button__link{
  display:inline-block; background:var(--primary); color:#fff; font-weight:700;
  padding:12px 26px; border-radius:10px; font-size:14.5px; transition:background .2s;
}
.entry-content button:hover, .entry-content input[type="submit"]:hover{background:var(--primary-dark);}

.entry-content code{
  background:var(--bg); color:var(--primary-dark); padding:2px 7px; border-radius:6px; font-size:.9em;
  direction:ltr; display:inline-block;
}
.entry-content pre{
  background:var(--ink); color:#e8e6f0; padding:18px 20px; border-radius:12px; overflow-x:auto;
  margin:20px 0; direction:ltr; text-align:left; font-size:13.5px; line-height:1.8;
}
.entry-content pre code{background:none; color:inherit; padding:0;}

.entry-content figure{margin:22px 0;}
.entry-content figcaption, .entry-content .wp-caption-text{
  text-align:center; font-size:12.5px; color:var(--muted); margin-top:8px;
}
.entry-content .alignwide{margin-left:-40px; margin-right:-40px; max-width:none;}
.entry-content .alignfull{margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); max-width:none; width:100vw;}
.entry-content hr{border:none; border-top:1px solid var(--border); margin:30px 0;}

/* ========================================
   16. COMMENTS
======================================== */
.comments-area{margin-top:48px; padding-top:32px; border-top:1px solid var(--border);}
.comments-title{font-size:20px; font-weight:800; margin-bottom:22px;}
.comment-list{margin:0; padding:0;}
.comment-list, .comment-list .children{list-style:none;}
.comment-list .children{margin-right:40px; margin-top:18px;}
.comment-list > li{margin-bottom:22px;}
.comment-body{
  background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:18px 20px;
}
.comment-author{display:flex; align-items:center; gap:10px; margin-bottom:8px;}
.comment-author .avatar{border-radius:50%;}
.comment-author .fn{font-weight:700; font-size:14.5px; font-style:normal;}
.comment-metadata{font-size:12px; color:var(--muted); margin-bottom:10px;}
.comment-metadata a{color:var(--muted);}
.comment-content p{font-size:14.5px; color:var(--ink); margin-bottom:8px;}
.comment-reply-link{
  display:inline-block; margin-top:8px; font-size:12.5px; font-weight:700; color:var(--primary);
  border:1px solid var(--primary-light); padding:5px 14px; border-radius:99px;
}
.comment-awaiting-moderation{
  display:block; margin-top:8px; font-size:12.5px; color:var(--accent); font-weight:600;
}

.comment-respond{
  background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:24px; margin-top:24px;
}
#reply-title{font-size:17px; font-weight:800; margin-bottom:16px;}
.comment-form p{margin-bottom:14px;}
.comment-form label{display:block; font-size:13.5px; font-weight:600; margin-bottom:6px;}
.comment-form input[type="text"], .comment-form input[type="email"], .comment-form input[type="url"], .comment-form textarea{
  width:100%; padding:12px 14px; border:1.5px solid var(--border); border-radius:10px;
  font-family:inherit; font-size:14.5px; background:var(--bg);
}
.comment-form input:focus, .comment-form textarea:focus{outline:none; border-color:var(--primary);}
.comment-form .form-submit input{
  background:var(--primary); color:#fff; font-weight:700; padding:12px 30px; border-radius:10px;
  border:none; cursor:pointer;
}
.comment-form .form-submit input:hover{background:var(--primary-dark);}
.comment-navigation{display:flex; justify-content:space-between; margin:20px 0;}

@media(max-width:640px){
  .comment-list .children{margin-right:18px;}
  .entry-content .alignwide, .entry-content .alignfull{margin-left:0; margin-right:0; width:auto;}
}

/* ========================================
   18. ARCHIVE LAYOUT VARIANTS (grid / list / large)
======================================== */
.post-grid--list{
  display:flex; flex-direction:column; gap:2px; grid-template-columns:none;
}
.post-grid--list .post-card{
  flex-direction:row-reverse; border-radius:12px;
}
.post-grid--list .post-card .thumb{width:130px; aspect-ratio:1/1; flex-shrink:0;}
.post-grid--list .post-card .body{padding:14px 18px;}
.post-grid--list .post-card h2, .post-grid--list .post-card h3{font-size:15.5px;}
.post-grid--list .post-card .post-excerpt{display:none;}
.post-grid--list .post-card.is-featured{flex-direction:row-reverse;}
.post-grid--list .post-card.is-featured .thumb{width:130px; aspect-ratio:1/1;}
.post-grid--list .post-card.is-featured .body{width:auto;}

.post-grid--large{
  display:flex; flex-direction:column; gap:22px; grid-template-columns:none;
}
.post-grid--large .post-card{flex-direction:row; }
.post-grid--large .post-card .thumb{width:42%; aspect-ratio:auto;}
.post-grid--large .post-card .body{width:58%; justify-content:center;}
.post-grid--large .post-card h2, .post-grid--large .post-card h3{font-size:20px;}

@media(max-width:700px){
  .post-grid--list .post-card .thumb{width:90px;}
  .post-grid--large .post-card{flex-direction:column;}
  .post-grid--large .post-card .thumb, .post-grid--large .post-card .body{width:100%;}
}

/* ========================================
   19. IMAGE-OVERFLOW FIX
   Flex/grid items default to min-width:auto, which for an <img> equals its
   native pixel size — a large WordPress thumbnail could force the whole row
   (and the page) wider than the viewport. This resets that everywhere.
======================================== */
.post-card, .post-card .thumb,
.cat-block-grid-item, .cat-block-grid-item .thumb,
.cat-block-list-item, .cat-block-list-item .thumb,
.cat-block-scroll-item, .cat-block-scroll-item .thumb,
.cat-block-feature-item, .cat-block-feature-item .thumb,
.banner-single-item, .banner-split-main, .banner-split-side-item, .banner-card-item,
.popular-post, .popular-post .thumb,
.post-grid, .items-grid, .items-scroll, .banner-cards-row, .banner-split-layout{
  min-width:0;
}
.post-card .thumb img,
.cat-block-grid-item .thumb img,
.cat-block-list-item .thumb img,
.cat-block-scroll-item .thumb img,
.cat-block-feature-item .thumb img,
.popular-post .thumb img{
  width:100%; height:100%; object-fit:cover; display:block; min-width:0; max-width:100%;
}
/* ========================================
   10. ELEMENTOR COMPATIBILITY
   Pages/posts built with Elementor render full-width,
   letting Elementor's own section/column widths take over.
======================================== */
.is-elementor-page .content-layout{
  display:block;
  max-width:none;
  padding:0;
}
.is-elementor-page .main-content{width:100%;}
.is-elementor-page .entry-content{font-size:inherit;}
.elementor-page .site-header{position:sticky;} /* keep header behavior consistent */


/* ========================================
   20. MOBILE SPACING (nothing should touch the screen edge)
======================================== */
@media(max-width:640px){
  .container{padding:0 16px;}
  .banner-block, .cat-block{padding:28px 0;}
  .banner-block-head, .cat-block-head{flex-wrap:wrap; gap:8px;}
  .post-card .body{padding:16px 18px 18px;}
  .single-post-header h1{line-height:1.6;}
  .single-post-meta{gap:10px;}
  .widget{padding:18px;}
  .footer-inner{padding:44px 0 26px;}
  .comment-body, .comment-respond{padding:16px;}
  .header-actions{display:flex; align-items:center; gap:0px;}
  .header-cta{display:none;}
}

/* ========================================
   21. NO-SIDEBAR LAYOUT (per-section sidebar toggle)
======================================== */
.content-layout.no-sidebar{grid-template-columns:1fr;}

/* ========================================
   22. HEADER ICON BUTTONS (account / cart)
======================================== */
.header-icon-btn{
  position:relative;
  width:42px; height:42px; border-radius:50%;
  background:var(--bg); display:flex; align-items:center; justify-content:center;
  color:var(--ink); transition:background .2s, color .2s;
}
.header-icon-btn:hover{background:var(--primary-light); color:var(--primary-dark);}
.header-cart-count{
  position:absolute; top:-4px; left:-4px;
  background:var(--primary); color:#fff; font-size:10px; font-weight:800;
  min-width:18px; height:18px; border-radius:50%;
  display:flex; align-items:center; justify-content:center; padding:0 3px;
}

/* ========================================
   23. SUBMENU (dropdown) + MEGA MENU
======================================== */
.main-navigation ul{position:relative;}
.main-navigation li{position:relative;}
.main-navigation .sub-menu{
  display:none;
  position:absolute; top:100%; right:0; z-index:60;
  min-width:220px; background:var(--surface); border:1px solid var(--border);
  border-radius:14px; padding:10px; box-shadow:var(--shadow);
  flex-direction:column; gap:2px;
}
.main-navigation li:hover > .sub-menu,
.main-navigation li:focus-within > .sub-menu{display:flex;}
.main-navigation .sub-menu a{
  display:block; padding:10px 14px; border-radius:8px; font-size:13.5px; font-weight:500;
  white-space:nowrap;
}
.main-navigation .sub-menu a:hover{background:var(--bg);}
.main-navigation .sub-menu .sub-menu{top:0; right:100%; margin-right:6px;}
.main-navigation li.menu-item-has-children > a::after{
  content:"⌄"; display:inline-block; margin-inline-start:5px; font-size:11px; opacity:.6;
}

/* Mega menu: applies when the menu-editor "CSS Classes" field has "mega-menu" on a top-level item */
body.megamenu-enabled .main-navigation li.mega-menu{position:static;}
body.megamenu-enabled .main-navigation li.mega-menu > .sub-menu{
  position:absolute; top:100%; right:0; left:0; width:100%;
  max-width:var(--maxw); margin:0 auto;
  display:none; flex-direction:row; flex-wrap:wrap; gap:6px 24px;
  padding:26px; border-radius:16px;
}
body.megamenu-enabled .main-navigation li.mega-menu:hover > .sub-menu,
body.megamenu-enabled .main-navigation li.mega-menu:focus-within > .sub-menu{display:flex;}
body.megamenu-enabled .main-navigation li.mega-menu > .sub-menu > li{flex:1 1 200px;}
body.megamenu-enabled .main-navigation li.mega-menu > .sub-menu > li > a{font-weight:700; color:var(--primary-dark);}

@media(max-width:960px){
  .main-navigation .sub-menu{
    position:static; box-shadow:none; border:none; padding:0 0 0 14px; display:none;
  }
  .main-navigation li.menu-item-has-children.is-open > .sub-menu{display:flex;}
  body.megamenu-enabled .main-navigation li.mega-menu > .sub-menu{max-width:none; flex-direction:column;}
}

/* ========================================
   24. WOOCOMMERCE
======================================== */
.woocommerce ul.products,
.woocommerce .related.products ul.products,
.woocommerce .upsells.products ul.products{
  display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:20px !important; list-style:none; padding:0; margin:0 0 40px;
}
/* WooCommerce assigns a "columns-X" class based on the configured column count
   (shop archive / related / upsells) — these must win over the generic 3-column
   default above, which was silently ignoring that class entirely until now. */
.woocommerce ul.products.columns-2{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
.woocommerce ul.products.columns-3{grid-template-columns:repeat(3,minmax(0,1fr)) !important;}
.woocommerce ul.products.columns-4{grid-template-columns:repeat(4,minmax(0,1fr)) !important;}
.woocommerce ul.products.columns-5{grid-template-columns:repeat(5,minmax(0,1fr)) !important;}
.woocommerce ul.products.columns-6{grid-template-columns:repeat(6,minmax(0,1fr)) !important;}
/* WooCommerce's legacy clearfix pseudo-elements would otherwise become real,
   invisible grid cells here and silently shift every product over by one slot. */
.woocommerce ul.products::before, .woocommerce ul.products::after,
.woocommerce .related.products ul.products::before, .woocommerce .related.products ul.products::after,
.woocommerce .upsells.products ul.products::before, .woocommerce .upsells.products ul.products::after{
  display:none !important; content:none !important;
}
.woocommerce ul.products li.product{
  background:var(--surface); border:1px solid var(--border); border-radius:14px; overflow:hidden;
  padding:0 !important; text-align:center; transition:transform .2s, box-shadow .2s; margin:0 !important;
  display:flex !important; flex-direction:column; position:relative;
  width:100% !important; max-width:none !important; float:none !important; clear:none !important;
}
.woocommerce ul.products li.product:hover{transform:translateY(-5px); box-shadow:var(--shadow); z-index:2;}
.woocommerce ul.products li.product .woocommerce-loop-product__link{
  display:block; overflow:hidden; background:#fff; padding:22px; position:relative;
}
.woocommerce ul.products li.product a img{
  aspect-ratio:1/1; object-fit:contain !important; width:100%; margin:0 !important; transition:transform .3s;
}
.woocommerce ul.products li.product:hover a img{transform:scale(1.05);}
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-size:14px; font-weight:600; padding:6px 14px 2px; color:var(--ink); line-height:1.6;
  overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
}
.woocommerce ul.products li.product .star-rating{margin:4px auto 0; font-size:12px; direction:ltr; float:none;}
.woocommerce ul.products li.product .price{
  color:var(--primary); font-weight:800; font-size:15px; padding:4px 14px 12px; margin:0 !important;
  display:flex !important; flex-direction:column; align-items:center; gap:2px; line-height:1.3;
}
.woocommerce ul.products li.product .price del{
  display:block; color:var(--muted); font-weight:400; font-size:12.5px; opacity:1; order:1;
}
.woocommerce ul.products li.product .price ins{display:block; text-decoration:none; order:2;}
.woocommerce ul.products li.product .button{
  display:block; margin:0 !important; background:var(--primary); color:#fff !important;
  padding:13px 16px; border-radius:0 0 13px 13px !important; font-size:13.5px; font-weight:700; transition:background .2s;
  width:100%; margin-top:auto !important;
}
.woocommerce ul.products li.product .button:hover{background:var(--primary-dark);}
.woocommerce ul.products li.product .button.loading{opacity:.6;}
.woocommerce ul.products li.product .added_to_cart{
  display:block; text-align:center; font-size:11.5px; margin:0 14px 14px; color:var(--primary); font-weight:600;
}
.woocommerce span.onsale{
  background:var(--accent) !important; color:#3a2c0f !important; font-weight:800 !important;
  border-radius:8px !important; min-height:0 !important; min-width:0 !important; height:auto !important; width:auto !important;
  padding:5px 12px !important; font-size:11.5px !important; line-height:1.4 !important;
  top:14px !important; left:14px !important; right:auto !important; margin:0 !important; z-index:3; position:absolute !important;
}
.woocommerce nav.woocommerce-pagination ul{border:none; display:flex; gap:8px; background:none;}
.woocommerce nav.woocommerce-pagination ul li{border:none; margin:0;}
.woocommerce nav.woocommerce-pagination ul li a, .woocommerce nav.woocommerce-pagination ul li span{
  border:1px solid var(--border) !important; border-radius:10px; padding:8px 14px; color:var(--ink); background:var(--surface);
}
.woocommerce nav.woocommerce-pagination ul li span.current{background:var(--primary); color:#fff;}

/* result count + ordering bar */
.woocommerce .woocommerce-result-count{color:var(--muted); font-size:13.5px; margin:0 0 20px;}
form.woocommerce-ordering{margin:0 0 20px;}
.woocommerce .woocommerce-ordering select{
  border:1.5px solid var(--border) !important; border-radius:10px !important; padding:9px 14px !important;
  font-size:13.5px !important; background:var(--surface) !important; color:var(--ink) !important;
  font-family:inherit !important; cursor:pointer;
}
.woocommerce .woocommerce-breadcrumb{color:var(--muted); font-size:13px; margin-bottom:20px;}
.woocommerce .woocommerce-breadcrumb a{color:var(--primary);}

/* single product */
.woocommerce div.product .woocommerce-product-gallery{border-radius:16px; overflow:hidden;}
.woocommerce div.product .woocommerce-product-gallery__image img{border-radius:16px;}
.woocommerce div.product .flex-control-thumbs li{margin-top:10px;}
.woocommerce div.product .flex-control-thumbs img{border-radius:8px; border:2px solid transparent; opacity:.7;}
.woocommerce div.product .flex-control-thumbs img.flex-active{border-color:var(--primary); opacity:1;}
.woocommerce div.product .summary{padding-top:6px;}
.woocommerce div.product .product_title{font-size:24px; font-weight:800; margin-bottom:10px;}
.woocommerce div.product p.price, .woocommerce div.product span.price{color:var(--primary); font-size:22px; font-weight:800;}
.woocommerce div.product .woocommerce-product-details__short-description{color:var(--muted); margin:16px 0;}
.woocommerce div.product .woocommerce-product-details__short-description p{margin-bottom:10px;}
.woocommerce div.product form.cart{display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin:20px 0;}
.woocommerce div.product form.cart .button{
  background:var(--primary); color:#fff; border-radius:12px; padding:14px 30px; font-weight:700; font-size:15px; border:none;
}
.woocommerce div.product form.cart .button:hover{background:var(--primary-dark);}
.woocommerce div.product form.cart .quantity{display:flex; align-items:center;}
.woocommerce div.product form.cart .quantity input{
  border:1.5px solid var(--border); border-radius:10px; padding:12px; width:70px; text-align:center; font-size:15px;
}
.woocommerce div.product .cart .variations{margin-bottom:16px;}
.woocommerce div.product .cart .variations select{
  border:1.5px solid var(--border); border-radius:10px; padding:10px 14px; min-width:180px;
}
.woocommerce div.product .cart .variations td.label{font-weight:700; font-size:13.5px; padding-inline-end:12px;}
.woocommerce div.product .woocommerce-tabs ul.tabs{border-bottom:1px solid var(--border); display:flex; gap:6px; padding:0; margin-bottom:20px;}
.woocommerce div.product .woocommerce-tabs ul.tabs li{
  list-style:none; margin:0; background:none; border:none;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a{
  display:block; padding:12px 18px; font-weight:700; font-size:14px; border-radius:10px 10px 0 0;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{background:var(--primary-light); color:var(--primary-dark);}
.woocommerce div.product .woocommerce-tabs .panel{color:var(--ink); font-size:14.5px; line-height:1.9;}
.woocommerce #reviews .comment-form-rating select{border:1.5px solid var(--border); border-radius:8px; padding:6px 10px;}

/* cart + checkout */
.woocommerce table.shop_table{border:1px solid var(--border); border-radius:12px; overflow:hidden; border-collapse:collapse; width:100%;}
.woocommerce table.shop_table th{background:var(--bg); font-weight:700; padding:14px;}
.woocommerce table.shop_table td{padding:14px; border-top:1px solid var(--border);}
.woocommerce #content table.cart img{border-radius:10px; width:64px;}
.woocommerce a.remove{color:#e04f5f !important; font-size:18px !important;}
.woocommerce td.actions .coupon .input-text{
  border:1.5px solid var(--border); border-radius:10px; padding:10px 14px; margin-inline-end:8px;
}
.woocommerce-cart .cart-collaterals .cart_totals{
  background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:22px; margin-top:20px;
}
.woocommerce-cart .cart-collaterals .cart_totals table{border:none;}
.woocommerce-cart .cart-collaterals .cart_totals table td, .woocommerce-cart .cart-collaterals .cart_totals table th{border-top:1px dashed var(--border);}
.woocommerce-cart .cart-collaterals .cart_totals .order-total .woocommerce-Price-amount{color:var(--primary); font-weight:800; font-size:16px;}
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button{
  display:block; width:100%; text-align:center; background:var(--primary) !important; color:#fff !important;
  padding:15px !important; border-radius:12px !important; font-weight:700 !important; font-size:15px !important; margin-top:14px;
}
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover{background:var(--primary-dark) !important;}
.woocommerce-cart table.cart td.actions{display:flex; flex-wrap:wrap; gap:10px; align-items:center;}
.woocommerce-cart table.cart .quantity{display:inline-flex;}
.woocommerce-cart table.cart .quantity input.qty{
  border:1.5px solid var(--border); border-radius:10px; padding:8px; width:60px; text-align:center;
}
.woocommerce-cart table.cart td.product-remove a.remove{
  display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px;
  background:#fde8e8; color:#e04f5f !important; border-radius:50%; font-size:16px;
}
.woocommerce-cart .cart-empty{
  background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:30px; text-align:center;
  color:var(--ink); font-size:15px;
}
.woocommerce-cart .return-to-shop a.button{margin-top:14px;}
.woocommerce-checkout .place-order .button{
  width:100%; padding:16px !important; font-size:16px !important; border-radius:12px !important;
}
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper{margin:14px 0;}
.woocommerce-checkout table.shop_table td, .woocommerce-checkout table.shop_table th{border-top:1px dashed var(--border);}
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button{
  background:var(--primary); color:#fff !important; border-radius:12px !important; padding:12px 26px !important;
  font-weight:700 !important; border:none !important;
}
.woocommerce a.button:hover, .woocommerce button.button:hover{background:var(--primary-dark) !important;}
.woocommerce-checkout #payment{background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:20px;}
.woocommerce-checkout #payment ul.payment_methods{border-bottom:1px solid var(--border); padding-bottom:14px; margin-bottom:14px;}
.woocommerce-checkout #payment div.payment_box{background:var(--bg); border-radius:10px; padding:14px; margin-top:10px; font-size:13.5px;}
.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea, .woocommerce form .form-row select{
  border:1.5px solid var(--border); border-radius:10px; padding:12px 14px; width:100%; background:var(--surface);
}
.woocommerce form .form-row label{font-size:13.5px; font-weight:600; margin-bottom:6px; display:block;}
.woocommerce-checkout #order_review{background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:20px;}
.woocommerce-checkout #order_review table.shop_table{border:none;}

/* my account */
.woocommerce-account .woocommerce-MyAccount-navigation ul{list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:4px;}
.woocommerce-account .woocommerce-MyAccount-navigation li a{
  display:block; padding:11px 16px; border-radius:10px; font-size:14px; font-weight:600; background:var(--surface); border:1px solid var(--border);
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a{background:var(--primary); color:#fff; border-color:var(--primary);}
.woocommerce-account .woocommerce-MyAccount-content{background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:24px; margin-top:20px;}
.woocommerce-message, .woocommerce-info, .woocommerce-noreviews{
  background:var(--surface); color:var(--ink); border:1px solid var(--border);
  border-radius:12px; padding:16px 20px; list-style:none; font-size:14px;
}
.woocommerce-message::before, .woocommerce-info::before{color:var(--primary);}
.woocommerce-error{background:#fde8e8; color:#b91c1c; border-radius:12px; padding:16px 20px; list-style:none; font-size:14px;}

@media(max-width:900px){
  .woocommerce ul.products[class],
  .woocommerce .related.products ul.products[class],
  .woocommerce .upsells.products ul.products[class]{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
}
@media(max-width:560px){
  .woocommerce ul.products[class],
  .woocommerce .related.products ul.products[class],
  .woocommerce .upsells.products ul.products[class]{grid-template-columns:minmax(0,1fr) !important;}
  .woocommerce div.product form.cart{flex-direction:column; align-items:stretch;}
}

/* ========================================
   25. AD BANNER + CUSTOM HTML BLOCKS
======================================== */
.ad-block{padding:20px 0;}
.ad-block-label{
  display:block; font-size:11px; color:var(--muted); text-align:center; margin-bottom:8px; letter-spacing:.5px;
}
.ad-block-link{display:block; border-radius:14px; overflow:hidden;}
.ad-block-link img{width:100%; height:auto;}
.ad-block-fullwidth .ad-block-link img{border-radius:0;}

.html-block{padding:36px 0;}
.html-block-content{font-size:15px; color:var(--ink);}

/* ========================================
   26. RELATED CONTENT
======================================== */
.related-content{margin-top:44px; padding-top:32px; border-top:1px solid var(--border);}
.related-content h2{font-size:19px; font-weight:800; margin-bottom:18px;}
.related-content-grid{display:grid; gap:18px;}
@media(max-width:860px){ .related-content-grid{grid-template-columns:1fr 1fr !important;} }
@media(max-width:560px){ .related-content-grid{grid-template-columns:1fr !important;} }

/* ========================================
   27. FOOTER WIDGET AREAS
======================================== */
.footer-widget-area .widget-title,
.footer-widget-area .widgettitle{
  color:#fff; font-size:13px; font-weight:700; margin-bottom:16px;
  text-transform:uppercase; letter-spacing:.6px;
  padding-bottom:10px; border-bottom:1px solid rgba(255,255,255,.08);
}
.footer-widget-area ul{list-style:none; margin:0; padding:0;}
.footer-widget-area li{margin-bottom:11px;}
.footer-widget-area a{color:inherit; opacity:.85; font-size:13.5px;}
.footer-widget-area a:hover{opacity:1; color:var(--footer-gold-color, #d9a441);}
.footer-widget-hint{font-size:11.5px; opacity:.5; margin-top:10px; font-style:italic;}
.footer-widget{margin-bottom:20px;}
.footer-widget:last-child{margin-bottom:0;}
.footer-trust-html{margin-top:8px;}

/* ========================================
   28. GRID-STYLE DEFENSIVE FIX (content blocks must never collapse to 1 column,
   but the desktop column COUNT itself is left to the inline style set in PHP
   from the user's "تعداد ستون" setting — no !important here on purpose)
======================================== */
.items-grid{
  display:grid;
  width:100%;
}
.items-grid > .cat-block-grid-item{width:100%; min-width:0;}
@media(max-width:960px){ .items-grid{grid-template-columns:repeat(2, minmax(0,1fr)) !important;} }
@media(max-width:640px){ .items-grid{grid-template-columns:minmax(0,1fr) !important;} }

/* ========================================
   29. WOOCOMMERCE — related/upsells section header + discount badge helper
======================================== */
.woocommerce ul.products li.product{position:relative;}
.woocommerce ul.products li.product .thumb-wrap{position:relative; overflow:hidden;}
.woocommerce ul.products li.product .discount-badge{
  position:absolute; top:12px; right:12px; z-index:3;
  background:var(--accent); color:#3a2c0f; font-size:11.5px; font-weight:800;
  padding:4px 10px; border-radius:99px;
}
.woocommerce .related.products,
.woocommerce .upsells.products{margin-top:50px; padding-top:36px; border-top:1px solid var(--border);}
.woocommerce .related.products > h2,
.woocommerce .upsells.products > h2{font-size:20px; font-weight:800; margin-bottom:20px;}

/* ========================================
   30. PRODUCT CARDS INSIDE CONTENT BLOCKS (grid/scroll) — same design as the WooCommerce shop grid
======================================== */
.product-card-wc{
  display:flex; flex-direction:column; text-align:center;
  background:var(--surface); border:1px solid var(--border); border-radius:14px; overflow:hidden;
  transition:transform .2s, box-shadow .2s;
}
.product-card-wc:hover{transform:translateY(-5px); box-shadow:var(--shadow);}
.product-card-wc .thumb-wrap{position:relative; display:block; background:#fff; padding:22px;}
.product-card-wc .thumb-wrap img{aspect-ratio:1/1; object-fit:contain !important; transition:transform .3s;}
.product-card-wc:hover .thumb-wrap img{transform:scale(1.05);}
.product-card-wc .thumb-wrap .discount-badge{
  position:absolute; top:14px; left:14px; right:auto; z-index:2;
  background:var(--accent); color:#3a2c0f; font-weight:800; border-radius:8px; padding:5px 12px; font-size:11.5px;
}
.product-card-wc h3{font-size:14px; font-weight:600; padding:6px 14px 2px; line-height:1.6;}
.product-card-wc .star-rating{margin:4px auto 0; font-size:12px; direction:ltr;}
.product-card-wc .price-line{
  display:flex; flex-direction:column; align-items:center; gap:2px; line-height:1.3;
  padding:4px 14px 12px; color:var(--primary); font-weight:800; font-size:15px;
}
.product-card-wc .price-line del{display:block; color:var(--muted); font-weight:400; font-size:12.5px; order:1; margin:0;}
.product-card-wc .price-line ins{display:block; text-decoration:none; order:2;}
.product-card-wc .add-cart-wrap{margin-top:auto; padding:0;}
.product-card-wc .add-cart-wrap a{
  display:block; width:100%; background:var(--primary); color:#fff !important;
  padding:13px 16px; border-radius:0 0 13px 13px; font-size:13.5px; font-weight:700; transition:background .2s;
}
.product-card-wc .add-cart-wrap a:hover{background:var(--primary-dark);}
.product-card-wc .add-cart-wrap a.added::after{content:" ✓";}
.product-card-wc .added_to_cart{display:block; text-align:center; font-size:11.5px; margin-top:6px; color:var(--primary);}

/* ========================================
   31. COLUMNS BLOCK (nested content builder)
======================================== */
.columns-block{padding:36px 0;}
.columns-block-col{min-width:0;}
.cat-block-inline, .banner-block-inline{min-width:0;}
.cat-block-inline .cat-block-head, .banner-block-inline .banner-block-head{margin-bottom:14px;}
.cat-block-inline .cat-block-grid-item,
.cat-block-inline .cat-block-list-item,
.cat-block-inline .cat-block-scroll-item{margin-bottom:0;}

@media(max-width:960px){
  .columns-block-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
}
@media(max-width:640px){
  .columns-block-grid{grid-template-columns:minmax(0,1fr) !important;}
}

/* ========================================
   32. TEXT + BUTTON BLOCKS
======================================== */
.text-block{padding:36px 0;}
.text-block-title{font-size:20px; font-weight:800; margin-bottom:10px;}
.text-block-body{font-size:15px; color:var(--ink); line-height:1.9;}

.button-block{padding:24px 0; text-align:center;}
.button-block-cta{
  display:inline-block; background:var(--primary); color:#fff; font-weight:700;
  padding:14px 34px; border-radius:12px; font-size:15px; transition:background .2s, transform .2s;
}
.button-block-cta:hover{background:var(--primary-dark); transform:translateY(-2px);}

/* ========================================
   33. MINI-CART DROPDOWN (hover on header cart icon)
======================================== */
.header-cart-wrap{position:relative;}
.header-mini-cart{
  position:absolute !important; top:100% !important; left:0 !important; right:auto !important; z-index:80;
  width:300px !important; max-width:90vw !important; box-sizing:border-box !important; margin-top:10px !important;
  background:var(--surface); border:1px solid var(--border); border-radius:14px;
  box-shadow:var(--shadow); padding:18px;
  opacity:0; visibility:hidden; transform:translateY(-6px);
  transition:opacity .2s, transform .2s, visibility .2s;
}
.header-mini-cart *{box-sizing:border-box;}
.header-cart-wrap:hover .header-mini-cart{opacity:1; visibility:visible; transform:translateY(0);}
.header-mini-cart ul.cart_list, .header-mini-cart ul.product_list_widget{list-style:none; margin:0 !important; padding:0 !important; width:100%;}
.header-mini-cart ul.cart_list li, .header-mini-cart ul.product_list_widget li{
  display:flex; gap:10px; align-items:flex-start; padding:10px 0; border-bottom:1px solid var(--border); width:100%;
}
.header-mini-cart ul.cart_list li:last-child{border-bottom:none;}
.header-mini-cart ul.cart_list li img{width:52px !important; height:52px !important; object-fit:cover; border-radius:8px; flex-shrink:0;}
.header-mini-cart ul.cart_list li a{font-size:13px; font-weight:600; color:var(--ink); display:block;}
.header-mini-cart ul.cart_list li .quantity{font-size:12px; color:var(--muted); display:block; margin-top:4px;}
.header-mini-cart ul.cart_list li a.remove{
  color:#e04f5f; font-size:16px; margin-inline-start:auto; flex-shrink:0;
}
.header-mini-cart .total{
  font-weight:800; font-size:14.5px; color:var(--primary); padding:14px 0 6px; border-top:1px solid var(--border); margin-top:6px;
}
.header-mini-cart p.woocommerce-mini-cart__buttons{display:flex; gap:8px; margin-top:12px;}
.header-mini-cart p.woocommerce-mini-cart__buttons a{
  flex:1; text-align:center; padding:10px 12px !important; border-radius:10px !important; font-size:13px !important; font-weight:700 !important;
  background:var(--primary-light) !important; color:var(--primary-dark) !important;
}
.header-mini-cart p.woocommerce-mini-cart__buttons a.checkout{background:var(--primary) !important; color:#fff !important;}
.header-mini-cart .woocommerce-mini-cart__empty-message{font-size:13.5px; color:var(--muted); text-align:center; padding:10px 0;}

@media(max-width:640px){
  .header-mini-cart{width:260px !important; left:auto !important; right:0 !important;}
}

/* ========================================
   34. PRICE MARKUP CONSISTENCY (keep amount + currency on one tight line)
   Using !important because WooCommerce's own core stylesheet sets conflicting
   display values on these exact classes, which was winning over our plain rules.
======================================== */
.woocommerce .price .woocommerce-Price-amount,
.product-card-wc .price-line .woocommerce-Price-amount,
.woocommerce .price bdi,
.product-card-wc .price-line bdi{
  display:inline !important; white-space:nowrap !important; unicode-bidi:normal !important;
}
.woocommerce .price .woocommerce-Price-currencySymbol,
.product-card-wc .price-line .woocommerce-Price-currencySymbol{
  display:inline !important; font-size:.85em !important; margin-inline-start:3px !important; white-space:nowrap !important;
}
.woocommerce .price del *, .woocommerce .price ins *,
.product-card-wc .price-line del *, .product-card-wc .price-line ins *{
  display:inline !important;
}
.product-card-wc .price-line .woocommerce-Price-amount{
  display:inline !important;
  white-space:nowrap !important;
  unicode-bidi:normal !important;
  font-size:16px;
  color:var(--primary);
}