/* Freshly view layer: full-screen composition for customer journeys. */

body.freshly-v2-auth,
body.freshly-v2-shop,
body.freshly-v2-checkout,
body.freshly-v2-success {
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    color: var(--primitive-text) !important;
    background:
        radial-gradient(circle at 12% 2%, rgba(215, 233, 225, .92), transparent 34%),
        radial-gradient(circle at 88% 24%, rgba(244, 231, 216, .92), transparent 38%),
        var(--primitive-bg) !important;
}

body.freshly-v2-auth {
    display: grid !important;
    grid-template-rows: minmax(0, 1fr) auto !important;
    min-height: 100svh !important;
    height: 100dvh !important;
    overflow: hidden !important;
}

body.freshly-v2-auth .top-bg { display: none !important; }

body.freshly-v2-auth .scroll-container,
body.freshly-v2-auth .pin-layout,
body.freshly-v2-auth .screen.active {
    width: min(100%, 430px) !important;
    margin-inline: auto !important;
    background: rgba(255, 249, 241, .96) !important;
    box-shadow: 0 20px 50px rgba(47, 77, 62, .14) !important;
}

body.freshly-v2-auth .scroll-container {
    min-height: 0 !important;
    padding: 24px 20px 20px !important;
    border-radius: 28px 28px 0 0 !important;
    overflow-y: auto !important;
    scrollbar-width: none !important;
}

body.freshly-v2-auth .scroll-container::-webkit-scrollbar { display: none; }

body.freshly-v2-auth .logo-wrapper {
    margin: 0 auto 16px !important;
    padding: 10px !important;
    width: 108px !important;
    height: 108px !important;
    border-radius: 32px !important;
    background: var(--primitive-bg-mint) !important;
    box-shadow: var(--shadow-card) !important;
}

body.freshly-v2-auth .logo-wrapper img { width: 100% !important; height: 100% !important; }
body.freshly-v2-auth .main-title { font-size: 1.5rem !important; color: var(--primitive-text) !important; letter-spacing: -.03em !important; }
body.freshly-v2-auth .main-subtitle { color: var(--primitive-text-secondary) !important; font-size: .75rem !important; }
body.freshly-v2-auth .divider .line { background: var(--primitive-primary) !important; opacity: .35; }
body.freshly-v2-auth .divider .dot { background: var(--primitive-primary) !important; }

body.freshly-v2-auth .feature-card {
    margin: 20px 0 !important;
    padding: 14px !important;
    border: 1px solid rgba(56, 141, 116, .12) !important;
    border-radius: var(--radius-lg) !important;
    background: var(--primitive-primary-light) !important;
    box-shadow: none !important;
}

body.freshly-v2-auth .feature-icon { background: rgba(255, 249, 241, .85) !important; }
body.freshly-v2-auth .feature-icon .material-symbols-outlined,
body.freshly-v2-auth .feature-text h3 { color: var(--primitive-primary) !important; }
body.freshly-v2-auth .input-label { color: var(--primitive-text) !important; font-size: .75rem !important; }

body.freshly-v2-auth .input-wrapper {
    height: 52px !important;
    border: 1px solid var(--primitive-border) !important;
    border-radius: var(--radius-pill) !important;
    box-shadow: none !important;
}

body.freshly-v2-auth .input-wrapper.focused,
body.freshly-v2-auth .input-wrapper:focus-within {
    border-color: var(--primitive-primary) !important;
    box-shadow: 0 0 0 3px rgba(56, 141, 116, .16) !important;
}

body.freshly-v2-auth .input-icon-box {
    width: 34px !important;
    height: 34px !important;
    margin-right: 10px !important;
    border-radius: 50% !important;
    background: var(--primitive-primary) !important;
}

body.freshly-v2-auth .security-note,
body.freshly-v2-auth .footer-note { color: var(--primitive-text-secondary) !important; }
body.freshly-v2-auth .security-note .material-symbols-outlined,
body.freshly-v2-auth .footer-note .material-symbols-outlined,
body.freshly-v2-auth .footer-note strong { color: var(--primitive-primary) !important; }

body.freshly-v2-auth .member-card {
    border: 1px solid var(--primitive-border) !important;
    border-radius: var(--radius-lg) !important;
    background: var(--primitive-surface-white) !important;
    box-shadow: var(--shadow-card) !important;
}

body.freshly-v2-auth .keypad-section,
body.freshly-v2-auth .pin-bottom {
    width: min(100%, 430px) !important;
    margin-inline: auto !important;
    padding: 14px 16px max(16px, env(safe-area-inset-bottom)) !important;
    background: rgba(255, 249, 241, .97) !important;
    border-radius: 0 0 28px 28px !important;
    box-shadow: 0 -8px 24px rgba(47, 77, 62, .08) !important;
    flex-shrink: 0 !important;
}

body.freshly-v2-auth .keypad-grid,
body.freshly-v2-auth .keypad { gap: 10px !important; max-width: 398px !important; }
body.freshly-v2-auth .key-btn,
body.freshly-v2-auth .key {
    height: 52px !important;
    min-height: 52px !important;
    border: 1px solid var(--primitive-border) !important;
    border-radius: var(--radius-md) !important;
    background: var(--primitive-surface-white) !important;
    box-shadow: var(--shadow-card) !important;
}

body.freshly-v2-auth .key-btn:active,
body.freshly-v2-auth .key:active { background: var(--primitive-primary-light) !important; transform: scale(.98); }
body.freshly-v2-auth .key-num { color: var(--primitive-text) !important; font-size: 1.35rem !important; }
body.freshly-v2-auth .key-letters { color: var(--primitive-text-secondary) !important; }
body.freshly-v2-auth .security-badge { background: var(--primitive-primary-light) !important; color: var(--primitive-primary) !important; }

body.freshly-v2-auth .pin-layout { min-height: 100dvh !important; border-radius: 28px !important; overflow: hidden; }
body.freshly-v2-auth .header { padding: max(16px, env(safe-area-inset-top)) 20px 0 !important; }
body.freshly-v2-auth .back-btn { color: var(--primitive-primary) !important; }
body.freshly-v2-auth .pin-top { padding: 24px 20px !important; }
body.freshly-v2-auth .pin-title,
body.freshly-v2-auth .main-title { color: var(--primitive-text) !important; }
body.freshly-v2-auth .pin-dot,
body.freshly-v2-auth .otp-box { border-color: var(--primitive-primary) !important; }
body.freshly-v2-auth .pin-dot.filled,
body.freshly-v2-auth .otp-box.filled { background: var(--primitive-primary) !important; }

body.freshly-v2-auth .screen.active {
    min-height: 100dvh !important;
    border-radius: 28px !important;
    overflow: hidden !important;
}

body.freshly-v2-auth .info-badge { background: var(--primitive-primary-light) !important; border-color: rgba(56, 141, 116, .16) !important; color: var(--primitive-primary) !important; }
body.freshly-v2-auth .popup-box { border: 1px solid var(--primitive-border) !important; border-radius: var(--radius-xl) !important; background: var(--primitive-surface) !important; box-shadow: var(--shadow-elevated) !important; }

/* Auth component layer: shared visual contracts for NIK, PIN, and phone verification. */
body.freshly-v2-auth .freshly-auth-shell {
    width: min(100%, 430px) !important;
    margin-inline: auto !important;
    border-inline: 1px solid rgba(228, 222, 212, .82) !important;
    background: rgba(255, 249, 241, .96) !important;
}

body.freshly-v2-auth .freshly-auth-scroll {
    min-height: 0 !important;
    padding-inline: clamp(14px, 5vw, 20px) !important;
    padding-block: clamp(14px, 4vw, 24px) 18px !important;
    border-radius: 28px 28px 0 0 !important;
}

