/* Bootstrap 5 Custom Theme for Injustitia Omnibus - High Contrast Dark Edition (John Giovannelli Inspired) */

/* Override Bootstrap CSS variables with high-contrast dark scheme */
:root {
    /* Primary Brand Colors */
    --bs-primary: #007bff;
    /* Bright Blue */
    --bs-primary-rgb: 0, 123, 255;
    --bs-primary-text-emphasis: #66b0ff;
    --bs-primary-bg-subtle: rgba(0, 123, 255, 0.15);
    --bs-primary-border-subtle: rgba(0, 123, 255, 0.4);

    /* Secondary - White/Gray */
    --bs-secondary: #f8f9fa;
    /* Light Gray/White */
    --bs-secondary-rgb: 248, 249, 250;
    --bs-secondary-text-emphasis: #ffffff;
    --bs-secondary-bg-subtle: rgba(248, 249, 250, 0.1);

    /* Functional Colors - Vibrant & High Contrast */
    --bs-success: #00e676;
    /* Bright Green */
    --bs-success-rgb: 0, 230, 118;

    --bs-danger: #ff1744;
    /* Bright Red */
    --bs-danger-rgb: 255, 23, 68;

    --bs-warning: #ffea00;
    /* Bright Yellow */
    --bs-warning-rgb: 255, 234, 0;

    --bs-info: #00b0ff;
    /* Light Blue */
    --bs-info-rgb: 0, 176, 255;

    /* Theme Colors */
    --bs-dark: #000000;
    /* Pure Black */
    --bs-dark-rgb: 0, 0, 0;

    --bs-light: #ffffff;
    --bs-light-rgb: 255, 255, 255;

    /* Body */
    --bs-body-bg: #0a0a0a;
    /* Very Dark Gray/Black */
    --bs-body-color: #ffffff;
    /* White Text */

    /* Borders */
    --bs-border-color: #333333;
    --bs-border-color-translucent: rgba(255, 255, 255, 0.15);

    /* Links */
    --bs-link-color: #339af0;
    --bs-link-hover-color: #74c0fc;

    /* Typography */
    --bs-body-font-family: 'Inter', system-ui, -apple-system, sans-serif;
    --bs-font-sans-serif: 'Inter', system-ui, -apple-system, sans-serif;

    /* Spacing & Radius */
    --bs-border-radius: 8px;
    --bs-border-radius-sm: 4px;
    --bs-border-radius-lg: 12px;
    --bs-border-radius-xl: 16px;

    /* Shadows */
    --bs-box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);
    --bs-box-shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.3);
    --bs-box-shadow-lg: 0 12px 24px rgba(0, 0, 0, 0.6);

    /* Custom Gradients */
    --gradient-primary: linear-gradient(135deg, #007bff, #0056b3);
    --gradient-dark: linear-gradient(135deg, #1a1a1a, #0a0a0a);
    --gradient-light: linear-gradient(135deg, #ffffff, #f8f9fa);
}

/* Global Styles for Dark Look */
body {
    background-color: var(--bs-body-bg);
    color: var(--bs-body-color);
    line-height: 1.6;
}

/* Typography Enhancements */
h1,
h2,
h3,
h4,
h5,
h6 {
    color: #ffffff;
    font-weight: 700;
    letter-spacing: -0.01em;
}

.display-1,
.display-2,
.display-3 {
    font-weight: 800;
    color: #ffffff;
}

/* Dark Card Styling */
.card {
    background: #1a1a1a;
    border: 1px solid #333333;
    color: #ffffff;
    box-shadow: var(--bs-box-shadow-sm);
    transition: all 0.3s ease;
    border-radius: var(--bs-border-radius);
}

.card:hover {
    transform: translateY(-4px);
    box-shadow: var(--bs-box-shadow-lg);
    border-color: var(--bs-primary);
    background: #222222;
}

.card-header {
    background: #222222;
    border-bottom: 1px solid #333333;
    font-weight: 600;
    color: #ffffff;
}

.card-footer {
    background: #222222;
    border-top: 1px solid #333333;
    color: #cccccc;
}

/* Professional Button Styling */
.btn {
    border-radius: var(--bs-border-radius);
    font-weight: 600;
    padding: 0.75rem 1.5rem;
    transition: all 0.2s ease;
    border: none;
    text-transform: none;
    letter-spacing: normal;
}

.btn-primary {
    background: var(--gradient-primary);
    color: #ffffff;
    border: 1px solid #007bff;
    box-shadow: 0 4px 12px rgba(0, 123, 255, 0.3);
}

.btn-primary:hover {
    background: linear-gradient(135deg, #0056b3, #004494);
    border-color: #0056b3;
    color: #ffffff;
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(0, 123, 255, 0.4);
}

.btn-secondary {
    background-color: #333333;
    color: #ffffff;
    border: 1px solid #444444;
}

.btn-secondary:hover {
    background-color: #444444;
    color: #ffffff;
    transform: translateY(-1px);
}

.btn-outline-primary {
    color: #339af0;
    border: 2px solid #339af0;
    background: transparent;
}

.btn-outline-primary:hover {
    background-color: #339af0;
    color: #ffffff;
    border-color: #339af0;
}

.btn-success {
    background-color: #10B981;
    color: #FFFFFF;
}

.btn-success:hover {
    background-color: #0D9F6F;
    color: #FFFFFF;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3);
}

.btn-danger {
    background-color: #FF3B30;
    color: #FFFFFF;
}

.btn-danger:hover {
    background-color: #E6342B;
    color: #FFFFFF;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(255, 59, 48, 0.3);
}

.btn-warning {
    background-color: #FF9500;
    color: #FFFFFF;
}

.btn-warning:hover {
    background-color: #E68600;
    color: #FFFFFF;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(255, 149, 0, 0.3);
}

.btn-info {
    background-color: #007AFF;
    color: #FFFFFF;
}

.btn-info:hover {
    background-color: #006DD9;
    color: #FFFFFF;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 122, 255, 0.3);
}

/* High Contrast Badge Styling */
.badge {
    font-weight: 600;
    padding: 0.5em 0.8em;
    border-radius: var(--bs-border-radius-sm);
    letter-spacing: normal;
}

.badge.bg-primary {
    background-color: #007bff !important;
    color: #ffffff !important;
}

.badge.bg-secondary {
    background-color: #444444 !important;
    color: #ffffff !important;
}

.badge.bg-success {
    background-color: #00e676 !important;
    color: #000000 !important;
}

.badge.bg-danger {
    background-color: #ff1744 !important;
    color: #ffffff !important;
}

.badge.bg-warning {
    background-color: #ffea00 !important;
    color: #000000 !important;
}

.badge.bg-info {
    background-color: #00b0ff !important;
    color: #000000 !important;
}


/* Dark Alert Styling */
.alert {
    border-radius: var(--bs-border-radius);
    border: 1px solid transparent;
    border-left: 4px solid;
    background: #1a1a1a;
    box-shadow: var(--bs-box-shadow-sm);
    color: #ffffff;
}

.alert-primary {
    border-color: #007bff;
    background-color: rgba(0, 123, 255, 0.15);
    color: #9ec5fe;
}

.alert-success {
    border-color: #00e676;
    background-color: rgba(0, 230, 118, 0.15);
    color: #69f0ae;
}

.alert-danger {
    border-color: #ff1744;
    background-color: rgba(255, 23, 68, 0.15);
    color: #ff8a80;
}

.alert-warning {
    border-color: #ffea00;
    background-color: rgba(255, 234, 0, 0.15);
    color: #ffff8d;
}

.alert-info {
    border-color: #00b0ff;
    background-color: rgba(0, 176, 255, 0.15);
    color: #80d8ff;
}

/* Navbar Styling */
.navbar {
    background-color: rgba(10, 10, 10, 0.95);
    border-bottom: 1px solid #333333;
    padding: 1rem 0;
    backdrop-filter: blur(10px);
}

.navbar-brand {
    font-weight: 700;
    color: #ffffff;
}

.nav-link {
    color: #cccccc;
    font-weight: 500;
    transition: color 0.2s ease;
}

.nav-link:hover,
.nav-link.active {
    color: #339af0;
    font-weight: 600;
}

/* Bootstrap modal styling */
.modal-content {
    background-color: #FFFFFF;
    border: none;
    box-shadow: var(--bs-box-shadow-lg);
    border-radius: var(--bs-border-radius-lg);
}

.modal-header {
    border-bottom: 1px solid #E5E5E5;
    background-color: #F9FAFB;
    border-top-left-radius: var(--bs-border-radius-lg);
    border-top-right-radius: var(--bs-border-radius-lg);
}

.modal-footer {
    border-top: 1px solid #E5E5E5;
    background-color: #F9FAFB;
    border-bottom-left-radius: var(--bs-border-radius-lg);
    border-bottom-right-radius: var(--bs-border-radius-lg);
}

.modal-backdrop {
    background-color: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
}

/* Bootstrap navbar override */
.navbar-dark {
    background-color: rgba(15, 23, 42, 0.8) !important;
    backdrop-filter: blur(12px);
}

.navbar-dark .navbar-nav .nav-link {
    color: #94a3b8;
}

.navbar-dark .navbar-nav .nav-link:hover {
    color: #38bdf8;
}

/* Bootstrap table styling */
.table {
    color: #2E2E38;
    border-color: #E5E5E5;
}

.table thead th {
    background-color: #F9FAFB;
    border-bottom: 2px solid #E5E5E5;
    color: #1A1A1A;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.85rem;
    letter-spacing: 0.05em;
}

.table-striped>tbody>tr:nth-of-type(odd)>* {
    background-color: #F9FAFB;
}

.table-hover>tbody>tr:hover>* {
    background-color: #FFFDE6;
}

/* Bootstrap progress bar */
.progress {
    background-color: #E5E5E5;
    border-radius: 999px;
    height: 0.75rem;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
}

.progress-bar {
    background-color: #FFE600;
    color: #1A1A1A;
}

/* Bootstrap accordion */
.accordion-item {
    background-color: #FFFFFF;
    border: 1px solid #E5E5E5;
    margin-bottom: 0.5rem;
    border-radius: var(--bs-border-radius) !important;
    overflow: hidden;
}

.accordion-button {
    background-color: #FFFFFF;
    color: #1A1A1A;
    font-weight: 600;
    box-shadow: none;
}

.accordion-button:not(.collapsed) {
    background-color: #FFFDE6;
    color: #1A1A1A;
    box-shadow: none;
}

.accordion-button:focus {
    box-shadow: none;
    border-color: #E5E5E5;
}

/* Bootstrap form controls */
.form-control,
.form-select {
    background-color: #FFFFFF;
    border: 1px solid #D1D5DB;
    color: #1A1A1A;
    border-radius: var(--bs-border-radius);
    padding: 0.75rem 1rem;
}

.form-control:focus,
.form-select:focus {
    background-color: #FFFFFF;
    border-color: #FFE600;
    box-shadow: 0 0 0 3px rgba(255, 230, 0, 0.2);
}

.form-control::placeholder {
    color: #9CA3AF;
}

/* Bootstrap pagination */
.pagination .page-link {
    background-color: #FFFFFF;
    border-color: #E5E5E5;
    color: #2E2E38;
    margin: 0 2px;
    border-radius: var(--bs-border-radius-sm);
}

.pagination .page-link:hover {
    background-color: #F3F4F6;
    border-color: #E5E5E5;
    color: #1A1A1A;
}

.pagination .page-item.active .page-link {
    background-color: #FFE600;
    border-color: #FFE600;
    color: #1A1A1A;
    font-weight: 600;
}

/* Bootstrap list group */
.list-group-item {
    background-color: #FFFFFF;
    border-color: #E5E5E5;
    color: #2E2E38;
}

.list-group-item:hover {
    background-color: #F9FAFB;
}

.list-group-item.active {
    background-color: #FFE600;
    border-color: #FFE600;
    color: #1A1A1A;
}

/* Responsive utilities */
@media (max-width: 768px) {
    .card {
        margin-bottom: 1rem;
    }

    .btn {
        width: 100%;
        margin-bottom: 0.5rem;
    }
}