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

:root {
    --eg-primary: #6366f1; --eg-primary-rgb: 99,102,241; --eg-primary-dark: #4f46e5; --eg-primary-light: #eef2ff;
    --eg-success: #10b981; --eg-info: #06b6d4; --eg-warning: #f59e0b; --eg-danger: #ef4444;
    --eg-body-bg: #f1f5f9; --eg-text: #1e293b; --eg-text-muted: #64748b; --eg-text-light: #94a3b8;
    --eg-border: #e2e8f0; --eg-card-radius: 16px; --eg-radius: 10px; --eg-radius-sm: 8px;
    --eg-sidebar-width: 272px; --eg-sidebar-bg: #ffffff;
    --eg-card-shadow: 0 1px 3px rgba(0,0,0,0.04); --eg-card-shadow-lg: 0 10px 15px -3px rgba(0,0,0,0.05);
    --eg-transition: all 0.2s cubic-bezier(0.4,0,0.2,1);
    --cui-primary: #6366f1; --cui-primary-rgb: 99,102,241;
}

*,*::before,*::after { -webkit-font-smoothing: antialiased; }
html { scroll-behavior: smooth; }
body { font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif!important; background:var(--eg-body-bg)!important; color:var(--eg-text); font-size:.875rem; line-height:1.6; }
::selection { background:rgba(99,102,241,.15); }

