:root {
    --ea-bg: #f7f9fc;
    --ea-bg-strong: #eef4f7;
    --ea-surface: #ffffff;
    --ea-surface-soft: #f9fbfd;
    --ea-border: #dbe4ea;
    --ea-border-strong: #c7d3dc;
    --ea-text: #152033;
    --ea-text-soft: #536275;
    --ea-muted: #778397;
    --ea-primary: #0f766e;
    --ea-primary-hover: #0b625c;
    --ea-primary-soft: #e6f4f1;
    --ea-blue: #2563eb;
    --ea-blue-soft: #eaf1ff;
    --ea-amber: #b7791f;
    --ea-amber-soft: #fff5db;
    --ea-danger: #dc2626;
    --ea-danger-soft: #fff0f0;
    --ea-success: #0f8f5f;
    --ea-radius: 8px;
    --ea-shadow-1: 0 1px 2px rgba(15, 23, 42, .06), 0 1px 3px rgba(15, 23, 42, .08);
    --ea-shadow-2: 0 8px 24px rgba(15, 23, 42, .08);
    --ea-shadow-3: 0 16px 42px rgba(15, 23, 42, .12);
}

html[data-active-theme="enterprise-android"],
html[data-active-theme="enterprise-android"].dark {
    color-scheme: light;
    background: var(--ea-bg) !important;
}

html[data-active-theme="enterprise-android"] body {
    background: var(--ea-bg) !important;
    color: var(--ea-text) !important;
    letter-spacing: 0;
}

html[data-active-theme="enterprise-android"] * {
    letter-spacing: 0 !important;
}

html[data-active-theme="enterprise-android"] ::selection {
    background: rgba(15, 118, 110, .18);
}

