/*
 * 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-primary: #182c53;
    --site-brand-primary-strong: #11357e;
    --site-brand-primary-deep: #111f3b;
    --site-brand-contrast: #fff;
    --site-brand-divider: rgba(255, 255, 255, 0.65);
    --site-accent: #e67a00;
    --site-accent-hover: #ff8900;

    --site-page-bg: #f5f8fc;
    --site-surface: #fff;
    --site-surface-raised: #edf3fa;
    --site-surface-soft: #f6f8fb;
    --site-surface-inset: #f8fafc;
    --site-text-strong: #182c53;
    --site-text: #263b60;
    --site-text-muted: #52627a;
    --site-text-subtle: #64748b;
    --site-border: #dce3ee;
    --site-divider: #e2e8f0;
    --site-success: #147d59;
    --site-success-surface: #ecfdf5;
    --site-success-border: #a7f3d0;
    --site-danger-text: #b91c1c;
    --site-danger-surface: #fef2f2;
    --site-danger-border: #fecaca;
    --site-card-shadow: 0 4px 24px rgba(0, 31, 91, 0.06);
    --site-field-surface: var(--site-surface-inset);
    --site-field-text: var(--site-text-strong);
    --site-field-placeholder: var(--site-text-subtle);
    --site-field-border: var(--site-border);

    --site-action: var(--site-brand-primary);
    --site-action-hover: var(--site-brand-primary-strong);
    --site-action-contrast: #fff;
    --site-action-rgb: 24, 44, 83;
    --site-action-soft: rgba(24, 44, 83, 0.1);
    --site-action-gradient: linear-gradient(135deg, var(--site-brand-primary), var(--site-brand-primary-strong));
    --site-action-gradient-hover: linear-gradient(135deg, var(--site-brand-primary-strong), var(--site-brand-primary-deep));
    --site-focus-ring: rgba(24, 44, 83, 0.16);
}

html.dark {
    --site-page-bg: #182c53;
    --site-surface: #182c53;
    --site-surface-raised: #1e293b;
    --site-surface-soft: rgb(31, 55, 104);
    --site-surface-inset: #182c53;
    --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-success-surface: rgba(6, 78, 59, 0.25);
    --site-success-border: rgba(16, 185, 129, 0.4);
    --site-danger-text: #fca5a5;
    --site-danger-surface: rgba(127, 29, 29, 0.25);
    --site-danger-border: rgba(220, 38, 38, 0.4);
    --site-card-shadow: none;

    --site-action: var(--site-accent);
    --site-action-hover: var(--site-accent-hover);
    --site-action-contrast: #fff;
    --site-action-rgb: 230, 122, 0;
    --site-action-soft: rgba(230, 122, 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), #e67a00);
    --site-focus-ring: rgba(255, 137, 0, 0.28);
}

/* === Shop theme === */
:root {
    --shop-cart-width: 14rem;
    --shop-cart-icon-start: 1.4rem;
    --shop-cart-icon-travel: 4.5rem;
    --shop-cart-background: #ff8900;
    --shop-cart-foreground: #111f3b;
    --shop-cart-shadow: rgba(24, 44, 83, 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: #111f3b;
    --shop-cart-icon-start: calc(50% - 55px);
    --shop-cart-icon-travel: 40px;
}

.cart-button--prominent {
    --shop-cart-width: 100%;
    --shop-cart-foreground: #111f3b;
    --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, #ff9e2e 0%, var(--site-accent) 100%);
    --site-button-color: #fff;
    --site-button-shadow: 0 4px 20px rgba(230, 122, 0, 0.22);
    --site-button-hover-shadow: 0 8px 26px rgba(230, 122, 0, 0.32);
    --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);
}

