/* Shared Mami bio med visual system for legacy public templates. */
body:not(.cms-admin) {
    --legacy-shell: min(1320px, calc(100% - 48px));
    --legacy-green: #005b24;
    --legacy-deep: #004b18;
    --legacy-ink: #1a2b22;
    --legacy-muted: #728178;
    --legacy-line: #e5e8e3;
    --legacy-paper: #fdfcf9;
    color: var(--legacy-ink);
    background: var(--legacy-paper);
    font-family: Inter, Manrope, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
}
body:not(.cms-admin) img { max-width: 100%; }
body:not(.cms-admin) a { transition: color .2s ease, border-color .2s ease, background .2s ease, transform .2s ease; }

/* Common page shells */
.about-page,
.info-page,
.returns-page,
.privacy-page,
.vr-page,
.sr-page,
.contacts-page,
.checkout-page,
.payment-page,
.account-container,
.page-404-content {
    width: var(--legacy-shell) !important;
    max-width: 1320px !important;
    margin-inline: auto !important;
    padding: 42px 0 100px !important;
}
.header-placeholder,
.footer-placeholder { min-height: 0 !important; }

/* Breadcrumbs */
.about-breadcrumb,
.info-page-breadcrumb,
.info-breadcrumb,
.returns-breadcrumb,
.privacy-breadcrumb,
.vr-breadcrumb,
.sr-breadcrumb,
.checkout-breadcrumb,
.payment-breadcrumb {
    margin: 0 0 32px !important;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    color: #8a968e !important;
    font-size: 13px !important;
}
.about-breadcrumb a,
.info-page-breadcrumb a,
.info-breadcrumb a,
.returns-breadcrumb a,
.privacy-breadcrumb a,
.vr-breadcrumb a,
.sr-breadcrumb a,
.checkout-breadcrumb a,
.payment-breadcrumb a { color: inherit !important; text-decoration: none; }

/* Typography */
.about-title,
.info-page-title,
.info-title,
.returns-page-title,
.privacy-page-title,
.vr-title,
.sr-title,
.contacts-page > h1,
.checkout-title,
.payment-title,
.account-tab-title,
.page-404-title {
    max-width: 920px;
    margin: 0 0 24px !important;
    color: var(--legacy-ink) !important;
    font: 400 clamp(42px, 5vw, 64px)/1.04 "Inter Tight", Inter, sans-serif !important;
    letter-spacing: -.045em !important;
}
.about-subtitle,
.info-subtitle,
.delivery-section-title,
.payment-card-title,
.returns-panel-title,
.privacy-section-title,
.contacts-heading,
.checkout-section-title,
.payment-section-title,
.settings-section-title {
    color: var(--legacy-ink) !important;
    font-family: "Inter Tight", Inter, sans-serif !important;
    letter-spacing: -.025em;
}
.about-text,
.info-page-intro,
.info-text,
.sr-subtitle {
    max-width: 820px;
    color: var(--legacy-muted) !important;
    font-size: 17px !important;
    line-height: 1.75 !important;
}
.about-page p,
.info-page p,
.returns-content p,
.privacy-content p { color: var(--legacy-muted); line-height: 1.7; }

/* Informational and legal pages */
.about-page,
.info-page { min-height: 60vh; }
.about-page > section,
.info-page > section,
.delivery-section,
.payment-card,
.returns-panel,
.privacy-section,
.privacy-block,
.returns-block,
.returns-info-block {
    border-color: var(--legacy-line) !important;
    border-radius: 20px !important;
    background: #fff !important;
    box-shadow: none !important;
}
.about-page > section,
.info-page > section,
.delivery-section { margin-top: 28px; padding: 30px !important; }
.about-list,
.delivery-list,
.returns-list,
.privacy-list {
    padding-left: 0 !important;
    list-style: none !important;
}
.about-list li,
.delivery-list li,
.returns-list li,
.privacy-list li {
    position: relative;
    margin: 12px 0;
    padding-left: 28px;
    color: var(--legacy-muted);
    line-height: 1.6;
}
.about-list li::before,
.delivery-list li::before,
.returns-list li::before,
.privacy-list li::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: var(--legacy-green);
    font-weight: 800;
}
.step,
.returns-step {
    padding: 20px !important;
    display: grid !important;
    grid-template-columns: 44px minmax(0, 1fr) !important;
    gap: 16px !important;
    border: 1px solid var(--legacy-line) !important;
    border-radius: 16px !important;
    background: #fff !important;
}
.step-num,
.returns-step-num {
    width: 44px !important;
    height: 44px !important;
    display: grid !important;
    place-items: center !important;
    color: #fff !important;
    background: var(--legacy-green) !important;
    border-radius: 50% !important;
}
.payment-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 20px !important;
}
.payment-card { padding: 26px !important; }
.payment-card-icon,
.delivery-section-icon,
.returns-info-icon {
    color: var(--legacy-green) !important;
    background: #eaf5ee !important;
    border-radius: 50% !important;
}
.info-page-footer-note,
.returns-alert,
.privacy-alert {
    padding: 20px 24px !important;
    color: #355744 !important;
    background: #edf7f1 !important;
    border: 1px solid #cfe4d6 !important;
    border-radius: 16px !important;
}

