/* === EDIT PAGE – navazuje na tokens.css (dark/soft) === */

/* =========================
   Wrapper a hlavní karta
   ========================= */
.edit-wrap{
  max-width:1040px;
  margin:26px auto;
  padding:0 16px;
}
.edit-card{
  background: var(--surface);
  border:1px solid var(--border);
  border-radius: var(--radius);
  padding:16px;
  box-shadow: var(--shadow);
}

/* =========================
   Hlavička + alerty
   ========================= */
.edit-title{
  margin:0 0 12px;
  font-size:1.35rem;
  font-weight:800;
  color:var(--text);
}
.alert{
  border:1px solid rgba(239,68,68,.35);
  background: rgba(239,68,68,.10);
  color:#fecaca;
  border-radius:10px;
  padding:10px 12px;
  margin-bottom:12px;
}

/* =========================
   Grid rozložení sekcí
   ========================= */
.row{ display:flex; gap:16px; flex-wrap:wrap; }
.col-half{ flex:1 1 480px; min-width:320px; }

/* =========================
   Sekce (boxy uvnitř)
   ========================= */
.section-block{
  background: rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  padding:12px;
  box-shadow: var(--shadow);
  overflow: visible; /* dříve hidden – mohlo uříznout poslední sloupec */
}
.section-block h3{
  margin:0 0 8px;
  font-weight:800;
  font-size:1.05rem;
  color:var(--text);
}

/* =========================
   Inputs / Selects / Textarea
   (sjednoceno s tokens.css)
   ========================= */