/* LAYOUT */
.sidebar { --cui-sidebar-bg:#fff!important; --cui-sidebar-color:var(--eg-text)!important; --cui-sidebar-nav-link-color:var(--eg-text-muted)!important; --cui-sidebar-nav-link-active-color:var(--eg-primary)!important; --cui-sidebar-nav-link-hover-color:var(--eg-text)!important; position:fixed!important; top:0; bottom:0; left:0; z-index:1040; width:var(--eg-sidebar-width)!important; background:#fff!important; border:none!important; border-right:1px solid var(--eg-border)!important; box-shadow:0 0 20px rgba(0,0,0,.04); }
.wrapper { margin-left:var(--eg-sidebar-width); transition:margin-left .3s ease; min-height:100vh; }
.sidebar-narrow-unfoldable~.wrapper { margin-left:64px; }
@media(max-width:991.98px) { .wrapper{margin-left:0!important;padding-bottom:80px} .sidebar{margin-left:calc(-1*var(--eg-sidebar-width));z-index:1050} .sidebar.show{margin-left:0} }
.sidebar-backdrop { background:rgba(15,23,42,.4)!important; backdrop-filter:blur(4px); }

/* SIDEBAR LIGHT */
.sidebar-header { border-bottom:1px solid var(--eg-border)!important; background:#fff; }
.sidebar-brand { padding:1.25rem 1rem; height:auto; display:flex; align-items:center; justify-content:center; }
.sidebar-brand img { max-height:38px; }
.sidebar-nav { padding:.5rem 0; overflow-y:auto; scrollbar-width:thin; scrollbar-color:rgba(0,0,0,.08) transparent; background:#fff; }
.sidebar-nav::-webkit-scrollbar { width:4px } .sidebar-nav::-webkit-scrollbar-thumb { background:rgba(0,0,0,.08); border-radius:10px; }
.sidebar-nav .nav-link { padding:.55rem 1rem!important; margin:2px 10px; border-radius:var(--eg-radius-sm); color:var(--eg-text-muted)!important; font-size:.82rem; font-weight:500; transition:var(--eg-transition); display:flex; align-items:center; gap:.6rem; border:none!important; }
.sidebar-nav .nav-link:hover { background:#f1f5f9!important; color:var(--eg-text)!important; }
.sidebar-nav .nav-link.active,.sidebar-nav .sidebar-nav-link.active { background:var(--eg-primary-light)!important; color:var(--eg-primary)!important; font-weight:600; border-left:none!important; }
.sidebar-nav .nav-icon { font-size:1.15rem; width:24px; min-width:24px; text-align:center; opacity:.7; }
.sidebar-nav .nav-link.active .nav-icon { opacity:1; color:var(--eg-primary); }
.sidebar-nav .nav-link:hover .nav-icon { opacity:1; }
.sidebar-nav .nav-title { color:var(--eg-text-light)!important; font-size:.65rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; padding:1.25rem 1.25rem .4rem; }
.sidebar-nav .nav-divider { border-top:1px solid var(--eg-border); margin:.5rem 1rem; }
.sidebar-nav .nav-group-items { background:transparent; }
.sidebar-nav .nav-group-items .nav-link { padding-left:2.75rem!important; font-size:.78rem; font-weight:400; color:var(--eg-text-light)!important; }
.sidebar-nav .nav-group-items .nav-link:hover { color:var(--eg-text)!important; background:#f8fafc!important; }
.sidebar-nav .nav-group-items .nav-link.active { color:var(--eg-primary)!important; background:var(--eg-primary-light)!important; }
.sidebar-nav .nav-group-toggle::after { transition:transform .25s ease; filter:none; }
.sidebar-nav .nav-group.show>.nav-group-toggle { color:var(--eg-text)!important; font-weight:600; }
.sidebar-nav .badge { font-size:.6rem; }

/* HEADER */
.header { background:rgba(255,255,255,.85)!important; backdrop-filter:blur(20px) saturate(180%); -webkit-backdrop-filter:blur(20px) saturate(180%); border-bottom:1px solid rgba(226,232,240,.6)!important; box-shadow:none!important; min-height:64px; z-index:1030; }
.header .nav-link { color:var(--eg-text-muted)!important; font-weight:500; font-size:.825rem; padding:.4rem .65rem; border-radius:var(--eg-radius-sm); transition:var(--eg-transition); }
.header .nav-link:hover { color:var(--eg-primary)!important; background:var(--eg-primary-light); }
.header-toggler { border:none!important; background:none!important; color:var(--eg-text)!important; padding:.5rem!important; border-radius:var(--eg-radius-sm)!important; width:40px; height:40px; display:flex; align-items:center; justify-content:center; }
.header-toggler:hover { background:rgba(0,0,0,.04)!important; }
.header .input-group { background:#f1f5f9; border-radius:var(--eg-radius); overflow:hidden; }
.header .input-group .input-group-text,.header .input-group .form-control { background:transparent; border:none; }
.header .input-group .form-control:focus { box-shadow:none; }

/* CARDS */
.card { background:#fff!important; border:1px solid rgba(0,0,0,.04)!important; border-radius:var(--eg-card-radius)!important; box-shadow:var(--eg-card-shadow)!important; transition:box-shadow .3s ease; overflow:hidden; }
.card:hover { transform:none!important; box-shadow:var(--eg-card-shadow-lg)!important; }
.card-header { background:transparent!important; border-bottom:1px solid var(--eg-border); padding:1rem 1.25rem; font-weight:600; }
.card-header h5,.card-header h6,.card-header .card-title { font-weight:700; font-size:.9rem; color:var(--eg-text); margin:0; }
.card-body { padding:1.25rem; }
.card-header.bg-primary { background:linear-gradient(135deg,#6366f1,#818cf8)!important; border-bottom:none; }
.card-header.bg-success { background:linear-gradient(135deg,#10b981,#34d399)!important; border-bottom:none; }
.card-header.bg-info { background:linear-gradient(135deg,#06b6d4,#22d3ee)!important; border-bottom:none; }
.card-header.bg-warning { background:linear-gradient(135deg,#f59e0b,#fbbf24)!important; border-bottom:none; }
.card-header.bg-danger { background:linear-gradient(135deg,#ef4444,#f87171)!important; border-bottom:none; }
.card.bg-primary { background:linear-gradient(135deg,#6366f1,#818cf8)!important; border:none!important; }
.card.bg-success { background:linear-gradient(135deg,#10b981,#34d399)!important; border:none!important; }
.card.bg-info { background:linear-gradient(135deg,#06b6d4,#22d3ee)!important; border:none!important; }
.card.bg-warning { background:linear-gradient(135deg,#f59e0b,#fbbf24)!important; border:none!important; }
.card.bg-danger { background:linear-gradient(135deg,#ef4444,#f87171)!important; border:none!important; }

/* TABLES */
.table { font-size:.82rem; margin-bottom:0; }
.table>thead { background:#f8fafc; }
.table>thead th,.table-light th { font-weight:700!important; color:var(--eg-text-muted)!important; text-transform:uppercase; font-size:.68rem; letter-spacing:.06em; padding:.8rem 1rem; border-bottom:2px solid var(--eg-border)!important; white-space:nowrap; background:#f8fafc!important; }
.table>tbody td { padding:.7rem 1rem; vertical-align:middle; border-bottom:1px solid #f1f5f9; }
.table-hover>tbody>tr:hover { background:rgba(99,102,241,.02)!important; }

/* ══════════════════════════════════════════════════════════════
   MODERN FORM STYLES
   ══════════════════════════════════════════════════════════════ */

/* --- Input & Select Base --- */
.form-control,.form-select {
    border:1.5px solid var(--eg-border)!important; border-radius:var(--eg-radius-sm)!important;
    padding:.65rem 1rem; font-size:.85rem; transition:var(--eg-transition);
    background-color:#fff!important; color:var(--eg-text);
    height:auto; min-height:42px;
}
.form-control:hover,.form-select:hover { border-color:#c7d2e0!important; }
.form-control:focus,.form-select:focus {
    border-color:var(--eg-primary)!important;
    box-shadow:0 0 0 3px rgba(var(--eg-primary-rgb),.12)!important;
    background-color:#fff!important;
}
.form-control::placeholder { color:var(--eg-text-light); font-weight:400; }

/* --- Labels --- */
.form-label {
    font-weight:600; font-size:.78rem; color:var(--eg-text); margin-bottom:.4rem;
    letter-spacing:.01em; display:flex; align-items:center; gap:.3rem;
}
.form-label .text-danger { color:var(--eg-danger)!important; font-size:.7rem; }
.form-label i { font-size:.95rem; opacity:.65; }

/* --- Textarea --- */
textarea.form-control { min-height:80px; resize:vertical; line-height:1.65; }

/* --- File Input --- */
input[type="file"].form-control {
    padding:.45rem .75rem; font-size:.8rem; line-height:1.8;
    cursor:pointer; background:#f8fafc!important;
}
input[type="file"].form-control::file-selector-button {
    background:linear-gradient(135deg,var(--eg-primary),#818cf8); color:#fff;
    border:none; padding:.35rem .85rem; border-radius:6px; font-weight:600;
    font-size:.76rem; margin-right:.75rem; cursor:pointer; transition:var(--eg-transition);
}
input[type="file"].form-control::file-selector-button:hover { background:var(--eg-primary-dark); }

/* --- Select --- */
.form-select { background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%2364748b' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"); background-size:14px 10px; padding-right:2.25rem; }

/* --- Checkbox & Radio --- */
.form-check-input { width:1.15em; height:1.15em; border:1.5px solid var(--eg-border); transition:var(--eg-transition); cursor:pointer; }
.form-check-input:checked { background-color:var(--eg-primary); border-color:var(--eg-primary); box-shadow:0 1px 3px rgba(var(--eg-primary-rgb),.2); }
.form-check-input:focus { box-shadow:0 0 0 3px rgba(var(--eg-primary-rgb),.12); border-color:var(--eg-primary); }
.form-check-label { font-size:.82rem; font-weight:500; color:var(--eg-text); cursor:pointer; }

/* --- Form Help Text --- */
.form-text,small.text-muted,.card-body small.text-muted { font-size:.72rem!important; color:var(--eg-text-light)!important; margin-top:.3rem; display:block; }

/* --- Input Group --- */
.input-group .form-control { border-right:none!important; }
.input-group .btn { border:1.5px solid var(--eg-border)!important; border-left:none!important; }
.input-group .input-group-text {
    background:#f8fafc; border:1.5px solid var(--eg-border)!important;
    font-size:.82rem; color:var(--eg-text-muted); font-weight:500; min-width:42px; justify-content:center;
}
.input-group:focus-within .form-control,
.input-group:focus-within .input-group-text,
.input-group:focus-within .btn { border-color:var(--eg-primary)!important; }

/* --- Form Card Sections (colored headers in forms) --- */
form .card { margin-bottom:0; }
form .card .card-header { padding:.85rem 1.25rem; }
form .card .card-header h5,
form .card .card-header .card-title {
    font-size:.85rem!important; font-weight:700; display:flex; align-items:center; gap:.5rem;
}
form .card .card-header.bg-primary h5,
form .card .card-header.bg-success h5,
form .card .card-header.bg-info h5,
form .card .card-header.bg-warning h5,
form .card .card-header.bg-danger h5,
form .card .card-header.bg-primary .card-title,
form .card .card-header.bg-success .card-title,
form .card .card-header.bg-info .card-title,
form .card .card-header.bg-warning .card-title,
form .card .card-header.bg-danger .card-title { color:#fff!important; font-size:.85rem!important; }

/* --- Form Card Body spacing --- */
form .card .card-body { padding:1.25rem 1.5rem; }
form .card .card-body .row.g-3>div { margin-bottom:0; }
form .mb-3,.card-body .mb-3 { margin-bottom:1rem!important; }
form .mb-2 { margin-bottom:.75rem!important; }

/* --- Sticky Save Sidebar --- */
form .col-lg-3>.card:last-child .card-body,
form .col-lg-4>.card:last-child .card-body { padding:1.25rem; }
form .col-lg-3>.card .btn-lg,
form .col-lg-4>.card .btn-lg {
    padding:.7rem 1.25rem; font-size:.88rem; font-weight:700;
    border-radius:var(--eg-radius)!important;
    box-shadow:0 4px 14px rgba(var(--eg-primary-rgb),.25);
    letter-spacing:.02em;
}
form .col-lg-3>.card .btn-lg:hover,
form .col-lg-4>.card .btn-lg:hover { box-shadow:0 6px 20px rgba(var(--eg-primary-rgb),.35); transform:translateY(-1px); }

/* --- Money / Number Inputs --- */
.money-input { font-weight:600!important; font-size:.95rem!important; letter-spacing:.02em; }

/* --- Form inline styles override --- */
form .form-control[style*="font-size"],
form .form-select[style*="font-size"],
form .form-label[style*="font-size"],
form textarea[style*="font-size"] { font-size:inherit!important; }

/* --- Disabled / Readonly --- */
.form-control:disabled,.form-control[readonly] { background:#f1f5f9!important; color:var(--eg-text-muted); cursor:not-allowed; opacity:.7; }
.form-select:disabled { background:#f1f5f9!important; color:var(--eg-text-muted); cursor:not-allowed; opacity:.7; }

/* --- Validation --- */
.form-control.is-invalid,.was-validated .form-control:invalid { border-color:var(--eg-danger)!important; }
.form-control.is-invalid:focus,.was-validated .form-control:invalid:focus { box-shadow:0 0 0 3px rgba(239,68,68,.12)!important; }
.invalid-feedback { font-size:.72rem; color:var(--eg-danger); font-weight:500; }

/* --- Form Responsive Mobile --- */
@media(max-width:991.98px) {
    form .card .card-body { padding:1rem 1.15rem; }
    form .col-lg-3,form .col-lg-4 { order:-1; }
    form .col-lg-3>.card .btn-lg,form .col-lg-4>.card .btn-lg { font-size:.84rem; }
    .form-control,.form-select { padding:.6rem .85rem; font-size:.84rem; min-height:40px; }
    .form-label { font-size:.76rem; }
}
@media(max-width:575.98px) {
    form .card .card-body { padding:.85rem 1rem; }
    .form-control,.form-select { padding:.55rem .75rem; min-height:38px; }
    textarea.form-control { min-height:70px; }
}

/* --- Switch (Form Switch) --- */
.form-switch .form-check-input { width:2.2em; height:1.2em; border-radius:1em; }
.form-switch .form-check-input:checked { background-color:var(--eg-primary); border-color:var(--eg-primary); }

/* BUTTONS */
.btn { font-weight:600; font-size:.82rem; padding:.5rem 1rem; border-radius:var(--eg-radius-sm)!important; transition:var(--eg-transition); display:inline-flex; align-items:center; justify-content:center; gap:.35rem; white-space:nowrap; }
.btn:active { transform:scale(.97); }
.btn-primary { background:var(--eg-primary)!important; border-color:var(--eg-primary)!important; color:#fff!important; box-shadow:0 1px 3px rgba(99,102,241,.2); }
.btn-primary:hover { background:var(--eg-primary-dark)!important; border-color:var(--eg-primary-dark)!important; box-shadow:0 4px 12px rgba(99,102,241,.3); }
.btn-success { background:var(--eg-success)!important; border-color:var(--eg-success)!important; color:#fff!important; }
.btn-success:hover { background:#059669!important; border-color:#059669!important; }
.btn-danger { background:var(--eg-danger)!important; border-color:var(--eg-danger)!important; color:#fff!important; }
.btn-danger:hover { background:#dc2626!important; border-color:#dc2626!important; }
.btn-info { background:var(--eg-info)!important; border-color:var(--eg-info)!important; color:#fff!important; }
.btn-warning { background:var(--eg-warning)!important; border-color:var(--eg-warning)!important; color:#fff!important; }
.btn-secondary { background:#e2e8f0!important; border-color:#e2e8f0!important; color:var(--eg-text)!important; }
.btn-secondary:hover { background:#cbd5e1!important; border-color:#cbd5e1!important; }
.btn-sm { padding:.3rem .6rem; font-size:.75rem; border-radius:6px!important; }

/* BADGES */
.badge { font-weight:600; font-size:.68rem; padding:.3rem .55rem; border-radius:6px; }
.bg-primary { background:var(--eg-primary)!important; } .bg-success { background:var(--eg-success)!important; }
.bg-danger { background:var(--eg-danger)!important; } .bg-warning { background:var(--eg-warning)!important; color:#fff!important; }
.bg-info { background:var(--eg-info)!important; } .bg-secondary { background:#94a3b8!important; }

/* ALERTS */
.alert { border:none!important; border-radius:var(--eg-radius)!important; font-size:.85rem; font-weight:500; padding:.875rem 1.25rem; }
.alert-success { background:#ecfdf5!important; color:#065f46!important; border-left:4px solid var(--eg-success)!important; }
.alert-danger { background:#fef2f2!important; color:#991b1b!important; border-left:4px solid var(--eg-danger)!important; }
.alert-warning { background:#fffbeb!important; color:#92400e!important; border-left:4px solid var(--eg-warning)!important; }
.alert-info { background:#ecfeff!important; color:#155e75!important; border-left:4px solid var(--eg-info)!important; }

/* DROPDOWNS */
.dropdown-menu { border:1px solid var(--eg-border)!important; border-radius:var(--eg-radius)!important; box-shadow:0 10px 40px rgba(0,0,0,.08)!important; padding:.5rem!important; animation:ddFade .15s ease; }
@keyframes ddFade { from{opacity:0;transform:translateY(-6px)} to{opacity:1;transform:translateY(0)} }
.dropdown-item { border-radius:var(--eg-radius-sm)!important; padding:.5rem .75rem; font-size:.82rem; font-weight:500; transition:var(--eg-transition); }
.dropdown-item:hover { background:#f1f5f9!important; }

/* MODALS */
.modal-content { border:none!important; border-radius:var(--eg-card-radius)!important; box-shadow:0 20px 60px rgba(0,0,0,.15)!important; }
.modal-header { border-bottom:1px solid var(--eg-border); padding:1.25rem 1.5rem; }
.modal-header .modal-title { font-weight:700; }
.modal-footer { border-top:1px solid var(--eg-border); }

/* TYPOGRAPHY */
h1,.h1 { font-weight:700; font-size:1.25rem; } h2,.h2 { font-weight:700; font-size:1.15rem; }
h3,.h3 { font-weight:700; font-size:1.05rem; } h4,.h4 { font-weight:700; font-size:.95rem; }

/* PAGE HEADER - compact */
.body .border-bottom { border-bottom:none!important; padding-bottom:0!important; margin-bottom:.75rem!important; }
.body .border-bottom .h2,.body .border-bottom h1 { font-size:1.1rem!important; font-weight:700; display:flex; align-items:center; gap:.5rem; margin:0; }
.body .border-bottom .h2 i,.body .border-bottom h1 i { font-size:1.15rem; color:var(--eg-primary); }
.body .border-bottom .breadcrumb { margin:0!important; }
.body .border-bottom p.text-muted { display:none; }
.body .border-bottom .badge.bg-gradient-primary { display:none; }

/* FOOTER */
.footer { background:transparent!important; border-top:1px solid var(--eg-border)!important; font-size:.78rem; }

/* AVATAR */
.avatar { width:36px; height:36px; border-radius:50%; object-fit:cover; } .avatar-lg { width:40px; height:40px; }

/* SCROLLBAR */
::-webkit-scrollbar { width:6px; height:6px; } ::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:#cbd5e1; border-radius:10px; } ::-webkit-scrollbar-thumb:hover { background:#94a3b8; }

/* SPINNER */
.spinner-overlay { position:fixed; inset:0; background:rgba(255,255,255,.7); backdrop-filter:blur(4px); display:none; align-items:center; justify-content:center; z-index:9999; }
.spinner-overlay.active { display:flex; }
.spinner-border { color:var(--eg-primary)!important; }

/* BREADCRUMB */
.breadcrumb { font-size:.78rem; } .breadcrumb-item a { color:var(--eg-primary); text-decoration:none; font-weight:500; }

/* PAGINATION */
.page-link { border-radius:var(--eg-radius-sm)!important; margin:0 2px; border:none; color:var(--eg-text-muted); font-weight:500; }
.page-link:hover { background:var(--eg-primary-light); color:var(--eg-primary); }
.page-item.active .page-link { background:var(--eg-primary)!important; border-color:var(--eg-primary)!important; }

/* MOBILE BOTTOM NAV */
.mobile-bottom-nav { position:fixed; bottom:0; left:0; right:0; height:64px; background:rgba(255,255,255,.96); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); border-top:1px solid var(--eg-border); display:none; justify-content:space-around; align-items:center; z-index:1045; padding:0 4px; padding-bottom:env(safe-area-inset-bottom); box-shadow:0 -2px 12px rgba(0,0,0,.04); }
@media(max-width:991.98px) { .mobile-bottom-nav{display:flex} }
.bottom-nav-item { display:flex; flex-direction:column; align-items:center; gap:2px; color:var(--eg-text-muted); text-decoration:none; font-size:.62rem; font-weight:600; padding:4px 10px; border-radius:10px; transition:var(--eg-transition); min-width:52px; position:relative; }
.bottom-nav-item i { font-size:1.2rem; line-height:1; }
.bottom-nav-item.active,.bottom-nav-item:hover { color:var(--eg-primary); }
.bottom-nav-item.active::before { content:''; position:absolute; top:-1px; left:50%; transform:translateX(-50%); width:20px; height:3px; background:var(--eg-primary); border-radius:0 0 3px 3px; }
.bottom-nav-add { width:44px; height:44px; border-radius:14px; background:linear-gradient(135deg,var(--eg-primary),#8b5cf6); color:#fff!important; font-size:0; margin-top:-12px; box-shadow:0 4px 15px rgba(99,102,241,.35); padding:0; display:flex; align-items:center; justify-content:center; }
.bottom-nav-add i { font-size:1.4rem; color:#fff; }
.bottom-nav-add:hover { color:#fff!important; transform:scale(1.05); }

/* RESPONSIVE */
@media(max-width:991.98px) { .body .container-lg{padding-left:12px;padding-right:12px} .card{border-radius:12px!important} h1,.h1{font-size:1.4rem} h2,.h2{font-size:1.25rem} }
@media(max-width:575.98px) { .body .container-lg{padding-left:8px;padding-right:8px} .card-body{padding:1rem} .btn{padding:.5rem .75rem;font-size:.8rem} .table>thead th,.table>tbody td{padding:.6rem .5rem;font-size:.75rem} }

/* ANIMATIONS */
@keyframes fadeInUp { from{opacity:0;transform:translateY(10px)} to{opacity:1;transform:translateY(0)} }
.card { animation:fadeInUp .3s ease forwards; }