body.freshly-v2-auth .freshly-auth-header {
    padding-inline: clamp(16px, 5vw, 24px) !important;
}

body.freshly-v2-auth .freshly-auth-content {
    min-height: 0 !important;
    overflow-y: auto !important;
    scrollbar-width: none !important;
    -webkit-overflow-scrolling: touch;
}

body.freshly-v2-auth .freshly-auth-content::-webkit-scrollbar { display: none; }

body.freshly-v2-auth .freshly-auth-title {
    color: var(--primitive-text) !important;
    letter-spacing: -.035em !important;
}

body.freshly-v2-auth .freshly-input-control {
    min-height: 52px !important;
    background: var(--primitive-surface-white) !important;
    box-shadow: var(--shadow-card) !important;
}

body.freshly-v2-auth .freshly-keypad {
    width: min(100%, 430px) !important;
    margin-inline: auto !important;
    padding-inline: clamp(10px, 4vw, 16px) !important;
    padding-bottom: max(16px, env(safe-area-inset-bottom)) !important;
    border-radius: 0 0 28px 28px !important;
    background: rgba(255, 249, 241, .97) !important;
    box-shadow: 0 -8px 24px rgba(47, 77, 62, .08) !important;
}

body.freshly-v2-auth .freshly-key {
    min-height: 52px !important;
    border: 1px solid var(--primitive-border) !important;
    border-radius: var(--radius-md) !important;
    background: var(--primitive-surface-white) !important;
    box-shadow: var(--shadow-card) !important;
}

body.freshly-v2-auth .freshly-otp-inputs {
    width: min(100%, 300px) !important;
    justify-content: center !important;
    gap: clamp(7px, 2.5vw, 10px) !important;
}

body.freshly-v2-auth .freshly-otp-inputs .otp-box {
    width: clamp(42px, 11vw, 52px) !important;
    height: clamp(52px, 14vw, 62px) !important;
    border-radius: var(--radius-md) !important;
    background: var(--primitive-surface-white) !important;
    box-shadow: var(--shadow-card) !important;
}

body.freshly-v2-auth .freshly-modal .freshly-sheet {
    width: min(calc(100% - 24px), 380px) !important;
    border-radius: var(--radius-2xl) !important;
}

@media (max-width: 430px) {
    body.freshly-v2-auth .freshly-modal { padding: 12px !important; }
    body.freshly-v2-auth .freshly-modal .freshly-sheet { width: 100% !important; }
}

/* NIK entry: minimal premium surface with the keypad kept in its own safe-area row. */
body.freshly-nik-page .scroll-container {
    padding: clamp(16px, 4.5vh, 32px) clamp(18px, 5vw, 24px) 16px !important;
}

body.freshly-nik-page .logo-wrapper {
    width: clamp(82px, 21vw, 96px) !important;
    height: clamp(82px, 21vw, 96px) !important;
    margin-bottom: 12px !important;
    padding: 8px !important;
    border-radius: 28px !important;
}

body.freshly-nik-page .main-title {
    font-size: clamp(1.35rem, 6vw, 1.5rem) !important;
    line-height: 1.16 !important;
}

body.freshly-nik-page .divider,
body.freshly-nik-page .footer-note {
    display: none !important;
}

body.freshly-nik-page .main-subtitle {
    max-width: 240px;
    margin: 10px auto 24px !important;
    font-size: .72rem !important;
    line-height: 1.45 !important;
}

body.freshly-nik-page .input-section {
    margin-bottom: 0 !important;
}

body.freshly-nik-page .input-label {
    margin-bottom: 7px !important;
    font-size: .72rem !important;
}

body.freshly-nik-page .input-wrapper {
    min-height: 54px !important;
    height: 54px !important;
    border-color: rgba(56, 141, 116, .58) !important;
    box-shadow: 0 8px 22px rgba(47, 77, 62, .08) !important;
}

body.freshly-nik-page .input-wrapper.focused {
    box-shadow: 0 0 0 3px rgba(56, 141, 116, .16), 0 8px 22px rgba(47, 77, 62, .08) !important;
}

body.freshly-nik-page .security-note {
    margin: 12px 0 0 !important;
}

body.freshly-nik-page .security-note span:last-child {
    font-size: .65rem;
}

body.freshly-nik-page .member-card {
    margin-top: 12px !important;
    padding: 10px !important;
    border-radius: 14px !important;
}

body.freshly-nik-page .member-avatar {
    width: 32px;
    height: 32px;
}

body.freshly-nik-page .member-info .name { font-size: .75rem; }
body.freshly-nik-page .member-info .dept { font-size: .64rem; }

body.freshly-nik-page .keypad-section {
    padding: 10px 12px max(12px, env(safe-area-inset-bottom)) !important;
    border-top: 1px solid rgba(228, 222, 212, .72);
}

body.freshly-nik-page .keypad-grid {
    max-width: 396px !important;
    gap: 8px !important;
}

body.freshly-nik-page .key-btn {
    height: clamp(46px, 6.4vh, 52px) !important;
    min-height: 46px !important;
    border-radius: 14px !important;
}

body.freshly-nik-page .key-btn.action {
    color: var(--primitive-text-secondary);
}

@media (max-height: 680px) {
    body.freshly-nik-page .scroll-container {
        padding-top: 12px !important;
    }

    body.freshly-nik-page .logo-wrapper {
        width: 76px !important;
        height: 76px !important;
        margin-bottom: 8px !important;
    }

    body.freshly-nik-page .main-subtitle {
        margin-bottom: 16px !important;
    }

    body.freshly-nik-page .security-note {
        margin-top: 8px !important;
    }

    body.freshly-nik-page .keypad-section {
        padding-top: 8px !important;
    }
}

/* History, limit, and tracking surfaces. */
body.freshly-history-page,
body.freshly-limit-page,
body.freshly-tracking-page {
    overflow-x: hidden !important;
}

body.freshly-history-page .freshly-history-shell,
body.freshly-limit-page .freshly-limit-shell,
body.freshly-tracking-page .freshly-tracking-shell {
    width: min(100%, 430px) !important;
    max-width: 430px !important;
    margin-inline: auto !important;
    padding-inline: clamp(14px, 4vw, 20px) !important;
}

body.freshly-history-page .freshly-history-list {
    display: grid;
    gap: 12px;
}

body.freshly-history-page .transaction-card {
    position: relative;
    display: block;
    width: 100%;
    padding: 14px 36px 14px 14px;
    border: 1px solid var(--primitive-border) !important;
    border-radius: 18px !important;
    color: var(--primitive-text);
    background: var(--primitive-surface) !important;
    box-shadow: var(--shadow-card) !important;
    font: inherit;
    text-align: left;
    appearance: none;
    -webkit-appearance: none;
}

body.freshly-history-page .transaction-card:hover {
    border-color: var(--primitive-primary-light) !important;
    box-shadow: var(--shadow-elevated) !important;
    transform: translateY(-1px);
}

body.freshly-history-page .transaction-card:focus-visible {
    outline: 2px solid var(--primitive-primary);
    outline-offset: 3px;
}

body.freshly-history-page .transaction-card-arrow {
    position: absolute;
    top: 50%;
    right: 14px;
    display: grid;
    width: 24px;
    height: 24px;
    place-items: center;
    border-radius: 50%;
    color: var(--primitive-primary-dark);
    background: var(--primitive-primary-light);
    font-size: 9px;
    transform: translateY(-50%);
}

