:root { --ink: #29233c; --muted: #736c82; --cream: #fffaf3; --pink: #ff6f91; --purple: #7957c8; --yellow: #ffd66b; --mint: #9ce0c3; --line: #ebe4ef; --white: #fff; --shadow: 0 16px 45px rgba(65,43,87,.1) }
* { box-sizing: border-box }
html { scroll-behavior: smooth; font-size: 15px }
body { margin: 0; overflow-x: hidden; background: var(--cream); color: var(--ink); font-family: "Segoe UI", Tahoma, Arial, sans-serif; line-height: 1.8 }
a { color: inherit; text-decoration: none }
button, input, select { font: inherit }
.topbar { padding: .45rem; text-align: center; background: var(--ink); color: #fff; font-size: .78rem }
.admin-body { background: #f4f6fa; color: #222; line-height: 1.65 }
.admin-topbar { position: sticky; top: 0; z-index: 80; height: 64px; background: #fff; border-bottom: 1px solid #e1e5ec; display: flex; align-items: center; justify-content: space-between; padding: 0 28px; box-shadow: 0 2px 10px rgba(32,44,70,.04) }
.admin-topbar > div, .admin-top-actions, .admin-user { display: flex; align-items: center; gap: 1rem }
.admin-environment { font-size: .72rem; color: #5f697b }
.admin-environment i { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #26a879; margin-left: .35rem; box-shadow: 0 0 0 4px #daf4ea }
.admin-top-actions > a { font-size: .72rem; color: #53617a }
.admin-user { gap: .1rem; align-items: flex-start; flex-direction: column; padding-right: 1rem; border-right: 1px solid #e7e9ee }
.admin-user b { font-size: .76rem }
.admin-user small { font-size: .58rem; color: #8a93a2 }
.admin-top-actions form { margin: 0 }
.admin-top-actions form button { border: 0; background: #f3f4f7; border-radius: 8px; padding: .4rem .65rem; font-size: .68rem; color: #5b6371 }
.admin-mobile-toggle { display: none; border: 0; background: none }
.admin-workspace { min-height: calc(100vh - 64px) }
.site-header { position: sticky; top: 0; z-index: 120; width: min(100%,1240px); max-width: calc(100% - 16px); margin: 0 auto; display: flex; align-items: center; gap: 1.25rem; padding: 14px 24px; flex-wrap: wrap; overflow: hidden; background: rgba(255,250,243,.94); backdrop-filter: blur(14px); border: 1px solid rgba(41,35,60,.06); border-radius: 0 0 24px 24px; box-shadow: 0 12px 35px rgba(65,43,87,.06) }
.logo { display: inline-flex; align-items: center; gap: .75rem; font-size: 1.35rem; font-weight: 800; letter-spacing: .02em; white-space: nowrap }
.logo-image { width: 60px; height: 60px; object-fit: contain; border-radius: 14px; background: #fff; border: 1px solid rgba(41,35,60,.08); padding: .35rem }
.logo span { color: var(--pink) }
nav { display: flex; gap: 2rem; flex: 1; align-items: center }
nav a { font-family: "Segoe UI", Tahoma, Arial, sans-serif; font-size: .95rem; font-weight: 700; letter-spacing: .02em }
.header-actions { display: flex; align-items: center; gap: 1rem; font-size: 1.05rem; flex-wrap: wrap; position: relative }
.header-actions a, .header-actions button { display: inline-flex; align-items: center; justify-content: center; gap: .45rem; min-width: 44px; min-height: 44px; padding: .7rem .85rem; border-radius: 14px; background: rgba(255,255,255,.95); color: var(--ink); font-weight: 700; border: 1px solid rgba(41,35,60,.08); transition: .2s }
.header-actions a:hover, .header-actions button:hover { transform: translateY(-1px); box-shadow: 0 16px 30px rgba(65,43,87,.08) }
.header-phone { background: #fff; color: var(--ink); border: none; white-space: nowrap }
.header-phone .phone-label { display: inline }
.header-phone .phone-icon { display: inline }
.header-search-wrapper { position: relative }
.header-search-toggle { width: 48px; height: 48px; border: 0; border-radius: 16px; background: #fff; color: var(--ink); font-size: 1.2rem; cursor: pointer; transition: .2s; box-shadow: 0 10px 25px rgba(22,18,45,.08) }
.header-search-toggle:hover, .header-search-toggle:focus-visible { transform: translateY(-1px); box-shadow: 0 16px 28px rgba(22,18,45,.12) }
.header-search { position: absolute; top: calc(100% + 10px); right: 0; z-index: 50; display: flex; align-items: center; gap: .5rem; width: min(340px,100vw); padding: .85rem .95rem; border: 1px solid rgba(41,35,60,.14); border-radius: 22px; background: #fff; opacity: 0; visibility: hidden; transform: translateY(-10px); transition: .18s ease,opacity .18s ease,visibility .18s ease }
.header-search-wrapper.is-open .header-search { opacity: 1; visibility: visible; transform: translateY(0) }
.header-search input { flex: 1; border: 0; outline: 0; padding: .8rem 1rem; border-radius: 16px; background: #f6f2ff; color: var(--ink); font: inherit; min-width: 120px; box-shadow: inset 0 2px 8px rgba(116,95,177,.08) }
.header-search input::placeholder { color: #8d8a96; opacity: 1 }
.header-search button { border: 0; background: var(--purple); color: #fff; border-radius: 16px; padding: .8rem 1rem; cursor: pointer; min-width: 90px; display: grid; place-items: center; font-size: 1rem; font-weight: 800 }
.cart-link { position: relative }
.cart-link b { position: absolute; right: -8px; top: -6px; background: var(--pink); color: white; border-radius: 20px; font-size: .62rem; width: 17px; height: 17px; text-align: center; line-height: 17px }
.menu-toggle { display: none; border: 0; background: none; font-size: 1.75rem; color: var(--ink) }
main { min-height: 70vh }
.hero { max-width: 1240px; min-height: 580px; margin: 30px auto 90px; padding: 80px 7%; display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: 2rem; border-radius: 44px; background: radial-gradient(circle at top left,rgba(255,245,255,.95),transparent 28%),radial-gradient(circle at bottom right,rgba(255,235,243,.88),transparent 32%),linear-gradient(145deg,#fff8ff,#fff2f5 30%,#fffdf9); box-shadow: 0 40px 110px rgba(118,63,172,.14); position: relative; overflow: hidden }
.hero:before { content: ''; position: absolute; right: -6%; top: -8%; width: 280px; height: 280px; border-radius: 52%; background: rgba(255,111,145,.18); filter: blur(18px); opacity: .95 }
.hero:after { content: ''; position: absolute; left: -10%; bottom: -12%; width: 320px; height: 320px; border-radius: 50%; background: rgba(121,87,200,.16); filter: blur(22px); opacity: .92 }
.hero__copy { z-index: 2 }
.eyebrow { display: inline-flex; color: var(--pink); font-size: .92rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; padding: .55rem 1.1rem; background: linear-gradient(135deg,rgba(255,255,255,.9),rgba(255,232,246,.95)); border-radius: 999px; box-shadow: 0 14px 40px rgba(121,87,200,.08); margin-bottom: 1rem }
.hero h1 { font-size: clamp(2.8rem,5vw,5.6rem); line-height: 1.05; margin: 1.2rem 0 1.1rem; max-width: 720px; text-shadow: 0 6px 20px rgba(66,29,107,.08) }
.hero p { color: var(--ink); max-width: 600px; font-size: 1.05rem; line-height: 1.9; margin-bottom: 1.8rem }
.hero-search { display: flex; max-width: 720px; margin: 1.8rem 0 0; gap: .4rem }
.hero-search input { flex: 1; border: 0; padding: 1rem 1.25rem; border-radius: 999px 0 0 999px; background: #fff; color: var(--ink); font-size: 1rem; outline: 0; box-shadow: 0 18px 38px rgba(113,72,169,.1) }
.hero-search input:focus { box-shadow: 0 22px 48px rgba(121,87,200,.16) }
.hero-search button { border: 0; border-radius: 0 999px 999px 0; background: linear-gradient(135deg,#ff6f91,#a64fb3); color: #fff; font-weight: 800; padding: 1rem 1.4rem; cursor: pointer; min-width: 150px; box-shadow: 0 16px 36px rgba(125,91,239,.24); transition: .25s }
.hero-search button:hover { transform: translateY(-1px) }
.hero__actions { display: flex; flex-wrap: wrap; gap: 1rem; margin: 2rem 0 }
.btn { display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: 18px; padding: 1rem 1.7rem; font-weight: 700; cursor: pointer; transition: .25s }
.btn-primary { background: linear-gradient(135deg,#7d5bef,#a15cf2); color: white; box-shadow: 0 12px 30px rgba(125,91,239,.25) }
.btn-primary:hover { transform: translateY(-1px); box-shadow: 0 18px 36px rgba(125,91,239,.28) }
.btn-ghost { border: 1px solid rgba(121,87,200,.18); background: rgba(255,255,255,.85); color: var(--ink) }
.hero__facts { display: flex; flex-wrap: wrap; gap: 1rem; font-size: .95rem; font-weight: 700 }
.hero__facts span { display: inline-flex; align-items: center; gap: .55rem; padding: .95rem 1.15rem; background: linear-gradient(135deg,#fff,#ffeafe); border-radius: 999px; box-shadow: 0 16px 42px rgba(121,87,200,.08) }
.hero__facts span:before { content: '✓'; color: #2fa77c; font-size: .95rem }
.hero__art { position: relative; height: 430px; display: grid; place-items: center; z-index: 1 }
.hero__art .blob { position: absolute; right: -3%; top: 8%; width: 260px; height: 260px; background: rgba(255,111,145,.18); border-radius: 52% 48% 55% 45%; filter: blur(8px); animation: floatSoft 10s ease-in-out infinite }
.hero__art .blob:nth-child(2) { left: 5%; bottom: 8%; width: 220px; height: 220px; background: rgba(121,87,200,.17); border-radius: 45% 55% 52% 48%; filter: blur(10px); animation-duration: 12s }
.hero-pencil, .hero-book, .hero-star { position: absolute; font-size: 7.4rem; filter: drop-shadow(0 18px 22px rgba(62,38,77,.17)); transition: .25s; animation: floatSoft 8s ease-in-out infinite }
.hero-pencil { top: 16%; right: 7%; transform: rotate(-18deg) }
.hero-book { bottom: 18%; left: 12%; transform: rotate(6deg) }
.hero-star { font-size: 3.8rem; left: 22%; top: 38%; color: var(--pink) }

@keyframes floatSoft {
    0%,100% { transform: translateY(0) }
    50% { transform: translateY(-8px) }
}

:pointer;transition:.25s
}
.btn-primary { background: linear-gradient(135deg,#7d5bef,#a15cf2); color: white; box-shadow: 0 12px 30px rgba(125,91,239,.25) }
.btn-primary:hover { transform: translateY(-1px); box-shadow: 0 18px 36px rgba(125,91,239,.28) }
.btn-ghost { border: 1px solid rgba(121,87,200,.18); background: rgba(255,255,255,.85); color: var(--ink) }
.hero__facts { display: flex; flex-wrap: wrap; gap: 1rem; font-size: .95rem; font-weight: 700 }
.hero__facts span { display: inline-flex; align-items: center; gap: .55rem; padding: .85rem 1.1rem; background: rgba(255,255,255,.95); border-radius: 999px; box-shadow: 0 14px 40px rgba(121,87,200,.08) }
.hero__facts span:before { content: "✓"; color: #2fa77c; font-size: .9rem }
.hero__art { position: relative; height: 420px; display: grid; place-items: center }
.hero__art .blob { position: absolute; right: -3%; top: 8%; width: 260px; height: 260px; background: rgba(255,111,145,.18); border-radius: 52% 48% 55% 45%; filter: blur(8px) }
.hero__art .blob:nth-child(2) { left: 5%; bottom: 8%; width: 220px; height: 220px; background: rgba(121,87,200,.17); border-radius: 45% 55% 52% 48%; filter: blur(10px) }
.hero-pencil, .hero-book, .hero-star { position: absolute; font-size: 7.4rem; filter: drop-shadow(0 16px 18px rgba(62,38,77,.15)); transition: .25s }
.hero-pencil { top: 16%; right: 7%; transform: rotate(-18deg) }
.hero-book { bottom: 18%; left: 12%; transform: rotate(6deg) }
.hero-star { font-size: 3.5rem; left: 22%; top: 38%; color: var(--pink) }
.section { max-width: 1240px; margin: 0 auto 45px; padding: 0 15px }
.section-alt { background: rgba(255,248,255,.8); border-radius: 32px; padding: 2.5rem 1.5rem }
.section-head { display: flex; align-items: end; justify-content: space-between; margin-bottom: 2rem }
.section-head h2, .newsletter h2 { font-size: 1.5rem; margin: 0 }
.section-head > a { font-weight: 700; color: var(--purple) }
.category-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 1rem }
.category-card { padding: 1.7rem; background: white; border: 1px solid var(--line); border-radius: 22px; display: flex; flex-direction: column; transition: .2s }
.category-card:hover { transform: translateY(-5px); box-shadow: var(--shadow) }
.category-card span { font-size: 1.8rem; color: var(--pink) }
.category-card strong { font-size: 1.1rem }
.category-card small { color: var(--muted) }
.product-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1.5rem }
.product-card { background: white; border-radius: 24px; overflow: hidden; border: 1px solid var(--line); transition: .2s }
.product-card:hover { transform: translateY(-5px); box-shadow: var(--shadow) }
.product-card__image { display: block; height: 280px; position: relative; background: #f4eff5 }
.product-card__image img { width: 100%; height: 100%; object-fit: cover }
.badge { position: absolute; right: 14px; top: 14px; background: rgba(255,255,255,.92); padding: .25rem .75rem; border-radius: 30px; font-size: .72rem }
.product-card__body { padding: 1.3rem }
.product-card__body small { color: var(--muted) }
.product-card h3 { margin: .1rem 0; font-size: 1.1rem }
.product-card p { font-size: .82rem; color: var(--muted); margin: .3rem 0 1rem }
.price { display: flex; align-items: center; gap: .8rem; padding: 1rem; }
.price strong { color: var(--purple) }
.price del { font-size: .75rem; color: #aaa }
.add-cart { width: 100%; margin-top: 1rem; padding: .7rem; border: 0; border-radius: 12px; background: #f1ebff; color: var(--purple); font-weight: 700 }
.article-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1.5rem }
.article-card { background: white; border-radius: 24px; overflow: hidden; border: 1px solid var(--line); transition: .2s; display: grid; grid-template-rows: auto 1fr }
.article-card:hover { transform: translateY(-5px); box-shadow: var(--shadow) }
.article-card__image { height: 220px; overflow: hidden; background: #f7f0ff; display: grid; place-items: center }
.article-card__image img { width: 100%; height: 100%; object-fit: cover }
.article-card > div { padding: 1.4rem; display: flex; flex-direction: column; gap: .85rem }
.article-card small { color: var(--muted); font-size: .82rem }
.article-card h3 { margin: 0; font-size: 1.1rem; line-height: 1.5 }
.article-card p { color: var(--muted); font-size: .92rem; line-height: 1.8; margin: 0 }
.article-card__link { margin-top: auto; color: var(--purple); font-weight: 700 }
.about-section { padding: 0 }
.about-card { background: #fff; border-radius: 32px; padding: 2.5rem; box-shadow: 0 28px 80px rgba(74,44,102,.08) }
.about-card .eyebrow { margin-bottom: 1rem }
.about-card h2 { font-size: 1.5rem; line-height: 1.15; margin: .35rem 0 1.2rem; max-width: 680px }
.about-card p { color: var(--muted); font-size: 1rem; line-height: 1.85 }
.about-tiles { display: grid; grid-template-columns: repeat(3,1fr); gap: 1rem; margin-top: 2rem }
.about-tiles div { background: rgba(247,230,255,.85); border: 1px solid rgba(121,87,200,.16); border-radius: 22px; padding: 1.35rem; min-height: 138px; display: flex; flex-direction: column; gap: .6rem }
.about-tiles strong { display: block; margin-bottom: .55rem; font-size: 1rem; color: var(--ink) }
.about-tiles p { margin: 0; color: var(--muted); font-size: .92rem; line-height: 1.7 }
.newsletter { max-width: 1192px; margin: 0 auto 90px; padding: 2.3rem 3rem; border-radius: 26px; background: var(--ink); color: white; display: flex; align-items: center; justify-content: space-between }
.newsletter form { display: flex; background: white; border-radius: 14px; padding: .35rem }
.newsletter input { border: 0; outline: 0; padding: .65rem 1rem; min-width: 260px }
.newsletter button { border: 0; border-radius: 10px; background: var(--pink); color: white; padding: .6rem 1.3rem }
footer { background: #f2eaf4; padding: 60px max(24px,calc((100% - 1192px)/2)); display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 3rem }
footer > div { display: flex; flex-direction: column; align-items: start; gap: .5rem }
footer p { color: var(--muted); max-width: 320px }
.footer-menu { gap: .4rem }
.footer-menu strong { font-size: .95rem; color: var(--ink) }
.footer-menu a { font-size: .92rem; color: var(--muted) }

/* footer brand */
.footer-brand { display: flex; flex-direction: column; align-items: start; gap: .75rem }
.footer-logo { display: flex; flex-direction: column; align-items: center; gap: .45rem; text-decoration: none }
.footer-logo img { width: 64px; height: 64px; object-fit: contain; border-radius: 16px; background: #fff; border: 1px solid rgba(41,35,60,.08); padding: .4rem }
.footer-logo span { font-size: 1.1rem; font-weight: 800; color: var(--ink) }

/* footer social column */
.footer-social { display: flex; flex-direction: column; gap: 1rem }
.footer-enamad { display: flex }
.enamad { background: white; border-radius: 16px; padding: 1rem 1.2rem; text-align: center; display: flex; flex-direction: column; align-items: center; gap: .25rem; border: 1px solid var(--line); min-width: 90px }
.enamad span { font-size: .65rem; color: var(--muted) }
.enamad strong { font-size: .75rem; color: var(--ink) }
.footer-social__links { display: flex; flex-direction: column; gap: .6rem }
.footer-social__links strong { font-size: .88rem; color: var(--ink) }

/* social buttons */
.social-links { display: flex; flex-direction: row; flex-wrap: wrap; gap: .5rem }
.social-btn { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 12px; border: 1px solid var(--line); background: #fff; color: var(--ink); transition: background .16s,color .16s,border-color .16s,transform .14s; text-decoration: none }
.social-btn svg { width: 20px; height: 20px; flex-shrink: 0 }
.social-btn:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(65,43,87,.12) }
.social-btn--instagram:hover { background: linear-gradient(135deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888); color: #fff; border-color: transparent }
.social-btn--whatsapp:hover { background: #25D366; color: #fff; border-color: transparent }
.social-btn--bale:hover { background: #2aabee; color: #fff; border-color: transparent }
.social-btn--telegram:hover { background: #0088cc; color: #fff; border-color: transparent }

@media(max-width:900px) {
    footer { grid-template-columns: 1fr 1fr; gap: 2rem }
    .footer-brand { grid-column: 1/-1 }
    .footer-social { grid-column: 1/-1; flex-direction: row; flex-wrap: wrap; gap: 1.5rem }
    .social-links { flex-direction: row; flex-wrap: wrap }
}

@media(max-width:580px) {
    footer { grid-template-columns: 1fr; padding: 40px 20px }
    .footer-social { flex-direction: column }
}

.breadcrumb, .product-detail, .description, .admin-head, .stats, .admin-links, .settings-form, .inline-form, .table { max-width: 1192px; margin-left: auto; margin-right: auto }
.breadcrumb { padding: 2rem 24px; color: var(--muted); font-size: .8rem }
.product-detail { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; padding: 0 24px 70px }
.product-gallery img { width: 100%; height: 540px; object-fit: cover; border-radius: 30px }
.product-info h1 { font-size: 2.4rem }
.detail-price { font-size: 1.5rem; font-weight: 800; color: var(--purple); margin: 1.5rem 0 }
.product-info select { width: 100%; padding: .8rem; border: 1px solid var(--line); border-radius: 12px; background: white }
.quantity { display: flex; margin: 1.2rem 0 }
.quantity button, .quantity input { width: 44px; height: 42px; text-align: center; border: 1px solid var(--line); background: white }
.w-100 { width: 100% }
.benefits { color: var(--muted); font-size: .85rem }
.admin-head { padding: 3rem 24px 2rem; display: flex; justify-content: space-between; align-items: center }
.admin-head h1 { margin: 0 }
.stats { padding: 0 24px; display: grid; grid-template-columns: repeat(4,1fr); gap: 1rem }
.stats div { background: white; border: 1px solid var(--line); padding: 1.4rem; border-radius: 18px }
.stats small { display: block; color: var(--muted) }
.stats strong { font-size: 1.8rem }
.admin-links { padding: 2rem 24px; display: grid; grid-template-columns: 1fr 1fr; gap: 1rem }
.admin-links a { background: white; padding: 1.2rem; border-radius: 16px; border: 1px solid var(--line); display: flex; justify-content: space-between }
.settings-form, .inline-form { padding: 0 24px 70px }
.settings-form fieldset { border: 1px solid var(--line); background: white; border-radius: 18px; margin-bottom: 1rem; padding: 1.5rem }
.settings-form label { display: block; margin: .7rem 0 }
.settings-form input, .inline-form input { width: 100%; padding: .75rem; border: 1px solid var(--line); border-radius: 10px }
.inline-form { display: grid; grid-template-columns: 2fr 1fr auto; gap: 1rem }
.table { width: calc(100% - 48px); background: white; border-collapse: collapse }
.table th, .table td { padding: 1rem; border-bottom: 1px solid var(--line); text-align: right }
.auth-page { max-width: 1240px; margin: 42px auto 80px; padding: 0 24px }
.auth-card { min-height: 660px; display: grid; grid-template-columns: .9fr 1.1fr; background: var(--white); border: 1px solid var(--line); border-radius: 32px; overflow: hidden; box-shadow: var(--shadow) }
.auth-visual { position: relative; padding: 38px 48px; display: flex; flex-direction: column; justify-content: space-between; overflow: hidden; background: linear-gradient(150deg,#efe4ff,#ffe4ed 62%,#fff0c1) }
.auth-visual:before, .auth-visual:after { content: ""; position: absolute; border-radius: 50%; background: rgba(255,255,255,.35) }
.auth-visual:before { width: 280px; height: 280px; left: -110px; top: 90px }
.auth-visual:after { width: 190px; height: 190px; right: -70px; bottom: 100px }
.auth-brand { position: relative; z-index: 2; font-size: 1.35rem; font-weight: 800 }
.auth-brand span { color: var(--pink) }
.auth-visual h2 { position: relative; z-index: 2; margin: 0; font-size: 2rem }
.auth-visual p { position: relative; z-index: 2; color: #5f5770; max-width: 400px }
.auth-illustration { position: relative; height: 300px }
.auth-shape { position: absolute; z-index: 2; filter: drop-shadow(0 16px 12px rgba(65,43,87,.15)) }
.auth-shape--one { font-size: 7rem; right: 14%; top: 28px; transform: rotate(-16deg) }
.auth-shape--two { font-size: 6rem; left: 12%; bottom: 10px; transform: rotate(9deg) }
.auth-shape--three { font-size: 3.5rem; left: 8%; top: 8px; color: var(--pink) }
.auth-content { width: min(100%,550px); margin: auto; padding: 56px 60px }
.auth-heading { margin-bottom: 2rem }
.auth-heading h1 { font-size: 2rem; line-height: 1.4; margin: .1rem 0 .45rem }
.auth-heading p { color: var(--muted); margin: 0 }
.auth-form { display: flex; flex-direction: column; gap: 1.15rem }
.field > label, .field-label-row label { display: block; font-weight: 700; font-size: .88rem; margin-bottom: .4rem }
.field-label-row { display: flex; justify-content: space-between; align-items: center }
.field-label-row a { font-size: .77rem; color: var(--purple); font-weight: 600 }
.field-input { height: 52px; display: flex; align-items: center; gap: .65rem; border: 1px solid var(--line); border-radius: 13px; padding: 0 .9rem; background: #fdfbfe; transition: .2s }
.field-input:focus-within { border-color: var(--purple); box-shadow: 0 0 0 4px rgba(121,87,200,.1); background: #fff }
.field-input > span { color: #a499ac }
.field-input input { height: 100%; min-width: 0; flex: 1; border: 0; outline: 0; background: transparent; color: var(--ink) }
.password-toggle { border: 0; background: none; color: var(--purple); font-size: .72rem; font-weight: 700; cursor: pointer }
.field-error { display: block; color: #c93857; font-size: .74rem; margin-top: .3rem }
.field-error:empty { display: none }
.form-errors { padding: .8rem 1rem; border-radius: 11px; background: #fff0f3; color: #ad2f4b; font-size: .8rem }
.form-errors:empty, .form-errors.validation-summary-valid { display: none }
.form-errors ul { margin: 0; padding-right: 1rem }
.check-field { display: flex; align-items: center; gap: .55rem; font-size: .8rem; color: var(--muted); cursor: pointer }
.check-field input { width: 17px; height: 17px; accent-color: var(--purple) }
.check-field a, .auth-switch a { color: var(--purple); font-weight: 700 }
.auth-submit { width: 100%; height: 52px; margin-top: .35rem }
.auth-switch { text-align: center; color: var(--muted); font-size: .85rem; margin: 1.5rem 0 .65rem }
.auth-back { display: block; text-align: center; color: var(--muted); font-size: .77rem }
.auth-back:hover { color: var(--purple) }
.dynamic-menu { display: flex; gap: 1.7rem; align-items: center; flex: 1 }
.dynamic-menu__item { position: relative }
.dynamic-menu__item > a { font-size: .9rem; font-weight: 650; display: flex; align-items: center; gap: .3rem; padding: 1.6rem 0 }
.dynamic-menu__item > a > span { font-size: .7rem; color: var(--muted) }
.menu-panel { position: absolute; z-index: 50; right: -20px; top: calc(100% - 7px); width: 300px; padding: 18px; background: #fff; border: 1px solid var(--line); border-radius: 18px; box-shadow: var(--shadow); opacity: 0; visibility: hidden; transform: translateY(8px); transition: .18s }
.has-panel:hover > .menu-panel, .has-panel:focus-within > .menu-panel { opacity: 1; visibility: visible; transform: none }
.menu-panel--products { width: 560px }
.menu-products { display: grid; grid-template-columns: 1fr 1fr; gap: 10px }
.menu-product { display: flex; gap: 10px; align-items: center; padding: 8px; border-radius: 12px }
.menu-product:hover { background: #faf6ff }
.menu-product img { width: 58px; height: 58px; object-fit: cover; border-radius: 10px; background: #f4eff5 }
.menu-product span { display: flex; flex-direction: column }
.menu-product strong { font-size: .78rem }
.menu-product small { color: var(--purple); font-size: .7rem }
.menu-categories, .menu-children { display: grid; gap: 5px }
.menu-categories a, .menu-children a { padding: .6rem .7rem; border-radius: 9px; font-size: .82rem; display: flex; justify-content: space-between }
.menu-categories a:hover, .menu-children a:hover { background: #f5efff; color: var(--purple) }
.menu-text p { font-size: .8rem; color: var(--muted); margin: .35rem 0 }
.footer-menu { display: flex; flex-direction: column; align-items: start; gap: .5rem }
.public-subtree { list-style: none; padding: 0; margin: 0 }
.public-subtree .public-subtree { margin-right: .75rem; padding-right: .65rem; border-right: 1px solid var(--line) }
.public-subtree li > a { display: block }
.admin-page { max-width: 1460px; margin: 28px auto 80px; padding: 0 24px; display: grid; grid-template-columns: 250px minmax(0,1fr); gap: 24px; align-items: start }
.admin-nav { position: sticky; top: 20px; background: var(--ink); color: #fff; border-radius: 22px; padding: 20px 14px; display: flex; flex-direction: column; gap: 18px; max-height: calc(100vh - 40px); overflow-y: auto; overflow-x: hidden }
.admin-nav__brand { font-weight: 800; font-size: 1.1rem; padding: 4px 10px 15px; border-bottom: 1px solid rgba(255,255,255,.12); flex-shrink: 0 }
.admin-nav__brand span { color: var(--pink) }
.admin-nav__group { display: flex; flex-direction: column; gap: 4px; flex-shrink: 0 }
.admin-nav__group small { color: #b5adc3; font-size: .72rem; padding: 0 10px 7px; font-weight: 600 }
.admin-nav__group > a { padding: .7rem .75rem; border-radius: 10px; font-size: 1rem; display: flex; justify-content: space-between; align-items: center; transition: all .2s }
.admin-nav__group > a:hover { background: rgba(255,255,255,.12) }
.admin-nav__group .is-planned { color: #c4bdcd }
.admin-nav__group .is-planned span { font-size: .58rem; background: rgba(255,255,255,.12); padding: .15rem .4rem; border-radius: 10px; font-weight: 600 }
.admin-nav::-webkit-scrollbar { width: 6px }
.admin-nav::-webkit-scrollbar-track { background: rgba(255,255,255,.05); border-radius: 10px }
.admin-nav::-webkit-scrollbar-thumb { background: rgba(255,255,255,.2); border-radius: 10px }
.admin-nav::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,.3) }
.admin-main { min-width: 0 }
.admin-main > .admin-head { padding: 1rem 0 2rem; max-width: none }
.admin-head p { margin: .2rem 0; color: var(--muted) }
.admin-main > .stats, .admin-main > .admin-links, .admin-main > .settings-form, .admin-main > .inline-form, .admin-main > .table { max-width: none }
.admin-main > .stats, .admin-main > .admin-links, .admin-main > .settings-form, .admin-main > .inline-form { padding-left: 0; padding-right: 0 }
.admin-card { background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 20px; box-shadow: 0 8px 25px rgba(65,43,87,.05); overflow-x: auto }
.admin-table { width: 100%; border-collapse: collapse; min-width: 780px }
.admin-table th, .admin-table td { padding: .85rem .7rem; text-align: right; border-bottom: 1px solid var(--line); font-size: .78rem }
.admin-table th { color: var(--muted); font-size: .7rem }
.admin-table code { direction: ltr; display: inline-block; background: #f5f1f7; padding: .15rem .4rem; border-radius: 5px }
.cell-muted { color: var(--muted); max-width: 260px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis }
.table-actions { display: flex; gap: .65rem; align-items: center }
.table-actions a, .table-actions button { border: 0; background: none; color: var(--purple); font-size: .72rem; cursor: pointer; padding: 0 }
.table-actions button { color: #c93857 }
.table-actions form { margin: 0 }
.status { display: inline-block; padding: .18rem .55rem; border-radius: 20px; background: #eee; color: #777; font-size: .65rem }
.status--on { background: #e1f8ee; color: #167554 }
.admin-form { max-width: 900px }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 1.2rem }
.admin-form label > span { display: block; font-size: .78rem; font-weight: 700; margin-bottom: .35rem }
.admin-form input:not([type=checkbox]), .admin-form select, .admin-form textarea { width: 100%; border: 1px solid var(--line); border-radius: 10px; padding: .72rem .8rem; background: #fdfbfe; outline: 0 }
.admin-form input:focus, .admin-form select:focus, .admin-form textarea:focus { border-color: var(--purple); box-shadow: 0 0 0 3px rgba(121,87,200,.08) }
.admin-form em { display: block; color: #c93857; font-size: .68rem; font-style: normal }
.form-wide { grid-column: 1/-1 }
.form-actions, .check-row { display: flex; gap: .8rem; margin-top: 1.4rem }
.admin-back { display: inline-block; margin-top: 1rem; color: var(--purple); font-size: .8rem }
.alert { max-width: 1192px; margin: 0 auto 1rem; padding: .8rem 1rem; border-radius: 10px }
.alert-success { background: #e4f7ee; color: #176e50 }
.alert-error { background: #fff0f3; color: #a92c49 }
.catalog-filters { display: grid; grid-template-columns: 2fr 1fr auto; gap: .8rem; margin-bottom: 1rem }
.catalog-filters input, .catalog-filters select, .variant-form input { border: 1px solid var(--line); border-radius: 10px; padding: .68rem .75rem; background: #fdfbfe }
.admin-product { display: flex; align-items: center; gap: .6rem }
.admin-product img { width: 44px; height: 44px; object-fit: cover; border-radius: 8px; background: #f2edf4 }
.stock-low { color: #c93857; font-weight: 800 }
.variant-form { display: grid; grid-template-columns: 1.4fr 1fr 1fr .7fr auto auto; gap: .7rem; align-items: center; margin-bottom: 1rem }
.catalog-hero { max-width: 1192px; margin: 35px auto 30px; padding: 55px 60px; border-radius: 28px; background: linear-gradient(135deg,#f3e8ff,#ffe9ef 60%,#fff1c8) }
.catalog-hero h1 { margin: .2rem 0; font-size: 2.5rem }
.catalog-hero p { color: var(--muted); margin: 0 }
.catalog-layout { max-width: 1192px; margin: 0 auto 90px; padding: 0 24px; display: grid; grid-template-columns: 210px minmax(0,1fr); gap: 2rem }
.catalog-sidebar { position: sticky; top: 20px; align-self: start; background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 1.2rem; display: flex; flex-direction: column }
.catalog-sidebar h3 { margin: 0 0 .7rem }
.catalog-sidebar a { padding: .55rem .7rem; border-radius: 9px; color: var(--muted); font-size: .82rem }
.catalog-sidebar a:hover, .catalog-sidebar a.active { background: #f3edff; color: var(--purple); font-weight: 700 }
.store-search { display: flex; background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: .35rem; margin-bottom: .8rem }
.store-search input { flex: 1; border: 0; outline: 0; padding: .55rem .8rem; background: transparent }
.store-search button { border: 0; border-radius: 10px; background: var(--purple); color: #fff; padding: .55rem 1.2rem }
.catalog-count { font-size: .75rem; color: var(--muted); margin-bottom: 1rem }
.catalog-results .product-grid { grid-template-columns: repeat(3,1fr) }
.catalog-results .product-card__image { height: 230px }
.catalog-results .add-cart { display: block; text-align: center }
.empty-state { background: #fff; border: 1px dashed #d9ccdf; border-radius: 18px; padding: 3rem; text-align: center }
.empty-state p { color: var(--muted) }
.tree-quick-create { display: grid; grid-template-columns: 1.3fr 1fr .8fr 1fr auto; gap: .7rem; align-items: center; margin-bottom: 1rem }
.tree-quick-create > div { display: flex; flex-direction: column }
.tree-quick-create small { color: var(--muted); font-size: .65rem }
.tree-quick-create input, .tree-quick-create select { border: 1px solid var(--line); border-radius: 10px; padding: .68rem .75rem; background: #fdfbfe; min-width: 0 }
.tree-toolbar { display: flex; justify-content: space-between; align-items: center; padding: .6rem .2rem; color: var(--muted); font-size: .68rem }
.tree-legend { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin: 0 .45rem 0 .15rem }
.tree-legend--link { background: #6c85d8 }
.tree-legend--text { background: #d889ac }
.tree-legend--product { background: #8b69ce }
.tree-legend--category { background: #42a982 }
#tree-status { color: var(--purple); font-weight: 700 }
.menu-tree { padding: 16px }
.tree-root-drop { border: 1px dashed #cfc0dc; border-radius: 10px; color: var(--muted); font-size: .68rem; text-align: center; padding: .45rem; margin-bottom: .8rem; transition: .15s }
.tree-root-drop.is-over { background: #eee7ff; border-color: var(--purple); color: var(--purple) }
.tree-list { list-style: none; margin: .45rem 0 0; padding: 0 28px 0 0; border-right: 1px dashed #dacfe0 }
.tree-list--root { padding-right: 0; border-right: 0 }
.tree-node { position: relative; margin: .45rem 0 }
.tree-node__card { min-height: 58px; display: flex; align-items: center; gap: .7rem; border: 1px solid var(--line); border-radius: 12px; background: #fff; padding: .55rem .7rem; transition: .15s; cursor: grab }
.tree-node__card:active { cursor: grabbing }
.tree-node.is-dragging > .tree-node__card { opacity: .4 }
.tree-node__card.drop-inside { background: #f0eaff; border-color: var(--purple); box-shadow: inset 0 0 0 2px rgba(121,87,200,.12) }
.tree-node__card.drop-before { border-top: 4px solid var(--pink) }
.tree-node__card.drop-after { border-bottom: 4px solid var(--pink) }
.tree-handle { color: #aaa; font-size: 1.1rem }
.tree-type { font-size: .6rem; border-radius: 20px; padding: .18rem .5rem; white-space: nowrap }
.tree-type--link { background: #e9edff; color: #4965bb }
.tree-type--text { background: #ffedf5; color: #aa527a }
.tree-type--product { background: #eee8ff; color: #6643b8 }
.tree-type--category { background: #e4f8ef; color: #197658 }
.tree-node__title { min-width: 0; display: flex; flex: 1; flex-direction: column }
.tree-node__title strong { font-size: .8rem }
.tree-node__title small { color: var(--muted); font-size: .62rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 420px }
.tree-node__actions { display: flex; align-items: center; gap: .55rem }
.tree-node__actions a, .tree-node__actions button { border: 0; background: none; color: var(--purple); font-size: .68rem; cursor: pointer; padding: 0 }
.tree-node__actions button { color: #c93857 }
.tree-node__actions form { margin: 0 }
.classic-tree-shell { min-height: 600px }
.classic-tree-options { display: flex; justify-content: flex-start; align-items: center; gap: 1rem; margin-bottom: .8rem }
.tree-search { height: 38px; width: 260px; display: flex; align-items: center; gap: .4rem; border: 1px solid #cfcfcf; background: #fff; padding: 0 .65rem }
.tree-search input { min-width: 0; flex: 1; border: 0; outline: 0; background: transparent }
.classic-tree-toolbar { display: flex; flex-wrap: wrap; border: 1px solid #aaa; background: #f4f4f4; margin-bottom: 1rem }
.tree-tool { border: 0; border-left: 1px solid #aaa !important; border-radius: 0; background: linear-gradient(#fff,#e4e4e4); padding: .48rem .75rem; font: inherit; font-size: .72rem; color: #222; cursor: pointer }
.tree-tool:last-child { border-left: 0 !important }
.tree-tool:hover { background: #e7e0f4; color: var(--purple) }
.tree-tool--danger:hover { background: #fff0f2; color: #b72847 }
.classic-quick-panel { display: grid; grid-template-columns: auto 1.5fr 1fr 1.2fr auto auto; gap: .55rem; align-items: center; background: #faf8fc; border: 1px solid var(--line); padding: .7rem; margin-bottom: .8rem }
.classic-quick-panel[hidden] { display: none }
.classic-quick-panel input, .classic-quick-panel select { border: 1px solid #ccc; padding: .5rem .6rem; min-width: 0 }
.classic-tree-status { display: flex; justify-content: space-between; align-items: center; font-size: .68rem; color: var(--muted); border-bottom: 1px solid var(--line); padding-bottom: .55rem }
.classic-tree { padding: 16px 8px 60px; min-height: 400px }
.classic-tree-list { list-style: none; margin: 0; padding: 0 24px 0 0; position: relative }
.classic-tree-list:not(.classic-tree-list--root) { border-right: 1px dotted #999 }
.classic-tree-list:not(.classic-tree-list--root) > .classic-tree-node:before { content: ""; position: absolute; right: -24px; top: 16px; width: 20px; border-top: 1px dotted #999 }
.classic-tree-node { position: relative; margin: 1px 0 }
.classic-tree-row { display: flex; align-items: center; gap: .42rem; min-height: 29px; width: max-content; max-width: 100%; padding: 1px 3px; border: 1px solid transparent; cursor: default }
.classic-tree-row[draggable=true] { cursor: grab }
.classic-tree-node.is-selected > .classic-tree-row { background: #e8e0f7; border-color: #a991ce }
.classic-tree-node.is-dragging > .classic-tree-row { opacity: .4 }
.classic-tree-row.drop-inside { background: #e5daf8; border-color: var(--purple) }
.classic-tree-row.drop-before { border-top: 3px solid var(--pink) }
.classic-tree-row.drop-after { border-bottom: 3px solid var(--pink) }
.classic-toggle { width: 15px; height: 15px; padding: 0; border: 1px solid #999; background: #eee; line-height: 11px; font-size: .72rem; color: #444 }
.classic-toggle:disabled { border-color: transparent; background: none }
.classic-node-title { border: 0; background: none; padding: .1rem .15rem; color: #174da5; font-size: .77rem; cursor: pointer; white-space: nowrap }
.root-node > .classic-tree-row .classic-node-title { font-size: .82rem }
.classic-module { background: #ddd; border-radius: 3px; padding: .12rem .45rem; font-size: .64rem; color: #444; white-space: nowrap }
.classic-module--product { background: #ded9e9 }
.classic-module--category { background: #dcece5; color: #276b51 }
.classic-module--text { background: #ede2e7; color: #7b415b }
.classic-module--link { background: #e1e7ef; color: #425b78 }
.classic-inactive { font-size: .58rem; color: #a92c49 }
.tree-id { display: none; direction: ltr; font-size: .56rem; color: #999; background: transparent }
.show-ids .tree-id { display: inline }
.classic-empty { margin: .5rem 25px; color: var(--muted); font-size: .7rem }

@media(max-width:800px) {
    .site-header { width: calc(100% - 12px); max-width: calc(100% - 12px); gap: .75rem; align-items: center; flex-wrap: nowrap; padding: 12px 14px; border-radius: 0 0 18px 18px }
    .menu-toggle { display: block }
    nav { display: none }
    .header-actions { margin-right: auto; justify-content: flex-start; width: auto; gap: .45rem; flex-wrap: nowrap }
    .header-actions a, .header-actions button { min-width: 40px; min-height: 40px; padding: .5rem; border-radius: 12px; font-size: .95rem }
    .header-phone { padding: .5rem }
    .header-phone .phone-label { display: none }
    .header-search-toggle { width: 40px; height: 40px; border-radius: 12px }
    .header-search { width: min(300px,calc(100vw - 24px)); max-width: none }
    .logo-image { width: 48px; height: 48px }
    .hero { margin: 12px 12px 60px; padding: 45px 28px; grid-template-columns: 1fr }
    .hero__art { height: 240px }
    .hero-pencil, .hero-book { font-size: 5.2rem }
    .hero-star { font-size: 3rem }
    .hero h1 { font-size: 2.55rem }
    .hero__facts { flex-wrap: wrap }
    .category-grid, .product-grid { grid-template-columns: 1fr 1fr }
    .newsletter { margin: 0 12px 60px; flex-direction: column; align-items: stretch; padding: 2rem }
    .newsletter form { margin-top: 1rem }
    .newsletter input { min-width: 0; width: 100% }
    footer { grid-template-columns: 1fr 1fr }
    .product-detail { grid-template-columns: 1fr; gap: 1.5rem }
    .product-gallery img { height: 390px }
    .stats { grid-template-columns: 1fr 1fr }
    .inline-form { grid-template-columns: 1fr }
}

.classic-node-name { width: 150px; border: 1px solid transparent; background: transparent; padding: .12rem .25rem; color: #174da5; font: inherit; font-size: .77rem; outline: 0 }
.classic-node-name:hover { border-color: #cbc2d3; background: #fff }
.classic-node-name:focus { width: 210px; border-color: var(--purple); background: #fff; box-shadow: 0 0 0 2px rgba(121,87,200,.1) }
.root-node > .classic-tree-row .classic-node-name { font-size: .82rem; font-weight: 800 }
.classic-menu-icon { width: 18px; height: 18px; object-fit: contain }
.admin-dialog { width: min(680px,calc(100% - 24px)); border: 0; border-radius: 20px; padding: 0; box-shadow: 0 25px 80px rgba(34,22,48,.3) }
.admin-dialog::backdrop { background: rgba(28,20,35,.5); backdrop-filter: blur(2px) }
.admin-dialog__box { padding: 24px }
.admin-dialog__head { display: flex; justify-content: space-between; align-items: start; margin-bottom: 1.2rem }
.admin-dialog__head h2 { font-size: 1.25rem; margin: 0 }
.admin-dialog__head > button { border: 0; background: #f1edf3; border-radius: 50%; width: 32px; height: 32px; font-size: 1.2rem }
.seo-fieldset { border: 1px solid var(--line); border-radius: 14px; padding: 1rem; margin: 1.3rem 0 }
.seo-fieldset legend { font-weight: 800; padding: 0 .5rem }
.banner-form { display: grid; grid-template-columns: 1fr 1.5fr 1.2fr 1fr .5fr auto auto; gap: .6rem; align-items: center; margin-bottom: 1rem }
.banner-form input { border: 1px solid var(--line); border-radius: 9px; padding: .65rem; min-width: 0 }
.banner-admin-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1rem }
.banner-admin-card { background: #fff; border: 1px solid var(--line); border-radius: 14px; overflow: hidden }
.banner-admin-card img { width: 100%; height: 150px; object-fit: cover }
.banner-admin-card > div { padding: .8rem; display: flex; flex-direction: column }
.banner-admin-card small { color: var(--muted) }
.banner-admin-card button { border: 0; background: none; color: #c93857; padding: 0; margin-top: .5rem }
.media-current { display: grid; grid-template-columns: 1fr 2fr; gap: 1rem }
.media-current > div { border: 1px dashed var(--line); border-radius: 10px; padding: .6rem; display: flex; align-items: center; gap: .7rem }
.media-current img { width: 72px; height: 52px; object-fit: contain; border-radius: 7px }
.dashboard-main { display: flex; flex-direction: column; gap: 1.2rem }
.dashboard-welcome { display: flex; justify-content: space-between; align-items: center; padding: .7rem 0 }
.dashboard-welcome h1 { margin: 0; font-size: 1.55rem }
.dashboard-welcome p { margin: .2rem 0; color: #758094; font-size: .78rem }
.dashboard-date { background: #fff; border: 1px solid #e2e6ed; border-radius: 10px; padding: .55rem .8rem; font-size: .78rem; display: flex; flex-direction: column }
.dashboard-date small { color: #8c95a3; font-size: .58rem }
.kpi-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 1rem }
.kpi-card { position: relative; background: #fff; border: 1px solid #e3e7ee; border-radius: 15px; padding: 1rem; display: flex; align-items: center; gap: .8rem; box-shadow: 0 5px 15px rgba(25,42,70,.035) }
.kpi-card > div { display: flex; flex: 1; flex-direction: column }
.kpi-card small { color: #768196; font-size: .67rem }
.kpi-card strong { font-size: 1.45rem; line-height: 1.4 }
.kpi-card em { font-style: normal; color: #929baa; font-size: .58rem }
.kpi-card > b { color: #9ba3b0 }
.kpi-icon { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; font-weight: 800 }
.kpi-card--purple .kpi-icon { background: #eee8ff; color: #7152c2 }
.kpi-card--blue .kpi-icon { background: #e7f2ff; color: #337fc1 }
.kpi-card--green .kpi-icon { background: #e4f8ef; color: #23835f }
.kpi-card--orange .kpi-icon { background: #fff1df; color: #bc7622 }
.dashboard-grid { display: grid; grid-template-columns: 2fr 1fr; gap: 1rem }
.dashboard-panel, .quick-actions { background: #fff; border: 1px solid #e2e6ed; border-radius: 15px; padding: 1rem 1.1rem; box-shadow: 0 5px 15px rgba(25,42,70,.025) }
.panel-head { display: flex; justify-content: space-between; align-items: start; margin-bottom: .9rem }
.panel-head h2 { font-size: .9rem; margin: 0 }
.panel-head p { font-size: .62rem; color: #8b94a3; margin: .1rem 0 }
.panel-head > a { font-size: .65rem; color: #6552b6 }
.sales-chart { height: 205px; display: flex; align-items: end; gap: .7rem; border-bottom: 1px solid #e6e9ef; padding: 15px 5px 0 }
.chart-column { height: 100%; display: flex; flex: 1; flex-direction: column; justify-content: end; align-items: center }
.chart-column > span { position: relative; width: min(38px,70%); min-height: 4px; background: linear-gradient(180deg,#7b61cf,#a78fe4); border-radius: 7px 7px 2px 2px }
.chart-column i { display: none; position: absolute; bottom: calc(100% + 4px); left: 50%; transform: translateX(-50%); background: #282235; color: #fff; border-radius: 5px; padding: .15rem .35rem; font-size: .52rem; font-style: normal; white-space: nowrap }
.chart-column > span:hover i { display: block }
.chart-column small { font-size: .55rem; color: #9099a6; margin-top: .35rem }
.structure-list { display: flex; flex-direction: column }
.structure-list a { display: flex; justify-content: space-between; padding: .7rem 0; border-bottom: 1px solid #edf0f4; font-size: .73rem }
.structure-list strong { color: #6650b5 }
.dashboard-table { width: 100%; border-collapse: collapse }
.dashboard-table th, .dashboard-table td { padding: .55rem; text-align: right; border-bottom: 1px solid #edf0f4; font-size: .65rem }
.dashboard-table th { color: #87909e }
.attention-list { display: flex; flex-direction: column }
.attention-list a { display: flex; align-items: center; justify-content: space-between; padding: .58rem 0; border-bottom: 1px solid #edf0f4 }
.attention-list span { display: flex; flex-direction: column }
.attention-list strong { font-size: .68rem }
.attention-list small { font-size: .56rem; color: #8d96a4 }
.attention-list b { font-size: .62rem; color: #ba4a50; background: #fff0f1; padding: .2rem .45rem; border-radius: 15px }
.panel-empty { padding: 2rem; text-align: center; color: #8b94a2; font-size: .7rem }
.quick-actions > div:last-child { display: grid; grid-template-columns: repeat(5,1fr); gap: .7rem }
.quick-actions > div:last-child a { border: 1px solid #e4e7ed; border-radius: 10px; padding: .65rem; display: flex; align-items: center; gap: .5rem; font-size: .68rem }
.quick-actions > div:last-child a:hover { border-color: #8d78cc; background: #faf8ff }
.quick-actions > div:last-child span { width: 26px; height: 26px; display: grid; place-items: center; background: #f0ecfb; color: #6a53b8; border-radius: 7px }
.media-upload { display: grid; grid-template-columns: 1.5fr 1fr 1.2fr auto; gap: .7rem; margin-bottom: 1rem }
.media-upload input { border: 1px solid var(--line); border-radius: 9px; padding: .65rem; min-width: 0 }
.media-filters { display: flex; gap: .4rem; flex-wrap: wrap; margin-bottom: 1rem }
.media-filters a { background: #fff; border: 1px solid #e0e4eb; border-radius: 18px; padding: .25rem .65rem; font-size: .63rem }
.media-filters a.active { background: #2c2940; color: #fff }
.media-library-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 1rem }
.media-library-card { background: #fff; border: 1px solid #e1e5eb; border-radius: 12px; overflow: hidden }
.media-library-card.is-disabled { opacity: .5 }
.media-library-card > img { width: 100%; height: 160px; object-fit: cover; background: #edf0f4 }
.media-library-card > div { padding: .65rem; display: flex; flex-direction: column }
.media-library-card strong { font-size: .68rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis }
.media-library-card small { font-size: .55rem; color: #8992a0 }
.media-library-card code { font-size: .5rem; direction: ltr; white-space: nowrap; overflow: hidden; text-overflow: ellipsis }
.media-library-card button { border: 0; background: none; color: #725bbf; font-size: .58rem; padding: 0 }
.menu-banner-rotator { position: relative; max-width: 1192px; height: 360px; margin: 30px auto; border-radius: 28px; overflow: hidden; background: #eee }
.menu-banner-slide { display: block; width: 100%; height: 100%; position: relative }
.menu-banner-slide img { width: 100%; height: 100%; object-fit: cover }
.menu-banner-slide > span { position: absolute; right: 45px; bottom: 38px; background: rgba(255,255,255,.9); padding: .7rem 1.2rem; border-radius: 12px; font-size: 1.2rem }
.rotator-dots { position: absolute; bottom: 14px; left: 50%; transform: translateX(-50%); display: flex; gap: .4rem }
.rotator-dots button { width: 8px; height: 8px; border: 0; border-radius: 50%; background: rgba(255,255,255,.6); padding: 0 }
.rotator-dots button.active { width: 24px; border-radius: 8px; background: #fff }
.menu-content-page { max-width: 1240px; margin: 0px auto 90px; padding: 0 24px }
.menu-content-page > h1 { font-size: 2.5rem; margin: .2rem 0 1rem }
.menu-page-icon { width: 52px; height: 52px; object-fit: contain }
.menu-page-copy { /*max-width: 850px;*/ color: var(--muted); margin-bottom: 2rem }
.editorial-grid--menu { margin-top: 3rem }

@media(max-width:1100px) {
    .kpi-grid { grid-template-columns: 1fr 1fr }
    .dashboard-grid { grid-template-columns: 1fr }
    .quick-actions > div:last-child { grid-template-columns: repeat(3,1fr) }
}

@media(max-width:1000px) {
    .admin-page { grid-template-columns: 1fr }
    .admin-nav { position: static; min-height: 0 }
    .admin-nav__group { display: grid; grid-template-columns: repeat(2,1fr) }
    .dynamic-menu { display: none }
    .variant-form { grid-template-columns: 1fr 1fr }
    .catalog-results .product-grid { grid-template-columns: repeat(2,1fr) }
    .tree-quick-create { grid-template-columns: 1fr 1fr }
    .classic-quick-panel { grid-template-columns: 1fr 1fr }
    .classic-tree-toolbar { overflow-x: auto; flex-wrap: nowrap }
    .tree-tool { white-space: nowrap }
}

@media(max-width:900px) {
    .auth-card { grid-template-columns: 1fr }
    .auth-visual { min-height: 240px; padding: 28px 34px }
    .auth-illustration { position: absolute; left: 20px; top: 15px; width: 200px; height: 190px; opacity: .85 }
    .auth-shape--one { font-size: 4.5rem }
    .auth-shape--two { font-size: 4rem }
    .auth-visual h2 { font-size: 1.5rem }
    .auth-visual p { margin: 0; max-width: 55% }
    .auth-content { padding: 42px 38px }
}

@media(max-width:700px) {
    .catalog-layout { grid-template-columns: 1fr }
    .catalog-sidebar { position: static }
    .catalog-sidebar { display: grid; grid-template-columns: repeat(2,1fr) }
    .catalog-sidebar h3 { grid-column: 1/-1 }
    .catalog-results .product-grid { grid-template-columns: 1fr }
    .catalog-hero { margin: 15px 12px 25px; padding: 35px 25px }
    .catalog-hero h1 { font-size: 1.8rem }
    .catalog-filters { grid-template-columns: 1fr }
}

@media(max-width:500px) {
    .logo { font-size: 1.15rem }
    .hero__art { display: none }
    .category-grid, .product-grid, footer, .admin-links { grid-template-columns: 1fr }
    .product-card__image { height: 240px }
    .article-grid { grid-template-columns: 1fr }
    .article-card__image { height: 220px }
    .about-card { padding: 1.8rem }
    .about-tiles { grid-template-columns: 1fr }
    .section { margin-bottom: 60px }
    .stats { grid-template-columns: 1fr 1fr }
    .auth-page { margin: 18px auto 50px; padding: 0 12px }
    .auth-card { border-radius: 22px }
    .auth-visual { min-height: 175px; padding: 24px }
    .auth-visual p { max-width: 78%; font-size: .78rem }
    .auth-visual h2 { font-size: 1.25rem }
    .auth-illustration { left: -5px; top: 20px; transform: scale(.7) }
    .auth-content { padding: 34px 22px }
    .auth-heading h1 { font-size: 1.6rem }
    .field-label-row { align-items: end }
    .admin-page { padding: 0 12px }
    .admin-nav__group { grid-template-columns: 1fr }
    .form-grid { grid-template-columns: 1fr }
    .form-wide { grid-column: auto }
    .admin-head { align-items: flex-start; gap: 1rem; flex-direction: column }
    .variant-form { grid-template-columns: 1fr }
    .tree-quick-create { grid-template-columns: 1fr }
    .tree-list { padding-right: 14px }
    .tree-node__card { flex-wrap: wrap }
    .tree-node__title { min-width: 140px }
    .tree-node__actions { width: 100%; justify-content: flex-end; padding-top: .3rem; border-top: 1px solid var(--line) }
    .classic-tree-options { align-items: stretch; flex-direction: column }
    .tree-search { width: 100% }
    .classic-quick-panel { grid-template-columns: 1fr }
    .classic-tree-list { padding-right: 15px }
    .classic-tree-list:not(.classic-tree-list--root) > .classic-tree-node:before { right: -15px; width: 12px }
}

/* Content, interaction and operational modules */
.admin-nav { max-height: calc(100vh - 104px); overflow-y: auto; scrollbar-width: thin; scrollbar-color: #625a72 transparent }
.admin-nav::-webkit-scrollbar { width: 5px }
.admin-nav::-webkit-scrollbar-thumb { background: #625a72; border-radius: 8px }
.head-actions { display: flex; align-items: center; gap: .65rem; flex-wrap: wrap }
.head-actions > a, .head-actions > button { display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: 11px; background: var(--purple); color: #fff; padding: .68rem 1rem; font-size: .78rem; font-weight: 750 }
.admin-empty, .public-empty { grid-column: 1/-1; text-align: center; color: var(--muted); padding: 3rem 1rem; border: 1px dashed var(--line); border-radius: 16px; background: rgba(255,255,255,.55) }
.danger-link { border: 0; background: none; color: #c93857; cursor: pointer; font-weight: 700 }
.alert-error { background: #fff0f3; color: #a92e4b }
.admin-pagination, .public-pagination { display: flex; justify-content: center; gap: .45rem; margin-top: 1.5rem }
.admin-pagination a, .public-pagination a { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid var(--line); border-radius: 10px; background: #fff }
.admin-pagination a.is-active, .public-pagination a.is-active { background: var(--purple); border-color: var(--purple); color: #fff }
.form-section-title { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); padding: 0 0 .75rem; margin: 1.5rem 0 1rem }
.form-section-title:first-of-type { margin-top: 0 }
.form-section-title b { display: block; font-size: .92rem }
.form-section-title small { display: block; color: var(--muted); font-size: .7rem }
.content-editor-form { max-width: none }
.content-current-media { display: flex; align-items: center; gap: 1rem }
.content-current-media img { width: 110px; height: 76px; object-fit: cover; border-radius: 12px }
.tag-check-grid { display: flex; gap: .55rem; flex-wrap: wrap }
.tag-check-grid label { cursor: pointer }
.tag-check-grid input { position: absolute; opacity: 0 }
.tag-check-grid span { display: block; padding: .42rem .75rem; background: #f5f1fa; border: 1px solid var(--line); border-radius: 30px; font-size: .75rem }
.tag-check-grid input:checked + span { background: #eee7ff; border-color: #a58bdc; color: #6542b8 }
.publish-row { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; border-top: 1px solid var(--line); margin-top: 1.5rem; padding-top: 1.2rem }
.publish-row .check-field { margin-left: auto }
.seo-fieldset { background: #fbf9fd }
.seo-fieldset legend { color: #554968 }
.seo-fieldset small { display: block; color: var(--muted); font-size: .68rem; margin-top: .25rem }
.content-admin-filter { display: grid; grid-template-columns: 1fr auto; gap: .75rem; margin-bottom: 1rem }
.content-admin-filter input, .phrase-filter input, .phrase-filter select, .error-admin-filter input, .error-admin-filter select, .audit-filter input, .audit-filter select { border: 1px solid var(--line); border-radius: 10px; padding: .7rem .8rem; background: #fff }
.content-admin-list { display: grid; gap: .2rem }
.content-admin-list > article { display: grid; grid-template-columns: 64px minmax(0,1fr) auto auto; align-items: center; gap: 1rem; padding: .8rem; border-bottom: 1px solid var(--line) }
.content-admin-list > article:last-child { border-bottom: 0 }
.content-admin-thumb { width: 58px; height: 58px; border-radius: 12px; background: #f3edfa; overflow: hidden; display: grid; place-items: center; color: var(--purple) }
.content-admin-thumb img { width: 100%; height: 100%; object-fit: cover }
.content-admin-list h2 { font-size: .9rem; margin: 0 }
.content-admin-list p { color: var(--muted); font-size: .72rem; margin: .15rem 0 }
.content-admin-list small { color: #8c8495; font-size: .66rem }
.grid-actions { display: flex; gap: .4rem }
.grid-actions form { margin: 0 }
.grid-action { position: relative; width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid var(--line) !important; border-radius: 9px; background: #fff !important; color: #655873 !important; cursor: pointer }
.grid-action svg { width: 16px; fill: none; stroke: currentColor; stroke-width: 1.8 }
.grid-action--danger { color: #c93857 !important }
.grid-action:after { content: attr(data-tooltip); position: absolute; bottom: calc(100% + 6px); white-space: nowrap; background: #2f293a; color: #fff; padding: .2rem .45rem; border-radius: 5px; font-size: .6rem; opacity: 0; pointer-events: none; transform: translateY(3px); transition: .15s }
.grid-action:hover:after { opacity: 1; transform: none }
.tag-admin-layout, .phrase-admin-layout { display: grid; grid-template-columns: minmax(0,1fr) 320px; gap: 1rem }
.tag-create-card, .phrase-create { position: sticky; top: 84px }
.tag-create-card h2, .phrase-create h2, .module-item-manager h2 { margin-top: 0; font-size: 1rem }
.tag-create-card .admin-form, .phrase-create .admin-form, .module-item-manager .admin-form { display: grid; gap: .8rem }
.tag-admin-list article { display: grid; grid-template-columns: minmax(0,1fr) auto auto; align-items: center; gap: 1rem; padding: 1rem 0; border-bottom: 1px solid var(--line) }
.tag-admin-list article:last-child { border-bottom: 0 }
.tag-admin-list small, .tag-admin-list p { display: block; color: var(--muted); font-size: .68rem; margin: .1rem 0 }
.tag-assignment-card { margin-top: 1rem }
.tag-assignment-form { display: grid; grid-template-columns: 1fr 1fr 1fr auto; gap: .75rem }
.tag-assignment-form select { min-width: 0; border: 1px solid var(--line); border-radius: 10px; padding: .7rem; background: #fff }
.tag-assignment-list { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: 1rem }
.tag-assignment-list > span { display: flex; align-items: center; gap: .45rem; background: #f5f1fa; border-radius: 30px; padding: .35rem .7rem; font-size: .68rem }
.tag-assignment-list em { font-style: normal; color: var(--muted) }
.tag-assignment-list button { border: 0; background: none; color: #c93857; font-size: 1rem; cursor: pointer }
.poll-admin-grid, .module-admin-grid, .gallery-admin-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem }
.poll-admin-grid > article, .module-admin-grid > article { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 1rem }
.poll-admin-grid article > header { grid-column: 1/-1; display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: .75rem }
.poll-admin-icon, .module-card-icon { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: #efe8ff; color: var(--purple); font-weight: 900 }
.poll-admin-grid h2, .module-admin-grid h2, .gallery-admin-grid h2 { font-size: .92rem; margin: 0 }
.poll-admin-grid p, .module-admin-grid p, .gallery-admin-grid p { font-size: .72rem; color: var(--muted); margin: .25rem 0 }
.poll-admin-metrics { grid-column: 1/-1; display: flex; gap: .5rem }
.poll-admin-metrics span { flex: 1; background: #f8f6fa; border-radius: 10px; padding: .6rem; font-size: .7rem }
.poll-admin-metrics b { display: block; font-size: .95rem }
.poll-admin-grid footer, .module-admin-grid footer, .gallery-admin-grid footer { grid-column: 1/-1; background: transparent; padding: .75rem 0 0; border-top: 1px solid var(--line); display: flex; align-items: center; gap: 1rem; font-size: .72rem }
.poll-admin-grid footer form, .module-admin-grid footer form, .gallery-admin-grid footer form { margin-right: auto }
.poll-edit-layout, .module-edit-layout { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(290px,.65fr); gap: 1rem; align-items: start }
.poll-option-manager, .module-item-manager { position: sticky; top: 84px }
.poll-option-add { display: grid; grid-template-columns: 1fr 80px auto; gap: .55rem }
.poll-option-add input { min-width: 0; border: 1px solid var(--line); border-radius: 10px; padding: .65rem }
.poll-option-list { display: grid; gap: .7rem; margin-top: 1rem }
.poll-option-list article { border: 1px solid var(--line); border-radius: 12px; padding: .75rem }
.poll-option-list article.is-disabled { opacity: .55 }
.poll-option-list header { display: flex; justify-content: space-between; gap: 1rem; font-size: .72rem }
.poll-option-list article > div { height: 7px; background: #eee9f1; border-radius: 10px; overflow: hidden; margin: .6rem 0 }
.poll-option-list article > div span { display: block; height: 100%; background: linear-gradient(90deg,var(--purple),var(--pink)); border-radius: inherit }
.poll-option-list footer { background: transparent; padding: 0; display: flex; gap: .7rem; font-size: .68rem }
.poll-option-list footer button { border: 0; background: none; color: var(--purple); cursor: pointer }
.gallery-admin-grid > article { overflow: hidden; padding: 0 }
.gallery-admin-grid > article > img, .gallery-placeholder { width: 100%; height: 190px; object-fit: cover; background: #eee8f6; display: grid; place-items: center; color: var(--purple); font-size: 2rem }
.gallery-admin-grid > article > div:not(.gallery-placeholder) { padding: 1rem }
.gallery-admin-grid > article > footer { padding: .75rem 1rem }
.gallery-image-manager { margin-top: 1rem; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .8rem }
.gallery-image-manager article { display: grid; grid-template-columns: 100px minmax(0,1fr); gap: .8rem; border: 1px solid var(--line); border-radius: 13px; padding: .65rem }
.gallery-image-manager article.is-disabled { opacity: .55 }
.gallery-image-manager img { width: 100px; height: 90px; object-fit: cover; border-radius: 9px }
.gallery-image-manager strong { font-size: .8rem }
.gallery-image-manager p, .gallery-image-manager small { font-size: .66rem; color: var(--muted); margin: .1rem 0 }
.gallery-image-manager footer { grid-column: 1/-1; background: transparent; padding: 0; border-top: 1px solid var(--line); display: flex; gap: .7rem }
.gallery-image-manager footer button { border: 0; background: none; color: var(--purple); font-size: .68rem; cursor: pointer }
.phrase-tabs { display: flex; gap: .4rem; margin-bottom: 1rem }
.phrase-tabs a { padding: .55rem .9rem; border-radius: 10px; background: #fff; border: 1px solid var(--line); font-size: .75rem }
.phrase-tabs a.is-active { background: var(--ink); color: #fff; border-color: var(--ink) }
.phrase-filter, .error-admin-filter, .audit-filter { display: grid; grid-template-columns: auto 1fr auto; gap: .7rem; margin-bottom: 1rem }
.phrase-list > form { border-bottom: 1px solid var(--line); padding: 1rem 0 }
.phrase-list > form:last-child { border-bottom: 0 }
.phrase-list header { display: flex; justify-content: space-between; gap: 1rem; margin-bottom: .45rem }
.phrase-list header code { font-size: .7rem; color: var(--purple) }
.phrase-list header small { font-size: .65rem; color: var(--muted) }
.phrase-list textarea { width: 100%; border: 1px solid var(--line); border-radius: 10px; padding: .65rem; resize: vertical }
.phrase-list footer { background: transparent; padding: .4rem 0 0; display: flex; align-items: center; justify-content: space-between; color: var(--muted); font-size: .63rem }
.phrase-list footer button { border: 0; background: #f0eaff; color: var(--purple); padding: .4rem .7rem; border-radius: 8px; font-weight: 700 }
.error-admin-stats { display: grid; grid-template-columns: repeat(4,1fr); gap: .8rem; margin-bottom: 1rem }
.error-admin-stats > div { background: #fff; border: 1px solid var(--line); border-radius: 15px; padding: 1rem }
.error-admin-stats small { display: block; color: var(--muted); font-size: .68rem }
.error-admin-stats strong { font-size: 1.4rem }
.error-admin-filter { grid-template-columns: 1fr 170px 170px auto }
.error-log-list { display: grid; gap: .7rem }
.error-log-list details { padding: 0; overflow: hidden }
.error-log-list details.is-resolved { opacity: .68 }
.error-log-list summary { display: grid; grid-template-columns: auto minmax(0,1fr) auto auto; gap: .8rem; align-items: center; padding: 1rem; cursor: pointer; list-style: none }
.error-log-list summary::-webkit-details-marker { display: none }
.error-log-list summary strong { font-size: .78rem }
.error-log-list summary p { margin: .1rem 0; color: var(--muted); font-size: .7rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis }
.error-log-list summary small { font-size: .62rem; color: #8d8493 }
.error-source { font-size: .62rem; padding: .25rem .5rem; border-radius: 20px; background: #f0eaff; color: var(--purple) }
.error-source--client { background: #fff1da; color: #926300 }
.error-log-list details > section { border-top: 1px solid var(--line); padding: 1rem; background: #fbfafc }
.error-log-list dl { display: grid; grid-template-columns: repeat(3,1fr); gap: .6rem }
.error-log-list dl div { min-width: 0 }
.error-log-list dt { font-size: .62rem; color: var(--muted) }
.error-log-list dd { margin: 0; font-size: .68rem; overflow: hidden; text-overflow: ellipsis }
.error-log-list pre { max-height: 260px; overflow: auto; background: #29233c; color: #eee4fa; border-radius: 10px; padding: 1rem; font-size: .65rem }
.audit-filter { grid-template-columns: 1fr 150px auto }
.audit-table td small { display: block; color: var(--muted) }
.audit-status { display: inline-block; border-radius: 20px; padding: .18rem .5rem; background: #ffe9ed; color: #b83250 }
.audit-status.is-success { background: #e2f7ed; color: #177554 }
.table-scroll { overflow-x: auto }
.sitemap-summary { display: grid; grid-template-columns: repeat(4,1fr); gap: .8rem }
.sitemap-summary > div { background: #fff; border: 1px solid var(--line); border-radius: 15px; padding: 1rem }
.sitemap-summary small { display: block; color: var(--muted); font-size: .67rem }
.sitemap-summary strong { font-size: 1.35rem }
.sitemap-guide { display: grid; gap: .7rem; margin-top: 1rem }
.sitemap-guide > div { display: flex; align-items: flex-start; gap: .8rem; background: #fff; border: 1px solid var(--line); border-radius: 13px; padding: .8rem }
.sitemap-guide span { display: grid; place-items: center; flex: 0 0 32px; height: 32px; border-radius: 10px; background: #eee7ff; color: var(--purple); font-weight: 800 }
.sitemap-guide p { font-size: .75rem; margin: 0 }
.site-breadcrumb { display: block; max-width: 1240px; margin: 0 auto; padding: 1rem 24px; overflow: hidden }
.site-breadcrumb ol { display: flex; align-items: center; gap: .45rem; list-style: none; margin: 0; padding: 0; white-space: nowrap; overflow-x: auto; scrollbar-width: none }
.site-breadcrumb li { display: flex; align-items: center; gap: .45rem; font-size: .95rem; color: var(--muted) }
.site-breadcrumb li:last-child { color: var(--ink); /*font-weight: 650*/ }
.site-breadcrumb a:hover { color: var(--purple) }
.module-hero, .editorial-hero { max-width: 1192px; margin: 25px auto 45px; padding: 54px 7%; border-radius: 28px; background: linear-gradient(135deg,#f1e8ff,#ffe9ef 60%,#fff3cc); text-align: center }
.module-hero--compact { padding-top: 38px; padding-bottom: 38px }
.module-hero h1, .editorial-hero h1 { font-size: clamp(1.8rem,4vw,3rem); margin: .1rem 0 }
.module-hero p, .editorial-hero p { max-width: 700px; margin: .7rem auto 0; color: var(--muted) }

/* Editorial List - Modern Design */
.editorial-shell { max-width: 1240px; margin: 0 auto 80px; padding: 0 24px }
.editorial-header { text-align: center; margin-bottom: 3rem; padding-top: 2rem }
.editorial-header h1 { font-size: clamp(2rem,4vw,2.8rem); margin: .2rem 0; color: var(--ink); font-weight: 800 }
.editorial-header p { color: var(--muted); font-size: 1.05rem; margin: .7rem auto 0; max-width: 650px }

.editorial-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1.8rem }

.editorial-card { background: #fff; border: 1px solid var(--line); border-radius: 20px; overflow: hidden; transition: all .25s ease; display: flex; flex-direction: column; height: 100% }
.editorial-card:hover { transform: translateY(-5px); box-shadow: 0 10px 35px rgba(0,0,0,.1) }

.editorial-card__image { position: relative; height: 220px; background: linear-gradient(135deg,#eee8f5,#ffe9ef); display: flex; align-items: center; justify-content: center; overflow: hidden }
.editorial-card__image img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease }
.editorial-card:hover .editorial-card__image img { transform: scale(1.05) }
.editorial-card__placeholder { color: var(--purple); font-size: 3rem; opacity: .4 }

.editorial-card__content { padding: 1.2rem 1.3rem; display: flex; flex-direction: column; gap: .65rem; flex: 1 }

.editorial-card__meta { display: flex; align-items: center; gap: .4rem; font-size: .7rem; color: var(--muted); direction: rtl }
.editorial-card__dot { opacity: .5 }
.editorial-card__date, .editorial-card__reading { font-weight: 500 }

.editorial-card h2 { font-size: 1.05rem; line-height: 1.65; margin: 0; font-weight: 700 }
.editorial-card h2 a { color: var(--ink); transition: color .2s }
.editorial-card h2 a:hover { color: var(--purple) }

.editorial-card__excerpt { font-size: .8rem; color: var(--muted); line-height: 1.7; margin: 0; flex: 1 }

.editorial-card__footer { display: flex; align-items: center; justify-content: space-between; gap: .7rem; margin-top: auto; padding-top: .75rem; border-top: 1px solid #f0f0f0 }

.editorial-card__tags { display: flex; gap: .35rem; flex-wrap: wrap; flex: 1; align-items: center }
.editorial-card__tag { background: #f5f0ff; color: var(--purple); padding: .22rem .55rem; border-radius: 11px; font-size: .66rem; font-weight: 600; transition: all .2s; display: inline-block }
.editorial-card__tag:hover { background: var(--purple); color: #fff }

.editorial-card__more { color: var(--purple); font-size: .73rem; font-weight: 650; white-space: nowrap; transition: all .2s; padding: .25rem .5rem; border-radius: 8px; flex-shrink: 0 }
.editorial-card__more:hover { background: #f5f0ff; transform: translateX(-2px) }

/* Editorial Detail Page */
.editorial-detail-layout { max-width: 1240px; margin: 0px auto 80px; padding: 0 24px; display: grid; grid-template-columns: 1fr 340px; gap: 2.5rem; align-items: start }

.editorial-detail-main { background: #fff; border: 1px solid var(--line); border-radius: 24px; padding: 2.5rem; box-shadow: 0 2px 12px rgba(0,0,0,.04) }

.editorial-detail-header { text-align: center; margin-bottom: 2.5rem; padding-bottom: 2rem; border-bottom: 1px solid #f0f0f0 }
.editorial-detail-header .eyebrow { display: inline-block; background: linear-gradient(135deg,#eee8f5,#ffe9ef); color: var(--purple); padding: .35rem .85rem; border-radius: 20px; font-size: .7rem; font-weight: 700; margin-bottom: .8rem; text-transform: uppercase; letter-spacing: .5px }
.editorial-detail-header h1 { font-size: clamp(1.8rem,4vw,2.8rem); line-height: 1.4; margin: .3rem 0 .8rem; color: var(--ink) }
.editorial-detail-excerpt { color: var(--muted); font-size: 1.08rem; line-height: 1.8; margin: 0 auto 1.5rem; max-width: 750px }

.editorial-detail-meta { display: flex; justify-content: center; gap: 1.5rem; flex-wrap: wrap; font-size: .8rem; color: var(--muted) }
.meta-item { display: flex; align-items: center; gap: .4rem }
.meta-item svg { color: var(--purple); opacity: .7 }

.editorial-detail-hero { margin: 0 -2.5rem 2.5rem; border-radius: 0 }
.editorial-detail-hero img { width: 100%; max-height: 520px; object-fit: cover; display: block }

.editorial-body { font-size: 1rem; line-height: 2; color: #2c2940; margin-bottom: 2.5rem }
.editorial-body img { max-width: 100%; height: auto; border-radius: 16px; margin: 1.5rem 0 }
.editorial-body h2, .editorial-body h3 { margin-top: 2.5rem; margin-bottom: 1rem; line-height: 1.5; color: var(--ink) }
.editorial-body h2 { font-size: 1.6rem }
.editorial-body h3 { font-size: 1.3rem }
.editorial-body p { margin: 1.2rem 0 }
.editorial-body ul, .editorial-body ol { margin: 1.2rem 0; padding-right: 1.5rem }
.editorial-body li { margin: .5rem 0 }
.editorial-body blockquote { border-right: 4px solid var(--purple); padding: 1rem 1.5rem; margin: 1.5rem 0; background: #faf8ff; border-radius: 12px; font-style: italic; color: var(--muted) }
.editorial-body code { background: #f5f0ff; color: var(--purple); padding: .2rem .5rem; border-radius: 6px; font-size: .9em; font-family: monospace }

.editorial-tags { background: transparent; padding: 1.5rem 0; border-top: 1px solid #f0f0f0; display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: 2rem }
.editorial-tags a { background: #f5f0ff; color: var(--purple); padding: .4rem .8rem; border-radius: 20px; font-size: .75rem; font-weight: 600; transition: all .2s }
.editorial-tags a:hover { background: var(--purple); color: #fff; transform: translateY(-2px) }

.editorial-comments { margin-top: 2rem; padding-top: 2rem; border-top: 1px solid #f0f0f0 }

/* Sidebar */
.editorial-detail-sidebar { position: sticky; top: 24px; display: flex; flex-direction: column; gap: 1.5rem }

.sidebar-widget { background: #fff; border: 1px solid var(--line); border-radius: 20px; padding: 1.5rem; box-shadow: 0 2px 12px rgba(0,0,0,.04) }
.sidebar-widget-title { font-size: 1.1rem; font-weight: 700; margin: 0 0 1.2rem; color: var(--ink); padding-bottom: .8rem; border-bottom: 2px solid var(--purple) }

.sidebar-articles { display: flex; flex-direction: column; gap: 1rem }
.sidebar-article { display: flex; gap: .8rem; padding: .8rem; border-radius: 12px; transition: all .2s; border: 1px solid transparent }
.sidebar-article:hover { background: #faf8ff; border-color: #f0eaf8; transform: translateX(-3px) }
.sidebar-article-image { width: 70px; height: 70px; object-fit: cover; border-radius: 10px; flex-shrink: 0 }
.sidebar-article-placeholder { width: 70px; height: 70px; border-radius: 10px; background: linear-gradient(135deg,#eee8f5,#ffe9ef); display: flex; align-items: center; justify-content: center; color: var(--purple); font-size: 1.5rem; opacity: .5; flex-shrink: 0 }
.sidebar-article-content { flex: 1; min-width: 0 }
.sidebar-article h4 { font-size: .85rem; line-height: 1.5; margin: 0 0 .4rem; color: var(--ink); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden }
.sidebar-article-date { font-size: .68rem; color: var(--muted) }

.sidebar-qa { display: flex; flex-direction: column; gap: 1rem }
.sidebar-qa-item { padding: .9rem; background: #faf8ff; border-radius: 12px; border: 1px solid #f0eaf8 }
.sidebar-qa-question { display: flex; gap: .5rem; align-items: start; margin-bottom: .5rem }
.sidebar-qa-question svg { flex-shrink: 0; margin-top: .1rem; color: var(--purple) }
.sidebar-qa-question strong { font-size: .82rem; line-height: 1.5; color: var(--ink) }
.sidebar-qa-answer { font-size: .75rem; line-height: 1.7; color: var(--muted); padding-right: 1.6rem }

/* Gallery Detail (similar to editorial but simpler) */
.gallery-detail { max-width: 920px; margin: 20px auto 80px; padding: 0 24px }
.gallery-detail > header { text-align: center; margin-bottom: 2rem }
.gallery-detail h1 { font-size: clamp(1.8rem,4vw,3rem); line-height: 1.45; margin: .3rem 0 }
.gallery-detail header > p { color: var(--muted); font-size: 1rem }
.gallery-detail header > div { display: flex; justify-content: center; gap: 1rem; flex-wrap: wrap; color: var(--muted); font-size: .7rem }
.poll-public-grid, .link-collection-grid, .gallery-public-grid, .public-link-grid { max-width: 1192px; margin: 0 auto 80px; padding: 0 24px; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem }
.poll-public-grid > a, .link-collection-grid > a { background: #fff; border: 1px solid var(--line); border-radius: 20px; padding: 1.2rem; display: flex; gap: 1rem; transition: .2s }
.poll-public-grid > a:hover, .link-collection-grid > a:hover { transform: translateY(-4px); box-shadow: var(--shadow) }
.poll-public-grid > a > span, .link-collection-grid > a > span { display: grid; place-items: center; flex: 0 0 44px; height: 44px; border-radius: 13px; background: #eee7ff; color: var(--purple); font-size: 1.2rem }
.poll-public-grid h2, .link-collection-grid h2, .public-link-grid h2 { font-size: .95rem; margin: .1rem 0 }
.poll-public-grid p, .link-collection-grid p, .public-link-grid p { font-size: .72rem; color: var(--muted); margin: .25rem 0 }
.poll-public-grid small, .poll-public-grid b, .link-collection-grid small { font-size: .66rem; color: var(--purple) }
.poll-public-detail { max-width: 720px; margin: 30px auto 80px; padding: 2rem; background: #fff; border: 1px solid var(--line); border-radius: 24px; text-align: center }
.poll-public-detail h1 { font-size: 1.65rem; line-height: 1.6 }
.poll-public-detail > p { color: var(--muted) }
.poll-vote-form { display: grid; gap: .7rem; text-align: right; margin-top: 1.5rem }
.poll-vote-form label { display: flex; align-items: center; gap: .7rem; border: 1px solid var(--line); border-radius: 13px; padding: .75rem; cursor: pointer }
.poll-vote-form input { accent-color: var(--purple) }
.poll-voted { background: #e5f7ef; color: #187251; border-radius: 12px; padding: .8rem; text-align: center }
.public-link-grid > a { display: flex; align-items: center; gap: 1rem; background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 1rem }
.public-link-grid img, .public-link-grid > a > span { width: 70px; height: 70px; border-radius: 13px; object-fit: cover; background: #eee7ff; display: grid; place-items: center; color: var(--purple); font-size: 1.3rem }
.gallery-public-grid > a { position: relative; min-height: 300px; border-radius: 22px; overflow: hidden; background: #eee8f5 }
.gallery-public-grid img { width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0 }
.gallery-public-grid > a > span { display: grid; place-items: center; height: 100%; font-size: 2rem; color: var(--purple) }
.gallery-public-grid > a > div { position: absolute; inset: auto 0 0; padding: 1rem; color: #fff; background: linear-gradient(transparent,rgba(25,18,37,.88)) }
.gallery-public-grid h2 { font-size: 1.05rem; margin: .15rem 0 }
.gallery-public-grid p, .gallery-public-grid small { font-size: .7rem; margin: 0 }
.gallery-masonry { columns: 3 230px; column-gap: .8rem }
.gallery-masonry button { position: relative; display: block; width: 100%; margin: 0 0 .8rem; padding: 0; border: 0; border-radius: 16px; overflow: hidden; background: #eee8f5; cursor: zoom-in; break-inside: avoid }
.gallery-masonry img { display: block; width: 100%; height: auto }
.gallery-masonry button > span { position: absolute; inset: auto 0 0; padding: 1.5rem .8rem .7rem; text-align: right; color: #fff; background: linear-gradient(transparent,rgba(20,16,27,.8)); opacity: 0; transition: .2s }
.gallery-masonry button:hover > span { opacity: 1 }
.gallery-masonry small { display: block }
.gallery-lightbox { width: min(92vw,1000px); border: 0; border-radius: 20px; padding: 0; background: #19151f; color: #fff; box-shadow: 0 30px 80px rgba(0,0,0,.4) }
.gallery-lightbox::backdrop { background: rgba(16,12,21,.82); backdrop-filter: blur(5px) }
.gallery-lightbox img { display: block; max-width: 100%; max-height: 78vh; margin: auto }
.gallery-lightbox > button { position: absolute; z-index: 2; left: 12px; top: 12px; width: 38px; height: 38px; border: 0; border-radius: 50%; background: rgba(0,0,0,.55); color: #fff; font-size: 1.4rem }
.gallery-lightbox p { padding: 0 1rem 1rem; text-align: center }

@media(max-width:1000px) {
    .admin-nav { max-height: none; overflow: visible }
    .tag-admin-layout, .phrase-admin-layout, .poll-edit-layout, .module-edit-layout { grid-template-columns: 1fr }
    .tag-create-card, .phrase-create, .poll-option-manager, .module-item-manager { position: static }
    .poll-admin-grid, .module-admin-grid, .gallery-admin-grid { grid-template-columns: 1fr }
    .editorial-grid, .poll-public-grid, .link-collection-grid, .gallery-public-grid, .public-link-grid { grid-template-columns: repeat(2,minmax(0,1fr)) }
    .editorial-detail-layout { grid-template-columns: 1fr }
    .editorial-detail-sidebar { position: static; display: grid; grid-template-columns: repeat(2,1fr); gap: 1.5rem }
}

@media(max-width:700px) {
    .content-admin-list > article { grid-template-columns: 54px minmax(0,1fr) auto }
    .content-admin-list > article > .status { display: none }
    .tag-assignment-form, .phrase-filter, .error-admin-filter, .audit-filter { grid-template-columns: 1fr }
    .error-admin-stats, .sitemap-summary { grid-template-columns: repeat(2,1fr) }
    .error-log-list summary { grid-template-columns: auto minmax(0,1fr) }
    .error-log-list summary > code, .error-log-list summary > .status { display: none }
    .error-log-list dl { grid-template-columns: 1fr }
    .gallery-image-manager { grid-template-columns: 1fr }
    .editorial-grid, .poll-public-grid, .link-collection-grid, .gallery-public-grid, .public-link-grid { grid-template-columns: 1fr }
    .editorial-header { padding-top: 1rem; margin-bottom: 2rem }
    .editorial-header h1 { font-size: 1.75rem }
    .editorial-header p { font-size: .9rem }
    .editorial-shell { padding: 0 16px; margin-bottom: 50px }
    .editorial-card__image { height: 200px }
    .editorial-card__content { padding: 1rem }
    .editorial-card__footer { flex-direction: column; align-items: flex-start; gap: .6rem }
    .editorial-card__more { align-self: flex-end }
    .editorial-detail-layout { grid-template-columns: 1fr; gap: 1.5rem; padding: 0 16px; margin-bottom: 50px }
    .editorial-detail-main { padding: 1.5rem; border-radius: 18px }
    .editorial-detail-header { padding-bottom: 1.5rem; margin-bottom: 1.5rem }
    .editorial-detail-hero { margin: 0 -1.5rem 1.5rem }
    .editorial-detail-sidebar { position: static; grid-template-columns: 1fr }
    .sidebar-widget { padding: 1.2rem }
    .module-hero, .editorial-hero { margin: 15px 12px 30px; padding: 38px 20px; border-radius: 22px }
    .poll-public-detail { margin: 20px 12px 60px; padding: 1.2rem }
    .gallery-detail { max-width: 920px; margin: 20px auto 80px; padding: 0 16px }
    .poll-option-add { grid-template-columns: 1fr 70px }
    .poll-option-add .btn { grid-column: 1/-1 }
    .publish-row .check-field { width: 100%; margin-left: 0 }
}

/* Product management, media editing and URL operations */
.admin-body .admin-head h1 { font-size: 1.35rem; line-height: 1.45; font-weight: 800 }
.admin-body .admin-head p { font-size: .75rem }
.head-actions { display: flex; align-items: center; gap: .55rem; flex-wrap: wrap }
.head-actions a { font-size: .7rem; border: 1px solid #dfe3ea; border-radius: 8px; background: #fff; padding: .4rem .65rem; color: #5f4eb0 }
.product-editor-form { max-width: none; overflow: visible }
.form-section-title { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #eceef2; padding-bottom: .65rem; margin: 1.8rem 0 1rem }
.form-section-title:first-child { margin-top: 0 }
.form-section-title > div { display: flex; flex-direction: column }
.form-section-title b { font-size: .88rem }
.form-section-title small, .admin-form label > small { color: #8a93a2; font-size: .62rem }
.file-field input[type=file] { background: #f7f5fa; border-style: dashed !important }
.pros-cons-editors { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem }
.rich-field { display: block }
.rich-editor { border: 1px solid #dfe2e8; border-radius: 12px; background: #fff; overflow: hidden; direction: rtl }
.rich-editor:focus-within { border-color: var(--purple); box-shadow: 0 0 0 3px rgba(121,87,200,.08) }
.rich-editor__toolbar { display: flex; align-items: center; gap: 3px; flex-wrap: wrap; padding: 7px; background: #f5f6f8; border-bottom: 1px solid #e3e5ea }
.rich-editor__toolbar button, .rich-editor__toolbar select, .rich-editor__toolbar label { height: 31px; min-width: 31px; width: auto !important; margin: 0 !important; border: 1px solid #d8dce3; border-radius: 6px; background: #fff; padding: 0 .45rem; font-size: .65rem; display: flex !important; align-items: center; justify-content: center; cursor: pointer }
.rich-editor__toolbar select { padding: 0 .35rem }
.rich-editor__toolbar button:hover, .rich-editor__toolbar button.is-active { border-color: #8570ca; background: #eee9ff; color: #654eb8 }
.rich-editor__toolbar input[type=color] { width: 24px; height: 24px; border: 0; padding: 0 }
.rich-editor__surface { min-height: 290px; padding: 18px; outline: 0; line-height: 1.95 }
.pros-cons-editors .rich-editor__surface { min-height: 170px }
.rich-editor__surface img { max-width: 100%; height: auto; border-radius: 8px }
.rich-editor__source { display: block; width: 100%; min-height: 290px; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; background: #18212f !important; color: #e7edf6; font-family: Consolas,monospace; direction: ltr; text-align: left; line-height: 1.6 }
.rich-editor__source[hidden] { display: none }
.rich-editor__status { min-height: 22px; padding: 2px 10px; background: #fafbfc; color: #32805f; font-size: .58rem }
.rich-editor__status.has-error { color: #b72e4b }
.existing-gallery { margin-top: 1rem }
.admin-gallery-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 1rem }
.admin-gallery-item { position: relative; border: 1px solid #e2e5eb; border-radius: 12px; overflow: hidden; padding-bottom: .65rem }
.admin-gallery-item.is-primary { border: 2px solid var(--purple) }
.admin-gallery-item img { width: 100%; height: 150px; object-fit: cover; background: #eef0f3 }
.admin-gallery-item > span { display: block; padding: .35rem .6rem; font-size: .62rem; color: #6c7584 }
.admin-gallery-item > div { display: flex; gap: .5rem; padding: 0 .6rem }
.admin-gallery-item form { margin: 0 }
.admin-gallery-item button, .danger-link { border: 0; background: none; padding: 0; color: #6250af; font-size: .6rem; cursor: pointer }
.admin-gallery-item .danger-link, .danger-link { color: #bd3653 }
.qa-form { max-width: none; margin-bottom: 1rem }
.qa-admin-list { display: grid; gap: 1rem }
.qa-admin-list > .admin-card { overflow: visible }
.qa-admin-list > .admin-card > .admin-form { max-width: none }
.admin-empty { border: 1px dashed #ccd1da; border-radius: 14px; padding: 2rem; text-align: center; color: #818b9b; font-size: .72rem; background: #fff }
.url-rule-form { max-width: none; margin-bottom: 1rem }
.url-rules { display: grid; gap: .8rem }
.url-rule { overflow: visible }
.url-rule .admin-form { max-width: none }
.url-rule__summary { display: flex; align-items: center; justify-content: space-between }
.url-rule__summary > div { display: flex; flex-direction: column }
.url-rule__summary code { direction: ltr; text-align: left; font-size: .78rem }
.url-rule__summary small { color: #8a93a2; font-size: .6rem }
.url-rule > footer { display: flex; align-items: center; gap: 1rem; background: transparent !important; border: 0 !important; padding: .75rem 0 0 !important; margin-top: .75rem; border-top: 1px solid #eceef2 !important; grid-template-columns: none !important; color: #7e8795; font-size: .6rem }
.url-rule > footer form { margin: 0 }
.url-rule > footer button { border: 0; background: none; color: #6451b0; font-size: .6rem; cursor: pointer }
.admin-footer { width: 100%; height: 58px; min-height: 58px; padding: 0 28px !important; background: #fff !important; border-top: 1px solid #e1e5ec !important; display: flex !important; align-items: center !important; justify-content: center !important; text-align: center; color: #7d8797; font-size: .68rem; grid-template-columns: none !important; gap: 0 !important }
.table-scroll { overflow-x: auto }

/* Product gallery and long-form content */
.product-gallery__stage { width: 100%; height: 540px; border-radius: 30px; overflow: hidden; background: #f2edf4 }
.product-gallery__stage img { width: 100%; height: 100%; object-fit: cover; border-radius: 0; transition: opacity .15s ease }
.product-gallery__stage img.is-changing { opacity: .35 }
.product-gallery__empty { height: 100%; display: grid; place-items: center; color: var(--muted) }
.product-gallery__thumbs { display: flex; gap: .65rem; margin-top: .8rem; overflow-x: auto; padding: .2rem }
.product-gallery__thumb { flex: 0 0 82px; height: 82px; border: 2px solid transparent; border-radius: 13px; padding: 3px; background: #fff; cursor: pointer }
.product-gallery__thumb.is-active { border-color: var(--purple); box-shadow: 0 0 0 3px rgba(121,87,200,.1) }
.product-gallery__thumb img { width: 100%; height: 100%; object-fit: cover; border-radius: 8px }
.rich-content { line-height: 2; color: #51495f }
.rich-content img { max-width: 100%; height: auto; border-radius: 14px }
.rich-content p { white-space: normal }
.product-pros-cons { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem }
.product-pros-cons article { background: #fff; border: 1px solid var(--line); border-radius: 20px; padding: 1.5rem }
.product-pros { border-top: 4px solid #48b88c !important }
.product-cons { border-top: 4px solid #ec6d83 !important }
.product-pros-cons h2 { font-size: 1.1rem; margin-top: 0 }
.product-faq .section-heading, .product-comments .section-heading { margin-bottom: 1.2rem }
.section-heading span { color: var(--pink); font-size: .7rem; font-weight: 800 }
.section-heading h2 { margin: .1rem 0; font-size: 1.45rem }
.faq-list { display: grid; gap: .65rem }
.faq-list details { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: .85rem 1rem }
.faq-list summary { font-weight: 750; cursor: pointer }
.faq-list details > div { color: var(--muted); font-size: .82rem; padding-top: .55rem }
.faq-list details p { margin: .2rem 0 }
.comments-placeholder { border: 1px dashed #d8ccdf; border-radius: 16px; background: #fff; padding: 2rem; text-align: center; color: var(--muted); font-size: .78rem }

@media(max-width:900px) {
    .admin-gallery-grid { grid-template-columns: repeat(2,1fr) }
    .pros-cons-editors, .product-pros-cons { grid-template-columns: 1fr }
}

@media(max-width:800px) {
    .product-gallery__stage { height: 390px }
    .product-gallery__thumb { flex-basis: 68px; height: 68px }
}

@media(max-width:600px) {
    .rich-editor__toolbar { max-height: 120px; overflow-y: auto }
    .admin-gallery-grid { grid-template-columns: 1fr 1fr }
    .url-rule > footer { flex-wrap: wrap }
    .admin-footer { height: 52px; min-height: 52px }
}

/* Clear grid actions */
.grid-actions { display: flex; align-items: center; gap: .35rem; white-space: nowrap }
.grid-actions form { margin: 0 }
.grid-action { position: relative; width: 34px; height: 34px; border: 1px solid #e0e4eb !important; border-radius: 9px !important; background: #fff !important; color: #6652b5 !important; display: inline-grid !important; place-items: center; padding: 0 !important; cursor: pointer; transition: .16s }
.grid-action:hover { border-color: #8f7ad0 !important; background: #f3efff !important; transform: translateY(-1px) }
.grid-action svg, .btn-icon svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round }
.grid-action--danger { color: #bd3653 !important }
.grid-action--danger:hover { border-color: #e7a9b7 !important; background: #fff1f4 !important }
.grid-action:after { content: attr(data-tooltip); position: absolute; z-index: 100; bottom: calc(100% + 8px); right: 50%; transform: translateX(50%) translateY(3px); background: #252136; color: #fff; padding: .28rem .5rem; border-radius: 6px; font-size: .58rem; line-height: 1.5; white-space: nowrap; opacity: 0; visibility: hidden; pointer-events: none; transition: .15s }
.grid-action:hover:after, .grid-action:focus-visible:after { opacity: 1; visibility: visible; transform: translateX(50%) translateY(0) }

/* Standalone product gallery manager */
.gallery-upload-form { max-width: none; margin-bottom: 1rem }
.gallery-upload-form > .btn { margin-top: 1rem }
.product-gallery-manager { overflow: visible }
.admin-gallery-item__preview { position: relative !important; display: block !important; padding: 0 !important }
.admin-gallery-item__preview img { display: block; width: 100%; height: 190px; object-fit: cover }
.admin-gallery-item__meta { display: flex !important; flex-direction: column !important; gap: 0 !important; padding: .65rem .75rem !important }
.admin-gallery-item__meta strong { font-size: .7rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis }
.admin-gallery-item__meta small { font-size: .58rem; color: #8992a0 }
.admin-gallery-item__actions { display: flex !important; align-items: center; justify-content: space-between; gap: .5rem; padding: 0 .75rem .75rem !important }
.admin-gallery-item__actions form { margin: 0 }
.admin-gallery-item__actions .btn { font-size: .58rem; padding: .4rem .6rem }
.btn-icon { width: 34px; height: 34px; border: 1px solid #e3e6ec; border-radius: 9px; background: #fff; display: grid; place-items: center; cursor: pointer }
.btn-icon--danger { color: #bd3653; border-color: #efd2d9 }
.admin-empty { display: flex; flex-direction: column; gap: .2rem }
.admin-empty b { font-size: .8rem }
.admin-empty span { font-size: .68rem }

/* Simple image and video media management */
.media-summary { display: grid; grid-template-columns: repeat(3,1fr); gap: .8rem; margin-bottom: 1rem }
.media-summary > a { display: flex; align-items: center; gap: .8rem; overflow: visible; padding: 1rem }
.media-summary > a:hover { border-color: #9b88d4 }
.media-summary > a > div { display: flex; flex-direction: column }
.media-summary strong { font-size: 1.2rem; line-height: 1.3 }
.media-summary small { font-size: .62rem; color: #7e8898 }
.media-summary__icon { width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; font-weight: 800 }
.media-summary__icon--active { background: #dff7ec; color: #177554 }
.media-summary__icon--inactive { background: #fff0e6; color: #b56725 }
.media-summary__icon--video { background: #eae6ff; color: #6650b7 }
.media-uploader { margin-bottom: 1rem; overflow: visible }
.media-uploader__intro { display: flex; align-items: center; gap: .7rem; margin-bottom: 1rem }
.media-uploader__intro > span { width: 38px; height: 38px; display: grid; place-items: center; background: #eee9ff; color: #6852b8; border-radius: 11px; font-size: 1.2rem }
.media-uploader__intro > div { display: flex; flex-direction: column }
.media-uploader__intro b { font-size: .88rem }
.media-uploader__intro small { font-size: .62rem; color: #808a9a }
.media-uploader__fields { display: grid; grid-template-columns: 1.5fr .8fr 1.2fr auto; gap: .8rem; align-items: end }
.media-uploader label, .media-filter-bar label { display: flex; flex-direction: column }
.media-uploader label > span, .media-filter-bar label > span { font-size: .67rem; font-weight: 750; margin-bottom: .25rem }
.media-uploader input, .media-filter-bar select { height: 44px; border: 1px solid #dfe3ea; border-radius: 10px; padding: .55rem .7rem; background: #fdfdfe; font: inherit; font-size: .72rem }
.media-filter-bar { display: grid; grid-template-columns: 1fr 1fr 1fr auto auto; gap: .7rem; align-items: end; margin-bottom: 1rem; overflow: visible }
.media-filter-bar > a { font-size: .65rem; color: #6c58b8; padding: .6rem }
.media-result-head { display: flex; justify-content: space-between; align-items: end; margin: 1.2rem 0 .7rem }
.media-result-head > div:first-child { display: flex; flex-direction: column }
.media-result-head b { font-size: .88rem }
.media-result-head small { font-size: .6rem; color: #838d9c }
.media-status-guide { display: flex; gap: .8rem; font-size: .58rem; color: #7e8796 }
.media-status-guide span { display: flex; align-items: center; gap: .3rem }
.media-status-guide i { width: 8px; height: 8px; border-radius: 50% }
.media-status-guide .is-active { background: #26a879 }
.media-status-guide .is-inactive { background: #e1944f }
.media-library-grid--managed { grid-template-columns: repeat(3,1fr) }
.media-library-grid--managed .media-library-card { position: relative; opacity: 1; border-width: 1px; transition: .16s }
.media-library-grid--managed .media-library-card.is-active { border-color: #d9e7e1 }
.media-library-grid--managed .media-library-card.is-disabled { opacity: 1; border: 2px dashed #e0a66f; background: #fffaf5 }
.media-library-card__preview { height: 190px; position: relative; background: #eceff3 }
.media-library-card__preview > img, .media-library-card__preview > video { width: 100%; height: 100%; object-fit: cover }
.media-state, .media-kind { position: absolute; top: 10px; border-radius: 20px; padding: .18rem .5rem; font-size: .56rem; font-weight: 750; backdrop-filter: blur(5px) }
.media-state { right: 10px }
.media-kind { left: 10px; background: rgba(37,33,54,.78); color: #fff }
.media-state--active { background: rgba(220,248,235,.94); color: #176f50 }
.media-state--inactive { background: rgba(255,232,210,.96); color: #a75b20 }
.media-library-card__body { padding: .75rem; display: flex; flex-direction: column }
.media-library-card__body > strong { font-size: .7rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis }
.media-library-card__body > small { font-size: .58rem; color: #828c9b }
.media-library-card__body > code { direction: ltr; text-align: left; font-size: .53rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; background: #f5f6f8; border-radius: 6px; padding: .3rem; margin: .45rem 0 }
.media-card-actions { display: grid; grid-template-columns: 1fr 1fr; gap: .45rem }
.media-card-actions form { margin: 0 }
.media-card-actions .btn { width: 100%; padding: .45rem; font-size: .6rem; border-radius: 8px; box-shadow: none }
.btn-activate { background: #e0f7ec; color: #157252 }
.btn-deactivate { background: #fff0e5; color: #a65c25 }
.media-disabled-note { margin: .55rem 0 0; padding: .45rem; background: #fff1e5; color: #99531f; border-radius: 7px; font-size: .56rem }
.media-library-grid--managed + .admin-empty { margin-top: 1rem }

@media(max-width:1100px) {
    .media-uploader__fields { grid-template-columns: 1fr 1fr }
    .media-filter-bar { grid-template-columns: 1fr 1fr 1fr }
    .media-library-grid--managed { grid-template-columns: 1fr 1fr }
}

@media(max-width:700px) {
    .media-summary { grid-template-columns: 1fr }
    .media-uploader__fields, .media-filter-bar { grid-template-columns: 1fr }
    .media-library-grid--managed { grid-template-columns: 1fr }
    .admin-gallery-grid { grid-template-columns: 1fr }
}

.admin-module-link { display: flex; align-items: center; justify-content: space-between; background: #f4f0ff; border: 1px solid #ded5f7; border-radius: 14px; padding: 1rem; margin-bottom: 1rem }
.admin-module-link > div { display: flex; flex-direction: column }
.admin-module-link b { font-size: .78rem }
.admin-module-link small { font-size: .62rem; color: #777084 }
.comment-module .section-heading { display: flex; justify-content: space-between; align-items: end; margin-bottom: 1rem }
.comment-module .section-heading > small { color: var(--muted); font-size: .7rem }
.comment-layout { display: grid; grid-template-columns: 1.4fr .8fr; gap: 1rem; align-items: start }
.comment-list { display: grid; gap: .7rem }
.comment-card, .comment-form { background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 1rem }
.comment-card header { display: flex; justify-content: space-between }
.comment-card header strong { font-size: .8rem }
.comment-card time { font-size: .6rem; color: var(--muted) }
.comment-card > p { margin: .5rem 0; font-size: .8rem }
.comment-rating { color: #f2b84b; letter-spacing: .12em }
.comment-reply { background: #f5f2fa; border-radius: 10px; padding: .7rem; margin-top: .7rem; font-size: .72rem }
.comment-reply p { margin: .2rem 0 }
.comment-form { display: flex; flex-direction: column; gap: .7rem; position: sticky; top: 85px }
.comment-form h3 { margin: 0; font-size: 1rem }
.comment-form label > span { display: block; font-size: .7rem; font-weight: 700 }
.comment-form input, .comment-form textarea, .comment-form select { width: 100%; border: 1px solid var(--line); border-radius: 9px; padding: .6rem; font: inherit }
.comment-form > small { font-size: .6rem; color: var(--muted) }
.comment-honeypot { position: absolute !important; left: -9999px; width: 1px !important; height: 1px }
.comment-form .btn { width: 100% }

@media(max-width:800px) {
    .comment-layout { grid-template-columns: 1fr }
    .comment-form { position: static }
    .admin-module-link { align-items: flex-start; gap: .8rem; flex-direction: column }
}

/* Modern product Q&A management */
.qa-workspace { display: flex; flex-direction: column; gap: 1rem }
.qa-create-card { max-width: none; overflow: visible; border-top: 3px solid var(--purple) }
.qa-card-title { display: flex; align-items: center; gap: .75rem; padding-bottom: 1rem; margin-bottom: 1rem; border-bottom: 1px solid #eceef2 }
.qa-card-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; background: #eee9ff; color: #6751b8; font-size: 1.2rem; font-weight: 800 }
.qa-card-title h2, .qa-list-head h2 { font-size: .9rem; margin: 0 }
.qa-card-title p, .qa-list-head p { font-size: .62rem; color: #838c9a; margin: 0 }
.qa-fields { display: grid; gap: .85rem }
.qa-fields label > span { display: block; font-size: .7rem; font-weight: 750; margin-bottom: .3rem }
.qa-options { display: flex; align-items: center; gap: 1.5rem; flex-wrap: wrap; margin-top: 1.1rem; padding: 1rem; background: #f8f9fb; border-radius: 11px }
.qa-switch { display: flex !important; align-items: center; gap: .55rem; cursor: pointer }
.qa-switch > input { position: absolute; opacity: 0; pointer-events: none }
.qa-switch > span { position: relative; width: 38px; height: 21px; border-radius: 20px; background: #c9ced7; transition: .18s }
.qa-switch > span i { position: absolute; width: 15px; height: 15px; right: 3px; top: 3px; background: #fff; border-radius: 50%; box-shadow: 0 1px 3px rgba(0,0,0,.2); transition: .18s }
.qa-switch > input:checked + span { background: #765cc4 }
.qa-switch > input:checked + span i { right: 20px }
.qa-switch > b { font-size: .68rem; font-weight: 650 }
.qa-submit-row { display: flex; justify-content: flex-start; margin-top: 1.25rem; padding-top: 1rem; border-top: 1px solid #eceef2 }
.qa-submit-row .btn { min-width: 180px }
.qa-list-head { display: flex; justify-content: space-between; align-items: end; margin-top: .5rem }
.qa-admin-list--modern { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem }
.qa-edit-card { position: relative; overflow: visible; padding-top: 3.2rem }
.qa-card-status { position: absolute; right: 20px; left: 20px; top: 15px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #eceef2; padding-bottom: .55rem }
.qa-card-status small { font-size: .58rem; color: #87909e }
.qa-edit-card .admin-form { max-width: none }
.qa-card-actions { display: flex; margin-top: 1rem; padding-top: .8rem; border-top: 1px solid #eceef2 }
.qa-card-actions .btn { padding: .55rem 1rem; font-size: .68rem }
.qa-delete-form { position: absolute; left: 20px; bottom: 20px; margin: 0 }
.qa-edit-card .qa-card-actions { padding-left: 48px }

@media(max-width:1000px) {
    .qa-admin-list--modern { grid-template-columns: 1fr }
}

@media(max-width:600px) {
    .qa-options { align-items: flex-start; flex-direction: column; gap: .8rem }
    .qa-submit-row .btn { width: 100% }
    .qa-delete-form { bottom: 18px }
    .qa-edit-card .qa-card-actions { padding-left: 42px }
}

/* Comment moderation workspace */
.comment-admin-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: .8rem; margin-bottom: 1rem }
.comment-admin-stats > a { display: flex; align-items: center; gap: .7rem; padding: 1rem; overflow: visible }
.comment-admin-stats > a > div { display: flex; flex-direction: column }
.comment-admin-stats strong { font-size: 1.25rem; line-height: 1.2 }
.comment-admin-stats small { font-size: .62rem; color: #7f8998 }
.comment-stat { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 11px; font-weight: 800 }
.comment-stat--pending { background: #fff2dc; color: #a96716 }
.comment-stat--approved { background: #dff7ec; color: #167553 }
.comment-stat--rejected { background: #fff0f2; color: #b83d55 }
.comment-admin-filters { display: grid; grid-template-columns: 2fr 1fr 1fr auto auto; gap: .7rem; align-items: center; margin-bottom: 1rem; overflow: visible }
.comment-admin-filters input, .comment-admin-filters select { height: 42px; border: 1px solid #dfe3e9; border-radius: 9px; padding: .55rem .7rem; background: #fff; font: inherit; font-size: .68rem }
.comment-admin-filters > a { font-size: .62rem; color: #6652b5 }
.comment-admin-list { display: grid; gap: .8rem }
.comment-admin-card { overflow: visible }
.comment-admin-card > header { display: flex; justify-content: space-between; align-items: center; padding-bottom: .7rem; border-bottom: 1px solid #edf0f3 }
.comment-admin-author { display: flex; align-items: center; gap: .6rem }
.comment-admin-author > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; background: #eee9ff; color: #6752b8; font-weight: 800 }
.comment-admin-author > div { display: flex; flex-direction: column }
.comment-admin-author strong { font-size: .75rem }
.comment-admin-author small { font-size: .57rem; color: #858f9e }
.comment-status { border-radius: 20px; padding: .2rem .55rem; font-size: .58rem }
.comment-status--pending { background: #fff2dc; color: #a96716 }
.comment-status--approved { background: #dff7ec; color: #167553 }
.comment-status--rejected, .comment-status--spam { background: #fff0f2; color: #b83d55 }
.comment-admin-target { display: flex; align-items: center; gap: .4rem; margin-top: .7rem; font-size: .62rem }
.comment-admin-target > span, .comment-admin-target > small { color: #8a93a1 }
.comment-admin-target a { color: #6652b5; font-weight: 700 }
.comment-admin-target small { margin-right: auto }
.comment-admin-body { font-size: .78rem; background: #fafbfc; border-radius: 10px; padding: .8rem; margin: .7rem 0 }
.comment-admin-replies { display: grid; gap: .5rem; margin: .7rem 0 }
.comment-admin-replies > div { background: #f2eefb; border-right: 3px solid #765cc4; border-radius: 9px; padding: .7rem }
.comment-admin-replies strong { font-size: .65rem; color: #604aaa }
.comment-admin-replies p { font-size: .7rem; margin: .15rem 0 }
.comment-admin-replies time { font-size: .52rem; color: #8992a0 }
.comment-admin-actions { display: flex; align-items: flex-start; gap: .5rem; padding-top: .7rem; border-top: 1px solid #edf0f3 }
.comment-admin-actions > form { margin: 0 }
.comment-admin-actions .btn { padding: .45rem .7rem; font-size: .6rem; box-shadow: none }
.comment-reply-box { position: relative }
.comment-reply-box summary { list-style: none; cursor: pointer }
.comment-reply-box summary::-webkit-details-marker { display: none }
.comment-reply-box > form { position: absolute; z-index: 20; left: 0; top: calc(100% + 7px); width: 330px; background: #fff; border: 1px solid #dfe3e9; border-radius: 12px; padding: .8rem; box-shadow: 0 15px 40px rgba(35,30,50,.15) }
.comment-reply-box textarea { width: 100%; border: 1px solid #dfe3e9; border-radius: 8px; padding: .6rem; font: inherit; font-size: .68rem; margin-bottom: .5rem }
.comment-reply-box .btn { width: 100% }
.comment-delete { margin-right: auto !important }

@media(max-width:850px) {
    .comment-admin-filters { grid-template-columns: 1fr 1fr }
    .comment-admin-stats { grid-template-columns: 1fr }
    .comment-admin-actions { flex-wrap: wrap }
    .comment-delete { margin-right: 0 !important }
    .comment-reply-box > form { right: 0; left: auto }
}

@media(max-width:550px) {
    .comment-admin-filters { grid-template-columns: 1fr }
    .comment-admin-card > header { align-items: flex-start; gap: .5rem }
    .comment-admin-target { flex-wrap: wrap }
    .comment-admin-target small { width: 100% }
}

/* Dynamic purchase options */
.purchase-option-step { margin-bottom: 1rem; overflow: visible }
.option-step-head { display: flex; align-items: center; gap: .7rem; padding-bottom: .8rem; margin-bottom: 1rem; border-bottom: 1px solid #eceef2 }
.option-step-head > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; background: #eee9ff; color: #6650b7; font-weight: 800 }
.option-step-head h2 { font-size: .88rem; margin: 0 }
.option-step-head p { font-size: .6rem; color: #838c9a; margin: 0 }
.option-axis-form { display: grid; grid-template-columns: 1.3fr 1fr auto; gap: .7rem; margin-bottom: 1rem }
.option-axis-form input, .option-value-form input, .purchase-combination-form input, .purchase-combination-form select { border: 1px solid #dfe3e9; border-radius: 9px; padding: .62rem .7rem; background: #fff; font: inherit; font-size: .68rem }
.option-axis-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem }
.option-axis-card { border: 1px solid #e1e5eb; border-radius: 13px; padding: .85rem }
.option-axis-card > header { display: flex; justify-content: space-between; align-items: start }
.option-axis-card > header > div { display: flex; align-items: center; gap: .5rem }
.option-axis-card strong { font-size: .78rem }
.option-axis-card code { font-size: .58rem; background: #f2f3f6; padding: .15rem .35rem; border-radius: 5px }
.option-value-chips { display: flex; gap: .4rem; flex-wrap: wrap; min-height: 36px; margin: .7rem 0 }
.option-value-chips > span { display: flex; align-items: center; gap: .3rem; background: #f3efff; color: #5f4bad; border-radius: 20px; padding: .24rem .55rem; font-size: .62rem }
.option-value-chips i, .product-option-value i { width: 14px; height: 14px; border-radius: 50%; border: 1px solid rgba(0,0,0,.12) }
.option-value-chips small { font-size: .58rem; color: #8992a0 }
.option-value-form { display: grid; grid-template-columns: 1fr 1fr auto; gap: .45rem }
.combination-values { display: grid; grid-template-columns: repeat(3,1fr); gap: .7rem; margin-bottom: .8rem }
.combination-values label, .purchase-combination-form .form-grid label { display: flex; flex-direction: column }
.combination-values span, .purchase-combination-form label > span { font-size: .64rem; font-weight: 700; margin-bottom: .25rem }
.combination-submit { display: flex; justify-content: space-between; align-items: center; margin-top: 1rem }
.variant-value-list { display: flex; gap: .3rem; flex-wrap: wrap }
.variant-value-list span { font-size: .55rem; background: #f2eff8; border-radius: 14px; padding: .16rem .4rem }
.product-option-picker { display: grid; gap: .9rem; margin: 1rem 0 }
.product-option-picker fieldset { border: 0; padding: 0; margin: 0 }
.product-option-picker legend { font-size: .75rem; font-weight: 700; margin-bottom: .4rem }
.product-option-picker legend b { color: var(--purple) }
.product-option-values { display: flex; gap: .5rem; flex-wrap: wrap }
.product-option-value { display: flex; align-items: center; gap: .4rem; border: 1px solid var(--line); border-radius: 11px; background: #fff; padding: .48rem .75rem; cursor: pointer; color: var(--ink) }
.product-option-value.is-selected { border-color: var(--purple); background: #f2edff; box-shadow: 0 0 0 2px rgba(121,87,200,.1) }
.variant-availability { font-size: .7rem; color: #27805f; margin: .1rem 0 }
.variant-availability.is-unavailable { color: #bd3653 }
[data-add-product]:disabled { opacity: .5; cursor: not-allowed }

@media(max-width:900px) {
    .option-axis-grid { grid-template-columns: 1fr }
    .combination-values { grid-template-columns: 1fr 1fr }
}

@media(max-width:650px) {
    .option-axis-form, .option-value-form, .combination-values { grid-template-columns: 1fr }
    .combination-submit { align-items: stretch; gap: .8rem; flex-direction: column }
    .combination-submit .btn { width: 100% }
}

/* Cart */
.product-purchase-form { display: grid; gap: 1rem }
.brand-mode-note { padding: 1rem; border: 1px solid #e2d9ea; border-radius: 14px; background: #f8f5fb; color: #655b69; font-size: .85rem }
.cart-page { max-width: 1240px; margin: auto }
.cart-page__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 1.5rem; margin-bottom: 1.5rem }
.cart-page__head h1 { margin: .25rem 0; font-size: clamp(1.8rem,4vw,2.65rem) }
.cart-page__head p { margin: 0; color: var(--muted) }
.cart-notice { padding: .85rem 1rem; border-radius: 14px; background: #eafaf3; color: #187351; margin: 1rem 0; border: 1px solid #bcebd8 }
.cart-notice--error { background: #fff0f3; color: #a52148; border-color: #ffc8d7 }
.cart-empty { min-height: 360px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; border: 1px dashed #dfd4df; border-radius: 28px; background: linear-gradient(145deg,#fff,#fff8fc); padding: 3rem }
.cart-empty > span { font-size: 3.5rem }
.cart-empty h2 { margin: .75rem 0 .25rem }
.cart-empty p { color: var(--muted) }
.cart-layout { display: grid; grid-template-columns: minmax(0,1fr) 340px; gap: 1.5rem; align-items: start }
.cart-lines { display: grid; gap: 1rem }
.cart-line { position: relative; display: grid; grid-template-columns: 112px minmax(0,1fr) auto; gap: 1.1rem; padding: 1rem; background: #fff; border: 1px solid #eee5ee; border-radius: 22px; box-shadow: 0 12px 35px rgba(71,38,61,.05) }
.cart-line.is-unavailable { opacity: .72; background: #fffafa }
.cart-line__image { width: 112px; height: 112px; border-radius: 17px; overflow: hidden; background: #faf4f8; display: grid; place-items: center }
.cart-line__image img { width: 100%; height: 100%; object-fit: cover }
.cart-line__image span { font-size: 2rem; color: var(--primary) }
.cart-line__info small, .cart-line__price small { color: var(--muted) }
.cart-line__info h2 { font-size: 1.05rem; margin: .25rem 0 }
.cart-line__info h2 a { color: inherit; text-decoration: none }
.cart-line__info p { font-size: .86rem; color: #6e6270; margin: .35rem 0 }
.stock-warning, .stock-error { display: block; font-size: .78rem; margin-top: .5rem }
.stock-warning { color: #a86405 }
.stock-error { color: #b4234d }
.cart-line__price { display: flex; flex-direction: column; text-align: left; gap: .2rem }
.cart-line__price strong { font-size: .9rem }
.cart-line__price span { font-size: 1rem; color: var(--primary); font-weight: 800 }
.cart-line__actions { grid-column: 2/-1; display: flex; justify-content: space-between; align-items: flex-end; border-top: 1px solid #f2ebf1; padding-top: .75rem }
.cart-quantity-form { display: flex; align-items: flex-end; gap: .55rem }
.cart-quantity-form label { display: grid; gap: .25rem; font-size: .75rem; color: var(--muted) }
.cart-quantity-form input { width: 74px; padding: .55rem; border: 1px solid #ded4de; border-radius: 10px }
.cart-remove { width: 34px; height: 34px; border: 0; border-radius: 10px; background: #fff0f3; color: #a52148; font-size: 1.35rem; cursor: pointer }
.cart-summary { position: sticky; top: 95px; background: #fff; border: 1px solid #eee5ee; border-radius: 22px; padding: 1.25rem; box-shadow: 0 16px 45px rgba(71,38,61,.07) }
.cart-summary h2 { font-size: 1.1rem; margin: 0 0 1rem }
.cart-summary dl { margin: 0; display: grid; gap: .8rem }
.cart-summary dl div { display: flex; justify-content: space-between; gap: 1rem; color: #675c68; font-size: .88rem }
.cart-summary dd { margin: 0; text-align: left }
.cart-summary__total { display: flex; justify-content: space-between; gap: 1rem; border-top: 1px solid #eee5ee; margin-top: 1rem; padding: 1rem 0 }
.cart-summary__total strong { color: var(--primary) }
.cart-summary__hint { text-align: center; font-size: .75rem; color: var(--muted); margin: .65rem 0 0 }

@media(max-width:900px) {
    .cart-layout { grid-template-columns: 1fr }
    .cart-summary { position: static }
    .cart-page__head { align-items: flex-start; flex-direction: column }
}

@media(max-width:620px) {
    .cart-line { grid-template-columns: 84px 1fr }
    .cart-line__image { width: 84px; height: 84px }
    .cart-line__price { grid-column: 1/-1; flex-direction: row; justify-content: space-between; text-align: right }
    .cart-line__actions { grid-column: 1/-1 }
    .cart-quantity-form { flex-wrap: wrap }
}

/* Purchase option editing */
.combination-values label span small { color: #9299a5; font-size: .55rem; font-weight: 500; margin-right: .25rem }
.variant-admin-list { display: grid; gap: .75rem }
.variant-admin-card { border: 1px solid #e2e6ec; border-radius: 14px; background: #fff; overflow: hidden }
.variant-admin-summary { display: grid; grid-template-columns: minmax(180px,1.5fr) minmax(100px,.7fr) minmax(90px,.65fr) 70px 70px auto; gap: .8rem; align-items: center; padding: .9rem }
.variant-admin-summary > div:first-child { display: grid; gap: .35rem }
.variant-admin-summary > div > small { display: block; color: #89919e; font-size: .55rem }
.variant-admin-summary > div > b { font-size: .7rem }
.variant-admin-summary code { font-size: .6rem; direction: ltr; text-align: left }
.variant-edit-panel { position: relative; padding: 1rem; border-top: 1px solid #e6e9ee; background: #fafbfc }
.variant-edit-panel[hidden] { display: none }
.variant-edit-actions { display: flex; gap: .5rem }
.variant-delete-form { position: absolute; left: 1rem; bottom: 1.2rem }
.variant-delete-form .danger-link { font-size: .62rem }

@media(max-width:1050px) {
    .variant-admin-summary { grid-template-columns: 1fr 1fr 1fr }
    .variant-admin-summary > button { justify-self: end }
}

@media(max-width:650px) {
    .variant-admin-summary { grid-template-columns: 1fr 1fr }
    .variant-admin-summary > div:first-child { grid-column: 1/-1 }
    .variant-edit-panel { padding-bottom: 4rem }
    .variant-delete-form { right: 1rem; left: auto }
}

/* Purchase option summary cards */
.variant-admin-list { gap: .6rem }
.variant-admin-card { border-color: #e4e7ec; border-radius: 12px; box-shadow: 0 2px 8px rgba(35,42,55,.025) }
.variant-admin-summary { grid-template-columns: minmax(220px,1.7fr) minmax(125px,.85fr) minmax(145px,.9fr) minmax(82px,.55fr) minmax(76px,.5fr) 96px; gap: 1rem; min-height: 92px; padding: .82rem 1rem }
.variant-admin-identity { display: grid; gap: .42rem; min-width: 0 }
.variant-admin-identity > strong { font-size: .88rem; line-height: 1.5; font-weight: 750; color: #252b36; white-space: nowrap; overflow: hidden; text-overflow: ellipsis }
.variant-admin-identity .variant-value-list { gap: .3rem }
.variant-admin-identity .variant-value-list span { font-size: .63rem; padding: .22rem .48rem; color: #5e6470; background: #f3f4f7 }
.variant-admin-meta, .variant-admin-state { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; justify-content: center; gap: .34rem }
.variant-admin-meta > small, .variant-admin-state > small { font-size: .62rem !important; line-height: 1.15; color: #858d9a !important; font-weight: 600 }
.variant-admin-meta > b { font-size: .77rem !important; line-height: 1.45; color: #252b36; font-weight: 750; white-space: nowrap }
.variant-admin-meta > b i { font-size: .58rem; color: #858d99; font-style: normal; font-weight: 500 }
.variant-admin-sku code { max-width: 100%; padding: 0; background: none; color: #3b4350; font-size: .7rem !important; font-weight: 650; text-align: right !important; direction: ltr; white-space: nowrap; overflow: hidden; text-overflow: ellipsis }
.variant-admin-state .status { min-width: 58px; text-align: center; font-size: .62rem; padding: .24rem .5rem }
.variant-edit-button { display: inline-flex; align-items: center; justify-content: center; gap: .34rem; width: 96px; height: 38px; border: 1px solid #d9dee7; border-radius: 9px; background: #fff; color: #404958; font-family: inherit; font-size: .69rem; font-weight: 650; cursor: pointer; transition: .15s }
.variant-edit-button span { font-size: .86rem; color: #6d58bd }
.variant-edit-button:hover { border-color: #bcb1e2; background: #f7f5ff; color: #5945a4; box-shadow: 0 3px 10px rgba(94,72,169,.08) }

@media(max-width:1100px) {
    .variant-admin-summary { grid-template-columns: minmax(190px,1.5fr) 110px 125px 70px 65px 86px; gap: .65rem }
    .variant-edit-button { width: 86px }
}

@media(max-width:850px) {
    .variant-admin-summary { grid-template-columns: 1fr 1fr 1fr }
    .variant-admin-identity { grid-column: 1/-1 }
    .variant-edit-button { justify-self: end }
}

@media(max-width:560px) {
    .variant-admin-summary { grid-template-columns: 1fr 1fr; padding: .8rem }
    .variant-admin-identity { grid-column: 1/-1 }
    .variant-edit-button { justify-self: stretch; width: 100% }
}

/* Checkout */
.checkout-page { max-width: 1160px; margin: auto }
.checkout-head { margin-bottom: 1.4rem }
.checkout-head h1 { font-size: 1.5rem; margin: .25rem 0 }
.checkout-head p { margin: 0; color: var(--muted) }
.checkout-layout { display: grid; grid-template-columns: minmax(0,1fr) 350px; gap: 1.5rem; align-items: start }
.checkout-form, .checkout-summary { background: #fff; border: 1px solid #ece3eb; border-radius: 22px; padding: 1.35rem; box-shadow: 0 14px 40px rgba(61,39,57,.055) }
.checkout-form h2, .checkout-summary h2 { font-size: 1.05rem; margin: 0 0 1rem }
.checkout-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem }
.checkout-fields label { display: grid; gap: .35rem }
.checkout-fields label > span { font-size: .78rem; font-weight: 700 }
.checkout-fields input, .checkout-fields textarea { width: 100%; border: 1px solid #ded4de; border-radius: 11px; padding: .72rem .8rem; font: inherit; background: #fff }
.checkout-fields input:focus, .checkout-fields textarea:focus { outline: 0; border-color: var(--primary); box-shadow: 0 0 0 3px rgba(225,74,138,.1) }
.checkout-fields label > small { color: #b4234d; font-size: .68rem }
.checkout-address { grid-column: 1/-1 }
.test-payment-note { display: flex; flex-direction: column; gap: .2rem; margin: 1rem 0; padding: .8rem; border-radius: 12px; background: #f4f0ff; color: #5946a0 }
.test-payment-note b { font-size: .78rem }
.test-payment-note span { font-size: .68rem }
.checkout-summary { position: sticky; top: 95px }
.checkout-items { display: grid; gap: .7rem }
.checkout-items > div { display: flex; justify-content: space-between; gap: 1rem; padding-bottom: .65rem; border-bottom: 1px solid #f0eaf0; font-size: .95rem }
.checkout-items span { display: grid }
.checkout-items small { color: var(--muted); font-size: .85rem }
.checkout-items b { white-space: nowrap }
.checkout-summary dl { display: grid; gap: .65rem; margin: 1rem 0 }
.checkout-summary dl div, .checkout-total { display: flex; justify-content: space-between; gap: 1rem; font-size: .78rem }
.checkout-summary dd { margin: 0 }
.checkout-total { border-top: 1px solid #e8dfe8; padding-top: 1rem; font-size: .9rem }
.checkout-total strong { color: var(--primary) }
.checkout-summary > a { display: block; text-align: center; margin-top: 1rem; font-size: .72rem; color: #6652b5 }
.payment-result { max-width: 650px; margin: 3rem auto; text-align: center; background: #fff; border: 1px solid #ece3eb; border-radius: 28px; padding: 3rem; box-shadow: 0 20px 55px rgba(61,39,57,.08) }
.payment-result__icon { width: 70px; height: 70px; display: grid; place-items: center; margin: 0 auto 1rem; border-radius: 50%; font-size: 2rem; font-weight: 800 }
.payment-result.is-success .payment-result__icon { background: #daf5e9; color: #187552 }
.payment-result.is-failed .payment-result__icon { background: #ffe5eb; color: #b4234d }
.payment-result h1 { margin: .35rem 0 }
.payment-result p { color: var(--muted) }
.payment-result dl { display: grid; gap: .7rem; margin: 1.5rem 0; padding: 1rem; background: #faf7fa; border-radius: 14px }
.payment-result dl div { display: flex; justify-content: space-between }
.payment-result dd { margin: 0; font-weight: 700 }
.payment-result__actions { display: flex; justify-content: center; gap: .7rem }

@media(max-width:850px) {
    .checkout-layout { grid-template-columns: 1fr }
    .checkout-summary { position: static }
}

@media(max-width:600px) {
    .checkout-fields { grid-template-columns: 1fr }
    .checkout-address { grid-column: auto }
    .payment-result { padding: 2rem 1rem }
    .payment-result__actions { flex-direction: column }
}

/* Admin orders */
.order-admin-stats { display: grid; grid-template-columns: repeat(4,1fr); gap: .75rem; margin-bottom: 1rem }
.order-admin-stats a { display: flex; flex-direction: column; gap: .25rem; padding: 1rem; background: #fff; border: 1px solid #e3e7ed; border-radius: 13px; color: #29313d }
.order-admin-stats small { font-size: .64rem; color: #818b99 }
.order-admin-stats strong { font-size: 1.25rem }
.order-admin-filters { display: grid; grid-template-columns: minmax(250px,1fr) 190px auto auto; gap: .7rem; align-items: center; margin-bottom: 1rem; overflow: visible }
.order-admin-filters input, .order-admin-filters select { height: 42px; border: 1px solid #dce1e8; border-radius: 9px; padding: .55rem .7rem; font: inherit; font-size: .7rem }
.order-admin-filters > a { font-size: .62rem; color: #6752b7 }
.order-list-card { padding: 0; overflow: hidden }
.order-admin-table td { vertical-align: middle }
.order-admin-table td > strong, .order-admin-table td > small { display: block }
.order-admin-table td > small { font-size: .58rem; color: #8a93a0; margin-top: .15rem }
.order-admin-table code { font-size: .62rem }
.order-status { display: inline-block; border-radius: 20px; padding: .25rem .55rem; font-size: .58rem; white-space: nowrap; background: #eef1f5; color: #596372 }
.order-status--paid { background: #ddf6eb; color: #197352 }
.order-status--processing { background: #e8e4fb; color: #5b47a5 }
.order-status--shipped { background: #e1f1ff; color: #246996 }
.order-status--delivered { background: #dff5e6; color: #267247 }
.order-status--pendingpayment { background: #fff0d9; color: #9a651c }
.order-status--cancelled, .order-status--refunded { background: #ffe8ed; color: #aa2d4c }
.order-view-button { display: inline-flex; align-items: center; gap: .3rem; border: 1px solid #dce1e8; border-radius: 8px; padding: .38rem .55rem; font-size: .6rem; color: #514498 }
.admin-pagination { display: flex; justify-content: center; gap: .35rem; padding: 1rem; border-top: 1px solid #e8ebef }
.admin-pagination a { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 8px; background: #f3f4f6; color: #59616d; font-size: .65rem }
.admin-pagination a.is-active { background: #6d58bd; color: #fff }
.order-detail-grid { display: grid; grid-template-columns: minmax(0,1fr) 330px; gap: 1rem; align-items: start }
.order-detail-main, .order-detail-side { display: grid; gap: 1rem }
.order-section-head { display: flex; justify-content: space-between; align-items: center; padding-bottom: .8rem; border-bottom: 1px solid #e8ebef }
.order-section-head h2, .order-detail-side h2 { font-size: .85rem; margin: 0 }
.order-section-head p, .order-status-card > p { font-size: .6rem; color: #858f9d; margin: .15rem 0 }
.order-item-list { display: grid }
.order-item-list article { display: grid; grid-template-columns: minmax(180px,1fr) 70px 120px 130px; gap: .7rem; align-items: center; padding: .8rem 0; border-bottom: 1px solid #edf0f3; font-size: .67rem }
.order-item-list article > div { display: grid; gap: .15rem }
.order-item-list small { color: #7f8996; font-size: .58rem }
.order-item-list code { font-size: .56rem }
.order-item-list article > b { text-align: left }
.order-totals { width: min(360px,100%); margin: 1rem 0 0 auto; display: grid; gap: .5rem }
.order-totals div { display: flex; justify-content: space-between; font-size: .67rem }
.order-totals dd { margin: 0 }
.order-totals .is-total { border-top: 1px solid #e3e7ec; padding-top: .65rem; font-size: .77rem; font-weight: 800 }
.payment-admin-list { display: grid }
.payment-admin-list article { display: grid; grid-template-columns: 12px 1fr 1fr 120px 100px; gap: .65rem; align-items: center; padding: .7rem 0; border-bottom: 1px solid #edf0f3; font-size: .63rem }
.payment-admin-list article > div { display: grid }
.payment-admin-list small { font-size: .55rem; color: #8993a0 }
.payment-admin-list code { font-size: .56rem; overflow: hidden; text-overflow: ellipsis }
.payment-dot { width: 9px; height: 9px; border-radius: 50%; background: #e2a341 }
.payment-dot.is-success { background: #31a879 }
.customer-info { display: grid; gap: .7rem; margin: 0 }
.customer-info div { display: grid; gap: .15rem }
.customer-info dt { font-size: .57rem; color: #8993a0 }
.customer-info dd { margin: 0; font-size: .7rem; line-height: 1.8 }
.order-status-card form { display: grid; gap: .7rem }
.order-status-card select { border: 1px solid #dce1e8; border-radius: 9px; padding: .65rem; font: inherit; font-size: .68rem }
.order-final-state { padding: .8rem; border-radius: 10px; background: #f2f4f7; color: #727b87; font-size: .65rem }

@media(max-width:1000px) {
    .order-detail-grid { grid-template-columns: 1fr }
    .order-admin-stats { grid-template-columns: 1fr 1fr }
}

@media(max-width:750px) {
    .order-admin-filters { grid-template-columns: 1fr }
    .order-item-list article { grid-template-columns: 1fr 1fr }
    .payment-admin-list article { grid-template-columns: 12px 1fr 1fr }
    .order-admin-stats { grid-template-columns: 1fr 1fr }
}

@media(max-width:480px) {
    .order-admin-stats { grid-template-columns: 1fr }
    .order-view-button span { display: none }
}

/* Mini cart popup */
.mini-cart-popup { position: fixed; z-index: 1200; left: 24px; top: 92px; width: min(390px,calc(100vw - 32px)); padding: 1rem; background: #fff; border: 1px solid #ebe2ea; border-radius: 18px; box-shadow: 0 22px 65px rgba(45,28,42,.2); opacity: 0; visibility: hidden; transform: translateX(-24px) scale(.98); transition: opacity .18s,transform .18s,visibility .18s }
.mini-cart-popup.is-visible { opacity: 1; visibility: visible; transform: translateX(0) scale(1) }
.mini-cart-popup[hidden] { display: block; visibility: hidden }
.mini-cart-popup__close { position: absolute; left: .65rem; top: .55rem; width: 30px; height: 30px; border: 0; border-radius: 8px; background: #f5f2f5; color: #746b75; font-size: 1.1rem; cursor: pointer }
.mini-cart-popup__state { display: flex; align-items: center; gap: .65rem; padding-left: 2.2rem }
.mini-cart-popup__state > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: #dff7ec; color: #16805a; font-weight: 800 }
.mini-cart-popup__state > div { display: grid }
.mini-cart-popup__state strong { font-size: .82rem }
.mini-cart-popup__state small { font-size: .64rem; color: #7f7680 }
.mini-cart-popup.is-error .mini-cart-popup__state > span { background: #ffe5eb; color: #b4234d }
.mini-cart-popup__product { display: grid; grid-template-columns: 72px 1fr; gap: .75rem; align-items: center; margin: .9rem 0; padding: .75rem; border-radius: 13px; background: #faf7fa }
.mini-cart-popup__image { width: 72px; height: 72px; display: grid; place-items: center; border-radius: 11px; overflow: hidden; background: #f0e9f0; color: var(--primary) }
.mini-cart-popup__image img { width: 100%; height: 100%; object-fit: cover }
.mini-cart-popup__product > div:last-child { display: grid; gap: .15rem }
.mini-cart-popup__product strong { font-size: .76rem }
.mini-cart-popup__product small { font-size: .62rem; color: #766d77 }
.mini-cart-popup__product b { font-size: .68rem; color: var(--primary) }
.mini-cart-popup__actions { display: grid; grid-template-columns: 1fr 1fr; gap: .55rem }
.mini-cart-popup__actions .btn { display: flex; align-items: center; justify-content: center; min-height: 40px; padding: .55rem; font-size: .68rem }
.mini-cart-popup__actions [hidden] { display: none }

@media(max-width:600px) {
    .mini-cart-popup { left: 16px; right: 16px; top: auto; bottom: 16px; width: auto; transform: translateY(24px) scale(.98) }
    .mini-cart-popup.is-visible { transform: translateY(0) scale(1) }
}

/* Communications settings */
.communications-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem }
.communication-card { overflow: visible }
.communication-head { display: grid; grid-template-columns: 42px 1fr auto; gap: .7rem; align-items: center; padding-bottom: .9rem; margin-bottom: 1rem; border-bottom: 1px solid #e8ebef }
.communication-head > span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 11px; background: #eee9ff; color: #654eb2; font-size: .72rem; font-weight: 800 }
.communication-head h2 { font-size: .85rem; margin: 0 }
.communication-head p { font-size: .6rem; color: #858e9c; margin: .1rem 0 }
.communication-fields { display: grid; gap: .75rem }
.communication-fields--email { grid-template-columns: 1fr 1fr }
.communication-fields label { display: grid; gap: .3rem }
.communication-fields label > span { font-size: .65rem; font-weight: 700 }
.communication-fields input { width: 100%; border: 1px solid #dce1e8; border-radius: 9px; padding: .62rem .7rem; font: inherit; font-size: .68rem }
.communication-fields label > small { font-size: .54rem; color: #87909d }
.communication-check { display: flex !important; align-items: center; grid-auto-flow: column; justify-content: start }
.communication-check input { width: auto }
.communication-save { grid-column: 1/-1; display: flex; justify-content: flex-end }
.notification-log-card { grid-column: 1/-1; margin-top: 1rem; padding: 0; overflow: hidden }
.notification-log-card .order-section-head { padding: 1rem }
.notification-log-card td small { display: block; max-width: 260px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #a13952 }

@media(max-width:950px) {
    .communications-grid { grid-template-columns: 1fr }
    .communication-save { grid-column: auto }
}

@media(max-width:600px) {
    .communication-fields--email { grid-template-columns: 1fr }
    .communication-head { grid-template-columns: 42px 1fr }
    .communication-head .qa-switch { grid-column: 1/-1 }
}

/* Cart spacing and compact aligned actions */
.cart-page { padding-bottom: 5rem }
.cart-line__actions { justify-content: flex-end; gap: .5rem }
.cart-quantity-form { gap: .45rem }
.cart-quantity-form label { display: flex; align-items: center; gap: .4rem }
.cart-quantity-form input { height: 36px; width: 64px; padding: .35rem .5rem }
.cart-quantity-form .btn, .cart-remove { height: 36px; min-height: 36px; padding: .35rem .65rem; border-radius: 9px; font-size: .65rem }
.cart-remove { width: 36px; padding: 0 }

/* Address book */
.address-page { max-width: 1160px; margin: auto; padding-bottom: 5rem }
.address-page-head { display: flex; justify-content: space-between; align-items: end; margin-bottom: 1.3rem }
.address-page-head h1 { margin: .2rem 0 }
.address-page-head p { margin: 0; color: var(--muted) }
.address-layout { display: grid; grid-template-columns: minmax(0,1fr) 390px; gap: 1rem; align-items: start }
.address-list { display: grid; gap: .75rem }
.address-card, .address-form { background: #fff; border: 1px solid #e9e1e9; border-radius: 18px; padding: 1rem }
.address-card.is-default { border-color: #bdaee7; box-shadow: 0 0 0 2px rgba(103,80,181,.07) }
.address-card header { display: flex; justify-content: space-between }
.address-card header strong { font-size: .85rem }
.address-card header span { font-size: .58rem; background: #e9e3fb; color: #5c47a5; border-radius: 20px; padding: .2rem .5rem }
.address-card h2 { font-size: .75rem; margin: .7rem 0 .2rem }
.address-card p { font-size: .7rem; color: #625a63; line-height: 1.9; margin: .2rem 0 }
.address-card > small { display: flex; gap: 1rem; font-size: .62rem; color: #85808a }
.address-card footer { display: flex; align-items: center; gap: .7rem; border-top: 1px solid #eee8ee; margin-top: .75rem; padding-top: .7rem }
.address-card footer form { margin: 0 }
.address-card footer a, .address-card footer button { border: 0; background: none; color: #6652b5; font: inherit; font-size: .62rem; cursor: pointer }
.address-form { position: sticky; top: 95px }
.address-form h2 { font-size: .9rem; margin: 0 0 1rem }
.address-fields { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; margin-bottom: 1rem }
.address-fields label { display: grid; gap: .25rem }
.address-fields label > span { font-size: .63rem; font-weight: 700 }
.address-fields input, .address-fields textarea { width: 100%; border: 1px solid #dcd5dc; border-radius: 9px; padding: .6rem; font: inherit; font-size: .68rem }
.address-fields small { color: #b4234d; font-size: .55rem }
.address-fields .wide { grid-column: 1/-1 }
.checkout-address-book { display: grid; gap: .55rem; margin-bottom: 1rem }
.checkout-address-book__head { display: flex; justify-content: space-between }
.checkout-address-book__head strong { font-size: .76rem }
.checkout-address-book__head a { font-size: .62rem; color: #6652b5 }
.checkout-address-option { display: flex !important; grid-template-columns: auto 1fr !important; align-items: flex-start; gap: .6rem; padding: .7rem; border: 1px solid #e3dce4; border-radius: 11px; cursor: pointer }
.checkout-address-option:has(input:checked) { border-color: #9b86d5; background: #f7f4ff }
.checkout-address-option input { width: auto; margin-top: .2rem }
.checkout-address-option > span { display: grid; gap: .15rem }
.checkout-address-option b { font-size: .68rem }
.checkout-address-option b i { font-size: .52rem; font-style: normal; color: #6652b5 }
.checkout-address-option small, .checkout-address-option em { font-size: .58rem; color: #79717b; font-style: normal }

@media(max-width:850px) {
    .address-layout { grid-template-columns: 1fr }
    .address-form { position: static }
}

@media(max-width:550px) {
    .address-page-head { align-items: flex-start; flex-direction: column; gap: .7rem }
    .address-fields { grid-template-columns: 1fr }
    .address-fields .wide { grid-column: auto }
}

/* Modern multi-method authentication */
.auth-tabs { display: grid; grid-template-columns: 1fr 1fr; padding: .25rem; background: #f3eff6; border-radius: 11px; margin-bottom: 1rem }
.auth-tabs button { border: 0; background: transparent; border-radius: 8px; padding: .6rem; font: inherit; font-size: .68rem; color: #746b76; cursor: pointer }
.auth-tabs button.is-active { background: #fff; color: #4f3e92; box-shadow: 0 2px 9px rgba(64,45,62,.08); font-weight: 750 }
.auth-divider { display: flex; align-items: center; gap: .6rem; margin: 1rem 0; color: #98909a; font-size: .6rem }
.auth-divider:before, .auth-divider:after { content: ""; height: 1px; background: #e6dfe6; flex: 1 }
.google-login { width: 100%; height: 44px; display: flex; align-items: center; justify-content: center; gap: .6rem; border: 1px solid #dcd5dc; border-radius: 11px; background: #fff; font: inherit; font-size: .7rem; cursor: pointer }
.google-login b { font-family: Arial; font-size: 1rem; color: #4285f4 }
.google-login small { font-size: .5rem; color: #999 }
.google-login:disabled { opacity: .58; cursor: not-allowed }
.otp-message { padding: .65rem; margin-bottom: .7rem; border-radius: 10px; background: #eaf8f2; color: #256f57; font-size: .65rem }
.otp-input input { font-size: 1rem; letter-spacing: .35em; text-align: center }

/* Dynamic shipping management and checkout */
.shipping-admin-layout { display: grid; grid-template-columns: minmax(0,1fr) 390px; gap: 1rem; align-items: start }
.shipping-method-list { display: grid; gap: .75rem; overflow: visible }
.shipping-method-admin { border: 1px solid #e2e6ec; border-radius: 13px; padding: .9rem; background: #fff }
.shipping-method-admin.is-disabled { background: #f8f9fb; color: #808895 }
.shipping-method-admin__head { display: grid; grid-template-columns: 42px minmax(0,1fr) auto; gap: .7rem; align-items: center }
.shipping-method-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 11px; background: #eee9ff; color: #6650b5; font-size: 1.2rem }
.shipping-method-admin__head > div { display: grid; gap: .1rem }
.shipping-method-admin__head strong { font-size: .78rem }
.shipping-method-admin__head code { font-size: .55rem; color: #756b7a }
.shipping-method-admin__head small { font-size: .58rem; color: #858e9b }
.shipping-method-admin dl { display: grid; grid-template-columns: repeat(3,1fr); gap: .7rem; margin: .8rem 0 0; padding: .7rem; background: #f8f9fb; border-radius: 9px }
.shipping-method-admin dl div { display: grid; gap: .12rem }
.shipping-method-admin dt { font-size: .54rem; color: #8b94a1 }
.shipping-method-admin dd { margin: 0; font-size: .64rem; font-weight: 650 }
.shipping-method-admin footer { display: flex; gap: 1rem; margin-top: .7rem; padding-top: .65rem; border-top: 1px solid #edf0f3 }
.shipping-method-admin footer form { margin: 0 }
.shipping-method-admin footer button { border: 0; background: none; color: #6652b5; font: inherit; font-size: .6rem; cursor: pointer; padding: 0 }
.shipping-method-form { position: sticky; top: 84px; overflow: visible }
.shipping-method-form h2 { font-size: .85rem; margin: 0 0 1rem }
.shipping-method-form form { display: grid; gap: .7rem }
.shipping-method-form label > span { font-size: .63rem }
.shipping-method-form label > small { font-size: .52rem; color: #858e9c }
.shipping-active-check { display: flex; align-items: center; gap: .45rem }
.shipping-active-check span { margin: 0 !important }
.shipping-form-actions { display: flex; gap: .5rem }
.checkout-shipping { display: grid; gap: .55rem; margin-top: 1.2rem; padding-top: 1rem; border-top: 1px solid #eee7ed }
.checkout-shipping > div:first-child { display: flex; justify-content: space-between }
.checkout-shipping > div:first-child h2 { margin: 0 }
.checkout-shipping > div:first-child span { font-size: .6rem; color: #b4234d }
.checkout-shipping-option { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .65rem; padding: .8rem; border: 1px solid #e3dce4; border-radius: 12px; cursor: pointer }
.checkout-shipping-option:has(input:checked) { border-color: #927cd0; background: #f7f4ff; box-shadow: 0 0 0 2px rgba(108,83,184,.06) }
.checkout-shipping-option input { width: auto }
.checkout-shipping-option > span { display: grid }
.checkout-shipping-option b { font-size: .72rem }
.checkout-shipping-option small { font-size: 0.95rem; color: #7e7680 }
.checkout-shipping-option small i { font-style: normal }
.checkout-shipping-option > strong { font-size: 1rem; color: #5e4aa6; white-space: nowrap }
.checkout-shipping-empty { padding: .8rem; border-radius: 10px; background: #fff0f3; color: #a52148; font-size: .65rem }

@media(max-width:950px) {
    .shipping-admin-layout { grid-template-columns: 1fr }
    .shipping-method-form { position: static }
}

@media(max-width:600px) {
    .shipping-method-admin dl { grid-template-columns: 1fr }
    .checkout-shipping-option { grid-template-columns: auto 1fr }
    .checkout-shipping-option > strong { grid-column: 2 }
}

/* Login submission feedback */
.auth-submit.is-loading { opacity: .78; cursor: wait }
.auth-submit.is-loading:before { content: ""; width: 15px; height: 15px; margin-left: .5rem; display: inline-block; vertical-align: middle; border: 2px solid rgba(255,255,255,.45); border-top-color: #fff; border-radius: 50%; animation: auth-spin .7s linear infinite }

@keyframes auth-spin {
    to { transform: rotate(360deg) }
}

/* More readable typography in order and shipping administration */
.order-admin-stats small { font-size: .72rem }
.order-admin-stats strong { font-size: 1.35rem }
.order-admin-filters input, .order-admin-filters select { font-size: .78rem }
.order-admin-filters > a { font-size: .7rem }
.order-admin-table th { font-size: .76rem }
.order-admin-table td { font-size: .84rem }
.order-admin-table td > small { font-size: .66rem }
.order-admin-table code { font-size: .7rem }
.order-status { font-size: .66rem }
.order-view-button { font-size: .68rem }
.admin-pagination a { font-size: .72rem }
.order-section-head h2, .order-detail-side h2 { font-size: .94rem }
.order-section-head p, .order-status-card > p { font-size: .68rem }
.order-item-list article { font-size: .75rem }
.order-item-list small { font-size: .66rem }
.order-item-list code { font-size: .64rem }
.order-totals div { font-size: .75rem }
.order-totals .is-total { font-size: .86rem }
.payment-admin-list article { font-size: .71rem }
.payment-admin-list small { font-size: .63rem }
.payment-admin-list code { font-size: .64rem }
.customer-info dt { font-size: .65rem }
.customer-info dd { font-size: .78rem }
.order-status-card select { font-size: .76rem }
.order-final-state { font-size: .73rem }
.shipping-method-admin__head strong { font-size: .88rem }
.shipping-method-admin__head code { font-size: .64rem }
.shipping-method-admin__head small { font-size: .67rem }
.shipping-method-admin dt { font-size: .63rem }
.shipping-method-admin dd { font-size: .73rem }
.shipping-method-admin footer button { font-size: .69rem }
.shipping-method-form h2 { font-size: .95rem }
.shipping-method-form label > span { font-size: .72rem }
.shipping-method-form label > small { font-size: .61rem }
.shipping-method-form input, .shipping-method-form textarea { font-size: .76rem }

/* Dynamic payment gateways */
.checkout-payment { display: grid; gap: .55rem; margin-top: 1.2rem; padding-top: 1rem; border-top: 1px solid #eee7ed;margin-bottom :15px; }
.checkout-payment > div:first-child { display: flex; justify-content: space-between }
.checkout-payment h2 { margin: 0 }
.checkout-payment > div:first-child > span { font-size: .6rem; color: #b4234d }
.checkout-payment-option { display: grid; grid-template-columns: auto 38px 1fr auto; align-items: center; gap: .65rem; padding: .8rem; border: 1px solid #e3dce4; border-radius: 12px; cursor: pointer }
.checkout-payment-option:has(input:checked) { border-color: #927cd0; background: #f7f4ff; box-shadow: 0 0 0 2px rgba(108,83,184,.06) }
.checkout-payment-option input { width: auto }
.checkout-payment-option__mark { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; background: #eee9ff; color: #604aaa; font-weight: 800 }
.checkout-payment-option > span:nth-child(3) { display: grid }
.checkout-payment-option b { font-size: .74rem }
.checkout-payment-option b i { font-size: .52rem; font-style: normal; color: #7562b8; margin-right: .3rem }
.checkout-payment-option small { font-size: 0.95rem; color: #7e7680 }
.checkout-payment-option > em { font-size: .56rem; font-style: normal; border-radius: 20px; padding: .2rem .5rem; background: #fff0d8; color: #90601b }
.payment-admin-form { display: grid; gap: 1rem }
.payment-default-card { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 1rem; align-items: center; overflow: visible }
.payment-default-card h2 { font-size: .9rem; margin: 0 }
.payment-default-card p { font-size: .64rem; color: #7d8693; margin: .2rem 0 }
.payment-default-card > span { grid-column: 1/-1; color: #b4234d; font-size: .65rem }
.payment-default-options { display: flex; gap: .4rem; padding: .25rem; background: #f2f4f7; border-radius: 11px }
.payment-default-options label { cursor: pointer }
.payment-default-options input { position: absolute; opacity: 0 }
.payment-default-options span { display: block; border-radius: 8px; padding: .5rem .75rem; font-size: .65rem; color: #6f7885 }
.payment-default-options label:has(input:checked) span { background: #fff; color: #5945a2; box-shadow: 0 2px 8px rgba(45,35,70,.08); font-weight: 750 }
.payment-gateway-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem }
.payment-gateway-card { overflow: visible }
.payment-gateway-card--test { grid-column: 1/-1 }
.payment-gateway-head { display: grid; grid-template-columns: 44px 1fr auto; gap: .7rem; align-items: center; padding-bottom: .9rem; margin-bottom: 1rem; border-bottom: 1px solid #e8ebef }
.payment-gateway-head > span { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 12px; background: #eee9ff; color: #654eb2; font-size: .88rem; font-weight: 850 }
.payment-gateway-head h2 { font-size: .88rem; margin: 0 }
.payment-gateway-head p { font-size: .61rem; color: #858e9c; margin: .1rem 0 }
.payment-gateway-note { padding: .75rem; border-radius: 10px; background: #fff8e9; color: #815c20; font-size: .64rem }
.payment-gateway-fields { display: grid; gap: .75rem }
.payment-gateway-fields--two { grid-template-columns: 1fr 1fr }
.payment-gateway-fields label { display: grid; gap: .3rem }
.payment-gateway-fields label > span { font-size: .67rem; font-weight: 700 }
.payment-gateway-fields input { width: 100%; border: 1px solid #dce1e8; border-radius: 9px; padding: .65rem .7rem; font: inherit; font-size: .72rem }
.payment-gateway-fields small { font-size: .56rem; color: #87909d }
.payment-field-wide { grid-column: 1/-1 }
.payment-transactions { margin-top: 1rem; padding: 0; overflow: hidden }
.payment-transactions .order-section-head { padding: 1rem }
.payment-gateway-code { direction: ltr; display: inline-block; border-radius: 7px; padding: .2rem .45rem; background: #f0ecfb; color: #5946a0; font-size: .68rem }

@media(max-width:950px) {
    .payment-gateway-grid { grid-template-columns: 1fr }
    .payment-gateway-card--test { grid-column: auto }
    .payment-default-card { grid-template-columns: 1fr }
    .payment-default-options { justify-self: start }
}

@media(max-width:600px) {
    .checkout-payment-option { grid-template-columns: auto 38px 1fr }
    .checkout-payment-option > em { grid-column: 3 }
    .payment-default-options { width: 100%; display: grid; grid-template-columns: 1fr 1fr 1fr }
    .payment-default-options span { text-align: center; padding: .5rem .25rem }
    .payment-gateway-fields--two { grid-template-columns: 1fr }
    .payment-field-wide { grid-column: auto }
    .payment-gateway-head { grid-template-columns: 44px 1fr }
    .payment-gateway-head .qa-switch { grid-column: 1/-1 }
}

/* Coupons and promotions */
.cart-discount-row { color: #16805a }
.cart-coupon { margin: 1rem 0; padding: 1rem 0; border-top: 1px dashed #ded5df; border-bottom: 1px dashed #ded5df }
.cart-coupon form { margin: 0 }
.cart-coupon label { display: block; font-size: .66rem; font-weight: 700; margin-bottom: .35rem }
.cart-coupon form > div { display: flex }
.cart-coupon input { min-width: 0; flex: 1; height: 40px; border: 1px solid #ddd5de; border-radius: 0 9px 9px 0; padding: .5rem .65rem; font: inherit; font-size: .68rem; text-transform: uppercase }
.cart-coupon form > div > button { height: 40px; border: 0; border-radius: 9px 0 0 9px; background: #6c55b5; color: #fff; padding: 0 .85rem; font: inherit; font-size: .65rem }
.cart-coupon__applied { display: flex; align-items: center; justify-content: space-between; padding: .65rem; border-radius: 10px; background: #e9f8f1 }
.cart-coupon__applied > span { display: grid }
.cart-coupon__applied b { font-size: .72rem; color: #176f51 }
.cart-coupon__applied small { font-size: .56rem; color: #48816e }
.cart-coupon__applied button { width: 28px; height: 28px; border: 0; border-radius: 7px; background: #fff; color: #a12c4d; cursor: pointer }
.coupon-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: .75rem; margin-bottom: 1rem }
.coupon-stats > div { display: grid; padding: 1rem; border: 1px solid #e3e7ed; border-radius: 13px; background: #fff }
.coupon-stats small { font-size: .65rem; color: #7f8996 }
.coupon-stats strong { font-size: 1.35rem }
.coupon-admin-layout { display: grid; grid-template-columns: minmax(0,1fr) 390px; gap: 1rem; align-items: start }
.coupon-list { display: grid; gap: .75rem; overflow: visible }
.coupon-card { padding: .9rem; border: 1px solid #e2e6ec; border-radius: 13px }
.coupon-card.is-disabled { background: #f8f9fb; color: #858d98 }
.coupon-card__head { display: grid; grid-template-columns: 42px minmax(0,1fr) auto; gap: .7rem; align-items: center }
.coupon-card__head > span:first-child { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 11px; background: #eee9ff; color: #6650b5; font-weight: 850 }
.coupon-card__head > div { display: grid }
.coupon-card__head code { font-size: .74rem; color: #5947a0; font-weight: 800 }
.coupon-card__head strong { font-size: .69rem }
.coupon-card dl { display: grid; grid-template-columns: repeat(3,1fr); gap: .7rem; margin: .8rem 0 0; padding: .7rem; border-radius: 9px; background: #f8f9fb }
.coupon-card dl div { display: grid }
.coupon-card dt { font-size: .61rem; color: #89929f }
.coupon-card dd { margin: 0; font-size: .71rem; font-weight: 700 }
.coupon-card footer { display: flex; gap: 1rem; padding-top: .7rem; margin-top: .7rem; border-top: 1px solid #edf0f3 }
.coupon-card footer form { margin: 0 }
.coupon-card footer button { border: 0; background: none; padding: 0; color: #6551ad; font: inherit; font-size: .68rem; cursor: pointer }
.coupon-form-card { position: sticky; top: 84px; overflow: visible }
.coupon-form-card h2 { font-size: .92rem; margin: 0 0 1rem }
.coupon-form-card form { display: grid; gap: .7rem }
.coupon-form-card label > span { font-size: .7rem }
.coupon-form-card input:not([type=checkbox]), .coupon-form-card select { width: 100%; border: 1px solid #dce1e8; border-radius: 9px; padding: .62rem .7rem; font: inherit; font-size: .72rem }
.coupon-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem }

@media(max-width:1000px) {
    .coupon-admin-layout { grid-template-columns: 1fr }
    .coupon-form-card { position: static }
}

@media(max-width:600px) {
    .coupon-stats { grid-template-columns: 1fr }
    .coupon-card dl, .coupon-form-row { grid-template-columns: 1fr }
    .coupon-card__head { grid-template-columns: 42px 1fr }
    .coupon-card__head > .status { grid-column: 2 }
}

/* Group pricing rules */
.pricing-explainer { display: grid; grid-template-columns: 180px 1fr; gap: .8rem 1.2rem; align-items: center; margin-bottom: 1rem; overflow: visible; border-right: 4px solid #765cc4 }
.pricing-explainer > div { display: grid; padding: .7rem; border-radius: 11px; background: #f1edfb }
.pricing-explainer small { font-size: .64rem; color: #7c7485 }
.pricing-explainer strong { font-size: 1.45rem; color: #5d48a7 }
.pricing-explainer p { margin: 0; font-size: .72rem }
.pricing-explainer > span { grid-column: 1/-1; font-size: .65rem; color: #707987 }
.pricing-rule-form { display: grid; grid-template-columns: 1.35fr .7fr 1fr 1fr auto; gap: .75rem; align-items: start; margin-bottom: 1rem; overflow: visible }
.pricing-rule-form label, .pricing-rule-action { display: grid; grid-template-rows: 1rem 42px 1rem; gap: .3rem; min-width: 0 }
.pricing-rule-form label > span, .pricing-rule-action > span { grid-row: 1; font-size: .67rem; font-weight: 700 }
.pricing-rule-form label > small, .pricing-rule-action > small { grid-row: 3; font-size: .54rem; line-height: 1rem; color: #87909d }
.pricing-rule-placeholder { visibility: hidden }
.pricing-rule-form input { grid-row: 2; width: 100%; min-width: 0; height: 42px; margin: 0; border: 1px solid #dce1e8; border-radius: 9px; padding: .6rem .7rem; font: inherit; font-size: .7rem }
.pricing-rule-form .btn { grid-row: 2; align-self: stretch; width: 100%; height: 42px; margin: 0; padding: .55rem 1rem; font-size: 1rem; line-height: 1.4; white-space: nowrap }
.pricing-rules-card { padding: 0; overflow: hidden }
.pricing-rules-card .order-section-head { padding: 1rem }
.pricing-actions { display: flex; align-items: center; gap: .75rem }
.pricing-actions form { margin: 0 }
.pricing-actions button { border: 0; background: none; padding: 0; color: #6250af; font: inherit; font-size: .66rem; cursor: pointer }
.pricing-actions .danger-link { color: #bd3653 }

@media(max-width:1100px) {
    .pricing-rule-form { grid-template-columns: 1fr 1fr }
    .pricing-rule-action { grid-column: 1/-1 }
    .pricing-rule-action .btn { width: max-content; min-width: 210px }
}

@media(max-width:650px) {
    .pricing-explainer, .pricing-rule-form { grid-template-columns: 1fr }
    .pricing-explainer > span, .pricing-rule-action { grid-column: auto }
    .pricing-rule-action .btn { width: 100%; min-width: 0 }
}

/* Coupon sidebar form containment and polish */
.coupon-admin-layout { grid-template-columns: minmax(0,1fr) 420px; gap: 1.15rem }
.coupon-form-card { min-width: 0; padding: 22px; overflow: hidden }
.coupon-form-card h2 { margin: 0 0 1.1rem; padding-bottom: .85rem; border-bottom: 1px solid #eceef2; font-size: 1rem }
.coupon-form-card .admin-form { width: 100%; max-width: 100%; min-width: 0; gap: .85rem }
.coupon-form-card .admin-form > label, .coupon-form-card .coupon-form-row, .coupon-form-card .coupon-form-row > label { width: 100%; min-width: 0 }
.coupon-form-card label { display: block; margin: 0 }
.coupon-form-card label > span { font-size: .72rem; line-height: 1.5; margin-bottom: .38rem }
.coupon-form-card input:not([type=checkbox]), .coupon-form-card select { display: block; width: 100%; max-width: 100%; min-width: 0; height: 42px; padding: .55rem .7rem; background: #fbfbfd }
.coupon-form-card input:focus, .coupon-form-card select:focus { background: #fff }
.coupon-form-row { grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: .7rem }
.coupon-form-card .shipping-active-check { display: flex; align-items: center; gap: .5rem; padding: .7rem .8rem; border-radius: 10px; background: #f7f8fb }
.coupon-form-card .shipping-active-check input { width: 17px; height: 17px; accent-color: #765cc4 }
.coupon-form-card .shipping-form-actions { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(0,.75fr); gap: .65rem; margin-top: .25rem }
.coupon-form-card .shipping-form-actions .btn { width: 100%; min-width: 0; height: 44px; padding: .55rem .7rem; font-size: .72rem }
.coupon-form-card .shipping-form-actions [hidden] { display: none }

@media(max-width:1100px) {
    .coupon-admin-layout { grid-template-columns: minmax(0,1fr) 380px }
}

@media(max-width:1000px) {
    .coupon-admin-layout { grid-template-columns: 1fr }
    .coupon-form-card { position: static; width: 100%; max-width: 680px }
}

@media(max-width:520px) {
    .coupon-form-card { padding: 16px }
    .coupon-form-row, .coupon-form-card .shipping-form-actions { grid-template-columns: 1fr }
}

/* Customer administration */
.customer-admin-stats { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .75rem; margin-bottom: 1rem }
.customer-admin-stats > a { position: relative; display: grid; gap: .12rem; padding: 1rem; border: 1px solid #e2e6ed; border-radius: 14px; background: #fff; overflow: hidden }
.customer-admin-stats > a:after { content: ""; position: absolute; inset: auto 0 0; height: 3px; background: transparent }
.customer-admin-stats > a:hover, .customer-admin-stats > a.is-active { border-color: #bcb0df; box-shadow: 0 7px 20px rgba(64,48,105,.06) }
.customer-admin-stats > a.is-active:after { background: #765cc4 }
.customer-admin-stats small { font-size: .7rem; color: #7e8896 }
.customer-admin-stats strong { font-size: 1.45rem; line-height: 1.45 }
.customer-admin-stats span { font-size: .59rem; color: #959da8 }
.customer-admin-filters { display: grid; grid-template-columns: minmax(260px,1fr) auto auto; align-items: center; gap: .7rem; margin-bottom: 1rem; overflow: visible }
.customer-admin-filters input { height: 42px; min-width: 0; padding: .55rem .75rem; border: 1px solid #dce1e8; border-radius: 9px; font: inherit; font-size: .76rem }
.customer-admin-filters .btn { height: 42px; padding: .5rem 1.25rem; font-size: .7rem; white-space: nowrap }
.customer-admin-filters > a { font-size: .68rem; color: #6752b7 }
.customer-list-card { padding: 0; overflow: hidden }
.customer-admin-table td { vertical-align: middle; font-size: .8rem }
.customer-admin-table td > small { display: block; margin-top: .12rem; color: #8a93a0; font-size: .64rem }
.customer-identity { display: flex; align-items: center; gap: .65rem; min-width: 175px }
.customer-identity > span, .customer-profile-avatar { width: 40px; height: 40px; flex: 0 0 40px; display: grid; place-items: center; border-radius: 12px; background: linear-gradient(145deg,#eee8ff,#ffeaf1); color: #664caf; font-weight: 850 }
.customer-identity > div { display: grid }
.customer-identity strong { font-size: .78rem }
.customer-identity small { font-size: .57rem; color: #929ba7; direction: ltr; text-align: right }
.customer-contact { display: grid; min-width: 150px }
.customer-contact > span { font-size: .72rem; text-align: right }
.customer-contact small { font-size: .62rem; color: #818b98; text-align: right }
.cell-placeholder { color: #9ba3ad; font-size: .65rem }
.customer-state { display: inline-flex; align-items: center; gap: .35rem; padding: .24rem .55rem; border-radius: 20px; font-size: .64rem; white-space: nowrap }
.customer-state:before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor }
.customer-state--active { background: #e2f7ed; color: #187454 }
.customer-state--locked { background: #ffe9ed; color: #ad3450 }
.customer-detail-head .head-actions form { margin: 0 }
.customer-lock-button { height: 34px; padding: 0 .75rem; border: 1px solid #e4a5b3; border-radius: 8px; background: #fff5f7; color: #ad2f4c; font: inherit; font-size: .67rem; cursor: pointer }
.customer-lock-button.is-unlock { border-color: #9cd6bf; background: #effaf5; color: #1a7454 }
.customer-detail-stats { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .75rem; margin-bottom: 1rem }
.customer-detail-stats > div { display: grid; padding: 1rem; border: 1px solid #e2e6ed; border-radius: 14px; background: #fff }
.customer-detail-stats small { font-size: .66rem; color: #818b98 }
.customer-detail-stats strong { font-size: 1.35rem; line-height: 1.5 }
.customer-detail-stats strong.is-date { font-size: 1rem; margin-top: .3rem }
.customer-detail-stats span { font-size: .58rem; color: #8a93a0 }
.customer-detail-layout { display: grid; grid-template-columns: minmax(0,1fr) 360px; gap: 1rem; align-items: start }
.customer-detail-main, .customer-detail-side { display: grid; gap: 1rem }
.customer-detail-layout .order-section-head > span { font-size: .65rem; color: #7762bc }
.customer-order-list { display: grid }
.customer-order-list > a { display: grid; grid-template-columns: minmax(170px,1fr) 75px 135px 115px 65px; align-items: center; gap: .7rem; padding: .85rem 0; border-bottom: 1px solid #edf0f3 }
.customer-order-list > a:hover { background: #fbfaff }
.customer-order-list > a > div { display: grid }
.customer-order-list code { font-size: .7rem; color: #5c49a4 }
.customer-order-list small { font-size: .59rem; color: #8a93a0 }
.customer-order-list > a > span, .customer-order-list > a > b { font-size: .7rem }
.customer-order-list em { font-style: normal; text-align: center }
.customer-order-list i { font-size: .62rem; font-style: normal; color: #6551ad }
.customer-account-card { text-align: center; overflow: visible }
.customer-profile-avatar { width: 62px; height: 62px; margin: 0 auto .55rem; border-radius: 18px; font-size: 1.3rem }
.customer-account-card h2 { margin: 0 0 .35rem; font-size: 1rem }
.customer-account-card dl { display: grid; gap: .75rem; margin: 1rem 0 0; padding-top: 1rem; border-top: 1px solid #eceff3; text-align: right }
.customer-account-card dl > div { display: grid; grid-template-columns: 1fr auto; gap: .08rem .5rem }
.customer-account-card dt { font-size: .62rem; color: #858f9d }
.customer-account-card dd { grid-column: 1/-1; margin: 0; font-size: .72rem; overflow-wrap: anywhere }
.customer-account-card dl small { grid-row: 1; grid-column: 2; font-size: .56rem; color: #ad4058 }
.customer-account-card dl small.is-verified { color: #21805e }
.customer-addresses-card { overflow: visible }
.customer-addresses-card article { padding: .8rem 0; border-bottom: 1px solid #edf0f3 }
.customer-addresses-card article header { display: flex; align-items: center; justify-content: space-between; margin-bottom: .25rem }
.customer-addresses-card article header strong { font-size: .73rem }
.customer-addresses-card article header span { padding: .12rem .4rem; border-radius: 12px; background: #eee9ff; color: #604baa; font-size: .54rem }
.customer-addresses-card article > b { font-size: .67rem }
.customer-addresses-card article p { margin: .2rem 0; color: #697485; font-size: .65rem; line-height: 1.8 }
.customer-addresses-card article footer { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: .5rem !important; margin: 0 !important; padding: .25rem 0 0 !important; border: 0 !important; background: transparent !important; color: #88919e !important; font-size: .57rem !important; grid-template-columns: none !important }
.customer-address-empty { padding: 1rem 0; text-align: center; color: #929ba7; font-size: .65rem }
.customer-profile-link { display: block; margin-top: 1rem; padding-top: .75rem; border-top: 1px solid #edf0f3; color: #6551ad; font-size: .68rem }

@media(max-width:1150px) {
    .customer-admin-stats, .customer-detail-stats { grid-template-columns: 1fr 1fr }
    .customer-detail-layout { grid-template-columns: 1fr }
    .customer-detail-side { grid-template-columns: 1fr 1fr }
}

@media(max-width:760px) {
    .customer-admin-filters { grid-template-columns: 1fr }
    .customer-admin-filters .btn { width: 100% }
    .customer-order-list > a { grid-template-columns: 1fr 1fr }
    .customer-order-list i { text-align: left }
    .customer-detail-side { grid-template-columns: 1fr }
}

@media(max-width:520px) {
    .customer-admin-stats, .customer-detail-stats { grid-template-columns: 1fr }
    .customer-order-list > a { grid-template-columns: 1fr }
    .customer-order-list i { text-align: right }
}

/* Unified admin shell, collapsible navigation and site settings */
.admin-main .admin-head h1 { font-size: 1.45rem; line-height: 1.55 }
.admin-main .admin-head p { font-size: .76rem }
.admin-nav { gap: 10px; padding: 16px 12px }
.admin-nav__brand { display: flex; align-items: center; gap: .55rem; font-size: 1rem; padding: 5px 8px 15px }
.admin-nav__brand b { font-weight: 800 }
.admin-nav__section { border: 1px solid rgba(255,255,255,.08); border-radius: 13px; background: rgba(255,255,255,.025); overflow: hidden }
.admin-nav__section > summary { position: relative; display: grid; grid-template-columns: 30px minmax(0,1fr) auto; grid-template-rows: auto auto; align-items: center; gap: 0 .55rem; padding: .72rem .65rem; cursor: pointer; list-style: none; user-select: none }
.admin-nav__section > summary::-webkit-details-marker { display: none }
.admin-nav__section > summary:hover { background: rgba(255,255,255,.06) }
.admin-nav__section > summary b { font-size: 1.76rem; line-height: 1.5 }
.admin-nav__section > summary small { grid-column: 2; color: #a9a1b8; font-size: 1rem; line-height: 1.5 }
.admin-nav__section > summary i { grid-column: 3; grid-row: 1/3; font-style: normal; color: #a9a1b8; font-size: .8rem; transition: transform .2s }
.admin-nav__section[open] > summary i { transform: rotate(180deg) }
.admin-nav__section-icon { grid-row: 1/3; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 9px; background: rgba(255,255,255,.09); color: #e9dcff; font-size: .78rem }
.admin-nav__section[open] > summary { background: rgba(255,255,255,.055); border-bottom: 1px solid rgba(255,255,255,.07) }
.admin-nav__links { display: flex; flex: initial; flex-direction: column; gap: 2px; padding: .38rem }
.admin-nav__links > a { display: flex; align-items: center; gap: .55rem; padding: .52rem .58rem; border-radius: 8px; color: #d6d0df; font-size: 1rem; font-weight: 550; transition: .16s }
.admin-nav__links > a > span { width: 22px; height: 22px; display: grid; place-items: center; border-radius: 6px; color: #aaa1bc; font-size: 1rem }
.admin-nav__links > a:hover { background: rgba(255,255,255,.07); color: #fff }
.admin-nav__links > a.is-active { background: linear-gradient(90deg,rgba(121,87,200,.5),rgba(255,111,145,.14)); color: #fff; box-shadow: inset -2px 0 #cfbaff }
.admin-nav__links > a.is-active > span { background: rgba(255,255,255,.11); color: #fff }
.settings-head-links { display: flex; gap: .5rem }
.settings-head-links a { padding: .52rem .75rem; border: 1px solid #dfe2e9; border-radius: 9px; background: #fff; color: #5c4ca2; font-size: 1rem; font-weight: 700 }
.site-settings-form { display: grid; gap: 1rem }
.site-settings-group { padding: 0; overflow: visible }
.site-settings-group > header { display: flex; align-items: center; gap: .8rem; padding: 1rem 1.15rem; border-bottom: 1px solid #eceef2; background: linear-gradient(90deg,#fcfbfe,#fff); border-radius: 17px 17px 0 0 }
.site-settings-group > header > span { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 12px; background: #eee8ff; color: #6650b5; font-weight: 850 }
.site-settings-group h2 { font-size: .9rem; margin: 0 }
.site-settings-group header p { font-size: .64rem; color: #7e8795; margin: .12rem 0 0 }
.site-settings-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0; border-radius: 0 0 18px 18px; overflow: hidden }
.site-setting-field { position: relative; display: grid; grid-template-columns: minmax(190px,.8fr) minmax(220px,1.2fr); align-items: center; gap: 1rem; margin: 0; padding: 1.05rem 1.15rem; border-bottom: 1px solid #edf0f3 }
.site-setting-field:nth-child(odd):not(.site-setting-field--wide) { border-left: 1px solid #edf0f3 }
.site-setting-field:last-child, .site-setting-field:nth-last-child(2):nth-child(odd) { border-bottom: 0 }
.site-setting-field--wide { grid-column: 1/-1; border-bottom: 0 }
.site-setting-field > span { display: grid; gap: .15rem }
.site-setting-field b { font-size: .76rem }
.site-setting-field small { font-size: .6rem; color: #858e9c; line-height: 1.8 }
.site-setting-field input, .site-setting-field select, .site-setting-field textarea { width: 100%; min-width: 0; border: 1px solid #dce1e8; border-radius: 10px; background: #fbfbfd; padding: .68rem .75rem; font: inherit; font-size: .72rem; outline: 0 }
.site-setting-field input:focus, .site-setting-field select:focus, .site-setting-field textarea:focus { background: #fff; border-color: #8f7acb; box-shadow: 0 0 0 3px rgba(118,92,196,.08) }
.site-setting-field code { position: absolute; left: 1.2rem; bottom: .12rem; color: #aaa3ae; font-size: .5rem; opacity: .65 }
.site-settings-save { position: sticky; bottom: 12px; z-index: 10; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .8rem 1rem; border: 1px solid #ddd7ed; border-radius: 14px; background: rgba(255,255,255,.94); box-shadow: 0 12px 35px rgba(48,37,79,.13); backdrop-filter: blur(12px) }
.site-settings-save > div { display: grid }
.site-settings-save b { font-size: .75rem }
.site-settings-save span { font-size: .6rem; color: #818997 }
.site-settings-save .btn { font-size: .72rem; padding: .65rem 1rem }

@media(max-width:1000px) {
    .admin-nav__section { background: rgba(255,255,255,.035) }
    .site-settings-fields { grid-template-columns: 1fr }
    .site-setting-field, .site-setting-field--wide { grid-column: auto; border-left: 0 !important; border-bottom: 1px solid #edf0f3 !important }
    .site-setting-field:last-child { border-bottom: 0 !important }
}

@media(max-width:650px) {
    .settings-head-links { width: 100%; flex-wrap: wrap }
    .site-setting-field { grid-template-columns: 1fr; gap: .6rem }
    .site-setting-field code { position: static }
    .site-settings-save { align-items: stretch; flex-direction: column }
    .site-settings-save .btn { width: 100% }
    .admin-nav__section > summary { padding: .8rem }
}

.persian-date-control { position: relative; display: flex; width: 100% }
.persian-date-control .persian-date-input { flex: 1; min-width: 0; padding-left: 58px !important; direction: rtl; text-align: right; font-variant-numeric: tabular-nums }
.persian-date-now { position: absolute; left: 5px; top: 50%; transform: translateY(-50%); height: 30px; padding: 0 .55rem; border: 0; border-radius: 7px; background: #eee9fb; color: #634daf; font: inherit; font-size: .58rem; font-weight: 750; cursor: pointer }
.persian-date-now:hover { background: #e3daf9 }
.persian-date-input:invalid { border-color: #d34d68 !important; box-shadow: 0 0 0 3px rgba(211,77,104,.08) !important }

/* Persian (Jalali) admin date picker */
.persian-calendar { position: fixed; z-index: 3000; width: min(350px,calc(100vw - 24px)); padding: 14px; direction: rtl; color: #25202d; background: #fff; border: 1px solid #e2dceb; border-radius: 18px; box-shadow: 0 24px 70px rgba(45,34,68,.2); font-family: inherit }
.persian-calendar[hidden] { display: none !important }
.persian-calendar__head { display: grid; grid-template-columns: 40px minmax(0,1fr) 40px; align-items: center; gap: 8px; margin-bottom: 12px }
.persian-calendar__head strong { display: block; min-width: 0; color: #30263e; font-size: 1rem; font-weight: 800; text-align: center }
.persian-calendar__head button, .persian-calendar__days button, .persian-calendar__footer button { font-family: inherit }
.persian-calendar__head button { width: 40px; height: 40px; padding: 0; color: #6341aa; background: #f5f1fb; border: 1px solid #e7def5; border-radius: 12px; font-size: 1.4rem; line-height: 1; cursor: pointer; transition: .16s }
.persian-calendar__head button:hover { background: #ece3fa; border-color: #d6c5ef; transform: translateY(-1px) }
.persian-calendar__weekdays, .persian-calendar__days { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 4px }
.persian-calendar__weekdays { margin-bottom: 5px }
.persian-calendar__weekdays span { display: grid; place-items: center; min-height: 28px; color: #81768f; font-size: .78rem; font-weight: 700 }
.persian-calendar__weekdays span:last-child { color: #c54858 }
.persian-calendar__days { min-height: 246px }
.persian-calendar__days button { aspect-ratio: 1; min-width: 0; padding: 0; color: #41384d; background: transparent; border: 1px solid transparent; border-radius: 11px; font-size: .86rem; font-weight: 650; cursor: pointer; transition: .15s }
.persian-calendar__days button:hover { color: #573493; background: #f6f1fc; border-color: #e5daf5; transform: translateY(-1px) }
.persian-calendar__days button.is-friday { color: #c54858 }
.persian-calendar__days button.is-today { border-color: #9a79cf; box-shadow: inset 0 0 0 1px rgba(105,65,170,.12); font-weight: 800 }
.persian-calendar__days button.is-selected, .persian-calendar__days button.is-selected:hover { color: #fff; background: linear-gradient(135deg,#7652ba,#58349c); border-color: #6540aa; box-shadow: 0 7px 16px rgba(92,54,158,.25) }
.persian-calendar__loading { grid-column: 1/-1; display: grid; place-items: center; min-height: 220px; color: #81768f; font-size: .86rem }
.persian-calendar__time { display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); align-items: end; gap: 8px; margin-top: 12px; padding: 11px 12px; background: #f8f6fb; border: 1px solid #eee8f5; border-radius: 13px }
.persian-calendar__time label { display: grid; gap: 4px; color: #665c72; font-size: .72rem; font-weight: 700; text-align: center }
.persian-calendar__time input { width: 100%; height: 36px; padding: 5px 7px; direction: ltr; color: #30263e; background: #fff; border: 1px solid #ddd4e8; border-radius: 9px; font-family: inherit; font-size: .9rem; font-weight: 700; text-align: center; outline: none }
.persian-calendar__time input:focus { border-color: #8a64c4; box-shadow: 0 0 0 3px rgba(112,72,179,.12) }
.persian-calendar__time-separator { padding-bottom: 8px; color: #756987; font-size: 1rem; font-weight: 800 }
.persian-calendar__footer { display: grid !important; grid-template-columns: auto auto minmax(0,1fr); gap: 7px; width: 100% !important; min-height: 0 !important; margin: 12px 0 0 !important; padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important }
.persian-calendar__footer button { min-height: 40px; padding: 8px 12px; color: #5f546c; background: #fff; border: 1px solid #ded6e8; border-radius: 11px; font-size: .8rem; font-weight: 750; cursor: pointer; transition: .16s }
.persian-calendar__footer button:hover { background: #f8f5fb; border-color: #cfc2df; transform: translateY(-1px) }
.persian-calendar__footer .is-primary { color: #fff; background: linear-gradient(135deg,#7652ba,#58349c); border-color: #6040a0 }
.persian-calendar__footer .is-primary:hover { background: linear-gradient(135deg,#6843ad,#4d288d); border-color: #553593 }

@media(max-width:560px) {
    .persian-calendar { top: auto !important; right: 10px !important; bottom: 10px !important; left: 10px !important; width: auto; max-height: calc(100vh - 20px); padding: 13px; overflow-y: auto; border-radius: 21px; box-shadow: 0 18px 70px rgba(32,24,45,.3) }
    .persian-calendar__days { min-height: 0 }
    .persian-calendar__footer button { padding-inline: 9px; font-size: .76rem }
}

/* 2026 admin shell: fixed RTL sidebar, clear typography and responsive navigation */
.admin-body { --admin-sidebar-width: 272px; --admin-blue: #4d83ee; --admin-indigo: #6268e8; --admin-navy: #1d2940; --admin-navy-soft: #263650; --admin-bg: #f6f8fb; --admin-border: #e7ebf1; --admin-text: #172238; --admin-muted: #748095; --ink: var(--admin-text); --purple: var(--admin-indigo); --line: var(--admin-border); --muted: var(--admin-muted); min-width: 320px; background: var(--admin-bg); color: var(--admin-text); font-family: "Segoe UI", Tahoma, Arial, sans-serif; font-size: 15px; font-weight: 450; line-height: 1.75; }
.admin-body button, .admin-body input, .admin-body select, .admin-body textarea { font-family: inherit }
.admin-topbar { position: fixed; z-index: 105; top: 0; right: var(--admin-sidebar-width); left: 0; width: auto; height: 70px; padding: 0 clamp(18px,2.4vw,36px); background: rgba(255,255,255,.96); border: 0; border-bottom: 1px solid var(--admin-border); box-shadow: 0 2px 12px rgba(24,38,62,.035); backdrop-filter: blur(14px); }
.admin-topbar__context { display: flex; align-items: center; gap: .8rem }
.admin-topbar__context > div { display: flex; align-items: center; gap: .9rem; min-width: 0 }
.admin-topbar__context > div > b { max-width: 440px; overflow: hidden; color: #172238; font-size: .92rem; font-weight: 800; text-overflow: ellipsis; white-space: nowrap }
.admin-environment { display: inline-flex; align-items: center; color: #748095; font-size: .72rem; white-space: nowrap }
.admin-environment i { width: 7px; height: 7px; background: #35b987; box-shadow: 0 0 0 4px #e0f7ee }
.admin-top-actions { gap: .85rem }
.admin-top-actions > a { padding: .42rem .68rem; color: #53647d; background: #f7f9fc; border: 1px solid #e9edf3; border-radius: 9px; font-size: .76rem; font-weight: 600 }
.admin-user { min-width: 120px; padding-right: .9rem; border-right: 1px solid #e7ebf1 }
.admin-user b { font-size: .78rem; font-weight: 800 }
.admin-user small { color: #8b95a5; font-size: .65rem }
.admin-top-actions form button { padding: .48rem .75rem; color: #b54056; background: #fff3f5; border: 1px solid #f5dce1; border-radius: 9px; font-size: .72rem; font-weight: 700; cursor: pointer }
.admin-workspace { min-height: calc(100vh - 58px); margin-right: var(--admin-sidebar-width); padding-top: 70px; }
.admin-page { display: block; width: 100%; max-width: none; margin: 0; padding: 0; }
.admin-main { width: 100%; max-width: 1600px; min-width: 0; margin: 0 auto; padding: 26px clamp(18px,2.3vw,38px) 54px; }
.admin-nav { position: fixed; z-index: 120; top: 0; right: 0; bottom: 0; width: var(--admin-sidebar-width); height: 100dvh; max-height: none; min-height: 0; margin: 0; padding: 17px 12px 22px; gap: 11px; overflow-x: hidden; overflow-y: auto; color: #e9eef7; background: linear-gradient(180deg,#1d2940 0%,#1b273d 55%,#182337 100%); border: 0; border-left: 1px solid #2d3d58; border-radius: 0; box-shadow: -8px 0 30px rgba(24,36,56,.08); scrollbar-color: #52627c transparent; }
.admin-nav__brand { min-height: 49px; margin: 0 2px 5px; padding: 5px 8px 14px; gap: .65rem; color: #fff; border-bottom: 1px solid rgba(255,255,255,.09); font-size: 1rem; font-weight: 800; }
.admin-nav__brand span { display: grid; place-items: center; width: 34px; height: 34px; flex: 0 0 34px; color: #fff; background: linear-gradient(145deg,#4d91f6,#4774e7); border-radius: 10px; box-shadow: 0 7px 18px rgba(47,112,225,.28); }
.admin-nav__close { display: none }
.admin-nav__section { margin: 0; background: transparent; border: 1px solid transparent; border-radius: 11px; }
.admin-nav__section[open] { background: rgba(255,255,255,.025); border-color: rgba(255,255,255,.055); }
.admin-nav__section > summary { min-height: 55px; grid-template-columns: 32px minmax(0,1fr) auto; padding: .62rem .55rem; border-radius: 10px; }
.admin-nav__section > summary:hover { background: rgba(255,255,255,.045) }
.admin-nav__section[open] > summary { background: transparent; border-bottom-color: rgba(255,255,255,.055) }
.admin-nav__section > summary b { color: #f2f5fa; font-size: .82rem; font-weight: 750 }
.admin-nav__section > summary small { color: #8795aa; font-size: .72rem }
.admin-nav__section > summary i { color: #8e9bb0; font-size: .78rem }
.admin-nav__section-icon { width: 28px; height: 28px; color: #aebfe0; background: #2a3a55; border: 1px solid rgba(255,255,255,.04); border-radius: 9px; font-size: .76rem; }
.admin-nav__links { gap: 1px; padding: .2rem .3rem .45rem }
.admin-nav__links > a { min-height: 34px; padding: .42rem .52rem; gap: .5rem; color: #bec9da; border-radius: 8px; font-size: .8rem; font-weight: 550; display: flex; align-items: center; }
.admin-nav__links > a > span { width: 20px; height: 20px; flex: 0 0 20px; color: #8fa0bb; background: transparent; border-radius: 6px; font-size: .8rem; display: flex; align-items: center; justify-content: center; line-height: 1; }
.admin-nav__links > a:hover { color: #fff; background: rgba(87,126,192,.13) }
.admin-nav__links > a.is-active { color: #fff; background: linear-gradient(90deg,rgba(69,125,229,.34),rgba(83,126,199,.14)); box-shadow: inset -3px 0 #58a0ff; }
.admin-nav__links > a.is-active > span { color: #dceaff; background: rgba(82,145,245,.2) }
.admin-nav-backdrop { position: fixed; z-index: 112; inset: 0; display: block; visibility: hidden; padding: 0; background: rgba(14,23,37,.46); border: 0; opacity: 0; pointer-events: none; transition: opacity .2s ease,visibility .2s ease; }
.admin-footer { width: auto !important; height: 58px; margin-right: var(--admin-sidebar-width); padding: 0 24px !important; color: #7d8899; background: #fff !important; border-top: 1px solid var(--admin-border) !important; font-size: .72rem; }

/* Admin typography and surfaces */
.admin-main > .admin-head { padding: .3rem 0 1.4rem }
.admin-main .admin-head h1 { color: #18243a; font-size: 1.28rem; line-height: 1.6; font-weight: 850 }
.admin-main .admin-head p { margin-top: .25rem; color: #7a8698; font-size: .78rem; line-height: 1.8 }
.admin-main h2 { color: #1c2940; font-weight: 800 }
.admin-body .admin-main small { font-size: .69rem; line-height: 1.7 }
.admin-body .admin-main label > span { font-size: .76rem !important; font-weight: 750 }
.admin-body .admin-main input:not([type=checkbox]), .admin-body .admin-main select, .admin-body .admin-main textarea { font-size: .76rem }
.admin-card, .dashboard-panel, .quick-actions { background: #fff; border-color: var(--admin-border); border-radius: 15px; box-shadow: 0 5px 18px rgba(30,49,78,.035); }
.admin-card:hover { border-color: #dde3eb }
.admin-table th, .dashboard-table th { padding: .78rem .75rem; color: #788599; background: #fafbfd; font-size: .71rem; font-weight: 750 }
.admin-table td, .dashboard-table td { padding: .78rem .75rem; color: #29364b; font-size: .77rem }
.admin-table tbody tr:hover, .dashboard-table tbody tr:hover { background: #fafcff }
.btn { border-radius: 10px; font-size:0.95rem }
.btn-primary { background: linear-gradient(135deg,#6268e8,#4f7fe9); box-shadow: 0 8px 20px rgba(78,105,224,.2) }
.status { font-size: .68rem }
.dashboard-main { gap: 1.05rem }
.dashboard-welcome { padding: .35rem 0 .6rem }
.dashboard-welcome h1 { color: #172238; font-size: 1.3rem; font-weight: 850 }
.dashboard-welcome p { color: #7b8799; font-size: .78rem }
.dashboard-date { min-width: 190px; padding: .62rem .8rem; background: #fff; border-color: var(--admin-border); border-radius: 11px; font-size: .76rem }
.kpi-grid { gap: .9rem }
.kpi-card { min-height: 132px; padding: 1.1rem 1.15rem; overflow: hidden; background: #fff; border-color: var(--admin-border); border-radius: 15px; box-shadow: 0 5px 18px rgba(30,49,78,.035); transition: transform .18s ease,border-color .18s ease,box-shadow .18s ease; }
.kpi-card:hover { transform: translateY(-2px); border-color: #d8e0eb; box-shadow: 0 11px 25px rgba(30,49,78,.075) }
.kpi-card > div { align-self: stretch; justify-content: center; padding-left: 60px }
.kpi-card small { color: #69768a; font-size: .72rem }
.kpi-card strong { color: #172238; font-size: 1.55rem; font-weight: 850 }
.kpi-card em { color: #8994a4; font-size: .64rem }
.kpi-card > b { display: none }
.kpi-icon { position: absolute; top: 20px; left: 18px; width: 46px; height: 46px; border-radius: 12px; font-size: 1rem; }
.kpi-card--purple .kpi-icon { color: #6367df; background: #e9eaff }
.kpi-card--blue .kpi-icon { color: #3f83e8; background: #e3efff }
.kpi-card--green .kpi-icon { color: #26a976; background: #dcf8eb }
.kpi-card--orange .kpi-icon { color: #e06569; background: #ffe8ea }
.kpi-card--purple strong { color: #6267dc }
.kpi-card--blue strong { color: #4083e6 }
.kpi-card--green strong { color: #27a978 }
.kpi-card--orange strong { color: #dc5d62 }
.dashboard-grid { gap: .9rem }
.dashboard-panel, .quick-actions { padding: 1.15rem 1.2rem }
.panel-head h2 { font-size: .86rem }
.panel-head p { color: #8b96a6; font-size: .67rem }
.panel-head > a { color: #4e78d9; font-size: .7rem; font-weight: 700 }
.sales-chart { border-bottom-color: #e8ecf2 }
.chart-column > span { background: linear-gradient(180deg,#5e6dea,#4c8ce9) }
.quick-actions > div:last-child a { min-height: 48px; border-color: #e6eaf0; font-size: .72rem }
.quick-actions > div:last-child span { color: #477dde; background: #e8f0ff }

@media(max-width:1080px) {
    .admin-body { --admin-sidebar-width: 0px }
    .admin-topbar { right: 0 }
    .admin-workspace, .admin-footer { margin-right: 0 }
    .admin-mobile-toggle { display: grid; place-items: center; width: 39px; height: 39px; padding: 0; color: #405575; background: #f3f6fa; border: 1px solid #e5eaf1; border-radius: 10px; font-size: 1.05rem; cursor: pointer; }
    .admin-nav { position: fixed; right: 0; width: min(310px,88vw); height: 100dvh; min-height: 0; max-height: none; overflow-y: auto; transform: translateX(105%); box-shadow: -18px 0 50px rgba(14,24,39,.22); transition: transform .24s ease; }
    .admin-nav.is-open { transform: translateX(0) }
    .admin-nav__close { position: absolute; z-index: 2; top: 18px; left: 13px; display: grid; place-items: center; width: 31px; height: 31px; padding: 0; color: #d9e2ef; background: #2a3a55; border: 1px solid rgba(255,255,255,.07); border-radius: 8px; font-size: 1.1rem; cursor: pointer; }
    .admin-menu-open { overflow: hidden }
    .admin-menu-open .admin-nav-backdrop { visibility: visible; opacity: 1; pointer-events: auto }
}

@media(max-width:720px) {
    .admin-topbar { height: 62px; padding: 0 12px }
    .admin-workspace { padding-top: 62px }
    .admin-topbar__context > div > b { max-width: 200px; font-size: .8rem }
    .admin-environment { display: none }
    .admin-top-actions { gap: .45rem }
    .admin-top-actions > a, .admin-user { display: none }
    .admin-top-actions form button { padding: .45rem .6rem }
    .admin-main { padding: 18px 12px 42px }
    .dashboard-welcome { align-items: flex-start; gap: .75rem; flex-direction: column }
    .dashboard-date { width: 100%; min-width: 0 }
    .kpi-card { min-height: 118px }
}

@media(max-width:520px) {
    .admin-topbar__context > div > b { max-width: 145px }
    .kpi-grid { grid-template-columns: 1fr }
    .dashboard-panel, .quick-actions, .admin-card { border-radius: 13px }
    .quick-actions > div:last-child { grid-template-columns: 1fr 1fr }
}

@media(prefers-reduced-motion:reduce) {
    .admin-nav, .admin-nav-backdrop, .kpi-card { transition: none }
}

/* Bidirectional menu/module assignment */
.grid-action--menus { color: #3978df !important; background: #eaf2ff !important }
.grid-action--menus.has-assignments { color: #147956 !important; background: #dff7ec !important }
.module-menu-action { padding: 0; color: #3978df; background: transparent; border: 0; font: inherit; font-size: .7rem; font-weight: 750; cursor: pointer }
.module-menu-action:hover { color: #245fbf }
.menu-assignment-dialog { width: min(780px,calc(100% - 24px)); max-height: min(820px,calc(100dvh - 28px)); overflow: hidden; border-radius: 18px }
.menu-assignment-dialog .admin-dialog__box { display: flex; max-height: min(820px,calc(100dvh - 28px)); padding: 0; flex-direction: column }
.menu-assignment-dialog .admin-dialog__head { flex: 0 0 auto; margin: 0; padding: 20px 22px 16px; border-bottom: 1px solid #e9edf2; background: linear-gradient(90deg,#fbfcff,#fff) }
.menu-assignment-dialog .admin-dialog__head > div { display: grid }
.menu-assignment-dialog .admin-dialog__head span { color: #4c79d6; font-size: .65rem; font-weight: 800 }
.menu-assignment-dialog .admin-dialog__head h2 { margin: .1rem 0; font-size: 1.05rem }
.menu-assignment-dialog .admin-dialog__head p { margin: 0; color: #7d8899; font-size: .7rem }
.menu-assignment-status { flex: 0 0 auto; margin: 14px 18px 0; padding: .7rem .8rem; color: #5d6b80; background: #f5f7fa; border: 1px solid #e7ebf1; border-radius: 10px; font-size: .72rem }
.menu-assignment-status.is-error { color: #a92f49; background: #fff1f4; border-color: #f2d7de }
.menu-assignment-status.is-success { color: #157151; background: #e8f8f1; border-color: #d2eee2 }
.menu-assignment-tree { flex: 1; min-height: 270px; padding: 14px 18px 18px; overflow: auto }
.menu-assignment-menu { margin-bottom: .65rem; border: 1px solid #e4e9f0; border-radius: 12px; background: #fff; overflow: hidden }
.menu-assignment-menu > summary { display: flex; align-items: center; justify-content: space-between; min-height: 45px; padding: .65rem .8rem; list-style: none; background: #f8fafc; cursor: pointer }
.menu-assignment-menu > summary::-webkit-details-marker { display: none }
.menu-assignment-menu > summary b { font-size: .78rem }
.menu-assignment-menu > summary span { color: #8893a4; font-size: .62rem }
.menu-assignment-menu > ul, .menu-assignment-node ul { margin: 0; padding: 6px 20px 6px 6px; list-style: none }
.menu-assignment-node { position: relative }
.menu-assignment-node ul { margin-right: 12px; border-right: 1px dashed #d8dfE9 }
.menu-assignment-node__row { display: flex; align-items: center; justify-content: space-between; gap: .6rem; min-height: 38px; padding: .25rem .35rem; border-radius: 8px }
.menu-assignment-node__row:hover { background: #f8faff }
.menu-assignment-node__row label { display: flex; align-items: center; gap: .5rem; min-width: 0; cursor: pointer }
.menu-assignment-node__row input { position: absolute; opacity: 0; pointer-events: none }
.menu-assignment-check { display: grid; place-items: center; width: 21px; height: 21px; flex: 0 0 21px; color: transparent; background: #fff; border: 1px solid #cfd7e3; border-radius: 6px; font-size: .7rem; transition: .15s }
.menu-assignment-node__row input:checked + .menu-assignment-check { color: #fff; background: #557de4; border-color: #557de4; box-shadow: 0 4px 10px rgba(65,103,210,.2) }
.menu-assignment-node__row label b, .menu-assignment-branch { overflow: hidden; color: #344157; font-size: .73rem; font-weight: 650; text-overflow: ellipsis; white-space: nowrap }
.menu-assignment-branch:before { content: "⌞"; margin-left: .35rem; color: #9aa5b5 }
.menu-assignment-node__row > small { flex: 0 0 auto; padding: .12rem .38rem; color: #8a95a5; background: #f1f4f8; border-radius: 12px; font-size: .55rem }
.menu-assignment-node.is-inactive { opacity: .6 }
.menu-assignment-actions { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 1rem !important; flex: 0 0 auto !important; width: 100% !important; min-height: 68px !important; margin: 0 !important; padding: 12px 20px !important; background: #fff !important; border: 0 !important; border-top: 1px solid #e8ecf2 !important; box-shadow: 0 -8px 20px rgba(30,45,70,.025) !important }
.menu-assignment-actions > span { color: #6f7b8e; font-size: .7rem }
.menu-assignment-actions > span b { color: #4d71d2; font-size: .85rem }
.menu-assignment-actions > div { display: flex; gap: .55rem }
.menu-assignment-actions .btn { min-width: 100px; min-height: 40px; padding: .55rem .85rem }
.menu-assignment-token { display: none !important }
.menu-record-manager { padding: 0; overflow: hidden }
.menu-record-manager > header { display: flex; align-items: end; justify-content: space-between; gap: 1rem; padding: 1rem 1.15rem; border-bottom: 1px solid #e9edf2; background: #fbfcfe }
.menu-record-manager > header h2 { margin: 0; font-size: .9rem }
.menu-record-manager > header p { margin: .1rem 0; color: #7e8999; font-size: .68rem }
.menu-record-search { width: min(330px,100%) }
.menu-record-search > span { display: block; margin-bottom: .25rem; font-size: .68rem !important }
.menu-record-search input { width: 100%; height: 40px; padding: .5rem .7rem; border: 1px solid #dfe5ed; border-radius: 9px; background: #fff; outline: none }
.menu-record-search input:focus { border-color: #6684d8; box-shadow: 0 0 0 3px rgba(82,117,211,.09) }
.menu-record-options { display: grid; grid-template-columns: 1fr 1fr; gap: .65rem; max-height: 590px; padding: 1rem; overflow: auto }
.menu-record-option { display: grid; grid-template-columns: 24px minmax(0,1fr) auto; align-items: center; gap: .65rem; min-height: 72px; padding: .7rem .75rem; border: 1px solid #e4e9f0; border-radius: 11px; background: #fff; cursor: pointer; transition: .15s }
.menu-record-option:hover { border-color: #bac9e4; background: #fbfcff }
.menu-record-option > input { position: absolute; opacity: 0; pointer-events: none }
.menu-record-check { display: grid; place-items: center; width: 23px; height: 23px; color: transparent; background: #fff; border: 1px solid #ccd5e1; border-radius: 6px; font-size: .72rem }
.menu-record-option > input:checked + .menu-record-check { color: #fff; background: #557de4; border-color: #557de4 }
.menu-record-option > span:nth-of-type(2) { display: grid; min-width: 0 }
.menu-record-option b { overflow: hidden; font-size: .75rem; text-overflow: ellipsis; white-space: nowrap }
.menu-record-option small { overflow: hidden; color: #818c9c; font-size: .62rem; text-overflow: ellipsis; white-space: nowrap }
.menu-record-option em { padding: .12rem .42rem; color: #9b5360; background: #fff0f3; border-radius: 14px; font-size: .57rem; font-style: normal }
.menu-record-option em.is-active { color: #177254; background: #e3f7ed }
.menu-record-actions { display: flex !important; align-items: center !important; justify-content: space-between !important; min-height: 70px !important; margin: 0 !important; padding: 12px 18px !important; background: #fafbfd !important; border: 0 !important; border-top: 1px solid #e7ebf1 !important }
.menu-record-actions > span { color: #6f7b8d; font-size: .72rem }
.menu-record-actions > span b { color: #4b72d3; font-size: .9rem }
.menu-record-guidance { display: grid; gap: .15rem; padding: .75rem .85rem; color: #365b9c; background: #eef4ff; border: 1px solid #dce8fb; border-radius: 10px }
.menu-record-guidance b { font-size: .74rem }
.menu-record-guidance small { color: #667b9e; font-size: .64rem }
.menu-linked-module { margin: 2rem 0 }
.menu-linked-module > h2 { margin-bottom: 1rem; font-size: 1.15rem }

@media(max-width:700px) {
    .menu-assignment-dialog { width: calc(100% - 16px); max-height: calc(100dvh - 16px) }
    .menu-assignment-dialog .admin-dialog__box { max-height: calc(100dvh - 16px) }
    .menu-assignment-actions { align-items: stretch !important; flex-direction: column !important }
    .menu-assignment-actions > div { display: grid; grid-template-columns: 1fr 1fr }
    .menu-record-manager > header { align-items: stretch; flex-direction: column }
    .menu-record-search { width: 100% }
    .menu-record-options { grid-template-columns: 1fr }
    .menu-record-actions { align-items: stretch !important; gap: .65rem; flex-direction: column !important }
    .menu-record-actions .btn { width: 100% }
}

/* Phrase management grid */
.phrase-total-badge { align-self: center; padding: .42rem .75rem; color: #52647f; background: #fff; border: 1px solid #e1e6ed; border-radius: 20px; font-size: .72rem; font-weight: 750 }
.phrase-grid-layout { grid-template-columns: minmax(0,1fr) 340px; align-items: start }
.phrase-grid-card { padding: 0; overflow: hidden }
.phrase-grid-filter { grid-template-columns: auto minmax(230px,1fr) auto auto auto; margin: 0; padding: 1rem; border-bottom: 1px solid #e8ecf1; background: #fafbfd }
.phrase-grid-filter .btn { min-height: 41px }
.phrase-grid-summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .75rem 1rem; color: #5f6c7f; border-bottom: 1px solid #edf0f4; font-size: .72rem }
.phrase-grid-summary small { color: #8a94a3; font-size: .67rem }
.phrase-table { min-width: 920px }
.phrase-table th { white-space: nowrap }
.phrase-table th, .phrase-table td { padding: .72rem .75rem; font-size: .73rem; vertical-align: middle }
.phrase-table th:first-child, .phrase-table td:first-child { width: 52px; color: #8a94a2; text-align: center }
.phrase-table th:last-child, .phrase-table td:last-child { width: 92px }
.phrase-table td:nth-child(2) { width: 220px }
.phrase-table td:nth-child(3) { width: 32% }
.phrase-table code { display: block; max-width: 220px; overflow: hidden; color: #5c4cb0; font-size: .7rem; text-overflow: ellipsis; white-space: nowrap }
.phrase-value-cell { display: -webkit-box; max-width: 480px; overflow: hidden; line-height: 1.8; -webkit-box-orient: vertical; -webkit-line-clamp: 2 }
.phrase-description-cell { display: -webkit-box; max-width: 290px; overflow: hidden; color: #6e7989; line-height: 1.75; -webkit-box-orient: vertical; -webkit-line-clamp: 2 }
.phrase-table td > small { color: #7d8897; font-size: .65rem; white-space: nowrap }
.phrase-table tr.is-editing td { background: #f1f5ff }
.phrase-table tr.is-editing td:first-child { box-shadow: inset -3px 0 #5d7bd8 }
.phrase-pagination { padding: 1rem; border-top: 1px solid #edf0f4 }
.phrase-pagination > span { display: grid; place-items: center; min-width: 28px; color: #98a1ae }
.phrase-form-head { margin-bottom: 1rem; padding-bottom: .9rem; border-bottom: 1px solid #e8ecf1 }
.phrase-form-head > span { color: #607fd6; font-size: .64rem; font-weight: 800 }
.phrase-form-head h2 { margin: .15rem 0 !important; font-size: 1rem !important }
.phrase-form-head p { margin: .2rem 0 0; color: #7d8897; font-size: .67rem; line-height: 1.8 }
.phrase-create .admin-form textarea { resize: vertical }
.phrase-form-actions { display: flex; align-items: center; gap: .55rem }
.phrase-form-actions .btn { flex: 1 }

@media(max-width:1000px) {
    .phrase-grid-layout { grid-template-columns: 1fr }
    .phrase-grid-layout > .phrase-create { order: -1 }
}

@media(max-width:700px) {
    .phrase-total-badge { display: none }
    .phrase-grid-filter { grid-template-columns: 1fr }
    .phrase-grid-summary { align-items: flex-start; flex-direction: column }
    .phrase-create { padding: 1rem }
}

/* Tag management grid */
.tag-grid-layout { grid-template-columns: minmax(0,1fr) 340px; align-items: start }
.tag-grid-card { padding: 0; overflow: hidden }
.tag-grid-filter { display: grid; grid-template-columns: auto minmax(230px,1fr) auto auto auto; gap: .7rem; margin: 0; padding: 1rem; background: #fafbfd; border-bottom: 1px solid #e8ecf1 }
.tag-grid-filter input, .tag-grid-filter select { min-width: 0; padding: .7rem .8rem; background: #fff; border: 1px solid var(--line); border-radius: 10px }
.tag-grid-filter .btn { min-height: 41px }
.tag-table { min-width: 1050px }
.tag-table th, .tag-table td { padding: .72rem .7rem; font-size: .73rem; vertical-align: middle }
.tag-table th:first-child, .tag-table td:first-child { width: 50px; color: #8b95a3; text-align: center }
.tag-table th:last-child, .tag-table td:last-child { width: 132px }
.tag-table td:nth-child(2) { width: 175px }
.tag-table td:nth-child(3) { width: 175px }
.tag-table td:nth-child(4) { width: 28% }
.tag-table code { display: block; max-width: 175px; overflow: hidden; color: #5d4db0; font-size: .7rem; text-overflow: ellipsis; white-space: nowrap }
.tag-name-cell { display: block; max-width: 180px; overflow: hidden; color: #3e495a; font-size: .76rem; text-overflow: ellipsis; white-space: nowrap }
.tag-description-cell { display: -webkit-box; max-width: 360px; overflow: hidden; color: #707b8a; line-height: 1.75; -webkit-box-orient: vertical; -webkit-line-clamp: 2 }
.tag-count-badge { display: inline-flex; padding: .22rem .5rem; color: #526eb6; background: #edf2ff; border-radius: 20px; font-size: .64rem; white-space: nowrap }
.tag-table td > small { color: #7e8998; font-size: .65rem; white-space: nowrap }
.tag-table tr.is-editing td { background: #f1f5ff }
.tag-table tr.is-editing td:first-child { box-shadow: inset -3px 0 #5e7bd8 }
.tag-table tr.is-assigning td { background: #edf9f4 }
.tag-table tr.is-assigning td:first-child { box-shadow: inset -3px 0 #2c9b72 }
.tag-table tr.is-editing.is-assigning td { background: linear-gradient(90deg,#f1f5ff,#edf9f4) }
.tag-assignment-panel { overflow: visible }
.tag-selected-label { display: flex; min-height: 42px; padding: .45rem .65rem; justify-content: center; flex-direction: column; background: #f0f5ff; border: 1px solid #dce6fa; border-radius: 10px }
.tag-selected-label small { color: #7c899c; font-size: .58rem }
.tag-selected-label strong { color: #4868b2; font-size: .72rem }
.tag-assignment-guidance { display: flex; align-items: center; gap: .75rem; padding: 1rem; color: #506077; background: #f8fafc; border: 1px dashed #d9e0e9; border-radius: 12px }
.tag-assignment-guidance > span { display: grid; place-items: center; width: 38px; height: 38px; color: #5877ca; background: #eaf0ff; border-radius: 11px; font-size: 1.2rem }
.tag-assignment-guidance > div { display: grid }
.tag-assignment-guidance b { font-size: .75rem }
.tag-assignment-guidance small { color: #7e8998; font-size: .65rem }

@media(max-width:1000px) {
    .tag-grid-layout { grid-template-columns: 1fr }
    .tag-grid-layout > .tag-create-card { order: -1 }
}

@media(max-width:700px) {
    .tag-grid-filter, .tag-assignment-form { grid-template-columns: 1fr }
    .tag-create-card { padding: 1rem }
    .tag-assignment-panel .order-section-head { align-items: flex-start; gap: .75rem; flex-direction: column }
}

/* WordPress-style sitemap administration */
.sitemap-kpi-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; margin-bottom: 1rem }
.sitemap-kpi-grid > div { display: grid; gap: .2rem; min-height: 112px }
.sitemap-kpi-grid span { color: #788395; font-size: .7rem }
.sitemap-kpi-grid strong { color: #29364c; font-size: 1.4rem; line-height: 1.55 }
.sitemap-kpi-grid > div:nth-child(3) strong { font-size: .86rem }
.sitemap-kpi-grid small { margin-top: auto; color: #9099a7; font-size: .62rem }
.sitemap-admin-layout { display: grid; grid-template-columns: minmax(0,1fr) 320px; gap: 1rem; align-items: start }
.sitemap-files-card { padding: 0; overflow: hidden }
.sitemap-files-card > .order-section-head { padding: 1rem 1.1rem; border-bottom: 1px solid #e8ecf1 }
.sitemap-files-card > .table-scroll { border-radius: 0 }
.sitemap-files-table { min-width: 820px }
.sitemap-files-table th, .sitemap-files-table td { padding: .75rem; font-size: .72rem }
.sitemap-files-table code { color: #536db0; font-size: .68rem }
.sitemap-files-table tr.is-empty { opacity: .55 }
.sitemap-rebuild-card { position: sticky; top: 84px; text-align: center }
.sitemap-rebuild-icon { display: grid; place-items: center; width: 52px; height: 52px; margin: 0 auto .75rem; color: #fff; background: linear-gradient(135deg,#5877d4,#7958bd); border-radius: 15px; font-size: 1.6rem; box-shadow: 0 8px 18px rgba(80,91,180,.2) }
.sitemap-rebuild-card h2 { margin: .25rem 0; font-size: 1rem }
.sitemap-rebuild-card p { color: #758093; font-size: .68rem; line-height: 1.9; text-align: right }
.sitemap-rebuild-card form { margin-top: 1rem }
.sitemap-rebuild-card .btn { width: 100%; min-height: 42px }
.sitemap-modern-guide { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .75rem; margin-top: 1rem }
.sitemap-modern-guide > h2 { grid-column: 1/-1; margin: 0 0 .25rem; font-size: .95rem }
.sitemap-modern-guide > div { display: flex; align-items: flex-start; gap: .7rem; padding: .8rem; background: #f8fafc; border: 1px solid #e8ecf2; border-radius: 11px }
.sitemap-modern-guide > div > span { display: grid; place-items: center; width: 29px; height: 29px; flex: 0 0 29px; color: #5773c3; background: #eaf0ff; border-radius: 8px; font-size: .68rem; font-weight: 800 }
.sitemap-modern-guide p { margin: 0; color: #5f6c7e; font-size: .69rem; line-height: 1.9 }

@media(max-width:1000px) {
    .sitemap-admin-layout { grid-template-columns: 1fr }
    .sitemap-rebuild-card { position: static }
}

@media(max-width:700px) {
    .sitemap-kpi-grid, .sitemap-modern-guide { grid-template-columns: 1fr }
    .sitemap-modern-guide > h2 { grid-column: auto }
}

/* Home hero refinement and product search autocomplete */
.site-header { overflow: visible }
.hero { margin-top: 14px; padding-top: 56px; align-items: start }
.hero__copy { position: relative; z-index: 4; transform: translateY(-14px) }
.hero > .hero__copy > .eyebrow { margin-bottom: .75rem; padding: .45rem .9rem; font-size: .78rem; letter-spacing: .08em }
.hero h1 { font-size: 2rem; line-height: 1.16 }
.hero__art { transform: translateY(-44px) }
.hero-pencil { top: 16% }
.hero-book { bottom: 29% }
.hero-star { top: 31% }
.hero-search { position: relative; display: grid; grid-template-columns: 145px minmax(0,1fr); grid-template-areas: "button field"; gap: 4px; overflow: visible; direction: ltr }
.hero-search__field { position: relative; grid-area: field; min-width: 0; direction: rtl }
.hero-search input { width: 100%; height: 58px; border-radius: 0 999px 999px 0; text-align: right }
.hero-search button { grid-area: button; height: 58px; min-width: 0; border-radius: 999px 0 0 999px; direction: rtl }
.header-search__field { position: relative; flex: 1; min-width: 0 }
.header-search__field input { width: 100% }
.product-search-suggestions { position: absolute; top: calc(100% + 10px); right: 0; left: 0; z-index: 150; display: grid; max-height: 380px; padding: .45rem; overflow-y: auto; direction: rtl; background: rgba(255,255,255,.98); border: 1px solid rgba(77,57,107,.12); border-radius: 20px; box-shadow: 0 22px 55px rgba(63,37,91,.18); backdrop-filter: blur(16px) }
.product-search-suggestions[hidden] { display: none }
.product-search-suggestion { display: grid; grid-template-columns: 52px minmax(0,1fr) 28px; align-items: center; gap: .8rem; padding: .6rem; color: var(--ink); border-radius: 14px; text-align: right; transition: background-color .15s ease,transform .15s ease }
.product-search-suggestion:hover, .product-search-suggestion.is-active { color: var(--ink); background: linear-gradient(135deg,#fff1f7,#f4efff); transform: translateX(-2px) }
.product-search-suggestion__media { display: grid; place-items: center; width: 52px; height: 52px; overflow: hidden; background: #fff5f8; border: 1px solid rgba(92,64,118,.08); border-radius: 13px }
.product-search-suggestion__media img { width: 100%; height: 100%; object-fit: cover }
.product-search-suggestion__media.is-placeholder { color: var(--pink); font-size: 1.25rem }
.product-search-suggestion__copy { display: grid; gap: .18rem; min-width: 0 }
.product-search-suggestion__copy strong { overflow: hidden; font-size: .88rem; text-overflow: ellipsis; white-space: nowrap }
.product-search-suggestion__copy small { overflow: hidden; color: #82798a; font-size: .7rem; text-overflow: ellipsis; white-space: nowrap }
.product-search-suggestion__arrow { display: grid; place-items: center; width: 28px; height: 28px; color: #9a52ac; background: #fff; border-radius: 9px; font-size: .9rem }
.product-search-suggestions__state { padding: 1.1rem; color: #716979; font-size: .78rem; text-align: center }
.product-search-suggestions__state.is-loading:before { content: ""; display: inline-block; width: 14px; height: 14px; margin-left: .5rem; vertical-align: -2px; border: 2px solid #eadcf2; border-top-color: var(--pink); border-radius: 50%; animation: productSearchSpin .7s linear infinite }
.product-search-suggestions__state.is-error { color: #b64c62 }
.product-search-suggestions--header { top: calc(100% + 14px); right: -10px; left: auto; width: min(390px,calc(100vw - 32px)) }

@keyframes productSearchSpin {
    to { transform: rotate(360deg) }
}

@media(max-width:900px) {
    .hero__copy { transform: none }
    .hero__art { transform: translateY(-24px) }
}

@media(max-width:700px) {
    .hero { margin-top: 10px; padding-top: 42px }
    .hero > .hero__copy > .eyebrow { font-size: .72rem }
    .hero h1 { font-size: clamp(2rem,9vw,2.8rem) }
    .hero-search { grid-template-columns: 108px minmax(0,1fr) }
    .hero-search input, .hero-search button { height: 54px }
    .hero-search input { padding: .85rem 1rem; font-size: .88rem }
    .hero-search button { padding: .75rem; font-size: .9rem }
    .product-search-suggestions { right: 0; left: auto; width: min(440px,calc(100vw - 40px)) }
    .product-search-suggestion { grid-template-columns: 46px minmax(0,1fr) 26px; gap: .6rem }
    .product-search-suggestion__media { width: 46px; height: 46px }
}

/* Homepage popular category artwork */
.category-card { position: relative; min-height: 238px; align-items: flex-start; overflow: hidden }
.category-card:before { content: ""; position: absolute; top: -54px; left: -48px; width: 150px; height: 150px; background: radial-gradient(circle,rgba(255,180,215,.22),rgba(166,134,230,.08) 52%,transparent 72%); border-radius: 50%; pointer-events: none }
.category-card .category-card__icon { position: relative; display: grid; place-items: center; width: 112px; height: 112px; margin: -.45rem 0 .8rem; padding: .25rem; overflow: hidden; background: linear-gradient(145deg,#fff6fb,#f6f0ff); border: 1px solid rgba(132,91,169,.1); border-radius: 28px; box-shadow: 0 14px 32px rgba(104,73,139,.1) }
.category-card__icon img { display: block; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 10px 10px rgba(72,42,94,.12)); transition: transform .25s ease }
.category-card:hover .category-card__icon img { transform: translateY(-3px) scale(1.06) rotate(-2deg) }
.category-card .category-card__icon--fallback { color: var(--pink); font-size: 2rem }
.category-card strong { position: relative; margin-bottom: .25rem }
.category-card small { position: relative; line-height: 1.8 }

@media(max-width:500px) {
    .category-card { min-height: 205px; padding: 1.35rem }
    .category-card .category-card__icon { width: 94px; height: 94px; border-radius: 24px }
}

/* ═══════════════════════════════════════════════════════
   CAROUSEL
═══════════════════════════════════════════════════════ */
.carousel { position: relative; display: flex; align-items: center; gap: .5rem }
.carousel__track-wrap { flex: 1; overflow: hidden; border-radius: 18px }
.carousel__track { display: flex; gap: 1.25rem; transition: transform .38s cubic-bezier(.4,0,.2,1); will-change: transform; cursor: grab }
.carousel__track:active { cursor: grabbing }
.carousel__item { flex: 0 0 calc(33.333% - .84rem); min-width: 0 }
.carousel__btn { flex-shrink: 0; width: 44px; height: 44px; border-radius: 50%; border: 1.5px solid var(--line); background: #fff; color: var(--ink); font-size: 1.5rem; line-height: 1; cursor: pointer; display: grid; place-items: center; transition: background .16s,border-color .16s,transform .16s,box-shadow .16s; box-shadow: 0 4px 14px rgba(65,43,87,.08); z-index: 2 }
.carousel__btn:hover:not(:disabled) { background: var(--purple); color: #fff; border-color: var(--purple); transform: scale(1.08); box-shadow: 0 8px 22px rgba(121,87,200,.22) }
.carousel__btn:disabled { opacity: .3; cursor: not-allowed }
.carousel__dots { display: flex; justify-content: center; gap: .5rem; margin-top: 1.25rem }
.carousel__dot { width: 8px; height: 8px; border-radius: 50%; border: none; background: var(--line); cursor: pointer; padding: 0; transition: background .18s,transform .18s,width .22s }
.carousel__dot.is-active { background: var(--purple); width: 22px; border-radius: 4px }

/* article carousel — wider items */
.carousel--articles .carousel__item { flex: 0 0 calc(33.333% - .84rem) }

@media(max-width:900px) {
    .carousel__item { flex: 0 0 calc(50% - .63rem) }
    .carousel--articles .carousel__item { flex: 0 0 calc(50% - .63rem) }
}

@media(max-width:580px) {
    .carousel__item { flex: 0 0 calc(100%) }
    .carousel--articles .carousel__item { flex: 0 0 calc(100%) }
    .carousel__btn { width: 36px; height: 36px; font-size: 1.2rem }
}

/* price formatted input */
.price-formatted-input { width: 100%; border: 1px solid var(--line); border-radius: 10px; padding: .72rem .8rem; background: #fdfbfe; outline: 0; font: inherit; letter-spacing: .04em }
.price-formatted-input:focus { border-color: var(--purple); box-shadow: 0 0 0 3px rgba(121,87,200,.08) }

/* about tile icons */
.about-tiles strong { display: flex; align-items: center; gap: .55rem }
.about-tile-icon { flex-shrink: 0; width: 32px; height: 32px; border-radius: 10px; background: linear-gradient(135deg,rgba(121,87,200,.12),rgba(161,92,242,.10)); display: inline-flex; align-items: center; justify-content: center; color: var(--purple) }
.about-tile-icon--gold { background: linear-gradient(135deg,rgba(255,214,107,.22),rgba(255,180,50,.12)); color: #c08a00 }
.about-tile-icon--mint { background: linear-gradient(135deg,rgba(156,224,195,.25),rgba(47,167,124,.12)); color: #1a8a5a }
.about-tile-icon svg { width: 16px; height: 16px }

.copyright { text-align: center; background: #f2eaf4; border-top: 1px solid #ded2e2; padding: 1rem; color: var(--muted); font-size: .75rem }

/* Admin sidebar vertical scrolling fix */
.admin-nav {
    height: 100vh;
    height: 100dvh;
    max-height: 100dvh;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch;
}

/* Prevent opened menu groups from shrinking inside the flex sidebar. */
.admin-nav > .admin-nav__brand,
.admin-nav > .admin-nav__section {
    flex: 0 0 auto;
}

@media (max-width: 1080px) {
    .admin-nav {
        height: 100vh;
        height: 100dvh;
        max-height: 100dvh;
        overflow-y: auto;
    }
}

/* Admin sidebar typography: one step larger for better readability */
.admin-nav__brand {
    font-size: 1.06rem;
}

.admin-nav__section > summary b {
    font-size: .9rem;
    line-height: 1.6;
}

.admin-nav__section > summary small {
    font-size: .78rem;
    line-height: 1.55;
}

.admin-nav__links > a {
    font-size: .88rem;
    line-height: 1.65;
}

.admin-nav__links > a > span {
    font-size: .86rem;
}

/* Align all admin sidebar submenu items from the right */
.admin-nav__links {
    align-items: stretch;
}

.admin-nav__links > a {
    width: 100%;
    justify-content: flex-start;
    text-align: right;
    direction: rtl;
}

.admin-nav__links > a > span {
    flex: 0 0 22px;
    width: 22px;
    min-width: 22px;
    margin: 0;
}


/* =========================================================
   Two-row public header
   Row 1: logo + actions
   Row 2: centered dynamic menu (the only sticky row)
   ========================================================= */

.site-header {
    position: relative;
    top: auto;
    z-index: 121;
    display: block;
    width: min(100%, 1240px);
    max-width: calc(100% - 16px);
    margin: 0 auto;
    padding: 0;
    overflow: visible;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    backdrop-filter: none;
}

.site-header__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem;
    min-height: 92px;
    padding: 14px 24px;
    background: rgba(255, 250, 243, .94);
    border: 1px solid rgba(41, 35, 60, .06);
    border-bottom: 0;
    border-radius: 0;
    box-shadow: 0 8px 24px rgba(65, 43, 87, .04);
    backdrop-filter: blur(14px);
}

.site-header__top .logo {
    flex: 0 0 auto;
}

.site-header__top .header-actions {
    width: auto;
    margin-right: auto;
    flex: 0 1 auto;
    justify-content: flex-end;
    flex-wrap: nowrap;
}

.site-menu-bar {
    position: sticky;
    top: 0;
    z-index: 120;
    width: 100%;
    background: rgba(255, 250, 243, .96);
    border-top: 1px solid rgba(41, 35, 60, .06);
    border-bottom: 1px solid rgba(41, 35, 60, .08);
    box-shadow: 0 10px 28px rgba(65, 43, 87, .07);
    backdrop-filter: blur(14px);
}

.site-menu-bar__inner {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: min(100%, 1240px);
    min-height: 58px;
    margin: 0 auto;
    padding: 0 24px;
}

.site-menu-bar .dynamic-menu {
    display: flex;
    flex: 0 1 auto;
    align-items: center;
    justify-content: center;
    gap: clamp(.8rem, 1.6vw, 1.7rem);
    width: auto;
    max-width: 100%;
    margin: 0 auto;
}

.site-menu-bar .dynamic-menu__item {
    flex: 0 0 auto;
}

.site-menu-bar .dynamic-menu__item > a {
    padding: 1rem 0;
    font-size: clamp(.78rem, .82vw, .9rem);
    white-space: nowrap;
}

.site-menu-bar .menu-toggle {
    display: none;
}

/* Keep wide dropdowns inside the viewport near page edges. */
.site-menu-bar .dynamic-menu__item:last-child .menu-panel,
.site-menu-bar .dynamic-menu__item:nth-last-child(2) .menu-panel {
    right: auto;
    left: -20px;
}

@media (max-width: 1100px) and (min-width: 1001px) {
    .site-menu-bar__inner {
        padding-inline: 14px;
    }

    .site-menu-bar .dynamic-menu {
        gap: .75rem;
    }

    .site-menu-bar .dynamic-menu__item > a {
        font-size: .76rem;
    }
}

@media (max-width: 1000px) {
    .site-header {
        width: calc(100% - 12px);
        max-width: calc(100% - 12px);
    }

    .site-header__top {
        min-height: 76px;
        padding: 10px 14px;
        border-radius: 0;
    }

    .site-header__top .logo-image {
        width: 48px;
        height: 48px;
    }

    .site-header__top .header-actions {
        gap: .4rem;
        min-width: 0;
    }

    .site-header__top .header-actions a,
    .site-header__top .header-actions button {
        min-width: 40px;
        min-height: 40px;
        padding: .5rem;
        border-radius: 12px;
        font-size: .95rem;
    }

    .site-header__top .header-phone .phone-label {
        display: none;
    }

    .site-header__top .header-search-toggle {
        width: 40px;
        height: 40px;
        border-radius: 12px;
    }

    .site-menu-bar__inner {
        justify-content: flex-start;
        min-height: 52px;
        padding: 6px 12px;
    }

    .site-menu-bar .menu-toggle {
        display: inline-grid;
        place-items: center;
        width: 42px;
        height: 42px;
        margin-right: 0;
        margin-left: auto;
        padding: 0;
        border: 1px solid rgba(41, 35, 60, .08);
        border-radius: 12px;
        background: #fff;
        color: var(--ink);
        font-size: 1.35rem;
        cursor: pointer;
    }

    .site-menu-bar .dynamic-menu {
        position: absolute;
        top: calc(100% + 1px);
        right: 12px;
        left: 12px;
        display: none;
        width: auto;
        max-height: calc(100vh - 80px);
        margin: 0;
        padding: .65rem;
        overflow-x: hidden;
        overflow-y: auto;
        flex-direction: column;
        align-items: stretch;
        gap: .25rem;
        background: rgba(255, 255, 255, .98);
        border: 1px solid var(--line);
        border-radius: 0 0 18px 18px;
        box-shadow: 0 20px 45px rgba(65, 43, 87, .15);
    }

    .site-menu-bar.is-open .dynamic-menu {
        display: flex;
    }

    .site-menu-bar .dynamic-menu__item {
        width: 100%;
    }

    .site-menu-bar .dynamic-menu__item > a {
        justify-content: space-between;
        width: 100%;
        padding: .75rem .85rem;
        border-radius: 10px;
        font-size: .88rem;
    }

    .site-menu-bar .dynamic-menu__item > a:hover,
    .site-menu-bar .dynamic-menu__item > a:focus-visible {
        background: #f5efff;
        color: var(--purple);
    }

    .site-menu-bar .menu-panel,
    .site-menu-bar .dynamic-menu__item:last-child .menu-panel,
    .site-menu-bar .dynamic-menu__item:nth-last-child(2) .menu-panel {
        position: static;
        display: none;
        width: 100%;
        margin-top: .25rem;
        padding: .55rem;
        opacity: 1;
        visibility: visible;
        transform: none;
        box-shadow: none;
        border-radius: 12px;
    }

    .site-menu-bar .has-panel:hover > .menu-panel,
    .site-menu-bar .has-panel:focus-within > .menu-panel {
        display: block;
    }

    .site-menu-bar .menu-panel--products {
        width: 100%;
    }

    .site-menu-bar .menu-products {
        grid-template-columns: 1fr;
    }

    .site-menu-bar .header-search {
        width: min(300px, calc(100vw - 24px));
    }
}

@media (max-width: 560px) {
    .site-header__top {
        gap: .5rem;
        padding-inline: 10px;
    }

    .site-header__top .logo-image {
        width: 44px;
        height: 44px;
    }

    .site-header__top .header-actions {
        gap: .25rem;
    }

    .site-header__top .header-actions a,
    .site-header__top .header-actions button {
        min-width: 36px;
        min-height: 36px;
        padding: .4rem;
    }

    .site-header__top .header-search-toggle {
        width: 36px;
        height: 36px;
    }

    .site-header__top .header-search {
        position: fixed;
        top: 12px;
        right: 12px;
        left: 12px;
        width: auto;
    }

    .site-menu-bar__inner {
        padding-inline: 8px;
    }

    .site-menu-bar .dynamic-menu {
        right: 8px;
        left: 8px;
    }
}

/* =========================================================
   SINGLE-ROW HEADER OVERRIDE
   Logo right, menu beside it, three action icons left.
   ========================================================= */
.site-header.site-header--single {
    position: sticky;
    top: 0;
    z-index: 120;
    width: min(100%, 1240px);
    max-width: calc(100% - 16px);
    margin: 0 auto;
    padding: 0;
    overflow: visible;
    background: rgba(255, 250, 243, .96);
    backdrop-filter: blur(14px);
    border: 1px solid rgba(41, 35, 60, .06);
    border-top: 0;
    border-radius: 0 0 22px 22px;
    box-shadow: 0 10px 30px rgba(65, 43, 87, .06);
}

.site-header--single .site-header__inner {
    min-height: 72px;
    display: flex;
    align-items: center;
    gap: 1rem;
    width: 100%;
    padding: 7px 18px;
}

.site-header--single .logo {
    flex: 0 0 auto;
}

.site-header--single .logo-image {
    width: 54px;
    height: 54px;
}

.site-header--single .site-header__menu {
    min-width: 0;
    flex: 1 1 auto;
    display: flex;
    align-items: center;
}

.site-header--single .dynamic-menu {
    min-width: 0;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: clamp(.75rem, 1.25vw, 1.4rem);
    flex-wrap: nowrap;
}

.site-header--single .dynamic-menu__item {
    flex: 0 0 auto;
}

.site-header--single .dynamic-menu__item > a {
    padding: 1.35rem 0;
    font-size: 1rem;
    white-space: nowrap;
}

.site-header--single .header-actions {
    flex: 0 0 auto;
    margin-right: auto;
    display: flex;
    align-items: center;
    gap: .45rem;
    flex-wrap: nowrap;
}

.site-header--single .header-actions > a,
.site-header--single .header-actions > button,
.site-header--single .header-search-toggle,
.site-header--single .cart-link {
    min-width: 40px;
    min-height: 40px;
    width: 40px;
    height: 40px;
    padding: 0;
    border-radius: 12px;
}

.site-header--single .header-search {
    right: auto;
    left: 0;
}

.site-header--single .menu-toggle {
    display: none;
}

.site-header--single .dynamic-menu__item:last-child .menu-panel,
.site-header--single .dynamic-menu__item:nth-last-child(2) .menu-panel {
    right: auto;
    left: -20px;
}

@media (max-width: 1120px) and (min-width: 901px) {
    .site-header--single .site-header__inner {
        gap: .7rem;
        padding-inline: 12px;
    }

    .site-header--single .logo-image {
        width: 48px;
        height: 48px;
    }

    .site-header--single .dynamic-menu {
        gap: .65rem;
    }

    .site-header--single .dynamic-menu__item > a {
        font-size: .74rem;
    }
}

@media (max-width: 900px) {
    .site-header.site-header--single {
        width: calc(100% - 12px);
        max-width: calc(100% - 12px);
        border-radius: 0 0 18px 18px;
    }

    .site-header--single .site-header__inner {
        min-height: 62px;
        gap: .55rem;
        padding: 6px 10px;
        position: relative;
    }

    .site-header--single .logo-image {
        width: 46px;
        height: 46px;
    }

    .site-header--single .menu-toggle {
        display: inline-grid;
        place-items: center;
        flex: 0 0 40px;
        width: 40px;
        height: 40px;
        padding: 0;
        border: 1px solid rgba(41, 35, 60, .08);
        border-radius: 12px;
        background: #fff;
        color: var(--ink);
        font-size: 1.25rem;
        cursor: pointer;
    }

    .site-header--single .site-header__menu {
        position: static;
        flex: 0 0 auto;
        min-width: 0;
    }

    .site-header--single .dynamic-menu {
        position: absolute;
        top: calc(100% + 1px);
        right: 8px;
        left: 8px;
        display: none;
        width: auto;
        max-height: calc(100vh - 76px);
        padding: .65rem;
        overflow-y: auto;
        overflow-x: hidden;
        flex-direction: column;
        align-items: stretch;
        gap: .2rem;
        background: rgba(255, 255, 255, .99);
        border: 1px solid var(--line);
        border-radius: 0 0 16px 16px;
        box-shadow: 0 20px 45px rgba(65, 43, 87, .15);
    }

    .site-header--single.is-open .dynamic-menu {
        display: flex;
    }

    .site-header--single .dynamic-menu__item {
        width: 100%;
    }

    .site-header--single .dynamic-menu__item > a {
        width: 100%;
        justify-content: space-between;
        padding: .72rem .8rem;
        border-radius: 10px;
        font-size: .86rem;
    }

    .site-header--single .menu-panel,
    .site-header--single .dynamic-menu__item:last-child .menu-panel,
    .site-header--single .dynamic-menu__item:nth-last-child(2) .menu-panel {
        position: static;
        display: none;
        width: 100%;
        margin-top: .2rem;
        padding: .55rem;
        opacity: 1;
        visibility: visible;
        transform: none;
        box-shadow: none;
        border-radius: 12px;
    }

    .site-header--single .has-panel:hover > .menu-panel,
    .site-header--single .has-panel:focus-within > .menu-panel {
        display: block;
    }

    .site-header--single .menu-panel--products {
        width: 100%;
    }

    .site-header--single .menu-products {
        grid-template-columns: 1fr;
    }

    .site-header--single .header-actions {
        margin-right: auto;
        gap: .25rem;
    }

    .site-header--single .header-actions > a,
    .site-header--single .header-search-toggle,
    .site-header--single .cart-link {
        width: 38px;
        height: 38px;
        min-width: 38px;
        min-height: 38px;
    }
}

@media (max-width: 480px) {
    .site-header--single .site-header__inner {
        padding-inline: 7px;
        gap: .35rem;
    }

    .site-header--single .logo-image {
        width: 42px;
        height: 42px;
    }

    .site-header--single .menu-toggle,
    .site-header--single .header-actions > a,
    .site-header--single .header-search-toggle,
    .site-header--single .cart-link {
        width: 36px;
        height: 36px;
        min-width: 36px;
        min-height: 36px;
    }

    .site-header--single .header-search {
        position: fixed;
        top: 10px;
        right: 10px;
        left: 10px;
        width: auto;
    }
}


/* Refined header action icons */
.site-header--single .header-actions {
    padding: 3px;
    border: 1px solid rgba(121, 87, 200, .10);
    border-radius: 15px;
    background: rgba(255, 255, 255, .72);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9);
}

.site-header--single .header-action-icon,
.site-header--single .cart-link {
    position: relative;
    overflow: visible;
    border: 0;
    background: transparent;
    color: #514866;
    box-shadow: none;
    transition: color .18s ease, background .18s ease, transform .18s ease, box-shadow .18s ease;
}

.site-header--single .header-action-icon svg {
    width: 21px;
    height: 21px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.75;
    stroke-linecap: round;
    stroke-linejoin: round;
    pointer-events: none;
}

.site-header--single .header-action-icon:hover,
.site-header--single .header-action-icon:focus-visible,
.site-header--single .cart-link:hover,
.site-header--single .cart-link:focus-visible {
    color: var(--purple);
    background: linear-gradient(145deg, #fff, #f4edff);
    box-shadow: 0 8px 18px rgba(121, 87, 200, .13);
    transform: translateY(-1px);
    outline: none;
}

.site-header--single .header-action-icon--search:hover svg {
    transform: rotate(-5deg);
}

.site-header--single .header-action-icon--account:hover svg {
    transform: scale(1.04);
}

/* Replace the cart component's old visual with a clean custom basket icon. */
.site-header--single .cart-link {
    font-size: 0 !important;
}

.site-header--single .cart-link > :not(b) {
    opacity: 0;
    width: 0;
    height: 0;
    overflow: hidden;
}

.site-header--single .cart-link::before {
    content: "";
    width: 22px;
    height: 22px;
    display: block;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5h2l1.55 9.2a2 2 0 0 0 1.97 1.66h7.8a2 2 0 0 0 1.94-1.52L21 8H7'/%3E%3Cpath d='M9.5 10.5h8.5'/%3E%3Ccircle cx='10' cy='19' r='1.25'/%3E%3Ccircle cx='18' cy='19' r='1.25'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5h2l1.55 9.2a2 2 0 0 0 1.97 1.66h7.8a2 2 0 0 0 1.94-1.52L21 8H7'/%3E%3Cpath d='M9.5 10.5h8.5'/%3E%3Ccircle cx='10' cy='19' r='1.25'/%3E%3Ccircle cx='18' cy='19' r='1.25'/%3E%3C/svg%3E") center / contain no-repeat;
}

.site-header--single .cart-link b {
    right: -2px;
    top: -3px;
    min-width: 17px;
    width: auto;
    height: 17px;
    padding: 0 4px;
    line-height: 17px;
    font-size: .58rem;
    font-weight: 800;
    background: linear-gradient(135deg, var(--pink), #d84da9);
    border: 2px solid #fff;
    box-sizing: content-box;
    box-shadow: 0 4px 10px rgba(216, 77, 169, .24);
}

@media (max-width: 900px) {
    .site-header--single .header-actions {
        padding: 2px;
        border-radius: 13px;
    }

    .site-header--single .header-action-icon svg,
    .site-header--single .cart-link::before {
        width: 20px;
        height: 20px;
    }
}


/* Hero refresh: richer artwork, clickable phone box and SEO-friendly content layout */
.hero__facts { align-items: stretch }
.hero__fact {
    display: inline-flex;
    align-items: center;
    gap: .8rem;
    padding: .85rem 1.05rem;
    background: linear-gradient(135deg,#fff,#ffeafe);
    border-radius: 999px;
    box-shadow: 0 14px 40px rgba(121,87,200,.08);
    color: var(--ink);
    font-weight: 700;
    transition: transform .18s ease, box-shadow .18s ease;
}
.hero__fact:hover {
    transform: translateY(-2px);
    box-shadow: 0 18px 44px rgba(121,87,200,.13);
}
.hero__fact-icon {
    width: 42px;
    height: 42px;
    flex-shrink: 0;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: linear-gradient(135deg,#ff6f91,#a15cf2);
    color: #fff;
    box-shadow: 0 10px 24px rgba(125,91,239,.24);
}
.hero__fact-icon svg { width: 20px; height: 20px }
.hero__fact-copy {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .08rem;
    line-height: 1.35;
}
.hero__fact-copy small { color: var(--muted); font-size: .72rem; font-weight: 600 }
.hero__fact-copy strong { font-size: .95rem; color: var(--ink); direction: ltr }
.hero__art {
    height: 460px;
    display: grid;
    place-items: center;
    padding: 1.5rem;
}
.hero__art .blob--secondary {
    left: 8%;
    bottom: 10%;
    width: 200px;
    height: 200px;
    background: rgba(121,87,200,.14);
    border-radius: 50%;
    filter: blur(12px);
}
.hero-product {
    position: absolute;
    width: 210px;
    padding: 1rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .75rem;
    text-align: center;
    background: rgba(255,255,255,.8);
    border: 1px solid rgba(121,87,200,.1);
    border-radius: 28px;
    box-shadow: 0 20px 45px rgba(96,67,124,.12);
    backdrop-filter: blur(10px);
    animation: floatSoft 8s ease-in-out infinite;
}
.hero-product__icon {
    width: 128px;
    height: 128px;
    display: grid;
    place-items: center;
    border-radius: 28px;
    overflow: hidden;
}
.hero-product__icon svg { width: 100%; height: 100%; display: block }
.hero-product__label strong {
    display: block;
    font-size: 1rem;
    margin-bottom: .2rem;
}
.hero-product__label small {
    display: block;
    color: var(--muted);
    font-size: .78rem;
    line-height: 1.7;
}
.hero-product--notebook { top: 6%; left: 2%; transform: rotate(-5deg) }
.hero-product--hair { top: 44%; left: 28%; width: 190px; transform: rotate(-1deg); animation-delay: 1.1s }
.hero-product--pencil { top: 12%; right: 6%; transform: rotate(4deg); animation-delay: .45s }
.hero-product--notebook .hero-product__icon { background: linear-gradient(135deg,#fff4cf,#ffe3ef) }
.hero-product--hair .hero-product__icon { background: linear-gradient(135deg,#fff2f7,#f4edff) }
.hero-product--pencil .hero-product__icon { background: linear-gradient(135deg,#ffe9ec,#fff5d7) }

@media(max-width:1100px) {
    .hero { gap: 1rem; padding: 64px 5% 52px }
    .hero__art { height: 400px }
    .hero-product { width: 180px; padding: .85rem }
    .hero-product__icon { width: 108px; height: 108px }
    .hero-product--hair { left: 24%; top: 48% }
}

@media(max-width:800px) {
    .hero__art { height: 310px; transform: none; margin-top: 1rem }
    .hero-product { width: 155px; padding: .75rem; border-radius: 22px }
    .hero-product__icon { width: 90px; height: 90px }
    .hero-product__label strong { font-size: .9rem }
    .hero-product__label small { font-size: .72rem; line-height: 1.55 }
    .hero-product--notebook { left: 0; top: 7% }
    .hero-product--hair { left: 30%; top: 48% }
    .hero-product--pencil { right: 0; top: 13% }
    .hero__fact { width: auto }
}

@media(max-width:640px) {
    .hero h1 { font-size: 1.8rem }
    .hero p { font-size: .96rem }
    .hero__facts { gap: .8rem }
    .hero__fact {
        width: 100%;
        justify-content: center;
        border-radius: 22px;
    }
    .hero__fact-copy { align-items: center }
}


/* Hero cleanup: replace card-like artwork with clean graphic icons */
.hero {
    align-items: center;
}
.hero__copy {
    transform: translateY(0);
}
.hero h1 {
    font-size: clamp(2.35rem,4vw,4.2rem);
    max-width: 680px;
}
.hero p {
    max-width: 620px;
}
.hero__facts {
    display: flex;
    flex-wrap: wrap;
    gap: .9rem;
    align-items: center;
}
.hero__facts > span,
.hero__fact {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 56px;
    padding: .9rem 1.15rem;
    background: rgba(255,255,255,.92);
    border-radius: 999px;
    box-shadow: 0 14px 36px rgba(121,87,200,.08);
}
.hero__facts > span:before {
    content: '✓';
    color: #2fa77c;
    font-size: .92rem;
}
.hero__fact {
    gap: .55rem;
    color: var(--ink);
    font-weight: 700;
    transition: transform .18s ease, box-shadow .18s ease;
    white-space: nowrap;
}
.hero__fact:hover {
    transform: translateY(-2px);
    box-shadow: 0 18px 42px rgba(121,87,200,.12);
}
.hero__fact-icon {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    flex-shrink: 0;
    color: #2fa77c;
}
.hero__fact-icon svg { width: 18px; height: 18px }
.hero__fact-label {
    color: var(--muted);
    font-size: .84rem;
    font-weight: 700;
}
.hero__fact strong {
    font-size: .9rem;
    direction: ltr;
    color: var(--ink);
}
.hero__art {
    position: relative;
    height: 400px;
    transform: translateY(-8px);
    padding: 0;
}
.hero__art .blob {
    right: 8%;
    top: 3%;
    width: 240px;
    height: 240px;
    background: rgba(255,111,145,.16);
    filter: blur(14px);
}
.hero__art .blob--secondary {
    left: 10%;
    bottom: 8%;
    width: 190px;
    height: 190px;
    background: rgba(121,87,200,.14);
    border-radius: 50%;
    filter: blur(16px);
}
.hero-icon {
    position: absolute;
    display: grid;
    place-items: center;
}
.hero-icon__plate {
    width: 128px;
    height: 128px;
    display: grid;
    place-items: center;
    border-radius: 32px;
    background: linear-gradient(145deg,rgba(255,255,255,.88),rgba(255,244,250,.95));
    border: 1px solid rgba(255,255,255,.7);
    box-shadow: 0 22px 45px rgba(94,64,121,.12);
    backdrop-filter: blur(10px);
}
.hero-icon__plate svg {
    width: 90px;
    height: 90px;
    display: block;
    filter: drop-shadow(0 10px 14px rgba(47,27,70,.12));
}
.hero-icon__plate--hair {
    width: 108px;
    height: 108px;
    border-radius: 28px;
    background: linear-gradient(145deg,rgba(255,250,252,.95),rgba(243,235,255,.92));
}
.hero-icon__plate--hair svg {
    width: 78px;
    height: 78px;
}
.hero-icon__plate--pencil {
    background: linear-gradient(145deg,rgba(255,245,224,.95),rgba(255,240,246,.93));
}
.hero-icon--notebook {
    top: 9%;
    left: 10%;
    transform: rotate(-6deg);
}
.hero-icon--hair {
    left: 28%;
    bottom: 12%;
}
.hero-icon--pencil {
    top: 5%;
    right: 12%;
    transform: rotate(7deg);
}

@media(max-width:1100px) {
    .hero { padding: 66px 5% 56px; gap: 1rem; }
    .hero__art { height: 340px; }
    .hero-icon__plate { width: 112px; height: 112px; border-radius: 28px; }
    .hero-icon__plate svg { width: 78px; height: 78px; }
    .hero-icon__plate--hair { width: 96px; height: 96px; }
    .hero-icon__plate--hair svg { width: 68px; height: 68px; }
    .hero-icon--hair { left: 24%; bottom: 10%; }
}

@media(max-width:800px) {
    .hero__art {
        height: 250px;
        margin-top: .5rem;
        transform: none;
    }
    .hero-icon__plate { width: 92px; height: 92px; border-radius: 24px; }
    .hero-icon__plate svg { width: 64px; height: 64px; }
    .hero-icon__plate--hair { width: 78px; height: 78px; }
    .hero-icon__plate--hair svg { width: 56px; height: 56px; }
    .hero-icon--notebook { left: 7%; top: 12%; }
    .hero-icon--hair { left: 30%; bottom: 8%; }
    .hero-icon--pencil { right: 9%; top: 7%; }
    .hero__facts {
        gap: .7rem;
    }
    .hero__facts > span,
    .hero__fact {
        min-height: 52px;
        padding: .8rem 1rem;
    }
}

@media(max-width:640px) {
    .hero h1 { font-size: 1.9rem; }
    .hero p { font-size: .95rem; }
    .hero__facts > span,
    .hero__fact {
        width: auto;
        max-width: 100%;
        padding: .75rem .95rem;
    }
    .hero__fact-label {
        display: none;
    }
}


/* Hero refinement: smaller headline, single-row facts, cleaner phone pill, tighter icon placement */
.hero {
    grid-template-columns: .92fr 1.08fr;
    align-items: center;
    padding-top: 58px;
    padding-bottom: 52px;
}
.hero__copy {
    transform: none;
}
.hero h1 {
    font-size: clamp(2.15rem,3.35vw,3.35rem);
    line-height: 1.22;
    margin: .8rem 0 1rem;
    max-width: 760px;
    letter-spacing: -.01em;
}
.hero p {
    max-width: 620px;
    font-size: 1rem;
    line-height: 1.95;
    margin-bottom: 1.5rem;
}
.hero__facts {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: .7rem;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    padding-bottom: .2rem;
}
.hero__facts::-webkit-scrollbar { display: none; }
.hero__facts > span,
.hero__fact {
    flex: 0 0 auto;
    min-height: 48px;
    padding: .72rem 1rem;
    font-size: .88rem;
    box-shadow: 0 10px 28px rgba(121,87,200,.07);
}
.hero__facts > span {
    gap: .4rem;
}
.hero__facts > span:before {
    font-size: .82rem;
}
.hero__fact {
    gap: .45rem;
}
.hero__fact-icon {
    width: 18px;
    height: 18px;
    color: #2fa77c;
}
.hero__fact-icon svg {
    width: 16px;
    height: 16px;
}
.hero__fact strong {
    font-size: .88rem;
    font-weight: 800;
}
.hero__fact-label {
    display: none;
}
.hero__art {
    height: 320px;
    transform: translateY(-28px);
}
.hero__art .blob {
    right: 18%;
    top: 10%;
    width: 210px;
    height: 210px;
}
.hero__art .blob--secondary {
    left: 16%;
    bottom: 18%;
    width: 150px;
    height: 150px;
}
.hero-icon__plate {
    width: 114px;
    height: 114px;
    border-radius: 28px;
}
.hero-icon__plate svg {
    width: 78px;
    height: 78px;
}
.hero-icon__plate--hair {
    width: 88px;
    height: 88px;
    border-radius: 24px;
}
.hero-icon__plate--hair svg {
    width: 60px;
    height: 60px;
}
.hero-icon--notebook {
    top: 14%;
    left: 16%;
    transform: rotate(-8deg);
}
.hero-icon--pencil {
    top: 12%;
    right: 18%;
    transform: rotate(8deg);
}
.hero-icon--hair {
    left: 31%;
    bottom: 14%;
    transform: none;
}

@media(max-width:1180px) {
    .hero h1 {
        font-size: clamp(1.95rem,3vw,2.85rem);
        max-width: 620px;
    }
    .hero__facts > span,
    .hero__fact {
        padding: .7rem .9rem;
        font-size: .82rem;
    }
}

@media(max-width:900px) {
    .hero {
        grid-template-columns: 1fr;
        padding-top: 46px;
    }
    .hero h1 {
        font-size: 2rem;
        max-width: none;
    }
    .hero__art {
        order: -1;
        height: 220px;
        margin-bottom: .25rem;
        transform: none;
    }
    .hero-icon__plate {
        width: 88px;
        height: 88px;
        border-radius: 22px;
    }
    .hero-icon__plate svg {
        width: 60px;
        height: 60px;
    }
    .hero-icon__plate--hair {
        width: 72px;
        height: 72px;
    }
    .hero-icon__plate--hair svg {
        width: 50px;
        height: 50px;
    }
    .hero-icon--notebook {
        top: 14%;
        left: 21%;
    }
    .hero-icon--pencil {
        top: 10%;
        right: 23%;
    }
    .hero-icon--hair {
        left: 44%;
        bottom: 6%;
    }
}

@media(max-width:640px) {
    .hero h1 {
        font-size: 1.75rem;
        line-height: 1.28;
    }
    .hero p {
        font-size: .94rem;
        line-height: 1.85;
    }
    .hero__facts {
        gap: .55rem;
    }
    .hero__facts > span,
    .hero__fact {
        min-height: 44px;
        padding: .68rem .85rem;
        font-size: .78rem;
    }
    .hero__art {
        height: 190px;
    }
    .hero-icon--notebook { left: 16%; }
    .hero-icon--pencil { right: 16%; }
    .hero-icon--hair { left: 42%; bottom: 0; }
}


/* FINAL hero override — keep this block at the very end of the stylesheet */
@media (min-width: 901px) {
    .hero {
        grid-template-columns: 46% 54% !important;
        min-height: 540px !important;
        padding: 52px 5.5% 48px !important;
        align-items: center !important;
        gap: 2.25rem !important;
    }

    .hero__copy {
        transform: none !important;
        min-width: 0 !important;
    }

    .hero > .hero__copy > h1,
    .hero .hero__copy h1,
    .hero h1 {
        font-size: 2.15rem !important;
        line-height: 1.42 !important;
        max-width: 680px !important;
        margin: .75rem 0 .9rem !important;
        letter-spacing: 0 !important;
    }

    .hero .hero__copy > p {
        font-size: .96rem !important;
        line-height: 1.95 !important;
        max-width: 650px !important;
        margin-bottom: 1.25rem !important;
    }

    .hero__art {
        height: 310px !important;
        transform: translateY(-62px) !important;
        align-self: start !important;
        margin-top: 22px !important;
    }

    .hero-icon--notebook {
        top: 4% !important;
        left: 11% !important;
    }

    .hero-icon--pencil {
        top: 2% !important;
        right: 15% !important;
    }

    .hero-icon--hair {
        left: 34% !important;
        bottom: 12% !important;
    }

    .hero-icon__plate {
        width: 108px !important;
        height: 108px !important;
    }

    .hero-icon__plate svg {
        width: 74px !important;
        height: 74px !important;
    }

    .hero-icon__plate--hair {
        width: 82px !important;
        height: 82px !important;
    }

    .hero-icon__plate--hair svg {
        width: 56px !important;
        height: 56px !important;
    }

    .hero__facts {
        display: grid !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: .55rem !important;
        width: 100% !important;
        overflow: visible !important;
        align-items: stretch !important;
    }

    .hero__facts > span,
    .hero__facts > .hero__fact {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 46px !important;
        padding: .66rem .55rem !important;
        font-size: .76rem !important;
        white-space: nowrap !important;
        justify-content: center !important;
        gap: .3rem !important;
    }

    .hero__fact strong {
        font-size: .76rem !important;
        direction: ltr !important;
    }

    .hero__fact-icon {
        width: 15px !important;
        height: 15px !important;
    }

    .hero__fact-icon svg {
        width: 14px !important;
        height: 14px !important;
    }
}

@media (min-width: 1180px) {
    .hero > .hero__copy > h1,
    .hero .hero__copy h1,
    .hero h1 {
        font-size: 2.05rem !important;
        line-height: 1.4 !important;
    }
}

@media (max-width: 900px) {
    .hero h1 {
        font-size: 1.85rem !important;
        line-height: 1.42 !important;
    }

    .hero__art {
        transform: translateY(-18px) !important;
    }

    .hero__facts {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: .55rem !important;
        overflow: visible !important;
    }

    .hero__facts > span,
    .hero__facts > .hero__fact {
        width: 100% !important;
        min-width: 0 !important;
        justify-content: center !important;
        font-size: .78rem !important;
        white-space: nowrap !important;
    }
}

@media (max-width: 560px) {
    .hero h1 {
        font-size: 1.58rem !important;
        line-height: 1.5 !important;
    }

    .hero__facts {
        grid-template-columns: 1fr !important;
    }
}


/* FINAL adjustment v2: smaller title, tighter icon cluster, better phone spacing */
@media (min-width: 901px) {
    .hero {
        grid-template-columns: 58% 42% !important;
        padding: 50px 5.5% 46px !important;
        gap: 1.6rem !important;
    }

    .hero > .hero__copy > h1,
    .hero .hero__copy h1,
    .hero h1 {
        font-size: 1.85rem !important;
        line-height: 1.42 !important;
        max-width: 620px !important;
        margin: .65rem 0 .9rem !important;
    }

    .hero .hero__copy > p {
        max-width: 600px !important;
        font-size: .95rem !important;
        line-height: 1.9 !important;
    }

    .hero__art {
        height: 280px !important;
        transform: translateY(-78px) !important;
        margin-top: 6px !important;
    }

    .hero__art .blob {
        right: 19% !important;
        top: 10% !important;
        width: 190px !important;
        height: 190px !important;
    }

    .hero__art .blob--secondary {
        left: 22% !important;
        bottom: 10% !important;
        width: 120px !important;
        height: 120px !important;
        opacity: .6 !important;
    }

    .hero-icon__plate {
        width: 104px !important;
        height: 104px !important;
        border-radius: 26px !important;
    }

    .hero-icon__plate svg {
        width: 70px !important;
        height: 70px !important;
    }

    .hero-icon__plate--hair {
        width: 74px !important;
        height: 74px !important;
        border-radius: 21px !important;
    }

    .hero-icon__plate--hair svg {
        width: 52px !important;
        height: 52px !important;
    }

    .hero-icon--notebook {
        top: 2% !important;
        left: 17% !important;
        transform: rotate(-6deg) !important;
    }

    .hero-icon--pencil {
        top: 0 !important;
        right: 20% !important;
        transform: rotate(6deg) !important;
    }

    .hero-icon--hair {
        left: 35% !important;
        top: 128px !important;
        bottom: auto !important;
    }

    .hero-icon--pencil .hero-icon__plate svg {
        width: 66px !important;
        height: 66px !important;
        transform: translate(-5px, 3px) rotate(-4deg) !important;
        transform-origin: center !important;
    }

    .hero__facts {
        display: flex !important;
        flex-wrap: nowrap !important;
        justify-content: flex-start !important;
        align-items: center !important;
        gap: .5rem !important;
        width: auto !important;
        max-width: 100% !important;
        overflow: visible !important;
        padding-inline: 10px 6px !important;
    }

    .hero__facts > span,
    .hero__facts > .hero__fact {
        flex: 0 0 auto !important;
        width: auto !important;
        min-width: 0 !important;
        min-height: 44px !important;
        padding: .62rem .82rem !important;
        font-size: .74rem !important;
        white-space: nowrap !important;
        justify-content: center !important;
        gap: .26rem !important;
        border-radius: 999px !important;
    }

    .hero__fact {
        margin-left: 6px !important;
    }

    .hero__fact strong {
        font-size: .74rem !important;
    }

    .hero__fact-icon {
        width: 14px !important;
        height: 14px !important;
    }

    .hero__fact-icon svg {
        width: 13px !important;
        height: 13px !important;
    }
}

@media (min-width: 1180px) {
    .hero > .hero__copy > h1,
    .hero .hero__copy h1,
    .hero h1 {
        font-size: 1.78rem !important;
        max-width: 640px !important;
    }
}

@media (max-width: 900px) {
    .hero__art {
        height: 210px !important;
        transform: translateY(-8px) !important;
    }

    .hero-icon--notebook { left: 23% !important; top: 6% !important; }
    .hero-icon--pencil { right: 23% !important; top: 2% !important; }
    .hero-icon--hair { left: 44% !important; top: 112px !important; bottom: auto !important; }

    .hero__facts {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    }
}


/* HERO visual redesign: replace scattered icons with one cohesive floating showcase */
.hero-icon,
.hero-icon__plate,
.hero-icon__plate--hair,
.hero-icon__plate--pencil {
    display: none !important;
}

@keyframes heroShowcaseFloat {
    0%, 100% { transform: translateY(0px) rotate(-6deg); }
    50% { transform: translateY(-10px) rotate(-4deg); }
}

@keyframes heroBagBob {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-8px); }
}

@keyframes heroSparkle {
    0%, 100% { transform: scale(1); opacity: .7; }
    50% { transform: scale(1.18); opacity: 1; }
}

.hero__art {
    overflow: visible !important;
}

.hero-showcase {
    position: relative;
    width: min(360px, 84%);
    aspect-ratio: 1 / 1;
    margin: 0 auto;
    display: block;
    animation: heroShowcaseFloat 7s ease-in-out infinite;
}

.hero-showcase__glow {
    position: absolute;
    inset: 13% 12% 16% 12%;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(206,171,236,.48) 0%, rgba(232,187,210,.28) 48%, rgba(255,255,255,0) 72%);
    filter: blur(6px);
}

.hero-showcase__panel {
    position: absolute;
    inset: 16% 14%;
    border-radius: 42px;
    background: linear-gradient(145deg, rgba(255,255,255,.74), rgba(255,245,250,.92));
    border: 1px solid rgba(255,255,255,.68);
    box-shadow: 0 28px 60px rgba(94,64,121,.14);
    backdrop-filter: blur(14px);
    overflow: hidden;
}

.hero-showcase__bag {
    position: absolute;
    inset: 8% 7% 6% 7%;
    display: grid;
    place-items: center;
    animation: heroBagBob 6.2s ease-in-out infinite;
}

.hero-showcase__bag svg {
    width: 100%;
    height: 100%;
    display: block;
    filter: drop-shadow(0 16px 24px rgba(55,33,79,.10));
}

.hero-showcase__accent {
    position: absolute;
    border-radius: 50%;
    display: block;
}

.hero-showcase__accent--one {
    width: 96px;
    height: 96px;
    top: -18px;
    right: -10px;
    background: radial-gradient(circle, rgba(255,111,145,.22), rgba(255,111,145,0));
}

.hero-showcase__accent--two {
    width: 82px;
    height: 82px;
    bottom: 12px;
    left: -8px;
    background: radial-gradient(circle, rgba(121,87,200,.20), rgba(121,87,200,0));
}

.hero-showcase__spark {
    position: absolute;
    display: block;
    border-radius: 999px;
    animation: heroSparkle 3.6s ease-in-out infinite;
}

.hero-showcase__spark--one {
    top: 16%;
    right: 13%;
    width: 14px;
    height: 14px;
    background: #ff6f91;
    box-shadow: 0 0 0 7px rgba(255,111,145,.12);
}

.hero-showcase__spark--two {
    bottom: 19%;
    left: 15%;
    width: 12px;
    height: 12px;
    background: #7d5bef;
    box-shadow: 0 0 0 6px rgba(125,91,239,.11);
    animation-delay: 1.2s;
}

.hero-showcase__spark--three {
    top: 49%;
    left: 3%;
    width: 11px;
    height: 11px;
    background: #ffd66b;
    box-shadow: 0 0 0 6px rgba(255,214,107,.18);
    animation-delay: .6s;
}

@media (min-width: 901px) {
    .hero {
        grid-template-columns: 57% 43% !important;
    }

    .hero__art {
        height: 320px !important;
        transform: translateY(-42px) !important;
        margin-top: 0 !important;
    }

    .hero-showcase {
        width: min(350px, 88%);
    }
}

@media (max-width: 900px) {
    .hero__art {
        height: 250px !important;
        transform: translateY(-4px) !important;
    }

    .hero-showcase {
        width: min(290px, 82%);
    }

    .hero-showcase__panel {
        border-radius: 34px;
    }
}

@media (max-width: 560px) {
    .hero__art {
        height: 210px !important;
    }

    .hero-showcase {
        width: min(240px, 86%);
    }

    .hero-showcase__panel {
        inset: 16% 13%;
        border-radius: 28px;
    }
}

/* Product Q&A admin grid */
.qa-grid-card { padding: 0; overflow: hidden }
.qa-grid-card .qa-list-head { padding: 1.15rem 1.25rem; border-bottom: 1px solid var(--line); margin: 0 }
.qa-grid { min-width: 1080px }
.qa-grid th:last-child, .qa-grid td:last-child { width: 170px }
.qa-grid td { vertical-align: top }
.qa-grid td > small { display: block; margin-top: .3rem; color: var(--muted); font-size: .65rem }
.qa-grid__question { min-width: 230px; max-width: 330px }
.qa-grid__question strong { display: block; line-height: 1.9; white-space: normal }
.qa-grid__answer { min-width: 260px; max-width: 420px }
.qa-grid__answer > span { display: -webkit-box; overflow: hidden; line-height: 1.9; white-space: normal; -webkit-line-clamp: 3; -webkit-box-orient: vertical }
.qa-empty-value { color: #9aa3b1; font-style: italic }
.qa-grid-actions { display: flex; align-items: center; gap: .45rem; flex-wrap: wrap }
.qa-grid-actions form { margin: 0 }
.qa-grid-actions .btn { min-height: 34px; padding: .45rem .75rem; font-size: .7rem }
.btn-danger { background: #fff1f2; color: #c4364c; border: 1px solid #ffd3da }
.btn-danger:hover { background: #ffe5e9 }
.qa-editor-row > td { padding: 0 !important; background: #fafbff }
.qa-editor-row:hover { background: #fafbff !important }
.qa-inline-editor { max-width: none !important; padding: 1.2rem 1.35rem 1.35rem; border-top: 2px solid #e8e8ff }
.qa-inline-editor__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1rem }
.qa-inline-editor__head strong { font-size: .9rem; color: #27334a }
.qa-editor-close { border: 0; background: transparent; color: #7b8495; font-size: 1.55rem; line-height: 1; cursor: pointer; padding: .2rem .45rem }
.qa-editor-close:hover { color: #c4364c }
.qa-inline-editor .qa-fields { grid-template-columns: 1.15fr 1.4fr .65fr }
.qa-inline-editor .qa-card-actions { display: flex; gap: .55rem; justify-content: flex-start; margin-top: 1rem }

@media (max-width: 900px) {
    .qa-inline-editor .qa-fields { grid-template-columns: 1fr }
}

/* Managed URLs grid */
.managed-url-grid { min-width: 1100px; }
.managed-url-grid td { vertical-align: middle; }
.managed-url-grid td:first-child code { font-weight: 700; }
.url-grid-note { display: block; margin-top: .35rem; color: var(--muted); line-height: 1.65; }
.module-badge { display: inline-flex; align-items: center; padding: .32rem .62rem; border-radius: 999px; background: #f2eef9; color: var(--purple); font-size: .7rem; white-space: nowrap; }
.url-grid-actions { min-width: 155px; flex-wrap: wrap; }
.table-actions .neutral-action { color: var(--purple); }
.form-info-box { padding: 1rem; border: 1px dashed var(--line); border-radius: 12px; background: #faf8fc; }
.form-info-box p { margin: .4rem 0 0; color: var(--muted); font-size: .78rem; }

/* Permanent bulk base-price update */
.permanent-pricing-card { margin-bottom: 1rem; border-right: 4px solid #c68a20; }
.permanent-pricing-form { display: grid; grid-template-columns: .8fr .8fr auto; gap: .8rem; align-items: start; }
.permanent-pricing-form label, .permanent-pricing-action { display: grid; grid-template-rows: 1rem 42px 1rem; gap: .3rem; min-width: 0; }
.permanent-pricing-form label > span, .permanent-pricing-action > span { font-size: .67rem; font-weight: 700; }
.permanent-pricing-form input, .permanent-pricing-form select { width: 100%; height: 42px; border: 1px solid #dce1e8; border-radius: 9px; padding: .6rem .7rem; font: inherit; font-size: .7rem; background: #fff; }
.permanent-pricing-form small, .permanent-pricing-action small { font-size: .56rem; color: #87909d; }
.permanent-pricing-action .btn { height: 42px; white-space: nowrap; }
.permanent-pricing-warning { margin-top: .8rem; padding: .75rem .9rem; border-radius: 10px; background: #fff7e5; color: #725313; font-size: .66rem; line-height: 1.9; }
@media (max-width: 900px) { .permanent-pricing-form { grid-template-columns: 1fr 1fr; } .permanent-pricing-action { grid-column: 1/-1; } }
@media (max-width: 620px) { .permanent-pricing-form { grid-template-columns: 1fr; } .permanent-pricing-action { grid-column: auto; } .permanent-pricing-action .btn { width: 100%; } }

/* SEO admin helpers */
.seo-char-counter{display:block;margin-top:4px;color:#7b8494;font-size:11px;text-align:left;direction:rtl}
.site-settings-group code{user-select:all}

/* Article menu list: compact heading, collapsible summary and balanced cards */
.article-list-page { margin-top: 0px; }
.article-list-page .menu-banner-rotator { margin-top: 0; margin-bottom: 24px; }
.article-list-page__cover { height: 320px; }
.article-list-head { margin: 0 0 24px; }
.article-list-head__title { display: flex; align-items: center; gap: .8rem; margin-bottom: 14px; }
.article-list-head__title h1 { margin: 0; font-size: 1.2rem; line-height: 1.45; color: var(--ink); }
.article-list-head__title .menu-page-icon { flex: 0 0 46px; width: 46px; height: 46px; }
.article-list-summary { position: relative; max-width: 100%; padding: 16px 18px 13px; border: 1px solid var(--line); border-radius: 16px; background: #fff; box-shadow: 0 5px 20px rgba(44,41,64,.04); }
.article-list-summary__content { color: var(--muted); font-size: .9rem; line-height: 2; max-height: 6em; overflow: hidden; }
.article-list-summary__content > :first-child { margin-top: 0; }
.article-list-summary__content > :last-child { margin-bottom: 0; }
.article-list-summary:not(.is-expanded)::after { content: ""; position: absolute; right: 1px; left: 1px; bottom: 40px; height: 34px; pointer-events: none; border-radius: 0 0 15px 15px; background: linear-gradient(to bottom,rgba(255,255,255,0),#fff 85%); }
.article-list-summary.is-expanded .article-list-summary__content { max-height: none; }
.article-list-summary.is-expanded::after { display: none; }
.article-list-summary__toggle { position: relative; z-index: 1; display: inline-flex; align-items: center; gap: .35rem; margin: 8px 0 0; padding: .25rem .2rem; border: 0; background: transparent; color: var(--purple); font: inherit; font-size: .76rem; font-weight: 750; cursor: pointer; }
.article-list-summary__toggle[hidden] { display: none; }
.article-list-summary__chevron { font-size: 1rem; line-height: 1; transition: transform .2s ease; }
.article-list-summary.is-expanded .article-list-summary__chevron { transform: rotate(180deg); }
.article-list-results { margin-top: 0; }
.article-list-page .editorial-grid--menu { margin-top: 0; gap: 22px; }
.article-list-card { border-radius: 16px; box-shadow: 0 3px 14px rgba(44,41,64,.035); }
.article-list-card:hover { transform: translateY(-3px); box-shadow: 0 10px 28px rgba(44,41,64,.09); }
.article-list-card__image { height: 205px; }
.article-list-card__content { padding: 16px 17px 14px; gap: .55rem; }
.article-list-card__meta { font-size: .68rem; }
.article-list-card h2 { font-size: 1rem; line-height: 1.75; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.article-list-card__excerpt { line-height: 1.85; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
.article-list-card__footer { display: flex; align-items: center; justify-content: flex-start; margin-top: auto; padding-top: .45rem; border-top: 1px solid #f0edf3; background: transparent; }
.article-list-card__more { display: inline-flex; align-items: center; gap: .3rem; width: auto; padding: 0; color: var(--purple); background: transparent; border: 0; border-radius: 0; font-size: .7rem; font-weight: 700; line-height: 1.5; }
.article-list-card__more:hover { color: var(--ink); background: transparent; transform: none; }
.article-list-empty { margin-top: 0; }

@media(max-width:700px) {
    .article-list-page { margin-top: 18px; padding-right: 15px; padding-left: 15px; }
    .article-list-page .menu-banner-rotator { height: 230px; border-radius: 18px; }
    .article-list-head { margin-bottom: 18px; }
    .article-list-head__title { align-items: flex-start; }
    .article-list-head__title h1 { font-size: 1.35rem; }
    .article-list-head__title .menu-page-icon { width: 38px; height: 38px; flex-basis: 38px; }
    .article-list-summary { padding: 13px 14px 11px; border-radius: 14px; }
    .article-list-summary__content { font-size: .82rem; line-height: 1.9; max-height: 5.7em; }
    .article-list-card__image { height: 220px; }
}

.site-language-switch,.admin-language-switch{display:inline-flex;align-items:center}.site-language-switch select,.admin-language-switch select{border:1px solid #d9dce3;border-radius:10px;padding:.45rem .7rem;background:#fff;font:inherit}.culture-en{direction:ltr}.culture-fa,.culture-ar{direction:rtl}

/* Product cards: equal-height content and consistent product actions */
.product-grid > .product-card,
.carousel__item.product-card {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.product-card__body {
    display: flex;
    flex: 1;
    flex-direction: column;
}

.product-card__body h2 a,
.product-card__body h3 a {
    color: inherit;
    text-decoration: none;
}

.product-card__body h2 a:hover,
.product-card__body h3 a:hover {
    color: var(--purple);
}

.product-card__summary {
    min-height: 7.4em;
}

.product-card__body .price {
    margin-top: auto;
}

.product-card__body .add-cart {
    display: block;
    box-sizing: border-box;
    margin-top: 1rem;
    margin-bottom: .35rem;
    text-align: center;
    text-decoration: none;
}


/* Local typography normalization: keeps the former Vazirmatn proportions with offline system fonts */
body { font-size: 1rem; font-weight: 400; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }
body, button, input, select, textarea { font-family: "Segoe UI", Tahoma, Arial, sans-serif; }
.site-header nav a, .dynamic-menu__item > a { letter-spacing: 0; }
.product-card__body h3, .article-card h3 { line-height: 1.65; }
.product-card__summary, .article-card p { line-height: 1.9; }
.admin-body { font-size: 14px; line-height: 1.7; }
.admin-body h1 { font-size: 1.55rem; line-height: 1.45; }
.admin-body h2 { font-size: 1.25rem; line-height: 1.5; }
.admin-body h3 { font-size: 1.05rem; line-height: 1.55; }
.admin-body .admin-nav__group > a { font-size: .9rem; }
.admin-body .admin-table th, .admin-body .admin-table td { font-size: .76rem; }
.admin-body input, .admin-body select, .admin-body textarea, .admin-body button { font-size: .88rem; }
@media (max-width: 720px) { html { font-size: 14px; } .admin-body { font-size: 13.5px; } }

/* === Persian typography system v6: public site + admin readability === */
:root {
    --font-fa: "Segoe UI Variable Text", "Segoe UI", Tahoma, Arial, sans-serif;
}
html[lang="fa"], html[lang="ar"] { font-size: 16px; }
html[lang="fa"] body, html[lang="ar"] body,
html[lang="fa"] button, html[lang="ar"] button,
html[lang="fa"] input, html[lang="ar"] input,
html[lang="fa"] select, html[lang="ar"] select,
html[lang="fa"] textarea, html[lang="ar"] textarea {
    font-family: var(--font-fa);
    letter-spacing: 0;
}
body { line-height: 1.85; }
p, li { line-height: 1.9; }
h1, h2, h3, h4, h5, h6 { letter-spacing: 0; line-height: 1.5; }

/* Public navigation and breadcrumb */
.site-header nav a, .dynamic-menu__item > a { font-size: .93rem; line-height: 1.55; }
.breadcrumb { padding-top: 1.35rem; padding-bottom: 1.35rem; font-size: .86rem; line-height: 1.8; }
.breadcrumb a, .breadcrumb span { display: inline-flex; align-items: center; }

/* Product listing cards */
.catalog-results .product-grid, .product-grid { align-items: stretch; }
.product-card__body { padding: 1.45rem 1.35rem 1.25rem; }
.product-card__body h2, .product-card__body h3,
.product-card h2, .product-card h3 {
    margin: 0 0 .65rem;
    font-size: 1.1rem;
    font-weight: 750;
    line-height: 1.65;
}
.product-card__body small { font-size: .78rem; line-height: 1.7; }
.product-card__summary, .product-card p {
    min-height: 6.5em;
    margin: 0;
    font-size: .92rem;
    line-height: 2;
    color: #706b79;
}
.product-card__body .price {
    margin-top: auto;
    padding-top: 1rem;
    font-size: 1rem;
    line-height: 1.6;
}
.product-card__body .add-cart {
    margin-top: 1.15rem;
    margin-bottom: .2rem;
    padding: .85rem 1rem;
    font-size: 1rem;
    line-height: 1.5;
}

/* Article lists/cards */
.article-list-head__title h1 { font-size: clamp(1.7rem, 2.6vw, 2.2rem); line-height: 1.55; }
.article-list-summary__content { font-size: .96rem; line-height: 2.05; }
.editorial-card__content, .article-list-card__content { padding: 1.35rem 1.4rem 1.25rem; }
.editorial-card h2, .article-list-card h2 {
    font-size: 1.12rem;
    font-weight: 750;
    line-height: 1.75;
    margin-bottom: .25rem;
}
.editorial-card__excerpt, .article-list-card__excerpt {
    font-size: .9rem;
    line-height: 1.95;
}
.editorial-card__meta, .article-list-card__meta { font-size: .76rem; line-height: 1.7; }
.editorial-card__more, .article-list-card__more { font-size: .8rem; line-height: 1.6; }

/* Product details */
.product-info h1, .pd-title { font-size: 1.5rem; line-height: 1.5; margin-bottom: .8rem; }
.product-info > p, .pd-summary { font-size: 1rem; line-height: 2; color: #6f6978; }
.detail-price, .pd-price { line-height: 1.5; }
.description, .pd-description, .product-description {
    font-size: 1rem;
    line-height: 2.1;
}
.description h2, .pd-description h2, .product-description h2 { font-size: 1.55rem; margin: 2rem 0 .9rem; }
.description h3, .pd-description h3, .product-description h3 { font-size: 1.25rem; margin: 1.6rem 0 .75rem; }

/* Editorial details */
.editorial-detail-main { padding: 2.7rem 3rem; }
.editorial-detail-header { margin-bottom: 2.7rem; padding-bottom: 2.1rem; }
.editorial-detail-header h1 {
    font-size: 1.5rem;
    font-weight: 800;
    line-height: 1.55;
    margin: .55rem 0 1rem;
}
.editorial-detail-excerpt { font-size: 1.05rem; line-height: 2.05; max-width: 790px; }
.editorial-detail-meta { font-size: .86rem; line-height: 1.7; }
.editorial-body { font-size: 1.03rem; line-height: 2.15; color: #393443; }
.editorial-body p { margin: 0 0 1.35rem; }
.editorial-body h2 { font-size: 1.65rem; line-height: 1.65; margin: 2.3rem 0 1rem; }
.editorial-body h3 { font-size: 1.3rem; line-height: 1.7; margin: 1.8rem 0 .85rem; }
.sidebar-widget-title { font-size: 1.08rem; line-height: 1.7; }
.sidebar-article { gap: .9rem; padding: .9rem .75rem; }
.sidebar-article h4 { font-size: .92rem; line-height: 1.75; margin-bottom: .35rem; }
.sidebar-article-date { font-size: .72rem; line-height: 1.6; }

/* Admin: keep side navigation sizing, enlarge content/grid/form typography */
.admin-body { font-size: 15px; line-height: 1.8; }
.admin-main, .admin-main button, .admin-main input, .admin-main select, .admin-main textarea,
.admin-topbar { font-family: var(--font-fa); }
.admin-main > .admin-head h1, .admin-head h1 { font-size: 1.7rem; line-height: 1.5; }
.admin-main h2 { font-size: 1.35rem; line-height: 1.6; }
.admin-main h3 { font-size: 1.12rem; line-height: 1.65; }
.admin-table th, .dashboard-table th {
    padding: .95rem .8rem;
    font-size: .82rem !important;
    line-height: 1.65;
    font-weight: 750;
}
.admin-table td, .dashboard-table td {
    padding: .95rem .8rem;
    font-size: .9rem !important;
    line-height: 1.75;
}
.admin-table td small, .dashboard-table td small,
.order-admin-table td > small, .customer-admin-table td > small { font-size: .75rem !important; line-height: 1.65; }
.admin-table code, .dashboard-table code, .order-admin-table code { font-size: .78rem !important; }
.admin-main label, .admin-main label > span, .admin-main .field > label,
.qa-fields label > span, .communication-fields label > span,
.address-fields label > span, .payment-gateway-fields label > span,
.site-setting-field b { font-size: .88rem !important; line-height: 1.7; }
.admin-main input:not([type="checkbox"]):not([type="radio"]),
.admin-main select, .admin-main textarea {
    font-size: .92rem !important;
    line-height: 1.7;
    min-height: 43px;
}
.admin-main textarea { min-height: 120px; }
.admin-main small, .admin-main .field-help, .admin-main .form-text,
.site-setting-field small, .communication-fields label > small,
.payment-gateway-fields small, .address-fields small,
.seo-fieldset small, .permanent-pricing-form small,
.permanent-pricing-action small { font-size: .75rem !important; line-height: 1.75; }
.admin-main .btn, .admin-main button { font-size: .70rem; line-height: 1.5; margin: 3px; padding: 7px; }
.content-editor-form .rich-field, .content-editor-form textarea { font-size: .98rem !important; line-height: 2; }

@media (max-width: 900px) {
    .editorial-detail-main { padding: 2rem 1.5rem; }
    .product-card__body h2, .product-card__body h3, .product-card h2, .product-card h3 { font-size: 1.1rem; }
}
@media (max-width: 720px) {
    html[lang="fa"], html[lang="ar"] { font-size: 15px; }
    .product-card__summary, .product-card p { min-height: auto; }
    .editorial-detail-header h1 { font-size: 1.85rem; }
    .editorial-body { font-size: 1rem; }
    .admin-body { font-size: 14.5px; }
}

.menu-module-head h1 { font-size: 1.5rem;}
/* Account center */
.account-shell{display:grid;grid-template-columns:260px minmax(0,1fr);gap:1.5rem;max-width:1240px;margin:2rem auto;padding:0 1rem;align-items:start}.account-sidebar{background:#fff;border:1px solid #eee7f0;border-radius:20px;padding:1rem;position:sticky;top:1rem;box-shadow:0 10px 35px rgba(74,46,83,.06)}.account-sidebar__head{display:flex;flex-direction:column;align-items:center;text-align:center;padding:1rem .5rem 1.25rem;border-bottom:1px solid #f0eaf2}.account-avatar{display:grid;place-items:center;width:58px;height:58px;border-radius:50%;background:#f5eafa;font-size:1.6rem;margin-bottom:.65rem}.account-sidebar__head strong{font-size:.95rem;max-width:100%;overflow:hidden;text-overflow:ellipsis}.account-sidebar__head small{color:#8b8190}.account-sidebar nav{display:grid;gap:.25rem;padding:.8rem 0}.account-sidebar nav a{padding:.78rem .9rem;border-radius:11px;color:#4a414d;font-weight:650}.account-sidebar nav a:hover,.account-sidebar nav a.is-active{background:#f6edf9;color:#8e3fa5}.account-logout{width:100%;border:0;background:#fff1f2;color:#b42335;border-radius:10px;padding:.75rem;cursor:pointer}.account-content{min-width:0}.account-page-head{background:linear-gradient(135deg,#fff,#faf5fc);border:1px solid #eee6f1;border-radius:20px;padding:1.5rem 1.7rem;margin-bottom:1.2rem}.account-page-head h1{font-size:1.55rem;margin:.2rem 0 .4rem}.account-page-head p{margin:0;color:#766d79}.account-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem;margin-bottom:1rem}.account-stats a{background:#fff;border:1px solid #eee7f0;border-radius:15px;padding:1rem;text-align:center}.account-stats strong{display:block;font-size:1.5rem;color:#8d3da5}.account-stats span{font-size:.85rem;color:#746b77}.account-shortcuts{display:grid;grid-template-columns:repeat(5,1fr);gap:.8rem;margin-bottom:1rem}.account-shortcuts a{background:#fff;border:1px solid #eee7f0;border-radius:16px;padding:1rem;min-height:135px;display:flex;flex-direction:column;align-items:center;text-align:center;justify-content:center}.account-shortcuts b{font-size:1.55rem;color:#9a49ae}.account-shortcuts span{font-weight:750;margin:.45rem 0 .15rem}.account-shortcuts small{color:#887f8b;line-height:1.7}.account-panel,.account-form{background:#fff;border:1px solid #eee7f0;border-radius:18px;padding:1.3rem}.account-panel__head{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.account-panel__head h2{font-size:1.1rem;margin:0}.account-order-list article{display:grid;grid-template-columns:1fr auto auto;gap:1rem;align-items:center;padding:.9rem 0;border-bottom:1px solid #f1edf2}.account-order-list article:last-child{border:0}.account-order-list small{display:block;color:#8c838f}.account-order-list em{font-style:normal;background:#f4eef6;padding:.35rem .65rem;border-radius:20px;font-size:.78rem}.account-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.account-form-grid label{display:flex;flex-direction:column;gap:.4rem}.account-form-grid label>span{font-weight:700;font-size:.88rem}.account-form-grid input,.account-form-grid textarea{border:1px solid #ddd3e0;border-radius:11px;padding:.8rem .9rem;font:inherit;background:#fff}.account-form-grid input:disabled{background:#f4f2f4;color:#827a84}.account-form-grid .wide{grid-column:1/-1}.account-form-grid small{color:#857b88}.account-orders{display:grid;gap:1rem}.account-orders article{background:#fff;border:1px solid #eee7f0;border-radius:17px;padding:1.1rem}.account-orders header,.account-orders footer{display:flex;justify-content:space-between;align-items:center;gap:1rem}.account-orders header small{display:block;color:#8b828e;margin-top:.25rem}.account-order-products{display:flex;flex-wrap:wrap;gap:.5rem;padding:1rem 0}.account-order-products span{background:#f7f3f8;border-radius:8px;padding:.4rem .65rem;font-size:.82rem}.order-status{border-radius:20px;padding:.4rem .75rem;background:#f3edf5;font-size:.78rem}.account-empty{background:#fff;border:1px dashed #d9cedd;border-radius:16px;padding:2.5rem;text-align:center;color:#817783}.saved-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.saved-card{position:relative;display:grid;grid-template-columns:130px minmax(0,1fr);background:#fff;border:1px solid #eee7f0;border-radius:17px;overflow:hidden;min-height:140px}.saved-card img{width:100%;height:100%;object-fit:cover}.saved-card>div{padding:1rem}.saved-card>div>span{font-size:.75rem;color:#9750a7}.saved-card h2{font-size:1rem;line-height:1.8;margin:.35rem 0}.saved-card small{color:#8a818d}.favorite-button{position:absolute;top:.75rem;left:.75rem;z-index:5;width:38px;height:38px;display:grid;place-items:center;border:1px solid #eadfeb;border-radius:50%;background:rgba(255,255,255,.94);color:#aaa0aa;font-size:1.2rem;text-decoration:none;cursor:pointer;box-shadow:0 4px 14px rgba(62,37,68,.1)}.favorite-button:hover,.favorite-button.is-favorite{color:#e2264d;border-color:#f4b7c5;background:#fff}.pd-info,.editorial-detail-header,.menu-module-head,.product-card,.editorial-card{position:relative}.pd-info>.favorite-button,.editorial-detail-header>.favorite-button,.menu-module-head>.favorite-button{top:0;left:0}.saved-card .favorite-button{top:.65rem;left:.65rem}.address-page.section{padding:0}.address-page-head{margin-top:0}
@media(max-width:900px){.account-shell{grid-template-columns:1fr}.account-sidebar{position:static}.account-sidebar nav{grid-template-columns:repeat(3,1fr)}.account-sidebar nav a{text-align:center;font-size:.82rem}.account-shortcuts{grid-template-columns:repeat(2,1fr)}.account-stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.account-sidebar nav{grid-template-columns:1fr 1fr}.account-form-grid{grid-template-columns:1fr}.account-form-grid .wide{grid-column:auto}.saved-grid{grid-template-columns:1fr}.saved-card{grid-template-columns:100px minmax(0,1fr)}}

/* Customer order details */
.account-order-summary{display:grid;gap:.2rem}.account-order-summary small{color:#817783}.account-order-details-link{flex:0 0 auto;padding:.55rem 1rem}.account-order-detail-head{display:flex;justify-content:space-between;align-items:center;gap:1rem}.account-order-detail-head .eyebrow{color:#9650a8;font-size:.76rem;font-weight:800}.account-order-detail-actions{display:flex;align-items:center;gap:.65rem}.account-order-detail-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:1rem;align-items:start}.account-order-detail-main,.account-order-detail-side{display:grid;gap:1rem}.account-detail-card{background:#fff;border:1px solid #eee7f0;border-radius:18px;padding:1.25rem;box-shadow:0 8px 28px rgba(74,46,83,.04)}.account-detail-card h2{font-size:1.05rem;margin:0 0 1rem}.account-detail-card-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:.35rem}.account-detail-card-head h2{margin:0}.account-detail-card-head p{margin:.2rem 0 0;color:#887f8b;font-size:.8rem}.account-payment-list{display:grid}.account-payment-list article{display:grid;grid-template-columns:12px minmax(120px,1fr) minmax(130px,1fr) auto auto;gap:.7rem;align-items:center;padding:.8rem 0;border-bottom:1px solid #f0ebf2;font-size:.78rem}.account-payment-list article:last-child{border-bottom:0}.account-payment-list article>div{display:grid;gap:.15rem}.account-payment-list small{color:#8a818d}.account-payment-list code{font-size:.7rem;overflow-wrap:anywhere}.account-payment-state{padding:.3rem .55rem;border-radius:20px;background:#fff1f2;color:#b42335;white-space:nowrap}.account-payment-state.is-success{background:#ecfdf3;color:#18794e}.account-detail-empty{padding:1.25rem;text-align:center;color:#817783;background:#faf8fb;border-radius:12px}.account-order-code-card{display:grid;gap:.45rem;text-align:center}.account-order-code-card>span,.account-order-code-card>small{color:#887f8b}.account-order-code-card>strong{font-size:1.15rem;color:#8d3da5}.account-order-detail-side .customer-info{margin-top:.25rem}
@media(max-width:900px){.account-order-detail-grid{grid-template-columns:1fr}.account-order-detail-side{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.account-order-detail-head{align-items:stretch;flex-direction:column}.account-order-detail-actions{justify-content:space-between}.account-order-detail-side{grid-template-columns:1fr}.account-payment-list article{grid-template-columns:12px 1fr auto}.account-payment-list article>div:nth-of-type(2){grid-column:2/-1}.account-payment-list article>b{grid-column:2}.account-orders footer{align-items:flex-end}}


/* Admin menu tree usability fixes */
.menu-tree-selector { margin-bottom: 1rem; padding: 1rem 1.15rem; }
.menu-tree-selector form { display: grid; grid-template-columns: auto minmax(260px, 460px) auto auto; align-items: end; gap: .7rem; }
.menu-tree-selector label { align-self: center; color: #52647f; font-size: .78rem; font-weight: 800; }
.menu-tree-selector select { min-height: 42px; padding: .65rem .8rem; border: 1px solid var(--line); border-radius: 9px; background: #fff; color: #26364d; font-family: inherit; font-size: .82rem; }
.classic-tree-shell { font-size: 14px; }
.classic-tree { min-height: 430px; overflow: auto; padding: 1.1rem 1.25rem 2rem; }
.classic-tree-list { min-width: max-content; }
.classic-tree-row { min-height: 34px; gap: .55rem; padding: .28rem .35rem; }
.classic-node-name { width: 210px; padding: .28rem .4rem; font-size: .86rem; line-height: 1.7; }
.classic-node-name:focus { width: 270px; }
.root-node > .classic-tree-row .classic-node-name { font-size: .94rem; }
.classic-module { padding: .2rem .55rem; font-size: .7rem; }
.classic-tree-toolbar { display: flex; flex-wrap: wrap; gap: 1px; overflow: visible; }
.classic-tree-toolbar .tree-tool { min-height: 38px; padding-inline: .85rem; font-family: inherit; font-size: .73rem; white-space: nowrap; }

/* Phrase grid: keep operation buttons and full Persian timestamp visible */
.phrase-table { min-width: 1040px; table-layout: auto; }
.phrase-table th:nth-child(5), .phrase-table td:nth-child(5) { width: 175px; min-width: 175px; }
.phrase-table th:last-child, .phrase-table td:last-child { width: 112px; min-width: 112px; }
.phrase-table td:last-child { overflow: visible; }
.phrase-table .grid-actions { display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; gap: .35rem; min-width: 80px; }
.phrase-table .grid-actions form { flex: 0 0 auto; margin: 0; }
.phrase-table .grid-action { flex: 0 0 34px; width: 34px; height: 34px; }
.phrase-table td > small { display: inline-block; font-size: .69rem; direction: rtl; }

@media(max-width:900px) {
  .menu-tree-selector form { grid-template-columns: 1fr 1fr; }
  .menu-tree-selector label, .menu-tree-selector select { grid-column: 1 / -1; }
}


/* Admin dynamic-menu selector and tree — route-safe switching + Persian readability */
.menu-tree-selector__form {
    display: grid;
    grid-template-columns: auto minmax(300px, 500px) auto auto;
    align-items: center;
    gap: .8rem;
}
.menu-tree-selector__form label,
.menu-tree-selector__form select,
.classic-tree-shell,
.classic-tree-shell button,
.classic-tree-shell input,
.classic-tree-shell select {
    font-family: Tahoma, "Segoe UI", Arial, sans-serif !important;
}
.menu-tree-selector__form label {
    color: #34445d;
    font-size: .92rem;
    font-weight: 700;
    white-space: nowrap;
}
.menu-tree-selector__form select {
    width: 100%;
    min-height: 46px;
    padding: .65rem .9rem;
    border: 1px solid #d7deea;
    border-radius: 10px;
    background: #fff;
    color: #21324a;
    font-size: .95rem;
    line-height: 1.8;
}
.classic-tree-shell { font-size: 16px; }
.classic-tree-options { font-size: .88rem; }
.tree-search { width: 290px; height: 42px; border-radius: 7px; }
.tree-search input { font-size: .9rem; }
.classic-tree-toolbar .tree-tool {
    min-height: 42px;
    padding-inline: 1rem;
    font-size: .86rem;
    font-weight: 600;
    line-height: 1.6;
}
.classic-tree-status { font-size: .82rem; padding-block: .65rem; }
.classic-tree { padding: 1.25rem 1.5rem 3rem; }
.classic-tree-row {
    min-height: 42px;
    gap: .7rem;
    padding: .35rem .45rem;
}
.classic-toggle {
    width: 19px;
    height: 19px;
    line-height: 15px;
    font-size: .85rem;
    flex: 0 0 19px;
}
.classic-node-name {
    width: 270px;
    min-height: 34px;
    padding: .3rem .5rem;
    border: 1px solid transparent;
    border-radius: 5px;
    background: transparent;
    color: #174d94;
    font-size: .98rem;
    font-weight: 500;
    line-height: 1.8;
}
.classic-node-name:hover { border-color: #d9dfeb; background: rgba(255,255,255,.72); }
.classic-node-name:focus {
    width: 330px;
    border-color: #8da7d6;
    background: #fff;
    outline: 2px solid rgba(89,120,180,.12);
}
.root-node > .classic-tree-row .classic-node-name {
    font-size: 1.05rem;
    font-weight: 700;
}
.classic-module {
    padding: .28rem .65rem;
    font-size: .78rem;
    line-height: 1.6;
}
.classic-inactive { font-size: .72rem; }
.classic-empty { font-size: .86rem; }
@media (max-width: 1000px) {
    .menu-tree-selector__form { grid-template-columns: 1fr 1fr; }
    .menu-tree-selector__form label,
    .menu-tree-selector__form select { grid-column: 1 / -1; }
}

/* 2026-07-31 final dynamic-menu tree override
   This block intentionally comes last so earlier legacy/menu-tree rules cannot enlarge the controls. */
.admin-body .menu-tree-selector,
.admin-body .classic-tree-shell {
    font-family: Tahoma, "Segoe UI", Arial, sans-serif !important;
}
.admin-body .menu-tree-selector__form label {
    font-size: 12px !important;
    line-height: 1.6 !important;
}
.admin-body .menu-tree-selector__form select {
    min-height: 38px !important;
    padding: 5px 10px !important;
    font-family: inherit !important;
    font-size: 12px !important;
    line-height: 1.6 !important;
}
.admin-body .classic-tree-shell {
    font-size: 12px !important;
}
.admin-body .classic-tree-options,
.admin-body .classic-tree-status {
    font-size: 11px !important;
}
.admin-body .tree-search {
    width: 260px !important;
    height: 36px !important;
    border-radius: 4px !important;
}
.admin-body .tree-search input {
    height: 32px !important;
    padding: 3px 6px !important;
    font-family: inherit !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
}
.admin-body .classic-tree-toolbar .tree-tool {
    min-height: 34px !important;
    padding: 5px 11px !important;
    font-family: inherit !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    line-height: 1.5 !important;
}
.admin-body .classic-tree {
    padding: 12px 10px 32px !important;
}
.admin-body .classic-tree-row {
    min-height: 30px !important;
    gap: 6px !important;
    padding: 1px 3px !important;
}
.admin-body .classic-toggle {
    width: 15px !important;
    height: 15px !important;
    flex: 0 0 15px !important;
    padding: 0 !important;
    font-family: Arial, sans-serif !important;
    font-size: 10px !important;
    line-height: 12px !important;
}
.admin-body .classic-node-name {
    width: 185px !important;
    min-height: 27px !important;
    height: 27px !important;
    padding: 2px 5px !important;
    border-radius: 3px !important;
    font-family: Tahoma, "Segoe UI", Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 21px !important;
}
.admin-body .classic-node-name:focus {
    width: 230px !important;
}
.admin-body .root-node > .classic-tree-row .classic-node-name {
    font-size: 13px !important;
    font-weight: 700 !important;
}
.admin-body .classic-module {
    padding: 2px 7px !important;
    border-radius: 3px !important;
    font-family: Tahoma, "Segoe UI", Arial, sans-serif !important;
    font-size: 10px !important;
    font-weight: 400 !important;
    line-height: 18px !important;
}
.admin-body .classic-inactive,
.admin-body .classic-empty,
.admin-body .tree-id {
    font-family: inherit !important;
    font-size: 10px !important;
}
.admin-body .classic-menu-icon {
    width: 16px !important;
    height: 16px !important;
}

/* Public error pages */
.public-error-page {
    width: 100%;
    min-height: 64vh;
    display: grid;
    place-items: center;
    padding: clamp(3rem, 7vw, 6rem) 1rem;
}
.public-error-card {
    position: relative;
    isolation: isolate;
    width: min(100%, 860px);
    display: grid;
    grid-template-columns: minmax(210px, 250px) minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid rgba(121,87,200,.12);
    border-radius: 32px;
    background: #fff;
    box-shadow: 0 28px 80px rgba(65,43,87,.12);
}
.public-error-art {
    position: relative;
    min-height: 360px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: linear-gradient(150deg,#f3edff 0%,#ffeaf2 100%);
    color: var(--purple);
}
.public-error-art::before,
.public-error-art::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    background: rgba(255,255,255,.58);
}
.public-error-art::before { width: 180px; height: 180px; top: -70px; right: -65px; }
.public-error-art::after { width: 120px; height: 120px; bottom: -45px; left: -35px; }
.public-error-art span {
    position: absolute;
    top: 2rem;
    left: 2rem;
    color: var(--pink);
    font-size: 2rem;
}
.public-error-art b {
    position: relative;
    z-index: 1;
    font-size: clamp(4rem, 7vw, 5.5rem);
    line-height: 1;
    letter-spacing: -.06em;
    text-shadow: 0 12px 30px rgba(121,87,200,.15);
}
.public-error-art small {
    position: relative;
    z-index: 1;
    margin-top: .9rem;
    color: #76678f;
    font-size: .67rem;
    font-weight: 800;
    letter-spacing: .14em;
}
.public-error-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: clamp(2rem, 5vw, 4rem);
    text-align: right;
}
.public-error-content .eyebrow { margin-bottom: .8rem; }
.public-error-content h1 {
    margin: 0 0 .9rem;
    font-size: clamp(1.75rem, 3.2vw, 2.45rem);
    line-height: 1.45;
}
.public-error-content > p {
    max-width: 520px;
    margin: 0;
    color: var(--muted);
    font-size: .98rem;
    line-height: 2;
}
.public-error-trace {
    width: 100%;
    margin-top: 1.25rem;
    padding: .85rem 1rem;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #faf8fd;
}
.public-error-trace span { display: block; margin-bottom: .2rem; color: var(--muted); font-size: .7rem; }
.public-error-trace code { display: block; overflow-wrap: anywhere; color: var(--ink); font-size: .72rem; text-align: left; }
.public-error-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    margin-top: 1.8rem;
}
.public-error-actions .btn { min-width: 150px; padding: .85rem 1.35rem; border-radius: 14px; }

@media (max-width: 700px) {
    .public-error-page { min-height: 58vh; padding: 2rem .85rem 3rem; }
    .public-error-card { grid-template-columns: 1fr; border-radius: 24px; }
    .public-error-art { min-height: 170px; }
    .public-error-art span { top: 1.2rem; left: 1.4rem; }
    .public-error-art b { font-size: 4rem; }
    .public-error-art small { margin-top: .5rem; }
    .public-error-content { align-items: stretch; padding: 2rem 1.35rem; }
    .public-error-content .eyebrow { align-self: flex-start; }
    .public-error-actions { flex-direction: column; }
    .public-error-actions .btn { width: 100%; }
}