/* === Reusable site and shop component colours === */
:root {
    --site-brand-secondary: #11357e;
    --site-brand-muted: rgba(24, 44, 83, 0.66);
    --site-accent-strong: #ff8900;
    --site-accent-deep: #c96900;
    --site-accent-emphasis: #a95400;
    --site-surface-tinted: #fff5e8;
    --site-danger: #ef4444;

    --site-social-icon: #182c53;
    --site-social-facebook: #11357e;
    --site-social-twitter: #11357e;

    --site-auth-backdrop-mid: #fff5e8;
    --site-auth-backdrop-end: #ffe4c2;
    --site-auth-danger-text: #f8a5b0;
    --site-auth-success-text: #8fd9a0;

    --site-theme-toggle-text: #ccc;
    --site-theme-toggle-border: #444;
    --site-theme-toggle-background: #2a2a2a;
    --site-theme-toggle-light-text: #333;
    --site-theme-toggle-light-border: #e67a00;
    --site-theme-toggle-track-end: #ff8900;
    --site-theme-toggle-dark-text: var(--site-brand-contrast);
    --site-theme-toggle-dark-border: var(--site-brand-primary-strong);
    --site-theme-toggle-dark-background: linear-gradient(135deg, var(--site-brand-primary) 0%, var(--site-brand-primary-strong) 100%);
    --site-theme-toggle-dark-hover-background: linear-gradient(135deg, var(--site-brand-primary-strong) 0%, var(--site-brand-primary-deep) 100%);
    --site-theme-toggle-dark-shadow: 0 0 10px rgba(17, 53, 126, 0.6), 0 0 32px rgba(24, 44, 83, 0.38);
    --site-theme-toggle-dark-hover-shadow: 0 0 14px rgba(17, 53, 126, 0.78), 0 0 40px rgba(24, 44, 83, 0.48);

    --site-brands-background: #f0f0f0;
    --site-brands-divider: #182c53;
    --site-brands-banner: #11357e;
    --site-brands-arrow: #182c53;

    --site-surface-deep: #182c53;
    --shop-card-surface-dark: #182c53;
    --shop-card-outline: #dbe1e9;
    --shop-carousel-border: #cbd5e1;
    --shop-carousel-surface-end: #edf2f7;
    --shop-carousel-hover-start: #fff5e8;
    --shop-carousel-hover-end: #ffe0b8;
    --shop-carousel-hover-border: #e67a00;
    --shop-carousel-dark-start: #1e2b3b;
    --shop-carousel-dark-end: #111c2b;
}

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

/* === Authentication layout and animation === */
.auth-shell {
    --c-bg: transparent;
    --c-surface: var(--site-surface);
    --c-border: rgba(24, 44, 83, 0.12);
    --c-text: var(--site-brand-primary);
    --c-muted: rgba(24, 44, 83, 0.55);
    --c-input-bg: var(--site-surface);
    --c-input-border: rgba(24, 44, 83, 0.18);
    --c-glow-primary: rgba(24, 44, 83, 0.18);
    --c-glow-accent: rgba(230, 122, 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-primary: rgba(13, 31, 60, 0.55);
    --c-glow-accent: rgba(230, 122, 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: #f5f8fc;
    --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(24,44,83,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-neutral: #3c4858;
    --acc-neutral-soft: rgba(60,72,88,0.08);
    --acc-neutral-gradient: linear-gradient(135deg, #4b5563 0%, #374151 100%);
    --acc-neutral-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: #e67a00;
    --acc-warning-dark: #c96900;
    --acc-warning-text: #a95400;
    --acc-warning-soft: rgba(230,122,0,0.12);
    --acc-warning-soft-bg: #fff5e8;
    --acc-warning-border: #ffd0a0;
    --acc-accent-primary: #11357e;
    --acc-accent-primary-soft: #eaf0fb;
    --acc-accent-secondary: #e67a00;
    --acc-accent-secondary-soft: rgba(230,122,0,0.12);
}

html.dark {
    --acc-bg: #182c53;
    --acc-card: #11357e;
    --acc-card-soft: #11357e;
    --acc-hover: #15316bd2;
    --acc-input: #11357e;
    --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-neutral: #334155;
    --acc-neutral-soft: rgba(148,163,184,0.14);
    --acc-neutral-gradient: linear-gradient(135deg, #334155 0%, #1e293b 100%);
    --acc-neutral-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: #ff9e2e;
    --acc-warning-dark: #ff8900;
    --acc-warning-text: #ffc078;
    --acc-warning-soft: rgba(230,122,0,0.18);
    --acc-warning-soft-bg: rgba(154,73,0,0.35);
    --acc-warning-border: rgba(255,137,0,0.35);
    --acc-accent-primary: #7ea5f5;
    --acc-accent-primary-soft: rgba(17,53,126,0.28);
    --acc-accent-secondary: #ff9e2e;
    --acc-accent-secondary-soft: rgba(230,122,0,0.20);
}