body.freshly-history-page .transaction-tracking {
    margin: 2px 0 13px;
    padding: 10px 10px 9px;
    border: 1px solid rgba(56, 141, 116, .16);
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(215, 233, 225, .72), rgba(255, 249, 241, .92));
}

body.freshly-history-page .transaction-tracking.is-compact {
    margin-top: 0;
}

body.freshly-history-page .tracking-steps {
    display: flex;
    align-items: flex-start;
    width: 100%;
}

body.freshly-history-page .tracking-step {
    display: grid;
    flex: 0 0 auto;
    justify-items: center;
    gap: 4px;
    min-width: 39px;
    color: var(--primitive-muted);
}

body.freshly-history-page .tracking-step-dot {
    display: grid;
    width: 24px;
    height: 24px;
    place-items: center;
    border: 2px solid var(--primitive-border);
    border-radius: 50%;
    color: var(--primitive-muted);
    background: var(--primitive-surface-white);
    font-size: 9px;
}

body.freshly-history-page .tracking-step-label {
    max-width: 58px;
    overflow: hidden;
    font-size: 8px;
    line-height: 1.2;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.freshly-history-page .tracking-step.is-complete,
body.freshly-history-page .tracking-step.is-active {
    color: var(--primitive-primary-dark);
}

body.freshly-history-page .tracking-step.is-complete .tracking-step-dot,
body.freshly-history-page .tracking-step.is-active .tracking-step-dot {
    border-color: var(--primitive-primary);
    color: var(--primitive-surface-white);
    background: var(--primitive-primary);
}

body.freshly-history-page .tracking-step.is-active .tracking-step-dot {
    box-shadow: 0 0 0 4px rgba(56, 141, 116, .14);
}

body.freshly-history-page .tracking-connector {
    flex: 1 1 auto;
    min-width: 10px;
    height: 2px;
    margin: 11px 3px 0;
    background: var(--primitive-border);
}

body.freshly-history-page .tracking-connector.is-complete {
    background: var(--primitive-primary);
}

body.freshly-history-page .tracking-copy {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    margin-top: 7px;
}

body.freshly-history-page .tracking-copy strong {
    color: var(--primitive-primary-dark);
    font-size: 10px;
    font-weight: 800;
}

body.freshly-history-page .tracking-copy span {
    overflow: hidden;
    color: var(--primitive-text-secondary);
    font-size: 9px;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.freshly-history-page .transaction-tracking.is-canceled {
    display: flex;
    align-items: center;
    gap: 9px;
    border-color: rgba(201, 87, 69, .22);
    background: rgba(201, 87, 69, .08);
}

body.freshly-history-page .tracking-canceled-icon {
    display: grid;
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    place-items: center;
    border-radius: 50%;
    color: var(--primitive-error);
    background: rgba(201, 87, 69, .14);
    font-size: 11px;
}

body.freshly-history-page .transaction-tracking.is-canceled .tracking-copy strong { color: var(--primitive-error); }

body.freshly-history-page .history-detail-sheet {
    width: min(100%, 430px) !important;
    max-height: min(92dvh, 760px) !important;
    border-radius: 26px !important;
}

body.freshly-history-page .history-detail-header {
    min-height: 72px;
    padding: 16px 18px 12px;
    background: linear-gradient(145deg, var(--primitive-bg-mint), var(--primitive-surface));
}

body.freshly-history-page .history-detail-kicker,
body.freshly-history-page .history-detail-label {
    display: block;
    margin: 0 0 3px;
    color: var(--primitive-primary-dark);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;
}

body.freshly-history-page .history-detail-header h2 {
    margin: 0;
    color: var(--primitive-text);
    font-size: 17px;
    line-height: 1.2;
}

body.freshly-history-page .history-detail-close {
    display: grid;
    width: 36px;
    height: 36px;
    margin-left: auto;
    place-items: center;
    border: 1px solid var(--primitive-border);
    border-radius: 50%;
    color: var(--primitive-text-secondary);
    background: var(--primitive-surface-white);
    cursor: pointer;
}

body.freshly-history-page .history-detail-body {
    display: grid;
    gap: 12px;
    padding: 14px 16px 16px !important;
}

body.freshly-history-page .history-detail-hero,
body.freshly-history-page .history-detail-tracking,
body.freshly-history-page .history-detail-section,
body.freshly-history-page .history-detail-summary {
    border: 1px solid var(--primitive-border);
    border-radius: 16px;
    background: var(--primitive-surface-white);
}

body.freshly-history-page .history-detail-hero {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 13px;
}

body.freshly-history-page .history-detail-transaction-id {
    display: block;
    color: var(--primitive-text);
    font: 700 12px/1.3 'JetBrains Mono', monospace;
    overflow-wrap: anywhere;
}

body.freshly-history-page .history-detail-date {
    display: block;
    margin-top: 5px;
    color: var(--primitive-text-secondary);
    font-size: 10px;
}

body.freshly-history-page .history-detail-date i { margin-right: 4px; color: var(--primitive-primary); }

body.freshly-history-page .history-detail-tracking,
body.freshly-history-page .history-detail-section,
body.freshly-history-page .history-detail-summary { padding: 12px; }

body.freshly-history-page .history-detail-section-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 10px;
}

body.freshly-history-page .history-detail-section-heading strong {
    display: block;
    color: var(--primitive-text);
    font-size: 12px;
}

body.freshly-history-page .history-detail-section-heading > i {
    color: var(--primitive-primary);
    font-size: 15px;
}

body.freshly-history-page .history-detail-tracking .transaction-tracking {
    margin: 0;
    border: 0;
    padding: 7px 0 0;
}

body.freshly-history-page .history-detail-items {
    display: grid;
    gap: 7px;
}

body.freshly-history-page .history-detail-item {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 8px;
    padding: 8px;
    border-radius: 12px;
    background: var(--primitive-bg-mint);
}

body.freshly-history-page .history-detail-item.is-unavailable {
    color: var(--primitive-error);
    background: rgba(201, 87, 69, .08);
}

body.freshly-history-page .history-detail-item-icon {
    display: grid;
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    place-items: center;
    border-radius: 10px;
    color: var(--primitive-primary-dark);
    background: var(--primitive-primary-light);
    font-size: 11px;
}

body.freshly-history-page .history-detail-item.is-unavailable .history-detail-item-icon { color: var(--primitive-error); background: rgba(201, 87, 69, .14); }
body.freshly-history-page .history-detail-item-copy { min-width: 0; flex: 1 1 auto; }
body.freshly-history-page .history-detail-item-copy strong,
body.freshly-history-page .history-detail-item-copy span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.freshly-history-page .history-detail-item-copy strong { color: var(--primitive-text); font-size: 10px; }
body.freshly-history-page .history-detail-item-copy span { margin-top: 2px; color: var(--primitive-text-secondary); font-size: 9px; }
body.freshly-history-page .history-detail-item-price { flex: 0 0 auto; color: var(--primitive-primary-dark); font-size: 10px; }
body.freshly-history-page .history-detail-item.is-unavailable .history-detail-item-price { color: var(--primitive-error); }

body.freshly-history-page .history-detail-summary {
    display: grid;
    gap: 8px;
    background: var(--primitive-bg-mint);
}

body.freshly-history-page .history-detail-summary > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

body.freshly-history-page .history-detail-summary span { color: var(--primitive-text-secondary); font-size: 10px; }
body.freshly-history-page .history-detail-summary strong { color: var(--primitive-primary-dark); font-size: 13px; }
body.freshly-history-page .history-detail-summary > div + div { padding-top: 8px; border-top: 1px dashed rgba(56, 141, 116, .24); }

body.freshly-history-page .history-detail-footer {
    padding: 12px 16px max(14px, env(safe-area-inset-bottom));
    background: var(--primitive-surface);
}

body.freshly-history-page .history-detail-receipt-btn {
    display: inline-flex;
    width: 100%;
    min-height: 46px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 0;
    border-radius: 14px;
    color: var(--primitive-surface-white);
    background: var(--primitive-primary-dark);
    box-shadow: 0 6px 16px rgba(47, 118, 95, .22);
    font: 800 12px/1 Inter, ui-sans-serif, system-ui, sans-serif;
    cursor: pointer;
}

body.freshly-history-page .history-detail-empty { padding: 16px; color: var(--primitive-muted); font-size: 11px; text-align: center; }

body.freshly-history-page {
    padding-bottom: calc(112px + env(safe-area-inset-bottom)) !important;
}

body.freshly-history-page .freshly-bottom-nav {
    position: fixed !important;
    z-index: 80 !important;
    right: 16px !important;
    bottom: calc(16px + env(safe-area-inset-bottom)) !important;
    left: 16px !important;
    width: min(calc(100% - 32px), 398px) !important;
    margin-inline: auto !important;
    padding: 6px !important;
    border: 1px solid var(--primitive-border) !important;
    border-radius: 22px !important;
    background: rgba(255, 249, 241, .96) !important;
    box-shadow: 0 10px 28px rgba(37, 74, 57, .16) !important;
    backdrop-filter: blur(18px) !important;
    -webkit-backdrop-filter: blur(18px) !important;
}

body.freshly-history-page .freshly-nav-item {
    position: relative;
    display: inline-flex;
    flex: 1 1 0;
    min-width: 44px;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 4px 3px;
    border: 0;
    border-radius: 16px;
    color: var(--primitive-text-secondary);
    background: transparent;
    font: 500 9px/1.2 Inter, ui-sans-serif, system-ui, sans-serif;
    text-decoration: none;
    cursor: pointer;
    transition: color .2s ease, background-color .2s ease, transform .2s ease;
}

body.freshly-history-page .freshly-nav-item svg { flex: 0 0 auto; }
body.freshly-history-page .freshly-nav-item span:last-child { white-space: nowrap; }
body.freshly-history-page .freshly-nav-item:hover { background: rgba(221, 239, 231, .55); }
body.freshly-history-page .freshly-nav-item:active { transform: scale(.95); }
body.freshly-history-page .freshly-nav-item:focus-visible { outline: 2px solid var(--primitive-primary); outline-offset: 2px; }
body.freshly-history-page .freshly-nav-item.is-active {
    color: var(--primitive-primary-dark);
    background: rgba(221, 239, 231, .72);
    font-weight: 800;
}

body.freshly-history-page .freshly-nav-cart {
    flex: 0 0 54px;
    padding: 0;
    background: transparent;
}

body.freshly-history-page .freshly-nav-cart > span:last-child { display: none; }

body.freshly-history-page .freshly-nav-cart-icon {
    position: relative;
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border: 3px solid var(--primitive-surface);
    border-radius: 50%;
    color: #fff;
    background: var(--primitive-primary-dark);
    box-shadow: 0 6px 16px rgba(47, 118, 95, .32);
}

body.freshly-history-page .freshly-nav-badge {
    position: absolute;
    top: -4px;
    right: -4px;
    display: none;
    min-width: 16px;
    height: 16px;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
    border: 2px solid var(--primitive-surface);
    border-radius: 999px;
    color: #fff;
    background: var(--primitive-error);
    font-size: 8px;
    font-weight: 800;
}

body.freshly-history-page .freshly-history-list .transaction-card,
body.freshly-limit-page .freshly-limit-card,
body.freshly-tracking-page .freshly-status-card {
    border: 1px solid var(--primitive-border) !important;
    border-radius: var(--radius-lg) !important;
    background: var(--primitive-surface) !important;
    box-shadow: var(--shadow-card) !important;
}

body.freshly-history-page .freshly-history-modal {
    width: min(100%, 380px) !important;
    max-height: min(92dvh, 720px) !important;
    overflow: hidden !important;
}

body.freshly-history-page .freshly-history-modal .receipt {
    max-width: none !important;
    max-height: none !important;
    flex: 1 1 auto;
    overflow-y: auto;
    border-radius: var(--radius-lg) !important;
    box-shadow: none !important;
}

body.freshly-limit-page .freshly-limit-shell {
    padding-block: 16px !important;
}

body.freshly-limit-page .freshly-sticky-action {
    width: 100% !important;
    min-height: 48px !important;
    border-radius: var(--radius-pill) !important;
}

body.freshly-tracking-page .freshly-tracking-shell {
    padding-block: 16px !important;
}

body.freshly-tracking-page .freshly-status-card {
    padding: 16px !important;
}

@media (max-width: 430px) {
    body.freshly-history-page .freshly-modal { padding: 12px !important; }
    body.freshly-history-page .freshly-history-modal { width: 100% !important; }
}

@media (max-width: 360px) {
    body.freshly-history-page .freshly-bottom-nav { right: 10px !important; left: 10px !important; width: auto !important; padding-inline: 6px !important; }
    body.freshly-history-page .freshly-nav-item { font-size: 8px; }
}

/* Application, catalog, and product-request surfaces. */
body.freshly-application-page .freshly-application-shell,
body.freshly-catalog-page .freshly-catalog-shell,
body.freshly-request-page .freshly-request-shell {
    width: min(100%, 430px) !important;
    max-width: 430px !important;
    margin-inline: auto !important;
}

body.freshly-application-page .freshly-application-shell {
    border-inline: 1px solid var(--primitive-border) !important;
    background: var(--primitive-surface) !important;
    box-shadow: var(--shadow-device) !important;
}

body.freshly-application-page .freshly-limit-card,
body.freshly-application-page .freshly-choice-card,
body.freshly-request-page .freshly-request-card {
    border-color: var(--primitive-border) !important;
    border-radius: var(--radius-lg) !important;
    box-shadow: var(--shadow-card) !important;
}

body.freshly-application-page .freshly-choice-card {
    min-height: 132px;
    background: var(--primitive-surface-white) !important;
}

body.freshly-application-page .freshly-bottom-nav {
    width: min(100%, 430px) !important;
    margin-inline: auto !important;
    border-color: var(--primitive-border) !important;
    background: rgba(255, 249, 241, .94) !important;
}

body.freshly-catalog-page .freshly-catalog-shell {
    padding-inline: clamp(14px, 4vw, 20px) !important;
}

body.freshly-catalog-page {
    overflow-x: hidden !important;
}

body.freshly-catalog-page .header {
    background: linear-gradient(145deg, var(--primitive-bg-mint), var(--primitive-surface)) !important;
    border-bottom: 1px solid var(--primitive-border) !important;
}

body.freshly-catalog-page .header-title h1 {
    color: var(--primitive-text) !important;
}

body.freshly-catalog-page .header-title p {
    color: var(--primitive-text-secondary) !important;
}

body.freshly-catalog-page .header-logo {
    border-color: var(--primitive-border) !important;
    background: var(--primitive-surface-white) !important;
}

body.freshly-catalog-page .freshly-search-control {
    width: min(100%, 430px) !important;
    margin-inline: auto !important;
}

body.freshly-catalog-page .freshly-search-control input,
body.freshly-catalog-page .freshly-search-control .search-input {
    min-height: 44px !important;
    border-color: var(--primitive-border) !important;
    border-radius: var(--radius-pill) !important;
    background: var(--primitive-surface-white) !important;
    box-shadow: var(--shadow-card) !important;
}

body.freshly-catalog-page .freshly-product-grid {
    gap: 12px !important;
}

body.freshly-catalog-page .freshly-product-card {
    overflow: hidden;
    border: 1px solid var(--primitive-border) !important;
    border-radius: var(--radius-md) !important;
    background: var(--primitive-surface) !important;
    box-shadow: var(--shadow-card) !important;
}

body.freshly-request-page .freshly-request-shell {
    padding: 16px clamp(14px, 4vw, 20px) calc(112px + env(safe-area-inset-bottom)) !important;
}

body.freshly-request-page .freshly-request-card {
    background: var(--primitive-surface-white) !important;
}

body.freshly-request-page .freshly-sticky-action {
    width: min(100%, 430px) !important;
    margin-inline: auto !important;
    min-height: 48px !important;
    border-radius: var(--radius-pill) !important;
    background: var(--primitive-primary) !important;
}

body.freshly-request-page .success-overlay {
    padding: 16px !important;
}

body.freshly-request-page .success-card {
    width: min(100%, 360px) !important;
    border: 1px solid var(--primitive-border) !important;
    border-radius: var(--radius-2xl) !important;
    background: var(--primitive-surface) !important;
    box-shadow: var(--shadow-elevated) !important;
}

/* Shop home and cart: product-led, warm, compact, and phone-safe. */
body.freshly-v2-shop { padding-bottom: 0 !important; }
body.freshly-v2-shop #dashboardShell {
    width: min(100%, 430px) !important;
    max-width: 430px !important;
    height: 100dvh !important;
    border: 1px solid rgba(228, 222, 212, .9) !important;
    border-radius: 28px !important;
    background: var(--primitive-surface) !important;
    box-shadow: var(--shadow-device) !important;
}

