/* css/index.css */
:root {
    /* Color Palette */
    --bs-primary: #1B4D8E;
    --bs-primary-rgb: 27, 77, 142;
    --bs-secondary: #F5A623;
    --bs-secondary-rgb: 245, 166, 35;
    --bs-success: #2ECC71;
    --bs-success-rgb: 46, 204, 113;
    --bs-info: #0dcaf0;
    --bs-warning: #ffc107;
    --bs-danger: #dc3545;
    --bs-light: #f8f9fa;
    --bs-dark: #212529;
    
    /* Custom Tokens */
    --bg-primary-subtle: rgba(27, 77, 142, 0.1);
    --bg-secondary-subtle: rgba(245, 166, 35, 0.1);
    --bg-success-subtle: rgba(46, 204, 113, 0.1);
    --bg-dark-subtle: rgba(33, 37, 41, 0.1);
    
    --bg-darker: #1a1d20;

    /* Typography */
    --font-primary: 'Inter', sans-serif;
    --font-heading: 'Montserrat', sans-serif;
    
    /* Animation */
    --transition-fast: 0.2s ease-in-out;
    --transition-normal: 0.3s ease-in-out;
    --transition-slow: 0.5s ease-in-out;
}

body {
    font-family: var(--font-primary);
    color: #4a5568;
    line-height: 1.6;
    overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6, .navbar-brand, .font-montserrat {
    font-family: var(--font-heading);
}

/* Bootstrap Overrides */
.text-primary { color: var(--bs-primary) !important; }
.bg-primary { background-color: var(--bs-primary) !important; }
.btn-primary {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
}
.btn-primary:hover {
    background-color: #153c6e;
    border-color: #153c6e;
}

.text-secondary { color: var(--bs-secondary) !important; }
.bg-secondary { background-color: var(--bs-secondary) !important; }
.btn-secondary {
    background-color: var(--bs-secondary);
    border-color: var(--bs-secondary);
    color: #fff;
}
.btn-secondary:hover {
    background-color: #df9419;
    border-color: #df9419;
    color: #fff;
}

.text-success { color: var(--bs-success) !important; }

/* Custom Background Utilities */
.bg-primary-subtle { background-color: var(--bg-primary-subtle) !important; }
.bg-secondary-subtle { background-color: var(--bg-secondary-subtle) !important; }
.bg-success-subtle { background-color: var(--bg-success-subtle) !important; }
.bg-dark-subtle { background-color: var(--bg-dark-subtle) !important; }
.bg-darker { background-color: var(--bg-darker) !important; }

/* Utility Classes */
.max-w-700 { max-width: 700px; }
.transition-transform { transition: transform var(--transition-normal); }
.duration-500 { transition-duration: 0.5s; }