/*
 * SITE AND SHOP CSS TOKENS
 * Shared site foundations live in --site-*.
 * Reusable catalog, cart and availability styling lives in --shop-*.
 * Component-only layout and animation properties remain locally scoped.
 */

/* === Site theme === */
:root {
    --site-brand-navy: #001f5b;
    --site-brand-navy-dark: #00153d;
    --site-brand-navy-deep: #000d24;
    --site-accent: #ffd100;
    --site-accent-hover: #e5b800;

    --site-page-bg: #f5f8fc;
    --site-surface: #fff;
    --site-surface-raised: #edf3fa;
    --site-surface-soft: #f6f8fb;
    --site-surface-inset: #f8fafc;
    --site-text-strong: #001f5b;
    --site-text: #183354;
    --site-text-muted: #52627a;
    --site-text-subtle: #64748b;
    --site-border: #dce3ee;
    --site-divider: #e2e8f0;
    --site-success: #147d59;

    --site-action: var(--site-brand-navy);
    --site-action-hover: var(--site-brand-navy-dark);
    --site-action-contrast: #fff;
    --site-action-rgb: 0, 31, 91;
    --site-action-soft: rgba(0, 31, 91, 0.1);
    --site-action-gradient: linear-gradient(135deg, var(--site-brand-navy), var(--site-brand-navy-dark));
    --site-action-gradient-hover: linear-gradient(135deg, var(--site-brand-navy-dark), var(--site-brand-navy-deep));
    --site-focus-ring: rgba(0, 31, 91, 0.16);
}