body.freshly-v2-shop .dashboard-header-gradient {
    padding: 20px 20px 18px !important;
    background: linear-gradient(145deg, var(--primitive-bg-mint), var(--primitive-surface)) !important;
    border-bottom: 1px solid var(--primitive-border) !important;
}

body.freshly-v2-shop .dashboard-header-gradient button,
body.freshly-v2-shop .glass-search-box,
body.freshly-v2-shop .search-input-wrapper {
    border: 1px solid rgba(228, 222, 212, .9) !important;
    background: rgba(255, 249, 241, .84) !important;
    box-shadow: var(--shadow-card) !important;
}

body.freshly-v2-shop #etalaseMain { background: var(--primitive-surface) !important; }
body.freshly-v2-shop .category-tabs { padding: 12px 16px !important; background: var(--primitive-surface) !important; border-bottom: 1px solid var(--primitive-border) !important; }
body.freshly-v2-shop .category-tab { padding: 8px 12px !important; border-color: var(--primitive-border) !important; color: var(--primitive-text-secondary) !important; background: var(--primitive-surface-white) !important; }
body.freshly-v2-shop .category-tab.active { color: #fff !important; background: var(--primitive-primary) !important; border-color: var(--primitive-primary) !important; }
body.freshly-v2-shop .products-grid { padding: 0 16px !important; gap: 12px !important; }
body.freshly-v2-shop .product-card { border-color: rgba(228, 222, 212, .9) !important; border-radius: var(--radius-md) !important; background: var(--primitive-surface) !important; box-shadow: var(--shadow-card) !important; }
body.freshly-v2-shop .product-image { background: var(--primitive-surface-white) !important; }
body.freshly-v2-shop .product-name { color: var(--primitive-text) !important; }
body.freshly-v2-shop .product-price { color: var(--primitive-primary) !important; }
body.freshly-v2-shop .add-to-cart-btn { border-radius: var(--radius-pill) !important; background: var(--primitive-primary) !important; }
body.freshly-v2-shop .modal-overlay { background: rgba(53, 86, 37, .32) !important; backdrop-filter: blur(12px) !important; }
body.freshly-v2-shop .modal-content { border: 1px solid var(--primitive-border) !important; border-radius: 24px 24px 0 0 !important; background: var(--primitive-surface) !important; }
body.freshly-v2-shop .modal-header { border-color: var(--primitive-border) !important; background: var(--primitive-surface) !important; }

/* Checkout and receipt use the same card hierarchy as home. */
body.freshly-v2-checkout { padding-bottom: calc(100px + env(safe-area-inset-bottom)) !important; }
body.freshly-v2-checkout .freshly-checkout-shell,
body.freshly-v2-success .freshly-receipt-shell {
    width: min(100%, 430px) !important;
    max-width: 430px !important;
    margin-inline: auto !important;
}

body.freshly-v2-checkout .freshly-checkout-card,
body.freshly-v2-success .freshly-receipt-card {
    border: 1px solid var(--primitive-border) !important;
    border-radius: var(--radius-lg) !important;
    background: var(--primitive-surface) !important;
    box-shadow: var(--shadow-card) !important;
}

body.freshly-v2-checkout .freshly-checkout-actions,
body.freshly-v2-success .freshly-receipt-actions {
    width: min(100%, 430px) !important;
    margin-inline: auto !important;
    padding-bottom: max(16px, env(safe-area-inset-bottom)) !important;
    border-color: var(--primitive-border) !important;
    background: rgba(255, 249, 241, .95) !important;
    backdrop-filter: blur(16px);
}

body.freshly-v2-checkout .freshly-sticky-action,
body.freshly-v2-success .freshly-receipt-actions .btn-primary {
    min-height: 44px !important;
    border-radius: var(--radius-pill) !important;
    background: var(--primitive-primary) !important;
}

body.freshly-v2-checkout > .bg-white.border-b,
body.freshly-v2-checkout .fixed.bottom-0 { width: min(100%, 430px) !important; margin-inline: auto !important; }
body.freshly-v2-checkout > .bg-white.border-b { border-color: var(--primitive-border) !important; background: rgba(255, 249, 241, .94) !important; backdrop-filter: blur(16px) !important; }
body.freshly-v2-checkout .max-w-2xl { width: min(100%, 430px) !important; max-width: 430px !important; }
body.freshly-v2-checkout .bg-white.rounded-lg,
body.freshly-v2-checkout .bg-gradient-to-br,
body.freshly-v2-checkout .bg-orange-50,
body.freshly-v2-checkout .bg-blue-50 { border-color: var(--primitive-border) !important; border-radius: var(--radius-lg) !important; box-shadow: var(--shadow-card) !important; }
body.freshly-v2-checkout .bg-gradient-to-br { background: var(--primitive-primary-light) !important; }
body.freshly-v2-checkout .bg-green-600 { border-radius: var(--radius-pill) !important; background: var(--primitive-primary) !important; }
body.freshly-v2-checkout .fixed.bottom-0 { padding-bottom: max(16px, env(safe-area-inset-bottom)) !important; border-color: var(--primitive-border) !important; background: rgba(255, 249, 241, .95) !important; }

body.freshly-v2-success { padding-bottom: calc(100px + env(safe-area-inset-bottom)) !important; }
body.freshly-v2-success .receipt-header,
body.freshly-v2-success .receipt-container,
body.freshly-v2-success .footer-buttons { width: min(100%, 430px) !important; margin-inline: auto !important; }
body.freshly-v2-success .receipt-header { margin-top: 16px !important; border: 1px solid var(--primitive-border) !important; border-radius: 22px !important; background: rgba(255, 249, 241, .88) !important; color: var(--primitive-text) !important; box-shadow: var(--shadow-card) !important; }
body.freshly-v2-success .countdown-badge { width: fit-content !important; margin: 10px auto !important; border: 1px solid rgba(217, 154, 50, .24) !important; color: var(--primitive-warning) !important; background: #fff0d1 !important; }
body.freshly-v2-success .receipt-card { border-color: var(--primitive-border) !important; border-radius: 24px !important; background: var(--primitive-surface) !important; box-shadow: var(--shadow-elevated) !important; }
body.freshly-v2-success .store-info { background: var(--primitive-bg-mint) !important; }
body.freshly-v2-success .store-icon { background: var(--primitive-primary) !important; }
body.freshly-v2-success .total-amount,
body.freshly-v2-success .limit-remaining-value { color: var(--primitive-primary) !important; }
body.freshly-v2-success .limit-info-box { border-color: rgba(56, 141, 116, .18) !important; background: var(--primitive-primary-light) !important; }
body.freshly-v2-success .footer-buttons { padding-bottom: max(16px, env(safe-area-inset-bottom)) !important; }
body.freshly-v2-success .footer-buttons .btn-primary { border-radius: var(--radius-pill) !important; background: var(--primitive-primary) !important; }

@media (min-width: 700px) {
    body.freshly-v2-auth,
    body.freshly-v2-shop,
    body.freshly-v2-checkout,
    body.freshly-v2-success { padding-block: 24px !important; }
    body.freshly-v2-auth { grid-template-rows: minmax(0, 1fr) auto !important; }
    body.freshly-v2-auth .scroll-container,
    body.freshly-v2-auth .pin-layout,
    body.freshly-v2-auth .screen.active { border-radius: 28px !important; }
    body.freshly-v2-auth .keypad-section,
    body.freshly-v2-auth .pin-bottom { border-radius: 28px !important; margin-top: 12px !important; }
}

@media (max-width: 430px) {
    body.freshly-v2-auth .scroll-container {
        padding: clamp(14px, 4vw, 22px) clamp(14px, 5vw, 20px) 14px !important;
    }

    body.freshly-v2-auth .logo-wrapper {
        width: clamp(76px, 24vw, 108px) !important;
        height: clamp(76px, 24vw, 108px) !important;
        margin-bottom: clamp(10px, 3vw, 16px) !important;
    }

    body.freshly-v2-auth .main-title { font-size: clamp(1.2rem, 5.5vw, 1.5rem) !important; }
    body.freshly-v2-auth .main-subtitle { margin-bottom: 14px !important; }
    body.freshly-v2-auth .keypad-section,
    body.freshly-v2-auth .pin-bottom { padding-inline: clamp(10px, 4vw, 16px) !important; }
    body.freshly-v2-auth .keypad-grid,
    body.freshly-v2-auth .keypad { gap: clamp(6px, 2vw, 10px) !important; }
    body.freshly-v2-auth .key-btn,
    body.freshly-v2-auth .key {
        height: clamp(44px, 7.2vh, 52px) !important;
        min-height: clamp(44px, 7.2vh, 52px) !important;
    }
}

@media (max-height: 700px) {
    body.freshly-v2-auth .scroll-container { padding-top: 10px !important; }
    body.freshly-v2-auth .logo-wrapper { width: 76px !important; height: 76px !important; margin-bottom: 8px !important; }
    body.freshly-v2-auth .main-title { font-size: 1.2rem !important; }
    body.freshly-v2-auth .main-subtitle { margin-bottom: 10px !important; }
    body.freshly-v2-auth .input-section { margin-bottom: 6px !important; }
    body.freshly-v2-auth .security-note { margin-block: 6px 10px !important; }
}

@media (prefers-reduced-motion: reduce) {
    body.freshly-v2-auth *, body.freshly-v2-shop *, body.freshly-v2-checkout *, body.freshly-v2-success * { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* Dashboard navigation follows the reference composition without touching order logic. */
body.freshly-v2-shop #dashboardShell {
    position: relative !important;
    isolation: isolate;
}

body.freshly-v2-shop #etalaseMain {
    padding-bottom: calc(96px + env(safe-area-inset-bottom)) !important;
}

body.freshly-v2-shop .freshly-bottom-nav {
    position: absolute !important;
    z-index: 80 !important;
    right: 16px !important;
    bottom: max(12px, env(safe-area-inset-bottom)) !important;
    left: 16px !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    border: 1px solid rgba(255, 255, 255, .7) !important;
    border-radius: var(--radius-pill) !important;
    background: rgba(255, 249, 241, .86) !important;
    box-shadow: var(--shadow-elevated) !important;
    backdrop-filter: blur(18px) !important;
    -webkit-backdrop-filter: blur(18px) !important;
}

body.freshly-v2-shop .freshly-nav-item {
    position: relative;
    display: inline-flex;
    flex: 1 1 0;
    min-width: 44px;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 4px 3px;
    border: 0;
    border-radius: 16px;
    color: var(--primitive-text-secondary);
    background: transparent;
    font: 500 9px/1.2 Inter, ui-sans-serif, system-ui, sans-serif;
    cursor: pointer;
    transition: color .2s ease, background-color .2s ease, transform .2s ease;
}

body.freshly-v2-shop .freshly-nav-item svg { flex: 0 0 auto; }
body.freshly-v2-shop .freshly-nav-item span:last-child { white-space: nowrap; }
body.freshly-v2-shop .freshly-nav-item:hover { background: rgba(221, 239, 231, .55); }
body.freshly-v2-shop .freshly-nav-item:active { transform: scale(.95); }
body.freshly-v2-shop .freshly-nav-item:focus-visible { outline: 2px solid var(--primitive-primary); outline-offset: 2px; }
body.freshly-v2-shop .freshly-nav-item.is-active { color: var(--primitive-primary); font-weight: 800; }

body.freshly-v2-shop .freshly-nav-cart-icon {
    position: relative;
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    background: var(--primitive-primary);
    box-shadow: 0 5px 14px rgba(56, 141, 116, .24);
}

body.freshly-v2-shop .freshly-nav-badge {
    position: absolute;
    top: -4px;
    right: -4px;
    display: none;
    min-width: 16px;
    height: 16px;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
    border: 2px solid var(--primitive-surface);
    border-radius: 999px;
    color: #fff;
    background: var(--primitive-error);
    font-size: 8px;
    font-weight: 800;
}

body.freshly-v2-shop .freshly-profile-modal {
    align-items: flex-end !important;
    justify-content: center !important;
    padding: 16px !important;
}

body.freshly-v2-shop .freshly-profile-card {
    width: min(100%, 430px) !important;
    max-width: 430px !important;
    padding: 20px !important;
    border: 1px solid var(--primitive-border) !important;
    border-radius: 24px !important;
    background: var(--primitive-surface) !important;
    box-shadow: var(--shadow-elevated) !important;
    transform: translateY(16px) !important;
    opacity: 0 !important;
    transition: transform .24s ease-out, opacity .2s ease-out !important;
}

body.freshly-v2-shop .freshly-profile-modal.visible .freshly-profile-card {
    transform: translateY(0) !important;
    opacity: 1 !important;
}

body.freshly-v2-shop .freshly-profile-heading {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--primitive-border);
}

body.freshly-v2-shop .freshly-profile-avatar {
    display: grid;
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    place-items: center;
    border-radius: 16px;
    color: var(--primitive-primary);
    background: var(--primitive-primary-light);
}

body.freshly-v2-shop .freshly-profile-kicker {
    margin: 0 0 2px;
    color: var(--primitive-primary);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

body.freshly-v2-shop .freshly-profile-heading h2 {
    margin: 0;
    color: var(--primitive-text);
    font-size: 16px;
    line-height: 1.2;
    font-weight: 800;
}

body.freshly-v2-shop .freshly-profile-heading p:last-child {
    margin: 4px 0 0;
    color: var(--primitive-text-secondary);
    font-size: 11px;
}

body.freshly-v2-shop .freshly-profile-close {
    display: grid;
    width: 36px;
    height: 36px;
    margin-left: auto;
    place-items: center;
    border: 1px solid var(--primitive-border);
    border-radius: 50%;
    color: var(--primitive-text-secondary);
    background: var(--primitive-surface-white);
    cursor: pointer;
}

body.freshly-v2-shop .freshly-profile-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 16px 0 12px;
    padding: 12px 14px;
    border-radius: var(--radius-md);
    color: var(--primitive-text-secondary);
    background: var(--primitive-bg-mint);
    font-size: 11px;
}

body.freshly-v2-shop .freshly-profile-meta strong { color: var(--primitive-text); font-size: 12px; }

body.freshly-v2-shop .freshly-profile-actions { display: grid; gap: 8px; }
body.freshly-v2-shop .freshly-profile-action {
    display: flex;
    min-height: 46px;
    align-items: center;
    gap: 10px;
    padding: 0 14px;
    border: 1px solid var(--primitive-border);
    border-radius: var(--radius-md);
    color: var(--primitive-text);
    background: var(--primitive-surface-white);
    font-size: 12px;
    font-weight: 700;
    text-align: left;
    cursor: pointer;
}

body.freshly-v2-shop .freshly-profile-action i:first-child { width: 18px; color: var(--primitive-primary); text-align: center; }
body.freshly-v2-shop .freshly-profile-action i:last-child { margin-left: auto; color: var(--primitive-muted); font-size: 10px; }
body.freshly-v2-shop .freshly-profile-action.is-danger { color: var(--primitive-error); }
body.freshly-v2-shop .freshly-profile-action.is-danger i:first-child { color: var(--primitive-error); }

@media (max-width: 360px) {
    body.freshly-v2-shop .freshly-bottom-nav { right: 10px !important; left: 10px !important; padding-inline: 6px !important; }
    body.freshly-v2-shop .freshly-nav-item { font-size: 8px; }
}

/* Higher-contrast dashboard palette: still Freshly, but no longer washed out. */
body.freshly-v2-shop {
    --dashboard-bg: #E8F3EC;
    --dashboard-ink: #254A39;
    --dashboard-ink-soft: #5B6F64;
    --dashboard-surface-strong: #FFF9F1;
    --dashboard-border: #C7DED1;
    background:
        radial-gradient(circle at 12% 0%, rgba(177, 224, 202, .88), transparent 34%),
        radial-gradient(circle at 90% 36%, rgba(250, 225, 193, .82), transparent 38%),
        var(--dashboard-bg) !important;
}

body.freshly-v2-shop #dashboardShell {
    border-color: var(--dashboard-border) !important;
    background: var(--dashboard-surface-strong) !important;
}

