:root {
    --cc-green-900: #1b5e20;
    --cc-green-700: #2e7d32;
    --cc-green-500: #43a047;
    --cc-green-300: #81c784;
    --cc-green-200: #a5d6a7;
    --cc-black: #111111;
    --cc-white: #ffffff;
    --cc-surface: #fffefb;
    --cc-background: #f6f7f2;
    --cc-cream: #f2f4e9;
    --cc-border: #e4e9df;
    --cc-shadow: 0 10px 30px rgba(20, 55, 24, .09);
    --cc-shadow-soft: 0 4px 16px rgba(20, 55, 24, .08);
    --cc-radius: 18px;
    --cc-radius-small: 12px;
    --cc-space: 1rem;
}

html, body { background: var(--cc-background); color: var(--cc-black); }
body { font-family: Inter, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; }
.mud-typography-h1,.mud-typography-h2,.mud-typography-h3,.mud-typography-h4,.mud-typography-h5,.mud-typography-h6 { font-weight: 750; letter-spacing: -.025em; }
.mud-button-root { border-radius: 12px; min-height: 42px; font-weight: 700; text-transform: none; letter-spacing: 0; }
.mud-paper, .mud-card { border-radius: var(--cc-radius); }
.mud-paper:not(.mud-appbar), .mud-card { border: 1px solid var(--cc-border); box-shadow: var(--cc-shadow-soft); }
.mud-input-outlined-border { border-radius: var(--cc-radius-small) !important; }
.mud-chip { font-weight: 700; }
.mud-main-content { min-height: 100vh; background: radial-gradient(circle at 100% 5%, rgba(165,214,167,.28), transparent 18rem), var(--cc-background); }
.cc-page-title { margin-bottom: 1.5rem; }
.cc-section-card { background: var(--cc-white); box-shadow: var(--cc-shadow); }

.cc-appbar { background: linear-gradient(110deg, #123f17, var(--cc-green-900) 58%, #287a2e) !important; }
.cc-brand-logo { display: block; width: 220px; max-width: 42vw; height: 52px; }
.cc-desktop-nav { display: flex; align-items: center; }
.cc-cart-button { position: relative; }
.cc-bottom-nav { display: none; }

.app-feature-card { position: relative; overflow: hidden; background: linear-gradient(135deg, var(--cc-white), var(--cc-cream)); }
.app-feature-card::after { content: ""; position: absolute; width: 110px; height: 80px; right: -28px; bottom: -25px; opacity: .12; background: url('../images/branding/leaf-accent.svg') center/contain no-repeat; pointer-events: none; }
.app-feature-card > * { position: relative; z-index: 1; }

.cc-success-hero { position: relative; overflow: hidden; padding: 2.5rem 1.5rem; margin: -2rem -2rem 1.5rem; color: white; text-align: center; background: linear-gradient(135deg, #134819, var(--cc-green-900) 65%, var(--cc-green-500)); border-radius: 0 0 28px 28px; }
.cc-success-hero::after { content: ""; position: absolute; inset: auto -15px -35px auto; width: 150px; height: 110px; background: url('../images/branding/leaf-accent.svg') center/contain no-repeat; opacity: .25; }
.cc-success-hero .mud-typography-root { color: white; }
.cc-price { font-weight: 800; color: var(--cc-green-900); white-space: nowrap; }
.cart-line { background: var(--cc-white); }
.cart-line-main { display: flex; align-items: center; gap: 1rem; min-width: 0; }
.cart-thumb { width: 76px; height: 64px; flex: 0 0 auto; border-radius: 12px; object-fit: cover; background: var(--cc-cream); }
.confirmation-card { overflow: hidden; background: var(--cc-white); }
.device-brand { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.25rem; }
.device-brand > img { width: 88px; height: 88px; flex: 0 0 auto; }
.feature-mark { width: 52px; height: 52px; flex: 0 0 auto; }

[href^="/admin"] + .mud-paper, .mud-main-content .mud-paper { background-color: var(--cc-white); }
.mud-table-container { border-radius: var(--cc-radius); }
.mud-switch-base.mud-checked { color: var(--cc-green-700) !important; }

@media (max-width: 599px) {
    .cc-brand-logo { width: 155px; max-width: 47vw; }
    .cc-desktop-nav { display: none; }
    .mud-main-content { padding-bottom: calc(76px + env(safe-area-inset-bottom)); }
    .cc-bottom-nav { display: grid; grid-template-columns: repeat(4, 1fr); position: fixed; z-index: 1100; left: .75rem; right: .75rem; bottom: calc(.65rem + env(safe-area-inset-bottom)); min-height: 64px; padding: .35rem; border-radius: 24px; background: linear-gradient(110deg, #123f17, var(--cc-green-900)); box-shadow: 0 12px 30px rgba(9,42,13,.28); }
    .cc-bottom-link { position: relative; display: grid; place-items: center; align-content: center; gap: 1px; min-width: 0; min-height: 54px; border-radius: 18px; color: rgba(255,255,255,.78); font-size: .72rem; font-weight: 650; text-decoration: none; }
    .cc-bottom-link.active { color: white; background: rgba(67,160,71,.72); }
    .cc-bottom-link .mud-icon-root { font-size: 1.45rem; }
    .cc-cart-badge { position: absolute; top: 2px; right: calc(50% - 22px); min-width: 18px; height: 18px; padding: 0 4px; border-radius: 10px; color: var(--cc-green-900); background: #dced4a; font-size: .68rem; line-height: 18px; text-align: center; }
    .cc-success-hero { margin: -1.5rem -1rem 1.25rem; padding: 2rem 1rem; }
    .cart-thumb { width: 64px; height: 58px; }
    .device-brand { align-items: flex-start; }
    .device-brand > img { width: 64px; height: 64px; }
}

@media (min-width: 960px) {
    .mud-main-content .mud-container { max-width: 1180px; }
}

@media (prefers-reduced-motion: no-preference) {
    .mud-card, .mud-paper, .mud-button-root { transition: box-shadow .18s ease, transform .18s ease; }
    .mud-button-root:active { transform: translateY(1px); }
}