/* ============================================================
   LINEAR ULTRA — Theme finisher (load CUỐI CÙNG)
   Đè lên mọi inline-style emerald/blue cũ trong các view .cshtml.
   Không sửa từng view — tất cả token gốc (--sd-*, --m3-*) đã đổi
   sang indigo, file này chỉ chốt các điểm còn sót/hardcode.
   ============================================================ */

:root {
    /* --lu-* follow --sd-primary HSL → preset switch (Emerald/Indigo/Rose/...) đổi màu được */
    --lu-primary:        hsl(var(--sd-primary));
    --lu-primary-50:     hsl(var(--sd-primary) / 0.08);
    --lu-primary-100:    hsl(var(--sd-primary) / 0.16);
    --lu-primary-200:    hsl(var(--sd-primary) / 0.30);
    --lu-primary-400:    hsl(var(--sd-primary) / 0.70);
    --lu-primary-500:    hsl(var(--sd-primary));
    --lu-primary-600:    var(--sd-primary-bg-hover);
    --lu-primary-700:    var(--sd-primary-bg-hover);
    --lu-primary-800:    var(--sd-primary-bg-hover);
    --lu-primary-soft:   hsl(var(--sd-primary) / 0.10);
    --lu-primary-soft-2: hsl(var(--sd-primary) / 0.16);
    --lu-primary-ring:   hsl(var(--sd-primary) / 0.30);
}

/* ===== TYPO siết letter-spacing kiểu Linear ===== */
body, .app-content, .content, .card, .modal, .dropdown-menu, .tooltip, .popover,
.btn, .form-control, .form-select, .form-label, .nav-link, .breadcrumb, table, td, th {
    letter-spacing: -0.005em;
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6,
.modal-title, .card-title, .page-title {
    letter-spacing: -0.018em !important;
}

/* ===== BUTTONS — primary indigo nhất quán toàn app ===== */
.btn-primary, .btn.btn-primary,
button.btn-primary,
a.btn-primary {
    background: var(--lu-primary) !important;
    background-image: none !important;
    border-color: var(--lu-primary) !important;
    color: #fff !important;
    box-shadow: none !important;
}
.btn-primary:hover, .btn.btn-primary:hover,
.btn-primary:focus, .btn.btn-primary:focus,
.btn-primary:active, .btn.btn-primary:active {
    background: var(--lu-primary-600) !important;
    border-color: var(--lu-primary-600) !important;
    color: #fff !important;
    box-shadow: none !important;
}
.btn-primary:focus-visible {
    box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--lu-primary-ring) !important;
}

.btn-outline-primary {
    background: #fff !important;
    border-color: var(--lu-primary) !important;
    color: var(--lu-primary-600) !important;
}
.btn-outline-primary:hover {
    background: var(--lu-primary-soft) !important;
    color: var(--lu-primary-700) !important;
    border-color: var(--lu-primary) !important;
}

/* link/text-primary ALL */
a, a:link {
    color: inherit;
}
a.text-primary, .text-primary, .link-primary,
a.link-primary {
    color: var(--lu-primary-600) !important;
}
a.text-primary:hover, .link-primary:hover,
a:hover.text-primary { color: var(--lu-primary-700) !important; }

/* ===== BG / BORDER PRIMARY ===== */
.bg-primary, .bg-primary-subtle {
    background-color: var(--lu-primary) !important;
    color: #fff !important;
}
.bg-primary-subtle {
    background-color: var(--lu-primary-soft) !important;
    color: var(--lu-primary-700) !important;
}
.border-primary {
    border-color: var(--lu-primary) !important;
}

/* badge.bg-primary cũ (gradient blue) → flat indigo soft */
.badge.bg-primary,
.badge.text-bg-primary {
    background: var(--lu-primary-soft) !important;
    color: var(--lu-primary-700) !important;
    background-image: none !important;
    border: 1px solid rgba(99, 102, 241, 0.25) !important;
    font-weight: 500 !important;
}

/* ===== FORM CONTROLS focus ring → indigo ===== */
.form-control:focus, .form-select:focus,
.form-check-input:focus,
input[type="text"]:focus, input[type="email"]:focus, input[type="password"]:focus,
input[type="number"]:focus, input[type="search"]:focus, input[type="tel"]:focus,
input[type="url"]:focus, input[type="date"]:focus, input[type="datetime-local"]:focus,
textarea:focus, select:focus {
    border-color: var(--lu-primary) !important;
    box-shadow: 0 0 0 3px var(--lu-primary-ring) !important;
    outline: none !important;
}
.form-check-input:checked {
    background-color: var(--lu-primary) !important;
    border-color: var(--lu-primary) !important;
}