body.freshly-v2-shop .dashboard-header-gradient {
    background:
        radial-gradient(circle at 88% 14%, rgba(255, 249, 241, .86), transparent 30%),
        linear-gradient(150deg, #B7E2CE 0%, #DFF1E7 54%, #FFF9F1 100%) !important;
    border-bottom-color: var(--dashboard-border) !important;
}

body.freshly-v2-shop .dashboard-header-gradient h1,
body.freshly-v2-shop .dashboard-member-name,
body.freshly-v2-shop .dashboard-header-gradient .text-slate-800,
body.freshly-v2-shop .dashboard-header-gradient .text-slate-900 {
    color: var(--dashboard-ink) !important;
}

body.freshly-v2-shop .dashboard-greeting,
body.freshly-v2-shop .dashboard-header-gradient .text-slate-500 {
    color: var(--dashboard-ink-soft) !important;
}

body.freshly-v2-shop .dashboard-header-gradient button,
body.freshly-v2-shop .glass-search-box,
body.freshly-v2-shop .search-input-wrapper {
    border-color: rgba(56, 141, 116, .28) !important;
    background: rgba(255, 255, 255, .74) !important;
    box-shadow: 0 5px 16px rgba(37, 74, 57, .10) !important;
}

body.freshly-v2-shop #etalaseMain {
    background:
        linear-gradient(180deg, rgba(255, 249, 241, .98), rgba(246, 239, 228, .98)) !important;
}

