/* =================================================== Jaryanco — استایل اصلی قالب پالت رنگ: navy #123C4E | teal #3AB6C4 | bg #F1F6F7 =================================================== */ :root{ --navy:#123C4E; --teal:#1FA7B8; --teal-deep:#1C7A8C; --bg:#F1F6F7; --surface:#FFFFFF; --ink:#1D2A30; --ink-soft:#7C93A0; --line:#E4ECEF; --red:#E1483F; --green:#0E8A56; --star:#F5A623; /* --- سیستم تایپوگرافی --- */ --fs-h1:22px; /* عنوان اصلی صفحه (مثلاً عنوان محصول در دسکتاپ) */ --fs-h2:17px; /* تیتر بخش‌ها (محصولات مرتبط، معرفی و...) */ --fs-h3:14.5px; /* زیرتیتر داخل کارت‌ها/باکس‌ها */ --fs-body:13.5px; /* متن اصلی/توضیحات */ --fs-small:12px; /* متن فرعی، برچسب‌ها */ --fs-tiny:10.5px; /* بج‌ها، متادیتا */ --fs-price-lg:26px; /* قیمت در صفحه‌ی تک‌محصول */ --fs-price-md:16px; /* قیمت در کارت محصول */ --lh-body:1.9; --lh-heading:1.4; } *{box-sizing:border-box;} body{margin:0; background:var(--bg); color:var(--ink); font-family:'Vazirmatn',sans-serif; -webkit-font-smoothing:antialiased; font-size:var(--fs-body); line-height:var(--lh-body); font-weight:400;} h1, h2, h3, h4{font-family:'Vazirmatn'; line-height:var(--lh-heading); margin:0; color:var(--navy);} h1{font-size:var(--fs-h1); font-weight:800;} h2{font-size:var(--fs-h2); font-weight:800;} h3{font-size:var(--fs-h3); font-weight:700;} p{margin:0 0 12px; line-height:var(--lh-body);} button, input, select, textarea{font-family:'Vazirmatn';} a{text-decoration:none; color:inherit;} img{max-width:100%; height:auto; display:block;} .price, .woocommerce-Price-amount{font-family:'Vazirmatn'; font-weight:700; font-feature-settings:normal; font-variant-numeric:tabular-nums;} .woocommerce-Price-currencySymbol{font-size:.6em; font-weight:600; color:var(--ink-soft); margin-inline-start:3px;} .app{max-width:480px; margin:0 auto; min-height:100vh; padding-bottom:82px; position:relative; background:var(--bg);} /* ---------- هدر ---------- */ .topbar{position:relative; background:linear-gradient(90deg,var(--navy),var(--teal-deep)); color:#EAF4F5; font-size:10px; text-align:center; padding:8px 40px 8px 14px; display:flex; align-items:center; justify-content:center; gap:10px;} .topbar-badge{background:var(--teal); color:var(--navy); font-weight:800; font-size:9.5px; padding:3px 10px; border-radius:20px; flex-shrink:0;} .topbar-text{font-weight:500;} .topbar-close{position:absolute; left:12px; top:50%; transform:translateY(-50%); width:20px; height:20px; border:none; background:rgba(255,255,255,.14); border-radius:50%; color:#fff; display:flex; align-items:center; justify-content:center; padding:0; flex-shrink:0;} .topbar-close svg{width:10px; height:10px;} .topbar.jc-hidden{display:none;} .site-header{background:rgba(255,255,255,.86); padding:14px 14px 12px; border-bottom:1px solid transparent; position:sticky; top:0; z-index:25; transition:padding .3s cubic-bezier(.4,0,.2,1), box-shadow .3s ease, background .3s ease, border-color .3s ease;} .site-header.jc-compact{padding:8px 14px 9px; background:rgba(255,255,255,.92); backdrop-filter:blur(16px) saturate(160%); -webkit-backdrop-filter:blur(16px) saturate(160%); box-shadow:0 8px 22px rgba(18,60,78,.10); border-bottom-color:var(--line);} .header-top{display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; transition:margin .3s ease;} .site-header.jc-compact .header-top{margin-bottom:9px;} .header-icon{width:40px; height:40px; flex-shrink:0; background:var(--surface); border:1px solid var(--line); border-radius:14px; box-shadow:0 3px 10px rgba(18,60,78,.08); font-size:17px; color:var(--navy); padding:0; display:flex; align-items:center; justify-content:center; transition:transform .15s ease, width .3s ease, height .3s ease;} .header-icon svg{width:18px; height:18px;} .header-icon:active{transform:scale(.92);} .site-header.jc-compact .header-icon{width:34px; height:34px; border-radius:11px;} .site-header.jc-compact .header-icon svg{width:16px; height:16px;} .header-right-group{display:flex; align-items:center; gap:14px;} .desktop-cart-link{display:none; align-items:center; gap:4px; font-size:13px; font-weight:600; color:var(--navy);} .jc-desktop-only{display:none;} .jc-account-link{display:flex; align-items:center; gap:7px; font-size:12.5px; font-weight:700; color:var(--navy);} .jc-account-link.jc-guest .header-icon{width:40px; height:40px;} .jc-account-link.jc-guest{color:var(--navy);} .jc-account-name{display:none;} .jc-account-avatar{width:40px; height:40px; border-radius:50%; background:linear-gradient(135deg,var(--teal),var(--navy)); color:#fff; font-size:14px; font-weight:800; display:flex; align-items:center; justify-content:center; box-shadow:0 4px 12px rgba(18,60,78,.18); flex-shrink:0; transition:width .3s ease, height .3s ease;} .site-header.jc-compact .jc-account-avatar, .site-header.jc-compact .jc-account-link.jc-guest .header-icon{width:34px; height:34px;} .buybar-cart-link{position:relative; flex-shrink:0; width:44px; height:44px; border-radius:12px; border:1px solid var(--line); background:#fff; display:flex; align-items:center; justify-content:center; font-size:18px; text-decoration:none;} .buybar-cart-link .cart-count{position:absolute; top:-5px; left:-5px; background:var(--red); color:#fff; font-size:9px; width:16px; height:16px; border-radius:50%; display:flex; align-items:center; justify-content:center;} .desktop-cart-link .cart-count{background:var(--red); color:#fff; font-size:9px; width:16px; height:16px; border-radius:50%; display:flex; align-items:center; justify-content:center;} .logo{font-size:20px; font-weight:800; color:var(--navy); letter-spacing:.2px; transition:font-size .3s ease;} .site-header.jc-compact .logo{font-size:17px;} .logo span{color:var(--teal);} .search{position:relative; display:flex; align-items:center; background:var(--surface); border:1px solid var(--line); border-radius:20px; height:56px; padding:0 16px; gap:10px; font-size:13.5px; color:var(--ink-soft); box-shadow:0 10px 26px rgba(18,60,78,.09), 0 2px 6px rgba(18,60,78,.05); transition:height .3s cubic-bezier(.4,0,.2,1), border-radius .3s ease, box-shadow .3s ease;} .site-header.jc-compact .search{height:44px; border-radius:15px; box-shadow:0 4px 12px rgba(18,60,78,.08);} .search .search-icon{display:flex; flex-shrink:0; color:var(--teal); width:19px; height:19px;} .search .search-icon svg{width:100%; height:100%;} .site-header.jc-compact .search .search-icon{width:16px; height:16px;} .search input{border:none; background:none; outline:none; flex:1; font-family:'Vazirmatn'; font-size:13.5px; font-weight:500; color:var(--ink);} .search input::placeholder{color:var(--ink-soft); font-weight:400;} .site-header.jc-compact .search input{font-size:12.5px;} .menu-strip{display:flex; gap:8px; overflow-x:auto; margin-top:14px; padding-top:0; font-size:11px; font-weight:600; scrollbar-width:none; max-height:60px; opacity:1; transition:max-height .3s ease, margin .3s ease, opacity .25s ease;} .menu-strip::-webkit-scrollbar{display:none;} .site-header.jc-compact .menu-strip{max-height:0; margin-top:0; opacity:0; overflow:hidden;} .menu-strip a.chip{white-space:nowrap; flex-shrink:0; display:flex; align-items:center; padding:9px 16px; border-radius:999px; background:var(--surface); border:1px solid var(--line); color:var(--navy); font-size:12.5px; font-weight:600; box-shadow:0 2px 6px rgba(18,60,78,.05); transition:transform .15s ease;} .menu-strip a.chip:active{transform:scale(.95);} .menu-strip a.chip.active{background:linear-gradient(135deg,var(--teal),var(--navy)); color:#fff; border-color:transparent; box-shadow:0 8px 18px rgba(31,167,184,.28);} /* مگامنو فقط مخصوص دسکتاپ/تبلت است؛ در موبایل کاملاً مخفی می‌ماند */ .jc-megamenu-wrap{display:none;} /* ---------- منوی کشویی (Drawer) ---------- */ .jc-drawer-overlay{position:fixed; inset:0; background:rgba(10,30,40,.55); z-index:98; opacity:0; visibility:hidden; transition:opacity .3s; backdrop-filter:blur(2px);} .jc-drawer-overlay.open{opacity:1; visibility:visible;} .jc-drawer{position:fixed; top:0; right:0; height:100%; width:80%; max-width:300px; background:var(--surface); z-index:99; transform:translateX(100%); transition:transform .32s cubic-bezier(.22,.9,.35,1); overflow-y:auto; padding-bottom:30px; box-shadow:-8px 0 24px rgba(0,0,0,.15);} .jc-drawer.open{transform:translateX(0);} .jc-drawer-head{display:flex; align-items:center; justify-content:space-between; padding:20px 18px; background:linear-gradient(120deg,var(--navy),#0B2A38); position:sticky; top:0; z-index:2;} .jc-drawer-head .logo{font-size:19px; font-weight:800; color:#fff;} .jc-drawer-head .logo span{color:var(--teal);} .jc-drawer-head button{background:rgba(255,255,255,.12); width:30px; height:30px; border-radius:50%; color:#fff; font-size:14px; display:flex; align-items:center; justify-content:center; border:none;} .jc-drawer-section{padding:16px 18px;} .jc-drawer-section + .jc-drawer-section{border-top:8px solid var(--bg);} .jc-drawer-section h5{font-size:10.5px; color:var(--teal-deep); font-weight:800; margin:0 0 10px; letter-spacing:.4px;} .jc-drawer-section a{display:flex; align-items:center; gap:10px; font-size:13.5px; font-weight:600; color:var(--ink); padding:10px 8px; border-radius:9px; transition:background .15s;} .jc-drawer-section a:active, .jc-drawer-section a:hover{background:var(--bg);} .jc-drawer-section.jc-account a::before, .jc-drawer-section.jc-about a::before{content:'›'; color:var(--teal-deep); font-size:15px; font-weight:800; order:2; margin-inline-start:auto;} .jc-drawer-section.jc-account a:nth-child(2)::after{content:'🔑'; font-size:13px; order:-1;} .jc-drawer-section.jc-account a:nth-child(3)::after{content:'🛒'; font-size:13px; order:-1;} .jc-drawer-section.jc-about a::after{content:'📄'; font-size:13px; order:-1;} /* ردیف دسته + دکمه‌ی باز/بسته کردن زیردسته‌ها (آکاردئون) */ .jc-cat-row{display:flex; align-items:center; gap:6px;} .jc-cat-row .jc-cat-link{flex:1;} .jc-cat-toggle{background:var(--bg); border:none; width:28px; height:28px; border-radius:50%; color:var(--teal-deep); font-size:13px; display:flex; align-items:center; justify-content:center; transform:rotate(-90deg); transition:transform .2s;} .jc-cat-toggle.open{transform:rotate(0deg);} .jc-subcat-list{max-height:0; overflow:hidden; transition:max-height .25s ease;} .jc-subcat-list.open{max-height:400px;} .jc-subcat-list a.jc-drawer-sub{font-size:12px; font-weight:500; color:var(--ink-soft); padding:8px 8px 8px 30px;} .jc-subcat-list a.jc-drawer-sub::after{content:'' !important;} /* وقتی نوار مدیریت وردپرس (فقط برای ادمین) نمایش داده می‌شود، منو زیرش قرار بگیرد */ body.admin-bar .jc-drawer, body.admin-bar .jc-drawer-overlay{top:32px; height:calc(100% - 32px);} @media screen and (max-width:782px){ body.admin-bar .jc-drawer, body.admin-bar .jc-drawer-overlay{top:46px; height:calc(100% - 46px);} } /* ---------- بنر صفحه اصلی ---------- */ .banner-slider{margin:10px; border-radius:10px; overflow:hidden; position:relative;} .banner-track{display:flex; transition:transform .5s ease;} .banner{flex:0 0 100%; background:linear-gradient(120deg,var(--navy),#0B2A38); aspect-ratio:16/8.1; min-height:189px; padding:16px; color:#fff; position:relative; display:flex; flex-direction:column; justify-content:flex-end; align-items:flex-start; border-radius:0;} .banner.has-image{background-size:contain; background-repeat:no-repeat; background-position:center;} .banner-overlay{position:absolute; inset:0; background:rgba(10,30,40,.10); z-index:0;} .banner .kicker, .banner h1, .banner p{position:relative; z-index:1; text-shadow:0 2px 8px rgba(0,0,0,.55);} .banner .kicker{font-size:10px; background:rgba(255,255,255,.15); padding:3px 8px; border-radius:5px; display:inline-block; margin-bottom:8px;} .banner h1{font-size:18px; font-weight:800; margin:0 0 6px;} .banner p{font-size:10.5px; opacity:.8; margin:0;} .banner-dots{position:absolute; bottom:10px; left:50%; transform:translateX(-50%); display:flex; gap:5px; z-index:2;} .banner-dots span{width:5px; height:5px; border-radius:50%; background:#fff; opacity:.4; cursor:pointer; transition:width .2s, opacity .2s;} .banner-dots span.active{opacity:1; width:14px; border-radius:3px; background:var(--teal);} /* دو اسلایدر تبلیغاتی کوچک — موبایل: زیر هم */ .promo-sliders-row{display:grid; grid-template-columns:1fr; gap:10px; margin:10px;} .promo-sliders-row .banner-slider{margin:0;} .banner-slider.small .banner{aspect-ratio:16/9; min-height:110px; padding:12px;} .banner-slider.small h1{font-size:13px; margin:0 0 4px;} .banner-slider.small p{font-size:9px;} .banner-slider.small .kicker{font-size:9px; padding:2px 6px; margin-bottom:5px;} /* ---------- گرید دسته‌بندی ---------- */ .cat-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:6px; background:var(--surface); margin:10px; border-radius:10px; padding:14px 8px;} .cat-grid .item{text-align:center;} .cat-grid .ic{width:44px; height:44px; border-radius:10px; background:var(--bg); display:flex; align-items:center; justify-content:center; font-size:19px; margin:0 auto 5px; overflow:hidden;} .cat-grid .item p{font-size:9.5px; font-weight:500; margin:0;} /* ---------- باکس‌های محتوا (اسلایدر/گرید) ---------- */ .box{background:var(--surface); margin:10px; border-radius:10px; padding:12px;} .box-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:10px;} .box-head h2{font-size:14px; font-weight:800; margin:0;} .box-head a{font-size:10.5px; color:var(--teal-deep); font-weight:600;} .p-slider{display:flex; gap:8px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none;} .p-slider::-webkit-scrollbar{display:none;} .p-slider{align-items:stretch;} .p-slider .card{scroll-snap-align:start; flex-shrink:0; width:130px; height:auto; align-self:stretch;} .p-slider .card-badges, .p-slider .card-stock{display:none;} .p-slider .card .info{padding:10px;} .p-slider .card .name{font-size:11px; -webkit-line-clamp:2; margin-bottom:6px;} .p-slider .card .new{font-size:13px;} .p-slider .card .card-add-btn{padding:8px; font-size:10.5px; border-radius:10px;} .grid, .grid2{display:grid; grid-template-columns:repeat(2,1fr); gap:10px; direction:rtl;} .grid{padding:0 12px;} /* ---------- کارت محصول ---------- */ .card{background:var(--surface); border:1px solid var(--line); border-radius:20px; overflow:hidden; position:relative; display:flex; flex-direction:column; height:100%; box-shadow:0 2px 10px rgba(29,42,48,.04);} .card .off-badge{position:absolute; top:8px; right:8px; background:var(--red); color:#fff; font-size:9.5px; font-weight:700; padding:3px 6px; border-radius:5px; z-index:2;} .jc-wishlist-btn{position:absolute; top:8px; left:8px; z-index:2; width:32px; height:32px; border-radius:50%; background:rgba(255,255,255,.95); border:none; font-size:17px; color:var(--ink-soft); display:flex; align-items:center; justify-content:center; line-height:1; box-shadow:0 2px 8px rgba(18,60,78,.15); transition:transform .15s, color .15s;} .jc-wishlist-btn:active{transform:scale(.88);} .jc-wishlist-btn.active{color:var(--red); animation:jc-heart-pop .3s ease;} @keyframes jc-heart-pop{0%{transform:scale(1);} 40%{transform:scale(1.3);} 100%{transform:scale(1);}} .card .thumb{aspect-ratio:1; background:#fff; border:none; border-bottom:3px solid var(--line); border-radius:14px 14px 0 0; display:flex; align-items:center; justify-content:center; overflow:hidden; padding:16px;} .card .thumb img{width:100%; height:100%; object-fit:cover;} .card .thumb-placeholder{font-size:30px;} .card .info{padding:16px; display:flex; flex-direction:column; flex:1;} .card .name{font-size:12.5px; font-weight:700; line-height:1.6; height:auto; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; margin-bottom:10px; color:var(--ink);} .card-badges{display:flex; flex-wrap:wrap; gap:6px; margin-bottom:10px;} .card-badge{font-size:10px; font-weight:600; color:var(--ink-soft); background:var(--bg); border:1px solid var(--line); border-radius:20px; padding:4px 9px;} .card-stock{display:flex; align-items:center; gap:6px; font-size:10.5px; color:var(--ink-soft); font-weight:600; margin-bottom:10px;} .stock-dot{width:7px; height:7px; border-radius:50%; background:var(--ink-soft); flex-shrink:0;} .stock-dot.in{background:#1E8A4C;} .stock-dot.out{background:var(--red);} .card .price-row{display:flex; align-items:baseline; gap:6px; margin-bottom:12px; flex-wrap:wrap;} .card .price-unavailable{font-size:11px; font-weight:700; color:var(--ink-soft);} .card .old{font-size:10px; color:var(--ink-soft); text-decoration:line-through;} .card .new{font-size:16px; font-weight:800; color:var(--navy);} .card .card-add-btn{display:flex; align-items:center; justify-content:center; gap:6px; text-align:center; background:linear-gradient(135deg, var(--teal), var(--teal-deep)); border:none; border-radius:12px; padding:12px; font-size:12px; font-weight:700; color:#fff; margin-top:auto; transition:transform .2s ease, box-shadow .2s ease;} .card:hover .card-add-btn{transform:translateY(-1px); box-shadow:0 6px 16px rgba(31,167,184,.32);} .card .out-of-stock{display:block; text-align:center; background:var(--bg); border-radius:12px; padding:12px; font-size:12px; font-weight:700; color:var(--ink-soft); margin-top:auto;} .card .out-of-stock{font-size:10px; color:var(--ink-soft);} /* ---------- صفحه لیست محصولات ---------- */ .topnav{background:var(--surface); padding:12px 14px; border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; position:sticky; top:0; z-index:20;} .topnav .side{font-size:19px; color:var(--navy); text-decoration:none;} .topnav .title{font-size:14px; font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:220px;} .subcat-strip{display:flex; gap:8px; overflow-x:auto; padding:10px 12px; scrollbar-width:none;} .subcat-strip::-webkit-scrollbar{display:none;} .subcat-chip{flex-shrink:0; background:var(--surface); border:1px solid var(--line); border-radius:20px; padding:7px 14px; font-size:11px; font-weight:600; color:var(--ink);} .subcat-chip.active{background:var(--navy); border-color:var(--navy); color:#fff;} .toolbar{display:flex; justify-content:space-between; align-items:center; padding:0 14px 10px; font-size:11.5px; color:var(--ink-soft); gap:10px; flex-wrap:wrap;} .toolbar .filter-btn{display:flex; align-items:center; gap:7px; height:38px; font-weight:700; color:var(--navy); background:var(--surface); border:1px solid var(--line); padding:0 16px; border-radius:10px; flex-shrink:0; box-shadow:0 2px 8px rgba(18,60,78,.06); transition:border-color .15s, color .15s, box-shadow .15s;} .toolbar .filter-btn svg{color:var(--teal-deep); flex-shrink:0;} .toolbar .filter-btn:hover{border-color:var(--teal); box-shadow:0 4px 12px rgba(31,167,184,.15);} .toolbar .filter-btn.jc-has-active{color:var(--teal-deep); border-color:var(--teal); background:#EAF7F8;} .toolbar .sort{flex-shrink:0; margin-inline-start:auto; display:flex; align-items:center; height:38px;} .toolbar .sort form.woocommerce-ordering{display:flex; align-items:center; height:100%; margin:0; padding:0; float:none;} .toolbar .sort select{-webkit-appearance:none; -moz-appearance:none; appearance:none; width:auto; min-width:150px; height:38px; line-height:36px; box-sizing:border-box; margin:0; border:1px solid var(--line); background:var(--surface) url("data:image/svg+xml;utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%236b7c84'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M6%209l6%206%206-6'/%3E%3C/svg%3E") no-repeat left 12px center; background-size:13px; font-family:'Vazirmatn'; font-size:11.5px; font-weight:600; color:var(--ink); padding:0 34px 0 14px; border-radius:10px; box-shadow:0 2px 8px rgba(18,60,78,.06); cursor:pointer; transition:border-color .15s, box-shadow .15s;} .toolbar .sort select:hover{border-color:var(--teal);} .jc-view-switch{display:flex; align-items:center; gap:2px; flex-shrink:0; border:1px solid var(--line); border-radius:10px; background:var(--surface); padding:2px; box-shadow:0 2px 8px rgba(18,60,78,.06);} .jc-view-btn{display:flex; align-items:center; justify-content:center; width:34px; height:34px; border:none; background:transparent; border-radius:8px; color:var(--ink-soft); cursor:pointer; transition:background .15s, color .15s;} .jc-view-btn:hover{background:var(--bg); color:var(--navy);} .jc-view-btn.active{background:var(--teal); color:#fff;} /* ---------- پنل فیلتر ---------- */ /* موبایل: فیلتر پنل درون toolbar لکن مخفی */ .toolbar .jc-filters-panel{max-height:0; overflow:hidden; transition:max-height .3s ease; width:100%; order:-1; margin:0;} .toolbar .jc-filters-panel.open{max-height:2000px; overflow:visible;} .toolbar .jc-filters-form{background:transparent; border:none; border-radius:0; padding:16px 0; margin-bottom:12px;} .jc-filter-label{display:block; font-size:11.5px; font-weight:700; color:var(--teal); margin-bottom:10px;} .jc-filters-row{display:flex; flex-direction:column; gap:18px;} .jc-filter-price-col{width:100%;} .jc-filter-grid{display:none; grid-template-columns:1fr; gap:14px;} /* اسلایدر قیمت دو دسته‌ای */ .jc-price-slider{position:relative; padding:26px 44px 6px; margin-top:4px;} .jc-price-track{position:relative; height:4px; background:var(--line); border-radius:4px;} .jc-price-track-fill{position:absolute; height:100%; background:var(--teal); border-radius:4px;} .jc-price-range{position:absolute; top:26px; right:0; left:0; width:100%; margin:0; height:4px; background:transparent; -webkit-appearance:none; appearance:none; pointer-events:none;} .jc-price-range::-webkit-slider-thumb{-webkit-appearance:none; appearance:none; pointer-events:auto; width:18px; height:18px; border-radius:50%; background:#fff; border:3px solid var(--teal); box-shadow:0 2px 6px rgba(18,60,78,.25); cursor:pointer; position:relative; z-index:3;} .jc-price-range::-moz-range-thumb{pointer-events:auto; width:18px; height:18px; border-radius:50%; background:#fff; border:3px solid var(--teal); box-shadow:0 2px 6px rgba(18,60,78,.25); cursor:pointer;} .jc-price-range::-webkit-slider-runnable-track{background:transparent;} .jc-price-range::-moz-range-track{background:transparent;} .jc-price-bubble{position:absolute; top:-6px; transform:translateX(50%); background:var(--teal); color:#fff; font-size:10px; font-weight:700; padding:4px 8px; border-radius:20px; white-space:nowrap; box-shadow:0 3px 8px rgba(31,167,184,.3); pointer-events:none; max-width:130px;} .jc-price-legend{display:none; justify-content:space-between; font-size:10.5px; color:var(--ink-soft); margin-top:14px; font-weight:600;} .jc-price-legend b{color:var(--navy); font-weight:800;} /* دراپ‌داون چک‌باکسی سفارشی (دسته‌بندی، برند، قدرت) */ .jc-dropdown{position:relative;} .jc-dropdown-btn{width:100%; display:flex; align-items:center; justify-content:space-between; gap:8px; background:var(--bg); border:1.5px solid var(--teal); border-radius:9px; padding:10px 12px; font-size:11.5px; font-weight:600; color:var(--teal);} .jc-dropdown-btn svg{flex-shrink:0; color:var(--ink-soft); transition:transform .2s;} .jc-dropdown.open .jc-dropdown-btn{border-color:var(--teal); color:var(--teal-deep);} .jc-dropdown.open .jc-dropdown-btn svg{transform:rotate(180deg); color:var(--teal-deep);} .jc-dropdown-text{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .jc-dropdown-panel{display:none; position:absolute; top:calc(100% + 6px); right:0; left:0; background:var(--surface); border:1px solid var(--line); border-radius:12px; box-shadow:0 10px 26px rgba(18,60,78,.14); padding:8px; max-height:220px; overflow-y:auto; z-index:15;} .jc-dropdown.open .jc-dropdown-panel{display:block;} .jc-dropdown-option{display:flex; align-items:center; gap:8px; padding:8px 6px; font-size:12px; font-weight:500; color:var(--ink); border-radius:7px; cursor:pointer;} .jc-dropdown-option:hover{background:var(--bg);} .jc-dropdown-option input{width:15px; height:15px; accent-color:var(--teal); flex-shrink:0;} .jc-filter-actions{display:flex; gap:10px; margin-top:18px;} .jc-filter-apply{flex:1; display:flex; align-items:center; justify-content:center; gap:7px; background:linear-gradient(135deg,var(--teal),var(--teal-deep)); color:#fff; border:none; border-radius:10px; padding:12px; font-size:12.5px; font-weight:700;} .jc-filter-clear{display:flex; align-items:center; justify-content:center; gap:6px; background:var(--bg); color:var(--ink-soft); border:1px solid var(--line); border-radius:10px; padding:12px 14px; font-size:12px; font-weight:600; flex-shrink:0;} .pagination{display:flex; justify-content:center; gap:6px; padding:20px 0;} .pagination .page-numbers{width:30px; height:30px; border-radius:8px; background:var(--surface); border:1px solid var(--line); display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:600; color:var(--ink-soft);} .pagination .page-numbers.current{background:var(--navy); color:#fff; border-color:var(--navy);} /* ---------- صفحه تک محصول ---------- */ .gallery .woocommerce-product-gallery{position:relative; border-radius:16px; overflow:hidden;} .gallery .woocommerce-product-gallery__wrapper img, .gallery .woocommerce-product-gallery__image > a > img{aspect-ratio:1/1; max-height:340px; object-fit:cover; width:100%;} @media (min-width:600px){ .gallery .woocommerce-product-gallery__wrapper img, .gallery .woocommerce-product-gallery__image > a > img{aspect-ratio:4/3; max-height:none;} } .p-info{background:var(--surface); padding:16px 14px; border-bottom:8px solid var(--bg);} .brand-row{font-size:11px; color:var(--teal-deep); font-weight:700; margin-bottom:6px;} .p-info h1{font-size:16.5px; font-weight:700; line-height:1.6; margin:0 0 10px;} .rating-row{display:flex; align-items:center; gap:8px; margin-bottom:10px; color:var(--star);} /* --- بخش‌های جدید صفحه تک محصول --- */ .gallery{position:relative;} .jc-wish-icon, .jc-share-icon{position:absolute; top:12px; z-index:5; width:34px; height:34px; border-radius:50%; border:1px solid var(--line); background:#fff; font-size:15px; display:flex; align-items:center; justify-content:center; cursor:pointer;} .jc-wish-icon{right:12px; color:var(--ink-soft);} .jc-share-icon{right:52px; color:var(--ink-soft);} .p-meta-row{display:flex; flex-wrap:wrap; align-items:center; gap:8px; font-size:11.5px; color:var(--ink-soft); margin:8px 0 14px;} .p-meta-brand{color:var(--teal-deep); font-weight:700;} .p-stock-badge{font-size:11px; font-weight:700; padding:4px 12px; border-radius:20px;} .p-stock-badge.in{background:#E4F3E9; color:#1E8A4C;} .p-stock-badge.out{background:#FBE4E4; color:var(--red);} .p-price-row{display:flex; align-items:center; gap:10px; flex-wrap:wrap;} .p-price-now{font-size:23px; font-weight:800; color:var(--navy); letter-spacing:-.2px;} .p-price-was{font-size:13px; color:var(--ink-soft); text-decoration:line-through;} .p-discount-badge{font-size:11px; font-weight:700; color:var(--red); background:#FBE4E4; padding:4px 10px; border-radius:8px;} .p-vat-note{font-size:11px; color:var(--ink-soft); margin:6px 0 18px;} .p-price-unavailable{font-size:14px; font-weight:700; color:var(--ink-soft); background:var(--bg); padding:8px 14px; border-radius:10px;} .p-trust-icons{display:grid; grid-template-columns:repeat(4,1fr); gap:10px; padding:18px 10px; border-radius:14px; background:var(--bg); margin-bottom:18px;} .p-trust-item{text-align:center; font-size:11px; color:var(--ink); font-weight:600; line-height:1.7; transition:transform .2s ease;} .p-trust-item:hover{transform:translateY(-2px); color:var(--teal-deep);} .p-trust-item .ic{color:var(--teal-deep);} .p-trust-item .ic{display:block; margin-bottom:5px;} .p-trust-item .ic svg{width:22px; height:22px; margin:0 auto;} .p-assurance{font-size:12.5px; font-weight:700; color:var(--navy); background:var(--bg); padding:12px 14px; border-radius:12px; margin-bottom:6px; display:flex; align-items:center; gap:8px;} .p-assurance-ic{width:18px; height:18px; flex-shrink:0; color:var(--teal-deep);} .p-buy-row{display:flex; gap:10px; margin-bottom:10px;} .p-qty{display:flex; align-items:center; border:1px solid var(--line); border-radius:12px; overflow:hidden; flex:0 0 auto;} .p-qty button{width:38px; height:46px; background:#fff; border:none; font-size:16px; cursor:pointer; transition:background .15s;} .p-qty button:hover{background:var(--bg);} .p-qty-num{width:32px; text-align:center; font-weight:700; font-size:13px;} .p-qty input.qty{width:32px; text-align:center; font-weight:700; font-size:13px; border:none; padding:0; font-family:'Vazirmatn';} .p-info-cart-btn{flex:1; display:flex; align-items:center; justify-content:center; gap:6px; margin-top:0; padding:0; height:46px; background:var(--teal); color:#fff; font-weight:700; font-size:13.5px; border-radius:12px; text-decoration:none; box-shadow:0 4px 14px rgba(31,167,184,.28); transition:transform .18s ease, box-shadow .18s ease, background .18s ease;} .p-info-cart-btn:hover{background:var(--teal-deep); transform:translateY(-2px); box-shadow:0 8px 20px rgba(31,167,184,.35);} .p-buy-now-btn{display:flex; align-items:center; justify-content:center; height:46px; border:1.5px solid var(--teal); color:var(--teal-deep); font-weight:700; font-size:13.5px; border-radius:12px; text-decoration:none; margin-bottom:16px; transition:background .18s ease, transform .18s ease;} .p-buy-now-btn:hover{background:#EAF6F8; transform:translateY(-2px);} .p-buy-now-btn.loading{opacity:.6; pointer-events:none;} .p-assurance-note{font-size:11px; color:var(--ink-soft); padding:0 2px;} .jc-brand-blue{color:var(--teal);} /* لینک پیش‌فرض «مشاهده سبد خرید» که ووکامرس کنار دکمه اضافه می‌کند، چون تیک تأیید (toast) جایگزینش شده */ a.added_to_cart.wc-forward{display:none;} #jc-cart-toast{position:fixed; bottom:24px; left:50%; transform:translateX(-50%) translateY(20px); background:var(--navy); color:#fff; font-size:12.5px; font-weight:700; padding:12px 22px; border-radius:12px; box-shadow:0 8px 24px rgba(0,0,0,.2); z-index:9999; opacity:0; pointer-events:none; transition:opacity .25s ease, transform .25s ease;} #jc-cart-toast.show{opacity:1; transform:translateX(-50%) translateY(0);} .jc-ask-fab{display:none;} /* ---------- ستاره‌ی امتیاز محصول (بدون وابستگی به فونت پیش‌فرض ووکامرس) ---------- */ .star-rating{overflow:hidden; position:relative; height:1em; line-height:1em; font-size:14px; width:5.4em; font-family:sans-serif; letter-spacing:2px; color:var(--line);} .star-rating::before{content:"★★★★★"; position:absolute; top:0; left:0;} .star-rating span{overflow:hidden; float:left; top:0; left:0; position:absolute; padding-top:1.5em;} .star-rating span::before{content:"★★★★★"; position:absolute; top:0; left:0; color:var(--star);} .price del{color:var(--ink-soft); font-size:13px;} .price ins{text-decoration:none; font-size:20px; font-weight:800; color:var(--ink);} .variants{margin-top:0;} .variants table{width:100%;} .variants select{width:100%; border:1.5px solid var(--line); border-radius:12px; padding:11px 14px; font-family:'Vazirmatn'; font-size:12.5px; transition:border-color .2s;} .variants select:focus{border-color:var(--teal); outline:none;} .variants .button{width:100%; background:var(--teal); color:#fff; border:none; border-radius:12px; padding:14px; font-weight:700; margin-top:10px; transition:background .18s ease, transform .18s ease;} .variants .button:hover{background:var(--teal-deep); transform:translateY(-2px);} /* عدد تعداد در محصولات متغیر (که رنگ/مدل دارن) - حذف فلش بالا/پایین پیش‌فرض مرورگر */ .variants .quantity{display:inline-block;} .variants input.qty{ width:64px; text-align:center; border:1.5px solid var(--line); border-radius:12px; padding:11px 8px; font-family:'Vazirmatn'; font-size:13px; -moz-appearance:textfield; /* فایرفاکس */ } .variants input.qty::-webkit-outer-spin-button, .variants input.qty::-webkit-inner-spin-button{ -webkit-appearance:none; /* کروم / اج / سافاری */ margin:0; } .specs{padding:14px; background:var(--surface); border-bottom:8px solid var(--bg);} .specs h4{font-size:12.5px; font-weight:700; margin:0 0 10px;} .spec-row{display:flex; justify-content:space-between; font-size:12px; padding:7px 0; border-bottom:1px dashed var(--line); color:var(--ink-soft);} table.woocommerce-product-attributes{width:100%; border-collapse:separate; border-spacing:0; font-size:12.5px; border:1px solid var(--line); border-radius:14px; overflow:hidden;} table.woocommerce-product-attributes th, table.woocommerce-product-attributes td{padding:12px 16px; border-bottom:1px solid var(--line); text-align:right; font-weight:400; color:var(--ink-soft); background:var(--surface);} table.woocommerce-product-attributes th{color:var(--ink); font-weight:600; width:35%; background:var(--bg);} table.woocommerce-product-attributes tr:nth-child(even) td, table.woocommerce-product-attributes tr:nth-child(even) th{background:var(--bg);} table.woocommerce-product-attributes tr:last-child td, table.woocommerce-product-attributes tr:last-child th{border-bottom:none;} .trust-row{display:flex; padding:14px; gap:8px; background:var(--surface); border-bottom:8px solid var(--bg);} .trust-item{flex:1; text-align:center; font-size:9.5px; color:var(--ink-soft);} .trust-item .ic{display:block; margin-bottom:4px;} .trust-item .ic svg{width:20px; height:20px; margin:0 auto;} .trust-item .ic{font-size:18px; display:block; margin-bottom:5px;} .tab-content{padding:22px; background:var(--surface); border-radius:16px; box-shadow:0 1px 8px rgba(29,42,48,.05); font-size:13px; line-height:2.15; margin-top:16px;} /* ---------- بررسی صوتی هوش مصنوعی (شبیه دیجی‌کالا) — فقط نمایشگر موبایل ---------- */ .jc-ai-audio-block{margin-top:14px;} .jc-ai-audio-card{display:flex; align-items:center; gap:12px; background:linear-gradient(120deg,#EAF7F8,#F1F6F7); border:1px solid #D3EEF1; border-radius:16px; padding:12px 14px;} .jc-ai-play-btn{flex-shrink:0; width:42px; height:42px; border-radius:50%; border:none; background:linear-gradient(135deg,var(--teal),var(--teal-deep)); color:#fff; display:flex; align-items:center; justify-content:center; box-shadow:0 6px 14px rgba(31,167,184,.32); transition:transform .15s ease;} .jc-ai-play-btn:active{transform:scale(.92);} .jc-ai-play-btn svg{margin-inline-start:1px;} .jc-ai-audio-info{flex:1; min-width:0;} .jc-ai-audio-title{display:flex; align-items:center; flex-wrap:wrap; gap:6px; font-size:12px; font-weight:700; color:var(--navy); margin-bottom:8px;} .jc-ai-badge{display:inline-flex; align-items:center; gap:4px; background:linear-gradient(135deg,#7C4DFF,#4C9EFF); color:#fff; font-size:9.5px; font-weight:700; padding:3px 8px; border-radius:20px; flex-shrink:0;} .jc-ai-audio-progress{display:flex; flex-direction:column; gap:5px;} .jc-ai-audio-bar{position:relative; height:4px; background:#D8E9EB; border-radius:4px; overflow:hidden; cursor:pointer;} .jc-ai-audio-fill{position:absolute; top:0; right:0; height:100%; width:0%; background:var(--teal); border-radius:4px; transition:width .1s linear;} .jc-ai-audio-time{display:flex; justify-content:space-between; font-size:9.5px; color:var(--ink-soft); font-weight:600; direction:ltr;} @media (min-width:768px){ .jc-ai-audio-block{display:none;} } .tab-content p{margin:0 0 16px;} .tab-content p:last-child{margin-bottom:0;} .tab-content h1, .tab-content h2, .tab-content h3, .tab-content h4{margin:24px 0 12px; line-height:1.7;} .tab-content h1:first-child, .tab-content h2:first-child, .tab-content h3:first-child{margin-top:0;} .tab-content ul, .tab-content ol{margin:0 0 16px; padding-inline-start:20px; line-height:2;} .woocommerce-tabs ul.tabs{display:flex; list-style:none; padding:0; margin:0 0 14px; border-bottom:1px solid var(--line); position:sticky; top:56px; background:var(--surface); z-index:4; border-radius:12px 12px 0 0;} .woocommerce-tabs ul.tabs li{flex:1; text-align:center; padding:12px 0; font-size:12px; font-weight:600; color:var(--ink-soft); transition:color .15s;} .woocommerce-tabs ul.tabs li.active{color:var(--navy); border-bottom:2px solid var(--teal);} .woocommerce-tabs ul.tabs li:hover{color:var(--teal-deep);} /* همه‌ی بخش‌های تب همیشه نمایان و زیر هم‌اند؛ کلیک روی هر تب فقط با اسکرول به همون بخش می‌رود */ .woocommerce-tabs .woocommerce-Tabs-panel{display:block !important; scroll-margin-top:100px; padding-top:20px; margin-top:14px; border-top:1px solid var(--line);} .woocommerce-tabs .woocommerce-Tabs-panel:first-of-type{border-top:none; margin-top:0; padding-top:0;} .woocommerce-tabs .woocommerce-Tabs-panel h2{font-size:14px; color:var(--navy); margin:0 0 10px;} .sec{padding:16px 14px 4px;} .sec h2{font-size:15.5px; font-weight:800; color:var(--navy); margin:0 0 14px; letter-spacing:-.2px;} /* رفع تداخل با استایل پیش‌فرض ووکامرس برای هر بخشی که مستقیماً از ساختار ul.products خود ووکامرس استفاده می‌کند (مثلاً شورت‌کد/بلاک نمایش محصولات یک دسته - که با .grid/.grid2 اختصاصی قالب فرق دارد و باعث تک‌ستونی شدن در موبایل می‌شد) */ ul.products[class*="columns-"]{list-style:none !important; margin:0 !important; padding:0 !important; display:grid !important; grid-template-columns:repeat(3,1fr) !important; gap:8px !important; direction:rtl;} ul.products[class*="columns-"] li.product, ul.products[class*="columns-"] > .card{width:auto !important; float:none !important; margin:0 !important; list-style:none;} ul.products[class*="columns-"] li.product img, ul.products[class*="columns-"] > .card img{width:100% !important; height:auto;} /* دو بخش زیر (اسلایدر و محصولات مرتبط) به‌عمد با کلاس اختصاصی خودشان override می‌شوند تا از قانون بالا مستثنی بمانند */ .p-slider ul.products{display:flex !important; grid-template-columns:none !important;} /* رفع تداخل با استایل پیش‌فرض ووکامرس فقط در بخش «محصولات مرتبط» (که از ul.products استفاده می‌کند) */ .related.products ul.products, .related.products{display:block;} .related.products ul.products{list-style:none; margin:0; padding:4px 4px 12px; display:flex !important; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none;} .related.products ul.products li.product, .related.products ul.products > .card{width:170px !important; flex:0 0 170px !important; margin:0 !important; list-style:none; border:1px solid var(--line); border-radius:16px; overflow:hidden; box-shadow:0 1px 6px rgba(29,42,48,.05); scroll-snap-align:start; transition:transform .2s ease, box-shadow .2s ease;} .related.products ul.products li.product:hover, .related.products ul.products > .card:hover{transform:translateY(-4px); box-shadow:0 8px 22px rgba(29,42,48,.1);} .related.products ul.products li.product img, .related.products ul.products > .card img{width:100% !important; height:100% !important; object-fit:cover; max-width:none !important;} /* ---------- بخش پرسش و پاسخ محصول ---------- */ .jc-qa{padding:0;} .jc-qa-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:14px;} .jc-qa-head h3{font-size:13px; font-weight:700; margin:0;} .jc-qa-count{font-size:10.5px; color:var(--teal-deep); font-weight:700; background:#EAF6F8; padding:3px 10px; border-radius:20px;} .jc-qa-empty{font-size:12px; color:var(--ink-soft); text-align:center; padding:16px 0;} .jc-expert-review{font-size:12.5px; line-height:2; color:var(--ink);} .jc-expert-review p{margin:0 0 10px;} .jc-question-tab{text-align:center; padding:20px 10px;} .jc-question-tab p{font-size:12.5px; color:var(--ink-soft); margin:0 0 12px;} .jc-question-tab-btn{display:inline-block; font-size:12.5px; font-weight:700; color:#fff; background:var(--teal); padding:9px 18px; border-radius:8px; text-decoration:none;} .jc-qa-item{border:1px solid var(--line); border-radius:16px; padding:16px; margin-bottom:12px; box-shadow:0 1px 6px rgba(29,42,48,.04); transition:box-shadow .2s ease;} .jc-qa-item:hover{box-shadow:0 4px 16px rgba(29,42,48,.08);} .jc-qa-q, .jc-qa-a{display:flex; gap:8px; align-items:flex-start;} .jc-qa-a{margin-top:10px; padding-top:10px; border-top:1px dashed var(--line);} .jc-qa-icon{flex-shrink:0; width:22px; height:22px; border-radius:50%; background:var(--bg); color:var(--navy); font-size:11px; font-weight:800; display:flex; align-items:center; justify-content:center;} .jc-qa-a .jc-qa-icon{background:var(--teal-deep); color:#fff;} .jc-qa-q p, .jc-qa-a p{font-size:12px; line-height:1.8; margin:0 0 4px;} .jc-qa-meta{font-size:10px; color:var(--ink-soft);} .jc-qa-pending{margin-top:8px; font-size:10.5px; color:var(--ink-soft); font-style:italic;} .jc-qa-form{margin-top:16px; background:var(--bg); border-radius:16px; padding:18px;} .jc-qa-form h4{font-size:12px; font-weight:700; margin:0 0 10px;} .jc-qa-form textarea{width:100%; min-height:80px; border:1.5px solid var(--line); border-radius:12px; padding:10px 12px; font-family:'Vazirmatn'; font-size:12.5px; resize:vertical; margin-bottom:10px;} .jc-qa-form-row{display:flex; gap:8px; margin-bottom:10px;} .jc-qa-form-row input{flex:1; border:1.5px solid var(--line); border-radius:12px; padding:9px 12px; font-family:'Vazirmatn'; font-size:12px;} .jc-qa-form button{background:var(--teal); color:#fff; border:none; border-radius:12px; padding:12px 24px; font-weight:700; font-size:12.5px; font-family:'Vazirmatn'; cursor:pointer; transition:background .18s, transform .18s;} .jc-qa-form button:hover{background:var(--teal-deep); transform:translateY(-2px);} /* دکمه‌ی شناور «بپرسید» — همیشه گوشه‌ی پایین صفحه، بالای نوار خرید (استایل بالاتر تعریف شده) */ /* ---------- صفحه‌ی عمومی پرسش‌وپاسخ (مگنت) — کارت‌های سبک دیجی‌کالا ---------- */ .jc-qa-card{display:block; background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:14px; margin-bottom:10px; text-decoration:none;} .jc-qa-tag{display:inline-block; background:#EAF6F8; color:var(--teal-deep); font-size:10px; font-weight:700; padding:4px 10px; border-radius:20px; margin-bottom:8px;} .jc-qa-card-text{font-size:12.5px; color:var(--ink); line-height:1.8; margin:0 0 10px;} .jc-qa-card-foot{display:flex; justify-content:space-between; align-items:center; margin-bottom:8px;} .jc-qa-author{font-size:10px; color:var(--ink-soft);} .jc-qa-reply-count{font-size:10.5px; color:var(--navy); font-weight:600;} .jc-qa-status{font-size:10px; color:var(--ink-soft); font-style:italic;} .jc-qa-status.answered{color:var(--teal-deep); font-style:normal; font-weight:700;} .jc-ask-pill{position:fixed; bottom:96px; left:16px; background:var(--navy); color:#fff; font-size:12.5px; font-weight:700; padding:12px 20px; border-radius:30px; display:flex; align-items:center; gap:6px; box-shadow:0 4px 14px rgba(18,60,78,.35); z-index:31;} /* ---------- نوار خرید ثابت (تک محصول / تسویه‌حساب) ---------- */ .buybar{position:fixed; bottom:0; left:50%; transform:translateX(-50%); width:100%; max-width:480px; background:var(--surface); border-top:1px solid var(--line); display:flex; align-items:center; gap:10px; padding:10px 14px 16px; box-shadow:0 -4px 16px rgba(18,60,78,.1); z-index:30;} .buybar .qty{display:flex; align-items:center; border:1.5px solid var(--line); border-radius:10px; overflow:hidden; flex-shrink:0;} .buybar .qty button{width:32px; height:38px; background:var(--bg); border:none; font-size:16px; color:var(--navy);} .buybar .qty .num{width:28px; text-align:center; font-size:13px; font-weight:700;} .buy-btn, .pay-btn{flex:1; background:var(--navy); color:#fff; border:none; border-radius:10px; height:46px; font-size:13.5px; font-weight:700; display:flex; align-items:center; justify-content:center; gap:6px;} .buybar .row{display:flex; justify-content:space-between; align-items:baseline; width:100%;} /* ---------- فوتر دسکتاپ/تبلت (پیش‌فرض در موبایل مخفی) ---------- */ .site-footer-desktop{display:none;} .jc-scroll-top{display:none;} /* فقط در تبلت/دسکتاپ فعال می‌شود؛ در موبایل جای تب‌بار پایین است */ /* ---------- عضویت خبرنامه — نسخه‌ی موبایل ---------- */ .jc-mobile-newsletter{margin:18px 10px 90px; padding:18px 16px; background:linear-gradient(120deg,var(--navy),#0B2A38); border-radius:16px; text-align:center;} .jc-mnl-title{margin:0 0 12px; font-size:12.5px; font-weight:700; color:#EAF4F5;} .jc-mnl-form{display:flex; gap:8px;} .jc-mnl-form input{flex:1; min-width:0; border:1px solid rgba(255,255,255,.15); background:rgba(255,255,255,.08); color:#fff; padding:11px 14px; border-radius:10px; font-family:'Vazirmatn'; font-size:12.5px; outline:none; transition:border-color .15s, background .15s;} .jc-mnl-form input:focus{border-color:var(--teal); background:rgba(255,255,255,.14); box-shadow:0 0 0 3px rgba(31,167,184,.25);} .jc-mnl-form input::placeholder{color:#7C93A0;} .jc-mnl-form button{flex-shrink:0; border:none; background:var(--teal); color:#fff; font-weight:700; padding:11px 18px; border-radius:10px; font-size:12.5px;} .jc-mnl-form button:disabled{opacity:.7; cursor:default;} .jc-nl-msg-box:empty{display:none;} .jc-nl-msg{margin:0 0 10px; font-size:11.5px; font-weight:700;} .jc-nl-msg--ok{color:#6EE7B7;} .jc-nl-msg--error{color:#FCA5A5;} .tabbar{position:fixed; bottom:0; left:50%; transform:translateX(-50%); width:100%; max-width:480px; background:var(--surface); border-top:1px solid var(--line); display:flex; justify-content:space-around; align-items:center; padding:8px 2px 11px; box-shadow:0 -4px 16px rgba(18,60,78,.08); z-index:30;} .tab{display:flex; flex-direction:column; align-items:center; gap:2px; font-size:8.7px; color:var(--ink-soft); font-weight:500; position:relative; flex:1; text-align:center;} .tab-ic{font-size:17px;} .tab.active{color:var(--navy); font-weight:700;} .tab .cart-count{position:absolute; top:-3px; left:8px; background:var(--red); color:#fff; font-size:8px; width:14px; height:14px; border-radius:50%; display:flex; align-items:center; justify-content:center;} /* ---------- صفحات ثابت (درباره ما / تماس / قوانین) ---------- */ .static-page{background:var(--surface); margin:10px; border-radius:10px; padding:18px; font-size:13px; line-height:2.1;} .contact-info-box{margin-top:16px; background:var(--bg); border-radius:10px; padding:14px; font-size:12.5px; line-height:2.2;} /* ---------- صفحه ۴۰۴ ---------- */ .not-found-page{text-align:center; padding:60px 20px;} .not-found-page .nf-icon{font-size:50px; margin-bottom:16px;} .not-found-page h1{font-size:34px; color:var(--navy); margin:0 0 10px;} .not-found-page p{color:var(--ink-soft); font-size:13px; margin-bottom:20px;} .nf-btn{display:inline-block; background:var(--navy); color:#fff; padding:12px 24px; border-radius:10px; font-weight:700; font-size:13px;} /* ---------- صفحات پیش‌فرض ووکامرس (سبد خرید، تسویه‌حساب، حساب کاربری، ورود/ثبت‌نام، سفارش‌ها، آدرس‌ها) ---------- */ .wc-page-wrap{background:var(--surface); margin:10px; border-radius:16px; padding:20px; font-size:13px; box-shadow:0 2px 12px rgba(29,42,48,.05);} /* عنوان صفحه (مثلاً «سبد خرید شما») */ .wc-page-wrap > h1, .wc-page-wrap .entry-title{font-size:17px; font-weight:800; color:var(--navy); margin:0 0 18px;} /* جدول‌ها (سبد خرید، تاریخچه‌ی سفارش‌ها) */ .wc-page-wrap table.shop_table{width:100%; border-collapse:separate; border-spacing:0; font-size:12.5px; border:1px solid var(--line); border-radius:14px; overflow:hidden;} .wc-page-wrap table.shop_table th{background:var(--bg); color:var(--ink); font-weight:700; padding:12px 10px; text-align:right;} .wc-page-wrap table.shop_table td{padding:14px 10px; border-bottom:1px solid var(--line); text-align:right; vertical-align:middle;} .wc-page-wrap table.shop_table tr:last-child td{border-bottom:none;} .wc-page-wrap table.shop_table img{border-radius:10px; width:56px; height:56px; object-fit:cover;} .wc-page-wrap .product-remove a{color:var(--red); font-size:16px;} .wc-page-wrap td.actions .coupon{display:flex; gap:8px; align-items:center;} .wc-page-wrap td.actions .coupon input{width:auto; flex:1; margin-bottom:0;} /* دکمه‌ها */ .wc-page-wrap .button, .wc-page-wrap input[type="submit"]{background:var(--teal); color:#fff; border:none; border-radius:12px; padding:13px 22px; font-weight:700; font-size:13px; font-family:'Vazirmatn'; cursor:pointer; transition:background .18s ease, transform .18s ease;} .wc-page-wrap .button:hover, .wc-page-wrap input[type="submit"]:hover{background:var(--teal-deep); transform:translateY(-2px);} .wc-page-wrap .button.checkout{width:100%; height:52px; font-size:14px;} .wc-page-wrap a.remove{color:var(--red) !important; background:none !important;} /* فیلدهای فرم */ .wc-page-wrap input[type="text"], .wc-page-wrap input[type="email"], .wc-page-wrap input[type="tel"], .wc-page-wrap input[type="number"], .wc-page-wrap input[type="password"], .wc-page-wrap select, .wc-page-wrap textarea{width:100%; border:1.5px solid var(--line); border-radius:12px; padding:12px 14px; font-family:'Vazirmatn'; font-size:12.5px; margin-bottom:12px; transition:border-color .2s;} .wc-page-wrap input:focus, .wc-page-wrap select:focus, .wc-page-wrap textarea:focus{border-color:var(--teal); outline:none;} .wc-page-wrap label{font-size:12px; font-weight:600; color:var(--ink); display:block; margin-bottom:6px;} .wc-page-wrap .form-row{margin-bottom:2px;} /* ---------- فرم‌های ورود / عضویت (مطابق طرح مرجع) ---------- */ /* جلوگیری از رنگ زرد Autofill مرورگر */ .wc-page-wrap input:-webkit-autofill, .wc-page-wrap input:-webkit-autofill:hover, .wc-page-wrap input:-webkit-autofill:focus, #customer_login input:-webkit-autofill, #customer_login input:-webkit-autofill:hover, #customer_login input:-webkit-autofill:focus{ -webkit-box-shadow:0 0 0px 1000px #fff inset !important; box-shadow:0 0 0px 1000px #fff inset !important; -webkit-text-fill-color:var(--ink) !important; caret-color:var(--ink) !important; border:1.5px solid var(--line) !important; transition:background-color 9999s ease-in-out 0s, color 9999s ease-in-out 0s; } /* چیدمان دو ستونه ورود/عضویت */ #customer_login{background:none !important; border-radius:0 !important; padding:0 !important; margin-bottom:14px; display:flex; flex-wrap:wrap; gap:28px;} #customer_login .u-column1, #customer_login .u-column2{flex:1 1 260px; background:none !important; padding:0 !important;} #customer_login .u-column1{border-inline-end:1px solid var(--line); padding-inline-end:28px !important;} #customer_login h2{font-size:15px; font-weight:800; color:var(--navy); margin:0 0 18px; text-align:right;} @media (max-width:600px){ #customer_login .u-column1{border-inline-end:none; padding-inline-end:0 !important; border-bottom:1px solid var(--line); padding-bottom:20px !important; margin-bottom:6px;} } /* ردیف‌ها و لیبل‌ها */ #customer_login .woocommerce-form-row{margin-bottom:16px;} #customer_login .woocommerce-form-row label{font-size:12px; font-weight:600; color:var(--ink); display:block; margin-bottom:8px;} #customer_login .woocommerce-form-row label .required{color:var(--red); margin-inline-start:2px;} /* فیلدهای متنی */ #customer_login input.input-text, #customer_login input[type="password"], #customer_login input[type="email"], #customer_login input[type="tel"]{ width:100%; border:1.5px solid var(--line); border-radius:10px; padding:12px 40px 12px 14px; font-family:'Vazirmatn'; font-size:12.5px; background:#fff !important; box-shadow:none; transition:border-color .2s; } #customer_login input:focus{border-color:#2F6FED; outline:none;} /* آیکن داخل فیلدها (سمت چپ) */ #customer_login .woocommerce-form-row{position:relative;} #customer_login #username{background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A9B7BC' stroke-width='1.8'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 20c0-4 3.5-6 8-6s8 2 8 6'/%3E%3C/svg%3E") no-repeat left 12px center !important; background-size:17px !important;} #customer_login input[type="email"]{background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A9B7BC' stroke-width='1.8'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='M3 7l9 6 9-6'/%3E%3C/svg%3E") no-repeat left 12px center !important; background-size:17px !important;} #customer_login input[type="tel"]{background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A9B7BC' stroke-width='1.8'%3E%3Crect x='6' y='2' width='12' height='20' rx='2'/%3E%3Cline x1='11' y1='18' x2='13' y2='18'/%3E%3C/svg%3E") no-repeat left 12px center !important; background-size:17px !important;} #customer_login input[type="password"]{padding-inline-end:42px !important;} #customer_login .show-password-input{inset-inline-start:12px !important; inset-inline-end:auto !important;} /* مرا به خاطر بسپار + دکمه‌ی ورود در یک ردیف */ .woocommerce-form-login .form-row-first{display:flex; align-items:center; gap:16px; margin-bottom:14px;} .woocommerce-form-login__rememberme{display:flex; align-items:center; gap:6px; font-size:12px; color:var(--ink-soft); font-weight:500; margin:0 !important;} .woocommerce-form-login__rememberme input[type="checkbox"]{width:16px; height:16px; margin:0;} /* دکمه‌ها (آبی مطابق طرح) */ #customer_login .button, #customer_login button[type="submit"]{ background:#2F6FED !important; color:#fff !important; border:none; border-radius:10px; padding:11px 26px; font-weight:700; font-size:13px; font-family:'Vazirmatn'; cursor:pointer; transition:background .18s ease, transform .18s ease; } #customer_login .button:hover, #customer_login button[type="submit"]:hover{background:#2358C4 !important; transform:translateY(-1px);} /* فراموشی گذرواژه */ .wc-page-wrap .woocommerce-LostPassword{margin-top:10px;} .wc-page-wrap .woocommerce-LostPassword a{color:#2F6FED; font-weight:600; font-size:12px;} /* متن حریم خصوصی در عضویت */ #customer_login .woocommerce-privacy-policy-text{font-size:11.5px; line-height:2; color:var(--ink-soft); margin:14px 0;} #customer_login .woocommerce-privacy-policy-text a{color:#2F6FED; font-weight:600;} .wc-page-wrap .woocommerce-form-login-toggle, .wc-page-wrap .woocommerce-form-register-toggle{background:var(--bg); border-radius:12px; padding:14px 16px;} /* پیام‌ها (موفقیت/خطا/اطلاع) */ .wc-page-wrap .woocommerce-message, .wc-page-wrap .woocommerce-error, .wc-page-wrap .woocommerce-info{ list-style:none; border-radius:12px; padding:14px 16px; font-size:12.5px; font-weight:600; margin-bottom:16px; border:none; } .wc-page-wrap .woocommerce-message{background:#E4F3E9; color:#1E8A4C;} .wc-page-wrap .woocommerce-error{background:#FBE4E4; color:var(--red);} .wc-page-wrap .woocommerce-info{background:#EAF6F8; color:var(--teal-deep);} .wc-page-wrap .woocommerce-message a.button, .wc-page-wrap .woocommerce-error a.button{margin-inline-start:10px; padding:8px 16px;} /* بخش پرداخت (checkout) */ .wc-page-wrap #payment{background:var(--bg); border-radius:14px; padding:18px; margin-top:16px;} .wc-page-wrap #payment ul.payment_methods{list-style:none; padding:0; margin:0;} .wc-page-wrap #payment li{border-bottom:1px solid var(--line); padding:12px 0;} .wc-page-wrap #payment li:last-child{border-bottom:none;} .wc-page-wrap .order-total .woocommerce-Price-amount{color:var(--navy); font-size:17px; font-weight:800;} .wc-page-wrap #order_review, .wc-page-wrap .order-review{background:var(--bg); border-radius:16px; padding:20px;} .wc-page-wrap #order_review h3, .wc-page-wrap .order-review h3{font-size:14px; font-weight:800; margin:0 0 14px;} /* داشبورد حساب کاربری */ .woocommerce-MyAccount-navigation ul{list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:4px; background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:10px;} .woocommerce-MyAccount-navigation li{border-radius:10px; overflow:hidden;} .woocommerce-MyAccount-navigation li a{display:flex; align-items:center; gap:9px; padding:12px 14px; font-size:12.5px; font-weight:600; color:var(--ink); text-decoration:none; transition:background .15s;} .woocommerce-MyAccount-navigation li a:hover{background:var(--bg);} .woocommerce-MyAccount-navigation li.is-active a{background:var(--teal); color:#fff;} .woocommerce-MyAccount-navigation-link--dashboard a::before{content:'🧭';} .woocommerce-MyAccount-navigation-link--orders a::before{content:'🧾';} .woocommerce-MyAccount-navigation-link--downloads a::before{content:'⬇️';} .woocommerce-MyAccount-navigation-link--edit-address a::before{content:'📍';} .woocommerce-MyAccount-navigation-link--my-reviews a::before{content:'⭐';} .woocommerce-MyAccount-navigation-link--edit-account a::before{content:'👤';} .woocommerce-MyAccount-navigation-link--customer-logout a::before{content:'🚪';} /* ---------- فرم جزئیات حساب (ویرایش پروفایل) ---------- */ .wc-page-wrap form.edit-account .woocommerce-form-row{margin-bottom:16px;} .wc-page-wrap form.edit-account .woocommerce-form-row label{font-size:12px; font-weight:600; color:var(--ink); display:block; margin-bottom:8px;} .wc-page-wrap form.edit-account .woocommerce-form-row label .required{color:var(--red); margin-inline-start:2px;} .wc-page-wrap form.edit-account .form-row-first, .wc-page-wrap form.edit-account .form-row-last{width:100%;} @media (min-width:600px){ .wc-page-wrap form.edit-account > p.form-row-first, .wc-page-wrap form.edit-account > p.form-row-last{display:inline-block; width:calc(50% - 8px); vertical-align:top;} .wc-page-wrap form.edit-account > p.form-row-first{margin-inline-end:16px;} } .wc-page-wrap form.edit-account input.input-text, .wc-page-wrap form.edit-account input[type="password"], .wc-page-wrap form.edit-account input[type="email"], .wc-page-wrap form.edit-account input[type="text"]{ width:100%; border:1.5px solid var(--line); border-radius:10px; padding:12px 14px; font-family:'Vazirmatn'; font-size:12.5px; background:#fff !important; box-shadow:none; box-sizing:border-box; transition:border-color .2s; } /* حذف رنگ زرد پیش‌فرض مرورگر روی فیلدهای پرشده خودکار (autofill) */ .wc-page-wrap form.edit-account input:-webkit-autofill, .wc-page-wrap form.edit-account input:-webkit-autofill:hover, .wc-page-wrap form.edit-account input:-webkit-autofill:focus{ -webkit-box-shadow:0 0 0 1000px #fff inset !important; -webkit-text-fill-color:var(--ink) !important; transition:background-color 9999s ease-in-out 0s; } .wc-page-wrap form.edit-account input:focus{border-color:var(--teal); outline:none;} .wc-page-wrap form.edit-account input[type="password"]{padding-inline-end:42px !important;} .wc-page-wrap form.edit-account .show-password-input{inset-inline-start:12px !important; inset-inline-end:auto !important;} .wc-page-wrap form.edit-account fieldset{border:1px solid var(--line); border-radius:14px; padding:18px 16px 4px; margin:22px 0 18px;} .wc-page-wrap form.edit-account fieldset legend{font-weight:700; font-size:12.5px; color:var(--navy); padding:0 8px;} .wc-page-wrap form.edit-account p:has(> .woocommerce-Button), .wc-page-wrap form.edit-account p:has(> button[type="submit"]), .wc-page-wrap form.edit-account p:has(> input[type="submit"]){margin-top:24px;} button[name="save_account_details"], input[name="save_account_details"]{ background-color:var(--teal) !important; background-image:none !important; color:#fff !important; border:none !important; border-radius:10px !important; padding:12px 30px !important; font-weight:700 !important; font-size:13px !important; font-family:'Vazirmatn' !important; cursor:pointer; display:inline-block !important; margin-top:10px !important; -webkit-appearance:none !important; appearance:none !important; box-shadow:none !important; transition:background .18s ease, transform .18s ease; } button[name="save_account_details"]:hover, input[name="save_account_details"]:hover{background-color:var(--teal-deep) !important; transform:translateY(-1px);} .wc-page-wrap .woocommerce-MyAccount-content{background:transparent; border-radius:0; padding:0; margin-top:0;} /* بردکرامب و عنوان صفحه‌ی حساب کاربری */ .jc-account-breadcrumb{display:flex; align-items:center; gap:6px; font-size:11.5px; color:var(--ink-soft); margin-bottom:10px;} .jc-account-breadcrumb a{color:var(--ink-soft); transition:color .15s;} .jc-account-breadcrumb a:hover{color:var(--teal-deep);} .jc-account-breadcrumb-sep{transform:scaleX(-1); opacity:.7;} .jc-account-title{display:flex; align-items:center; gap:10px; font-size:19px; font-weight:800; color:var(--navy); margin-bottom:16px;} .jc-account-title-ic{width:34px; height:34px; border-radius:50%; background:var(--teal); color:#fff; display:flex; align-items:center; justify-content:center; flex-shrink:0;} .jc-account-title-ic svg{width:18px; height:18px;} /* کارت خوش‌آمدگویی */ .jc-greeting-card{display:flex; align-items:center; gap:18px; background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:20px; margin-bottom:16px;} .jc-greeting-avatar{width:64px; height:64px; border-radius:50%; background:var(--bg); color:var(--teal-deep); display:flex; align-items:center; justify-content:center; flex-shrink:0;} .jc-greeting-avatar svg{width:34px; height:34px;} .jc-greeting-text h3{font-size:15.5px; font-weight:800; margin-bottom:6px;} .jc-greeting-text p{font-size:12.5px; color:var(--ink-soft); margin:0; line-height:1.9;} /* شبکه‌ی کارت‌های آماری */ .jc-stat-grid{display:grid; grid-template-columns:repeat(2, 1fr); gap:12px; margin-bottom:20px;} .jc-stat-card{display:flex; flex-direction:column; align-items:center; text-align:center; gap:4px; background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:20px 12px; transition:border-color .15s, transform .15s;} .jc-stat-card:hover{border-color:var(--teal); transform:translateY(-2px);} .jc-stat-ic{width:46px; height:46px; border-radius:50%; display:flex; align-items:center; justify-content:center; margin-bottom:6px;} .jc-stat-ic svg{width:22px; height:22px;} .jc-ic-red{background:#FDECEB; color:var(--red);} .jc-ic-green{background:#E7F6EF; color:var(--green);} .jc-ic-yellow{background:#FEF3E1; color:var(--star);} .jc-ic-blue{background:#E7F5F7; color:var(--teal-deep);} .jc-ic-purple{background:#F1EBFB; color:#7C4DCC;} .jc-stat-num{font-size:14.5px; font-weight:800; color:var(--navy);} .jc-stat-label{font-size:11px; color:var(--ink-soft);} @media (min-width:700px){ .jc-stat-grid{grid-template-columns:repeat(5, 1fr);} } .wc-page-wrap .woocommerce-address-fields fieldset{border:1px solid var(--line); border-radius:14px; padding:16px; margin-bottom:16px;} .wc-page-wrap .woocommerce-address-fields legend{font-weight:700; font-size:12.5px; color:var(--navy); padding:0 8px;} .addresses{display:flex; flex-direction:column; gap:14px;} .addresses .woocommerce-Address{border:1px solid var(--line); border-radius:14px; padding:16px; background:var(--surface);} .addresses .woocommerce-Address-title{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px;} .addresses .woocommerce-Address-title h2{font-size:13px; font-weight:700; margin:0; color:var(--navy);} .addresses .woocommerce-Address-title .edit{display:inline-flex; align-items:center; gap:5px; flex-shrink:0; background:var(--teal); color:#fff !important; font-size:11.5px; font-weight:700; padding:7px 14px; border-radius:999px; text-decoration:none !important; transition:background .15s ease, transform .15s ease;} .addresses .woocommerce-Address-title .edit:hover{background:var(--teal-deep); transform:translateY(-1px);} .addresses .woocommerce-Address-title .edit::before{content:'+'; font-size:14px; line-height:1; font-weight:800;} .addresses .woocommerce-Address address{font-style:normal; font-size:12.5px; line-height:1.9; color:var(--ink-soft);} /* ---------- فرم نظرات و امتیازدهی (بخش پایینی تب نظرات) ---------- */ #reviews{padding:0;} #reviews .woocommerce-Reviews-title{font-size:13px; font-weight:700; margin-bottom:14px;} #reviews .commentlist{list-style:none; margin:0; padding:0;} #reviews .comment{border:1px solid var(--line); border-radius:16px; padding:14px; margin-bottom:12px; display:flex; gap:10px; box-shadow:0 1px 6px rgba(29,42,48,.04); transition:box-shadow .2s ease;} #reviews .comment:hover{box-shadow:0 4px 16px rgba(29,42,48,.08);} #reviews .comment .avatar{width:36px; height:36px; border-radius:50%; flex-shrink:0;} #reviews .comment .woocommerce-review__author{font-size:12px; font-weight:700;} #reviews .comment .woocommerce-review__dash, #reviews .comment .woocommerce-review__published-date{font-size:10.5px; color:var(--ink-soft);} #reviews .star-rating{font-size:12px; margin:4px 0;} #reviews .description p{font-size:12px; line-height:1.9; margin:4px 0 0;} #reviews #review_form_wrapper{margin-top:16px; background:var(--bg); border-radius:16px; padding:24px;} #reviews #review_form .comment-reply-title{font-size:14px; font-weight:700; display:block; margin-bottom:16px;} #reviews .comment-form-rating{margin-bottom:16px;} #reviews .comment-form-rating label{font-size:12px; font-weight:600; display:block; margin-bottom:8px;} #reviews .comment-form-rating p.stars{margin-bottom:0;} #reviews p.stars a{color:var(--star); text-decoration:none; font-size:17px; margin-inline-end:2px;} #reviews .comment-form-author, #reviews .comment-form-email{display:inline-block; width:48%; vertical-align:top; margin-bottom:18px;} #reviews .comment-form-author{margin-inline-end:4%;} #reviews .comment-form-author label, #reviews .comment-form-email label{font-size:12px; font-weight:600; display:block; margin-bottom:8px;} #reviews .comment-form-author input, #reviews .comment-form-email input{width:100%; border:1.5px solid var(--line); border-radius:12px; padding:11px 14px; font-family:'Vazirmatn'; font-size:12.5px; transition:border-color .2s;} #reviews .comment-form-author input:focus, #reviews .comment-form-email input:focus{border-color:var(--teal); outline:none;} #reviews .comment-form-comment{margin-bottom:18px;} #reviews .comment-form-comment label{font-size:12px; font-weight:600; display:block; margin-bottom:8px;} #reviews textarea#comment{width:100%; min-height:110px; border:1.5px solid var(--line); border-radius:12px; padding:12px 14px; font-family:'Vazirmatn'; font-size:12.5px; line-height:1.8; resize:vertical; transition:border-color .2s;} #reviews textarea#comment:focus{border-color:var(--teal); outline:none;} #reviews .form-submit{margin-top:4px;} #reviews .form-submit input#submit{background:var(--teal); color:#fff; border:none; border-radius:12px; padding:14px 30px; font-weight:700; font-size:13.5px; font-family:'Vazirmatn'; width:100%; cursor:pointer; transition:background .18s ease, transform .18s ease;} #reviews .form-submit input#submit:hover{background:var(--teal-deep); transform:translateY(-2px);} /* جلوگیری از اسکرول افقی ناخواسته در کل صفحه */ html, body{overflow-x:hidden; max-width:100vw;} /* ========================================================= ریسپانسیو تبلت و دسکتاپ طراحی موبایل پایه (بالا) دست‌نخورده می‌ماند؛ این بخش فقط برای صفحه‌نمایش‌های بزرگ‌تر (تبلت ۷۶۸ به بالا، دسکتاپ ۱۰۲۴ به بالا) چیدمان را باز و چندستونه می‌کند. ========================================================= */ /* ---------- تبلت (۷۶۸ پیکسل به بالا) ---------- */ @media (min-width:768px){ .app{max-width:100%; padding-bottom:0;} .site-header, .topnav{padding-inline:28px;} .header-top{max-width:1200px; margin:0 auto; width:100%;} #jc-menu-toggle{display:none;} /* در دسکتاپ به‌جای دکمه‌ی همبرگر موبایل، دکمه‌ی مگامنو استفاده می‌شود */ .jc-desktop-only{display:flex;} .jc-account-name{display:inline;} .search{max-width:1200px; margin:0 auto 10px;} .menu-strip{display:none;} /* در دسکتاپ به‌جای نوار ساده، مگامنو نمایش داده می‌شود */ /* ---------- مگامنو (دسته‌بندی کالاها) ---------- */ .jc-megamenu-wrap{display:flex; align-items:center; gap:18px; justify-content:flex-start; max-width:1200px; margin:0 auto; position:relative; padding:0 28px 12px;} .jc-quicklinks{display:flex; align-items:center; gap:16px; font-size:12.5px; font-weight:600; color:var(--ink); flex-wrap:wrap;} .jc-quicklinks a{position:relative; padding-inline-start:16px;} .jc-quicklinks a::before{content:'|'; position:absolute; right:0; color:var(--line); font-weight:400;} .jc-quicklinks a:first-child::before{content:'';} .jc-quick-highlight{color:var(--red) !important; font-weight:800 !important;} .jc-megamenu-trigger{background:var(--surface); color:var(--navy); border:1.5px solid var(--line); padding:10px 18px; border-radius:9px; font-size:12.5px; font-weight:700; font-family:'Vazirmatn'; display:flex; align-items:center; gap:8px; transition:background .15s;} .jc-megamenu-trigger:hover{background:var(--bg);} .jc-megamenu{display:none; position:absolute; top:calc(100% + 4px); right:28px; width:min(620px, calc(100% - 56px)); background:var(--surface); border:1px solid var(--line); border-radius:12px; box-shadow:0 14px 34px rgba(18,60,78,.18); overflow:hidden; z-index:50;} .jc-megamenu.open{display:flex;} .jc-mega-cats{width:190px; flex-shrink:0; background:var(--bg); padding:8px 0; max-height:360px; overflow-y:auto;} .jc-mega-cat-item{padding:11px 16px; font-size:12.5px; font-weight:600; color:var(--ink); cursor:pointer; border-inline-start:3px solid transparent; border-bottom:1px solid var(--line); display:flex; align-items:center; gap:7px;} .jc-mega-cat-item:last-child{border-bottom:none;} .jc-mega-cat-item.active{background:var(--surface); color:var(--teal-deep); border-inline-start-color:var(--teal-deep);} .jc-mega-panels{flex:1; padding:16px 18px; max-height:360px; overflow-y:auto;} .jc-mega-panel{display:none;} .jc-mega-panel.active{display:block;} .jc-mega-viewall{display:inline-block; font-size:12px; font-weight:700; color:var(--teal-deep); margin-bottom:12px; padding-bottom:10px; border-bottom:1px solid var(--line); width:100%;} .jc-mega-sub-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:4px;} .jc-mega-sub-grid a{font-size:12px; color:var(--ink); padding:8px 10px; border-radius:8px; display:flex; align-items:center; gap:6px;} .jc-mega-sub-grid a::before{content:'›'; color:var(--teal-deep); font-weight:800;} .jc-mega-sub-grid a:hover{background:var(--bg); color:var(--teal-deep);} .jc-mega-empty{font-size:12px; color:var(--ink-soft);} .cat-grid, .box, .static-page, .wc-page-wrap, .sec, .jc-blog-header, .jc-blog-grid, .jc-post-header, .jc-post-layout, .promo-sliders-row{max-width:1200px; margin-inline:auto; margin-top:14px;} .banner-slider{max-width:100%; margin:0; margin-top:14px; border-radius:0;} .banner{border-radius:0;} .banner{aspect-ratio:21/7.2; min-height:234px; padding:32px;} .banner h1{font-size:26px;} .banner p{font-size:13px;} .cat-grid{grid-template-columns:repeat(7,1fr);} /* دو اسلایدر تبلیغاتی کوچک — دسکتاپ/تبلت: کنار هم، ارتفاع کم */ .promo-sliders-row{grid-template-columns:1fr 1fr; gap:16px;} .banner-slider.small{border-radius:10px;} .banner-slider.small .banner{border-radius:10px; aspect-ratio:21/9; min-height:150px; padding:22px;} .banner-slider.small h1{font-size:19px;} .banner-slider.small p{font-size:11.5px;} .grid{max-width:1200px; margin-inline:auto; grid-template-columns:repeat(3, 1fr); padding:0; direction:rtl;} .grid2{grid-template-columns:repeat(2,1fr); gap:14px;} /* محصولات مرتبط: ۳ کارت هم‌عرض در حالت تبلت */ .related.products ul.products li.product, .related.products ul.products > .card{width:calc((100% - 40px) / 3) !important; flex:0 0 calc((100% - 40px) / 3) !important;} .p-slider{gap:14px;} .p-slider .card{width:170px;} .subcat-strip, .toolbar, .active-filters, .jc-filters-panel{max-width:1200px; margin-inline:auto; padding-inline:0;} /* پنل فیلتر در دسکتاپ: دسته‌بندی/برند کنار مرتب‌سازی، رنج قیمت پنهان */ .subcat-strip, .toolbar, .active-filters, .jc-filters-panel{max-width:1200px; margin-inline:auto; padding-inline:0;} .toolbar{padding:0 0 12px; display:flex; justify-content:flex-start; align-items:center; gap:16px; flex-wrap:nowrap; flex-grow:1;} .toolbar .filter-btn{display:none;} .toolbar .sort{margin-inline-start:auto;} .toolbar .jc-filters-panel{max-height:none; overflow:visible; width:auto; order:0; margin:0; padding:0; display:flex; background:transparent; border:none;} .toolbar .jc-filters-form{background:transparent; border:none; border-radius:0; padding:0; margin:0; display:flex; width:auto; flex-grow:0;} .toolbar .jc-filters-row{flex-direction:row; align-items:center; gap:14px; justify-content:flex-start; margin:0; padding:0; width:auto;} .toolbar .jc-filter-price-col{display:none;} .toolbar .jc-filter-grid{display:grid; width:auto; grid-template-columns:repeat(3, 1fr); gap:14px; margin:0; padding:0;} .toolbar .jc-filter-grid .jc-filter-block{min-width:130px;} .toolbar .jc-filter-actions{display:none; margin-top:0;} .toolbar{padding:0 0 12px;} /* منوی پایین موبایل، دکمه‌ی شناور، و نوار خرید ثابت فقط برای موبایل معنی دارند؛ در تبلت/دسکتاپ مخفی می‌شوند (در دسکتاپ به‌جای نوار ثابت، دکمه‌ی افزودن به سبد داخل باکس قیمت است) */ .tabbar, .jc-ask-fab, .buybar{display:none;} .app{padding-bottom:0; min-height:0;} .site-footer-desktop{display:block; background:var(--navy); color:#EAF4F5; margin-top:20px;} .jc-mobile-newsletter{display:none;} .sfd-inner{max-width:1200px; margin:0 auto; padding:36px 28px; display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr 1fr; gap:24px;} .sfd-col .logo{font-size:18px; font-weight:800; color:#fff; margin-bottom:10px;} .sfd-col .logo span{color:var(--teal);} .sfd-col p{font-size:11.5px; color:#B9CDD4; line-height:1.9; margin:0 0 6px;} .sfd-col h5{font-size:12px; font-weight:700; color:#fff; margin:0 0 12px;} .sfd-col a{display:block; font-size:12px; color:#B9CDD4; padding:5px 0; transition:color .15s, transform .15s;} .sfd-col a:hover{color:var(--teal); transform:translateX(-3px);} .sfd-col .sfd-static{display:block; font-size:12px; color:#B9CDD4; padding:5px 0;} .sfd-social{display:flex; gap:10px; margin-top:12px;} .sfd-social a{font-size:16px; padding:0; width:34px; height:34px; border-radius:50%; background:rgba(255,255,255,.08); display:flex; align-items:center; justify-content:center; transition:background .15s, color .15s;} .sfd-social a:hover{background:var(--teal); color:#fff; transform:none;} .sfd-newsletter{max-width:1200px; margin:0 auto; padding:20px 28px; display:flex; align-items:center; justify-content:space-between; gap:16px; border-top:1px solid rgba(255,255,255,.1); flex-wrap:wrap;} .sfd-newsletter-label h5{margin:0 0 4px; font-size:14px; font-weight:800; color:#fff;} .sfd-newsletter-label p{margin:0; font-size:12.5px; color:#B9CDD4; font-weight:600;} .sfd-newsletter-body{flex:0 0 auto;} .sfd-newsletter-form{display:flex; gap:0; flex:0 0 auto;} .sfd-newsletter-form input{width:260px; border:1px solid rgba(255,255,255,.15); background:rgba(255,255,255,.06); color:#fff; padding:10px 14px; border-radius:0 10px 10px 0; font-family:'Vazirmatn'; font-size:12px; outline:none; transition:border-color .15s, background .15s;} .sfd-newsletter-form input:focus{border-color:var(--teal); background:rgba(255,255,255,.1); box-shadow:0 0 0 3px rgba(31,167,184,.25);} .sfd-newsletter-form input::placeholder{color:#7C93A0;} .sfd-newsletter-form button{border:none; background:var(--teal); color:#fff; font-weight:700; padding:10px 22px; border-radius:10px 0 0 10px; cursor:pointer; transition:background .15s;} .sfd-newsletter-form button:hover{background:var(--teal-deep);} .sfd-newsletter-form button:disabled{opacity:.7; cursor:default;} .jc-nl-msg-box:empty{display:none;} .jc-nl-msg{width:100%; margin:0 0 6px !important; font-size:12px !important; font-weight:700 !important;} .jc-nl-msg--ok{color:#6EE7B7 !important;} .jc-nl-msg--error{color:#FCA5A5 !important;} .sfd-trust{max-width:1200px; margin:0 auto; padding:18px 28px; display:grid; grid-template-columns:repeat(5,1fr); gap:14px; border-top:1px solid rgba(255,255,255,.1);} .sfd-trust-item{display:flex; align-items:center; gap:8px; font-size:11.5px; color:#EAF4F5; font-weight:600;} .sfd-trust-item .ic{width:30px; height:30px; flex:0 0 auto; border-radius:50%; background:rgba(255,255,255,.08); display:flex; align-items:center; justify-content:center;} .sfd-trust-item .ic svg{width:15px; height:15px; color:var(--teal);} .sfd-bottom{display:flex; align-items:center; justify-content:space-between; font-size:10.5px; color:#7C93A0; border-top:1px solid rgba(255,255,255,.1); padding:14px 28px; max-width:1200px; margin:0 auto;} .sfd-payments{display:flex; gap:10px;} .sfd-payments span{background:rgba(255,255,255,.08); border-radius:6px; padding:4px 10px; font-size:10px; color:#EAF4F5;} .jc-scroll-top{position:fixed; bottom:24px; left:24px; width:42px; height:42px; border-radius:50%; background:var(--teal); color:#fff; border:none; display:none; align-items:center; justify-content:center; cursor:pointer; box-shadow:0 4px 14px rgba(0,0,0,.2); z-index:99; transition:background .15s;} .jc-scroll-top.show{display:flex;} .jc-scroll-top:hover{background:var(--teal-deep);} /* آیکون سبد خرید/حساب در خود هدر (چون تب‌بار پایین دیگر نیست) */ .header-top .desktop-cart-link{display:inline-flex;} } /* ---------- لپ‌تاپ (۱۰۲۴ پیکسل به بالا) ---------- */ @media (min-width:1024px){ .cat-grid{grid-template-columns:repeat(9,1fr);} .grid2{grid-template-columns:repeat(3,1fr); gap:18px;} .p-info h1{font-size:24px; line-height:1.5;} .p-price-now{font-size:30px;} /* دکمه‌ی خرید تمام‌عرض و بلندتر، با گرادینت فیروزه‌ای */ .p-info-cart-btn{height:56px; font-size:15px; background:linear-gradient(135deg, var(--teal), var(--teal-deep));} .p-qty{border-radius:14px;} .p-qty button{height:56px; width:44px; font-size:18px;} /* محصولات مرتبط: اسلایدر تمام‌عرض با دقیقاً ۴ کارت هم‌عرض در دسکتاپ */ .related.products ul.products{gap:20px;} .related.products ul.products li.product, .related.products ul.products > .card{width:calc((100% - 60px) / 4) !important; flex:0 0 calc((100% - 60px) / 4) !important;} /* صفحه تک محصول: گالری و اطلاعات کنار هم، با ارتفاع یکسان و پس‌زمینه‌ی یکپارچه (بدون فضای خالی) */ /* صفحه تک محصول: چیدمان فشرده‌تر شبیه دیجی‌کالا — عکس کوچیک‌تر، باکس قیمت با قاب و دکمه‌ی خرید */ .p-top{display:flex; gap:20px; max-width:1200px; margin:14px auto 0; align-items:flex-start;} .p-top .gallery{width:50%; max-width:none; margin:0;} .p-top .gallery .woocommerce-product-gallery__wrapper img, .p-top .gallery .woocommerce-product-gallery__image > a > img{aspect-ratio:auto; height:360px; object-fit:cover; width:100%;} .p-top .p-info{width:50%; max-width:none; margin:0; padding:24px 26px; border:1px solid var(--line); border-radius:16px; background:var(--surface); box-shadow:0 2px 12px rgba(29,42,48,.06); border-bottom:none;} .p-info-cart-btn{display:block; text-align:center; margin-top:16px; padding:13px; background:var(--teal); color:#fff; font-weight:700; font-size:14px; border-radius:10px; text-decoration:none;} .p-info-cart-btn:hover{background:var(--teal-deep);} .specs, .trust-row, .tab-content{max-width:1200px; margin-inline:auto;} /* صفحه تسویه‌حساب: فرم و خلاصه‌ی سفارش کنار هم */ .wc-page-wrap{display:flex; flex-wrap:wrap; gap:20px; align-items:flex-start;} .wc-page-wrap > form{flex:1 1 60%;} .wc-page-wrap .order-review, .wc-page-wrap #order_review{flex:1 1 35%; background:var(--bg); border-radius:10px; padding:16px; position:sticky; top:80px;} } @media (min-width:600px) and (max-width:767px){ .app{border-inline:1px solid var(--line);} } /* =================================================== هماهنگ‌سازی با ووکامرس از این‌جا به بعد، فقط override های هدفمند برای بخش‌هایی از ووکامرس هستن که الان (بعد از حذف فیلتر woocommerce_enqueue_styles در functions.php) دوباره با CSS پیش‌فرض خودش لود می‌شن. هدف اینجا بازسازی کامل نیست؛ فقط هماهنگ کردن رنگ/فونت/سایز با پالت قالب (navy/teal) و رفع تداخل‌های واقعی (نه استایل‌دهی از صفر). =================================================== */ /* گالری تصویر محصول: نوار تامبنیل + زوم/لایت‌باکس */ .gallery .flex-control-thumbs{display:flex; gap:10px; padding:12px 0 0; margin:0; list-style:none; overflow-x:auto;} .gallery .flex-control-thumbs li{flex:0 0 78px;} .gallery .flex-control-thumbs img{width:78px; height:78px; object-fit:cover; border-radius:12px; border:2px solid transparent; opacity:.65; cursor:pointer; transition:transform .22s ease, opacity .22s ease, border-color .22s ease;} .gallery .flex-control-thumbs img:hover{opacity:.9; transform:scale(1.04);} .gallery .flex-control-thumbs img.flex-active{opacity:1; border-color:var(--teal); transform:scale(1.06);} .gallery .flex-direction-nav a{position:absolute; top:50%; margin-top:-18px; width:36px; height:36px; border-radius:50%; background:#fff; box-shadow:0 2px 10px rgba(29,42,48,.15); display:flex; align-items:center; justify-content:center; z-index:5; opacity:0; transition:opacity .2s ease, transform .2s ease;} .gallery:hover .flex-direction-nav a{opacity:1;} .gallery .flex-direction-nav a:hover{transform:scale(1.08);} .gallery .flex-direction-nav .flex-prev{right:12px;} .gallery .flex-direction-nav .flex-next{left:12px;} .gallery .flex-direction-nav a:before{color:var(--navy); font-size:16px;} .gallery .woocommerce-product-gallery__trigger{display:none;} .pswp__bg{background:var(--navy);} .pswp__button, .pswp__counter{color:#fff;} /* بج تخفیف (onsale) */ .onsale{background:var(--red); color:#fff; font-size:10.5px; font-weight:800; border-radius:20px; padding:3px 10px; top:10px; right:10px; left:auto; min-height:auto; line-height:1.6;} /* پیام‌های ووکامرس (موفقیت/خطا/اطلاع) */ .woocommerce-message, .woocommerce-error, .woocommerce-info, .woocommerce-noreviews, p.no-comments{ background:var(--surface); border-top:3px solid var(--teal); border-radius:10px; padding:12px 14px; font-size:12.5px; color:var(--ink); list-style:none; box-shadow:0 2px 10px rgba(18,60,78,.06); margin:0 0 14px; } .woocommerce-error{border-top-color:var(--red);} .woocommerce-message .button, .woocommerce-error .button, .woocommerce-info .button{ background:var(--navy); color:#fff; border-radius:8px; padding:6px 14px; font-size:11.5px; font-weight:700; } /* جعبه‌ی تعداد (input عددی پیش‌فرض ووکامرس، توی فرم افزودن به سبد محصولات متغیر) */ .woocommerce-variation-add-to-cart-button{flex:1; display:flex;} .woocommerce-variation-add-to-cart-button .single_add_to_cart_button{flex:1; white-space:nowrap;} .variants .single_add_to_cart_button{ background:var(--teal) !important; color:#fff !important; border:none; border-radius:12px; height:48px; font-weight:700; font-size:13.5px; flex:1 1 auto; transition:background .18s ease, transform .18s ease; } .variants .single_add_to_cart_button:hover{background:var(--teal-deep) !important; transform:translateY(-2px);} .variants .reset_variations{font-size:11px; color:var(--teal-deep); font-weight:600;} /* جدول انتخاب ویژگی‌ها (رنگ/سایز) توی محصول متغیر */ .variants table.variations{width:100%; border-collapse:collapse;} .variants table.variations tr{display:block; margin-bottom:14px;} .variants table.variations tr:last-child{margin-bottom:0;} .variants table.variations td{padding:0; display:block;} .variants table.variations label{font-size:12.5px; font-weight:700; color:var(--ink); display:block; margin-bottom:8px;} /* تب مشخصات/نظرات: عنوان‌ها هماهنگ با پالت */ .tab-content h2{font-size:13.5px; color:var(--navy); margin:0 0 10px;} .tab-content .commentlist{list-style:none; padding:0; margin:0;} /* محصولات مرتبط: خنثی کردن مارک‌آپ پیش‌فرض ووکامرس داخل اسلایدر مرتبط */ .p-slider ul.products{display:flex; gap:10px; overflow-x:auto; list-style:none; padding:0; margin:0;} .p-slider ul.products li.product{flex:0 0 150px;} /* ---------- دسکتاپ واقعی (۱۲۸۰ پیکسل به بالا): ۴ کارت در ردیف صفحه‌ی فروشگاه ---------- */ @media (min-width:1280px){ .grid2{grid-template-columns:repeat(4,1fr); gap:20px;} } /* ---------- بازطراحی کارت محصول (صفحه‌ی فروشگاه/دسته‌بندی/پرفروش‌ترین‌ها) ---------- */ .card{transition:transform .25s ease, box-shadow .25s ease;} .card:hover{transform:scale(1.02); box-shadow:0 10px 26px rgba(29,42,48,.12); z-index:1;} .card .off-badge{top:10px; right:10px; border-radius:8px; padding:4px 9px; font-size:10px; box-shadow:0 2px 6px rgba(225,72,63,.35);} .jc-wishlist-btn{top:10px; left:10px; transition:transform .2s ease, color .2s ease, box-shadow .2s ease;} .jc-wishlist-btn:hover{transform:scale(1.12); box-shadow:0 4px 12px rgba(18,60,78,.22);} /* دایره‌های انتخاب رنگ (جایگزین سلکت پیش‌فرض ووکامرس) */ .jc-color-swatches{display:flex; flex-wrap:wrap; gap:10px; margin-top:4px;} .jc-color-swatch{width:34px; height:34px; border-radius:50%; border:2px solid var(--line); cursor:pointer; transition:transform .18s ease, border-color .18s ease; box-shadow:0 1px 4px rgba(29,42,48,.12);} .jc-color-swatch:hover{transform:scale(1.1);} .jc-color-swatch.selected{border-color:var(--teal); box-shadow:0 0 0 2px #fff, 0 0 0 4px var(--teal);} /* ---------- بلاک‌های سبد خرید و پرداخت ووکامرس (WooCommerce Blocks) ---------- */ .wp-block-woocommerce-cart, .wp-block-woocommerce-checkout{font-family:'Vazirmatn'; direction:rtl;} /* کارت‌های اصلی (ستون محصولات و ستون خلاصه‌ی سفارش) */ .wc-block-cart, .wc-block-checkout, .wc-block-components-main, .wc-block-components-sidebar{ background:var(--surface); border-radius:16px; box-shadow:0 2px 12px rgba(29,42,48,.05); padding:18px; margin-bottom:14px; } .wc-block-components-sidebar{background:var(--bg); box-shadow:none;} /* عنوان‌ها (خلاصه‌ی سفارش، اطلاعات تماس، آدرس حمل و نقل) */ .wc-block-components-title, .wc-block-checkout__title, .wc-block-components-totals-wrapper h2, .wc-block-checkout__form h2, .wc-block-components-checkout-step__title{ font-size:14px !important; font-weight:800 !important; color:var(--navy); } /* ردیف محصولات سبد خرید */ .wc-block-cart-items__row, .wc-block-cart-item{border-bottom:1px solid var(--line); padding:14px 0;} .wc-block-components-product-name{font-size:12.5px; font-weight:600; color:var(--ink);} .wc-block-components-product-metadata{font-size:11px; color:var(--ink-soft);} .wc-block-cart-item__image img, .wc-block-components-product-image img{border-radius:12px;} .wc-block-components-product-price, .wc-block-components-formatted-money-amount{font-weight:800; color:var(--navy);} /* شمارشگر تعداد */ .wc-block-components-quantity-selector{border:1.5px solid var(--line); border-radius:12px; overflow:hidden;} .wc-block-components-quantity-selector__button{background:#fff;} /* دکمه‌ها (ادامه‌ی خرید، ثبت سفارش) */ .wc-block-components-button, .wc-block-cart__submit-button, .wc-proceed-to-checkout .wc-block-components-button{ background:var(--teal) !important; color:#fff !important; border:none !important; border-radius:12px !important; height:50px !important; font-weight:700 !important; font-size:13.5px !important; transition:background .18s ease, transform .18s ease !important; } .wc-block-components-button:hover{background:var(--teal-deep) !important; transform:translateY(-2px);} .wc-block-components-button.wc-block-components-button--outlined{ background:transparent !important; color:var(--teal-deep) !important; border:1.5px solid var(--teal) !important; } /* ---------- بازطراحی صفحه‌ی پرداخت (Checkout Block) ---------- */ /* رفع مشکل: لیبل روی متن تایپ‌شده نمی‌افته و همیشه بالای کادر ثابت می‌مونه */ .wc-block-components-text-input{position:relative; margin-bottom:16px; display:flex; flex-direction:column;} .wc-block-components-text-input label{ position:static !important; transform:none !important; display:block; order:-1; font-size:12px; font-weight:600; color:var(--ink); margin-bottom:6px; padding:0 !important; } .wc-block-components-text-input input, .wc-block-components-address-form input, .wc-block-components-combobox input, select.wc-block-components-select-input__select{ height:50px !important; border:1.5px solid var(--line) !important; border-radius:12px !important; padding:0 14px !important; font-family:'Vazirmatn'; font-size:13px; margin-top:0 !important; } .wc-block-components-text-input input:focus, .wc-block-components-address-form input:focus{ border-color:var(--teal) !important; outline:none; box-shadow:0 0 0 3px rgba(31,167,184,.12); } /* عنوان بخش‌ها (اطلاعات تماس، آدرس حمل‌ونقل، پرداخت) */ .wc-block-components-checkout-step__title{ font-size:15px !important; font-weight:800 !important; color:var(--navy); margin-bottom:16px !important; display:flex; align-items:center; gap:8px; } .wc-block-components-checkout-step{ background:var(--surface); border-radius:16px; box-shadow:0 2px 12px rgba(29,42,48,.05); padding:22px; margin-bottom:16px; } /* گزینه‌های ارسال/پرداخت: کارت انتخابی مدرن (رفع باگ همپوشانی دایره‌ی رادیو در RTL) */ .wc-block-components-radio-control__option{ position:relative !important; display:flex !important; align-items:center; gap:12px; border:1.5px solid var(--line) !important; border-radius:14px !important; padding:16px !important; margin-bottom:10px; cursor:pointer; transition:border-color .2s ease, background .2s ease; } .wc-block-components-radio-control__option:hover{border-color:var(--teal);} .wc-block-components-radio-control__input{ appearance:none; -webkit-appearance:none; -moz-appearance:none; position:static !important; margin:0 !important; flex-shrink:0; width:20px; height:20px; border:2px solid var(--line); border-radius:50%; cursor:pointer; background:#fff; } .wc-block-components-radio-control__input:checked{ border-color:var(--teal); background:radial-gradient(circle, var(--teal) 42%, #fff 44%); } .wc-block-components-radio-control__option:has(.wc-block-components-radio-control__input:checked){ border-color:var(--teal); background:#EAF6F8; } .wc-block-components-radio-control__label{flex:1; font-size:13px; font-weight:600; color:var(--ink);} .wc-block-components-radio-control__description{font-size:11px; color:var(--ink-soft);} .wc-block-components-radio-control__secondary-label{font-weight:800; color:var(--navy);} /* خلاصه‌ی سفارش: کارت شناور با سایه‌ی نرم */ .wc-block-components-order-summary{ background:var(--surface); border-radius:16px; box-shadow:0 4px 20px rgba(29,42,48,.08); padding:20px; } .wc-block-components-order-summary-item__image img{border-radius:12px !important;} .wc-block-components-totals-footer-item .wc-block-components-totals-item__value{ font-size:18px !important; font-weight:800 !important; color:var(--navy) !important; } /* باکس کد تخفیف، شیک‌تر */ .wc-block-components-totals-coupon{border-top:1px solid var(--line); padding-top:14px; margin-top:10px;} .wc-block-components-totals-coupon input{height:44px !important;} .wc-block-components-totals-coupon .wc-block-components-button{height:44px !important;} /* دکمه‌ی نهایی «ثبت سفارش» — بزرگ، تمام‌عرض، فیروزه‌ای */ .wc-block-components-checkout-place-order-button{ width:100% !important; height:56px !important; font-size:15px !important; border-radius:14px !important; background:linear-gradient(135deg, var(--teal), var(--teal-deep)) !important; box-shadow:0 6px 20px rgba(31,167,184,.3) !important; } /* موبایل: فاصله‌ی راحت */ @media (max-width:1023px){ .wc-block-components-checkout-step{padding:16px;} } /* خلاصه‌ی جمع کل سفارش */ .wc-block-components-totals-item{padding:8px 0; font-size:12.5px;} .wc-block-components-totals-footer-item{font-size:15px; font-weight:800; color:var(--navy);} /* باکس کد تخفیف */ .wc-block-components-totals-coupon .wc-block-components-panel__button{font-size:12px; font-weight:600; color:var(--teal-deep);} /* جست‌وجوی زنده‌ی محصول در فرم عمومی «سوال خود را بپرس» */ .jc-product-search-wrap{position:relative; margin-bottom:10px;} .jc-product-search-wrap input[type="text"]{width:100%; border:1.5px solid var(--line); border-radius:12px; padding:12px 14px; font-family:'Vazirmatn'; font-size:12.5px; margin-bottom:0; transition:border-color .2s;} .jc-product-search-wrap input[type="text"]:focus{border-color:var(--teal); outline:none;} .jc-product-search-results{display:none; position:absolute; top:calc(100% + 6px); right:0; left:0; background:#fff; border:1px solid var(--line); border-radius:12px; box-shadow:0 8px 24px rgba(29,42,48,.12); max-height:220px; overflow-y:auto; z-index:20;} .jc-product-search-results.show{display:block;} .jc-product-search-item{padding:11px 14px; font-size:12.5px; cursor:pointer; border-bottom:1px solid var(--line);} .jc-product-search-item:last-child{border-bottom:none;} .jc-product-search-item:hover{background:var(--bg);} .jc-product-search-empty{padding:14px; font-size:12px; color:var(--ink-soft); text-align:center;} /* متن «شما به‌عنوان مهمان...» و چک‌باکس «حساب کاربری بسازید» در صفحه‌ی پرداخت */ #wc-guest-checkout-notice.wc-block-checkout__guest-checkout-notice{ font-size:11.5px; color:var(--ink-soft); margin:0 0 10px; } .wc-block-checkout__create-account{margin-bottom:14px;} .wc-block-checkout__create-account .wc-block-components-checkbox__label{ font-size:12.5px; font-weight:600; color:var(--ink); } .wc-block-checkout__create-account .wc-block-components-checkbox__input{ width:18px !important; height:18px !important; } .wc-block-checkout__create-account .wc-block-components-checkbox__mark{ width:18px; height:18px; } /* ---------- سبد خرید خالی (jc-empty-cart) ---------- */ .jc-empty-cart{ background:var(--surface); border-radius:16px; box-shadow:0 4px 20px rgba(18,60,78,.06); padding:40px 20px 32px; margin:16px 0 24px; text-align:center; display:flex; flex-direction:column; align-items:center; } .jc-empty-cart__icon{ width:120px; height:120px; margin-bottom:18px; } .jc-empty-cart__icon svg{width:100%; height:100%; display:block;} .jc-empty-cart__title{ font-size:18px; font-weight:800; color:var(--navy); margin-bottom:8px; } .jc-empty-cart__subtitle{ font-size:13px; color:var(--ink-soft); line-height:1.9; max-width:340px; margin:0 0 22px; } .jc-empty-cart__cta{ display:inline-flex; align-items:center; justify-content:center; background:linear-gradient(135deg, var(--teal), var(--teal-deep)); color:#fff; font-size:13.5px; font-weight:700; padding:13px 30px; border-radius:12px; box-shadow:0 6px 16px rgba(31,167,184,.28); transition:transform .2s ease, box-shadow .2s ease; } .jc-empty-cart__cta:hover, .jc-empty-cart__cta:active{ transform:translateY(-1px); box-shadow:0 8px 20px rgba(31,167,184,.36); } .jc-empty-cart__recommend{margin-top:8px;} @media (min-width:600px){ .jc-empty-cart{padding:56px 24px 44px; border-radius:16px;} .jc-empty-cart__icon{width:140px; height:140px;} .jc-empty-cart__title{font-size:21px;} .jc-empty-cart__subtitle{font-size:14px; max-width:420px;} } /* ---------- هماهنگ‌سازی بلوک «جدیدترین محصولات» ووکامرس با استایل کارت‌های سایت ---------- */ .wc-block-grid__products .wc-block-grid__product{ display:flex !important; flex-direction:column !important; background:var(--surface) !important; border:1px solid var(--line) !important; border-radius:16px !important; padding:14px !important; box-shadow:0 2px 10px rgba(29,42,48,.04) !important; text-align:center !important; } .wc-block-grid__products .wc-block-grid__product-price{ min-height:20px !important; } .wc-block-grid__products .wc-block-grid__product .wp-block-button.wc-block-grid__product-add-to-cart{ margin-top:auto !important; padding-top:10px !important; } .wc-block-grid__products .wc-block-grid__product-title{ font-family:'Vazirmatn', sans-serif !important; font-size:12.5px !important; font-weight:700 !important; color:var(--ink) !important; margin:10px 0 6px !important; line-height:1.6 !important; } .wc-block-grid__products .wc-block-grid__product-price, .wc-block-grid__products .wc-block-grid__product-price .woocommerce-Price-amount{ font-family:'Vazirmatn', sans-serif !important; font-size:14px !important; font-weight:800 !important; color:var(--navy) !important; } .wc-block-grid__products .wc-block-grid__product-rating{margin:6px auto !important;} .wc-block-grid__products .wc-block-grid__product .wp-block-button__link, .wc-block-grid__products .wc-block-grid__product .add_to_cart_button, .wc-block-grid__products .wc-block-grid__product .wc-block-components-product-button__button{ display:flex !important; align-items:center !important; justify-content:center !important; background:linear-gradient(135deg, var(--teal), var(--teal-deep)) !important; color:#fff !important; border:none !important; border-radius:12px !important; font-family:'Vazirmatn', sans-serif !important; font-size:12px !important; font-weight:700 !important; padding:12px !important; box-shadow:none !important; text-shadow:none !important; width:100% !important; } /* =================================================== وبلاگ — لیست پست‌ها، کارت پست، صفحه‌ی تک‌مقاله =================================================== */ /* هدر صفحه‌ی لیست وبلاگ */ .jc-blog-header{padding:16px;} .jc-blog-title{font-size:var(--fs-h1); font-weight:800; color:var(--navy); margin:0;} /* شبکه‌ی کارت‌های وبلاگ */ .jc-blog-grid{display:grid; grid-template-columns:1fr; gap:16px; padding:0 16px 16px;} @media (min-width:700px){ .jc-blog-grid{grid-template-columns:repeat(2, 1fr);} } @media (min-width:1000px){ .jc-blog-grid{grid-template-columns:repeat(3, 1fr);} } .jc-post-card{background:var(--surface); border:1px solid var(--line); border-radius:16px; overflow:hidden; display:flex; flex-direction:column; transition:border-color .15s, transform .15s;} .jc-post-card:hover{border-color:var(--teal); transform:translateY(-2px);} .jc-post-card-thumb{position:relative; display:block; aspect-ratio:16/10; background:var(--bg); overflow:hidden;} .jc-post-card-thumb img{width:100%; height:100%; object-fit:cover; display:block;} .jc-post-card-thumb .thumb-placeholder{display:flex; align-items:center; justify-content:center; width:100%; height:100%; font-size:32px;} .jc-post-cat-badge{position:absolute; top:10px; inset-inline-start:10px; background:var(--teal); color:#fff; font-size:var(--fs-tiny); font-weight:700; padding:5px 10px; border-radius:20px;} .jc-post-card-body{padding:14px; display:flex; flex-direction:column; gap:8px; flex:1;} .jc-post-card-title{font-size:var(--fs-h3); font-weight:800; color:var(--ink); line-height:1.6;} .jc-post-card-excerpt{font-size:var(--fs-small); color:var(--ink-soft); line-height:1.8; margin:0; flex:1;} .jc-post-card-meta{display:flex; align-items:center; gap:12px; font-size:var(--fs-tiny); color:var(--ink-soft); border-top:1px solid var(--line); padding-top:10px;} /* هدر صفحه‌ی تک‌مقاله */ .jc-post-hero{width:100%; height:190px; background:var(--bg); overflow:hidden; border-radius:16px; margin:16px 0 18px;} .jc-post-hero img{width:100%; height:190px; object-fit:cover; display:block;} .jc-post-header{padding:14px 16px 0;} .jc-post-title{font-size:20px; font-weight:800; color:var(--navy); line-height:1.6; margin:0 0 10px;} .jc-post-meta{display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:0;} .jc-post-meta span{display:inline-flex; align-items:center; gap:5px; background:var(--bg); color:var(--ink-soft); font-size:var(--fs-tiny); font-weight:600; padding:6px 12px; border-radius:20px;} .jc-post-layout{display:flex; flex-direction:column; gap:20px; padding:6px 16px 20px;} /* چیدمان دوستونه: محتوا + سایدبار */ @media (min-width:900px){ .jc-post-layout{flex-direction:row-reverse; align-items:flex-start;} .jc-post-main{flex:1; min-width:0;} .jc-post-sidebar{width:300px; flex-shrink:0; position:sticky; top:16px; display:flex; flex-direction:column; gap:16px;} } /* تایپوگرافی متن مقاله */ .jc-post-content{font-size:var(--fs-body); line-height:2.1; color:var(--ink);} .jc-post-content h2{font-size:var(--fs-h2); font-weight:800; color:var(--navy); margin:28px 0 12px; scroll-margin-top:90px;} .jc-post-content h3{font-size:var(--fs-h3); font-weight:800; color:var(--navy); margin:22px 0 10px; scroll-margin-top:90px;} .jc-post-content p{margin:0 0 16px;} .jc-post-content ul, .jc-post-content ol{margin:0 0 16px; padding-inline-start:22px;} .jc-post-content li{margin-bottom:8px;} .jc-post-content img{max-width:100%; height:auto; border-radius:14px; margin:12px 0;} .jc-post-content blockquote{background:var(--bg); border-inline-start:4px solid var(--teal); border-radius:10px; padding:14px 18px; margin:16px 0; font-weight:600; color:var(--teal-deep);} .jc-post-content table{width:100%; border-collapse:collapse; margin:16px 0; font-size:var(--fs-small);} .jc-post-content th, .jc-post-content td{border:1px solid var(--line); padding:10px 12px; text-align:center;} .jc-post-content th{background:var(--bg); color:var(--navy); font-weight:700;} .jc-post-content a{color:var(--teal-deep); text-decoration:underline;} /* برچسب‌های پایین مقاله */ .jc-post-tags{display:flex; flex-wrap:wrap; gap:8px; margin-top:20px;} .jc-post-tags a{background:var(--bg); color:var(--ink-soft); font-size:var(--fs-tiny); padding:6px 12px; border-radius:20px; transition:background .15s, color .15s;} .jc-post-tags a:hover{background:var(--teal); color:#fff;} /* مقالات مرتبط */ .jc-related-posts{margin-top:32px;} .jc-section-title{font-size:var(--fs-h2); font-weight:800; color:var(--navy); margin:0 0 14px;} .jc-related-posts .jc-blog-grid{padding:0; grid-template-columns:1fr; } @media (min-width:600px){ .jc-related-posts .jc-blog-grid{grid-template-columns:repeat(2, 1fr);} } /* سایدبار: فهرست مطالب */ .jc-toc-card{background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:18px;} .jc-toc-card h3{font-size:var(--fs-h3); font-weight:800; color:var(--navy); margin:0 0 12px;} .jc-toc-list{display:flex; flex-direction:column; gap:2px; max-height:340px; overflow-y:auto;} .jc-toc-link{font-size:var(--fs-small); color:var(--ink-soft); padding:8px 10px; border-radius:8px; border-inline-start:2px solid transparent; transition:background .15s, color .15s, border-color .15s;} .jc-toc-link.jc-toc-level-3{padding-inline-start:22px; font-size:var(--fs-tiny);} .jc-toc-link:hover{background:var(--bg);} .jc-toc-link.active{color:var(--teal-deep); font-weight:700; border-inline-start-color:var(--teal); background:var(--bg);} /* سایدبار: کارت مشاوره */ .jc-cta-card{background:var(--navy); color:#fff; border-radius:16px; padding:22px; text-align:center;} .jc-cta-ic{width:52px; height:52px; border-radius:50%; background:rgba(255,255,255,.12); display:flex; align-items:center; justify-content:center; font-size:22px; margin:0 auto 12px;} .jc-cta-card h3{font-size:var(--fs-h3); font-weight:800; margin:0 0 8px;} .jc-cta-card p{font-size:var(--fs-small); opacity:.85; line-height:1.8; margin:0 0 16px;} .jc-cta-card .button{display:inline-block; background:var(--teal); color:#fff; border:none; border-radius:12px; padding:12px 20px; font-weight:700; font-size:var(--fs-small); width:100%;} .jc-cta-card .button:hover{background:var(--teal-deep);} /* نظرات مقاله */ .jc-post-comments{margin-top:32px; border-top:1px solid var(--line); padding-top:24px;} .jc-post-comments .comment-reply-title, .jc-post-comments .comments-title{font-size:var(--fs-h2); font-weight:800; color:var(--navy); margin:0 0 16px;} .jc-post-comments ol.comment-list{list-style:none; margin:0 0 24px; padding:0; display:flex; flex-direction:column; gap:14px;} .jc-post-comments .comment-body{background:var(--bg); border-radius:14px; padding:14px 16px;} .jc-post-comments .comment-author .fn{font-weight:700; color:var(--ink); font-style:normal;} .jc-post-comments .comment-metadata{font-size:var(--fs-tiny); color:var(--ink-soft); margin-bottom:8px;} .jc-post-comments .comment-metadata a{color:inherit;} .jc-post-comments p{font-size:var(--fs-small); color:var(--ink); line-height:1.9; margin:0;} .jc-post-comments ol.children{list-style:none; margin-inline-start:24px; padding:0; margin-top:14px; display:flex; flex-direction:column; gap:14px;} .jc-post-comments .comment-form input[type="text"], .jc-post-comments .comment-form input[type="email"], .jc-post-comments .comment-form input[type="url"], .jc-post-comments .comment-form textarea{width:100%; border:1.5px solid var(--line); border-radius:12px; padding:12px 14px; font-family:'Vazirmatn'; font-size:var(--fs-small); margin-bottom:12px;} .jc-post-comments .comment-form textarea{min-height:120px; resize:vertical;} .jc-post-comments .comment-form label{display:block; font-size:var(--fs-small); font-weight:600; color:var(--ink); margin-bottom:6px;} .jc-post-comments .comment-form-cookies-consent{display:flex; align-items:center; gap:8px; margin-bottom:14px; font-size:var(--fs-tiny); color:var(--ink-soft);} .jc-post-comments .comment-form-cookies-consent input{width:16px; height:16px; margin:0;} .jc-post-comments .form-submit input[type="submit"]{background:var(--teal); color:#fff; border:none; border-radius:12px; padding:13px 26px; font-weight:700; font-size:var(--fs-small); font-family:'Vazirmatn'; cursor:pointer; transition:background .18s ease, transform .18s ease;} .jc-post-comments .form-submit input[type="submit"]:hover{background:var(--teal-deep); transform:translateY(-2px);} /* اصلاح نهایی عرض محتوای مقاله در نمایشگر دسکتاپ/لپ‌تاپ (این بلاک عمداً در انتهای فایل است تا در ترتیب اعمال قوانین CSS همیشه برنده باشد؛ نقطه‌ی شکست ۷۶۸ پیکسل چون دقیقاً همون‌جاست که چیدمان کلی سایت به حالت دسکتاپ می‌رود) */ @media (min-width:768px){ .jc-blog-header, .jc-blog-grid, .jc-post-header, .jc-post-layout{ max-width:1200px !important; margin-inline:auto !important; } .jc-post-hero, .jc-post-hero img{ height:280px !important; } } /* ---------- صفحه تماس با ما ---------- */ .jc-contact-page{max-width:1200px; margin:0 auto; padding:18px 14px 40px;} .jc-contact-hero{text-align:center; padding:10px 6px 22px;} .jc-contact-hero h1{font-size:19px; font-weight:800; color:var(--navy); margin:0 0 8px;} .jc-contact-hero p{font-size:12.5px; color:var(--ink-soft); line-height:1.9; max-width:520px; margin:0 auto;} .jc-contact-cards{display:grid; grid-template-columns:1fr; gap:12px; margin-bottom:22px;} .jc-contact-card{display:block; background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:16px; text-decoration:none; color:inherit; transition:transform .15s ease, box-shadow .15s ease;} .jc-contact-card:active{transform:scale(.98);} .jc-contact-ic{width:44px; height:44px; border-radius:50%; background:rgba(31,167,184,.12); color:var(--teal-deep); display:flex; align-items:center; justify-content:center; margin-bottom:10px;} .jc-contact-card-title{font-size:13px; font-weight:700; color:var(--navy); margin-bottom:4px;} .jc-contact-card-text{font-size:11.5px; color:var(--ink-soft); line-height:1.8;} .jc-contact-grid{display:flex; flex-direction:column; gap:16px;} .jc-contact-map{width:100%; height:240px; border-radius:16px; overflow:hidden; border:1px solid var(--line);} .jc-contact-form-box{background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:18px;} .jc-contact-form-box h2{font-size:14.5px; font-weight:700; color:var(--navy); margin:0 0 6px;} .jc-contact-form-hint{font-size:11.5px; color:var(--ink-soft); margin:0 0 16px;} .jc-contact-alert{border-radius:10px; padding:11px 14px; font-size:12px; font-weight:600; margin-bottom:16px;} .jc-contact-alert--ok{background:rgba(31,167,184,.12); color:var(--teal-deep);} .jc-contact-alert--err{background:rgba(224,60,60,.1); color:var(--red);} .jc-contact-hp{position:absolute !important; left:-9999px !important; width:1px; height:1px; overflow:hidden;} .jc-contact-form-row{display:flex; flex-direction:column; gap:16px;} .jc-contact-field{margin-bottom:16px;} .jc-contact-field label{display:block; font-size:12px; font-weight:600; color:var(--ink); margin-bottom:8px;} .jc-contact-field input, .jc-contact-field textarea{ width:100%; border:1.5px solid var(--line); border-radius:10px; padding:12px 14px; font-family:'Vazirmatn'; font-size:12.5px; background:#fff; resize:vertical; transition:border-color .2s; } .jc-contact-field input:focus, .jc-contact-field textarea:focus{border-color:var(--teal); outline:none;} .jc-contact-submit{display:inline-flex; align-items:center; gap:8px; background:var(--teal); color:#fff; border:none; border-radius:10px; padding:13px 28px; font-weight:700; font-size:13px; font-family:'Vazirmatn'; cursor:pointer; transition:background .18s ease, transform .18s ease;} .jc-contact-submit:hover{background:var(--teal-deep); transform:translateY(-1px);} @media (min-width:640px){ .jc-contact-cards{grid-template-columns:repeat(2, 1fr);} .jc-contact-form-row{flex-direction:row;} .jc-contact-form-row .jc-contact-field{flex:1; margin-bottom:0;} } @media (min-width:1024px){ .jc-contact-cards{grid-template-columns:repeat(4, 1fr);} .jc-contact-grid{flex-direction:row; align-items:stretch;} .jc-contact-map{flex:1; height:auto;} .jc-contact-form-box{flex:1;} } /* ---------- صفحه درباره ما ---------- */ .jc-about-page{max-width:1200px; margin:0 auto; padding:18px 14px 40px;} .jc-about-placeholder{width:100%; height:100%; min-height:200px; border-radius:18px; background:linear-gradient(135deg, rgba(31,167,184,.12), rgba(18,60,78,.08)); border:1.5px dashed var(--line); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; color:var(--teal-deep); text-align:center; padding:20px;} .jc-about-placeholder span{font-size:11.5px; font-weight:600; color:var(--ink-soft); max-width:220px;} .jc-about-hero{display:flex; flex-direction:column; gap:22px; padding:16px 0 26px;} .jc-about-hero-media{order:-1;} .jc-about-hero-text h1{font-size:20px; font-weight:800; color:var(--navy); margin:0 0 4px;} .jc-about-tagline{font-size:13px; font-weight:700; color:var(--teal-deep); margin:0 0 12px;} .jc-about-desc{font-size:12.5px; line-height:2; color:var(--ink-soft); margin:0 0 18px;} .jc-about-badges{display:flex; flex-direction:column; gap:10px;} .jc-about-badge{display:flex; align-items:center; gap:8px; font-size:12px; font-weight:700; color:var(--navy);} .jc-about-badge svg{color:var(--teal-deep); flex-shrink:0;} .jc-about-stats{display:grid; grid-template-columns:repeat(2, 1fr); gap:12px; margin-bottom:26px;} .jc-about-stat{background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:16px; display:flex; flex-direction:column; align-items:center; text-align:center;} .jc-about-stat-ic{width:44px; height:44px; border-radius:50%; background:rgba(31,167,184,.12); color:var(--teal-deep); display:flex; align-items:center; justify-content:center; margin-bottom:8px;} .jc-about-stat-num{font-size:16px; font-weight:800; color:var(--navy);} .jc-about-stat-label{font-size:10.5px; color:var(--ink-soft); margin-top:3px; line-height:1.6;} .jc-about-story{display:flex; flex-direction:column; gap:20px; background:var(--surface); border:1px solid var(--line); border-radius:20px; padding:18px; margin-bottom:26px;} .jc-about-story-media{order:-1; min-height:180px;} .jc-about-eyebrow{font-size:11px; font-weight:700; color:var(--teal-deep);} .jc-about-story-text h2{font-size:16.5px; font-weight:800; color:var(--navy); margin:6px 0 10px;} .jc-about-story-text p{font-size:12.5px; line-height:2; color:var(--ink-soft); margin:0 0 16px;} .jc-about-cta{display:inline-flex; align-items:center; gap:8px; background:var(--teal); color:#fff; border:none; border-radius:10px; padding:12px 22px; font-weight:700; font-size:12.5px; text-decoration:none; transition:background .18s ease, transform .18s ease;} .jc-about-cta:hover{background:var(--teal-deep); transform:translateY(-1px);} .jc-about-features{display:flex; flex-direction:column; gap:14px; border-top:1px solid var(--line); padding-top:18px;} .jc-about-feature{display:flex; align-items:center; gap:12px;} .jc-about-feature-ic{width:38px; height:38px; border-radius:50%; background:rgba(18,60,78,.06); color:var(--navy); display:flex; align-items:center; justify-content:center; flex-shrink:0;} .jc-about-feature-title{font-size:12.5px; font-weight:700; color:var(--navy);} .jc-about-feature-text{font-size:11px; color:var(--ink-soft); margin-top:2px;} .jc-about-strip{display:grid; grid-template-columns:1fr; gap:14px; background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:18px;} .jc-about-strip-item{display:flex; align-items:center; gap:10px; color:var(--teal-deep);} .jc-about-strip-title{font-size:12px; font-weight:700; color:var(--navy);} .jc-about-strip-text{font-size:10.5px; color:var(--ink-soft); margin-top:2px;} @media (min-width:600px){ .jc-about-stats{grid-template-columns:repeat(4, 1fr);} .jc-about-strip{grid-template-columns:repeat(2, 1fr);} } @media (min-width:900px){ .jc-about-hero{flex-direction:row; align-items:center; gap:40px;} .jc-about-hero-media{order:0; flex:1;} .jc-about-hero-text{flex:1;} .jc-about-hero-media .jc-about-placeholder{min-height:320px;} .jc-about-story{flex-direction:row; align-items:stretch; padding:28px;} .jc-about-story-media{order:0; flex:1; min-height:auto;} .jc-about-story-text{flex:1.1;} .jc-about-features{flex:1; border-top:none; border-inline-start:1px solid var(--line); padding-top:0; padding-inline-start:24px; justify-content:center;} .jc-about-strip{grid-template-columns:repeat(4, 1fr);} } /* ---------- صفحه سوالات متداول ---------- */ .jc-faq-page{max-width:1200px; margin:0 auto; padding:18px 14px 40px;} .jc-faq-hero{display:flex; flex-direction:column; gap:20px; padding:16px 0 24px;} .jc-faq-hero-media{order:-1;} .jc-faq-hero-media .jc-about-placeholder{min-height:180px;} .jc-faq-hero-text h1{font-size:19px; font-weight:800; color:var(--navy); margin:0;} .jc-faq-underline{width:46px; height:3px; background:var(--teal); border-radius:3px; margin:8px 0 14px;} .jc-faq-hero-text p{font-size:12px; line-height:2; color:var(--ink-soft); margin:0 0 16px;} .jc-faq-search-box{display:flex; align-items:center; gap:8px; background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:0 14px; height:48px; box-shadow:0 4px 14px rgba(18,60,78,.06);} .jc-faq-search-box svg{color:var(--teal); flex-shrink:0;} .jc-faq-search-box input{flex:1; border:none; outline:none; background:none; font-family:'Vazirmatn'; font-size:12.5px; color:var(--ink);} .jc-faq-trust{display:grid; grid-template-columns:1fr; gap:12px; margin-bottom:22px;} .jc-faq-trust-item{display:flex; align-items:flex-start; gap:12px; background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:16px;} .jc-faq-trust-ic{width:40px; height:40px; border-radius:50%; background:rgba(31,167,184,.12); color:var(--teal-deep); display:flex; align-items:center; justify-content:center; flex-shrink:0;} .jc-faq-trust-title{font-size:12.5px; font-weight:700; color:var(--navy);} .jc-faq-trust-text{font-size:10.5px; color:var(--ink-soft); margin-top:3px; line-height:1.7;} .jc-faq-body{display:flex; flex-direction:column; gap:16px;} .jc-faq-side{background:var(--surface); border:1px solid var(--line); border-radius:18px; padding:22px; text-align:center;} .jc-faq-side-ic{width:54px; height:54px; border-radius:50%; background:rgba(31,167,184,.12); color:var(--teal-deep); display:flex; align-items:center; justify-content:center; margin:0 auto 14px;} .jc-faq-side h3{font-size:14px; font-weight:800; color:var(--navy); margin:0 0 6px;} .jc-faq-side > p{font-size:11.5px; color:var(--ink-soft); line-height:1.8; margin:0 0 16px;} .jc-faq-side-btn{display:inline-flex; align-items:center; gap:8px; background:var(--teal); color:#fff; border:none; border-radius:10px; padding:11px 22px; font-weight:700; font-size:12px; text-decoration:none; margin-bottom:18px; transition:background .18s ease;} .jc-faq-side-btn:hover{background:var(--teal-deep);} .jc-faq-side-info{list-style:none; margin:0; padding:16px 0 0; border-top:1px solid var(--line); display:flex; flex-direction:column; gap:12px;} .jc-faq-side-info li{display:flex; align-items:center; justify-content:center; gap:8px; font-size:11.5px; color:var(--ink); font-weight:600;} .jc-faq-side-info svg{color:var(--teal-deep); flex-shrink:0;} .jc-faq-tabs{display:flex; gap:8px; overflow-x:auto; margin-bottom:16px; padding-bottom:2px; scrollbar-width:none;} .jc-faq-tabs::-webkit-scrollbar{display:none;} .jc-faq-tab{flex-shrink:0; white-space:nowrap; background:var(--surface); border:1px solid var(--line); border-radius:999px; padding:9px 16px; font-size:12px; font-weight:600; color:var(--navy); cursor:pointer; font-family:'Vazirmatn'; transition:background .15s ease, color .15s ease;} .jc-faq-tab.active{background:var(--teal); color:#fff; border-color:transparent;} .jc-faq-list{display:flex; flex-direction:column; gap:10px;} .jc-faq-item{background:var(--surface); border:1px solid var(--line); border-radius:14px; overflow:hidden;} .jc-faq-q{width:100%; display:flex; align-items:center; justify-content:space-between; gap:10px; background:none; border:none; padding:15px 16px; font-family:'Vazirmatn'; font-size:12.5px; font-weight:700; color:var(--navy); text-align:right; cursor:pointer;} .jc-faq-toggle{position:relative; width:20px; height:20px; flex-shrink:0; border-radius:50%; background:rgba(31,167,184,.12);} .jc-faq-toggle::before, .jc-faq-toggle::after{content:''; position:absolute; top:50%; left:50%; background:var(--teal-deep); transform:translate(-50%,-50%);} .jc-faq-toggle::before{width:9px; height:1.6px;} .jc-faq-toggle::after{width:1.6px; height:9px; transition:transform .2s ease;} .jc-faq-item.is-open .jc-faq-toggle::after{transform:translate(-50%,-50%) rotate(90deg); opacity:0;} .jc-faq-a{max-height:0; overflow:hidden; padding:0 16px; font-size:12px; line-height:2; color:var(--ink-soft); transition:max-height .3s ease, padding .3s ease;} .jc-faq-item.is-open .jc-faq-a{max-height:300px; padding:0 16px 16px;} @media (min-width:600px){ .jc-faq-trust{grid-template-columns:repeat(2, 1fr);} } @media (min-width:900px){ .jc-faq-hero{flex-direction:row; align-items:center; gap:40px;} .jc-faq-hero-media{order:0; flex:1;} .jc-faq-hero-media .jc-about-placeholder{min-height:280px;} .jc-faq-hero-text{flex:1.2;} .jc-faq-trust{grid-template-columns:repeat(4, 1fr);} .jc-faq-body{flex-direction:row; align-items:flex-start;} .jc-faq-side{flex:0 0 260px; position:sticky; top:90px;} .jc-faq-main{flex:1;} } /* ---------- صفحه شرایط بازگشت کالا ---------- */ .jc-return-page{max-width:1200px; margin:0 auto; padding:18px 14px 40px;} .jc-return-hero{display:flex; flex-direction:column; gap:18px; padding:16px 0 24px;} .jc-return-hero-media{order:-1;} .jc-return-hero-media .jc-about-placeholder{min-height:180px;} .jc-return-hero-text h1{font-size:19px; font-weight:800; color:var(--navy); margin:0 0 10px;} .jc-return-hero-text p{font-size:12.5px; line-height:2; color:var(--ink-soft); margin:0;} .jc-return-quickcards{display:grid; grid-template-columns:1fr; gap:12px; margin-bottom:26px;} .jc-return-qc{display:flex; align-items:flex-start; gap:12px; background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:16px;} .jc-return-qc-ic{width:40px; height:40px; border-radius:50%; background:rgba(31,167,184,.12); color:var(--teal-deep); display:flex; align-items:center; justify-content:center; flex-shrink:0;} .jc-return-qc-title{font-size:12.5px; font-weight:700; color:var(--navy);} .jc-return-qc-text{font-size:10.5px; color:var(--ink-soft); margin-top:3px;} .jc-return-block{margin-bottom:26px;} .jc-return-block h2{font-size:15.5px; font-weight:800; color:var(--navy); text-align:center; margin:0 0 18px; position:relative; padding-bottom:12px;} .jc-return-block h2::after{content:''; position:absolute; bottom:0; right:50%; transform:translateX(50%); width:44px; height:3px; background:var(--teal); border-radius:3px;} .jc-return-cols{display:flex; flex-direction:column; gap:14px;} .jc-return-col{border-radius:16px; padding:18px; border:1px solid var(--line);} .jc-return-col--bad{background:rgba(224,60,60,.05);} .jc-return-col--good{background:rgba(31,167,184,.06);} .jc-return-col h3{display:flex; align-items:center; gap:8px; font-size:13.5px; font-weight:800; margin:0 0 14px;} .jc-return-col--bad h3{color:var(--red);} .jc-return-col--good h3{color:var(--teal-deep);} .jc-return-col ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px;} .jc-return-col li{display:flex; align-items:flex-start; justify-content:space-between; gap:10px; font-size:12px; line-height:1.8; color:var(--ink);} .jc-return-col--bad li svg{color:var(--red); flex-shrink:0; margin-top:2px;} .jc-return-col--good li svg{color:var(--teal-deep); flex-shrink:0; margin-top:2px;} .jc-return-steps{display:flex; flex-direction:column; gap:12px;} .jc-return-step{position:relative; background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:18px 16px 16px; text-align:center;} .jc-return-step-num{position:absolute; top:10px; left:12px; font-size:10.5px; font-weight:800; color:var(--line); } .jc-return-step-ic{width:42px; height:42px; border-radius:50%; background:rgba(31,167,184,.12); color:var(--teal-deep); display:flex; align-items:center; justify-content:center; margin:0 auto 10px;} .jc-return-step-title{font-size:12.5px; font-weight:700; color:var(--navy); margin-bottom:4px;} .jc-return-step-text{font-size:10.5px; color:var(--ink-soft); line-height:1.7;} .jc-return-notes{display:flex; flex-direction:column; gap:14px; margin-bottom:26px;} .jc-return-note-box{background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:18px;} .jc-return-note-box h3{display:flex; align-items:center; gap:8px; font-size:13px; font-weight:800; color:var(--navy); margin:0 0 12px;} .jc-return-note-box h3 svg{color:var(--teal-deep);} .jc-return-note-box ul{margin:0; padding-right:18px; display:flex; flex-direction:column; gap:8px;} .jc-return-note-box li{font-size:12px; line-height:1.9; color:var(--ink-soft);} .jc-return-cta{background:var(--surface); border:1px solid var(--line); border-radius:20px; padding:24px 18px; text-align:center;} .jc-return-cta-ic{width:56px; height:56px; border-radius:50%; background:rgba(31,167,184,.12); color:var(--teal-deep); display:inline-flex; align-items:center; justify-content:center; margin-bottom:14px;} .jc-return-cta-text h3{font-size:15px; font-weight:800; color:var(--navy); margin:0 0 6px;} .jc-return-cta-text p{font-size:12px; color:var(--ink-soft); margin:0 0 18px;} .jc-return-cta-tiles{display:flex; flex-direction:column; gap:10px;} .jc-return-cta-tile{display:flex; align-items:center; gap:10px; background:#fff; border:1px solid var(--line); border-radius:12px; padding:12px 14px; text-decoration:none; color:var(--navy);} .jc-return-cta-tile svg{color:var(--teal-deep); flex-shrink:0;} .jc-return-cta-tile-title{font-size:11.5px; font-weight:700;} .jc-return-cta-tile-text{font-size:11px; color:var(--ink-soft); margin-top:2px;} @media (min-width:600px){ .jc-return-quickcards{grid-template-columns:repeat(2, 1fr);} .jc-return-cols{flex-direction:row;} .jc-return-col{flex:1;} .jc-return-notes{flex-direction:row;} .jc-return-note-box{flex:1;} .jc-return-cta-tiles{flex-direction:row;} .jc-return-cta-tile{flex:1;} } @media (min-width:900px){ .jc-return-hero{flex-direction:row; align-items:center; gap:40px;} .jc-return-hero-media{order:0; flex:1;} .jc-return-hero-media .jc-about-placeholder{min-height:280px;} .jc-return-hero-text{flex:1.2;} .jc-return-quickcards{grid-template-columns:repeat(4, 1fr);} .jc-return-steps{flex-direction:row;} .jc-return-step{flex:1;} .jc-return-cta{display:flex; align-items:center; gap:24px; text-align:right; padding:26px 30px;} .jc-return-cta-ic{margin-bottom:0;} .jc-return-cta-text{flex-shrink:0;} .jc-return-cta-text p{margin-bottom:0;} .jc-return-cta-tiles{flex:1; flex-direction:row;} } /* ---------- عکس هیرو محصولات (درباره ما / سوالات متداول / شرایط بازگشت کالا) ---------- */ .jc-about-hero-media, .jc-faq-hero-media, .jc-return-hero-media{ border-radius:18px; overflow:hidden; background:linear-gradient(135deg, #eef6f8, #f7fbfc); display:flex; align-items:center; justify-content:center; min-height:170px; } .jc-hero-img{width:100%; height:100%; object-fit:contain; display:block;} /* ---------- دکمه‌ی ثبت درخواست بازگشت (هیرو + کارت مرحله‌ی ۱) ---------- */ .jc-return-hero-cta{display:inline-flex; align-items:center; gap:8px; background:var(--teal); color:#fff; border:none; border-radius:10px; padding:13px 26px; font-weight:700; font-size:12.5px; text-decoration:none; margin-top:16px; transition:background .18s ease, transform .18s ease;} .jc-return-hero-cta:hover{background:var(--teal-deep); transform:translateY(-1px);} .jc-return-step--action{text-decoration:none; color:inherit; display:block; cursor:pointer; transition:border-color .15s ease, transform .15s ease;} .jc-return-step--action:hover{border-color:var(--teal); transform:translateY(-2px);} #jc-return-form{scroll-margin-top:90px;} .jc-return-form-box{background:var(--surface); border:1px solid var(--line); border-radius:18px; padding:22px; margin-bottom:26px;} .jc-return-form-box h2{font-size:15.5px; font-weight:800; color:var(--navy); margin:0 0 6px; text-align:right; padding-bottom:0;} .jc-return-form-box h2::after{display:none;} .jc-contact-field select{ width:100%; border:1.5px solid var(--line); border-radius:10px; padding:12px 14px; font-family:'Vazirmatn'; font-size:12.5px; background:#fff; color:var(--ink); transition:border-color .2s; } .jc-contact-field select:focus{border-color:var(--teal); outline:none;} /* ---------- صفحه حریم خصوصی ---------- */ .jc-privacy-page{max-width:1200px; margin:0 auto; padding:18px 14px 40px;} .jc-privacy-hero{display:flex; flex-direction:column; align-items:center; text-align:center; gap:16px; padding:16px 0 26px;} .jc-privacy-shield{width:96px; height:96px; border-radius:50%; background:linear-gradient(135deg, rgba(31,167,184,.14), rgba(18,60,78,.08)); color:var(--teal-deep); display:flex; align-items:center; justify-content:center; flex-shrink:0;} .jc-privacy-hero-text h1{font-size:19px; font-weight:800; color:var(--navy); margin:0 0 10px;} .jc-privacy-hero-text p{font-size:12.5px; line-height:2; color:var(--ink-soft); margin:0; max-width:560px;} .jc-privacy-badges{display:grid; grid-template-columns:1fr; gap:12px; margin-bottom:26px;} .jc-privacy-badge{background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:16px; text-align:center;} .jc-privacy-badge-ic{width:42px; height:42px; border-radius:50%; background:rgba(31,167,184,.12); color:var(--teal-deep); display:flex; align-items:center; justify-content:center; margin:0 auto 10px;} .jc-privacy-badge-title{font-size:12.5px; font-weight:700; color:var(--navy); margin-bottom:4px;} .jc-privacy-badge-text{font-size:10.5px; color:var(--ink-soft); line-height:1.7;} .jc-privacy-grid{display:grid; grid-template-columns:1fr; gap:14px; margin-bottom:14px;} .jc-privacy-item{background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:18px;} .jc-privacy-item-ic{width:42px; height:42px; border-radius:50%; background:rgba(31,167,184,.12); color:var(--teal-deep); display:flex; align-items:center; justify-content:center; margin-bottom:12px;} .jc-privacy-item h2{font-size:13.5px; font-weight:800; color:var(--navy); margin:0 0 8px;} .jc-privacy-item p{font-size:12px; line-height:1.9; color:var(--ink-soft); margin:0;} .jc-privacy-block--full{display:flex; align-items:flex-start; gap:14px; background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:18px; margin-bottom:26px;} .jc-privacy-block--full h2{font-size:13.5px; font-weight:800; color:var(--navy); margin:0 0 8px;} .jc-privacy-block--full p{font-size:12px; line-height:1.9; color:var(--ink-soft); margin:0;} .jc-privacy-cta{background:var(--surface); border:1px solid var(--line); border-radius:20px; padding:24px 18px; text-align:center;} .jc-privacy-cta-ic{width:56px; height:56px; border-radius:50%; background:rgba(31,167,184,.12); color:var(--teal-deep); display:inline-flex; align-items:center; justify-content:center; margin-bottom:14px;} .jc-privacy-cta-text h3{font-size:15px; font-weight:800; color:var(--navy); margin:0 0 6px;} .jc-privacy-cta-text p{font-size:12px; color:var(--ink-soft); margin:0 0 18px;} .jc-privacy-cta-tiles{display:flex; flex-direction:column; gap:10px;} .jc-privacy-cta-tile{display:flex; align-items:center; gap:10px; background:#fff; border:1px solid var(--line); border-radius:12px; padding:12px 14px; text-decoration:none; color:var(--navy);} .jc-privacy-cta-tile svg{color:var(--teal-deep); flex-shrink:0;} .jc-privacy-cta-tile-title{font-size:11.5px; font-weight:700;} .jc-privacy-cta-tile-text{font-size:11px; color:var(--ink-soft); margin-top:2px;} @media (min-width:600px){ .jc-privacy-badges{grid-template-columns:repeat(2, 1fr);} .jc-privacy-grid{grid-template-columns:repeat(2, 1fr);} .jc-privacy-cta-tiles{flex-direction:row;} .jc-privacy-cta-tile{flex:1;} } @media (min-width:900px){ .jc-privacy-hero{flex-direction:row; text-align:right; gap:32px;} .jc-privacy-badges{grid-template-columns:repeat(4, 1fr);} .jc-privacy-cta{display:flex; align-items:center; gap:24px; text-align:right; padding:26px 30px;} .jc-privacy-cta-ic{margin-bottom:0;} .jc-privacy-cta-text{flex-shrink:0;} .jc-privacy-cta-text p{margin-bottom:0;} .jc-privacy-cta-tiles{flex:1; flex-direction:row;} } /* ---------- صفحه قوانین و مقررات ---------- */ .jc-terms-page{max-width:1200px; margin:0 auto; padding:18px 14px 40px;} .jc-terms-hero{display:flex; flex-direction:column; align-items:center; text-align:center; gap:16px; padding:16px 0 26px;} .jc-terms-hero-ic{width:96px; height:96px; border-radius:50%; background:linear-gradient(135deg, rgba(31,167,184,.14), rgba(18,60,78,.08)); color:var(--teal-deep); display:flex; align-items:center; justify-content:center; flex-shrink:0;} .jc-terms-hero-text h1{font-size:19px; font-weight:800; color:var(--navy); margin:0 0 10px;} .jc-terms-hero-text p{font-size:12.5px; line-height:2; color:var(--ink-soft); margin:0; max-width:560px;} .jc-terms-list{display:flex; flex-direction:column; gap:10px; margin-bottom:26px; background:var(--surface); border:1px solid var(--line); border-radius:18px; padding:8px 16px;} .jc-terms-row{display:flex; align-items:center; gap:12px; padding:16px 0; border-bottom:1px solid var(--line);} .jc-terms-row:last-child{border-bottom:none;} .jc-terms-num{width:24px; height:24px; border-radius:50%; background:rgba(31,167,184,.12); color:var(--teal-deep); font-size:11px; font-weight:800; display:flex; align-items:center; justify-content:center; flex-shrink:0;} .jc-terms-row-text{flex:1;} .jc-terms-row-text h3{font-size:13px; font-weight:800; color:var(--navy); margin:0 0 6px;} .jc-terms-row-text p{font-size:12px; line-height:1.9; color:var(--ink-soft); margin:0;} .jc-terms-row-text a{color:var(--teal-deep); font-weight:700; text-decoration:underline;} .jc-terms-row-ic{width:36px; height:36px; border-radius:10px; background:rgba(18,60,78,.06); color:var(--navy); display:flex; align-items:center; justify-content:center; flex-shrink:0;} @media (min-width:900px){ .jc-terms-hero{flex-direction:row; text-align:right; gap:32px;} } /* ---------- حساب کاربری: نظرات من ---------- */ .jc-myreviews{display:flex; flex-direction:column; gap:12px;} .jc-myreview-card{background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:16px;} .jc-myreview-head{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:6px;} .jc-myreview-product{font-size:13px; font-weight:700; color:var(--navy); text-decoration:none;} .jc-myreview-date{font-size:10.5px; color:var(--ink-soft); flex-shrink:0;} /* ---------- کاتالوگ محصول ---------- */ .jc-product-catalogs-section{background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:24px 18px; margin:28px 0;} .jc-catalogs-title{font-size:15px; font-weight:700; color:var(--navy); margin:0 0 16px; display:flex; align-items:center; gap:8px;} .jc-catalogs-grid{display:grid; grid-template-columns:repeat(2, 1fr); gap:12px;} .jc-catalog-btn{display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; padding:16px 14px; background:linear-gradient(135deg, var(--bg), var(--surface)); border:1.5px solid var(--line); border-radius:12px; text-decoration:none; color:var(--ink); transition:all .2s; cursor:pointer; text-align:center; position:relative; overflow:hidden;} .jc-catalog-btn::before{content:''; position:absolute; top:0; left:0; right:0; bottom:0; background:linear-gradient(135deg, rgba(31,167,184,.1), rgba(0,0,0,0)); opacity:0; transition:opacity .2s; z-index:0;} .jc-catalog-btn:hover{border-color:var(--teal); box-shadow:0 6px 16px rgba(31,167,184,.15);} .jc-catalog-btn:hover::before{opacity:1;} .jc-catalog-btn-icon{font-size:28px; display:block; flex-shrink:0; position:relative; z-index:1;} .jc-catalog-btn-name{font-size:12px; font-weight:700; color:var(--navy); word-break:break-word; position:relative; z-index:1;} .jc-catalog-btn-size{font-size:10px; color:var(--ink-soft); position:relative; z-index:1;} .jc-catalog-btn--docx{border-color:#4472c4;} .jc-catalog-btn--docx:hover{background:linear-gradient(135deg, #e7f0f8, #f0f4f8); border-color:#4472c4;} .jc-catalog-btn--pdf{border-color:#d32f2f;} .jc-catalog-btn--pdf:hover{background:linear-gradient(135deg, #ffebee, #fff0f0); border-color:#d32f2f;} .jc-catalog-btn--xlsx{border-color:#228b22;} .jc-catalog-btn--xlsx:hover{background:linear-gradient(135deg, #f0f8f0, #f5f5f5); border-color:#228b22;} .jc-catalog-btn--image{border-color:#ff8a65;} .jc-catalog-btn--image:hover{background:linear-gradient(135deg, #ffe0d2, #fff0ec); border-color:#ff8a65;} @media (max-width:600px){ .jc-catalogs-grid{grid-template-columns:1fr;} .jc-catalog-btn{flex-direction:row; justify-content:flex-start; gap:12px;} .jc-catalog-btn-icon{font-size:24px;} .jc-catalog-btn-name{text-align:left;} } .jc-myreview-stars{display:flex; gap:2px; color:#f5b400; margin-bottom:8px;} .jc-myreview-text{font-size:12px; line-height:1.9; color:var(--ink); margin:0;} .jc-myreviews-empty{text-align:center; padding:40px 16px; background:var(--surface); border:1px solid var(--line); border-radius:16px;} .jc-myreviews-empty-ic{width:60px; height:60px; border-radius:50%; background:rgba(31,167,184,.12); color:var(--teal-deep); display:flex; align-items:center; justify-content:center; margin:0 auto 14px;} .jc-myreviews-empty p{font-size:12.5px; color:var(--ink-soft); margin:0 0 16px;} .jc-myreviews-empty-btn{display:inline-flex; background:var(--teal); color:#fff; border-radius:10px; padding:11px 24px; font-size:12.5px; font-weight:700; text-decoration:none;}