/* === Light theme (FIXED) — clean layout + subtle 3D ===================
   This file *replaces* assets/style.css. It restores clean white layout
   and adds safe, scoped 3D only to .card, .section and .item-row.
   No global gradients that could cause banding/stripes.
=========================================================================== */

:root{
  --bg:#f7f9fc;
  --surface:#ffffff;
  --text:#111827;
  --muted:#6b7280;
  --border:#e5e7eb;
  --primary:#2563eb;
  --primary-2:#1d4ed8;
  --danger:#ef4444;
  --danger-2:#b91c1c;
  --success:#16a34a;
  --warning:#f59e0b;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);
  font:14px/1.45 system-ui, Segoe UI, Roboto, -apple-system, sans-serif}

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

a{color:var(--primary);text-decoration:none}
a:hover{text-decoration:underline}

/* Cards — clean white surface with soft shadow */
.card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:16px;
  box-shadow:0 6px 18px rgba(0,0,0,.08);
  padding:16px;
  margin:16px 0;
}
.rim{padding:16px 18px}

/* Section — subtle 3D using double shadow; *no* gradients */
.section{
  background:#fff;
  border:1px solid var(--border);
  border-radius:14px;
  padding:12px;
  box-shadow: 0 10px 20px rgba(0,0,0,.06), inset 0 1px 0 rgba(255,255,255,.9);
}
.section legend{padding:0 8px;font-weight:800;color:#0f172a}

/* Item rows — slight lift and hover */
.item-row{
  background:#fff;
  border:1px solid var(--border);
  border-radius:12px;
  padding:8px;
  display:grid;gap:10px;
  grid-template-columns:1.3fr .6fr .6fr auto 60px;
  align-items:end;
  box-shadow:0 4px 10px rgba(0,0,0,.05);
  transition:transform .12s ease, box-shadow .12s ease;
}
.item-row:hover{ transform:translateY(-1px);
  box-shadow:0 10px 16px rgba(0,0,0,.08);
}

/* Inputs/selects fixed for light theme */
label{display:block;font-size:12px;color:var(--muted);margin-bottom:6px}
.input{
  width:100%;padding:10px 12px;border-radius:10px;
  border:1px solid var(--border);background:#fff;color:var(--text);
  outline:0;
}
.input:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(37,99,235,.15)}
select.input option{color:#111;background:#fff}

/* Grid & flex helpers */
.grid{display:grid;gap:12px}
.grid-2{grid-template-columns:1fr 1fr}
.grid-3{grid-template-columns:1fr 1fr 1fr}
.flex{display:flex;gap:10px;align-items:center}

/* Buttons */
.btn{display:inline-block;border:none;background:var(--primary);
  color:#fff !important;padding:10px 14px;border-radius:10px;cursor:pointer;
  box-shadow:0 6px 14px rgba(37,99,235,.18), 0 2px 4px rgba(0,0,0,.06);
  text-decoration:none !important;}
.btn:hover{background:var(--primary-2);color:#fff !important;}
.btn.secondary{background:#e2e8f0;color:#111 !important;box-shadow:none}
.btn.secondary:hover{background:#cbd5e1;color:#111 !important;}
.btn.danger{background:var(--danger);color:#fff !important;}
.btn.danger:hover{background:var(--danger-2);color:#fff !important;}
.btn.icon{font-size:16px;padding:8px 10px}

/* Badges */
.badge{display:inline-block;font-weight:700;border-radius:999px;
  padding:4px 10px;margin-right:6px;border:1px solid var(--border);
  background:#f3f4f6;color:#111;font-size:12px;}
.badge.green{background:#dcfce7;color:#065f46;border-color:#bbf7d0}
.badge.amber{background:#fef3c7;color:#92400e;border-color:#fde68a}
.badge.gray{background:#e5e7eb;color:#374151;border-color:#d1d5db}

/* Tables */
.table{width:100%;border-collapse:collapse}
.table th,.table td{border-bottom:1px solid var(--border);padding:10px 8px;text-align:left}
.table th{color:#111;font-weight:700;background:#f8fafc}

/* Header & footer */
.header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.header a{color:#111}
.small{font-size:12px;color:var(--muted)}
.footer{margin:22px auto 30px auto;text-align:center;color:var(--muted)}

/* Login */
.login-wrap{display:flex;min-height:100vh;align-items:center;justify-content:center;padding:32px;background:var(--bg)}
.login-card{width:100%;max-width:420px}
.brand{font-size:22px;font-weight:800;text-align:center;margin-bottom:10px;color:#0f172a}
.logo{width:120px;height:120px;border-radius:20px;background:#f3f4f6;border:1px solid var(--border);margin:10px auto 18px auto;}

/* Utilities */
.hidden{display:none}
/* === Patch v11.3 — section spacing & actions alignment === */

/* Veći razmak između redova stavki u sekciji */
.section .item-row{
  padding:12px;
  margin:10px 0;            /* vertikalni razmak */
}

/* Bedževi da ne lepe uz select/polja */
.section .item-row .badge{ margin-left:8px; }

/* Desno poravnanje dugmadi + razmak od sadržaja sekcije */
.section-actions{
  display:flex;
  gap:10px;
  justify-content:flex-end; /* ako želiš centrirano, promeni u center */
  margin-top:12px;
  padding-top:10px;
  border-top:1px dashed var(--border);
}

/* Malo odmakni dugme za brisanje u redu */
.section .item-row .btn.icon{ margin-left:8px; }

/* Na manjim širinama poravnanje pada na levo da se ne prelamaju ružno */
@media (max-width: 720px){
  .section-actions{ justify-content:flex-start; }
}
.login-logo {
  text-align: center;
  margin-bottom: 16px;
}
.login-logo img {
  width: 160px;   /* po potrebi promeni */
  height: auto;
  display: inline-block;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.15));
}/* ===== FAZE (badge boje) – append na kraj style.css ===== */
.badge.stage-UGOVARANJE { background:#f3f4f6 !important; border-color:#d1d5db !important; color:#374151 !important; } /* siva */
.badge.stage-PRIPREMA    { background:#dbeafe !important; border-color:#93c5fd !important; color:#1e40af !important; } /* plava */
.badge.stage-PROIZVODNJA { background:#fee2e2 !important; border-color:#fecaca !important; color:#7f1d1d !important; } /* crvena */
.badge.stage-MAGACIN     { background:#fef3c7 !important; border-color:#fde68a !important; color:#92400e !important; } /* žuta */
.badge.stage-ISPORUCENO  { background:#dcfce7 !important; border-color:#bbf7d0 !important; color:#065f46 !important; } /* zelena */