html.dark {
    --site-page-bg: #071426;
    --site-surface: #1e293b;
    --site-surface-raised: #1e293b;
    --site-surface-soft: #172338;
    --site-surface-inset: #0f182a;
    --site-text-strong: #f1f5f9;
    --site-text: #cce5ff;
    --site-text-muted: #b1bdd0;
    --site-text-subtle: #9aaac0;
    --site-border: #334155;
    --site-divider: #2b3950;
    --site-success: #6ee7b7;

    --site-action: var(--site-accent);
    --site-action-hover: var(--site-accent-hover);
    --site-action-contrast: var(--site-brand-navy);
    --site-action-rgb: 255, 209, 0;
    --site-action-soft: rgba(255, 209, 0, 0.16);
    --site-action-gradient: linear-gradient(135deg, var(--site-accent), var(--site-accent-hover));
    --site-action-gradient-hover: linear-gradient(135deg, var(--site-accent-hover), #d4a900);
    --site-focus-ring: rgba(255, 209, 0, 0.18);
}

/* === Shop theme === */
:root {
    --shop-cart-width: 14rem;
    --shop-cart-icon-start: 1.4rem;
    --shop-cart-icon-travel: 4.5rem;
    --shop-cart-background: var(--site-accent);
    --shop-cart-foreground: #161616;
    --shop-cart-shadow: rgba(0, 31, 91, 0.22);
    --shop-cart-success: #10b981;

    --shop-stock-in-bg: #217800;
    --shop-stock-in-text: #fff;
    --shop-stock-order-bg: #353535;
    --shop-stock-order-text: #fff;
    --shop-stock-unavailable-bg: #ffe1e1;
    --shop-stock-unavailable-text: #a01616;

    --shop-card-heading: var(--site-text-strong);
    --shop-card-text: var(--site-text);
    --shop-card-muted: var(--site-text-muted);
    --shop-card-border: var(--site-border);
    --shop-card-control-bg: var(--site-surface-inset);
    --shop-carousel-arrow: var(--site-action);
}

html.dark {
    --shop-carousel-arrow: var(--site-text-strong);
}

.filters-products-layout .products-grid .cart-button:not(.cart-button--prominent) {
    --shop-cart-width: 14rem;
    --shop-cart-icon-start: 1.2rem;
    --shop-cart-icon-travel: 4.4rem;
}

:is(#demo-favourites, .product-list-island .prod-list) .cart-button:not(.cart-button--prominent) {
    --shop-cart-width: 100%;
    --shop-cart-foreground: #102039;
    --shop-cart-icon-start: calc(50% - 55px);
    --shop-cart-icon-travel: 40px;
}

.cart-button--prominent {
    --shop-cart-width: 100%;
    --shop-cart-foreground: #102039;
    --shop-cart-icon-start: calc(50% - 58px);
    --shop-cart-icon-travel: 44px;
}

.featured-products .owl-carousel .owl-nav button:hover:not(.disabled) {
    --shop-carousel-arrow: var(--site-accent);
}

/* === Shared buttons === */
:root {
    --site-button-background: linear-gradient(135deg, var(--site-accent) 0%, var(--site-accent-hover) 100%);
    --site-button-hover-background: linear-gradient(135deg, #ffe566 0%, var(--site-accent) 100%);
    --site-button-color: var(--site-brand-navy-deep);
    --site-button-shadow: 0 4px 20px rgba(255, 209, 0, 0.18);
    --site-button-hover-shadow: 0 8px 26px rgba(255, 209, 0, 0.26);
    --site-button-radius: 12px;
    --site-button-padding: 15px 32px;
    --site-button-focus-color: var(--site-accent);
}

html:not(.dark) .contact-submit {
    --site-button-background: var(--site-action-gradient);
    --site-button-hover-background: var(--site-action-gradient-hover);
    --site-button-color: var(--site-action-contrast);
    --site-button-shadow: 0 4px 20px rgba(var(--site-action-rgb), 0.28);
    --site-button-hover-shadow: 0 8px 26px rgba(var(--site-action-rgb), 0.36);
}

/* === Demo-only effects === */
.promo-card .promo-icon-glow {
    --mega-glow-near: rgba(255, 209, 0, 0.55);
    --mega-glow-far: rgba(255, 209, 0, 0.22);
}

/* === Authentication layout and animation === */
.auth-shell {
    --c-bg: transparent;
    --c-surface: var(--site-surface);
    --c-border: rgba(0, 31, 91, 0.12);
    --c-text: var(--site-brand-navy);
    --c-muted: rgba(0, 31, 91, 0.55);
    --c-input-bg: var(--site-surface);
    --c-input-border: rgba(0, 31, 91, 0.18);
    --c-glow-navy: rgba(0, 31, 91, 0.18);
    --c-glow-gold: rgba(255, 209, 0, 0.35);
    --ease-main: cubic-bezier(0.77, 0, 0.18, 1);
    --dur-switch: 900ms;
    --dur-field: 600ms;
    --container-w: 1520px;
    --container-h: 600px;
    --panel-w: 50%;
    --r-container: 24px;
    --r-input: 14px;
    --r-btn: 14px;
    --space-xs: 8px;
    --space-sm: 16px;
    --space-md: 27px;
    --space-lg: 43px;
    --space-xl: 60px;
}

html.dark .auth-shell {
    --c-surface: var(--site-surface);
    --c-border: var(--site-border);
    --c-text: var(--site-text-strong);
    --c-muted: #94a3b8;
    --c-input-bg: var(--site-surface-inset);
    --c-input-border: var(--site-border);
    --c-glow-navy: rgba(0, 13, 36, 0.55);
    --c-glow-gold: rgba(255, 209, 0, 0.22);
}

.auth-shell .field--stagger {
    --stagger-base: calc(var(--dur-switch) * 0.42);
    --stagger-step: 55ms;
}

@media (max-width: 1180px) {
    .auth-shell {
        --container-w: min(94vw, 1100px);
    }
}

@media (max-width: 980px) {
    .auth-shell {
        --container-w: 100%;
        --container-h: auto;
        --panel-w: 100%;
        --mobile-overlay-h: 210px;
        --mobile-form-h: 580px;
        --space-xl: 30px;
        --space-lg: 22px;
        --space-md: 18px;
        --r-container: 18px;
    }

    .auth-shell .auth-container.active:not(.forgot) {
        --mobile-overlay-h: 460px;
    }
}

@media (max-width: 560px) {
    .auth-shell {
        --mobile-overlay-h: 190px;
        --mobile-form-h: 560px;
        --space-xl: 24px;
        --space-lg: 18px;
        --space-md: 16px;
        --r-input: 12px;
        --r-btn: 12px;
    }
}

/* === resources/core/views/accounts/layouts/accounts.blade.php === */
:root {
    --acc-bg: #f4f7fb;
    --acc-card: #ffffff;
    --acc-card-soft: #f8fafc;
    --acc-hover: #f9fbff;
    --acc-input: #ffffff;
    --acc-panel-header: #fafbfc;
    --acc-tab-track: #eef2f5;
    --acc-chip: #f3f4f6;
    --acc-card-gradient-2: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
    --acc-info-gradient: linear-gradient(135deg, #eff6ff, #f8fafc);
    --acc-heading: #111827;
    --acc-title: #1f2937;
    --acc-text: #374151;
    --acc-text-2: #4b5563;
    --acc-muted: #6b7280;
    --acc-faint: #9ca3af;
    --acc-icon: #94a3b8;
    --acc-placeholder: rgba(0,31,91,0.45);
    --acc-border: #e5e7eb;
    --acc-border-soft: #edf1f5;
    --acc-border-soft-2: #eef2f7;
    --acc-border-faint: #eef1f4;
    --acc-border-input: #dbe2ea;
    --acc-border-input-2: #dbe3ec;
    --acc-border-strong: #d1d5db;
    --acc-slate: #3c4858;
    --acc-slate-soft: rgba(60,72,88,0.08);
    --acc-slate-gradient: linear-gradient(135deg, #4b5563 0%, #374151 100%);
    --acc-slate-gradient-hover: linear-gradient(135deg, #334155 0%, #1e293b 100%);
    --acc-danger: #dc2626;
    --acc-danger-hover: #b91c1c;
    --acc-danger-text: #b91c1c;
    --acc-danger-soft: rgba(239,68,68,0.12);
    --acc-danger-soft-bg: #fef2f2;
    --acc-danger-border: #fee2e2;
    --acc-danger-gradient: linear-gradient(135deg, #dc2626, #b91c1c);
    --acc-success: #059669;
    --acc-success-soft: rgba(16,185,129,0.12);
    --acc-success-soft-bg: #ecfdf5;
    --acc-success-text: #047857;
    --acc-warning: #f59e0b;
    --acc-warning-dark: #ea580c;
    --acc-warning-text: #c2410c;
    --acc-warning-soft: rgba(245,158,11,0.12);
    --acc-warning-soft-bg: #fff7ed;
    --acc-warning-border: #fed7aa;
    --acc-indigo: #4f46e5;
    --acc-indigo-soft: #eef2ff;
    --acc-purple: #8b5cf6;
    --acc-purple-soft: rgba(139,92,246,0.12);
}

html.dark {
    --acc-bg: #0f182a;
    --acc-card: #1e293b;
    --acc-card-soft: #243348;
    --acc-hover: #27364d;
    --acc-input: #162133;
    --acc-panel-header: #243348;
    --acc-tab-track: #243348;
    --acc-chip: #334155;
    --acc-card-gradient-2: linear-gradient(135deg, #1e293b 0%, #243348 100%);
    --acc-info-gradient: linear-gradient(135deg, #1e293b, #243348);
    --acc-heading: #e2e8f0;
    --acc-title: #e2e8f0;
    --acc-text: #cbd5e1;
    --acc-text-2: #cbd5e1;
    --acc-muted: #94a3b8;
    --acc-faint: #64748b;
    --acc-icon: #64748b;
    --acc-placeholder: rgba(226,232,240,0.45);
    --acc-border: #334155;
    --acc-border-soft: #2d3d55;
    --acc-border-soft-2: #2a3a50;
    --acc-border-faint: #2a3a50;
    --acc-border-input: #3d4d66;
    --acc-border-input-2: #3d4d66;
    --acc-border-strong: #475569;
    --acc-slate: #334155;
    --acc-slate-soft: rgba(148,163,184,0.14);
    --acc-slate-gradient: linear-gradient(135deg, #334155 0%, #1e293b 100%);
    --acc-slate-gradient-hover: linear-gradient(135deg, #475569 0%, #334155 100%);
    --acc-danger: #ef4444;
    --acc-danger-hover: #b91c1c;
    --acc-danger-text: #fca5a5;
    --acc-danger-soft: rgba(239,68,68,0.18);
    --acc-danger-soft-bg: rgba(127,29,29,0.38);
    --acc-danger-border: rgba(239,68,68,0.32);
    --acc-danger-gradient: linear-gradient(135deg, #b91c1c, #7f1d1d);
    --acc-success: #34d399;
    --acc-success-soft: rgba(16,185,129,0.18);
    --acc-success-soft-bg: rgba(6,95,70,0.35);
    --acc-success-text: #6ee7b7;
    --acc-warning: #fbbf24;
    --acc-warning-dark: #f97316;
    --acc-warning-text: #fdba74;
    --acc-warning-soft: rgba(245,158,11,0.18);
    --acc-warning-soft-bg: rgba(154,52,18,0.35);
    --acc-warning-border: rgba(251,146,60,0.35);
    --acc-indigo: #818cf8;
    --acc-indigo-soft: rgba(99,102,241,0.20);
    --acc-purple: #a78bfa;
    --acc-purple-soft: rgba(139,92,246,0.20);
}