html[data-active-theme="enterprise-android"] a {
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

html[data-active-theme="enterprise-android"] .rounded-xl,
html[data-active-theme="enterprise-android"] .rounded-2xl,
html[data-active-theme="enterprise-android"] .rounded-lg,
html[data-active-theme="enterprise-android"] .card,
html[data-active-theme="enterprise-android"] .stat-card,
html[data-active-theme="enterprise-android"] .glass-card,
html[data-active-theme="enterprise-android"] .glass-panel,
html[data-active-theme="enterprise-android"] .table-container {
    border-radius: var(--ea-radius) !important;
}

html[data-active-theme="enterprise-android"] .card,
html[data-active-theme="enterprise-android"] .stat-card,
html[data-active-theme="enterprise-android"] .glass-card,
html[data-active-theme="enterprise-android"] .glass-panel,
html[data-active-theme="enterprise-android"] .table-container,
html[data-active-theme="enterprise-android"] [class*="bg-white"][class*="border"][class*="rounded"] {
    background: var(--ea-surface) !important;
    border-color: var(--ea-border) !important;
    box-shadow: var(--ea-shadow-1) !important;
}

html[data-active-theme="enterprise-android"] .dark\:bg-dark-surface,
html[data-active-theme="enterprise-android"] .dark\:bg-dark-bg,
html[data-active-theme="enterprise-android"] .dark\:bg-slate-900,
html[data-active-theme="enterprise-android"] .dark\:bg-slate-800 {
    background: var(--ea-surface) !important;
}

html[data-active-theme="enterprise-android"] .dark\:text-white,
html[data-active-theme="enterprise-android"] .text-slate-900,
html[data-active-theme="enterprise-android"] .dark\:text-slate-200 {
    color: var(--ea-text) !important;
}

html[data-active-theme="enterprise-android"] .text-slate-500,
html[data-active-theme="enterprise-android"] .text-slate-400,
html[data-active-theme="enterprise-android"] .dark\:text-slate-400,
html[data-active-theme="enterprise-android"] .dark\:text-slate-300 {
    color: var(--ea-muted) !important;
}

html[data-active-theme="enterprise-android"] .border-slate-200,
html[data-active-theme="enterprise-android"] .border-slate-100,
html[data-active-theme="enterprise-android"] .dark\:border-dark-border,
html[data-active-theme="enterprise-android"] .dark\:border-slate-800,
html[data-active-theme="enterprise-android"] .dark\:border-slate-700 {
    border-color: var(--ea-border) !important;
}

html[data-active-theme="enterprise-android"] .bg-slate-50,
html[data-active-theme="enterprise-android"] .dark\:bg-dark-bg {
    background: var(--ea-bg) !important;
}

html[data-active-theme="enterprise-android"] .bg-slate-100,
html[data-active-theme="enterprise-android"] .dark\:bg-slate-700 {
    background: var(--ea-surface-soft) !important;
}

html[data-active-theme="enterprise-android"] .btn,
html[data-active-theme="enterprise-android"] button,
html[data-active-theme="enterprise-android"] a[class*="px-4"][class*="py-2"],
html[data-active-theme="enterprise-android"] .ea-primary-action,
html[data-active-theme="enterprise-android"] .ea-secondary-action,
html[data-active-theme="enterprise-android"] .back-btn,
html[data-active-theme="enterprise-android"] .cart-btn,
html[data-active-theme="enterprise-android"] .submit-btn {
    border-radius: var(--ea-radius) !important;
    font-weight: 700;
    -webkit-tap-highlight-color: transparent;
}

html[data-active-theme="enterprise-android"] .btn-primary,
html[data-active-theme="enterprise-android"] .bg-primary-600,
html[data-active-theme="enterprise-android"] .bg-indigo-600,
html[data-active-theme="enterprise-android"] .bg-emerald-600 {
    background: var(--ea-primary) !important;
    color: #ffffff !important;
    box-shadow: 0 2px 8px rgba(15, 118, 110, .18) !important;
}

html[data-active-theme="enterprise-android"] .btn-primary:hover,
html[data-active-theme="enterprise-android"] .bg-primary-600:hover,
html[data-active-theme="enterprise-android"] .bg-indigo-600:hover,
html[data-active-theme="enterprise-android"] .bg-emerald-600:hover {
    background: var(--ea-primary-hover) !important;
}

html[data-active-theme="enterprise-android"] .btn-secondary,
html[data-active-theme="enterprise-android"] .bg-slate-800,
html[data-active-theme="enterprise-android"] .dark\:bg-slate-700 {
    background: var(--ea-surface) !important;
    border: 1px solid var(--ea-border) !important;
    color: var(--ea-text) !important;
}

html[data-active-theme="enterprise-android"] .bg-red-50,
html[data-active-theme="enterprise-android"] .dark\:bg-red-900\/30,
html[data-active-theme="enterprise-android"] .dark\:bg-red-900\/20 {
    background: var(--ea-danger-soft) !important;
}

html[data-active-theme="enterprise-android"] .bg-amber-50,
html[data-active-theme="enterprise-android"] .dark\:bg-amber-900\/30,
html[data-active-theme="enterprise-android"] .dark\:bg-amber-900\/40 {
    background: var(--ea-amber-soft) !important;
}

html[data-active-theme="enterprise-android"] .bg-emerald-50,
html[data-active-theme="enterprise-android"] .dark\:bg-emerald-900\/30,
html[data-active-theme="enterprise-android"] .dark\:bg-emerald-900\/40 {
    background: var(--ea-primary-soft) !important;
}

html[data-active-theme="enterprise-android"] input,
html[data-active-theme="enterprise-android"] select,
html[data-active-theme="enterprise-android"] textarea,
html[data-active-theme="enterprise-android"] .form-input,
html[data-active-theme="enterprise-android"] .form-select {
    background: var(--ea-surface) !important;
    border-color: var(--ea-border-strong) !important;
    border-radius: var(--ea-radius) !important;
    color: var(--ea-text) !important;
    box-shadow: none !important;
}

html[data-active-theme="enterprise-android"] input:focus,
html[data-active-theme="enterprise-android"] select:focus,
html[data-active-theme="enterprise-android"] textarea:focus,
html[data-active-theme="enterprise-android"] .form-input:focus,
html[data-active-theme="enterprise-android"] .form-select:focus {
    border-color: var(--ea-primary) !important;
    box-shadow: 0 0 0 3px rgba(15, 118, 110, .14) !important;
    outline: none !important;
}

html[data-active-theme="enterprise-android"] input[type="checkbox"]:not(.sr-only),
html[data-active-theme="enterprise-android"] input[type="radio"]:not(.sr-only) {
    accent-color: var(--ea-primary);
    border-color: var(--ea-border-strong) !important;
    background-color: #ffffff !important;
}

html[data-active-theme="enterprise-android"] input[type="checkbox"].sr-only + div[class~="w-11"][class~="h-6"] {
    background: #cbd5e1 !important;
    border: 1px solid #94a3b8 !important;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, .12) !important;
}

html[data-active-theme="enterprise-android"] input[type="checkbox"].sr-only:checked + div[class~="w-11"][class~="h-6"] {
    background: var(--ea-primary) !important;
    border-color: var(--ea-primary) !important;
    box-shadow: 0 0 0 3px rgba(15, 118, 110, .12) !important;
}

html[data-active-theme="enterprise-android"] input[type="checkbox"].sr-only + div[class~="w-11"][class~="h-6"]::after {
    background: #ffffff !important;
    border-color: rgba(15, 23, 42, .18) !important;
    box-shadow: 0 1px 3px rgba(15, 23, 42, .22) !important;
}

html[data-active-theme="enterprise-android"] .badge,
html[data-active-theme="enterprise-android"] [class*="rounded-full"][class*="text-xs"] {
    border-radius: 999px !important;
}

/* Admin layouts */
html[data-active-theme="enterprise-android"] body > .flex.h-full > aside {
    background: var(--ea-surface) !important;
    border-right: 1px solid var(--ea-border) !important;
    box-shadow: 4px 0 20px rgba(15, 23, 42, .04) !important;
}

html[data-active-theme="enterprise-android"] body > .flex.h-full > aside > div:first-child,
html[data-active-theme="enterprise-android"] body > .flex.h-full > aside > div:last-child {
    background: var(--ea-surface) !important;
    border-color: var(--ea-border) !important;
}

html[data-active-theme="enterprise-android"] body > .flex.h-full > aside .text-white,
html[data-active-theme="enterprise-android"] body > .flex.h-full > aside .text-slate-200 {
    color: var(--ea-text) !important;
}

html[data-active-theme="enterprise-android"] body > .flex.h-full > aside .text-slate-400,
html[data-active-theme="enterprise-android"] body > .flex.h-full > aside .text-slate-500,
html[data-active-theme="enterprise-android"] body > .flex.h-full > aside .text-slate-600 {
    color: var(--ea-muted) !important;
}

html[data-active-theme="enterprise-android"] body > .flex.h-full > aside nav a {
    color: var(--ea-text-soft) !important;
    border: 1px solid transparent !important;
    min-height: 42px;
}

html[data-active-theme="enterprise-android"] body > .flex.h-full > aside nav a:hover,
html[data-active-theme="enterprise-android"] body > .flex.h-full > aside nav a[class*="bg-primary"] {
    background: var(--ea-primary-soft) !important;
    border-color: rgba(15, 118, 110, .18) !important;
    color: var(--ea-primary) !important;
}

html[data-active-theme="enterprise-android"] body > .flex.h-full > aside nav svg {
    color: currentColor !important;
    stroke: currentColor !important;
}

html[data-active-theme="enterprise-android"] body > .flex.h-full > aside .bg-primary-500\/20,
html[data-active-theme="enterprise-android"] body > .flex.h-full > aside .border-primary-500\/30,
html[data-active-theme="enterprise-android"] body > .flex.h-full > aside .border-primary-500\/40 {
    background: var(--ea-primary-soft) !important;
    border-color: rgba(15, 118, 110, .22) !important;
}

html[data-active-theme="enterprise-android"] body > .flex.h-full > aside .text-primary-400,
html[data-active-theme="enterprise-android"] body > .flex.h-full > aside .text-primary-500 {
    color: var(--ea-primary) !important;
}

html[data-active-theme="enterprise-android"] body > .flex.h-full > div.flex-1 > header {
    background: rgba(255, 255, 255, .9) !important;
    border-bottom: 1px solid var(--ea-border) !important;
    box-shadow: 0 1px 12px rgba(15, 23, 42, .04) !important;
}

html[data-active-theme="enterprise-android"] body > .flex.h-full > div.flex-1 > main {
    background: var(--ea-bg) !important;
}

html[data-active-theme="enterprise-android"] .page-title,
html[data-active-theme="enterprise-android"] h1,
html[data-active-theme="enterprise-android"] h2,
html[data-active-theme="enterprise-android"] h3 {
    color: var(--ea-text);
}

html[data-active-theme="enterprise-android"] .plugin-store-dark-card h3,
html[data-active-theme="enterprise-android"] .plugin-store-dark-card .plugin-store-dark-title,
html[data-active-theme="enterprise-android"] .plugin-installed-modal .text-white,
html[data-active-theme="enterprise-android"] .plugin-installed-modal h2 {
    color: #ffffff !important;
}

html[data-active-theme="enterprise-android"] .plugin-store-dark-card .plugin-store-dark-copy {
    color: #d1d5db !important;
}

html[data-active-theme="enterprise-android"] .table thead {
    background: var(--ea-surface-soft) !important;
}

html[data-active-theme="enterprise-android"] .table th {
    color: var(--ea-muted) !important;
    font-size: .72rem;
}

html[data-active-theme="enterprise-android"] .table td {
    color: var(--ea-text-soft) !important;
    border-color: var(--ea-border) !important;
}

html[data-active-theme="enterprise-android"] .table tbody tr:hover {
    background: #f3faf8 !important;
}

/* App component layout */
html[data-active-theme="enterprise-android"] body > .min-h-screen > nav {
    background: rgba(255, 255, 255, .92) !important;
    border-color: var(--ea-border) !important;
    box-shadow: 0 1px 12px rgba(15, 23, 42, .04) !important;
}

html[data-active-theme="enterprise-android"] body > .min-h-screen > main {
    background: var(--ea-bg) !important;
}

/* Public portal */
html[data-active-theme="enterprise-android"] .topbar {
    height: 64px;
    background: rgba(255, 255, 255, .94) !important;
    border-bottom: 1px solid var(--ea-border) !important;
    box-shadow: 0 1px 12px rgba(15, 23, 42, .04) !important;
}

html[data-active-theme="enterprise-android"] .topbar-brand .teks {
    color: var(--ea-text) !important;
}

html[data-active-theme="enterprise-android"] .badge-version {
    background: var(--ea-primary-soft) !important;
    border-color: rgba(15, 118, 110, .22) !important;
    color: var(--ea-primary) !important;
}

html[data-active-theme="enterprise-android"] .btn-admin {
    background: var(--ea-surface) !important;
    border-color: var(--ea-border) !important;
    color: var(--ea-text-soft) !important;
}

html[data-active-theme="enterprise-android"] .btn-admin:hover {
    border-color: rgba(15, 118, 110, .32) !important;
    color: var(--ea-primary) !important;
}

html[data-active-theme="enterprise-android"] .hero {
    padding-top: 3rem !important;
}

html[data-active-theme="enterprise-android"] .hero h1 {
    background: none !important;
    -webkit-text-fill-color: currentColor !important;
    /* The portal hero always sits on a dark photo + gradient overlay
       (see .hero::before in portal/home.blade.php) regardless of theme —
       using --ea-text here made the title nearly invisible (dark navy on
       a dark photo). Keep every other theme-specific typography choice,
       just force white for legibility on this specific dark backdrop. */
    color: #fff !important;
    font-size: clamp(2rem, 5vw, 3.25rem) !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
}

html[data-active-theme="enterprise-android"] .hero p {
    color: rgba(255, 255, 255, .82) !important;
    font-size: clamp(1rem, 2.2vw, 1.18rem) !important;
    font-weight: 650 !important;
}

html[data-active-theme="enterprise-android"] .widget-card {
    border-radius: var(--ea-radius) !important;
    border-color: var(--ea-border) !important;
    box-shadow: var(--ea-shadow-1) !important;
}

html[data-active-theme="enterprise-android"] .widget-card:hover {
    transform: translateY(-1px) !important;
    box-shadow: var(--ea-shadow-2) !important;
}

html[data-active-theme="enterprise-android"] .widget-card-header {
    background: var(--ea-surface-soft);
}

html[data-active-theme="enterprise-android"] .widget-icon {
    border-radius: var(--ea-radius) !important;
}

/* Auth */
html[data-active-theme="enterprise-android"] body > div.min-h-screen.flex.flex-col.md\:flex-row > div:first-child {
    background: var(--ea-surface-soft) !important;
    color: var(--ea-text) !important;
    border-right: 1px solid var(--ea-border);
}

html[data-active-theme="enterprise-android"] body > div.min-h-screen.flex.flex-col.md\:flex-row > div:first-child .text-white,
html[data-active-theme="enterprise-android"] body > div.min-h-screen.flex.flex-col.md\:flex-row > div:first-child .text-slate-300,
html[data-active-theme="enterprise-android"] body > div.min-h-screen.flex.flex-col.md\:flex-row > div:first-child .text-slate-400,
html[data-active-theme="enterprise-android"] body > div.min-h-screen.flex.flex-col.md\:flex-row > div:first-child li {
    color: var(--ea-text-soft) !important;
}

html[data-active-theme="enterprise-android"] body > div.min-h-screen.flex.flex-col.md\:flex-row > div:last-child {
    background: var(--ea-surface) !important;
}

html[data-active-theme="enterprise-android"] .bg-grid-pattern {
    background-image: linear-gradient(to right, rgba(15, 118, 110, .08) 1px, transparent 1px),
                      linear-gradient(to bottom, rgba(37, 99, 235, .07) 1px, transparent 1px) !important;
}

/* QR guest ordering */
html[data-active-theme="enterprise-android"] .qr-header {
    background: rgba(255, 255, 255, .96) !important;
    color: var(--ea-text) !important;
    border-bottom: 1px solid var(--ea-border) !important;
    box-shadow: 0 1px 16px rgba(15, 23, 42, .06) !important;
    text-align: left !important;
    padding: calc(env(safe-area-inset-top) + 1rem) 1rem 1rem !important;
}

html[data-active-theme="enterprise-android"] .qr-header h1 {
    font-size: 1.35rem !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
    color: var(--ea-text) !important;
}

html[data-active-theme="enterprise-android"] .qr-header p {
    color: var(--ea-text-soft) !important;
    opacity: 1 !important;
    font-size: .92rem !important;
    font-weight: 650 !important;
}

html[data-active-theme="enterprise-android"] .qr-badge {
    background: var(--ea-primary-soft) !important;
    color: var(--ea-primary) !important;
    border: 1px solid rgba(15, 118, 110, .18);
    backdrop-filter: none !important;
}

html[data-active-theme="enterprise-android"] .ea-guest-context {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    margin: .75rem auto 0;
    max-width: 1200px;
    padding: .75rem 1rem;
    color: var(--ea-text-soft);
    font-size: .78rem;
}

html[data-active-theme="enterprise-android"] .ea-guest-context strong {
    color: var(--ea-primary);
    font-size: .8rem;
}

html[data-active-theme="enterprise-android"] .cat-bar {
    position: sticky;
    top: 73px;
    z-index: 45;
    background: rgba(255, 255, 255, .96) !important;
    border-bottom: 1px solid var(--ea-border) !important;
    box-shadow: 0 1px 10px rgba(15, 23, 42, .03);
}

html[data-active-theme="enterprise-android"] .cat-btn {
    border-color: var(--ea-border) !important;
    color: var(--ea-text-soft) !important;
    background: var(--ea-surface) !important;
    border-radius: 999px !important;
}

html[data-active-theme="enterprise-android"] .cat-btn.active,
html[data-active-theme="enterprise-android"] .cat-btn:hover {
    background: var(--ea-primary-soft) !important;
    border-color: rgba(15, 118, 110, .26) !important;
    color: var(--ea-primary) !important;
}

html[data-active-theme="enterprise-android"] .cat-heading {
    color: var(--ea-text) !important;
    font-size: 1rem !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
}

html[data-active-theme="enterprise-android"] .item-card {
    background: var(--ea-surface) !important;
    border-color: var(--ea-border) !important;
    border-radius: var(--ea-radius) !important;
    box-shadow: var(--ea-shadow-1) !important;
}

html[data-active-theme="enterprise-android"] .item-card:active {
    transform: scale(.99) !important;
}

html[data-active-theme="enterprise-android"] .item-icon {
    border-radius: var(--ea-radius) !important;
    background: var(--ea-blue-soft) !important;
}

html[data-active-theme="enterprise-android"] .item-card.featured {
    border-radius: 20px !important;
    background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%) !important;
}