.input, .form-input, select.input, textarea.input{
  width:100%;
  height:36px;
  padding:6px 12px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  color:#e1e9f1;
  transition: background .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.input:hover{ background: rgba(255,255,255,.08); }
.input:focus{ outline:0; border-color: rgba(255,255,255,.28); box-shadow:0 0 0 2px var(--focus); }
textarea.input{ min-height:100px; resize:vertical; }

/* Select – tmavé menu + šipka */
select.input{
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24'%3E%3Cpath fill='%23cfe0ea' d='M7 10l5 5 5-5z'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 10px center;
  padding-right:34px;
}
select.input option,
select.input optgroup{ background:#0f1720; color:var(--text); }

/* =========================
   Radio „cards“ – typ zařízení
   ========================= */
.choices{ display:flex; flex-wrap:wrap; gap:10px; }
.choice{
  display:flex; align-items:center; gap:8px;
  border:1px solid rgba(255,255,255,.14);
  padding:8px 10px;
  border-radius:12px;
  background: rgba(255,255,255,.04);
  cursor:pointer;
  transition: background .15s ease, border-color .15s ease;
}
.choice:hover{ background: rgba(255,255,255,.08); }
.choice input{ margin:0; }

/* =========================
   „Stav zakázky“ – soft varianta
   ========================= */
.status-select{
  border:1px solid var(--primary-soft-br);
  background: var(--primary-soft-bg);
  color: var(--primary-soft-tx);
  font-weight:700;
}
.status-hint{
  display:block;
  margin:.35rem 0 .5rem;
  padding:.45rem .6rem;
  border-left:3px solid var(--warning-500);
  background: color-mix(in srgb, var(--warning-500) 12%, transparent);
  color:#fef3c7;
  border-radius:8px;
  font-size:.9rem;
}

/* =========================
   Buttons (přebírá z tokens.css)
   ========================= */
.btn{
  display:inline-flex; align-items:center; gap:8px;
  height:36px; padding:6px 12px;
  border-radius: var(--radius);
  font-weight:700; letter-spacing:.2px;
  cursor:pointer;
  transition: transform .15s ease, filter .15s ease, background .15s ease, border-color .15s ease, color .15s ease;
}
.btn-primary{
  background: var(--primary-soft-bg);
  color: var(--primary-soft-tx);
  border:1px solid var(--primary-soft-br);
}
.btn-primary:hover{ background: rgba(76,201,240,.22); transform: translateY(-1px); }
.btn-secondary{ background: transparent; color: var(--text); border:1px solid rgba(255,255,255,.16); }
.btn-secondary:hover{ background: rgba(255,255,255,.08); }
.btn-danger{ background: rgba(239,68,68,.10); color:#fecaca; border:1px solid rgba(239,68,68,.35); }
.btn-danger:hover{ background: rgba(239,68,68,.16); }
.btn-sm{ font-size:13px; padding:6px 10px; height:32px; border-radius:10px; }

/* =========================
   Tabulka „Použité díly“
   ========================= */
.parts{
  width:100%;
  border-collapse:separate;
  border-spacing:0 6px;
}
.parts thead th{
  text-align:left; font-weight:700; color:var(--text);
  padding:10px; border-bottom:none; opacity:.85;
}
.parts tbody td{
  padding:10px; background: rgba(255,255,255,.06);
  color:var(--text);
}
.parts tbody tr:hover td{ background: rgba(255,255,255,.10); }
.parts tbody tr td:first-child{ border-top-left-radius:10px; border-bottom-left-radius:10px; }
.parts tbody tr td:last-child { border-top-right-radius:10px; border-bottom-right-radius:10px; }

/* =========================
   Utilities
   ========================= */
.text-right{ text-align:right; }
.mt-6{ margin-top:1.25rem; }
.mt-8{ margin-top:2rem; }
.mb-2{ margin-bottom:.5rem; }
.mb-4{ margin-bottom:1rem; }

/* =========================
   🔍 Vyhledávací formulář na indexu
   (sjednocená verze – jen jednou)
   ========================= */
.form-search{
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  margin:12px 0 16px;
}
.form-search .field{
  position:relative; flex:1 1 360px; min-width:260px;
}
.form-search .input--search{
  height:36px; padding-left:36px;
}
.form-search .field__icon{
  position:absolute; left:10px; top:50%; transform:translateY(-50%);
  width:18px; height:18px; opacity:.7; pointer-events:none; flex-shrink:0;
}
.form-search select{
  height:36px; min-width:180px; max-width:260px;
}
.form-search .btn{
  height:36px; padding:6px 14px; border-radius:10px;
}
@media (max-width:640px){
  .form-search .field{ flex:1 1 100%; min-width:0; }
  .form-search .btn{ width:100%; justify-content:center; }
}

/* =========================
   Tabulka – kompaktní, čitelná
   ========================= */
.table-wrap{ overflow-x:auto; } /* jistota pro úzké displeje */

.table-parts{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  font-size:.95rem;
}
.table-parts thead th{
  text-align:left; font-weight:700; color:var(--text);
  padding:12px; background: rgba(255,255,255,.06);
  border-bottom:1px solid rgba(255,255,255,.12);
}
.table-parts thead th.num{ text-align:right; }
.table-parts thead th.actions{ width:1%; white-space:nowrap; }

.table-parts tbody td{
  padding:12px; border-bottom:1px solid rgba(255,255,255,.08);
  color:var(--text);
}
.table-parts tbody td.num{ text-align:right; }
.table-parts tbody tr:hover td{ background: rgba(255,255,255,.04); }

.table-parts tbody tr.is-out td{
  color: color-mix(in srgb, var(--text) 65%, transparent);
}

.table-parts .empty{
  text-align:center; padding:18px; color:var(--muted);
}

/* =========================
   Akce – množství + tlačítko
   ========================= */
.add-form{
  display:flex; align-items:center; gap:10px; white-space:nowrap;
}
.qty-input{
  width:80px; height:34px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  color:#e1e9f1; border-radius:10px; padding:6px 10px;
}
.qty-input:focus{
  outline:0; border-color: rgba(255,255,255,.28);
  box-shadow:0 0 0 2px var(--focus);
}

/* =========================
   Badge
   ========================= */
.badge{
  display:inline-block; padding:2px 8px; border-radius:999px; font-size:.8rem;
  border:1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.08); color:#e1e9f1;
}
.badge-out{
  border-color: rgba(239,68,68,.35);
  background: rgba(239,68,68,.10);
  color:#fecaca;
}

/* =========================
   Disabled state
   ========================= */
button[disabled],
.qty-input[disabled]{
  opacity:.55; cursor:not-allowed;
}

/* =========================
   Toolbar objednávek + filtry
   ========================= */
.orders-toolbar{
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; margin:4px 0 10px;
}
.orders-toolbar .edit-title{ margin:0; }
.orders-toolbar .toolbar-actions{ display:flex; gap:10px; flex-wrap:wrap; }

.orders-filters{
  display:grid !important;
  grid-template-columns: minmax(260px,1fr) minmax(200px,240px) auto;
  gap:12px; align-items:end;
  margin:0 0 12px !important;
}
.orders-filters .field{ position:relative; min-width:0; }
.orders-filters .input,
.orders-filters select.input,
.orders-filters .btn{
  height:36px; min-height:36px; padding:6px 12px; box-sizing:border-box;
}
.orders-filters .input--search{ padding-left:36px; }
.orders-filters .field__icon{
  position:absolute; left:10px; top:50%; transform:translateY(-50%);
  width:18px; height:18px; opacity:.7; pointer-events:none;
}
@media (max-width: 680px){
  .orders-filters{ grid-template-columns: 1fr; }
}

/* =========================
   Zakázky – kompaktní grid pro filtr
   ========================= */
.zakazky-filters .form-search{
  display:grid !important;
  grid-template-columns: minmax(200px, 240px) minmax(260px, 1fr) auto auto;
  gap:12px; align-items:end;
  margin:12px 0 8px;
}
.zakazky-filters .form-group{ margin:0; }
.zakazky-filters .field{ min-width:0; } /* ať input nezvětšuje řádek */
.zakazky-filters .input,
.zakazky-filters .select,
.zakazky-filters select,
.zakazky-filters .btn{
  height:36px; min-height:36px; /* stejná výška všeho */
}
@media (max-width: 680px){
  .zakazky-filters .form-search{ grid-template-columns: 1fr; }
}

/* sjednocení vzhledu modulu + jistota vrstvy tlačítek */
.card{ background: rgba(255,255,255,.06); border:1px solid var(--border); border-radius:var(--radius); padding:12px; box-shadow:var(--shadow); backdrop-filter: blur(6px); overflow:visible; }
.table-wrap{ overflow-x:auto; }
.actions-row{ display:inline-flex; gap:.4rem; align-items:center; white-space:nowrap; }
.actions-row .btn{ position:relative; z-index:1; }