/* Auto Diag Intel - Main Stylesheet */

/* ═══════════════════════════════════════════
   LAYOUT
   ═══════════════════════════════════════════ */
#app-wrapper {
    min-height: 100vh;
}

.app-container {
    max-width: 1400px;
    margin: 0 auto;
    width: 100%;
}

.container-xxl {
    max-width: 1400px;
}

/* Font size utilities */
.fs-7 { font-size: 0.85rem !important; }
.fs-8 { font-size: 0.8rem !important; }

/* ═══════════════════════════════════════════
   BUTTON NORMALIZATION
   Compact, professional buttons across all pages.
   Prevents oversized icons and bloated buttons.
   ═══════════════════════════════════════════ */

/* Downgrade btn-lg to normal size globally */
.btn-lg {
    padding: 0.5rem 1rem !important;
    font-size: 0.9rem !important;
    border-radius: 0.375rem !important;
}

/* Metronic indicator pattern — hide spinner by default, show on [data-kt-indicator="on"] */
.indicator-progress { display: none; }
[data-kt-indicator="on"] .indicator-label { display: none; }
[data-kt-indicator="on"] .indicator-progress { display: inline-block; }

/* Icons inside buttons — keep inline and compact */
.btn i,
.btn .bi {
    font-size: 1rem !important;
    vertical-align: middle;
    line-height: 1;
}

/* Override fs-1..fs-4 inside buttons — way too large */
.btn .fs-1, .btn .fs-2, .btn .fs-3, .btn .fs-4 {
    font-size: 1rem !important;
}

/* Action buttons in toolbars — compact row */
.btn-sm {
    padding: 0.3rem 0.6rem;
    font-size: 0.8rem;
}
.btn-sm i, .btn-sm .bi {
    font-size: 0.85rem !important;
}

/* Pipeline/action button groups (dashboard) */
.btn-group .btn,
.d-flex .btn + .btn,
.gap-2 > .btn {
    white-space: nowrap;
}

/* Table action buttons — tiny and inline */
td .btn {
    padding: 0.2rem 0.5rem;
    font-size: 0.78rem;
}
td .btn i, td .btn .bi {
    font-size: 0.8rem !important;
}

/* Separator */
.separator {
    border-bottom: 1px solid #eff2f5;
    margin: 1rem 0;
}

