:root{
  --bg:#f4f6fb;
  --card:#ffffff;
  --muted:#6b7280;
  --accent:#0b74de;
  --dark-accent:#08345a;
  --success:#16a34a;
  --danger:#ef4444;
}

/* Base */
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:Inter, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  background:var(--bg);
  color:#0f172a;
  line-height:1.45;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  padding:18px;
}

.container{max-width:1100px;margin:0 auto;padding:18px}

/* Card */
.card{
  background:var(--card);
  border-radius:10px;
  box-shadow:0 6px 18px rgba(15,23,42,0.06);
  padding:18px;
}

/* Headings */
h1,h2,h3{margin:0 0 10px 0;color:#0b1320}
h1{font-size:1.4rem}

/* Links and buttons */
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
/* Apply minimal dark-blue style to native buttons so existing pages without .btn classes benefit
   This affects button, input[type=submit], input[type=button] on pages that load this stylesheet
   (index.php does not load assets/css/global.css so it remains unchanged). */
button, input[type="submit"], input[type="button"]{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:8px;
  border:1px solid transparent;
  font-weight:600;
  cursor:pointer;
  background:var(--dark-accent);
  color:#fff;
  transition:transform .12s ease,box-shadow .12s ease,filter .12s ease;
  box-shadow:0 6px 18px rgba(8,52,90,0.08);
}
button:hover,input[type="submit"]:hover,input[type="button"]:hover{transform:translateY(-2px);filter:brightness(.98);box-shadow:0 10px 24px rgba(8,52,90,0.12)}
button:focus,input[type="submit"]:focus,input[type="button"]:focus{outline:none;box-shadow:0 0 0 4px rgba(8,52,90,0.10)}

.btn{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:8px;border:1px solid transparent;font-weight:600;cursor:pointer;transition:transform .12s ease,box-shadow .12s ease,filter .12s ease}
.btn-primary{background:var(--dark-accent);color:#fff;border-color:transparent;box-shadow:0 6px 18px rgba(8,52,90,0.08)}
.btn-primary:hover{transform:translateY(-2px);filter:brightness(.98);box-shadow:0 10px 24px rgba(8,52,90,0.12)}
.btn-primary:focus{outline:none;box-shadow:0 0 0 4px rgba(8,52,90,0.10)}
.btn-outline{background:transparent;color:var(--dark-accent);border-color:rgba(8,52,90,0.12)}
.btn-danger{background:var(--danger);color:#fff}

/* Forms */
label{display:block;margin-bottom:6px;color:var(--muted);font-size:0.95rem}
input[type="text"],input[type="password"],input[type="email"],textarea,select{
  width:100%;padding:10px;border-radius:8px;border:1px solid #e6e9ee;background:#fff;outline:none
}
input:focus,textarea:focus,select:focus{box-shadow:0 0 0 4px rgba(11,116,222,0.06);border-color:var(--accent)}

form .row{display:flex;gap:12px}
.form-inline{display:flex;gap:8px;align-items:center}

/* Tables */
.table{width:100%;border-collapse:collapse}
.table th, .table td{padding:10px;border-bottom:1px solid #eef2f7;text-align:left}
.table thead th{background:transparent;color:var(--muted);font-weight:700}
.table tr:hover td{background:#fbfdff}

/* Utilities */
.small{font-size:0.9rem;color:var(--muted)}
.center{text-align:center}
.right{text-align:right}
.m-0{margin:0}
.mt-1{margin-top:8px}
.mt-2{margin-top:16px}
.mb-1{margin-bottom:8px}
.inline{display:inline-block}
.flex{display:flex}
.flex-center{display:flex;align-items:center;justify-content:center}
.gap-12{gap:12px}

/* Responsive */
@media (max-width:720px){
  .container{padding:12px}
  h1{font-size:1.25rem}
}

/* Admin specific small helpers (safe selectors) */
.header-bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.header-bar .brand{font-weight:800;color:var(--accent)}
.footer{margin-top:18px;color:var(--muted);font-size:0.85rem}