/* Sidebar layouts */
.returns-layout,
.privacy-layout {
    display: grid !important;
    grid-template-columns: 280px minmax(0, 1fr) !important;
    gap: 28px !important;
    align-items: start;
}
.returns-sidebar,
.privacy-sidebar {
    padding: 10px !important;
    position: sticky;
    top: 118px;
    border: 1px solid var(--legacy-line) !important;
    border-radius: 18px !important;
    background: #fff !important;
}
.returns-tab,
.privacy-tab {
    min-height: 48px;
    padding: 10px 12px !important;
    color: #607067 !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: transparent !important;
}
.returns-tab.active,
.privacy-tab.active {
    color: #fff !important;
    background: var(--legacy-deep) !important;
}
.returns-content,
.privacy-content { min-width: 0; }
.returns-panel,
.privacy-section { padding: clamp(22px, 4vw, 42px) !important; }
.privacy-duty-card,
.privacy-term {
    padding: 18px !important;
    border: 1px solid var(--legacy-line) !important;
    border-radius: 14px !important;
    background: #fbfcfa !important;
}

/* Contacts */
.contacts-layout {
    gap: 28px !important;
    margin-top: 34px !important;
}
.checkout-store-display,
.map-container {
    border: 1px solid var(--legacy-line) !important;
    border-radius: 20px !important;
    background: #fff !important;
    box-shadow: none !important;
}
.map-container { overflow: hidden; }