/* ===== SIDEBAR / NAV active = indigo ===== */
.sidebar .nav-link.active,
.app-sidebar .nav-link.active,
.main-sidebar .nav-link.active,
.nav-pills .nav-link.active,
.nav-link.active {
    background-color: var(--lu-primary-soft) !important;
    color: var(--lu-primary-700) !important;
}
.sidebar .nav-link.active i,
.app-sidebar .nav-link.active i,
.main-sidebar .nav-link.active i {
    color: var(--lu-primary-600) !important;
}
[data-theme="dark"] .sidebar .nav-link.active,
[data-theme="dark"] .app-sidebar .nav-link.active {
    background-color: rgba(129, 140, 248, 0.16) !important;
    color: #c7d2fe !important;
}

/* ===== DROPDOWN active item ===== */
.dropdown-item.active, .dropdown-item:active {
    background-color: var(--lu-primary) !important;
    color: #fff !important;
}
.dropdown-item:hover, .dropdown-item:focus {
    background-color: var(--lu-primary-soft) !important;
    color: var(--lu-primary-700) !important;
}

/* ===== PAGINATION ===== */
.page-link { color: var(--lu-primary-600) !important; }
.page-item.active .page-link {
    background-color: var(--lu-primary) !important;
    border-color: var(--lu-primary) !important;
    color: #fff !important;
}
.page-link:hover { background-color: var(--lu-primary-soft) !important; color: var(--lu-primary-700) !important; }

/* ===== PROGRESS / SPINNER ===== */
.progress-bar { background-color: var(--lu-primary) !important; }
.spinner-border.text-primary, .spinner-grow.text-primary { color: var(--lu-primary) !important; }

/* ===== TABLE row hover ===== */
.table-hover > tbody > tr:hover > * {
    --bs-table-color-state: var(--lu-primary-700);
    --bs-table-bg-state: var(--lu-primary-soft);
}
.table-active > * {
    --bs-table-color-state: var(--lu-primary-700);
    --bs-table-bg-state: var(--lu-primary-soft);
}

/* ===== ICON pill / dot primary ===== */
.icon-pill-primary,
.dot-primary,
.indicator-primary {
    background-color: var(--lu-primary) !important;
    color: #fff !important;
}

/* ===== Common emerald hardcode fallback ===== */
[style*="background-color: #059669"],
[style*="background-color:#059669"] {
    background-color: var(--lu-primary) !important;
}
[style*="color: #059669"],
[style*="color:#059669"] {
    color: var(--lu-primary-600) !important;
}

/* ===== FOCUS RING toàn cục (Linear Ultra signature) ===== */
:focus-visible:not(.btn):not(input):not(textarea):not(select):not([role="button"]):not([role="checkbox"]):not([role="radio"]) {
    outline: 2px solid var(--lu-primary-ring) !important;
    outline-offset: 2px !important;
}

/* ===== MODAL header gradient cũ (todo, daily, etc.) → flat indigo ===== */
.modal-header.bg-primary,
.modal-header.text-bg-primary {
    background: var(--lu-primary) !important;
    background-image: none !important;
    color: #fff !important;
}
.modal-header.bg-gradient-primary {
    background: linear-gradient(135deg, var(--lu-primary) 0%, var(--lu-primary-600) 100%) !important;
}

/* ===== CHECKBOX/RADIO ring ===== */
.form-check-input:focus {
    border-color: var(--lu-primary) !important;
    box-shadow: 0 0 0 3px var(--lu-primary-ring) !important;
}

/* ===== SELECT2 (rất nhiều màn dùng) ===== */
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
    border-color: var(--sd-input-c) !important;
    border-radius: 6px !important;
    min-height: 32px !important;
    background: #fff;
}
.select2-container--default.select2-container--focus .select2-selection,
.select2-container--default .select2-selection--single:focus,
.select2-container--default .select2-selection--multiple:focus {
    border-color: var(--lu-primary) !important;
    box-shadow: 0 0 0 3px var(--lu-primary-ring) !important;
}
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted {
    background: var(--lu-primary) !important;
    color: #fff !important;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background: var(--lu-primary-soft) !important;
    border-color: rgba(99, 102, 241, 0.25) !important;
    color: var(--lu-primary-700) !important;
    border-radius: 4px !important;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    color: var(--lu-primary-700) !important;
}

