@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

:root {
    --bg-dark: #0A0A0A;
    --bg-glass: rgba(20, 20, 20, 0.65);
    --border-glass: rgba(255, 255, 255, 0.08);
    --accent-blue: #00F0FF;
    --accent-blue-hover: #00D0DF;
    --accent-purple: #9D4EDD;
    --text-main: #E0E0E0;
    --text-muted: #888888;
}

/* Master Backgrounds */
body, .main-wrapper, .page-wrapper, .page-content, html {
    background-color: var(--bg-dark) !important;
    color: var(--text-main) !important;
    font-family: 'Inter', sans-serif !important;
    -webkit-font-smoothing: antialiased;
}

/* Force override all white backgrounds */
.bg-white, .card, .sidebar, .sidebar-header, .sidebar-body, .navbar, .footer, .dropdown-menu, .modal-content, .table, tbody, tr, td, th {
    background-color: transparent !important;
}

/* Glassmorphism Cards & Panels */
.card, .modal-content, .dropdown-menu {
    background: var(--bg-glass) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border: 1px solid var(--border-glass) !important;
    border-radius: 16px !important;
    box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.4) !important;
    transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), box-shadow 0.3s ease !important;
}
.card:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 12px 40px 0 rgba(0, 240, 255, 0.1) !important;
}

/* Sidebar & Navbar */
.sidebar {
    background: #111111 !important;
    border-right: 1px solid #222 !important;
}
.sidebar .sidebar-header {
    background: transparent !important;
    border-bottom: 1px solid #222 !important;
}
.sidebar .sidebar-header .sidebar-brand {
    color: #fff !important;
}
.sidebar .sidebar-body .nav-item .nav-link {
    color: #aaa !important;
    transition: all 0.2s ease !important;
    border-radius: 6px;
    margin: 4px 12px;
}
.sidebar .sidebar-body .nav-item.active .nav-link,
.sidebar .sidebar-body .nav-item:hover .nav-link {
    color: #fff !important;
    background: rgba(255, 255, 255, 0.08) !important;
    border: none !important;
    box-shadow: none !important;
}
/* Strip NobleUI lines and dots from sidebar */
.sidebar .sidebar-body .nav-item,
.sidebar .sidebar-body .nav-item .nav-link,
.sidebar .sidebar-body .nav-item .sub-menu {
    border: none !important;
    border-bottom: none !important;
    list-style: none !important;
}
.sidebar .sidebar-body .nav-item .nav-link::before,
.sidebar .sidebar-body .nav-item .nav-link::after,
.sidebar .sidebar-body .nav .nav-item.active .nav-link::before,
.sidebar .sidebar-body .nav .nav-item.active .nav-link::after,
.sidebar .sidebar-body .nav-item .sub-menu .nav-item .nav-link::before,
.sidebar .sidebar-body .nav-item .sub-menu .nav-item .nav-link::after {
    display: none !important;
    content: none !important;
}
.sidebar .sidebar-body .nav-item .nav-link .link-icon {
    color: inherit !important;
}

.navbar {
    background: var(--bg-glass) !important;
    backdrop-filter: blur(10px) !important;
    border-bottom: 1px solid var(--border-glass) !important;
}
.navbar .navbar-content .navbar-nav .nav-item .nav-link {
    color: var(--text-main) !important;
}

/* Typography Overrides */
h1, h2, h3, h4, h5, h6, p, span, a, label, th, td, div {
    color: var(--text-main);
}
h1, h2, h3, h4, h5, h6 {
    color: #fff !important;
    font-weight: 600 !important;
}
a {
    color: var(--accent-blue) !important;
}
a:hover {
    color: var(--accent-blue-hover) !important;
}

