/* Core Design Tokens & Dynamic Theme Classes */
@font-face {
    font-family: 'IBM Plex Sans';
    font-style: normal;
    font-weight: 300;
    font-stretch: 100%;
    font-display: swap;
    src: url(https://fonts.gstatic.com/s/ibmplexsans/v23/zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxTKYbABA.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

:root {
    color-scheme: light;
    --primary: var(--theme-primary, #0b1a2a);
    --primary-dk: var(--theme-primary-dk, #081421);
    --primary-lt: var(--theme-secondary, #142a3f);
    --secondary: #f4f1e9;
    --secondary-dk: #e8e2d4;
    --secondary-lt: #fbf8f1;
    --accent: var(--theme-primary, #0b1a2a);
    --accent-lt: var(--theme-secondary, #142a3f);
    --c-primary: var(--primary);
    --c-primary-dk: var(--primary-dk);
    --c-primary-lt: var(--primary-lt);
    --c-secondary: var(--secondary);
    --c-secondary-dk: var(--secondary-dk);
    --c-secondary-lt: var(--secondary-lt);
    --c-accent: var(--accent);
    --c-accent-lt: var(--accent-lt);
    --grad-warm: var(--primary);
    --grad-cool: var(--primary);
    --grad-hero: rgba(11, 26, 42, .85);
    --grad-cta: var(--primary);
    --c-bg: #e8e2d4;
    --c-bg-alt: #ffffff;
    --c-surface: #ffffff;
    --c-border: #cbd5e1;
    --c-gray-300: #e2e8f0;
    --c-gray-500: #64748b;
    --c-text: #0b1a2a;
    --c-text-muted: #64748b;
    --f-display: "Space Grotesk", system-ui, sans-serif;
    --f-body: "IBM Plex Sans", system-ui, sans-serif;
    --sp-xs: .5rem;
    --sp-sm: 1rem;
    --sp-md: 2rem;
    --sp-lg: 3.5rem;
    --sp-xl: 6rem;
    --r-sm: 0;
    --r-md: 0;
    --r-lg: 0;
    --r-xl: 0;
    --shadow-sm: 0 2px 0 rgba(11, 26, 42, .12);
    --shadow-md: 0 6px 0 rgba(11, 26, 42, .18);
    --shadow-lg: 0 10px 0 rgba(11, 26, 42, .25);
    --shadow-col: 0 10px 0 rgba(11, 26, 42, .3);
    --t-fast: .12s linear;
    --t-base: .2s linear;
    --t-slow: .32s linear;
    --topbar-h: 2.3rem;
    --nav-h: 72px;

    /* Internal Bindings */
    --font-primary: var(--f-body);
    --transition-smooth: var(--t-base);
    
    --bg-main: var(--c-bg);
    --bg-card: var(--c-bg-alt);
    --border-color: var(--c-border);
    --text-primary: var(--c-text);
    --text-secondary: var(--c-text-muted);
    --primary-color: var(--c-primary);
    --secondary-color: var(--c-primary-lt);
    --accent-success: #10b981;
    --accent-warning: #f59e0b;
    --accent-danger: #ef4444;
}

html {
    font-family: var(--f-body);
}

body {
    font-family: var(--font-primary);
    background-color: var(--bg-main);
    color: var(--text-primary);
    transition: var(--transition-smooth);
    min-height: 100vh;
}

/* Glassmorphism Header */
.navbar-custom {
    background-color: #ffffff !important;
    border-bottom: 1px solid var(--border-color) !important;
}

/* Premium Card Designs */
.card-premium {
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 0.5rem;
    box-shadow: 0 4px 6px -1px rgba(0,0,0,0.08), 0 2px 4px -1px rgba(0,0,0,0.04);
    color: var(--text-primary);
    transition: var(--transition-smooth);
}
.card-premium:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.2);
    border-color: var(--primary-color);
}

/* Custom Interactive Inputs */
.form-control-custom {
    background-color: #ffffff !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-primary) !important;
    padding: 0.75rem 1rem;
    transition: var(--transition-smooth);
}
.form-control-custom:focus {
    background-color: #ffffff !important;
    border-color: var(--primary-color) !important;
    box-shadow: 0 0 0 3px rgba(11, 26, 42, 0.15) !important;
    color: var(--text-primary) !important;
}

/* Custom Buttons with Micro-animations */
.btn-premium {
    background: var(--primary-color);
    border: none;
    color: white;
    font-weight: 600;
    padding: 0.75rem 1.5rem;
    border-radius: 0.5rem;
    box-shadow: 0 4px 6px -1px rgba(37, 99, 235, 0.2);
    transition: var(--transition-smooth);
}
.btn-premium:hover {
    filter: brightness(1.1);
    transform: translateY(-2px);
    box-shadow: 0 10px 15px -3px rgba(11, 26, 42, 0.4);
    color: #ffffff !important;
    background-color: var(--primary-dk) !important;
}
.btn-premium:active {
    transform: translateY(0);
}

/* Drag & Drop Upload Zone */
.upload-dropzone {
    border: 2px dashed var(--border-color);
    background-color: rgba(30, 41, 59, 0.4);
    border-radius: 1rem;
    padding: 2.5rem;
    text-align: center;
    cursor: pointer;
    transition: var(--transition-smooth);
}
.upload-dropzone:hover, .upload-dropzone.dragover {
    border-color: var(--primary-color);
    background-color: rgba(37, 99, 235, 0.05);
}

/* Timeline Components */
.timeline-item {
    position: relative;
    padding-left: 2.5rem;
    padding-bottom: 2rem;
    border-left: 2px solid var(--border-color);
}
.timeline-item:last-child {
    border-left: none;
    padding-bottom: 0;
}
.timeline-marker {
    position: absolute;
    left: -9px;
    top: 2px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background-color: var(--primary-color);
    border: 3px solid var(--bg-main);
}

/* Custom Badges */
.badge-status {
    padding: 0.5em 0.8em;
    font-weight: 600;
    border-radius: 2rem;
}

/* Dashboard Stat Cards */
.stat-card {
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 1rem;
    padding: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.stat-icon {
    width: 48px;
    height: 48px;
    border-radius: 0.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
}

/* Bootstrap Color Overrides */
.text-primary {
    color: var(--primary-color) !important;
}
.btn-primary {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
}
.btn-outline-primary {
    color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
}
.btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: #ffffff !important;
}

/* Contrast Muted Text Overrides */
body .text-muted {
    color: #4b5563 !important;
}
.card-premium .text-muted, .card .text-muted {
    color: #64748b !important;
}

/* Enforce Dark Blue Text on White Backgrounds (Cards & Tables) */
.card-premium, .card, .navbar-custom {
    color: #0b1a2a !important;
}
.card-premium h1, .card-premium h2, .card-premium h3, .card-premium h4, .card-premium h5, .card-premium h6,
.card h1, .card h2, .card h3, .card h4, .card h5, .card h6,
.card-premium label, .card label,
.card-premium table, .card table {
    color: #0b1a2a !important;
}

/* Override text-white classes for page elements on sand and white backgrounds */
h1.text-white, h2.text-white, h3.text-white, h4.text-white, h5.text-white, h6.text-white,
a.text-white, strong.text-white, span.text-white, .text-white, .table td strong {
    color: #0b1a2a !important;
}
.badge.text-white, .btn.text-white, .bg-success.text-white, .bg-danger.text-white, .bg-primary.text-white {
    color: #ffffff !important;
}

/* Active Selected Row highlight */
.table tr.table-active, .table tr.table-active td {
    background-color: #e8e2d4 !important;
    color: #0b1a2a !important;
}

/* Sharp Borders Global Reset */
*, *::before, *::after, input, button, select, textarea, .card, .card-premium, .navbar, .alert, .badge, .form-control, .btn, .modal, .dropdown-menu, .accordion-item, .accordion-button {
    border-radius: 0px !important;
    --bs-border-radius: 0px !important;
    --bs-border-radius-sm: 0px !important;
    --bs-border-radius-lg: 0px !important;
    --bs-border-radius-xl: 0px !important;
    --bs-border-radius-xxl: 0px !important;
    --bs-border-radius-pill: 0px !important;
}
