:root{
  /* ===== Hasabaty Design Tokens ===== */
  --hs-bg: #f6f8fb;
  --hs-surface: #ffffff;
  --hs-surface-2: #f2f6ff;
  --hs-border: rgba(16,24,40,.10);
  --hs-border-2: rgba(16,24,40,.14);
  --hs-shadow: 0 12px 40px rgba(15,23,42,.10);
  --hs-shadow-sm: 0 6px 18px rgba(15,23,42,.08);
  --hs-radius: 16px;
  --hs-radius-sm: 12px;
  --hs-gap: 16px;

  /* Brand */
  --hs-primary: #2f6df6;
  --hs-primary-2: #5b7cfa;
  --hs-accent: #16a34a;
  --hs-danger: #ef4444;
  --hs-warning: #f59e0b;

  /* Text */
  --hs-text: #0f172a;
  --hs-muted: #64748b;
  --hs-muted-2: #94a3b8;

  /* Layout */
  --hs-content-max: 1400px;
  --hs-sidebar-w: 280px;
  --hs-topbar-h: 64px;
}

/* ===== Global layout polish ===== */
html, body{height:100%;}
body{
  background: radial-gradient(1200px 600px at 80% -10%, rgba(47,109,246,.18), transparent 60%),
              radial-gradient(900px 500px at -10% 20%, rgba(22,163,74,.14), transparent 60%),
              var(--hs-bg);
  color: var(--hs-text);
}

.hs-container{
  width: min(100%, var(--hs-content-max));
  margin-inline: auto;
  padding-inline: 18px;
}

.hs-surface{
  background: var(--hs-surface);
  border: 1px solid var(--hs-border);
  border-radius: var(--hs-radius);
  box-shadow: var(--hs-shadow-sm);
}

.hs-card{
  background: var(--hs-surface);
  border: 1px solid var(--hs-border);
  border-radius: var(--hs-radius);
  box-shadow: var(--hs-shadow-sm);
}

.hs-card .card-header{
  background: linear-gradient(180deg, rgba(47,109,246,.10), rgba(47,109,246,.02));
  border-bottom: 1px solid var(--hs-border);
}

.hs-page{
  padding: 18px 0 34px;
}

.page-header{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap: 12px;
  margin-bottom: 14px;
}
.page-title{
  margin:0;
  font-weight: 800;
  letter-spacing: -0.3px;
}
.page-subtitle{
  margin: 4px 0 0;
  color: var(--hs-muted);
  font-size: .95rem;
}
.page-actions{display:flex; gap:10px; flex-wrap:wrap; align-items:center;}

.chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  border: 1px solid var(--hs-border);
  background: rgba(255,255,255,.7);
  padding: 6px 10px;
  border-radius: 999px;
  color: var(--hs-muted);
  font-size: .9rem;
  box-shadow: 0 2px 10px rgba(15,23,42,.06);
}

/* Make tables feel modern */
.table{
  border-color: var(--hs-border) !important;
}
.table thead th{
  background: linear-gradient(180deg, rgba(15,23,42,.05), rgba(15,23,42,.01));
  color: #0b1220;
  border-bottom: 1px solid var(--hs-border-2) !important;
  font-weight: 800;
}
.table tbody tr:hover{
  background: rgba(47,109,246,.06);
}
.table .mono{font-variant-numeric: tabular-nums;}

/* Inputs */
.form-control, .form-select{
  border-radius: 12px;
  border-color: var(--hs-border-2);
}
.form-control:focus, .form-select:focus{
  border-color: rgba(47,109,246,.55);
  box-shadow: 0 0 0 .2rem rgba(47,109,246,.12);
}

/* Buttons */
.btn{border-radius: 12px; font-weight: 800;}
.btn-primary{
  background: linear-gradient(180deg, var(--hs-primary), #2459d6);
  border-color: rgba(36,89,214,.35);
  box-shadow: 0 10px 22px rgba(47,109,246,.18);
}
.btn-primary:hover{filter: brightness(.98);}
.btn-outline-primary{border-color: rgba(47,109,246,.4);}
.btn-danger{
  background: linear-gradient(180deg, var(--hs-danger), #b91c1c);
  border-color: rgba(185,28,28,.35);
}
.btn-success{
  background: linear-gradient(180deg, var(--hs-accent), #0f7a33);
  border-color: rgba(15,122,51,.35);
}

/* Badges */
.badge{
  border-radius: 999px;
  padding: .4em .65em;
  font-weight: 800;
}

/* Sidebar subtle glow */
.sidebar{
  background: radial-gradient(900px 600px at 0% 0%, rgba(47,109,246,.18), transparent 55%),
              radial-gradient(900px 600px at 120% 40%, rgba(22,163,74,.12), transparent 55%),
              linear-gradient(180deg, rgba(2,6,23,.96), rgba(2,6,23,.90));
}

/* Allow content to breathe on wide screens */
.app-main{padding: 18px 18px 32px;}

@media (max-width: 992px){
  .hs-container{padding-inline: 14px;}
  .app-main{padding: 12px 12px 24px;}
  .page-header{align-items:flex-start; flex-direction:column;}
}

/* Utilities */
.hs-muted{color: var(--hs-muted) !important;}
.hs-soft{background: var(--hs-surface-2); border: 1px solid var(--hs-border);}
.no-wrap{white-space:nowrap;}

/* Print footer placeholder (enabled in print.css) */
.print-footer{display:none;}