/**
 * Color Theme cho Hệ thống Quản lý Gara Ô tô
 * Industrial Blue Theme - Chuyên nghiệp, đáng tin cậy
 */

/* ========================================
   Color Palette - Industrial Blue
   ======================================== */
:root {
    /* Primary Colors - Xanh dương công nghiệp */
    --primary-color: #2563eb;        /* Blue 600 - Màu chính */
    --primary-dark: #1e40af;         /* Blue 800 - Màu đậm */
    --primary-light: #3b82f6;        /* Blue 500 - Màu nhạt */
    --primary-lighter: #60a5fa;      /* Blue 400 - Màu nhạt hơn */
    
    /* Gradient Primary */
    --primary-gradient: linear-gradient(135deg, #2563eb 0%, #1e40af 100%);
    --primary-gradient-hover: linear-gradient(135deg, #1e40af 0%, #1e3a8a 100%);
    
    /* Secondary Colors */
    --secondary-color: #475569;      /* Slate 600 - Xám xanh */
    --secondary-dark: #334155;        /* Slate 700 */
    
    /* Accent Colors - Giữ nguyên cho consistency */
    --success-color: #10b981;        /* Green 500 */
    --success-dark: #059669;          /* Green 600 */
    --danger-color: #ef4444;         /* Red 500 */
    --danger-dark: #dc2626;          /* Red 600 */
    --warning-color: #f59e0b;        /* Amber 500 */
    --warning-dark: #d97706;         /* Amber 600 */
    --info-color: #06b6d4;           /* Cyan 500 */
    --info-dark: #0891b2;             /* Cyan 600 */
    
    /* Neutral Colors */
    --text-primary: #1e293b;         /* Slate 800 */
    --text-secondary: #64748b;         /* Slate 500 */
    --text-muted: #94a3b8;           /* Slate 400 */
    --border-color: #e2e8f0;         /* Slate 200 */
    --bg-light: #f8fafc;             /* Slate 50 */
    --bg-white: #ffffff;
}

/* ========================================
   Override AdminLTE Primary Colors
   ======================================== */

/* Sidebar Active & Hover */
.sidebar-menu > li.active > a,
.sidebar-menu > li.active > a:hover {
    color: #2563eb !important;
}

.sidebar-menu > li > a::before {
    background: linear-gradient(180deg, #2563eb 0%, #1e40af 100%);
}

.sidebar-menu > li > a:hover {
    background: linear-gradient(90deg, rgba(37, 99, 235, 0.1) 0%, rgba(37, 99, 235, 0.05) 100%);
}

.sidebar-menu > li.active > a {
    background: linear-gradient(90deg, rgba(37, 99, 235, 0.15) 0%, rgba(37, 99, 235, 0.08) 100%);
}

/* Buttons */
.btn-primary {
    background: var(--primary-gradient) !important;
    border-color: #2563eb !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    background: var(--primary-gradient-hover) !important;
    border-color: #1e40af !important;
}

/* Links */
a {
    color: #2563eb;
}

a:hover,
a:focus {
    color: #1e40af;
}

/* Form Controls */
.form-control:focus {
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}

/* Select2 */
.select2-container--default.select2-container--focus .select2-selection--single {
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}

/* Alerts */
.alert-info {
    border-left-color: #2563eb;
}

.alert-info a {
    color: #1e40af;
}

/* Pagination */
.pagination > li > a:hover,
.pagination > li > span:hover {
    border-color: #2563eb;
    color: #2563eb;
}

.pagination > .active > a,
.pagination > .active > span {
    background: var(--primary-gradient) !important;
    border-color: #2563eb !important;
}

/* Tabs */
.nav-tabs > li > a:hover {
    color: #2563eb;
}

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
    background: #2563eb !important;
    border-color: #2563eb !important;
}

/* Dropdown */
.dropdown-menu > li > a:hover {
    color: #2563eb;
    background: rgba(37, 99, 235, 0.1);
}

/* Header */
.main-header #notify:hover,
.main-header #he_thong:hover {
    background: rgba(37, 99, 235, 0.1);
}

/* Right Menu */
.head_right_menu {
    background: var(--primary-gradient) !important;
}

.drawer-menu-item a:hover {
    color: #2563eb;
}

/* Login Page - Styles đã được di chuyển vào login.css cho layout mới */

/* Scrollbar */
::-webkit-scrollbar-thumb {
    background: var(--primary-gradient);
}

::-webkit-scrollbar-thumb:hover {
    background: var(--primary-gradient-hover);
}

/* Box Header with Primary Color */
.box-header .box-title {
    color: var(--text-primary);
}

/* Modal */
.modal-primary .modal-header,
.modal-primary .modal-footer {
    background: var(--primary-gradient) !important;
}

/* Labels & Badges */
.label-primary,
.bg-primary {
    background-color: #2563eb !important;
}

/* Progress Bars */
.progress-bar-primary {
    background-color: #2563eb;
}

/* Charts - Nếu có */
.morris-hover {
    border-color: #2563eb;
}

/* DataTables */
.dataTables_wrapper .dataTables_filter input:focus,
.dataTables_wrapper .dataTables_length select:focus {
    border-color: #2563eb;
}

/* Small Boxes Stats */
.small-box.bg-blue {
    background: var(--primary-gradient) !important;
}

/* AdminLTE Skin Blue Overrides */
.skin-blue .main-header .navbar {
    background-color: #2563eb;
}

.skin-blue .main-header .logo {
    background-color: #1e40af;
}

.skin-blue .wrapper,
.skin-blue .main-sidebar,
.skin-blue .left-side {
    background-color: #1e293b;
}

/* Table Row Hover */
.table-hover > tbody > tr:hover > td {
    background-color: rgba(37, 99, 235, 0.05);
}

/* Breadcrumb Active */
.breadcrumb > .active {
    color: #2563eb;
    font-weight: 600;
}

/* Loading Spinner */
.btn-primary.loading::after {
    border-color: #fff;
    border-top-color: transparent;
}

/* Custom utility classes */
.text-primary-custom {
    color: #2563eb !important;
}

.bg-primary-custom {
    background-color: #2563eb !important;
}

.border-primary-custom {
    border-color: #2563eb !important;
}

