/* Demartini – Blue/White clean theme */
/* CSS spisan tako, da NE ruši obstoječih stilov (le dopolnjuje). */

:root{
  --brand:#2563eb;           /* modra */
  --brand-600:#1d4ed8;
  --brand-700:#1e40af;
  --ink:#0f172a;             /* temno besedilo */
  --muted:#64748b;           /* sekundarni tekst */
  --line:#e5e7eb;            /* obrobe */
  --bg:#ffffff;              /* ozadje kart */
  --bg-soft:#f8fafc;         /* mehko ozadje */
  --radius:14px;
  --shadow:0 8px 20px rgba(2, 6, 23, .06);
}

*{box-sizing:border-box;}
html,body{height:100%}
body{
  color:var(--ink);
  background:#f4f7fb;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

/* --------- Layout --------- */
.container{
  max-width:1100px;
  margin:0 auto;
}

/* --------- Cards --------- */
.card{
  background:var(--bg);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  overflow:hidden;
}
.card-header{
  padding:14px 16px;
  border-bottom:1px solid var(--line);
  background:linear-gradient(180deg,#fff, #fafbff);
}
.card-body{ padding:16px; }

/* --------- Buttons --------- */
.btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  height:42px;
  padding:0 16px;
  border-radius:10px;
  border:1px solid var(--line);
  background:#fff;
  color:var(--ink);
  text-decoration:none;
  font-weight:600;
  box-shadow:0 2px 8px rgba(2,6,23,.04);
  transition:.15s ease;
}
.btn:hover{ transform:translateY(-1px); box-shadow:0 6px 14px rgba(2,6,23,.08); }
.btn:active{ transform:translateY(0); }

.btn-primary{
  background:var(--brand);
  border-color:var(--brand);
  color:#fff;
}
.btn-primary:hover{ background:var(--brand-600); border-color:var(--brand-600); }

.btn-success{
  background:#10b981;
  border-color:#10b981;
  color:#fff;
}
.btn-secondary{
  background:var(--bg-soft);
  color:var(--brand-700);
  border-color:var(--line);
}
.btn-outline{
  background:#fff;
  color:var(--brand-700);
  border-color:var(--brand-600);
}
.btn-sm{ height:32px; padding:0 10px; font-weight:600; }

/* --------- Inputs --------- */
.input{
  width:100%;
  height:42px;
  padding:8px 12px;
  border-radius:10px;
  border:1px solid var(--line);
  background:#fff;
  color:var(--ink);
  outline:none;
  transition:border-color .12s ease, box-shadow .12s ease;
}
.input:focus{
  border-color:var(--brand);
  box-shadow:0 0 0 4px rgba(37,99,235,.12);
}
.input[disabled]{ background:#f1f5f9; color:#94a3b8; }

/* --------- Tables --------- */
.table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
}
.table th, .table td{
  text-align:left;
  padding:12px 14px;
  border-bottom:1px solid var(--line);
  background:#fff;
}
.table thead th{
  font-size:.9rem;
  color:var(--muted);
  background:#f9fafb;
}
.table tr:hover td{ background:#fbfdff; }

/* --------- Alerts --------- */
.alert{
  padding:12px 14px;
  border-radius:12px;
  border:1px solid var(--line);
  background:#fff;
}
.alert-warning{
  background:#fff7ed;
  border-color:#fdba74;
  color:#9a3412;
}

/* --------- Typography --------- */
h1,h2,h3{ margin:0; }
.text-2xl{ font-size:1.5rem; }
.font-semibold{ font-weight:600; }
.text-sm{ font-size:.9rem; }
.opacity-70{ opacity:.7; }
.muted{ color:var(--muted); }

/* --------- Grid helpers --------- */
.grid{ display:grid; gap:16px; }
@media (min-width: 768px){
  .md\:grid-cols-2{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .md\:grid-cols-3{ grid-template-columns:repeat(3, minmax(0,1fr)); }
}

/* --------- Spacing helpers --------- */
.mx-auto{ margin-left:auto; margin-right:auto; }
.px-4{ padding-left:1rem; padding-right:1rem; }
.py-6{ padding-top:1.5rem; padding-bottom:1.5rem; }
.mb-1{ margin-bottom:.25rem; }
.mb-4{ margin-bottom:1rem; }
.mt-1{ margin-top:.25rem; }
.mt-3{ margin-top:.75rem; }
.mt-4{ margin-top:1rem; }
.gap-2{ gap:.5rem; }
.gap-3{ gap:.75rem; }
.flex{ display:flex; }
.items-center{ align-items:center; }
.justify-between{ justify-content:space-between; }

/* --------- Nav link (če ga rabiš) --------- */
.nav-link{
  color:var(--brand-700);
  text-decoration:none;
  padding:8px 10px;
  border-radius:10px;
}
.nav-link:hover{ background:var(--bg-soft); }