body.freshly-v2-shop .category-tabs {
    background: rgba(255, 249, 241, .96) !important;
    border-bottom-color: var(--dashboard-border) !important;
}

body.freshly-v2-shop .category-tab {
    color: var(--dashboard-ink-soft) !important;
    background: #FFFFFF !important;
    border-color: var(--dashboard-border) !important;
    box-shadow: 0 2px 8px rgba(37, 74, 57, .05) !important;
}

body.freshly-v2-shop .category-tab.active {
    color: #FFFFFF !important;
    background: var(--primitive-primary-dark) !important;
    border-color: var(--primitive-primary-dark) !important;
    box-shadow: 0 5px 14px rgba(47, 118, 95, .24) !important;
}

body.freshly-v2-shop .product-card {
    border-color: var(--dashboard-border) !important;
    background: rgba(255, 249, 241, .98) !important;
    box-shadow: 0 6px 18px rgba(37, 74, 57, .09) !important;
    transition: transform .2s ease-out, box-shadow .2s ease-out, border-color .2s ease-out !important;
    animation: freshlyDashboardRise .42s ease-out both;
}

body.freshly-v2-shop .product-card:hover {
    border-color: rgba(56, 141, 116, .48) !important;
    box-shadow: 0 10px 24px rgba(37, 74, 57, .14) !important;
}

