/*
  Full responsive marketplace UI refresh inspired by clean Iranian ecommerce patterns.
  Scope: public site, shop, blog, account panel, admin panel, cart and checkout.
*/
* { box-sizing: border-box; }
html { min-height: 100%; scrollbar-gutter: stable; scroll-behavior: smooth; }
body {
    margin: 0;
    min-height: 100%;
    direction: rtl;
    font-family: "IRANSans", "Vazirmatn", "Segoe UI", Tahoma, Arial, sans-serif;
    background: linear-gradient(180deg, var(--app-bg-2), var(--app-bg));
    color: var(--text);
    font-size: 14px;
    line-height: 1.8;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}
body[data-theme="dark"] { background: radial-gradient(circle at top, rgb(var(--site-accent-rgb) / .08), transparent 36rem), linear-gradient(180deg, var(--app-bg-2), var(--app-bg)); }
::selection { background: rgb(var(--site-accent-rgb) / .20); color: var(--text); }
a { color: inherit; text-decoration: none; transition: color .18s ease, background .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease, opacity .18s ease; }
a:hover { color: var(--site-accent); }
p { margin: 0; }
img { max-width: 100%; display: block; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.svg-icon { width: var(--icon-size, 20px); height: var(--icon-size, 20px); display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; line-height: 0; }
.svg-icon svg { width: 100%; height: 100%; display: block; }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.min-w-0 { min-width: 0; }
.line-clamp-2, .line-clamp-3 { display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; }
.line-clamp-2 { -webkit-line-clamp: 2; }
.line-clamp-3 { -webkit-line-clamp: 3; }

/* shell */
.app-shell, .dk-shell { min-height: 100dvh; display: flex; flex-direction: column; }
.page-frame { width: min(100% - 24px, var(--container)); margin-inline: auto; }
.dk-header { position: sticky; top: 0; z-index: 1000; background: var(--header-background); color: var(--header-foreground); border-bottom: 1px solid var(--border-soft); box-shadow: 0 1px 0 rgba(0,0,0,.02); }
.dk-header__topline { height: 4px; background: linear-gradient(90deg, var(--site-accent), color-mix(in srgb, var(--site-accent) 62%, var(--surface)), var(--info)); }
.dk-header__main { background: var(--header-background); }
.dk-header__inner { min-height: 72px; display: grid; grid-template-columns: auto minmax(260px, 1fr) auto; align-items: center; gap: 18px; }
.dk-brand, .brand-block { display: inline-flex; align-items: center; gap: 10px; min-width: 0; }
.dk-brand__logo, .brand-block__logo { width: 48px; height: 48px; border-radius: 14px; object-fit: contain; background: var(--surface-subtle); border: 1px solid var(--border-soft); padding: 5px; }
.dk-brand__fallback, .brand-block__logo--fallback { display:flex; align-items:center; justify-content:center; font-weight:900; color: var(--site-accent); background: var(--site-accent-soft); }
.dk-brand__copy, .brand-block__copy { display: grid; line-height: 1.35; min-width: 0; }
.dk-brand__name, .brand-block__name { font-size: 1.32rem; letter-spacing: -.03em; font-weight: 900; color: var(--text); white-space: nowrap; }
.dk-brand__tagline, .brand-block__tagline, .brand-block__eyebrow { color: var(--text-soft); font-size: .76rem; white-space: nowrap; max-width: 180px; overflow: hidden; text-overflow: ellipsis; }
.brand-block__eyebrow { display:none; }
.dk-search { height: 46px; display: flex; align-items: center; gap: 10px; padding: 0 14px; border-radius: 12px; background: var(--surface-subtle); border: 1px solid transparent; color: var(--text-soft); transition: .18s ease; }
.dk-search:focus-within { background: var(--surface); border-color: rgb(var(--site-accent-rgb) / .35); box-shadow: var(--focus-ring); }
.dk-search input { width: 100%; border: 0; background: transparent; color: var(--text); outline: 0; min-width: 0; }
.dk-search input::placeholder { color: var(--text-soft); }
.dk-mobile-search { padding-bottom: 10px; }
.dk-search--mobile { height: 44px; }
.shell-header__actions, .dk-header__actions { display:flex; align-items:center; gap: 8px; justify-content: flex-end; }
.icon-button, .dk-icon-button { width: 42px; height: 42px; border-radius: 12px; border: 1px solid var(--border); background: var(--surface); color: var(--text-muted); display: inline-flex; align-items:center; justify-content:center; }
.icon-button:hover, .dk-icon-button:hover { color: var(--site-accent); border-color: rgb(var(--site-accent-rgb) / .35); background: var(--site-accent-soft); transform: translateY(-1px); }
.header-action { min-height: 42px; display:inline-flex; align-items:center; justify-content:center; gap:8px; padding: 0 14px; border-radius: 12px; border: 1px solid var(--border); background: var(--surface); color: var(--text); font-weight: 800; }
.header-action:hover { border-color: rgb(var(--site-accent-rgb) / .35); color: var(--site-accent); background: var(--site-accent-soft); transform: translateY(-1px); }
.header-action--accent { border-color: var(--border); }
.header-action--admin, .dk-admin-link { color: var(--site-accent); }
.dk-action-separator { width:1px; height:26px; background: var(--border); margin-inline: 2px; }
.dk-navbar { height: 42px; border-top: 1px solid var(--border-soft); background: var(--header-background); }
.dk-navbar__inner { height: 100%; display:flex; align-items:center; justify-content:space-between; gap: 20px; }
.nav-shell, .dk-nav-shell { min-width:0; }
.nav-shell__inner, .dk-nav-shell__inner { display:flex; align-items:center; gap: 4px; flex-wrap: nowrap; }
.nav-chip, .dk-nav-chip { height: 38px; display:inline-flex; align-items:center; gap: 7px; padding: 0 11px; border-radius: 10px; color: var(--text-muted); font-weight: 750; border: 1px solid transparent; position: relative; white-space: nowrap; }
.nav-chip:hover, .dk-nav-chip:hover, .nav-chip.active { color: var(--site-accent); background: var(--site-accent-soft); }
.dk-nav-chip--category { color: var(--text); font-weight: 900; padding-inline: 14px; }
.dk-nav-chip--category::after { content:""; position:absolute; inset-inline-end:-5px; width:1px; height:20px; background: var(--border); }
.dk-navbar__meta { display:flex; align-items:center; gap: 16px; color: var(--text-muted); font-weight: 750; font-size: .88rem; }
.dk-navbar__meta a { display:inline-flex; align-items:center; gap:6px; white-space: nowrap; }
.shell-main, .dk-main { flex: 1 0 auto; padding: 20px 0 34px; }

/* mobile drawer */
.mobile-menu-shell { position: fixed; inset: 0; z-index: 1100; pointer-events: none; }
.mobile-menu-shell.is-open { pointer-events: auto; }
.mobile-menu-backdrop { position:absolute; inset:0; background: var(--overlay); opacity:0; transition: opacity .22s ease; }
.mobile-menu-shell.is-open .mobile-menu-backdrop { opacity:1; }
.mobile-menu-panel { position:absolute; inset-block: 0; inset-inline-start:0; width:min(88vw, 390px); background: var(--surface); border-inline-end:1px solid var(--border); box-shadow: var(--shadow-lg); transform: translateX(105%); transition: transform .28s cubic-bezier(.2,.8,.2,1); display:flex; flex-direction:column; }
html[dir="rtl"] .mobile-menu-panel { transform: translateX(105%); }
.mobile-menu-shell.is-open .mobile-menu-panel { transform: translateX(0); }
.mobile-menu-panel__header { min-height:78px; display:flex; align-items:center; justify-content:space-between; gap:12px; padding: 16px; border-bottom:1px solid var(--border-soft); }
.dk-mobile-brand { display:flex; align-items:center; gap:10px; min-width:0; }
.dk-mobile-brand__mark { width:44px; height:44px; border-radius:13px; display:grid; place-items:center; background: var(--site-accent-soft); color: var(--site-accent); font-weight:900; }
.mobile-menu-panel__title { font-weight: 900; color: var(--text); }
.mobile-menu-panel__subtitle { color: var(--text-soft); font-size:.82rem; }
.mobile-menu-panel__content { padding: 14px; overflow:auto; }
.dk-nav-shell__inner--compact { display:grid; gap:8px; }
.dk-nav-shell__inner--compact .nav-chip { height: 48px; justify-content:flex-start; background: var(--surface-subtle); border-color: var(--border-soft); }
.dk-mobile-actions { display:grid; gap:8px; margin-top:14px; }
.dk-mobile-actions .header-action { justify-content:flex-start; min-height:48px; }
.dk-bottom-nav { position: fixed; z-index: 900; inset-inline: 0; bottom: 0; height: 64px; background: var(--surface); border-top: 1px solid var(--border); display:grid; grid-template-columns: repeat(4,1fr); box-shadow: 0 -8px 24px rgba(0,0,0,.08); }
.dk-bottom-nav a { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; color: var(--text-muted); font-weight:800; font-size:.72rem; }
.dk-bottom-nav a:hover { color: var(--site-accent); }

/* cards and sections */
.page-section { margin-top: 24px; }
.page-card, .card, .content-card, .shop-card, .admin-metric-card, .settings-panel, .contact-panel, .payment-card { background: var(--surface); border: 1px solid var(--border-soft); border-radius: var(--radius-lg); box-shadow: var(--shadow-xs); }
.page-card:hover, .product-card:hover, .blog-card:hover, .category-card:hover, .feature-card:hover { border-color: var(--border); box-shadow: var(--shadow-sm); }
.section-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:14px; margin-bottom: 14px; }
.section-heading h1, .section-heading h2, .section-heading h3, .dashboard-title { margin:0; color: var(--text); font-weight: 900; letter-spacing: -.02em; }
.section-kicker { color: var(--site-accent); font-weight: 900; font-size: .82rem; letter-spacing: -.01em; }
.section-subtitle, .hero-subtitle, .text-muted, small, .small { color: var(--text-muted) !important; }
.empty-state { padding: 26px; text-align:center; color: var(--text-soft); background: var(--surface-subtle); border:1px dashed var(--border); border-radius: var(--radius-md); }
.soft-divider { height:1px; background: var(--border-soft); margin: 16px 0; }
.badge, .status-pill, .chip-soft, .filter-chip { display:inline-flex; align-items:center; justify-content:center; gap:6px; border-radius: var(--radius-pill); padding: .32rem .62rem; font-weight: 850; border:1px solid transparent; }
.chip-soft, .filter-chip { background: var(--surface-subtle); color: var(--text-muted); border-color: var(--border-soft); }
.filter-chip:hover, .filter-chip.active { background: var(--site-accent-soft); color: var(--site-accent); border-color: rgb(var(--site-accent-rgb) / .25); }
.text-bg-primary, .badge.text-bg-primary { color:#fff; background: var(--site-accent) !important; }
.text-bg-success { color:#fff; background: var(--success) !important; }
.text-bg-danger { color:#fff; background: var(--danger) !important; }
.text-bg-warning { color:#2b2500; background: var(--warning) !important; }
.text-bg-secondary, .text-bg-light { color: var(--text-muted) !important; background: var(--surface-subtle) !important; }
.alert { border-radius: var(--radius-md); border:1px solid var(--border-soft); padding: 12px 14px; }
.alert-success { background: rgb(var(--success-rgb) / .10); color: var(--success); }
.alert-danger { background: rgb(var(--site-accent-rgb) / .10); color: var(--danger); }
.alert-info { background: rgb(25 191 211 / .10); color: var(--info); }
.alert-warning { background: rgb(249 168 37 / .14); color: #9a6700; }

/* buttons and forms */
.btn { min-height: 40px; display:inline-flex; align-items:center; justify-content:center; gap:8px; border-radius: 10px; border:1px solid transparent; padding: .48rem .9rem; font-weight: 900; line-height:1.2; transition: .18s ease; }
.btn:hover { transform: translateY(-1px); box-shadow: var(--shadow-sm); }
.btn-sm { min-height:34px; padding:.36rem .68rem; font-size:.84rem; }
.btn-lg { min-height:48px; padding:.7rem 1.1rem; font-size:1rem; }
.btn-primary { background: var(--site-accent); color: var(--site-accent-contrast); border-color: var(--site-accent); }
.btn-primary:hover { color: var(--site-accent-contrast); filter: saturate(1.05); }
.btn-outline-primary { color: var(--site-accent); border-color: rgb(var(--site-accent-rgb) / .38); background: transparent; }
.btn-outline-primary:hover { color: var(--site-accent); background: var(--site-accent-soft); }
.btn-outline-secondary, .btn-outline-dark, .btn-outline-success, .btn-outline-warning, .btn-outline-danger { background: var(--surface); border-color: var(--border); color: var(--text-muted); }
.btn-outline-danger { color: var(--danger); }
.btn-outline-secondary:hover, .btn-outline-dark:hover { color: var(--text); background: var(--surface-subtle); }
.btn-light, .btn-ghost { background: var(--surface); color: var(--text); border-color: var(--border-soft); }
.form-control, .form-select, textarea, input[type="text"], input[type="email"], input[type="password"], input[type="number"], input[type="tel"], input[type="search"], select { min-height: 44px; border-radius: 10px; border:1px solid var(--border); background: var(--surface); color: var(--text); padding: .54rem .78rem; }
.form-control:focus, .form-select:focus, textarea:focus, input:focus, select:focus { border-color: rgb(var(--site-accent-rgb) / .42); box-shadow: var(--focus-ring); outline: 0; }
.form-label { color: var(--text-muted); font-weight: 850; margin-bottom: 6px; }
.input-group { display:flex; align-items: stretch; }
.input-group-text { display:flex; align-items:center; padding:.54rem .75rem; background: var(--surface-subtle); border:1px solid var(--border); color:var(--text-muted); border-radius: 10px; }
.form-check { display:flex; align-items:center; gap:8px; }
.form-check-input { accent-color: var(--site-accent); }
.table-responsive { overflow:auto; border-radius: var(--radius-md); }
.table { width:100%; border-collapse: collapse; color:var(--text); }
.table th, .table td { padding: 12px; border-bottom:1px solid var(--border-soft); vertical-align:middle; }
.table th { color:var(--text-muted); font-weight:900; background: var(--surface-subtle); }

/* hero */
.home-hero, .hero, .shop-hero, .cart-hero, .payment-hero, .contact-hero, .cms-page-hero, .category-hero, .admin-hero, .account-hero-card, .product-hero { position:relative; overflow:hidden; padding: 22px; border-radius: var(--radius-xl); background: var(--surface); border: 1px solid var(--border-soft); box-shadow: var(--shadow-sm); }
.home-hero { display:grid; grid-template-columns: minmax(0,1fr) 460px; gap: 22px; align-items: stretch; background: linear-gradient(135deg, var(--surface), var(--surface-subtle)); }
.home-hero::before, .shop-hero::before, .admin-hero::before, .account-hero-card::before { content:""; position:absolute; inset-inline-start:-10%; inset-block-start:-30%; width: 42%; height: 130%; background: radial-gradient(circle, rgb(var(--site-accent-rgb) / .13), transparent 65%); pointer-events:none; }
.home-hero__copy, .home-hero__visual, .shop-hero__content, .product-hero__content { position:relative; z-index:1; }
.hero-title { font-size: clamp(1.8rem, 4vw, 3.3rem); line-height:1.35; font-weight: 950; letter-spacing: -.055em; color: var(--text); margin: 8px 0 0; }
.hero-subtitle { max-width: 62ch; font-size: 1rem; margin-top: 10px; }
.hero-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top: 18px; }
.hero-stats, .stat-grid, .shop-stats, .home-stat-grid, .payment-summary-grid, .comment-summary-grid, .admin-metric-grid { display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 10px; margin-top: 18px; }
.stat-card, .home-stat-card, .trust-card, .payment-summary-item, .comment-summary-card, .admin-metric-card, .account-stat { padding: 14px; border-radius: var(--radius-md); background: var(--surface); border:1px solid var(--border-soft); min-width:0; }
.stat-card strong, .trust-card__value, .admin-metric-card strong, .account-stat strong { display:block; font-size:1.15rem; font-weight:950; color:var(--text); }
.stat-card span, .trust-card__label, .admin-metric-card span, .account-stat span { color: var(--text-soft); font-size:.82rem; }
.stat-card__icon, .feature-card__icon, .content-card__icon, .category-card__icon { width:42px; height:42px; border-radius: 13px; display:grid; place-items:center; color:var(--site-accent); background:var(--site-accent-soft); margin-bottom: 10px; }
.hero-visual-card { height:100%; min-height: 300px; border-radius: var(--radius-xl); padding: 20px; background: linear-gradient(135deg, var(--site-accent), color-mix(in srgb, var(--site-accent) 58%, var(--surface))); color:#fff; display:flex; flex-direction:column; justify-content:flex-end; position:relative; overflow:hidden; }
.hero-visual-card::before { content:""; position:absolute; inset:-40% -20% auto auto; width:290px; height:290px; border-radius:50%; background: rgba(255,255,255,.18); }
.hero-visual-card--image { padding:0; background: var(--surface-subtle); }
.hero-visual-card--image img { width:100%; height:100%; object-fit:cover; }
.hero-visual-card__overlay { position:absolute; inset:auto 14px 14px 14px; padding: 16px; border-radius: var(--radius-lg); background: rgba(0,0,0,.48); backdrop-filter: blur(14px); color:#fff; }
.hero-visual-card__eyebrow { font-weight:900; opacity:.9; }
.hero-visual-card__title { font-size:1.35rem; font-weight:950; line-height:1.45; }
.hero-visual-card__subtitle { opacity:.9; }
.hero-mini-grid, .feature-grid, .content-grid, .trust-grid, .testimonial-grid { display:grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap:12px; }
.hero-mini-card, .feature-card, .content-card, .testimonial-card { padding: 16px; border-radius: var(--radius-lg); background: var(--surface); border:1px solid var(--border-soft); }
.hero-mini-card { color: var(--text); display:flex; align-items:center; gap:8px; }

/* grids */
.shop-grid, .blog-grid, .category-grid, .favorite-grid { display:grid; gap: 14px; }
.shop-grid { grid-template-columns: repeat(4, minmax(0,1fr)); }
.blog-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
.category-grid { grid-template-columns: repeat(4, minmax(0,1fr)); }
.favorite-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
.product-card, .blog-card, .category-card, .favorite-card, .shop-card { background: var(--surface); border:1px solid var(--border-soft); border-radius: 14px; overflow:hidden; transition:.18s ease; min-width:0; }
.product-card:hover, .blog-card:hover, .category-card:hover, .favorite-card:hover { transform: translateY(-2px); }
.product-card__media, .shop-card__media, .blog-card__media, .favorite-card__media, .category-card__media { display:block; background: var(--surface-subtle); overflow:hidden; position:relative; }
.product-card__media, .shop-card__media { aspect-ratio: 1 / 1; padding: 14px; }
.product-card__media img, .shop-card__media img, .product-main-image img, .product-line-thumb img { width:100%; height:100%; object-fit: contain; transition: transform .22s ease; }
.blog-card__media, .favorite-card__media { aspect-ratio: 16/10; }
.blog-card__media img, .favorite-card__media img, .category-card__media img { width:100%; height:100%; object-fit:cover; transition: transform .22s ease; }
.product-card:hover img, .blog-card:hover img, .favorite-card:hover img { transform: scale(1.035); }
.product-card__body, .blog-card__body, .shop-card__body, .favorite-card__body { padding: 13px; }
.product-card__title { min-height: 48px; color: var(--text); font-weight: 850; line-height:1.65; margin:0; }
.product-card__excerpt, .product-card__meta, .product-card__stock, .blog-card p, .category-card__text { color: var(--text-soft); font-size:.86rem; }
.product-card__price { color: var(--text); font-size: 1.08rem; font-weight: 950; text-align:end; margin-top:10px; }
.product-card__old-price { color: var(--text-faint); text-decoration: line-through; font-size:.82rem; }
.product-card__footer, .product-card__actions { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:12px; }
.product-placeholder, .product-line-thumb__fallback { width:100%; height:100%; display:grid; place-items:center; color: var(--text-faint); background: linear-gradient(135deg, var(--surface-subtle), var(--surface)); border:1px dashed var(--border); border-radius: var(--radius-md); }
.product-placeholder__svg { width:44%; max-width:120px; color:var(--site-accent); opacity:.35; }
.category-card { display:flex; align-items:center; gap:12px; padding: 14px; min-height: 98px; }
.category-card__body { min-width:0; }
.category-card__title { font-weight: 900; color: var(--text); }
.category-card__arrow { margin-inline-start:auto; color: var(--text-faint); }
.blog-card__body h3, .blog-card__body h2 { margin:0 0 8px; font-weight:900; line-height:1.55; }

/* shop/product/filter */
.shop-hero { display:grid; grid-template-columns: minmax(0,1fr) auto; gap:18px; align-items:center; }
.shop-hero-card { padding:16px; border-radius: var(--radius-lg); background: var(--site-accent-soft); color: var(--site-accent); border:1px solid rgb(var(--site-accent-rgb) / .20); }
.shop-filter-panel { position: sticky; top: 136px; padding: 14px; border-radius: var(--radius-lg); background: var(--surface); border:1px solid var(--border-soft); }
.product-hero__layout { display:grid; grid-template-columns: 430px minmax(0,1fr) 320px; gap:18px; align-items:start; }
.product-media-shell { background: var(--surface); border:1px solid var(--border-soft); border-radius: var(--radius-lg); padding: 14px; }
.product-main-image { aspect-ratio: 1 / 1; border-radius: var(--radius-md); background: var(--surface-subtle); overflow:hidden; display:grid; place-items:center; }
.thumb-grid { display:grid; grid-template-columns: repeat(5,1fr); gap:8px; margin-top:10px; }
.thumb-grid__item { aspect-ratio:1; border-radius:10px; border:1px solid var(--border); background:var(--surface-subtle); padding:4px; overflow:hidden; }
.price-box, .product-side, .cart-summary, .payment-side { padding:16px; border-radius: var(--radius-lg); background: var(--surface); border:1px solid var(--border-soft); }
.price-box { position: sticky; top: 136px; }
.quantity-stepper { display:inline-flex; align-items:center; gap:8px; border:1px solid var(--border); background: var(--surface); border-radius: 10px; padding: 4px; }
.quantity-stepper__btn { width:32px; height:32px; border:0; border-radius:8px; background:var(--surface-subtle); color:var(--site-accent); font-weight:900; }
.quantity-stepper__value { min-width:30px; text-align:center; font-weight:900; }

/* cart/payment/order rows */
.cart-item-card, .payment-line, .product-line, .dashboard-item, .admin-list-row, .contact-reply-item { display:flex; align-items:center; justify-content:space-between; gap:12px; padding: 14px; border-radius: var(--radius-md); background: var(--surface); border:1px solid var(--border-soft); }
.cart-summary--sticky { position: sticky; top:136px; }
.product-line-thumb { width:62px; height:62px; border-radius:12px; background:var(--surface-subtle); border:1px solid var(--border-soft); overflow:hidden; flex:0 0 auto; padding:4px; }
.product-line-thumb--sm { width:52px; height:52px; }
.product-line-thumb--xs { width:38px; height:38px; border-radius:10px; }
.order-thumb-stack { display:flex; align-items:center; }
.order-thumb-stack .product-line-thumb { margin-inline-end: -10px; box-shadow: 0 0 0 2px var(--surface); }
.summary-row { display:flex; align-items:center; justify-content:space-between; gap:10px; padding: 10px 0; color:var(--text-muted); border-bottom:1px solid var(--border-soft); }
.summary-row--total { color:var(--text); font-size:1.08rem; font-weight:950; border-bottom:0; }

/* account */
.account-pro-shell { display:grid; grid-template-columns: 280px minmax(0,1fr); gap: 18px; align-items:start; }
.account-pro-sidebar { position:sticky; top:136px; padding: 14px; border-radius: var(--radius-lg); background: var(--surface); border:1px solid var(--border-soft); }
.account-pro-main { min-width:0; }
.account-pro-nav { display:grid; gap:8px; }
.account-pro-nav a { min-height:44px; display:flex; align-items:center; gap:8px; padding:0 12px; border-radius:10px; color: var(--text-muted); font-weight:850; }
.account-pro-nav a:hover, .account-pro-nav a.active { background: var(--site-accent-soft); color:var(--site-accent); }
.profile-avatar, .user-avatar, .comment-avatar, .testimonial-card__avatar { width:46px; height:46px; border-radius:50%; display:grid; place-items:center; background: var(--site-accent-soft); color:var(--site-accent); font-weight:950; }
.profile-avatar--large { width:72px; height:72px; font-size:1.4rem; }
.account-stat-grid { display:grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap:10px; }
.account-section-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; }
.address-manager-grid { display:grid; grid-template-columns: minmax(0,1fr) 420px; gap:14px; align-items:start; }
.address-list-stack, .dashboard-list, .admin-message-list { display:grid; gap:10px; }
.address-card, .address-editor-card, .favorite-card { padding:14px; border-radius: var(--radius-md); background: var(--surface); border:1px solid var(--border-soft); }
.address-card.is-active { border-color: rgb(var(--site-accent-rgb) / .4); box-shadow: var(--focus-ring); }
.address-card h3 { margin:0; font-size:1rem; font-weight:900; }
.address-card__line { color:var(--text-muted); margin-top:4px; }
.address-card__actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }

/* admin */
.admin-hero { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:18px; }
.admin-metric-grid { grid-template-columns: repeat(4,minmax(0,1fr)); margin-top:0; }
.admin-metric-card { padding:18px; }
.admin-search { display:flex; align-items:center; gap:8px; padding:8px; border-radius: var(--radius-md); background: var(--surface); border:1px solid var(--border-soft); }
.settings-nav { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:14px; }
.settings-nav a, .list-group-item-action { min-height:40px; display:inline-flex; align-items:center; padding: .48rem .75rem; border-radius:10px; background:var(--surface); border:1px solid var(--border-soft); color:var(--text-muted); font-weight:850; }
.settings-nav a:hover, .settings-nav a.active, .list-group-item-action:hover { color:var(--site-accent); background:var(--site-accent-soft); border-color:rgb(var(--site-accent-rgb) / .28); }
.settings-panel { padding:18px; }
.settings-panel__title { font-weight:950; color:var(--text); }
.settings-panel__subtitle { color:var(--text-muted); }
.setting-field { padding:14px; border:1px solid var(--border-soft); border-radius:var(--radius-md); background:var(--surface); }
.setting-field__row { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.setting-swatch { width:34px; height:34px; border-radius:10px; border:1px solid var(--border); }
.blog-admin-layout, .cms-editor-shell { display:grid; grid-template-columns: minmax(0,1fr) 380px; gap:14px; align-items:start; }
.cms-editor-shell--single { grid-template-columns: 1fr; }
.preview-panel, .blog-admin-form-card, .footer-section-card { border-radius: var(--radius-lg); background:var(--surface); border:1px solid var(--border-soft); overflow:hidden; }
.preview-panel__header, .preview-panel__footer { padding:14px; border-bottom:1px solid var(--border-soft); }
.preview-panel__footer { border-top:1px solid var(--border-soft); border-bottom:0; }
.preview-panel__header--editor, .preview-panel__footer--editor { background: var(--surface-subtle); }
.preview-panel__header h3 { margin:0; font-weight:950; }
.role-toggle { display:inline-flex; align-items:center; gap:8px; padding:8px 10px; border-radius:10px; background:var(--surface-subtle); }
.user-card, .user-selected-panel { padding:14px; border-radius:var(--radius-md); background:var(--surface); border:1px solid var(--border-soft); }

/* blog/cms/contact */
.blog-article-layout { display:grid; grid-template-columns: minmax(0,1fr) 320px; gap:18px; align-items:start; }
.blog-article-main, .blog-article-aside, .contact-form-card, .contact-thread-card, .cms-page-body { background:var(--surface); border:1px solid var(--border-soft); border-radius:var(--radius-lg); padding:18px; }
.blog-article-hero-image { border-radius:var(--radius-lg); overflow:hidden; margin-bottom:14px; }
.blog-article-hero-image img { width:100%; max-height:460px; object-fit:cover; }
.blog-article-content, .cms-page-live-content { color:var(--text); line-height:2; }
.blog-article-content h1, .blog-article-content h2, .blog-article-content h3, .cms-page-live-content h1, .cms-page-live-content h2, .cms-page-live-content h3 { font-weight:950; }
.contact-panel { padding:18px; }
.comment-card { padding:14px; border-radius:var(--radius-md); background:var(--surface); border:1px solid var(--border-soft); }
.comment-card--mine { border-color: rgb(var(--site-accent-rgb) / .28); background: var(--site-accent-soft); }
.comments-modal { position:fixed; inset:0; display:grid; place-items:center; z-index:1200; background:var(--overlay); padding:20px; }
.comment-modal-card { width:min(760px,100%); max-height:85dvh; display:flex; flex-direction:column; background:var(--surface); border-radius:var(--radius-xl); overflow:hidden; }
.comment-modal-card__content, .comments-modal__body { padding:16px; overflow:auto; }

/* footer */
.shell-footer, .dk-footer { margin-top:auto; background: var(--footer-background); color: var(--footer-foreground); border-top:1px solid var(--border); padding: 34px 0 24px; }
.dk-footer__grid, .footer-grid { display:grid; grid-template-columns: minmax(0,1.4fr) repeat(3,minmax(160px,.6fr)); gap: 24px; }
.footer-brand__title { font-weight:950; font-size:1.35rem; }
.footer-brand__text, .footer-brand__description { color:var(--text-muted); margin-top:6px; }
.footer-trust, .dk-footer-trust { display:flex; flex-wrap:wrap; gap:10px; margin-top:14px; }
.footer-trust__item { min-height:42px; display:flex; align-items:center; gap:8px; padding:0 12px; border-radius:12px; background:var(--surface-subtle); border:1px solid var(--border-soft); color:var(--text-muted); font-weight:850; }
.footer-links { display:grid; align-content:start; gap:8px; }
.footer-links__title { font-weight:950; margin-bottom:4px; color:var(--text); }
.footer-links a { color:var(--text-muted); }
.footer-links a:hover { color:var(--site-accent); }

/* utility compatibility */
.row { display:flex; flex-wrap:wrap; margin-inline: calc(var(--bs-gutter-x, 1rem) * -.5); margin-block: calc(var(--bs-gutter-y, 0) * -.5); }
.row > * { padding-inline: calc(var(--bs-gutter-x, 1rem) * .5); margin-block: calc(var(--bs-gutter-y, 0) * .5); max-width:100%; }
.g-2 { --bs-gutter-x:.5rem; --bs-gutter-y:.5rem; }.g-3 { --bs-gutter-x:1rem; --bs-gutter-y:1rem; }.g-4 { --bs-gutter-x:1.5rem; --bs-gutter-y:1.5rem; }
.col-12 { flex:0 0 100%; max-width:100%; }.col-6 { flex:0 0 50%; max-width:50%; }.col-5 { flex:0 0 41.666%; max-width:41.666%; }.col-1 { flex:0 0 8.333%; max-width:8.333%; }
.d-none{display:none!important}.d-block{display:block!important}.d-flex{display:flex!important}.d-grid{display:grid!important}.d-inline-flex{display:inline-flex!important}.d-inline-block{display:inline-block!important}
.align-items-center{align-items:center!important}.align-items-start{align-items:flex-start!important}.align-items-end{align-items:flex-end!important}.align-items-stretch{align-items:stretch!important}.justify-content-between{justify-content:space-between!important}.justify-content-center{justify-content:center!important}.justify-content-end{justify-content:flex-end!important}.justify-content-start{justify-content:flex-start!important}.flex-column{flex-direction:column!important}.flex-wrap{flex-wrap:wrap!important}.flex-grow-1{flex-grow:1!important}.flex-shrink-0{flex-shrink:0!important}.gap-1{gap:.25rem!important}.gap-2{gap:.5rem!important}.gap-3{gap:1rem!important}.gap-4{gap:1.5rem!important}
.p-2{padding:.5rem!important}.p-3{padding:1rem!important}.p-4{padding:1.5rem!important}.p-lg-4{padding:1.5rem!important}.p-lg-5{padding:2rem!important}.px-3{padding-inline:1rem!important}.px-4{padding-inline:1.5rem!important}.py-2{padding-block:.5rem!important}.py-5{padding-block:3rem!important}.m-0{margin:0!important}.mt-1{margin-top:.25rem!important}.mt-2{margin-top:.5rem!important}.mt-3{margin-top:1rem!important}.mt-4{margin-top:1.5rem!important}.mb-0{margin-bottom:0!important}.mb-1{margin-bottom:.25rem!important}.mb-2{margin-bottom:.5rem!important}.mb-3{margin-bottom:1rem!important}.mb-4{margin-bottom:1.5rem!important}.my-3{margin-block:1rem!important}.my-4{margin-block:1.5rem!important}.mx-auto{margin-inline:auto!important}.me-2{margin-inline-end:.5rem!important}
.text-center{text-align:center!important}.text-end{text-align:end!important}.text-start{text-align:start!important}.fw-semibold{font-weight:750!important}.fw-bold{font-weight:900!important}.fs-5{font-size:1.1rem!important}.h3{font-size:1.55rem}.h4{font-size:1.3rem}.h5{font-size:1.1rem}.h6{font-size:1rem}.display-6{font-size:2rem;font-weight:950}.rounded-3{border-radius:var(--radius-sm)!important}.rounded-4{border-radius:var(--radius-md)!important}.rounded-pill{border-radius:var(--radius-pill)!important}.border{border:1px solid var(--border)!important}.border-0{border:0!important}.shadow-sm{box-shadow:var(--shadow-sm)!important}.w-100{width:100%!important}.h-100{height:100%!important}.overflow-hidden{overflow:hidden!important}.position-relative{position:relative!important}.position-absolute{position:absolute!important}.sticky-top{position:sticky;top:136px}.object-fit-cover{object-fit:cover!important}.opacity-75{opacity:.75!important}.text-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.text-break{word-break:break-word}.text-nowrap{white-space:nowrap}.text-decoration-none{text-decoration:none!important}.text-decoration-line-through{text-decoration:line-through!important}.text-primary{color:var(--site-accent)!important}.bg-white,.bg-light{background:var(--surface)!important}
.spinner-border { width:2rem; height:2rem; border:.22em solid var(--border); border-inline-end-color:var(--site-accent); border-radius:50%; animation: spin .7s linear infinite; }
.spinner-border-sm { width:1rem;height:1rem;border-width:.16em; }
@keyframes spin { to { transform: rotate(360deg); } }

/* responsive */
@media (min-width: 768px) { .d-md-inline-flex{display:inline-flex!important}.col-md-2{flex:0 0 16.666%;max-width:16.666%}.col-md-3{flex:0 0 25%;max-width:25%}.col-md-4{flex:0 0 33.333%;max-width:33.333%}.col-md-5{flex:0 0 41.666%;max-width:41.666%}.col-md-6{flex:0 0 50%;max-width:50%}.col-md-7{flex:0 0 58.333%;max-width:58.333%}.col-md-8{flex:0 0 66.666%;max-width:66.666%}.text-md-end{text-align:end!important} }
@media (min-width: 992px) { .d-lg-inline-flex{display:inline-flex!important}.d-lg-inline-grid{display:inline-grid!important}.flex-lg-row{flex-direction:row!important}.justify-content-lg-end{justify-content:flex-end!important}.align-items-lg-end{align-items:flex-end!important}.text-lg-end{text-align:end!important}.w-lg-auto{width:auto!important}.col-lg-2{flex:0 0 16.666%;max-width:16.666%}.col-lg-3{flex:0 0 25%;max-width:25%}.col-lg-4{flex:0 0 33.333%;max-width:33.333%}.col-lg-5{flex:0 0 41.666%;max-width:41.666%}.col-lg-6{flex:0 0 50%;max-width:50%}.col-lg-7{flex:0 0 58.333%;max-width:58.333%}.col-lg-8{flex:0 0 66.666%;max-width:66.666%} }
@media (min-width: 1200px) { .d-xl-block{display:block!important}.d-xl-none{display:none!important}.flex-xl-row{flex-direction:row!important}.align-items-xl-end{align-items:flex-end!important}.col-xl-4{flex:0 0 33.333%;max-width:33.333%}.col-xl-5{flex:0 0 41.666%;max-width:41.666%}.col-xl-7{flex:0 0 58.333%;max-width:58.333%}.col-xl-8{flex:0 0 66.666%;max-width:66.666%} }
@media (max-width: 1199.98px) {
    body { padding-bottom: 64px; }
    .page-frame { width: min(100% - 18px, var(--container)); }
    .dk-header__inner { min-height:64px; grid-template-columns: auto 1fr; }
    .dk-header__inner > .dk-search { display:none; }
    .dk-brand__tagline { display:none; }
    .home-hero, .product-hero__layout, .blog-article-layout, .account-pro-shell, .address-manager-grid, .blog-admin-layout, .cms-editor-shell { grid-template-columns: 1fr; }
    .price-box, .account-pro-sidebar, .shop-filter-panel, .cart-summary--sticky { position: static; }
    .shop-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .blog-grid, .favorite-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .category-grid, .feature-grid, .hero-mini-grid, .trust-grid, .testimonial-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .dk-footer__grid, .footer-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 767.98px) {
    body { font-size: 13.5px; }
    .page-frame { width: min(100% - 14px, var(--container)); }
    .dk-header__inner { gap:8px; }
    .dk-brand__logo { width:42px;height:42px;border-radius:12px; }
    .dk-brand__name { font-size:1.08rem; max-width: 150px; overflow:hidden; text-overflow:ellipsis; }
    .header-action { padding-inline:10px; }
    .shell-main, .dk-main { padding-top: 12px; }
    .home-hero, .shop-hero, .cart-hero, .payment-hero, .contact-hero, .cms-page-hero, .category-hero, .admin-hero, .account-hero-card, .product-hero { padding: 16px; border-radius: 16px; }
    .hero-title { font-size: 1.65rem; }
    .hero-actions, .section-heading, .admin-hero, .account-section-head { align-items:stretch; flex-direction:column; }
    .hero-actions .btn, .section-heading .btn, .account-section-head .btn { width:100%; }
    .hero-stats, .stat-grid, .shop-stats, .home-stat-grid, .payment-summary-grid, .comment-summary-grid, .admin-metric-grid, .account-stat-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .shop-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap:8px; }
    .product-card__body, .shop-card__body { padding:10px; }
    .product-card__title { font-size:.88rem; min-height:42px; }
    .product-card__price { font-size:.96rem; }
    .blog-grid, .favorite-grid, .category-grid, .feature-grid, .content-grid, .hero-mini-grid, .trust-grid, .testimonial-grid { grid-template-columns: 1fr; }
    .product-card__actions, .product-card__footer, .cart-item-card, .payment-line, .product-line, .dashboard-item, .admin-list-row { align-items:stretch; flex-direction:column; }
    .product-card__actions .btn, .product-card__footer .btn { width:100%; }
    .thumb-grid { grid-template-columns: repeat(4,1fr); }
    .dk-footer__grid, .footer-grid { grid-template-columns: 1fr; }
    .col-6, .col-5, .col-md-6, .col-lg-6, .col-lg-4, .col-md-4, .col-md-3 { flex:0 0 100%; max-width:100%; }
    .p-lg-4, .p-lg-5 { padding:1rem!important; }
}
@media (max-width: 420px) {
    .shop-grid { grid-template-columns: 1fr; }
    .hero-stats, .account-stat-grid, .admin-metric-grid { grid-template-columns: 1fr; }
    .dk-brand__copy { display:none; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration:.001ms!important; transition-duration:.001ms!important; scroll-behavior:auto!important; } }