/* LDM Brand - Bootstrap Theme Overrides & Custom Tokens */

:root {
    /* Override Bootstrap primary/secondary with LDM colors */
    --bs-primary: #003d9b;
    --bs-primary-rgb: 0, 61, 155;
    --bs-secondary: #4648d4;
    --bs-secondary-rgb: 70, 72, 212;
    --bs-success: #22C55E;
    --bs-success-rgb: 34, 197, 94;
    --bs-danger: #EF4444;
    --bs-danger-rgb: 239, 68, 68;

    /* LDM Color Tokens */
    --ldm-primary: #003d9b;
    --ldm-primary-container: #0052cc;
    --ldm-on-primary: #ffffff;
    --ldm-on-primary-container: #c4d2ff;
    --ldm-secondary: #4648d4;
    --ldm-secondary-container: #6063ee;
    --ldm-tertiary: #7b2600;
    --ldm-tertiary-container: #a33500;
    --ldm-surface: #faf8ff;
    --ldm-surface-dim: #d9d9e4;
    --ldm-surface-bright: #faf8ff;
    --ldm-surface-container-lowest: #ffffff;
    --ldm-surface-container-low: #f3f3fd;
    --ldm-surface-container: #ededf8;
    --ldm-surface-container-high: #e7e7f2;
    --ldm-surface-container-highest: #e1e2ec;
    --ldm-surface-variant: #e1e2ec;
    --ldm-background: #faf8ff;
    --ldm-on-background: #191b23;
    --ldm-on-surface: #191b23;
    --ldm-on-surface-variant: #434654;
    --ldm-outline: #737685;
    --ldm-outline-variant: #c3c6d6;
    --ldm-inverse-surface: #2e3038;
    --ldm-inverse-on-surface: #f0f0fb;
    --ldm-inverse-primary: #b2c5ff;
    --ldm-primary-fixed: #dae2ff;
    --ldm-primary-fixed-dim: #b2c5ff;
    --ldm-secondary-fixed: #e1e0ff;
    --ldm-secondary-fixed-dim: #c0c1ff;
    --ldm-urgency-red: #EF4444;
    --ldm-success-green: #22C55E;
    --ldm-loyalty-gold: #F59E0B;
    --ldm-loyalty-silver: #94A3B8;
    --ldm-loyalty-bronze: #CD7F32;
    --ldm-surface-gray: #F8FAFC;

    /* Typography */
    --ldm-font-display: 'Plus Jakarta Sans', sans-serif;
    --ldm-font-body: 'Inter', sans-serif;
}

/* Font overrides */
body {
    font-family: var(--ldm-font-body);
    background-color: var(--ldm-background);
    color: var(--ldm-on-surface);
}

h1, h2, h3, h4, h5, h6,
.display-1, .display-2, .display-3, .display-4,
.display-5, .display-6 {
    font-family: var(--ldm-font-display);
}

/* Bootstrap primary btn override */
.btn-primary {
    --bs-btn-bg: var(--ldm-primary);
    --bs-btn-border-color: var(--ldm-primary);
    --bs-btn-hover-bg: var(--ldm-primary-container);
    --bs-btn-hover-border-color: var(--ldm-primary-container);
    --bs-btn-active-bg: var(--ldm-primary-container);
}

.btn-outline-primary {
    --bs-btn-color: var(--ldm-primary);
    --bs-btn-border-color: var(--ldm-primary);
    --bs-btn-hover-bg: var(--ldm-primary);
}

/* Material Symbols */
.material-symbols-outlined {
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
}

/* Glass effect */
.glass-card {
    background: rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
}

.glass-panel {
    background: rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
}