html[data-active-theme="enterprise-android"] .item-card.featured .item-icon {
    border-radius: 16px !important;
}

html[data-active-theme="enterprise-android"] .item-card.featured .item-name {
    color: var(--ea-text) !important;
    font-size: 1.18rem !important;
    font-weight: 900 !important;
}

html[data-active-theme="enterprise-android"] .item-price,
html[data-active-theme="enterprise-android"] .cart-item-price,
html[data-active-theme="enterprise-android"] .order-item-price {
    color: var(--ea-primary) !important;
}

html[data-active-theme="enterprise-android"] .qty-btn {
    border-radius: 50% !important;
    border-color: var(--ea-border) !important;
    background: var(--ea-surface-soft) !important;
    color: var(--ea-text) !important;
}

html[data-active-theme="enterprise-android"] .qty-btn.add {
    background: var(--ea-primary) !important;
    border-color: var(--ea-primary) !important;
    color: #ffffff !important;
}

html[data-active-theme="enterprise-android"] .cart-bar {
    background: rgba(255, 255, 255, .96) !important;
    border-top: 1px solid var(--ea-border) !important;
    padding-bottom: calc(env(safe-area-inset-bottom) + 1rem) !important;
    box-shadow: 0 -10px 24px rgba(15, 23, 42, .08);
}