/* ===== DATATABLE (DataTables.net) ===== */
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: var(--lu-primary) !important;
    background-image: none !important;
    color: #fff !important;
    border-color: var(--lu-primary) !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: var(--lu-primary-soft) !important;
    background-image: none !important;
    color: var(--lu-primary-700) !important;
    border-color: var(--lu-primary) !important;
}
table.dataTable tbody tr.selected td,
table.dataTable tbody tr.selected {
    background-color: var(--lu-primary-soft) !important;
    color: var(--lu-primary-700) !important;
}

/* ===== FullCalendar (MyCalendar/DailyTodos) ===== */
.fc-button-primary, .fc-button {
    background: #fff !important;
    border-color: var(--sd-border-strong) !important;
    color: var(--sd-fg) !important;
    text-transform: none !important;
    font-weight: 500 !important;
    box-shadow: none !important;
}
.fc-button-primary:hover, .fc-button:hover {
    background: var(--sd-muted-bg) !important;
    border-color: var(--sd-border-strong) !important;
    color: var(--sd-fg) !important;
}
.fc-button-primary:not(:disabled).fc-button-active,
.fc-button-primary:not(:disabled):active {
    background: var(--lu-primary) !important;
    border-color: var(--lu-primary) !important;
    color: #fff !important;
}
.fc-event { border-color: var(--lu-primary) !important; background: var(--lu-primary) !important; }
.fc-day-today { background: var(--lu-primary-soft) !important; }

/* ===== SweetAlert / Toastr / Notification ===== */
.swal2-confirm.swal2-styled {
    background-color: var(--lu-primary) !important;
}
.swal2-confirm.swal2-styled:focus {
    box-shadow: 0 0 0 3px var(--lu-primary-ring) !important;
}
.toast-info, .toast-primary {
    background-color: var(--lu-primary) !important;
}

/* ===== SCROLLBAR vibe Linear — đã chuyển sang auto-hide ở base.css; theme này không override màu cứng nữa ===== */

/* ===== STEPPER (Projects form) ===== */
.stepper-step.active .stepper-circle,
.step.active .step-circle {
    background: var(--lu-primary) !important;
    color: #fff !important;
    border-color: var(--lu-primary) !important;
}
.stepper-step.completed .stepper-circle,
.step.completed .step-circle {
    background: var(--lu-primary-600) !important;
    color: #fff !important;
}

/* ===== KANBAN drag-over ===== */
.kanban-column.drag-over,
.project-list.drag-over,
.dropzone-active {
    background: var(--lu-primary-soft) !important;
    border: 2px dashed var(--lu-primary) !important;
}

/* ===== TIMELINE / dotted indicators ===== */
.timeline-marker, .timeline-dot {
    background: var(--lu-primary) !important;
}

/* ===== TEXT highlight ===== */
mark, .mark, .highlight {
    background: var(--lu-primary-soft) !important;
    color: var(--lu-primary-700) !important;
    padding: 0 2px;
    border-radius: 2px;
}

/* ===== Misc utility (Vercel/Linear vibe) ===== */
.shadow, .shadow-sm, .shadow-md, .shadow-lg {
    box-shadow: 0 1px 2px hsl(240 5% 10% / 0.04), 0 1px 3px hsl(240 5% 10% / 0.06) !important;
}
.card, .modal-content {
    box-shadow: 0 1px 0 hsl(240 5% 10% / 0.04) !important;
}
.modal-content {
    box-shadow: 0 16px 32px -8px hsl(240 8% 8% / 0.18), 0 4px 8px hsl(240 8% 8% / 0.06) !important;
}
.dropdown-menu {
    box-shadow: 0 8px 24px -4px hsl(240 8% 8% / 0.12), 0 2px 4px hsl(240 8% 8% / 0.06) !important;
    border-color: var(--sd-border-strong) !important;
}

/* ===== DARK MODE polish ===== */
[data-theme="dark"] .btn-primary {
    background: var(--lu-primary-400) !important;
    border-color: var(--lu-primary-400) !important;
    color: #18181B !important;
}
[data-theme="dark"] .btn-primary:hover {
    background: var(--lu-primary-200) !important;
    border-color: var(--lu-primary-200) !important;
}
[data-theme="dark"] .badge.bg-primary,
[data-theme="dark"] .badge.text-bg-primary {
    background: rgba(129, 140, 248, 0.16) !important;
    color: #c7d2fe !important;
    border-color: rgba(129, 140, 248, 0.30) !important;
}
[data-theme="dark"] .text-primary, [data-theme="dark"] a.text-primary {
    color: var(--lu-primary-400) !important;
}
[data-theme="dark"] mark, [data-theme="dark"] .mark {
    background: rgba(129, 140, 248, 0.18) !important;
    color: #c7d2fe !important;
}