/* Colorful theme */
:root{
  --brand:#6c5ce7;
  --brand-2:#00b894;
  --brand-3:#0984e3;
  --brand-4:#fd79a8;
  --bg:#f3f6fb;
}
body { background:var(--bg); }
.navbar { background: linear-gradient(90deg, var(--brand), var(--brand-3)); }
.navbar .nav-link, .navbar .navbar-brand { color:#fff !important; }
.navbar .dropdown-menu { border-radius: 14px; box-shadow: 0 12px 30px rgba(0,0,0,.15); }
.card { border:none; box-shadow: 0 10px 30px rgba(35, 55, 80, .10); border-radius: 18px; }
.card .card-icon { font-size: 1.8rem; opacity: .85; }
.table thead th { background:#e9eef7; text-transform: uppercase; font-size:.78rem; letter-spacing:.04em; }
.badge-grade { font-weight:700; background: linear-gradient(120deg,#4facfe,#00f2fe); }
.btn-pill { border-radius: 9999px; }
.btn-brand { background:var(--brand); color:#fff; border:none; }
.btn-brand:hover { filter: brightness(1.05); color:#fff; }
.btn-brand2 { background:var(--brand-2); color:#fff; border:none; }
.btn-brand3 { background:var(--brand-3); color:#fff; border:none; }
.btn-brand4 { background:var(--brand-4); color:#fff; border:none; }
.kpi { display:flex; align-items:center; gap:.75rem; }
.kpi .kpi-icon { font-size:1.6rem; width:2.2rem; height:2.2rem; display:flex; align-items:center; justify-content:center; border-radius:10px; background:#ffffffaa; color:#111; }
.kpi .kpi-value { font-size:1.6rem; font-weight: 800; }
.loading-overlay { position: fixed; inset: 0; background: rgba(255,255,255,0.7);
  display: none; align-items: center; justify-content: center; z-index: 9999; }
.loading-overlay .spinner-border { width:3rem; height:3rem; }
th.text-end, td.text-end { font-variant-numeric: tabular-nums; }
th.col-money, td.col-money { color:#0f5132; font-weight:700; }
th.col-qty, td.col-qty { color:#0d6efd; font-weight:700; }
.grid-2 { display:grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
@media (max-width: 992px) { .grid-2 { grid-template-columns: 1fr; } }
.section-title { display:flex; align-items:center; gap:.5rem; font-weight:800; }
.section-title i { opacity:.9; }
.alert-stock { background:#fff; border:2px solid #74b9ff; border-radius:12px; padding:.5rem .75rem; font-weight:600; }
@media print { .no-print { display:none!important; } }