body.freshly-v2-shop .product-image {
    background: #FFFFFF !important;
    border: 1px solid rgba(199, 222, 209, .64) !important;
}

body.freshly-v2-shop .product-name,
body.freshly-v2-shop .product-card .text-slate-800,
body.freshly-v2-shop .product-card .text-slate-900 {
    color: var(--dashboard-ink) !important;
}

body.freshly-v2-shop .product-price {
    color: var(--primitive-primary-dark) !important;
    font-weight: 800 !important;
}

body.freshly-v2-shop .add-to-cart-btn {
    background: var(--primitive-primary-dark) !important;
    box-shadow: 0 5px 14px rgba(47, 118, 95, .18) !important;
}

body.freshly-v2-shop .freshly-bottom-nav {
    border-color: var(--dashboard-border) !important;
    background: rgba(255, 249, 241, .96) !important;
    box-shadow: 0 10px 28px rgba(37, 74, 57, .16) !important;
}

body.freshly-v2-shop .freshly-nav-item {
    color: var(--dashboard-ink-soft) !important;
}

body.freshly-v2-shop .freshly-nav-item.is-active {
    color: var(--primitive-primary-dark) !important;
    background: rgba(221, 239, 231, .72) !important;
}

body.freshly-v2-shop .freshly-nav-cart {
    flex: 0 0 54px !important;
    padding: 0 !important;
    background: transparent !important;
}

body.freshly-v2-shop .freshly-nav-cart > span:last-child {
    display: none !important;
}

body.freshly-v2-shop .freshly-nav-cart-icon {
    width: 46px !important;
    height: 46px !important;
    border: 3px solid var(--dashboard-surface-strong) !important;
    background: var(--primitive-primary-dark) !important;
    box-shadow: 0 6px 16px rgba(47, 118, 95, .32) !important;
    transition: transform .2s ease-out, box-shadow .2s ease-out !important;
}

body.freshly-v2-shop .freshly-nav-cart:hover .freshly-nav-cart-icon {
    transform: translateY(-2px);
    box-shadow: 0 9px 20px rgba(47, 118, 95, .36) !important;
}

body.freshly-v2-shop .freshly-nav-badge {
    border-color: var(--dashboard-surface-strong) !important;
}