/* Reviews */
.sr-hero {
    padding: 36px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 32px !important;
    border: 1px solid var(--legacy-line) !important;
    border-radius: 24px !important;
    background: linear-gradient(135deg, #edf7f1, #fff) !important;
}
.sr-stat-card,
.sr-card,
.vr-card,
.vr-sidebar {
    border: 1px solid var(--legacy-line) !important;
    border-radius: 18px !important;
    background: #fff !important;
    box-shadow: none !important;
}
.sr-card,
.vr-card { overflow: hidden; transition: transform .2s ease, box-shadow .2s ease; }
.sr-card:hover,
.vr-card:hover { transform: translateY(-2px); box-shadow: 0 14px 30px rgba(23, 54, 34, .08) !important; }
.sr-filter-btn,
.vr-cat-btn {
    border-color: var(--legacy-line) !important;
    border-radius: 999px !important;
    background: #fff !important;
}
.sr-filter-btn.active,
.vr-cat-btn.active {
    color: #fff !important;
    border-color: var(--legacy-green) !important;
    background: var(--legacy-green) !important;
}
.vr-layout { gap: 28px !important; }
.vr-grid { gap: 20px !important; }
.vr-play-btn { color: #fff !important; background: var(--legacy-green) !important; }

/* Checkout, payment and account */
.checkout-layout,
.payment-layout {
    gap: 28px !important;
    align-items: start;
}
.checkout-section,
.payment-section,
.checkout-summary,
.payment-summary,
.account-sidebar,
.account-content,
.bonus-balance-card,
.settings-section {
    border: 1px solid var(--legacy-line) !important;
    border-radius: 20px !important;
    background: #fff !important;
    box-shadow: none !important;
}
.checkout-section,
.payment-section,
.checkout-summary,
.payment-summary,
.account-content,
.settings-section { padding: clamp(20px, 3vw, 30px) !important; }
.checkout-summary,
.payment-summary { position: sticky; top: 118px; }
.checkout-input,
.checkout-textarea,
.settings-input {
    min-height: 48px !important;
    color: var(--legacy-ink) !important;
    border: 1px solid var(--legacy-line) !important;
    border-radius: 12px !important;
    background: #fff !important;
    outline: none !important;
}
.checkout-input:focus,
.checkout-textarea:focus,
.settings-input:focus {
    border-color: #83ac90 !important;
    box-shadow: 0 0 0 3px rgba(0, 91, 36, .08) !important;
}
.checkout-type-tab,
.checkout-delivery-method,
.payment-method,
.checkout-store {
    border-color: var(--legacy-line) !important;
    border-radius: 14px !important;
}
.checkout-type-active,
.checkout-delivery-method:has(input:checked),
.payment-method:has(input:checked),
.checkout-store:has(input:checked) {
    border-color: var(--legacy-green) !important;
    background: #f3faf5 !important;
}
.checkout-btn-pay,
.payment-btn-pay,
.settings-btn-save,
.account-empty-btn,
.checkout-empty-btn,
.receipt-btn-home,
.receipt-btn-orders,
.receipt-btn-whatsapp,
.page-404-btn {
    min-height: 50px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #fff !important;
    background: var(--legacy-deep) !important;
    border: 0 !important;
    border-radius: 999px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}
.account-container {
    display: grid !important;
    grid-template-columns: 290px minmax(0, 1fr) !important;
    gap: 28px !important;
}
.account-sidebar { padding: 18px !important; }
.account-nav-item {
    min-height: 46px;
    border-radius: 12px !important;
}
.account-nav-active {
    color: #fff !important;
    background: var(--legacy-deep) !important;
}
.account-avatar-circle,
.account-empty-icon {
    color: var(--legacy-green) !important;
    background: #eaf5ee !important;
}
.bonus-balance-card {
    color: #fff !important;
    background: linear-gradient(135deg, #075f35, #188354) !important;
}

/* Receipt and empty states */
.receipt-box {
    border: 1px solid var(--legacy-line) !important;
    border-radius: 24px !important;
    box-shadow: 0 20px 60px rgba(18, 60, 38, .12) !important;
}
.receipt-success-icon { color: #fff !important; background: var(--legacy-green) !important; }
.page-404-content {
    min-height: calc(100svh - 200px);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    text-align: center;
}
.page-404-image { max-width: min(520px, 80vw) !important; }
.page-404-desc { max-width: 620px; color: var(--legacy-muted) !important; line-height: 1.65; }

@media (max-width: 900px) {
    body:not(.cms-admin) { --legacy-shell: min(760px, calc(100% - 32px)); }
    .payment-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    .returns-layout,
    .privacy-layout,
    .checkout-layout,
    .payment-layout,
    .account-container { grid-template-columns: minmax(0, 1fr) !important; }
    .returns-sidebar,
    .privacy-sidebar,
    .checkout-summary,
    .payment-summary { position: static; }
    .returns-sidebar,
    .privacy-sidebar {
        display: flex !important;
        overflow-x: auto;
        gap: 6px;
        scrollbar-width: none;
    }
    .returns-tab,
    .privacy-tab { flex: 0 0 auto; }
    .sr-hero { grid-template-columns: minmax(0, 1fr) !important; }
}

@media (max-width: 600px) {
    body:not(.cms-admin) { --legacy-shell: calc(100% - 24px); }
    .about-page,
    .info-page,
    .returns-page,
    .privacy-page,
    .vr-page,
    .sr-page,
    .contacts-page,
    .checkout-page,
    .payment-page,
    .account-container,
    .page-404-content { padding: 24px 0 60px !important; }
    .about-title,
    .info-page-title,
    .info-title,
    .returns-page-title,
    .privacy-page-title,
    .vr-title,
    .sr-title,
    .contacts-page > h1,
    .checkout-title,
    .payment-title,
    .page-404-title {
        font-size: clamp(36px, 11vw, 44px) !important;
        overflow-wrap: anywhere;
    }
    .payment-grid { grid-template-columns: minmax(0, 1fr) !important; }
    .about-page > section,
    .info-page > section,
    .delivery-section,
    .payment-card,
    .returns-panel,
    .privacy-section { padding: 20px !important; }
    .step,
    .returns-step { grid-template-columns: 38px minmax(0, 1fr) !important; padding: 16px !important; }
    .step-num,
    .returns-step-num { width: 38px !important; height: 38px !important; }
    .contacts-layout { grid-template-columns: minmax(0, 1fr) !important; }
    .map-container { height: 340px !important; }
    .sr-hero { padding: 22px !important; }
    .sr-stats { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    .vr-layout { grid-template-columns: minmax(0, 1fr) !important; }
    .vr-sidebar { position: static !important; }
    .checkout-fields { grid-template-columns: minmax(0, 1fr) !important; }
    .receipt-box { width: calc(100% - 20px) !important; border-radius: 18px !important; }
}