html[data-active-theme="enterprise-android"] .cart-btn,
html[data-active-theme="enterprise-android"] .submit-btn,
html[data-active-theme="enterprise-android"] .back-btn {
    background: var(--ea-primary) !important;
    color: #ffffff !important;
    box-shadow: 0 8px 20px rgba(15, 118, 110, .22) !important;
}

html[data-active-theme="enterprise-android"] .cart-badge {
    background: rgba(255, 255, 255, .22) !important;
}

html[data-active-theme="enterprise-android"] .overlay {
    background: rgba(15, 23, 42, .44) !important;
    backdrop-filter: blur(8px);
}

html[data-active-theme="enterprise-android"] .modal {
    border-radius: 20px 20px 0 0 !important;
    border: 1px solid var(--ea-border);
    box-shadow: var(--ea-shadow-3);
}

html[data-active-theme="enterprise-android"] .cart-item,
html[data-active-theme="enterprise-android"] .items-list,
html[data-active-theme="enterprise-android"] .total-row {
    border-color: var(--ea-border) !important;
}

html[data-active-theme="enterprise-android"] .status-title {
    color: var(--ea-text) !important;
}

html[data-active-theme="enterprise-android"] .status-sub {
    color: var(--ea-text-soft) !important;
}

html[data-active-theme="enterprise-android"] .status-pending .status-title {
    color: var(--ea-amber) !important;
}