/* Buttons with Glowing Accent */
.btn-primary {
    background: linear-gradient(135deg, var(--accent-blue), var(--accent-purple)) !important;
    border: none !important;
    color: #000 !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 15px rgba(0, 240, 255, 0.3) !important;
    transition: all 0.3s ease !important;
}
.btn-primary:hover {
    box-shadow: 0 6px 20px rgba(0, 240, 255, 0.5) !important;
    transform: scale(1.02) !important;
}
.btn-secondary, .btn-success, .btn-danger, .btn-warning {
    border-radius: 8px !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
}
.btn-success { background: #00E676 !important; border: none !important; color: #000 !important;}
.btn-danger { background: #FF1744 !important; border: none !important; color: #fff !important;}

/* Input Fields */
.form-control, .form-select, input, .input-group-text {
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid var(--border-glass) !important;
    color: #fff !important;
    border-radius: 8px !important;
    padding: 10px 15px !important;
    transition: all 0.3s ease !important;
}
.form-control:focus, .form-select:focus {
    background: rgba(255, 255, 255, 0.07) !important;
    border-color: var(--accent-blue) !important;
    box-shadow: 0 0 10px rgba(0, 240, 255, 0.2) !important;
    transform: translateY(-1px);
}
.input-group-text {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

/* Nepali Datepicker Popup Overrides */
#ndp-nepali-box {
    z-index: 9999 !important;
}

/* Tables (Data Grids) */
.table {
    color: var(--text-main) !important;
    background: transparent !important;
}
.table thead th {
    background: rgba(10, 10, 10, 0.8) !important;
    color: var(--accent-blue) !important;
    border-bottom: 1px solid var(--border-glass) !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    position: sticky;
    top: 0;
    z-index: 10;
}
.table tbody tr {
    transition: background 0.3s ease !important;
    border-bottom: 1px solid var(--border-glass) !important;
    background: transparent !important;
}
.table tbody tr:hover {
    background: rgba(255, 255, 255, 0.05) !important;
}
.table td, .table th {
    border-color: var(--border-glass) !important;
    color: var(--text-main) !important;
}

/* Status Badges */
.badge {
    border-radius: 20px !important;
    padding: 5px 10px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    border: 1px solid transparent !important;
}
.badge.bg-success {
    background: rgba(0, 230, 118, 0.1) !important;
    color: #00E676 !important;
    border-color: rgba(0, 230, 118, 0.3) !important;
    box-shadow: 0 0 10px rgba(0, 230, 118, 0.2);
}
.badge.bg-danger {
    background: rgba(255, 23, 68, 0.1) !important;
    color: #FF1744 !important;
    border-color: rgba(255, 23, 68, 0.3) !important;
    box-shadow: 0 0 10px rgba(255, 23, 68, 0.2);
}
.badge.bg-warning {
    background: rgba(255, 196, 0, 0.1) !important;
    color: #FFC400 !important;
    border-color: rgba(255, 196, 0, 0.3) !important;
    box-shadow: 0 0 10px rgba(255, 196, 0, 0.2);
}

/* Page content background */
.page-wrapper .page-content {
    background-color: var(--bg-dark) !important;
}

/* Modal specific */
.modal-backdrop {
    background-color: rgba(0,0,0,0.8) !important;
    backdrop-filter: blur(5px) !important;
}
.modal-header {
    border-bottom: 1px solid var(--border-glass) !important;
}
.modal-footer {
    border-top: 1px solid var(--border-glass) !important;
}

/* Select2 Overrides */
.select2-container--default .select2-selection--single {
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid var(--border-glass) !important;
    color: #fff !important;
    border-radius: 8px !important;
}
.select2-dropdown {
    background: var(--bg-glass) !important;
    backdrop-filter: blur(12px) !important;
    border: 1px solid var(--border-glass) !important;
}

/* Loader / Shimmer Effect */
@keyframes shimmer {
    0% { background-position: -468px 0; }
    100% { background-position: 468px 0; }
}
.skeleton-loader {
    animation: shimmer 2s linear infinite;
    background: linear-gradient(to right, rgba(255,255,255,0.05) 8%, rgba(255,255,255,0.1) 18%, rgba(255,255,255,0.05) 33%);
    background-size: 800px 104px;
}

/* SweetAlert2 Overrides */
.swal2-popup {
    background: var(--bg-glass) !important;
    backdrop-filter: blur(15px) !important;
    -webkit-backdrop-filter: blur(15px) !important;
    border: 1px solid var(--border-glass) !important;
    border-radius: 16px !important;
    color: var(--text-main) !important;
    box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.5) !important;
}
.swal2-title, .swal2-html-container, .swal2-content {
    color: #fff !important;
}
.swal2-icon.swal2-warning {
    border-color: #FFC400 !important;
    color: #FFC400 !important;
}
.swal2-icon.swal2-success {
    border-color: #00E676 !important;
    color: #00E676 !important;
}
.swal2-icon.swal2-error {
    border-color: #FF1744 !important;
    color: #FF1744 !important;
}
.swal2-icon.swal2-info {
    border-color: var(--accent-blue) !important;
    color: var(--accent-blue) !important;
}
.swal2-confirm {
    background: linear-gradient(135deg, var(--accent-blue), var(--accent-purple)) !important;
    color: #000 !important;
    border: none !important;
}
.swal2-cancel {
    background: rgba(255, 255, 255, 0.1) !important;
    color: #fff !important;
}

/* Hide Laravel Debugbar in UI */
.phpdebugbar, #phpdebugbar {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    z-index: -9999 !important;
}

/* Animated Logo for Login */
.animated-logo {
    font-size: 3rem;
    font-weight: 900;
    background: linear-gradient(270deg, var(--accent-blue), var(--accent-purple), var(--accent-blue));
    background-size: 200% 200%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: gradientShift 3s ease infinite;
    letter-spacing: 2px;
}
@keyframes gradientShift {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}