.page-heading { margin: 0; }
.text-hover-primary:hover { color: #009ef7 !important; }
.bullet { display: inline-block; border-radius: 6px; }

/* Scrollbar styling */
.sidebar-scroll::-webkit-scrollbar { width: 4px; }
.sidebar-scroll::-webkit-scrollbar-thumb {
    background-color: rgba(255, 255, 255, 0.2);
    border-radius: 4px;
}

/* ═══════════════════════════════════════════
   LIGHT MODE (default Bootstrap 5 handles most)
   ═══════════════════════════════════════════ */
.card {
    border: 0;
    box-shadow: 0 0.1rem 0.25rem rgba(0, 0, 0, 0.05);
}

.card-header {
    background: transparent;
    border-bottom: 1px solid rgba(0, 0, 0, 0.07);
}

/* Badge variants */
.badge-light-primary { color: #3e97ff; background-color: #eef6ff; }
.badge-light-success { color: #50cd89; background-color: #e8fff3; }
.badge-light-warning { color: #ffc700; background-color: #fff8dd; }
.badge-light-danger  { color: #f1416c; background-color: #fff5f8; }
.badge-light-info    { color: #7239ea; background-color: #f8f5ff; }

/* ═══════════════════════════════════════════
   DARK MODE — COMPREHENSIVE
   ═══════════════════════════════════════════ */
[data-bs-theme="dark"] {
    --bs-body-bg: #1a1d21;
    --bs-body-color: #e1e3e6;
    --card-bg: #212529;
    --card-border: #2d3238;
    --input-bg: #2b3035;
    --input-border: #3d444b;
    --hover-bg: rgba(255,255,255,0.05);
    --muted-color: #8b929a;
    --heading-color: #f0f0f0;
}

/* Body & text */
[data-bs-theme="dark"] body {
    background-color: var(--bs-body-bg);
    color: var(--bs-body-color);
}
[data-bs-theme="dark"] h1,
[data-bs-theme="dark"] h2,
[data-bs-theme="dark"] h3,
[data-bs-theme="dark"] h4,
[data-bs-theme="dark"] h5,
[data-bs-theme="dark"] h6 {
    color: var(--heading-color);
}
[data-bs-theme="dark"] p,
[data-bs-theme="dark"] span,
[data-bs-theme="dark"] label,
[data-bs-theme="dark"] small,
[data-bs-theme="dark"] li,
[data-bs-theme="dark"] td,
[data-bs-theme="dark"] th,
[data-bs-theme="dark"] div {
    color: inherit;
}
/* Metronic text-gray-* classes — dark mode overrides */
[data-bs-theme="dark"] .text-gray-900 { color: #f0f0f0 !important; }
[data-bs-theme="dark"] .text-gray-800 { color: #e1e3e6 !important; }
[data-bs-theme="dark"] .text-gray-700 { color: #c9cdd3 !important; }
[data-bs-theme="dark"] .text-gray-600 { color: #a1a5ab !important; }
[data-bs-theme="dark"] .text-gray-500 { color: #8b929a !important; }
[data-bs-theme="dark"] .text-gray-400 { color: #6b7280 !important; }

/* Metronic bg-light-* classes — dark mode overrides */
[data-bs-theme="dark"] .bg-light-primary { background-color: rgba(168,85,247,0.12) !important; }
[data-bs-theme="dark"] .bg-light-success { background-color: rgba(34,197,94,0.12) !important; }
[data-bs-theme="dark"] .bg-light-warning { background-color: rgba(234,179,8,0.12) !important; }
[data-bs-theme="dark"] .bg-light-danger { background-color: rgba(239,68,68,0.12) !important; }
[data-bs-theme="dark"] .bg-light-info { background-color: rgba(6,182,212,0.12) !important; }

[data-bs-theme="dark"] .text-dark {
    color: var(--bs-body-color) !important;
}
[data-bs-theme="dark"] .text-muted {
    color: var(--muted-color) !important;
}
[data-bs-theme="dark"] .text-body {
    color: var(--bs-body-color) !important;
}

/* Links */
[data-bs-theme="dark"] a:not(.btn):not(.nav-link):not(.sidebar-link):not(.top-link):not(.dropdown-item) {
    color: #7cacf8;
}
[data-bs-theme="dark"] a:not(.btn):not(.nav-link):not(.sidebar-link):not(.top-link):not(.dropdown-item):hover {
    color: #a5c8ff;
}

/* Cards */
[data-bs-theme="dark"] .card {
    background-color: var(--card-bg);
    border: 1px solid var(--card-border);
    box-shadow: 0 0.1rem 0.5rem rgba(0, 0, 0, 0.3);
    color: var(--bs-body-color);
}
[data-bs-theme="dark"] .card-header {
    background-color: rgba(255,255,255,0.03);
    border-bottom: 1px solid var(--card-border);
    color: var(--heading-color);
}
[data-bs-theme="dark"] .card-body {
    color: var(--bs-body-color);
}
[data-bs-theme="dark"] .card-title {
    color: var(--heading-color);
}
[data-bs-theme="dark"] .card-text {
    color: var(--bs-body-color);
}

/* Navbar/header */
[data-bs-theme="dark"] .navbar,
[data-bs-theme="dark"] header.navbar {
    background-color: #212529 !important;
    border-bottom-color: var(--card-border) !important;
    color: var(--bs-body-color);
}
[data-bs-theme="dark"] .navbar .text-dark,
[data-bs-theme="dark"] header .text-dark {
    color: var(--bs-body-color) !important;
}
[data-bs-theme="dark"] .breadcrumb-item a {
    color: #7cacf8;
}
[data-bs-theme="dark"] .breadcrumb-item.active {
    color: var(--muted-color);
}
[data-bs-theme="dark"] .breadcrumb-item + .breadcrumb-item::before {
    color: var(--muted-color);
}

/* Tables */
[data-bs-theme="dark"] .table {
    color: var(--bs-body-color);
    border-color: var(--card-border);
}
[data-bs-theme="dark"] .table thead th {
    background-color: rgba(255,255,255,0.04);
    color: var(--heading-color);
    border-bottom-color: var(--card-border);
}
[data-bs-theme="dark"] .table td {
    border-bottom-color: var(--card-border);
    color: var(--bs-body-color);
}
[data-bs-theme="dark"] .table-hover tbody tr:hover {
    background-color: rgba(255,255,255,0.04);
}
[data-bs-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) {
    background-color: rgba(255,255,255,0.02);
}

/* Forms */
[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark"] .form-select {
    background-color: var(--input-bg);
    border-color: var(--input-border);
    color: var(--bs-body-color);
}
[data-bs-theme="dark"] .form-control:focus,
[data-bs-theme="dark"] .form-select:focus {
    background-color: #323840;
    border-color: #7c6ce7;
    color: var(--bs-body-color);
    box-shadow: 0 0 0 0.2rem rgba(124,108,231,0.25);
}
[data-bs-theme="dark"] .form-control::placeholder {
    color: #6c757d;
}
[data-bs-theme="dark"] .form-label {
    color: var(--bs-body-color);
}
[data-bs-theme="dark"] .form-check-label {
    color: var(--bs-body-color);
}
[data-bs-theme="dark"] .input-group-text {
    background-color: var(--input-bg);
    border-color: var(--input-border);
    color: var(--bs-body-color);
}

/* Buttons — outline variants */
[data-bs-theme="dark"] .btn-outline-secondary {
    color: var(--bs-body-color);
    border-color: var(--input-border);
}
[data-bs-theme="dark"] .btn-outline-secondary:hover {
    background-color: rgba(255,255,255,0.1);
    color: #fff;
}
[data-bs-theme="dark"] .btn-outline-primary {
    color: #7cacf8;
    border-color: #5a8dee;
}
[data-bs-theme="dark"] .btn-outline-danger {
    color: #f47a94;
    border-color: #dc3545;
}
[data-bs-theme="dark"] .btn-light {
    background-color: var(--input-bg);
    border-color: var(--input-border);
    color: var(--bs-body-color);
}
[data-bs-theme="dark"] .btn-light:hover {
    background-color: #3d444b;
}

/* Dropdowns */
[data-bs-theme="dark"] .dropdown-menu {
    background-color: #2b3035;
    border-color: var(--card-border);
    box-shadow: 0 0.5rem 1.5rem rgba(0,0,0,0.4);
}
[data-bs-theme="dark"] .dropdown-item {
    color: var(--bs-body-color);
}
[data-bs-theme="dark"] .dropdown-item:hover,
[data-bs-theme="dark"] .dropdown-item:focus {
    background-color: rgba(255,255,255,0.08);
    color: #fff;
}
[data-bs-theme="dark"] .dropdown-item.active {
    background-color: rgba(124,108,231,0.3);
    color: #c4b5fd;
}
[data-bs-theme="dark"] .dropdown-divider {
    border-color: var(--card-border);
}

/* Modals */
[data-bs-theme="dark"] .modal-content {
    background-color: var(--card-bg);
    border-color: var(--card-border);
    color: var(--bs-body-color);
}
[data-bs-theme="dark"] .modal-header {
    border-bottom-color: var(--card-border);
}
[data-bs-theme="dark"] .modal-footer {
    border-top-color: var(--card-border);
}
[data-bs-theme="dark"] .btn-close {
    filter: invert(1) grayscale(100%) brightness(200%);
}

/* List groups */
[data-bs-theme="dark"] .list-group-item {
    background-color: var(--card-bg);
    border-color: var(--card-border);
    color: var(--bs-body-color);
}
[data-bs-theme="dark"] .list-group-item:hover {
    background-color: rgba(255,255,255,0.05);
}

/* Alerts / Callouts */
[data-bs-theme="dark"] .alert {
    border-color: var(--card-border);
}
[data-bs-theme="dark"] .alert-info {
    background-color: #1b2e4b;
    color: #7cacf8;
    border-color: #2a4060;
}
[data-bs-theme="dark"] .alert-warning {
    background-color: #3a3228;
    color: #ffd54f;
    border-color: #504530;
}
[data-bs-theme="dark"] .alert-success {
    background-color: #1c3238;
    color: #6dd8a5;
    border-color: #2a4540;
}
[data-bs-theme="dark"] .alert-danger {
    background-color: #3a2434;
    color: #f47a94;
    border-color: #502838;
}

/* Badges — dark mode */
[data-bs-theme="dark"] .badge-light-primary { color: #7cacf8; background-color: #1b2e4b; }
[data-bs-theme="dark"] .badge-light-success { color: #6dd8a5; background-color: #1c3238; }
[data-bs-theme="dark"] .badge-light-warning { color: #ffd54f; background-color: #3a3228; }
[data-bs-theme="dark"] .badge-light-danger  { color: #f47a94; background-color: #3a2434; }
[data-bs-theme="dark"] .badge-light-info    { color: #b4a5ff; background-color: #2a2545; }
[data-bs-theme="dark"] .badge.bg-light {
    background-color: var(--input-bg) !important;
    color: var(--bs-body-color) !important;
}

/* Pagination */
[data-bs-theme="dark"] .page-link {
    background-color: var(--input-bg);
    border-color: var(--input-border);
    color: var(--bs-body-color);
}
[data-bs-theme="dark"] .page-link:hover {
    background-color: #3d444b;
    color: #fff;
}
[data-bs-theme="dark"] .page-item.active .page-link {
    background-color: #7c6ce7;
    border-color: #7c6ce7;
}
[data-bs-theme="dark"] .page-item.disabled .page-link {
    background-color: #1a1d21;
    color: #555;
}

/* Nav tabs & pills */
[data-bs-theme="dark"] .nav-tabs {
    border-bottom-color: var(--card-border);
}
[data-bs-theme="dark"] .nav-tabs .nav-link {
    color: var(--muted-color);
}
[data-bs-theme="dark"] .nav-tabs .nav-link.active {
    background-color: var(--card-bg);
    border-color: var(--card-border) var(--card-border) var(--card-bg);
    color: var(--heading-color);
}
[data-bs-theme="dark"] .nav-pills .nav-link {
    color: var(--bs-body-color);
}
[data-bs-theme="dark"] .nav-pills .nav-link.active {
    background-color: #7c6ce7;
    color: #fff;
}

/* Separator */
[data-bs-theme="dark"] .separator {
    border-bottom-color: var(--card-border);
}
[data-bs-theme="dark"] .border-bottom {
    border-bottom-color: var(--card-border) !important;
}
[data-bs-theme="dark"] .border {
    border-color: var(--card-border) !important;
}
[data-bs-theme="dark"] hr {
    border-color: var(--card-border);
    opacity: 0.5;
}

/* Footer */
[data-bs-theme="dark"] footer {
    background-color: var(--card-bg) !important;
    color: var(--muted-color);
    border-top-color: var(--card-border) !important;
}

/* Stat cards / KPI cards */
[data-bs-theme="dark"] .bg-white {
    background-color: var(--card-bg) !important;
}
[data-bs-theme="dark"] .bg-light {
    background-color: #2b3035 !important;
}
[data-bs-theme="dark"] .shadow-sm {
    box-shadow: 0 0.125rem 0.5rem rgba(0,0,0,0.3) !important;
}

/* Tooltips */
[data-bs-theme="dark"] .tooltip-inner {
    background-color: #3d444b;
    color: #fff;
}

/* Progress bars */
[data-bs-theme="dark"] .progress {
    background-color: var(--input-bg);
}

/* Accordion */
[data-bs-theme="dark"] .accordion-item {
    background-color: var(--card-bg);
    border-color: var(--card-border);
}
[data-bs-theme="dark"] .accordion-button {
    background-color: var(--card-bg);
    color: var(--bs-body-color);
}
[data-bs-theme="dark"] .accordion-button:not(.collapsed) {
    background-color: rgba(124,108,231,0.1);
    color: #c4b5fd;
}
[data-bs-theme="dark"] .accordion-button::after {
    filter: invert(1);
}

/* SweetAlert2 dark mode */
[data-bs-theme="dark"] .swal2-popup {
    background-color: var(--card-bg) !important;
    color: var(--bs-body-color) !important;
}
[data-bs-theme="dark"] .swal2-title {
    color: var(--heading-color) !important;
}
[data-bs-theme="dark"] .swal2-html-container {
    color: var(--bs-body-color) !important;
}
[data-bs-theme="dark"] .swal2-input,
[data-bs-theme="dark"] .swal2-textarea,
[data-bs-theme="dark"] .swal2-select {
    background-color: var(--input-bg) !important;
    color: var(--bs-body-color) !important;
    border-color: var(--input-border) !important;
}

/* Code blocks */
[data-bs-theme="dark"] code {
    color: #e685b5;
    background-color: rgba(255,255,255,0.06);
    padding: 0.1em 0.3em;
    border-radius: 3px;
}
[data-bs-theme="dark"] pre {
    background-color: #1a1d21;
    border: 1px solid var(--card-border);
    color: var(--bs-body-color);
}

/* Specific component overrides for inline styles */
[data-bs-theme="dark"] [style*="background-color: #f8f9fa"],
[data-bs-theme="dark"] [style*="background-color: white"],
[data-bs-theme="dark"] [style*="background-color: #fff"],
[data-bs-theme="dark"] [style*="background:#f8f9fa"],
[data-bs-theme="dark"] [style*="background: #f8f9fa"],
[data-bs-theme="dark"] [style*="background: white"] {
    background-color: var(--card-bg) !important;
    color: var(--bs-body-color) !important;
}

/* ═══════════════════════════════════════════
   MOBILE SIDEBAR (kept from sidebar.html inline for reference)
   ═══════════════════════════════════════════ */
@media (max-width: 991.98px) {
    #sidebar {
        position: fixed;
        z-index: 1050;
        margin-left: -260px;
    }
    #sidebar.show {
        margin-left: 0;
    }
}
