:root{
  --primary:#0ea5e9;/* sky-500 */
  --primary-600:#0284c7;
  --primary-50:#e0f2fe;
  --success:#10b981;
  --warning:#f59e0b;
  --danger:#ef4444;
  --info:#06b6d4;
  --text:#1f2937;
  --muted:#6b7280;
  --card:#ffffff;
  --bg:#f5f7fb;/* soft background */
  --border:#e5e7eb;
}

html,body{color:var(--text);} 
.content-wrapper{background:var(--bg);} 

/* Cards */
.card{border:1px solid var(--border); border-radius:.5rem; box-shadow:0 6px 14px rgba(0,0,0,.04);} 
.card-header{border-bottom:1px solid var(--border); background:linear-gradient(180deg, #fff, #fafbff);} 
.card-header .card-title, .card-header h5{font-weight:600;}

/* Content header */
.content-header h1{font-size:1.625rem; font-weight:700; letter-spacing:.2px;}
.content-header .text-right,.content-header .text-sm-right{font-weight:600; color:var(--muted);} 

/* Buttons */
.btn{border-radius:.45rem; box-shadow:0 4px 10px rgba(0,0,0,.06);} 
.btn .fa{margin-right:.35rem;}
.btn:hover{transform:translateY(-1px); box-shadow:0 6px 14px rgba(0,0,0,.08);} 
.btn:active{transform:translateY(0);} 
.btn-primary{background:var(--primary); border-color:var(--primary);} 
.btn-primary:hover{background:var(--primary-600); border-color:var(--primary-600);} 
.btn-success{background:var(--success); border-color:var(--success);} 
.btn-info{background:var(--info); border-color:var(--info);} 
.btn-warning{background:var(--warning); border-color:var(--warning); color:#1f2937;}
.btn-danger{background:var(--danger); border-color:var(--danger);} 

/* Dashboard KPI cards (AdminLTE small-box) */
.small-box{border-radius:.75rem; box-shadow:0 8px 22px rgba(2,8,20,.08); overflow:hidden; position:relative;}
.small-box > .inner{padding:1.25rem 1.25rem 1rem 1.25rem;}
.small-box .inner h3{font-size:2rem; font-weight:800; margin:0 0 .25rem;}
.small-box .inner p{font-size:.95rem; letter-spacing:.3px; opacity:.95;}
.small-box .icon{right:12px; top:10px; opacity:.25; transform:scale(1.05);} 
.small-box .icon .fa{font-size:60px;} 
.small-box:hover{transform:translateY(-2px); box-shadow:0 14px 30px rgba(2,8,20,.12);} 

/* Color fine-tuning on small-box for readability */
.bg-info .inner, .bg-danger .inner, .bg-secondary .inner{color:#fff;} 

/* Loading state (no markup changes needed) */
.btn.is-loading{position:relative; pointer-events:none; opacity:.85;} 
.btn.is-loading::after{
  content:""; position:absolute; right:.75rem; top:50%; width:1rem; height:1rem; margin-top:-.5rem; border:2px solid rgba(255,255,255,.6); border-top-color:#fff; border-radius:50%; animation:spin .65s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg);}}

/* Forms */
.form-control{border:1px solid var(--border); border-radius:.45rem;}
.form-control:focus{border-color:var(--primary); box-shadow:0 0 0 .2rem rgba(14,165,233,.15);} 
.input-group .form-control{border-radius:.45rem;} 
label{font-weight:600; color:var(--muted);} 

/* Tables */
.table{border-color:var(--border);} 
.table thead th{background:#f8fafc; border-bottom:2px solid var(--border); font-weight:600;} 
.table tbody tr:hover{background:#f9fbff;} 
.table-bordered td, .table-bordered th{border-color:var(--border);} 
.table-sticky thead th{position:sticky; top:0; z-index:2;}

/* Alerts */
.alert{border-radius:.5rem;}
.alert-info{background:var(--primary-50); color:#075985; border-color:#bae6fd;}

/* Sidebar active style (AdminLTE) */
.sidebar .nav-link.active{background:linear-gradient(135deg, var(--primary), var(--info)); box-shadow:0 4px 12px rgba(14,165,233,.25); border-radius:.5rem;}
.sidebar .nav-link.active .nav-icon{color:#fff;}

/* Navbar brand/logo tweaks */
.brand-link{border-bottom:1px solid var(--border);} 

/* Badges */
.badge-info{background:var(--info);} 

/* Small helpers */
.mt-6{margin-top:3.5rem!important;} .mb-6{margin-bottom:3.5rem!important;} 
.text-muted{color:var(--muted)!important;} 
.border{border:1px solid var(--border)!important;} 
.rounded{border-radius:.5rem!important;} 

/* Responsive tweaks */
@media (max-width: 575.98px){
  .content-header h1{font-size:1.35rem;}
  .small-box .icon{display:none;} /* keep KPIs focused on small screens */
}

/* Modal */
.modal-content{border-radius:.75rem; box-shadow:0 18px 40px rgba(2,8,20,.1);} 

/* DataTables quick polish */
.dataTables_wrapper .dataTables_paginate .paginate_button{border-radius:.35rem;}
.dataTables_wrapper .dataTables_filter input{border-radius:.45rem;}