@keyframes freshlyDashboardRise {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
    body.freshly-v2-shop .product-card,
    body.freshly-v2-shop .freshly-nav-cart-icon { animation: none !important; transition: none !important; }
}

/* Shared customer popup primitives. Page markup adds these classes without changing behavior. */
.freshly-modal {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding: 12px;
    background: rgba(37, 74, 57, .38);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

.freshly-modal.freshly-modal--center { align-items: center; }

.freshly-sheet {
    width: min(100%, 430px);
    max-height: min(90dvh, 720px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--primitive-border);
    border-radius: var(--radius-2xl) var(--radius-2xl) var(--radius-xl) var(--radius-xl);
    color: var(--primitive-text);
    background: var(--primitive-surface);
    box-shadow: var(--shadow-elevated);
    transform: translateY(16px);
    opacity: 0;
    transition: transform .24s ease-out, opacity .2s ease-out;
}

.freshly-modal.visible .freshly-sheet,
.freshly-modal.is-open .freshly-sheet,
.freshly-modal.active .freshly-sheet {
    transform: translateY(0);
    opacity: 1;
}

.freshly-modal.freshly-modal--center .freshly-sheet {
    transform: translateY(10px) scale(.98);
}

.freshly-modal.freshly-modal--center.visible .freshly-sheet,
.freshly-modal.freshly-modal--center.is-open .freshly-sheet,
.freshly-modal.freshly-modal--center.active .freshly-sheet {
    transform: translateY(0) scale(1);
}

.freshly-modal-header {
    display: flex;
    min-height: 64px;
    align-items: center;
    gap: 12px;
    padding: 16px 18px;
    border-bottom: 1px solid var(--primitive-border);
    background: rgba(255, 249, 241, .92);
}

.freshly-modal-header h2,
.freshly-modal-header h3 {
    min-width: 0;
    margin: 0;
    color: var(--primitive-text);
    font-size: 16px;
    line-height: 1.25;
    font-weight: 800;
}

.freshly-modal-header p {
    margin: 3px 0 0;
    color: var(--primitive-text-secondary);
    font-size: 11px;
    line-height: 1.45;
}

.freshly-modal-icon {
    display: grid;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    place-items: center;
    border-radius: 14px;
    color: var(--primitive-primary-dark);
    background: var(--primitive-primary-light);
}

.freshly-modal-close {
    display: grid;
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    margin-left: auto;
    place-items: center;
    border: 1px solid var(--primitive-border);
    border-radius: 50%;
    color: var(--primitive-text-secondary);
    background: var(--primitive-surface-white);
    cursor: pointer;
}

.freshly-modal-close:focus-visible,
.freshly-modal button:focus-visible,
.freshly-modal a:focus-visible {
    outline: 2px solid var(--primitive-primary);
    outline-offset: 3px;
}

.freshly-modal-body {
    min-height: 0;
    overflow-y: auto;
    padding: 16px 18px;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

.freshly-modal-body::-webkit-scrollbar { display: none; }

.freshly-modal-footer {
    display: flex;
    gap: 10px;
    padding: 14px 18px max(14px, env(safe-area-inset-bottom));
    border-top: 1px solid var(--primitive-border);
    background: rgba(255, 249, 241, .94);
}

.freshly-modal-footer > button,
.freshly-modal-footer > a,
.freshly-sticky-action {
    min-width: 44px;
    min-height: 44px;
}

.freshly-modal-footer .freshly-btn-primary,
.freshly-sticky-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 0;
    border-radius: var(--radius-pill);
    color: #fff;
    background: var(--primitive-primary-dark);
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
}

.freshly-modal-footer .freshly-btn-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid var(--primitive-border);
    border-radius: var(--radius-pill);
    color: var(--primitive-primary-dark);
    background: var(--primitive-surface-white);
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
}

/* Cart review: keep totals and checkout readable on narrow phones. */
#reviewModal .review-cart-footer {
    flex-direction: column;
    gap: 10px;
    padding: 12px 16px max(12px, env(safe-area-inset-bottom));
}

#reviewModal .review-cart-summary {
    display: flex;
    width: 100%;
    flex-direction: column;
    gap: 4px;
}

#reviewModal .review-cart-total-row,
#reviewModal .review-cart-limit-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    min-width: 0;
}

#reviewModal .review-cart-total-row {
    color: var(--primitive-text-secondary);
    font-size: 12px;
    font-weight: 600;
}

#reviewModal .review-cart-total-row strong {
    color: var(--primitive-text);
    font-size: clamp(17px, 5vw, 20px);
    font-weight: 850;
    white-space: nowrap;
}

#reviewModal .review-cart-limit-row {
    color: var(--primitive-text-secondary);
    font-size: 10px;
    font-weight: 600;
}

#reviewModal .review-cart-limit-row strong {
    color: var(--primitive-primary-dark);
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
}

#reviewModal .review-cart-limit-row strong.is-danger { color: var(--primitive-error); }

#reviewModal .review-cart-checkout-btn {
    width: 100%;
    min-height: 44px;
    flex: 0 0 auto;
    padding: 11px 14px;
    border-radius: var(--radius-pill);
    white-space: nowrap;
}

#reviewModal .cart-item {
    gap: 8px;
    min-width: 0;
}

#reviewModal .cart-item-image {
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    margin-right: 0;
}

#reviewModal .cart-item-info { min-width: 0; }
#reviewModal .cart-item-name { line-height: 1.2; }
#reviewModal .cart-item-qty { flex: 0 0 auto; gap: 4px; }

@media (max-width: 360px) {
    #reviewModal .freshly-modal-header { min-height: 54px; padding-inline: 12px; }
    #reviewModal .freshly-modal-body { padding: 10px 12px; }
    #reviewModal .review-cart-footer { padding-inline: 12px; }
    #reviewModal .cart-item { gap: 5px; padding: 8px; }
    #reviewModal .cart-item-image { flex-basis: 36px; width: 36px; height: 36px; }
    #reviewModal .cart-item-name { font-size: 11px; }
    #reviewModal .cart-item-price { font-size: 11px; }
    #reviewModal .cart-item-qty > div { gap: 2px !important; }
    #reviewModal .cart-item-qty .qty-btn { width: 28px !important; height: 28px !important; }
    #reviewModal .cart-item-qty .qty-value { width: 18px !important; }
    #reviewModal .cart-item-qty .cart-remove-item { margin-left: 2px !important; }
}

.freshly-status-card {
    padding: 13px 14px;
    border: 1px solid var(--primitive-border);
    border-radius: var(--radius-lg);
    color: var(--primitive-text);
    background: var(--primitive-surface-white);
    box-shadow: var(--shadow-card);
}

.freshly-status-card--success { border-color: rgba(47, 155, 114, .28); background: #EEF9F3; }
.freshly-status-card--warning { border-color: rgba(217, 154, 50, .3); background: #FFF7E5; }
.freshly-status-card--error { border-color: rgba(201, 87, 69, .3); background: #FFF0EC; }
.freshly-status-card--muted { color: var(--primitive-text-secondary); background: #F5F1EA; }

@media (max-width: 430px) {
    .freshly-modal { padding: 0; }
    .freshly-sheet {
        width: 100%;
        max-height: min(92dvh, 720px);
        border-radius: var(--radius-2xl) var(--radius-2xl) 0 0;
    }
    .freshly-modal-header { padding-inline: 16px; }
    .freshly-modal-body { padding-inline: 16px; }
    .freshly-modal-footer { padding-inline: 16px; }
}

@media (prefers-reduced-motion: reduce) {
    .freshly-sheet { transition: none; }
}