html[data-active-theme="enterprise-android"] .status-confirmed .status-title {
    color: var(--ea-success) !important;
}

html[data-active-theme="enterprise-android"] .status-rejected .status-title {
    color: var(--ea-danger) !important;
}

/* Enterprise theme native pages */
.ea-public-topbar,
.ea-storefront-bar {
    position: sticky;
    top: 0;
    z-index: 60;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 64px;
    padding: 0 1rem;
    background: rgba(255, 255, 255, .94);
    border-bottom: 1px solid var(--ea-border);
    box-shadow: 0 1px 16px rgba(15, 23, 42, .04);
    backdrop-filter: blur(14px);
}

.ea-public-brand,
.ea-storefront-brand {
    display: inline-flex;
    align-items: center;
    gap: .7rem;
    min-width: 0;
    color: var(--ea-text);
    font-weight: 900;
    font-size: 1.08rem;
    text-decoration: none;
}

.ea-public-brand img {
    width: 34px;
    height: 34px;
    object-fit: contain;
}

.ea-storefront-bar-inner {
    width: min(1120px, 100%);
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.ea-storefront-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    flex: none;
    border-radius: var(--ea-radius);
    background: var(--ea-primary-soft);
    color: var(--ea-primary);
    border: 1px solid rgba(15, 118, 110, .18);
    font-size: .85rem;
}