/* Live pulse animation */
.live-pulse {
    animation: livepulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

@keyframes livepulse {
    0%, 100% { opacity: 1; }
    50% { opacity: .5; }
}

/* LDM Color Utilities */
.bg-ldm-primary { background-color: var(--ldm-primary) !important; }
.bg-ldm-secondary { background-color: var(--ldm-secondary) !important; }
.bg-ldm-urgency-red { background-color: var(--ldm-urgency-red) !important; }
.bg-ldm-success-green { background-color: var(--ldm-success-green) !important; }
.bg-ldm-surface { background-color: var(--ldm-surface) !important; }
.bg-ldm-surface-container { background-color: var(--ldm-surface-container) !important; }
.bg-ldm-surface-container-low { background-color: var(--ldm-surface-container-low) !important; }
.bg-ldm-surface-container-high { background-color: var(--ldm-surface-container-high) !important; }
.bg-ldm-surface-container-highest { background-color: var(--ldm-surface-container-highest) !important; }
.bg-ldm-surface-container-lowest { background-color: var(--ldm-surface-container-lowest) !important; }
.bg-ldm-inverse-surface { background-color: var(--ldm-inverse-surface) !important; }
.bg-ldm-primary-container { background-color: var(--ldm-primary-container) !important; }
.bg-ldm-secondary-container { background-color: var(--ldm-secondary-container) !important; }
.bg-ldm-primary-fixed { background-color: var(--ldm-primary-fixed) !important; }
.bg-ldm-loyalty-gold { background-color: var(--ldm-loyalty-gold) !important; }

.text-ldm-primary { color: var(--ldm-primary) !important; }
.text-ldm-secondary { color: var(--ldm-secondary) !important; }
.text-ldm-on-surface { color: var(--ldm-on-surface) !important; }
.text-ldm-on-surface-variant { color: var(--ldm-on-surface-variant) !important; }
.text-ldm-outline { color: var(--ldm-outline) !important; }
.text-ldm-urgency-red { color: var(--ldm-urgency-red) !important; }
.text-ldm-success-green { color: var(--ldm-success-green) !important; }
.text-ldm-loyalty-gold { color: var(--ldm-loyalty-gold) !important; }
.text-ldm-on-primary { color: var(--ldm-on-primary) !important; }
.text-ldm-inverse-on-surface { color: var(--ldm-inverse-on-surface) !important; }
.text-ldm-primary-fixed-dim { color: var(--ldm-primary-fixed-dim) !important; }
.text-ldm-on-primary-container { color: var(--ldm-on-primary-container) !important; }

.border-ldm-outline-variant { border-color: var(--ldm-outline-variant) !important; }
.border-ldm-primary { border-color: var(--ldm-primary) !important; }

/* Status badge */
.status-badge {
    font-size: 12px;
    line-height: 16px;
    font-weight: 700;
    font-family: var(--ldm-font-body);
}

/* Urgency top bar */
.urgency-bar {
    background-color: var(--ldm-urgency-red);
    color: white;
}

/* Navbar blur */
.navbar-blur {
    background: rgba(250, 248, 255, 0.8) !important;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-bottom: 1px solid rgba(195, 198, 214, 0.3) !important;
}

/* Brand text */
.ldm-brand {
    font-family: var(--ldm-font-display);
    font-weight: 800;
    letter-spacing: -0.02em;
    color: var(--ldm-primary);
}

/* Rounded pill buttons */
.btn-pill {
    border-radius: 9999px !important;
}

/* Rounded card */
.card-xl {
    border-radius: 1.5rem !important;
}
.card-xxl {
    border-radius: 2rem !important;
}

/* Custom scrollbar */
.custom-scrollbar::-webkit-scrollbar { width: 4px; }
.custom-scrollbar::-webkit-scrollbar-track { background: transparent; }
.custom-scrollbar::-webkit-scrollbar-thumb { background: #c3c6d6; border-radius: 10px; }

/* Sidebar active item */
.sidebar-active {
    background-color: var(--ldm-primary-fixed) !important;
    color: var(--ldm-primary) !important;
    font-weight: 700;
}

/* Progress bar color */
.progress-bar-ldm {
    background-color: var(--ldm-primary-container);
}

/* Metric card hover */
.metric-card {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.metric-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 20px rgba(0,0,0,0.05) !important;
}

/* Flash sale hover overlay */
.flash-sale-card .buy-overlay {
    opacity: 0;
    transform: translateY(4px);
    transition: all 0.3s ease;
}
.flash-sale-card:hover .buy-overlay {
    opacity: 1;
    transform: translateY(0);
}