.ea-public-actions,
.ea-storefront-nav,
.ea-storefront-actions {
    display: flex;
    align-items: center;
    gap: .65rem;
    flex-wrap: wrap;
}

.ea-primary-action,
.ea-secondary-action,
.ea-icon-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    border-radius: var(--ea-radius);
    font-size: .88rem;
    font-weight: 800;
    text-decoration: none;
    transition: transform .16s ease, background .16s ease, border-color .16s ease, color .16s ease;
}

.ea-primary-action {
    padding: 0 1rem;
    background: var(--ea-primary);
    color: #ffffff;
    box-shadow: 0 8px 18px rgba(15, 118, 110, .18);
}

.ea-primary-action:hover {
    background: var(--ea-primary-hover);
    color: #ffffff;
}

.ea-secondary-action {
    padding: 0 1rem;
    background: var(--ea-surface);
    border: 1px solid var(--ea-border);
    color: var(--ea-text);
}

.ea-secondary-action:hover {
    border-color: rgba(15, 118, 110, .3);
    color: var(--ea-primary);
}

.ea-icon-action {
    width: 40px;
    border: 1px solid var(--ea-border);
    background: var(--ea-surface);
    color: var(--ea-text-soft);
}

.ea-icon-action svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
}

.ea-public-main,
.ea-storefront-hero {
    background: linear-gradient(180deg, #ffffff 0%, var(--ea-bg) 100%);
}

.ea-public-hero,
.ea-storefront-hero-inner {
    width: min(1120px, calc(100% - 2rem));
    margin: 0 auto;
    min-height: calc(100vh - 132px);
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 420px);
    align-items: center;
    gap: 2rem;
    padding: 3rem 0 4rem;
}

.ea-kicker {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 .75rem;
    border-radius: 999px;
    background: var(--ea-primary-soft);
    color: var(--ea-primary);
    border: 1px solid rgba(15, 118, 110, .16);
    font-size: .75rem;
    font-weight: 800;
}

.ea-public-copy h1,
.ea-storefront-hero-copy h1 {
    margin: .9rem 0 .8rem;
    max-width: 680px;
    color: var(--ea-text);
    font-size: clamp(2.4rem, 7vw, 5rem);
    line-height: .98;
    font-weight: 900;
    letter-spacing: 0;
}

.ea-public-copy p,
.ea-storefront-hero-copy p {
    max-width: 600px;
    color: var(--ea-text-soft);
    font-size: clamp(1rem, 2vw, 1.16rem);
    font-weight: 650;
    line-height: 1.7;
    margin: 0 0 1.5rem;
}

.ea-public-preview {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .9rem;
}

.ea-public-preview div {
    min-height: 128px;
    border-radius: var(--ea-radius);
    border: 1px solid var(--ea-border);
    background: var(--ea-surface);
    box-shadow: var(--ea-shadow-1);
}

.ea-public-preview div:nth-child(1) {
    background: linear-gradient(180deg, var(--ea-primary-soft), #ffffff);
}

.ea-public-preview div:nth-child(2) {
    background: linear-gradient(180deg, var(--ea-blue-soft), #ffffff);
}

.ea-public-preview div:nth-child(3) {
    background: linear-gradient(180deg, var(--ea-amber-soft), #ffffff);
}

.ea-public-preview div:nth-child(4) {
    background: linear-gradient(180deg, #fff1f2, #ffffff);
}

.ea-storefront-visual {
    display: flex;
    justify-content: center;
}

.ea-phone-shell {
    width: min(320px, 78vw);
    aspect-ratio: 9 / 16;
    border: 10px solid #101827;
    border-radius: 32px;
    background: #ffffff;
    box-shadow: var(--ea-shadow-3);
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.ea-phone-top {
    width: 84px;
    height: 5px;
    border-radius: 999px;
    background: #101827;
    margin: 0 auto .25rem;
}

.ea-menu-preview {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: .5rem;
}

.ea-menu-preview span,
.ea-menu-list i {
    display: block;
    border-radius: var(--ea-radius);
    background: var(--ea-surface-soft);
    border: 1px solid var(--ea-border);
}

.ea-menu-preview span {
    height: 72px;
}

.ea-menu-preview span:nth-child(1) {
    background: var(--ea-primary-soft);
}

.ea-menu-preview span:nth-child(2) {
    background: var(--ea-blue-soft);
}

.ea-menu-preview span:nth-child(3) {
    background: var(--ea-amber-soft);
}

.ea-menu-list {
    display: grid;
    gap: .7rem;
}

.ea-menu-list i {
    height: 58px;
}

.ea-storefront-sections {
    width: min(1120px, calc(100% - 2rem));
    margin: 0 auto;
    padding: 2rem 0 4rem;
    display: grid;
    gap: 2rem;
}

.ea-storefront-section {
    background: var(--ea-surface);
    border: 1px solid var(--ea-border);
    border-radius: var(--ea-radius);
    padding: clamp(1rem, 3vw, 1.5rem);
    box-shadow: var(--ea-shadow-1);
}

.ea-section-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.25rem;
    color: var(--ea-text);
    font-size: 1.2rem;
    font-weight: 800;
}

.ea-empty-panel {
    display: grid;
    gap: .35rem;
    padding: 2rem;
    border: 1px dashed var(--ea-border-strong);
    border-radius: var(--ea-radius);
    background: var(--ea-surface);
    color: var(--ea-text-soft);
    text-align: center;
}

.ea-empty-panel strong {
    color: var(--ea-text);
}

.ea-storefront-footer {
    width: min(1120px, calc(100% - 2rem));
    margin: 0 auto;
    padding: 1.5rem 0 2rem;
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    border-top: 1px solid var(--ea-border);
    color: var(--ea-muted);
    font-size: .84rem;
}

/* Material ripple */
.ea-ripple-host {
    position: relative !important;
    overflow: hidden !important;
}

.ea-ripple {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    transform: scale(0);
    background: rgba(255, 255, 255, .45);
    animation: ea-ripple .5s ease-out forwards;
}

.ea-ripple.dark {
    background: rgba(15, 23, 42, .12);
}

@keyframes ea-ripple {
    to {
        opacity: 0;
        transform: scale(2.6);
    }
}

@media (max-width: 900px) {
    .ea-public-hero,
    .ea-storefront-hero-inner {
        grid-template-columns: 1fr;
        min-height: auto;
        padding-top: 2rem;
    }

    .ea-public-preview,
    .ea-storefront-visual {
        display: none;
    }

    .ea-storefront-footer {
        flex-direction: column;
    }
}

@media (max-width: 640px) {
    html[data-active-theme="enterprise-android"] body {
        font-size: 15px;
    }

    html[data-active-theme="enterprise-android"] .cat-bar {
        top: 72px;
    }

    .ea-public-topbar,
    .ea-storefront-bar {
        padding: 0 .75rem;
    }

    .ea-public-copy h1,
    .ea-storefront-hero-copy h1 {
        font-size: clamp(2.1rem, 14vw, 3.6rem);
    }

    .ea-primary-action,
    .ea-secondary-action {
        width: 100%;
    }

    .ea-storefront-actions {
        width: 100%;
        align-items: stretch;
    }
}
