/* RMX (ime = ErpVerzija.Naziv) — crno-sivo, mirno, poslovno; izgled 1:1 iz RMX_Web */

:root {
  --rmx-black: #14181d;
  --rmx-charcoal: #1e242c;
  --rmx-slate: #2a313a;
  --rmx-slate-soft: #3a434e;
  --rmx-gray: #6b7580;
  --rmx-gray-light: #a8b0b8;
  --rmx-green: #3d8b4a;
  --rmx-green-hover: #327540;
  --rmx-red: #c0392b;
  --rmx-red-hover: #a93226;
  --rmx-bg: #d4d8dd;
  --rmx-panel: #f2f3f5;
  /* Tanke ivice svuda — sive. Crno samo naslovne trake (topbar / title). */
  --rmx-edge: #9aa3ad;
  --rmx-line: #9aa3ad;
  --rmx-text: #1a1f26;
  --rmx-muted: #5a6570;
  --rmx-row-alt: #eceef1;
  --rmx-row-sel: #dde2e8;
  /* JEDNA PALETA STANJA (korisnik 2026-10-24: „dosta šarenila … odstupam od svog dizajna“ → PNG pre / posle → „da, primeni“):
     isto značenje = ista boja na svim ekranima — zeleno u redu, žuto pažnja, crveno kasni / ne sme, sivo bez podataka;
     -bg pozadina pilule, -tx tekst, -ln traka / ivica. Izabrano (čip, dan, prekidač) = grafit --rmx-izabrano, nikad plava.
     Koriste: Board planer .planer-*, Servisi .srv-*, Lizing .lk-*, Refakcija .predati-*, sengen.css. Nov ekran = ovi tokeni. */
  --rmx-st-ok-bg: #e3efe5;   --rmx-st-ok-tx: #2e6b38;   --rmx-st-ok-ln: #3d8b4a;
  --rmx-st-upoz-bg: #fbefd6; --rmx-st-upoz-tx: #7a5200; --rmx-st-upoz-ln: #c98a12;
  --rmx-st-los-bg: #f8dedb;  --rmx-st-los-tx: #a93226;  --rmx-st-los-ln: #c0392b;
  --rmx-st-siv-bg: #e3e6ea;  --rmx-st-siv-tx: #3a434e;  --rmx-st-siv-ln: #8a929c;
  --rmx-izabrano: #3a434e;
  /* Prikaz po korisniku (korisnik 2026-10-24) — podrazumevano = kako je bilo; stvarnu vrednost postavlja UiIzgled.HtmlStyle
     na <html style> (Pages/Shared/_Layout.cshtml). Link: jedna boja svih linkova, podrazumevano tamnija plava (varijanta B). */
  --rmx-naslov-font-size: 18px; --rmx-opis-font-size: 12px; --rmx-traka-font-size: 12px; --rmx-status-font-size: 11px;
  --rmx-link: #24578a; --rmx-link-podvlaka: none;
  /* Izabran red na svim listama (--rmx-row-izabran, korisnik 2026-10-01 C3; ranije zuto #fff3cc) = blok „BOJA IZBORA“
     (od 2026-10-14 bira korisnik). */
  --rmx-accent: #3a434e;
  --rmx-font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  --rmx-font-size: 13px;
  /* Velicina teksta iz /Podesavanja/Prikaz (UiIzgled.HtmlStyle). Sitniji / krupniji tekst modula NE kucati u px nego
     relativno: calc(var(--rmx-font-size) - 1px) itd., 13 = podrazumevano (korisnik 2026-10-24: „font i prikaz … da li
     se uklapa“ — Lizing .lk-*, Servisi .srv-*, Sengen .sengen-* / .sp-*, Board planer .planer-* prebaceni). Px ostaje samo
     za oblik sa fiksnom visinom i telefon (polje 16 px). */
  /* Labeli na karticama — /Podesavanja/Prikaz „Velicina labela“. */
  --rmx-label-font-size: 10px;
  /* Bocni / gornji meni — posebno podesavanje „Velicina menija“. */
  --rmx-menu-font-size: 13px;
  /* Liste, kartice, toolbar — blaga krivina, ne 12px kao prijava. */
  --rmx-radius-panel: 8px;
  /* Zaglavlje pomoćne tabele u belom panelu pregleda (blok „Traka zaglavlja tabele u belom panelu“ niže). */
  --rmx-podtabela-vrh: #ebebeb;
  --rmx-podtabela-ivica: #cccccc;
  --rmx-podtabela-tekst: var(--rmx-text);
}

/* IVICA POLJA — po korisniku, Podesavanja → Prikaz (korisnik 2026-10-13, „C“ podrazumevano). Klasa body
   polje-ivica-{kljuc} iz _Layout; spisak + boje = UiIzgled.Ivice (menjati zajedno). Samo polja za unos —
   paneli / tabele ostaju --rmx-edge. */
:root, .polje-ivica-svetla { --rmx-polje-ivica: #bcc2c9; }
.polje-ivica-srednja { --rmx-polje-ivica: #adb4bc; }
.polje-ivica-tamna { --rmx-polje-ivica: #9aa3ad; }
/* Proknjiži — više vrsta troška (korisnik 2026-10-27, PNG _tmp/predlog_proknjizi_vrste): red = vrsta + iznos osnovice + ×; nov
   red sa ostatkom svetlo zelen dok se ne izabere vrsta; zbir zeleno / crveno. JS u Pages/UlazneFakture/Sef.cshtml (prkRedovi). */
.prk-ras-zaglavlje, .prk-ras-red { display: grid; grid-template-columns: minmax(0, 1fr) 150px 24px; gap: 8px; align-items: center; }
.prk-ras-zaglavlje { font-size: var(--rmx-label-size, 10px); color: #4b5563; margin: 2px 0; }
/* Red vrste: izbor vrste (rmx-vrsta-troska.js) ima oznake ispod polja — iznos i × poravnati uz polje, ne na sredinu (2026-10-28). */
.prk-ras-red { margin-bottom: 6px; align-items: start; }
.prk-ras-novi select, .prk-ras-novi input { background: #eef7e4; }
/* Polje izbora vrste (rmx-vrsta-troska.js, 2026-10-28 IZ-F1) u novom redu: isto svetlo zeleno kao ranije padajuća lista — opšte pravilo
   za .form-input u prozoru ga je prepisivalo belim (provera u browseru 2026-10-28). */
.prk-ras-x { border: 0; background: transparent; color: #9aa3ad; font-size: 18px; line-height: 1; cursor: pointer; padding: 0; }
.prk-ras-x:hover { color: #b91c1c; }
.prk-zbir { margin: 2px 0 0; font-weight: 600; }
.prk-zbir-ok { color: #15803d; }
.prk-zbir-lose { color: #b45309; }

/* LINIJE U LISTAMA — po korisniku, Podesavanja → Prikaz (korisnik 2026-10-27, posle PNG predloga Registratora). Klasa body
   lista-linije-{kljuc} iz _Layout; spisak + boje = UiIzgled.Linije (menjati zajedno). Samo linija ispod reda liste (.grid td) —
   naizmenični redovi (--rmx-row-alt), zaglavlje i izbor reda ostaju. Bez zapisa = kao do sada (--rmx-edge). */
:root, .lista-linije-linije { --rmx-lista-linija: var(--rmx-edge); }
.lista-linije-sive { --rmx-lista-linija: #dde1e6; }
.lista-linije-bez { --rmx-lista-linija: transparent; }
.lista-linije-uzorak { margin-top: 4px; border-collapse: collapse; background: #fff; min-width: 210px; font-size: 12px; }
.lista-linije-uzorak td { padding: 3px 8px; border-bottom: 1px solid var(--uzorak-linija); }
.lista-linije-uzorak tr:nth-child(even) td { background: var(--rmx-row-alt); }

.polje-ivica-uzorak { display: inline-block; margin-top: 4px; padding: 3px 8px; min-width: 130px; border: 1px solid; border-radius: 3px; background: #fff; }

* { box-sizing: border-box; }

/* Globalno: sva polja i liste — ista familija fonta kao body (ne "system" date/select) */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="date"],
input[type="time"],
input[type="datetime-local"],
select,
textarea,
.form-input {
  border: 1px solid var(--rmx-polje-ivica);
  border-radius: 3px;
  background: #fff;
  color: var(--rmx-text);
  font: inherit;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}

/* Aktivno polje: samo unutrasnja pozadina (izmedju zute i narandzaste); ivica bez senke. */
input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="date"]:focus,
input[type="time"]:focus,
input[type="datetime-local"]:focus,
select:focus,
textarea:focus,
.form-input:focus {
  outline: none;
  background: #eef8d8;
  border-color: var(--rmx-polje-ivica);
  box-shadow: none;
}

/* Datum: native kalendar-dugme je Chrome tab-stop (posle godine). Sakrij ga iz Taba;
   ikona ostaje kao pozadina, otvara se klikom (JS showPicker u _Layout). */
input[type="date"]::-webkit-calendar-picker-indicator {
  display: none !important;
  -webkit-appearance: none;
  appearance: none;
  opacity: 0;
  width: 0;
  height: 0;
  margin: 0;
  padding: 0;
  pointer-events: none;
}
input[type="date"] {
  background-color: #fff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect x='2' y='3.2' width='12' height='10.8' rx='1.2' fill='none' stroke='%231a1f26' stroke-width='1.25'/%3E%3Cpath d='M2 6.5h12M5.3 2.3v2.5M10.7 2.3v2.5' fill='none' stroke='%231a1f26' stroke-width='1.25' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 7px center;
  background-size: 14px 14px;
  padding-right: 1.85rem;
}
input[type="date"]:focus,
.rmx-date-wrap .rmx-date-prikaz:focus {
  background-color: #eef8d8;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect x='2' y='3.2' width='12' height='10.8' rx='1.2' fill='none' stroke='%231a1f26' stroke-width='1.25'/%3E%3Cpath d='M2 6.5h12M5.3 2.3v2.5M10.7 2.3v2.5' fill='none' stroke='%231a1f26' stroke-width='1.25' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 7px center;
  background-size: 14px 14px;
}

/* Prikaz datuma na unosu: overlay prati ui.datum; native type=date ostaje za vrednost/kalendar. */
.rmx-date-wrap {
  position: relative;
  display: inline-block;
  vertical-align: top;
  max-width: 100%;
}
.rmx-date-wrap .rmx-date-prikaz {
  width: 100%;
  box-sizing: border-box;
  padding-right: 1.85rem;
  background-color: #fff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect x='2' y='3.2' width='12' height='10.8' rx='1.2' fill='none' stroke='%231a1f26' stroke-width='1.25'/%3E%3Cpath d='M2 6.5h12M5.3 2.3v2.5M10.7 2.3v2.5' fill='none' stroke='%231a1f26' stroke-width='1.25' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 7px center;
  background-size: 14px 14px;
}
.rmx-date-wrap.form-input-locked .rmx-date-prikaz,
.rmx-date-wrap .rmx-date-prikaz[readonly],
.rmx-date-wrap .rmx-date-prikaz:disabled {
  background-color: #e8eaed;
}
.rmx-date-wrap .rmx-date-native {
  position: absolute;
  left: 0;
  top: 0;
  width: 1px;
  height: 1px;
  opacity: 0;
  margin: 0;
  padding: 0;
  border: 0;
  pointer-events: none;
}
.rmx-date-wrap .rmx-date-native.rmx-date-picking {
  width: 100%;
  height: 100%;
}

html, body {
  margin: 0;
  padding: 0;
  font-family: var(--rmx-font-family);
  font-size: var(--rmx-font-size);
  /* Debljina obicnog teksta: 400, a 500 za Prikaz „Segoe UI — tamnije“ (UiIzgled.HtmlStyle, korisnik 2026-10-05). */
  font-weight: var(--rmx-font-weight, 400);
  color: var(--rmx-text);
}
/* Sivi predlozi u praznim poljima (dd.mm.yyyy u overlay-u datuma, hh:mm, „npr. …“) — svetliji i obicne debljine, ceo
   program (korisnik 2026-10-05: „sve ove svetle predloge u poljima dd.mm… ili hh:mm da posvetliš“, uz „Segoe UI —
   tamnije“ su izgledali kao upisan tekst). Pravi tekst u polju ostaje tamni. */
::placeholder {
  color: #b9bfc6;
  font-weight: 400;
  opacity: 1;
}

code {
  font-family: Consolas, "Courier New", monospace;
  font-size: 12px;
  background: #e4e7eb;
  padding: 1px 5px;
  border-radius: 3px;
  color: var(--rmx-charcoal);
}

/* ========== PRIJAVA ========== */
/* Izgled po izboru korisnika 2026-10-07 („ovo treba lepše, pokaži mi primere“ → primeri A / B / C, „A i C“ → „A i C po
   uređaju“; „izbaci ovo zeleno crveno dugmad, neka budu siva“). A = svetla kartica sa tamnom trakom i logom (svetli režim
   uredjaja), C = tamna pozadina sa narandzastim sjajem i tamna kartica (@media prefers-color-scheme: dark). Labeli iznad
   polja, godina kao dva dugmeta (radio), jedno sivo dugme Prijava, bez Izlaz. Markup: Pages/Prijava.cshtml (menjati zajedno). */

.login-body {
  min-height: 100vh;
  min-height: 100dvh;
  background:
    radial-gradient(ellipse at 30% 20%, #e4e6e9 0%, transparent 50%),
    radial-gradient(ellipse at 70% 80%, #c8ccd1 0%, transparent 45%),
    linear-gradient(160deg, #d5d8dc 0%, #b8bdc4 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px 14px;
}

.login-screen {
  width: 100%;
  max-width: 380px;
}

.login-card {
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.18);
  overflow: hidden;
}

/* Glava: logo + RMX Web + podnaslov (A: tamna traka). */
.login-head {
  background: linear-gradient(180deg, #2a313a 0%, #1e242c 55%, #14181d 100%);
  color: #fff;
  text-align: center;
  padding: 22px 16px 18px;
}
.login-logo {
  width: 64px;
  height: 64px;
  border-radius: 12px;
  display: block;
  margin: 0 auto 8px;
}
.login-naziv { font-size: 20px; font-weight: 700; letter-spacing: 0.6px; }
.login-podnaslov { color: #a8b0b8; font-size: 12px; margin-top: 2px; }

.login-card-body { padding: 22px 26px 16px; }

/* Red = labela iznad polja. */
.login-row { margin-bottom: 14px; }
.login-row[hidden] { display: none; }   /* red „Firma“ kad uredjaj ne zna jednu firmu — bez praznine (2026-10-07) */
.login-row > label,
.login-row > .login-lab {
  display: block;
  margin: 0 0 4px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.3px;
  text-transform: uppercase;
  color: #5a6570;
}

/* .login-body ispred = jace od opsteg input[type=…] / :focus (zelena pozadina) na vrhu fajla. */
.login-body .login-input {
  width: 100%;
  height: 40px;
  padding: 0 12px;
  border: 1px solid #c9ced5;
  border-radius: 8px;
  background: #fff;
  color: #1a1f26;
  font: inherit;
  font-size: 15px;
}
.login-body .login-input:focus {
  outline: none;
  background: #fff;
  border-color: #ff9a2e;
  box-shadow: 0 0 0 3px rgba(255, 154, 46, 0.18);
}
/* Polje koje popuni Chrome (sacuvan email / lozinka) — bez njegove zute / plave pozadine. */
.login-body .login-input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 40px #fff inset;
  -webkit-text-fill-color: #1a1f26;
}
.login-body select.login-input { padding-right: 8px; }

/* Vrednost samo za citanje (email u drugom koraku). */
.login-ro {
  display: block;
  font-size: 15px;
  font-weight: 600;
  padding: 2px 0;
  word-break: break-all;
}

/* Zapamcena firma uredjaja (jedna firma) — oznaka desno u redu labele Email (korisnik 2026-10-10, varijanta A;
   do tada svoj red ispod emaila). Labela ostaje direktno dete .login-row (njen stil gore); oznaka apsolutno desno.
   Duzi naziv firme se skraćuje (…), da ne pređe preko „EMAIL“ na telefonu. Pages/Prijava.cshtml — menjati zajedno. */
.login-row-firma { position: relative; }
.login-firma {
  position: absolute;
  top: -5px;
  right: 0;
  max-width: calc(100% - 64px);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 10px;
  border-radius: 14px;
  background: #eef0f3;
  color: #2a313a;
  font-size: 12px;
  font-weight: 600;
}
.login-firma[hidden] { display: none; }
.login-firma > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.login-firma svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }

/* Poslovna godina = dva dugmeta (radio name=Godina, PrijavaModel.Godine). */
.login-seg {
  display: flex;
  border: 1px solid #c9ced5;
  border-radius: 8px;
  overflow: hidden;
}
.login-seg label {
  flex: 1 1 0;
  margin: 0;
  position: relative;
  cursor: pointer;
}
.login-seg input { position: absolute; opacity: 0; pointer-events: none; }
.login-seg span {
  display: block;
  padding: 9px 0;
  text-align: center;
  font-weight: 600;
  color: #5a6570;
}
.login-seg label + label span { border-left: 1px solid #c9ced5; }
.login-seg input:checked + span { background: #1e242c; color: #fff; }
.login-seg input:focus-visible + span { box-shadow: inset 0 0 0 2px #ff9a2e; }

/* Jedno dugme — sivo (korisnik 2026-10-07), prelaz misem = narandzasta ivica kao ostali sivi tasteri. */
.btn-prijava {
  width: 100%;
  height: 44px;
  margin-top: 4px;
  border: 1px solid #3a434e;
  border-radius: 8px;
  background: #3a434e;
  color: #fff;
  font: inherit;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
}
.btn-prijava:hover,
.btn-prijava:focus-visible { background: #4a5360; border-color: #ff9a2e; outline: none; }

.login-dno {
  display: flex;
  justify-content: flex-end;
  margin-top: 12px;
  color: #8a929c;
  font-size: 11px;
}

.login-error {
  background: #fdecea;
  border: 1px solid #e0a8a1;
  color: #8a241c;
  padding: 8px 10px;
  border-radius: 8px;
  margin-bottom: 14px;
}

/* C — tamni rezim uredjaja (telefon / PC u tamnoj temi): tamna pozadina sa narandzastim sjajem, logo iznad kartice,
   tamna kartica. Isti markup kao A. */
@media (prefers-color-scheme: dark) {
  .login-body {
    background:
      radial-gradient(circle at 50% 0%, rgba(255, 154, 46, 0.22) 0%, transparent 40%),
      linear-gradient(180deg, #1e242c 0%, #0e1115 100%);
    color: #e8eaed;
  }
  .login-card { background: transparent; box-shadow: none; overflow: visible; }
  .login-head { background: transparent; padding: 0 0 22px; }
  .login-logo { width: 76px; height: 76px; border-radius: 14px; box-shadow: 0 0 30px rgba(255, 154, 46, 0.35); }
  .login-naziv { font-size: 22px; margin-top: 12px; }
  .login-podnaslov { color: #8a929c; }
  .login-card-body { background: #2a313a; border: 1px solid #3a434e; border-radius: 14px; padding: 22px; }
  .login-row > label,
  .login-row > .login-lab { color: #a8b0b8; }
  .login-body .login-input,
  .login-body .login-input:focus { background: #1e242c; border-color: #4a5360; color: #fff; }
  .login-body .login-input:focus { border-color: #ff9a2e; }
  .login-body .login-input:-webkit-autofill { -webkit-box-shadow: 0 0 0 40px #1e242c inset; -webkit-text-fill-color: #fff; }
  .login-ro { color: #fff; }
  .login-firma { background: rgba(255, 154, 46, 0.15); color: #ffb766; }
  .login-seg { border-color: #4a5360; }
  .login-seg span { background: #1e242c; color: #8a929c; }
  .login-seg label + label span { border-left-color: #4a5360; }
  .login-seg input:checked + span { background: #1e242c; color: #fff; box-shadow: inset 0 0 0 1px #ff9a2e; }
  .btn-prijava { background: #4a5360; border-color: #6b7580; }
  .btn-prijava:hover,
  .btn-prijava:focus-visible { background: #5a6470; border-color: #ff9a2e; }
  .login-dno { color: #6b7580; }
  .login-error { background: rgba(192, 57, 43, 0.18); border-color: #8e2a20; color: #ffb3a8; }
}

/* ========== APP SHELL ========== */

.app-body {
  min-height: 100vh;
  background: var(--rmx-bg);
  display: flex;
  flex-direction: column;
  /* Bocne sistemske ivice (iPhone polozen, „notch“) — uz viewport-fit=cover (_Glava.cshtml, 2026-10-09) sadrzaj ne ide
     ispod njih; na PC-u i bez notch-a env() = 0. */
  padding-left: env(safe-area-inset-left, 0px);
  padding-right: env(safe-area-inset-right, 0px);
}

.app-shell {
  flex: 1;
  min-height: 0;
  display: flex;
  align-items: stretch;
  overflow: hidden;
}

.app-content {
  flex: 1;
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.app-topbar {
  flex-shrink: 0;
  background: linear-gradient(180deg, var(--rmx-mpod-vrh) 0%, var(--rmx-mpod) 55%, var(--rmx-mpod-dno) 100%);
  color: var(--rmx-mpod-tekst);
  height: 36px;
  padding: 0 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--rmx-mpod-crta);
}

.app-topbar-left,
.app-topbar-right {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.app-brand {
  font-weight: 700;
  letter-spacing: 0.6px;
  color: var(--rmx-mpod-tekst-jak);
  text-decoration: none;
}

.app-brand:hover {
  color: var(--rmx-mpod-tekst-jak);
  text-decoration: underline;
}

.app-top-link {
  color: var(--rmx-mpod-tekst-link);
  text-decoration: none;
  font-size: var(--rmx-traka-font-size, 12px);   /* Prikaz → Gornja i donja traka (2026-10-24) */
  margin-right: 8px;
}

.app-top-link:hover {
  color: var(--rmx-mpod-tekst-jak);
  text-decoration: underline;
}

.app-sep { opacity: 0.4; color: var(--rmx-gray-light); }

.app-firma {
  max-width: 360px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--rmx-mpod-tekst-meni);
}

.app-godina {
  font-weight: 600;
  color: var(--rmx-mpod-tekst-jak);
}

/* Ranija radna godina (_Layout.cshtml godinaRanija, korisnik 2026-10-06) — svetlija crvena od --rmx-red da se cita na
   tamnoj traci. */
.app-godina.app-godina-ranija {
  color: #ff4f42;
}

/* TRAKA — IZBOR (korisnik 2026-11-03, docs/dizajn.md § Firme): firma i godina u gornjoj traci su tasteri koji otvaraju padajući
   spisak (Pages/Shared/_TrakaIzbor.cshtml, wwwroot/js/rmx-traka-izbor.js). Izgled tastera = .app-firma / .app-godina gore
   (bez okvira i pozadine), spisak = postojeći .app-menu-panel gornjeg menija; ovde samo položaj i otvaranje na klik.
   DEMO uz naziv firme = .app-godina.app-godina-ranija (ista oznaka kao ranija godina). */
.rmx-traka-izbor { position: relative; display: inline-flex; align-items: center; min-width: 0; }
.rmx-traka-izbor-dugme { border: 0; background: transparent; padding: 0; font: inherit; cursor: pointer; }
.rmx-traka-izbor-dugme:hover { text-decoration: underline; }
.rmx-traka-izbor.otvoren .rmx-traka-izbor-panel { display: block; max-height: 70vh; overflow-y: auto; }
.rmx-traka-izbor-panel .rmx-traka-izbor-trazi { margin: 2px 8px 6px; width: calc(100% - 16px); }

/* Ime u gornjoj traci — isti okvir kao Beleška / Izlaz (korisnik 2026-10-13).
   Nije taster: bez hover / cursor. Telefon i dalje krije .app-user. */
.app-user {
  height: 24px;
  padding: 0 10px;
  border: 1px solid var(--rmx-mpod-ivica);
  border-radius: 3px;
  background: var(--rmx-mpod-vrh);
  color: var(--rmx-mpod-tekst);
  font-size: var(--rmx-traka-font-size, 12px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: 4px;
}

.app-logout-form { margin: 0; }

.btn-top-izlaz {
  height: 24px;
  padding: 0 10px;
  border: 1px solid var(--rmx-mpod-ivica);
  border-radius: 3px;
  background: var(--rmx-mpod-vrh);
  color: var(--rmx-mpod-tekst);
  cursor: pointer;
  font-size: var(--rmx-traka-font-size, 12px);
}

/* ===== BOJE PROGRAMA PO KORISNIKU (korisnik 2026-10-14: „da korisnik može da menja samostalno posebno meni boja + boja
   naslova prozora + boja …“, „boja slova u meniju“, „uradi sviđa mi se predlog“) =====
   Svaki izbor je poseban (Podešavanja → Meni), klasa na body iz _Layout, spiskovi u ShellMenu (menjati zajedno):
     okvir-{k}     Meni — pozadina (bočni / gornji meni, flyout, gornja traka, status) = --rmx-mpod-*; sitni tamni detalji
                   --rmx-tamna-* (shell.okvir.boja; bez zapisa = stara „Boja traka“ shell.traka.boja) — ShellMenu.Okviri
     slova-{k}     Meni — slova = --rmx-mpod-tekst* (shell.okvir.slova; auto = slova palete) — ShellMenu.Slova
     traka-{k}     Naslovi prozora / kontejnera i zaglavlja tabela = --rmx-traka-* + tekst + sivi tasteri --rmx-taster*
                   (shell.traka.boja) — ShellMenu.Trake
     meni-boja-{k} Boja akcenta (pod mišem, crta, tasteri prozora): --rmx-akcent-* → --rmx-meni-tekst / -crta (meni) i
                   --rmx-traka-akcent / -crta (vrhovi prozora); na svetlom tamna nijansa (shell.meni.boja) — ShellMenu.Boje
     izbor-{k}     Boja izbora (blok „BOJA IZBORA“ ispod); pozadina-{k} Pozadina ekrana --rmx-bg (shell.pozadina) — ShellMenu.Pozadine
   PRAVILA: naslovi prozora i tabela uvek tamniji od sadržaja (svetle palete vrh ≤ #bfc6ce); nova tamna površina / tekst na
   njoj = promenljiva odavde, nikad fiksna boja; login i aplikacija vozača se ne diraju. Podrazumevano = Grafit / zlatna /
   siva (stari izgled). TEMELJNO PRAVILO: svaki izbor jednom u ui_podesavanja, ovde samo prikaz. */
:root, .okvir-grafit {
  --rmx-mpod-dno: #14181d; --rmx-mpod: #1e242c; --rmx-mpod-meni: #262d36; --rmx-mpod-vrh: #2a313a;
  --rmx-mpod-polje: #2f3742; --rmx-mpod-izabrano: #3a434e; --rmx-mpod-sep: #3e4752; --rmx-mpod-ivica: #4a5360; --rmx-mpod-crta: #000;
  --rmx-mpod-tekst: #e8eaed; --rmx-mpod-tekst-jak: #fff; --rmx-mpod-tekst-meni: #d5d9de; --rmx-mpod-tekst-link: #c5cad1;
  --rmx-mpod-tekst-miran: #c9ced6; --rmx-mpod-tekst-sivi: #aeb5bd; --rmx-mpod-tekst-status: #a8b0b8; --rmx-mpod-tekst-podnaslov: #8a929c;
  --rmx-meni-naslov: #6c747e;
  --rmx-tamna-dno: #14181d; --rmx-tamna: #1e242c; --rmx-tamna-meni: #262d36; --rmx-tamna-vrh: #2a313a;
  --rmx-tamna-polje: #2f3742; --rmx-tamna-izabrano: #3a434e; --rmx-tamna-sep: #3e4752; --rmx-tamna-ivica: #4a5360;
}
:root, .traka-grafit {
  --rmx-traka-dno: #14181d; --rmx-traka: #1e242c; --rmx-traka-meni: #262d36; --rmx-traka-vrh: #2a313a;
  --rmx-traka-polje: #2f3742; --rmx-traka-izabrano: #3a434e; --rmx-traka-sep: #3e4752; --rmx-traka-ivica: #4a5360; --rmx-traka-crta: #000;
  --rmx-traka-tekst: #e8eaed; --rmx-traka-tekst-jak: #fff; --rmx-traka-tekst-meni: #d5d9de; --rmx-traka-tekst-link: #c5cad1;
  --rmx-traka-tekst-miran: #c9ced6; --rmx-traka-tekst-sivi: #aeb5bd; --rmx-traka-tekst-status: #a8b0b8; --rmx-traka-tekst-podnaslov: #8a929c; --rmx-traka-link: #9cc3ff; --rmx-traka-link-hover: #ffc680;
  --rmx-taster: #e8eaed; --rmx-taster-ivica: #9aa3ad;
}
/* Meni — pozadina: tamne palete (slova svetla; sitni detalji prate meni). */
/* Svetlija crna A / B / C (korisnik 2026-10-26: „neku svetliju crnu“, slika _tmp/predlog_svetlija_crna, „uradi sve tri“):
   neutralno crne bez plavog tona, između Grafit i Grafit svetliji; slova svetla iz :root. Isto kao .traka-crna-* niže i
   ShellMenu.Okviri / Trake — menjati zajedno. */
.okvir-crna-a {
  --rmx-mpod-dno: #212427; --rmx-mpod: #2b2f33; --rmx-mpod-meni: #33373b; --rmx-mpod-vrh: #373b40;
  --rmx-mpod-polje: #3c4045; --rmx-mpod-izabrano: #474b51; --rmx-mpod-sep: #4b4f55; --rmx-mpod-ivica: #575c62; --rmx-mpod-crta: #151719;
  --rmx-tamna-dno: #212427; --rmx-tamna: #2b2f33; --rmx-tamna-meni: #33373b; --rmx-tamna-vrh: #373b40;
  --rmx-tamna-polje: #3c4045; --rmx-tamna-izabrano: #474b51; --rmx-tamna-sep: #4b4f55; --rmx-tamna-ivica: #575c62;
}
.okvir-crna-b {
  --rmx-mpod-dno: #292c30; --rmx-mpod: #33373c; --rmx-mpod-meni: #3b3f44; --rmx-mpod-vrh: #3f4449;
  --rmx-mpod-polje: #44494e; --rmx-mpod-izabrano: #4f545a; --rmx-mpod-sep: #53585e; --rmx-mpod-ivica: #5f646b; --rmx-mpod-crta: #1c1f22;
  --rmx-tamna-dno: #292c30; --rmx-tamna: #33373c; --rmx-tamna-meni: #3b3f44; --rmx-tamna-vrh: #3f4449;
  --rmx-tamna-polje: #44494e; --rmx-tamna-izabrano: #4f545a; --rmx-tamna-sep: #53585e; --rmx-tamna-ivica: #5f646b;
}
.okvir-crna-c {
  --rmx-mpod-dno: #31353a; --rmx-mpod: #3b4046; --rmx-mpod-meni: #43484e; --rmx-mpod-vrh: #474c53;
  --rmx-mpod-polje: #4c5158; --rmx-mpod-izabrano: #575d64; --rmx-mpod-sep: #5b6168; --rmx-mpod-ivica: #676d75; --rmx-mpod-crta: #222528;
  --rmx-tamna-dno: #31353a; --rmx-tamna: #3b4046; --rmx-tamna-meni: #43484e; --rmx-tamna-vrh: #474c53;
  --rmx-tamna-polje: #4c5158; --rmx-tamna-izabrano: #575d64; --rmx-tamna-sep: #5b6168; --rmx-tamna-ivica: #676d75;
}
.okvir-grafit-svetli {
  --rmx-mpod-dno: #2c333b; --rmx-mpod: #3b434d; --rmx-mpod-meni: #424a55; --rmx-mpod-vrh: #4a535e;
  --rmx-mpod-polje: #4f5864; --rmx-mpod-izabrano: #5a6470; --rmx-mpod-sep: #5e6873; --rmx-mpod-ivica: #6e7884; --rmx-mpod-crta: #222830;
  --rmx-tamna-dno: #2c333b; --rmx-tamna: #3b434d; --rmx-tamna-meni: #424a55; --rmx-tamna-vrh: #4a535e;
  --rmx-tamna-polje: #4f5864; --rmx-tamna-izabrano: #5a6470; --rmx-tamna-sep: #5e6873; --rmx-tamna-ivica: #6e7884;
}
.okvir-plavo-siva {
  --rmx-mpod-dno: #26364a; --rmx-mpod: #33465b; --rmx-mpod-meni: #394d63; --rmx-mpod-vrh: #3f556c;
  --rmx-mpod-polje: #445b73; --rmx-mpod-izabrano: #4f6780; --rmx-mpod-sep: #546c86; --rmx-mpod-ivica: #647c96; --rmx-mpod-crta: #1b2836;
  --rmx-tamna-dno: #26364a; --rmx-tamna: #33465b; --rmx-tamna-meni: #394d63; --rmx-tamna-vrh: #3f556c;
  --rmx-tamna-polje: #445b73; --rmx-tamna-izabrano: #4f6780; --rmx-tamna-sep: #546c86; --rmx-tamna-ivica: #647c96;
}
.okvir-tamno-plava {
  --rmx-mpod-dno: #111b29; --rmx-mpod: #1d2b40; --rmx-mpod-meni: #22324a; --rmx-mpod-vrh: #283a55;
  --rmx-mpod-polje: #2d405e; --rmx-mpod-izabrano: #36496b; --rmx-mpod-sep: #3c5274; --rmx-mpod-ivica: #4a6283; --rmx-mpod-crta: #0b121c;
  --rmx-tamna-dno: #111b29; --rmx-tamna: #1d2b40; --rmx-tamna-meni: #22324a; --rmx-tamna-vrh: #283a55;
  --rmx-tamna-polje: #2d405e; --rmx-tamna-izabrano: #36496b; --rmx-tamna-sep: #3c5274; --rmx-tamna-ivica: #4a6283;
}
.okvir-pantheon {
  --rmx-mpod-dno: #353a43; --rmx-mpod: #40454f; --rmx-mpod-meni: #454b55; --rmx-mpod-vrh: #4a505a;
  --rmx-mpod-polje: #4d545f; --rmx-mpod-izabrano: #5a616d; --rmx-mpod-sep: #545b66; --rmx-mpod-ivica: #6a717c; --rmx-mpod-crta: #2f343c;
  --rmx-tamna-dno: #353a43; --rmx-tamna: #40454f; --rmx-tamna-meni: #454b55; --rmx-tamna-vrh: #4a505a;
  --rmx-tamna-polje: #4d545f; --rmx-tamna-izabrano: #5a616d; --rmx-tamna-sep: #545b66; --rmx-tamna-ivica: #6a717c;
}
/* Meni — pozadina: svetle palete (slova tamna, naslovi grupa tamniji; sitni detalji ostaju grafit — beli tekst čitljiv). */
.okvir-svetla {
  --rmx-mpod-dno: #a9b2bd; --rmx-mpod: #c3cad3; --rmx-mpod-meni: #c8cfd7; --rmx-mpod-vrh: #ccd3db;
  --rmx-mpod-polje: #b5bdc7; --rmx-mpod-izabrano: #a7b1bc; --rmx-mpod-sep: #a9b2bc; --rmx-mpod-ivica: #929ca8; --rmx-mpod-crta: #9aa3ad;
  --rmx-mpod-tekst: #1f252c; --rmx-mpod-tekst-jak: #111418; --rmx-mpod-tekst-meni: #22282f; --rmx-mpod-tekst-link: #2b3139;
  --rmx-mpod-tekst-miran: #3a424c; --rmx-mpod-tekst-sivi: #4b535c; --rmx-mpod-tekst-status: #3a424c; --rmx-mpod-tekst-podnaslov: #4b535c;
  --rmx-meni-naslov: #4b535c;
}
.okvir-siva {
  --rmx-mpod-dno: #97a1ad; --rmx-mpod: #b0b8c2; --rmx-mpod-meni: #b5bdc6; --rmx-mpod-vrh: #bec5ce;
  --rmx-mpod-polje: #a3adb8; --rmx-mpod-izabrano: #96a0ac; --rmx-mpod-sep: #9aa4af; --rmx-mpod-ivica: #828d99; --rmx-mpod-crta: #8b95a1;
  --rmx-mpod-tekst: #1f252c; --rmx-mpod-tekst-jak: #111418; --rmx-mpod-tekst-meni: #22282f; --rmx-mpod-tekst-link: #2b3139;
  --rmx-mpod-tekst-miran: #3a424c; --rmx-mpod-tekst-sivi: #4b535c; --rmx-mpod-tekst-status: #3a424c; --rmx-mpod-tekst-podnaslov: #4b535c;
  --rmx-meni-naslov: #4b535c;
}
/* Meni — slova (posle palete = jače); auto = slova palete. */
.slova-svetla {
  --rmx-mpod-tekst: #e8eaed; --rmx-mpod-tekst-jak: #fff; --rmx-mpod-tekst-meni: #d5d9de; --rmx-mpod-tekst-link: #c5cad1;
  --rmx-mpod-tekst-miran: #c9ced6; --rmx-mpod-tekst-sivi: #aeb5bd; --rmx-mpod-tekst-status: #a8b0b8; --rmx-mpod-tekst-podnaslov: #8a929c;
}
.slova-bela {
  --rmx-mpod-tekst: #fff; --rmx-mpod-tekst-jak: #fff; --rmx-mpod-tekst-meni: #fff; --rmx-mpod-tekst-link: #f1f3f5;
  --rmx-mpod-tekst-miran: #e8eaed; --rmx-mpod-tekst-sivi: #d5d9de; --rmx-mpod-tekst-status: #d5d9de; --rmx-mpod-tekst-podnaslov: #c5cad1;
}
.slova-zlatna {
  --rmx-mpod-tekst: #ded3b4; --rmx-mpod-tekst-jak: #f3ead0; --rmx-mpod-tekst-meni: #ded3b4; --rmx-mpod-tekst-link: #d2c69f;
  --rmx-mpod-tekst-miran: #cfc39d; --rmx-mpod-tekst-sivi: #b9ae8a; --rmx-mpod-tekst-status: #b9ae8a; --rmx-mpod-tekst-podnaslov: #a89d7a;
}
.slova-tamna {
  --rmx-mpod-tekst: #1f252c; --rmx-mpod-tekst-jak: #111418; --rmx-mpod-tekst-meni: #22282f; --rmx-mpod-tekst-link: #2b3139;
  --rmx-mpod-tekst-miran: #3a424c; --rmx-mpod-tekst-sivi: #4b535c; --rmx-mpod-tekst-status: #3a424c; --rmx-mpod-tekst-podnaslov: #4b535c;
}
/* Naslovi prozora i tabela: tamne palete (slova svetla). */
/* Svetlija crna A / B / C (korisnik 2026-10-26, „uradi sve tri“) — iste nijanse kao .okvir-crna-* gore; slova i tasteri iz :root. */
.traka-crna-a {
  --rmx-traka-dno: #212427; --rmx-traka: #2b2f33; --rmx-traka-meni: #33373b; --rmx-traka-vrh: #373b40;
  --rmx-traka-polje: #3c4045; --rmx-traka-izabrano: #474b51; --rmx-traka-sep: #4b4f55; --rmx-traka-ivica: #575c62; --rmx-traka-crta: #151719;
}
.traka-crna-b {
  --rmx-traka-dno: #292c30; --rmx-traka: #33373c; --rmx-traka-meni: #3b3f44; --rmx-traka-vrh: #3f4449;
  --rmx-traka-polje: #44494e; --rmx-traka-izabrano: #4f545a; --rmx-traka-sep: #53585e; --rmx-traka-ivica: #5f646b; --rmx-traka-crta: #1c1f22;
}
.traka-crna-c {
  --rmx-traka-dno: #31353a; --rmx-traka: #3b4046; --rmx-traka-meni: #43484e; --rmx-traka-vrh: #474c53;
  --rmx-traka-polje: #4c5158; --rmx-traka-izabrano: #575d64; --rmx-traka-sep: #5b6168; --rmx-traka-ivica: #676d75; --rmx-traka-crta: #222528;
}
.traka-grafit-svetli {
  --rmx-traka-dno: #2c333b; --rmx-traka: #3b434d; --rmx-traka-meni: #424a55; --rmx-traka-vrh: #4a535e;
  --rmx-traka-polje: #4f5864; --rmx-traka-izabrano: #5a6470; --rmx-traka-sep: #5e6873; --rmx-traka-ivica: #6e7884; --rmx-traka-crta: #222830;
}
.traka-plavo-siva {
  --rmx-traka-dno: #26364a; --rmx-traka: #33465b; --rmx-traka-meni: #394d63; --rmx-traka-vrh: #3f556c;
  --rmx-traka-polje: #445b73; --rmx-traka-izabrano: #4f6780; --rmx-traka-sep: #546c86; --rmx-traka-ivica: #647c96; --rmx-traka-crta: #1b2836;
}
.traka-tamno-plava {
  --rmx-traka-dno: #111b29; --rmx-traka: #1d2b40; --rmx-traka-meni: #22324a; --rmx-traka-vrh: #283a55;
  --rmx-traka-polje: #2d405e; --rmx-traka-izabrano: #36496b; --rmx-traka-sep: #3c5274; --rmx-traka-ivica: #4a6283; --rmx-traka-crta: #0b121c;
}
/* Naslovi prozora i tabela: svetle palete — tamnije od podloge strane, slova tamna, sivi tasteri sa kontrastom. */
.traka-pantheon {
  --rmx-traka-dno: #9da6b0; --rmx-traka: #b3bac3; --rmx-traka-meni: #b9c0c8; --rmx-traka-vrh: #bfc6ce;
  --rmx-traka-polje: #a9b1ba; --rmx-traka-izabrano: #9ea7b1; --rmx-traka-sep: #a1aab4; --rmx-traka-ivica: #8a949f; --rmx-traka-crta: #959ea9;
  --rmx-traka-tekst: #1f252c; --rmx-traka-tekst-jak: #111418; --rmx-traka-tekst-meni: #22282f; --rmx-traka-tekst-link: #2b3139;
  --rmx-traka-tekst-miran: #3a424c; --rmx-traka-tekst-sivi: #4b535c; --rmx-traka-tekst-status: #3a424c; --rmx-traka-tekst-podnaslov: #4b535c; --rmx-traka-link: #154f96; --rmx-traka-link-hover: #8f4700;
  --rmx-taster: #d6dbe1; --rmx-taster-ivica: #7f8994;
}
.traka-svetla {
  --rmx-traka-dno: #9aa4af; --rmx-traka: #b0b8c2; --rmx-traka-meni: #b7bfc8; --rmx-traka-vrh: #bcc4cd;
  --rmx-traka-polje: #a6afba; --rmx-traka-izabrano: #9ba5b0; --rmx-traka-sep: #9ea8b3; --rmx-traka-ivica: #87929e; --rmx-traka-crta: #929ca8;
  --rmx-traka-tekst: #1f252c; --rmx-traka-tekst-jak: #111418; --rmx-traka-tekst-meni: #22282f; --rmx-traka-tekst-link: #2b3139;
  --rmx-traka-tekst-miran: #3a424c; --rmx-traka-tekst-sivi: #4b535c; --rmx-traka-tekst-status: #3a424c; --rmx-traka-tekst-podnaslov: #4b535c; --rmx-traka-link: #154f96; --rmx-traka-link-hover: #8f4700;
  --rmx-taster: #d3d8de; --rmx-taster-ivica: #7d8792;
}
.traka-siva {
  --rmx-traka-dno: #8b96a2; --rmx-traka: #a1abb6; --rmx-traka-meni: #a7b0ba; --rmx-traka-vrh: #adb6c0;
  --rmx-traka-polje: #97a1ac; --rmx-traka-izabrano: #8c97a3; --rmx-traka-sep: #909aa6; --rmx-traka-ivica: #78838f; --rmx-traka-crta: #838d99;
  --rmx-traka-tekst: #1f252c; --rmx-traka-tekst-jak: #111418; --rmx-traka-tekst-meni: #22282f; --rmx-traka-tekst-link: #2b3139;
  --rmx-traka-tekst-miran: #3a424c; --rmx-traka-tekst-sivi: #4b535c; --rmx-traka-tekst-status: #3a424c; --rmx-traka-tekst-podnaslov: #4b535c; --rmx-traka-link: #154f96; --rmx-traka-link-hover: #8f4700;
  --rmx-taster: #c9cfd6; --rmx-taster-ivica: #727d89;
}
/* Boja akcenta (bivša „Boja menija“, ključ shell.meni.boja): svaka boja daje svetlu nijansu (na tamnom) i tamnu (na svetlom). */
:root, .meni-boja-zlatna { --rmx-akcent-s: #ded3b4; --rmx-akcent-s-crta: #c8b788; --rmx-akcent-t: #6f5c2a; --rmx-akcent-t-crta: #a8925a; }
.meni-boja-narandzasta { --rmx-akcent-s: #ff9a2e; --rmx-akcent-s-crta: #ff9a2e; --rmx-akcent-t: #a35200; --rmx-akcent-t-crta: #e07b00; }
.meni-boja-plava { --rmx-akcent-s: #9cc3ff; --rmx-akcent-s-crta: #5b9bea; --rmx-akcent-t: #1a5fb4; --rmx-akcent-t-crta: #3b82d6; }
.meni-boja-zelena { --rmx-akcent-s: #a8d5a2; --rmx-akcent-s-crta: #6fb36a; --rmx-akcent-t: #2e6b3a; --rmx-akcent-t-crta: #4c9a47; }
.meni-boja-srebrna { --rmx-akcent-s: #ffffff; --rmx-akcent-s-crta: #aab4c0; --rmx-akcent-t: #111418; --rmx-akcent-t-crta: #6c747e; }
.meni-boja-pantheon { --rmx-akcent-s: #ffc24a; --rmx-akcent-s-crta: #f7a90f; --rmx-akcent-t: #9a6200; --rmx-akcent-t-crta: #f7a90f; }
/* Preslikavanje akcenta — na body (ne samo :root: računa se gde su klase); .meni-boja-uzorak = uzorak na strani Meni.
   Svetao meni → tamna nijansa u meniju; svetao vrh prozora → tamna nijansa na vrhovima prozora (prozor štampe, email). */
:root, body, .meni-boja-uzorak {
  --rmx-meni-tekst: var(--rmx-akcent-s); --rmx-meni-crta: var(--rmx-akcent-s-crta);
  --rmx-traka-akcent: var(--rmx-akcent-s); --rmx-traka-akcent-crta: var(--rmx-akcent-s-crta);
}
body.okvir-svetla, body.okvir-siva, .okvir-svetla .meni-boja-uzorak, .okvir-siva .meni-boja-uzorak {
  --rmx-meni-tekst: var(--rmx-akcent-t); --rmx-meni-crta: var(--rmx-akcent-t-crta);
}
body.traka-svetla, body.traka-siva, body.traka-pantheon {
  --rmx-traka-akcent: var(--rmx-akcent-t); --rmx-traka-akcent-crta: var(--rmx-akcent-t-crta);
}
/* Pozadina ekrana (shell.pozadina): siva = --rmx-bg iz :root; bela = bivša Svetla „bela pozadina“ (korisnik 2026-10-14). */
.pozadina-bela { --rmx-bg: #ffffff; }
/* Traka zaglavlja tabele u belom panelu pregleda ispod reda (korisnik 2026-10-16: „stavi ovu traku boju pozadine u svetliju“,
   „kao ova pozadina ekrana ali malo tamnija“, PNG _tmp/predlog_sef_datumi/predlog_traka_stavki — „2b definitivno“): bela malo
   tamnija + tamna slova, ista za sve palete (panel pregleda je uvek beo). Jedino mesto boje (--rmx-podtabela-* u prvom :root
   na vrhu fajla). Nova tabela u belom panelu pregleda = ove promenljive, ne fiksna boja. */
/* ===== BOJA IZBORA (korisnik 2026-10-14: „da korisnik može da odabere boju ovog selektovanog reda, odnosno one trake za
   grupe i okvir izabrane stavke u bočnom meniju“) =====
   --rmx-row-izabran = izabran red u listama (.row-selected, .lista-row.is-selected, dno pregleda naloga na Boardu);
   --rmx-grupa / -tekst / -crta = trake grupa (meseci na Fakturama / Ulaznim / Turama, Aktivne / Završene na Nalozima,
   traka posade na turi, telefon Nalozi); --rmx-izbor-crta = crta levo izabrane stavke bočnog menija.
   Podrazumevano Zlatna (iste stare boje). Klasa body izbor-{kljuc} (_Layout, ui_podesavanja shell.izbor.boja,
   ShellMenu.Izbori — menjati zajedno); ista klasa boji uzorak na strani Meni. Nova traka grupe / izabran red = ove promenljive. */
:root, .izbor-zlatna { --rmx-row-izabran: #eee7d4; --rmx-grupa: #ded3b4; --rmx-grupa-tekst: #41371f; --rmx-grupa-crta: #c8b788; --rmx-izbor-crta: #c8b788; }
.izbor-plava    { --rmx-row-izabran: #dce8f6; --rmx-grupa: #c6d8ef; --rmx-grupa-tekst: #1d3557; --rmx-grupa-crta: #7fa6d6; --rmx-izbor-crta: #5b9bea; }
.izbor-siva     { --rmx-row-izabran: #e2e6eb; --rmx-grupa: #ccd2d9; --rmx-grupa-tekst: #2b3139; --rmx-grupa-crta: #9aa4af; --rmx-izbor-crta: #aab4c0; }
.izbor-zelena   { --rmx-row-izabran: #e1efdd; --rmx-grupa: #cbe2c6; --rmx-grupa-tekst: #24452a; --rmx-grupa-crta: #84b87e; --rmx-izbor-crta: #6fb36a; }
.izbor-pantheon { --rmx-row-izabran: #fdf1d2; --rmx-grupa: #f8d98a; --rmx-grupa-tekst: #4a3500; --rmx-grupa-crta: #f0ad1e; --rmx-izbor-crta: #f7a90f; }
/* Uzorak na strani Meni: traka grupe, izabran red, običan red. */
.izbor-uzorak { display: flex; flex-direction: column; border: 1px solid #9aa3ad; border-radius: 4px; overflow: hidden; font-size: 11px; background: #fff; }
.izbor-uzorak .iu-grupa { background: var(--rmx-grupa); color: var(--rmx-grupa-tekst); border-bottom: 1px solid var(--rmx-grupa-crta); padding: 2px 6px; font-weight: 600; }
.izbor-uzorak .iu-red { padding: 2px 6px; border-bottom: 1px solid #e3e6ea; }
.izbor-uzorak .iu-red.on { background: var(--rmx-row-izabran); }
.izbor-uzorak .iu-meni { background: #3a434e; color: #fff; padding: 2px 6px; box-shadow: inset 3px 0 0 var(--rmx-izbor-crta); font-weight: 600; }
/* Uzorci na strani Meni (Pages/Podesavanja/Index.cshtml) — isti okvir kao Boja akcenta. */
.okvir-uzorak { display: flex; flex-direction: column; border-radius: 4px; overflow: hidden; font-size: 11px; }
.okvir-uzorak .ou-gore { background: linear-gradient(180deg, var(--rmx-mpod-vrh) 0%, var(--rmx-mpod) 55%, var(--rmx-mpod-dno) 100%); color: var(--rmx-mpod-tekst); padding: 3px 8px; font-weight: 700; font-size: 10px; }
.okvir-uzorak .ou-meni { background: var(--rmx-mpod); padding: 3px 0; }
.okvir-uzorak .ou-meni span { display: block; padding: 2px 8px; color: var(--rmx-mpod-tekst-meni); font-size: 10px; }
.okvir-uzorak .ou-meni span.on { background: var(--rmx-mpod-izabrano); color: var(--rmx-mpod-tekst-jak); }
.traka-uzorak { display: flex; flex-direction: column; border: 1px solid #9aa3ad; border-radius: 4px; overflow: hidden; font-size: 11px; background: #f2f3f5; }
.traka-uzorak .tu-naslov { background: linear-gradient(180deg, var(--rmx-traka-vrh) 0%, var(--rmx-traka) 100%); color: var(--rmx-traka-tekst); padding: 2px 6px; font-weight: 650; font-size: 10px; }
.traka-uzorak .tu-polje { height: 12px; margin: 4px 6px; background: #fff; border: 1px solid #bcc2c9; border-radius: 2px; }
.traka-uzorak .tu-th { background: var(--rmx-traka-vrh); color: var(--rmx-traka-tekst); padding: 2px 6px; font-weight: 600; font-size: 10px; display: flex; justify-content: space-between; }
.traka-uzorak .tu-red { background: #fff; padding: 2px 6px; font-size: 10px; }
/* Uzorak „Siva“ mora da ima svoju sivu: bez ovoga nasleđuje --rmx-bg strane, pa je pri izabranoj Beloj i on beo (oba uzorka
   ista — korisnik 2026-10-24: „ova bela kada se odabere kao da nije bela“). Vrednost = --rmx-bg u :root — menjati zajedno. */
.pozadina-uzorak.pozadina-siva { --rmx-bg: #d4d8dd; }
.pozadina-uzorak { display: block; height: 46px; border: 1px solid #9aa3ad; border-radius: 4px; background: var(--rmx-bg); padding: 6px; }
.pozadina-uzorak span { display: block; height: 100%; border: 1px solid #9aa3ad; border-radius: 3px; background: #f2f3f5; }

/* Izbor boje na strani Meni — kartice sa uzorkom menija (Pages/Podesavanja/Index.cshtml). */
.meni-boja-opcije { display: flex; flex-wrap: wrap; gap: 10px; }
.meni-boja-opcija {
  display: flex; flex-direction: column; gap: 6px; width: 170px; padding: 8px;
  border: 1px solid #c9ced5; border-radius: 6px; background: #fff; cursor: pointer;
}
.meni-boja-opcija:has(input:checked) { border: 2px solid var(--rmx-tamna); padding: 7px; }
.meni-boja-naziv { display: flex; align-items: center; gap: 6px; font-size: 12px; flex-wrap: wrap; }
.meni-boja-naziv small { color: #666; font-weight: 400; }
.meni-boja-uzorak { display: flex; flex-direction: column; background: var(--rmx-mpod); border-radius: 4px; padding: 4px 0; font-size: 11px; }
.mbu-traka { display: flex; gap: 4px; padding: 4px 8px 2px; }
.mbu-taster { border: 1px solid var(--rmx-mpod-ivica); background: var(--rmx-mpod-vrh); color: var(--rmx-mpod-tekst); font-size: 10px; padding: 1px 6px; border-radius: 3px; }
.mbu-taster.mbu-hover { color: var(--rmx-meni-tekst); border-color: var(--rmx-meni-crta); }
.mbu-naslov { padding: 5px 10px 2px; font-size: 9px; letter-spacing: .05em; font-weight: 600; color: var(--rmx-meni-naslov); }
.mbu-stavka { padding: 5px 10px; color: var(--rmx-mpod-tekst); font-weight: 600; }
.mbu-stavka.mbu-akt { background: var(--rmx-mpod-izabrano); }
/* .mbu-stavka.mbu-hover = isto pravilo kao .app-menu-panel a:hover (niže). */

/* Gornja traka pod misem (korisnik 2026-10-13, slika _tmp/predlog_traka_hover.png): polje tamno, tekst / ikonica
   i ivica u boji menija (--rmx-meni-*, blok „BOJA MENIJA“, podrazumevano zlatno) — isto kao sklopljen bocni meni.
   Isto: .btn-top-beleska, .app-sidebar-toggle, .app-osvezi — menjati zajedno. */
.btn-top-izlaz:hover,
.app-sidebar-toggle:hover {
  background: var(--rmx-mpod-vrh);
  border-color: var(--rmx-meni-crta);
  color: var(--rmx-meni-tekst);
}

/* Isti link u pregledu ispod reda na listi /Beleske (tekst u redu, ne polje) — Pages/Beleske/Index.cshtml afterPreview. */
.beleska-brza-form input[type="file"].form-input-file,
.kartica-form input[type="file"].form-input-file {
  height: auto;
  padding: 4px 8px;
  max-width: 100%;
}

/* Kartica Beleska: Opis je polje za pisanje, ne jednoredni input (globalni .form-input je 28px). */
.kartica-form textarea[name="B.Opis"] {
  height: auto;
  min-height: 24rem;
  resize: vertical;
  padding: 6px 8px;
  width: 100%;
  max-width: 100%;
  flex: 1 1 auto;
}

/* Native "Izbor datoteka" prati jezik Chrome/Windows (ćirilica). Sakrij ga; taster je latinica. */
.page-note a.sef-portal-link {
  color: var(--rmx-link);
  text-decoration: underline;
  margin-left: 0;
}
.page-note a.sef-portal-link:hover {
  color: var(--rmx-link); filter: brightness(0.8);
}
/* Dokument: XML/PDF tasteri gore desno, iznad Poslato na SEF. */
.kartica-form .faktura-sef-portal-btns > label {
  visibility: hidden;
  user-select: none;
}
.kartica-form .sef-portal-btns {
  display: flex;
  flex-wrap: wrap;
  gap: 2mm;
  align-items: center;
  min-height: var(--rmx-input-height, 28px);
}
.kartica-form a.btn-secondary-rmx.sef-portal-btn {
  text-decoration: none;
  min-width: 3.4rem;
  justify-content: center;
  padding-left: 10px;
  padding-right: 10px;
}
/* Padajuca lista filtera — samo na telefonu (blok „TELEFON — liste u stilu RMX TMS“), na PC-u tasteri (2026-10-09). */
.app-sidebar-toggle {
  width: 28px;
  height: 24px;
  margin-right: 4px;
  padding: 0;
  border: 1px solid var(--rmx-mpod-ivica);
  border-radius: 3px;
  background: var(--rmx-mpod-vrh);
  color: var(--rmx-mpod-tekst);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.app-sidebar-toggle svg {
  width: 14px;
  height: 14px;
  display: block;
}

/* .app-sidebar-toggle:hover = pravilo .btn-top-izlaz:hover (gore, jedan blok). */

/* OSVEŽI (korisnik 2026-10-13, varijanta L): taster posle ☰ (_Layout.cshtml #btnOsvezi) samo u prozoru instalirane
   aplikacije na PC-u — u pregledaču ima svoj ↻, telefon (≤ 700 px, isto kao rmxJeTelefon) ga nema. */
.app-osvezi { display: none; }
@media (display-mode: standalone) and (min-width: 701px) {
  .app-osvezi {
    width: 28px;
    height: 24px;
    margin-right: 4px;
    padding: 0;
    border: 1px solid var(--rmx-mpod-ivica);
    border-radius: 3px;
    background: var(--rmx-mpod-vrh);
    color: var(--rmx-mpod-tekst);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .app-osvezi svg {
    width: 14px;
    height: 14px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
  }
  .app-osvezi:hover {
    background: var(--rmx-mpod-vrh);
    border-color: var(--rmx-meni-crta);
    color: var(--rmx-meni-tekst);
  }
}

/* Levi meni — crno-siva paleta lab-a. */
.app-sidebar {
  flex-shrink: 0;
  width: 236px;
  background: var(--rmx-mpod);
  color: var(--rmx-mpod-tekst-meni);
  border-right: 1px solid var(--rmx-mpod-crta);
  overflow-x: hidden;
  overflow-y: auto;
  z-index: 40;
}

/* Animacija sirine samo kad korisnik klikne hamburger — ne pri ucitavanju stranice. */
html.sidebar-anim .app-sidebar {
  transition: width 0.15s ease;
}

.app-sidebar-nav {
  display: flex;
  flex-direction: column;
  padding: 10px 8px 18px;
  gap: 3px;
}

.app-side-link,
.app-side-summary {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 40px;
  padding: 8px 12px;
  border-radius: 4px;
  color: var(--rmx-mpod-tekst-meni);
  text-decoration: none;
  cursor: pointer;
  user-select: none;
  list-style: none;
}

.app-side-summary::-webkit-details-marker { display: none; }

/* Hover rasirenog bocnog menija — tamno polje #2f3742, tekst / ikonica + crta levo u boji menija (--rmx-meni-*, blok
   „BOJA MENIJA“; korisnik 2026-10-13, podrazumevano zlatno; do tada celo polje narandzasto #ff9a2e + bela slova).
   Isto .app-side-sub a:hover, sklopljen meni i flyout — menjati zajedno. */
.app-side-link:hover,
.app-side-summary:hover,
.app-side-sub a:hover,
.app-side-flyout a:hover,
.rmx-mr-stavka.is-akt {
  background: var(--rmx-mpod-polje);
  color: var(--rmx-meni-tekst);
  box-shadow: inset 3px 0 0 var(--rmx-meni-crta);
  font-weight: 600;   /* podebljano kao izabrana stavka (korisnik 2026-10-13, slika predlog_hover_debljina „B“) — isto podstavka, flyout, tastatura */
}

.app-side-link.active,
.app-side-sub a.active {
  background: var(--rmx-mpod-izabrano);
  color: var(--rmx-mpod-tekst-jak);
  font-weight: 600;
  /* Okvir izabrane stavke = Boja izbora (korisnik 2026-10-14: „okvir izabrane stavke u bočnom meniju“ — isto kao izabran red
     i trake grupa, blok „BOJA IZBORA“); pod mišem i dalje boja menija. */
  box-shadow: inset 3px 0 0 var(--rmx-izbor-crta);
}

.app-side-link.active:hover,
.app-side-sub a.active:hover,
.app-side-summary.active-group:hover,
.sidebar-collapsed .app-side-link.active:hover,
.sidebar-collapsed .app-side-summary.active-group:hover,
.sidebar-collapsed .app-side-group.is-flyout-open > .app-side-summary.active-group,
.app-side-flyout a.active:hover {
  background: var(--rmx-mpod-izabrano);
  color: var(--rmx-meni-tekst);
  box-shadow: inset 3px 0 0 var(--rmx-meni-crta);
}

.app-side-summary.active-group {
  color: var(--rmx-mpod-tekst-jak);
  font-weight: 600;
}

.app-side-ico {
  width: 26px;
  height: 26px;
  flex-shrink: 0;
  display: block;
  overflow: visible;
}

.app-side-text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: var(--rmx-menu-font-size);
}

.app-side-group {
  margin: 0;
  position: relative;
}

.app-side-sub {
  display: flex;
  flex-direction: column;
  padding: 2px 0 8px 12px;
  gap: 1px;
}

.app-side-sub a {
  display: block;
  padding: 8px 12px 8px 26px;
  border-radius: 4px;
  color: var(--rmx-mpod-tekst-link);
  text-decoration: none;
  font-size: var(--rmx-menu-font-size);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* .app-side-sub a:hover = pravilo .app-side-link:hover (gore, jedan blok). */

/* Partner typeahead na Fakture kartici — kucaj umesto dugacke select liste. */
.partner-typeahead {
  position: relative;
  width: 100%;
  max-width: calc(100ch + 1.15rem);
}
.partner-typeahead-field,
.lookup-search {
  position: relative;
  display: flex;
  align-items: center;
}
.partner-typeahead-field .form-input {
  padding-right: 28px;
}
.partner-typeahead-field .search-clear {
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
}
.partner-typeahead-list {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 2px);
  z-index: 40;
  max-height: 16rem;
  overflow: auto;
  background: #fff;
  border: 1px solid var(--rmx-edge);
  border-radius: 4px;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.14);
}
.partner-typeahead-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1px;
  width: 100%;
  padding: 7px 10px;
  border: 0;
  background: transparent;
  text-align: left;
  font: inherit;
  color: inherit;
  cursor: pointer;
}
.partner-typeahead-item:hover,
.partner-typeahead-item.is-focus {
  background: #ff9a2e;
  color: #fff;
}
.partner-typeahead-name {
  font-weight: 600;
}
.partner-typeahead-note {
  font-size: 0.85em;
  opacity: 0.85;
}
.partner-typeahead-empty {
  padding: 10px 12px;
  color: var(--rmx-muted);
  font-size: 0.9em;
}
/* Tabela unosa stavki na kartici fakture (N redova). */
.stavke-table-wrap {
  overflow-x: auto;
  margin-top: 0.25rem;
}
.stavke-edit-table,
.stavke-edit-table.grid {
  width: 100%;
  min-width: 54rem;
  border-collapse: collapse;
}
.stavke-edit-table.grid th,
.stavke-edit-table.grid td {
  vertical-align: middle;
  /* 0.75mm + 0.75mm = 1.5mm izmedju susednih polja */
  padding: 0.2rem 0.75mm;
}
.stavke-edit-table .form-input {
  max-width: none;
  width: 100%;
  min-width: 0;
  padding-left: 0.35rem;
  padding-right: 0.35rem;
}
.stavke-edit-table .stavka-jm,
.stavke-edit-table .stavka-kol {
  text-align: center;
}
/* JM: 3 znaka (npr. kom) bez sečenja. */
.stavke-edit-table .stavka-jm {
  min-width: 3.4rem;
}
.stavke-edit-table .stavka-rb-cell {
  text-align: center;
  color: #555;
  font-variant-numeric: tabular-nums;
}
.stavke-edit-table .stavka-rb-label {
  display: inline-block;
  min-width: 1.25rem;
}
.stavke-edit-table .stavka-cena-eur,
.stavke-edit-table .stavka-cena-din,
.stavke-edit-table .stavka-iznos {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
/* DIN iznosi (npr. 164287.4) — sira kolona od EUR. */
.stavke-edit-table .stavka-cena-din {
  min-width: 8.5rem;
}
/* Opis uzima manje preostalog prostora; Napomena sira (sifra npr. Troskovi-izvoz). */
.stavke-edit-table .col-opis {
  width: 36%;
}
.stavke-edit-table .col-napomena,
.stavke-edit-table .stavka-nap {
  min-width: 14rem;
  width: 15rem;
}

/* Podgrupa u bocnom meniju (npr. SEF ispod glavnih stavki Finansija). --rmx-meni-naslov kao naslovi flyout-a — od
   2026-10-13 uvece sivo #6c747e (korisnik „mnogo sve sija“; pre toga zlatno #c8b788, do tada #7a8490) — menjati zajedno sa .app-side-flyout-title. */
.app-side-subhead {
  margin: 10px 12px 2px 26px;
  padding: 8px 0 0;
  border-top: 1px solid #3a424c;
  font-size: calc(var(--rmx-menu-font-size) - 2px);
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--rmx-meni-naslov);
  user-select: none;
}

.app-menu-subhead {
  margin: 6px 10px 2px;
  padding: 4px 0 0;
  font-size: calc(var(--rmx-menu-font-size) - 2px);
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--rmx-mpod-tekst-podnaslov);
  border-top: 1px solid #3a424c;
  user-select: none;
}

/* Collapse: uska traka. Podmeni = JS flyout (#appSideFlyout), ne CSS hover u sidebaru. */
.sidebar-collapsed .app-sidebar {
  width: 58px;
  position: relative;
  z-index: 100;
}

.sidebar-collapsed .app-side-text,
.sidebar-collapsed .app-side-sub {
  display: none !important;
}

.sidebar-collapsed .app-side-link,
.sidebar-collapsed .app-side-summary {
  justify-content: center;
  padding: 10px 0;
  gap: 0;
}

/* Sklopljen: hover i otvoren flyout — polje ostaje tamno, zlatna ikonica #ded3b4 + tanka zlatna crta #c8b788 levo
   (korisnik 2026-10-13: varijanta 3, pa Z5 „sve zlatno, narandžaste bez“ — boje trake grupe u tabelama, slika
   _tmp/predlog_flyout_zlatno.png; isto flyout i gornji meni — menjati zajedno). Rasiren meni nije diran. */
.sidebar-collapsed .app-side-link:hover,
.sidebar-collapsed .app-side-summary:hover,
.sidebar-collapsed .app-side-group.is-flyout-open > .app-side-summary {
  background: transparent;
  color: var(--rmx-meni-tekst);
  box-shadow: inset 3px 0 0 var(--rmx-meni-crta);
}
/* Sklopljen: izabrana grupa pod mišem / otvoren flyout = pravilo .app-side-link.active:hover (gore, jedan blok). */

/* Fiksni panel van sidebara — ne seče ga overflow glavnog sadržaja. */
.app-side-flyout {
  display: none;
  position: fixed;
  min-width: 220px;
  max-width: 300px;
  /* Ceo meni vidljiv (visina prozora); skrol samo ako prozor bas nije dovoljno visok. */
  max-height: calc(100vh - 16px);
  overflow-y: auto;
  padding: 6px 0;
  background: var(--rmx-mpod);
  border: 1px solid var(--rmx-mpod-ivica);
  border-radius: 4px;
  box-shadow: 4px 6px 18px rgba(0, 0, 0, 0.45);
  z-index: 2000;
}

.app-side-flyout.is-open {
  display: block;
}

/* Naslovi grupa u flyout-u (TRANSPORT, INTERNO, …) = --rmx-meni-naslov, od 2026-10-13 uvece sivo #6c747e (korisnik:
   sivo #8a9ab0, pa Z5 „sve zlatno“ #c8b788, pa „mnogo sve sija“ → sivo; ranije #e3b27e). Isto .app-side-flyout-subhead i .app-menu-subhead — menjati zajedno. */
.app-side-flyout-title {
  padding: 8px 14px 6px;
  color: var(--rmx-meni-naslov);
  font-size: calc(var(--rmx-menu-font-size) - 4px);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.app-side-flyout-subhead {
  margin: 6px 14px 0;
  padding: 8px 0 2px;
  border-top: 1px solid var(--rmx-mpod-ivica);
  color: var(--rmx-meni-naslov);
  font-size: calc(var(--rmx-menu-font-size) - 4px);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  user-select: none;
}

.app-side-flyout a {
  display: block;
  padding: 9px 14px;
  color: var(--rmx-mpod-tekst);
  text-decoration: none;
  font-size: var(--rmx-menu-font-size);
  white-space: nowrap;
}

/* Flyout sklopljenog menija pod misem (korisnik 2026-10-13, Z3, slika _tmp/predlog_flyout_zlatno.png): zlatan tekst #ded3b4
   + zlatna crta #c8b788 (boje trake grupe u tabelama, .lista-grupa-zlatna) + malo svetlije polje. Isto .app-menu-panel a:hover
   (gornji meni) — menjati zajedno. Pre toga isti dan narandzast tekst + crta, ranije narandzasta pozadina. */
/* .app-side-flyout a:hover = pravilo .app-side-link:hover (gore, jedan blok). */

.app-side-flyout a.active {
  font-weight: 600;
  background: var(--rmx-mpod-izabrano);
  color: var(--rmx-mpod-tekst-jak);
}

/* .app-side-flyout a.active:hover = pravilo .app-side-link.active:hover (gore, jedan blok). */

/* ===== MENI NA DESNI KLIK (korisnik 2026-10-30: „meni za desni klik na listama pregledima“, „u stilu koji već imamo u
   podešavanjima“, „korisnik da odabere željeni izgled u podešavanjima“) — wwwroot/js/rmx-meni-reda.js, plan
   docs/plan_meni_desni_klik.md, pravilo ui_toolbar.md §6b. JS stavlja klasu mr-v-{kljuc} (ShellMenu.MeniReda, Podešavanja → Meni);
   isti blok crta i uzorke na strani Meni (.rmx-mr-uzorak). Boje samo promenljive iz Podešavanja:
     meni    = flyout bočnog menija (gore — iste mere: 9px 14px, Veličina menija, ivica 4px; menjati zajedno): --rmx-mpod-*,
               pod mišem Boja akcenta;
     prozor  = mali prozor: traka Naslovi prozora + crta akcenta gore (kao prozor štampe, ui_toolbar §7g), pod mišem Boja izbora;
     tasteri = beli meni, pod mišem boja tastera iz trake (.btn-hover-*:hover, ui_toolbar §2 — menjati zajedno). */
.rmx-mr {
  position: fixed;
  z-index: 2100;              /* iznad flyout-a (2000); stavka koja otvori dijalog (z 80) prvo zatvori meni */
  min-width: 200px;
  max-width: 360px;
  padding: 6px 0;
  background: var(--rmx-mpod);
  border: 1px solid var(--rmx-mpod-ivica);
  border-radius: 4px;
  box-shadow: 4px 6px 18px rgba(0, 0, 0, 0.45);
  color: var(--rmx-mpod-tekst);
  font-size: var(--rmx-menu-font-size);
  user-select: none;
}
.rmx-mr-naslov {
  display: block;
  padding: 7px 14px 6px;
  color: var(--rmx-meni-naslov);
  font-size: calc(var(--rmx-menu-font-size) - 3px);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rmx-mr-stavka {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 9px 14px;
  white-space: nowrap;
  cursor: pointer;
}
.rmx-mr-ico { display: inline-flex; flex: 0 0 14px; width: 14px; height: 14px; }
.rmx-mr-ico svg { width: 14px; height: 14px; }
.rmx-mr-tekst { flex: 1 1 auto; }
.rmx-mr-precica {
  margin-left: 22px;
  color: var(--rmx-mpod-tekst-podnaslov);
  font-size: calc(var(--rmx-menu-font-size) - 2px);
  font-weight: 400;
}
.rmx-mr-sep { display: block; height: 1px; margin: 4px 0; background: var(--rmx-mpod-sep); }
/* Stavka pod mišem / strelicom (.rmx-mr-stavka.is-akt) = pravilo .app-side-link:hover (gore, jedan blok). */
/* prozor — beo, traka naslova kao vrhovi prozora, stavka pod mišem kao izabran red (Boja izbora). */
.rmx-mr.mr-v-prozor {
  padding: 0 0 5px;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--rmx-edge);
  border-radius: var(--rmx-radius-panel);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25);
  color: var(--rmx-text);
}
.mr-v-prozor .rmx-mr-naslov {
  margin-bottom: 5px;
  padding: 5px 14px 6px;
  background: var(--rmx-traka-vrh);
  border-top: 3px solid var(--rmx-traka-akcent-crta);
  color: var(--rmx-traka-tekst);
  font-size: calc(var(--rmx-menu-font-size) - 1px);
  letter-spacing: 0;
  text-transform: none;
}
.mr-v-prozor > .rmx-mr-stavka:first-child { margin-top: 5px; }
.mr-v-prozor .rmx-mr-ico,
.mr-v-prozor .rmx-mr-precica { color: var(--rmx-muted); }
.mr-v-prozor .rmx-mr-sep { background: #dde1e6; }
.mr-v-prozor .rmx-mr-stavka.is-akt {
  background: var(--rmx-row-izabran);
  color: var(--rmx-text);
  box-shadow: inset 3px 0 0 var(--rmx-izbor-crta);
}
.mr-v-prozor .rmx-mr-stavka.is-akt .rmx-mr-ico { color: var(--rmx-text); }
/* tasteri — beo, pod mišem boja tastera: Novi zeleno, Izmena i ostali narandžasto, Brisanje crveno, Štampa plavo. */
.rmx-mr.mr-v-tasteri {
  padding: 5px;
  background: #fff;
  border: 1px solid var(--rmx-edge);
  border-radius: var(--rmx-radius-panel);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25);
  color: var(--rmx-text);
}
.mr-v-tasteri .rmx-mr-naslov {
  margin-bottom: 4px;
  padding: 3px 9px 6px;
  border-bottom: 1px solid #dde1e6;
  color: var(--rmx-muted);
  font-size: calc(var(--rmx-menu-font-size) - 2px);
  letter-spacing: 0;
  text-transform: none;
}
.mr-v-tasteri .rmx-mr-stavka { padding: 8px 9px; border-radius: 4px; font-weight: 600; }
.mr-v-tasteri .rmx-mr-precica { color: var(--rmx-muted); }
.mr-v-tasteri .rmx-mr-sep { background: #dde1e6; }
.mr-v-tasteri .rmx-mr-stavka.is-akt { background: #ffe8cc; color: #8a4b00; box-shadow: inset 0 0 0 1px #e0a35a; }
.mr-v-tasteri .rmx-mr-stavka.is-akt[data-vrsta="novi"] { background: #d7efdc; color: #1f5c2a; box-shadow: inset 0 0 0 1px #7eb888; }
.mr-v-tasteri .rmx-mr-stavka.is-akt[data-vrsta="brisi"] { background: #f6d4cf; color: #8a2a20; box-shadow: inset 0 0 0 1px #d08a80; }
.mr-v-tasteri .rmx-mr-stavka.is-akt[data-vrsta="stampa"] { background: #d6e6f7; color: #1a4a7a; box-shadow: inset 0 0 0 1px #7aa3d4; }
/* Uzorci na strani Podešavanja → Meni (isti izgled, umanjeno, u okviru izbora .meni-boja-opcija). */
.rmx-mr.rmx-mr-uzorak {
  position: static;
  display: block;
  z-index: auto;
  min-width: 0;
  max-width: none;
  box-shadow: none;
  font-size: 11px;
}
.rmx-mr-uzorak .rmx-mr-naslov { padding: 3px 9px; font-size: 9px; }
.rmx-mr-uzorak.mr-v-prozor .rmx-mr-naslov { margin-bottom: 3px; padding: 2px 9px; border-top-width: 2px; font-size: 10px; }
.rmx-mr-uzorak.mr-v-tasteri .rmx-mr-naslov { margin-bottom: 2px; padding: 1px 6px 3px; font-size: 10px; }
.rmx-mr-uzorak .rmx-mr-stavka { gap: 6px; padding: 4px 9px; cursor: inherit; }
.rmx-mr-uzorak.mr-v-tasteri .rmx-mr-stavka { padding: 3px 6px; }
.rmx-mr-uzorak .rmx-mr-ico,
.rmx-mr-uzorak .rmx-mr-ico svg { flex-basis: 11px; width: 11px; height: 11px; }
.rmx-mr-uzorak .rmx-mr-sep { margin: 2px 0; }
.rmx-mr-uzorak-iskljucen {
  display: flex;
  flex-direction: column;
  padding: 3px 0;
  background: #fff;
  border: 1px solid #c9ced5;
  border-radius: 4px;
  color: #3a424c;
  font-size: 11px;
}
.rmx-mr-uzorak-iskljucen span { padding: 3px 9px; }
.meni-boja-opcija > small { color: #666; font-size: 11px; line-height: 1.3; }
/* Red tabele kartice (bez izbora reda, <table data-meni-reda>) dok je njegov meni otvoren — boja izabranog reda (F3). */
.grid tr.rmx-mr-red > td { background: var(--rmx-row-izabran) !important; }

/* Gornji horizontalni meni (shell.meni = top). Tamni ton kao bocni meni (korisnik 2026-10-13, slika
   _tmp/predlog_gornji_meni.png; do tada svetla traka #e4e7eb i beli padajuci meni): traka #262d36, otvoren meni / hover
   narandzast tekst + crta, panel #1e242c, stavka pod misem = flyout bocnog menija (.app-side-flyout a:hover). */
.app-menu {
  flex-shrink: 0;
  background: var(--rmx-mpod-meni);
  border-bottom: 1px solid var(--rmx-mpod-crta);
  padding: 0 10px;
  display: flex;
  gap: 2px;
  min-height: 34px;
  align-items: stretch;
}

.app-menu-item {
  display: inline-flex;
  align-items: center;
  padding: 0 14px;
  color: var(--rmx-mpod-tekst-meni);
  text-decoration: none;
  border-bottom: 2px solid transparent;
  font-weight: 500;
  font-size: var(--rmx-menu-font-size);
}

.app-menu-item.active {
  background: transparent;
  border-bottom-color: #8a9ab0;
  color: var(--rmx-mpod-tekst-jak);
  font-weight: 600;
}

.app-menu-item:hover,
.app-menu-drop:hover > .app-menu-item,
.app-menu-drop:focus-within > .app-menu-item {
  background: var(--rmx-mpod-polje);
  border-bottom-color: var(--rmx-meni-crta);   /* boja menija, kao sklopljen bocni meni (korisnik 2026-10-13) */
  color: var(--rmx-meni-tekst);
  /* Podebljano pod misem (2026-10-13, „B“) — obrubom slova, ne font-weight: stavke stoje u redu i deblja slova bi
     pomerala susedne. Bocni meni / flyout / padajuci panel imaju pravi font-weight 600. */
  -webkit-text-stroke: 0.4px currentColor;
}

.app-menu-btn {
  border: 0;
  background: transparent;
  cursor: pointer;
  font: inherit;
  height: 100%;
}

.app-menu-drop {
  position: relative;
  display: flex;
  align-items: stretch;
}

.app-menu-panel {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 220px;
  background: var(--rmx-mpod);
  border: 1px solid var(--rmx-mpod-ivica);
  border-radius: 4px;
  box-shadow: 4px 6px 18px rgba(0, 0, 0, 0.45);
  z-index: 50;
  padding: 6px 0;
}

.app-menu-drop:hover .app-menu-panel,
.app-menu-drop:focus-within .app-menu-panel {
  display: block;
}

.app-menu-panel a {
  display: block;
  padding: 8px 14px;
  color: var(--rmx-mpod-tekst);
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
  font-size: var(--rmx-menu-font-size);
}

.app-menu-panel a.active {
  background: var(--rmx-mpod-izabrano);
  color: var(--rmx-mpod-tekst-jak);
}

/* Isto kao .app-side-flyout a:hover (Z3 zlatno, korisnik 2026-10-13) — menjati zajedno. */
.app-menu-panel a:hover,
.app-menu-panel a.active:hover,
.mbu-stavka.mbu-hover {
  background: var(--rmx-mpod-polje);
  color: var(--rmx-meni-tekst);
  box-shadow: inset 3px 0 0 var(--rmx-meni-crta);
}

.app-menu-panel a.active:hover { background: var(--rmx-mpod-izabrano); }

/* Naslovi grupa u padajucem meniju — isto kao flyout bocnog menija (zlatno #c8b788, Z5 2026-10-13). */
.app-menu-panel .app-menu-subhead {
  color: var(--rmx-meni-naslov);
  border-top-color: var(--rmx-mpod-ivica);
}

/* Bez sidebara: shell je samo kolona sadrzaja. */
.shell-mode-top .app-shell,
.shell-mode-plocice .app-shell {
  flex-direction: column;
}

.podesavanja-meni-opcije {
  display: flex;
  flex-direction: column;
  gap: 10px;
  max-width: 36rem;
}

.podesavanja-opcija {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 12px 14px;
  border: 1px solid var(--rmx-edge);
  border-radius: 4px;
  background: #fff;
  cursor: pointer;
}

.podesavanja-opcija:hover {
  background: #ffe8cc;
  border-color: #e0a35a;
}

.podesavanja-opcija input {
  margin-top: 4px;
}

.podesavanja-widget-red {
  align-items: center;
  cursor: default;
}

.podesavanja-widget-red > label:first-child {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  flex: 1;
  min-width: 0;
  cursor: pointer;
}

.podesavanja-widget-max {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
  cursor: default;
}

.podesavanja-widget-meta {
  display: flex;
  gap: 10px;
  flex-shrink: 0;
  align-items: flex-end;
}

.podesavanja-widget-boja input[type="color"] {
  width: 2.2rem;
  height: 1.85rem;
  padding: 1px 2px;
  border: 1px solid var(--rmx-edge);
  border-radius: 4px;
  background: #fff;
  cursor: pointer;
}

.podesavanja-widget-max > span {
  color: var(--rmx-muted);
}

.podesavanja-widget-max .form-input {
  margin-top: 0;
}

.podesavanja-opcija strong {
  display: block;
  margin-bottom: 2px;
}

.podesavanja-opcija small {
  display: block;
  color: var(--rmx-muted);
  font-size: 0.88rem;
  line-height: 1.35;
}

.podesavanja-velicine {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.podesavanja-velicina {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 2.8rem;
  padding: 8px 12px;
  border: 1px solid var(--rmx-edge);
  border-radius: 4px;
  background: #fff;
  cursor: pointer;
  font-weight: 650;
}

.podesavanja-velicina:hover {
  background: #ffe8cc;
  border-color: #e0a35a;
}

.podesavanja-velicina:has(input:checked) {
  border-color: var(--rmx-slate);
  background: #eceef1;
}

.podesavanja-velicina input {
  margin: 0;
}

.prikaz-preview {
  margin-top: 14px;
  padding: 12px 14px;
  border: 1px dashed var(--rmx-edge);
  border-radius: 4px;
  background: #fff;
}

.prikaz-preview-naslov {
  font-weight: 650;
  margin-bottom: 6px;
}

.prikaz-preview-tekst {
  margin: 0 0 10px;
}

.prikaz-preview .form-input {
  max-width: 16rem;
}

.prikaz-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  align-items: start;
}

.prikaz-levo .card-panel + .card-panel {
  margin-top: 14px;
}

.prikaz-desno .podesavanja-meni-opcije {
  max-width: none;
}

.prikaz-desno .card-panel + .card-panel {
  margin-top: 14px;
}

/* FIRMA — tab Firma u dve kolone + tabele (SQL 156, korisnik 2026-10-15 „ovo mi se dopada“ / „kreni“, slika
   _tmp/predlog_firma/predlog_tab_firma_v2.png): levo podaci po APR-u / adrese / kontakt / PDV, desno računi / zastupnici /
   članovi i kapital / ogranci / ostalo / folderi. Tabele child redova (.firma-tbl) — polja preko cele ćelije, × uklanja red.
   Markup Pages/Podesavanja/Firma.cshtml (data-panel="firma"); ispod 1200 px i na telefonu jedna kolona. */
/* Razmak kontejner ↔ kontejner 2 mm (pravilo svih kartica, ui_toolbar §7b; korisnik 2026-10-15: „čitaj pravila za razmak između
   ovih kontejnera, ne može ovako, izgleda kao nagurano“) — opšte pravilo .tura-tab-panel > .card-panel + .card-panel ne vidi
   kontejnere u kolonama, pa isto pravilo ovde (i između kolona 2 mm). */
.firma-kol { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 2mm; align-items: start; }
.firma-kol-strana { min-width: 0; }
.firma-kol-strana > .card-panel + .card-panel { margin-top: 2mm; }
@media (max-width: 1200px) { .firma-kol { grid-template-columns: minmax(0, 1fr); } }
.firma-tbl { width: 100%; border-collapse: collapse; }
.firma-tbl th { text-align: left; font-weight: 600; font-size: 0.92em; padding: 2px 4px; border-bottom: 1px solid var(--rmx-edge); }
.firma-tbl td { padding: 2px 4px 2px 0; vertical-align: middle; }
.firma-tbl th.num, .firma-tbl td.num { text-align: right; }
.firma-tbl .form-input { width: 100%; box-sizing: border-box; min-width: 0; }
.firma-tbl .form-input.num { text-align: right; }
.firma-tbl-pregled td { padding: 3px 6px; border-bottom: 1px solid #e6e9ec; }
.firma-tbl-x { width: 26px; }
.firma-tbl-posta { width: 80px; }
.firma-tbl-ukloni { border: 1px solid var(--rmx-polje-ivica, #bcc2c9); background: #fff; border-radius: 3px; width: 24px; height: 24px; line-height: 20px; padding: 0; cursor: pointer; color: #6b737c; }
.firma-racuna { color: #4b545d; white-space: nowrap; }
.firma-tbl-dodaj, .firma-tbl-razmak { margin-top: 6px; }
/* Taster Štampa podataka firme odvojen od linije tabova i manji font (korisnik 2026-10-15: „odlepi malo od te linije, ružno stoji
   i smanji font malo“). */
.firma-stampa-btn { margin-left: auto; align-self: center; margin-bottom: 5px; font-size: 0.88em; padding: 3px 10px; }
@media (max-width: 700px) { .firma-stampa-btn { margin-left: 0; } .firma-tbl { display: block; overflow-x: auto; } }

/* „?“ = objašnjenje na prelaz mišem (title) umesto pasusa ispod polja (korisnik 2026-10-14: „gomile teksta“). */
/* Podešavanja → Firma, tab SEF — preuzeto 1:1 iz RMX_Web site.css („firma-sef“, korisnik 2026-10-14), docs/plan_sef.md S1. */
.firma-sef .card-panel-body { padding: 10px 14px 12px; }
.firma-sef-naslov { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.firma-sef-oznaka {
  padding: 0 10px; border: 1px solid #e0b400; border-radius: 10px; background: #fff3c4; color: #3a2f00;
  font-size: 0.85em; font-weight: 600; white-space: nowrap;
}
.firma-sef-oznaka[hidden] { display: none; }
.firma-sef-red, .firma-sef-kljuc { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px 18px; }
.firma-sef-kljuc[hidden] { display: none; }
.firma-sef-polje { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
/* Labela = ista kao svaka labela kartice (Podešavanja → Prikaz „veličina labela“). */
.kartica-form .firma-sef-lab { font-size: var(--rmx-label-font-size, 10px); color: #4a5560; font-weight: 600; margin: 0; white-space: nowrap; }
.firma-sef-polje-kljuc .form-input { width: 300px; max-width: 100%; }
/* Upisan ključ „•••• …kraj“: belo polje (samo za čitanje, ali nije sivo „zaključano“ polje). */
.kartica-form .firma-sef-polje-kljuc .sef-kljuc-maska { background: #fff; color: var(--rmx-text); }
.firma-sef-stanje { min-height: 28px; display: inline-flex; align-items: center; color: #5b636d; }
.firma-sef-stanje.ok { color: #2e7d32; font-weight: 650; }
.firma-sef-stanje.greska { color: #b3261e; font-weight: 650; }
.firma-sef-polje-siroko { flex: 1 1 260px; }
.firma-sef .form-input-date { width: 125px; }

.pomoc-znak {
  display: inline-flex; align-items: center; justify-content: center; width: 1.3em; height: 1.3em; margin-left: 3px;
  border-radius: 50%; background: #d3d8de; color: #2a313a; font-size: 0.85em; font-weight: 700; cursor: help; vertical-align: 1px;
}
.sef-prekidac { display: inline-flex; border: 1px solid #5b636d; border-radius: 8px; overflow: hidden; height: 28px; }
.sef-prekidac button {
  /* font: inherit prvo (Prikaz: familija + veličina), pa debljina — inače shorthand poništi font-weight. */
  font: inherit; border: 0; padding: 0 16px; background: #fff; color: var(--rmx-text); font-weight: 600; cursor: pointer;
}
.sef-prekidac button + button { border-left: 1px solid #5b636d; }
.sef-prekidac button.on { background: #2a313a; color: #fff; }
/* Upisan ključ „•••• …kraj“: belo polje kao na slici (samo za čitanje, ali nije sivo „zaključano“ polje). */
.firma-sef-polje-kljuc .form-input[hidden], .sef-ukloni[hidden] { display: none; }
.sef-ukloni { display: inline-flex; align-items: center; gap: 4px; height: 28px; font-size: var(--rmx-font-size); }
.firma-faktura-primer {
  margin: 10px 0 0;
  font-size: calc(var(--rmx-font-size, 13px) + 2px);
}

.firma-faktura-primer strong {
  font-weight: 700;
}

@media (max-width: 900px) {
  .prikaz-layout {
    grid-template-columns: 1fr;
  }
}

.app-main {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 12px 14px 40px;
}

/* Pocetna — tabla za stikere (widgeti) */
body:has(.home-page) .app-main {
  display: flex;
  flex-direction: column;
}

.home-page {
  position: relative;
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.home-page-content {
  position: relative;
  z-index: 1;
}

.app-status {
  flex-shrink: 0;
  background: var(--rmx-mpod);
  border-top: 1px solid var(--rmx-mpod-crta);
  padding: 4px 14px;
  display: flex;
  justify-content: space-between;
  color: var(--rmx-mpod-tekst-status);
  font-size: var(--rmx-status-font-size, 11px);   /* = traka - 1 (UiIzgled.HtmlStyle) */
}

/* ========== PAGE / GRID ========== */

.page-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.page-title {
  margin: 0;
  font-size: var(--rmx-naslov-font-size, 18px);   /* Prikaz → Naslov strane (2026-10-24) */
  font-weight: 650;
  color: var(--rmx-charcoal);
}

.page-note {
  margin: 0;
  color: var(--rmx-muted);
  font-size: var(--rmx-opis-font-size, 12px);   /* Prikaz → opis ispod naslova */
}

/* Ture/Kartica zaglavlje: identifikacija ture (broj/vozilo/vozac/datum) na sredini,
   naslov levo i "Nazad na listu" desno ostaju gde su bili. */
.toolbar {
  background: var(--rmx-panel);
  border: 1px solid var(--rmx-edge);
  border-radius: var(--rmx-radius-panel);
  padding: 8px 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-bottom: 10px;
  position: relative;
  overflow: visible;
}

.toolbar input[type="text"] {
  height: 28px;
  min-width: 220px;
  padding: 2px 8px;
  border-radius: var(--rmx-radius-panel);
}

/* Overlay datuma (ui.datum) nije polje Pretrage — ne sme 220px. */
.toolbar input[type="text"].rmx-date-prikaz {
  min-width: 0;
}

/* Tasteri nasleđuju pismo i veličinu iz Prikaza (html/body: --rmx-font-family / --rmx-font-size, UiIzgled.HtmlStyle).
   Bez ovoga <button> uzima font browsera (~13,33px Arial), a <a> isti taster nasleđuje body — različit font u traci
   (korisnik 2026-10-16: tasteri u traci različit font, SEF ulazne „Preuzmi sa SEF-a“ / „Poveži sa knjigom“).
   :where = specifičnost 0: debljina 600 iz .btn-*-rmx ispod i posebne veličine (.firma-stampa-btn, telefon, kartice) ostaju. */
:where(.btn-primary-rmx, .btn-secondary-rmx, .btn-danger-rmx) {
  font: inherit;
}

.btn-primary-rmx {
  height: 28px;
  padding: 0 14px;
  border: 1px solid #2f6e3a;
  border-radius: var(--rmx-radius-panel);
  background: linear-gradient(180deg, #55a862 0%, var(--rmx-green) 100%);
  color: #fff;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.btn-primary-rmx:hover { background: var(--rmx-green-hover); }

/* Spojeni tasteri iste radnje (korisnik 2026-11-01: „posto je i jedno i drugo snimi ima logike da bude spojeno“ → „veoma blago
   razdvojeno“ → „kao sa ovom belom crtom ali ravno“, PNG docs/predlozi/predlog_snimi_blago.png varijanta B): par zelenih tastera,
   razmak 2 px (bela crta), unutrašnji uglovi ravni. Sada: Snimi | Snimi i zatvori na kartici izvoda (Pages/Izvodi/Kartica.cshtml,
   ui_toolbar.md §7). Visina / boja = .btn-primary-rmx. */
.btn-spojeno { display: inline-flex; gap: 2px; }
.btn-spojeno > .btn-primary-rmx:first-child { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.btn-spojeno > .btn-primary-rmx + .btn-primary-rmx { border-top-left-radius: 0; border-bottom-left-radius: 0; }

.btn-secondary-rmx {
  height: 28px;
  padding: 0 12px;
  /* Podloga / ivica tastera = BOJA TRAKA (2026-10-14, korisnik: „treba kontrast na tasterima“) — Grafit isto kao ranije. */
  border: 1px solid var(--rmx-taster-ivica);
  border-radius: var(--rmx-radius-panel);
  background: var(--rmx-taster);
  color: var(--rmx-text);
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.btn-secondary-rmx[hidden] {
  display: none !important;
}

/* Tasteri UNUTAR kontejnera kartice (Odaberi fajl, Dodaj plaćanje, Kartica…, Dodaj red, + Dokument / Servis / Oprema, QR…) = 24px na
   svim karticama, PC (korisnik 2026-10-30: „jednake visine u celom programu“ → „samo ovi … ne svi“ → „Sve kartice“, izbor 24px, polje
   ostaje 28px). NE dira: traku gore (toolbar), Snimi / Odustani (.kartica-actions je van .card-panel-body), „…“ pored polja
   (.btn-kurs-lookup = visina polja), telefon (min-height 40px u @media max-width 700px). :is(#…) daje specifičnost id-a — jače od
   26px pravila Naloga / Angažovanog (#nalog-kartica-form / #angazovaniForm … .btn-secondary-rmx, ~red 4407 / 4458 / 4610).
   Proširenje 2026-10-30 („može sve“): svaki kontejner .card-panel-body, ne samo .kartica-form — i Admin → Uvoz, Poslovna godina,
   Službena putovanja (lista), Ture → Dokumenti. Vozački deo 40px ostaje (ui_toolbar.md §1 „Visina“). */
@media (min-width: 701px) {
  :is(#nalog-kartica-form .card-panel-body, #angazovaniForm .card-panel-body, .card-panel-body) :is(.btn-primary-rmx, .btn-secondary-rmx, .btn-danger-rmx):not(.btn-kurs-lookup) {
    height: 24px;
    padding: 0 8px;
    font-size: calc(var(--rmx-font-size) - 1px);
    gap: 4px;
  }
  :is(#nalog-kartica-form .card-panel-body, #angazovaniForm .card-panel-body, .card-panel-body) :is(.btn-primary-rmx, .btn-secondary-rmx, .btn-danger-rmx):not(.btn-kurs-lookup) .btn-ico {
    width: 12px;
    height: 12px;
  }
}

/* Podrazumevani hover za sive tastere — blago zuto/narandzasto. */
.btn-secondary-rmx:hover,
.btn-hover-izmena:hover,
.home-tile:hover,
.home-tile-active:hover,
.btn-back:hover {
  background: #ffe8cc;
  border-color: #e0a35a;
  color: #8a4b00;
}

/* Toolbar specijalne boje (jaci prioritet od podrazumevanog narandzastog). */
.btn-hover-novi:hover {
  background: #d7efdc;
  border-color: #7eb888;
  color: #1f5c2a;
}

/* .btn-hover-izmena:hover = podrazumevani hover sivih tastera (gore, .btn-secondary-rmx:hover). */

.btn-hover-brisi:hover {
  background: #f6d4cf;
  border-color: #d08a80;
  color: #8a2a20;
}

.btn-hover-stampa:hover,
.btn-icon-rmx.btn-hover-stampa:hover {
  background: #d6e6f7;
  border-color: #7aa3d4;
  color: #1a4a7a;
}

/* Akcije koje zavise od izabranog reda — sakrivene dok nema izbora. */
.toolbar-when-selected {
  display: none;
  align-items: center;
  gap: 6px;
}

.toolbar-when-selected.is-visible {
  display: inline-flex;
}

/* Potvrda brisanja — default fokus na NE. */
.confirm-overlay {
  position: fixed;
  inset: 0;
  z-index: 80;
  background: rgba(20, 24, 28, 0.35);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}

.confirm-overlay[hidden] {
  display: none !important;
}

.confirm-box {
  width: min(420px, 100%);
  background: #f4f6f8;
  border: 1px solid var(--rmx-edge);
  border-radius: 3px;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.2);
  padding: 14px 16px 12px;
}

/* Brza beleska — isti okvir kao prijava: crna naslovna traka preko cele sirine, blago zaobljen. */
.confirm-title {
  font-weight: 700;
  color: var(--rmx-charcoal);
  margin-bottom: 8px;
}

/* Svi DA/NE i info dijalozi: ikonica programa levo od naslova (kao dijalog poruke RMX u _Layout). */
.confirm-box:not(.beleska-box) > .confirm-title:not(#rmxPorukaTitle) {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}
.confirm-box:not(.beleska-box) > .confirm-title:not(#rmxPorukaTitle)::before {
  content: "";
  flex: 0 0 32px;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: url("../favicon-48.png") center / contain no-repeat;
}

.confirm-text {
  margin: 0 0 14px;
  color: var(--rmx-text);
  line-height: 1.35;
}

.confirm-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

/* DA/NE koriste isti zuto/narandzasti hover kao ostali sivi tasteri. */
.confirm-actions #confirmBrisiNe:focus,
.confirm-actions #confirmDirtyNe:focus {
  outline: 2px solid #e0a35a;
  outline-offset: 1px;
}

/* Pregled stampe — ram na istoj stranici (iframe), ne novi tab. */
.print-overlay {
  position: fixed;
  inset: 0;
  z-index: 85;
  background: rgba(20, 24, 28, 0.4);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.print-overlay[hidden] {
  display: none !important;
}

.print-box {
  width: min(720px, 100%);
  height: min(86vh, 820px);
  background: #f4f6f8;
  border: 1px solid var(--rmx-edge);
  border-radius: 3px;
  box-shadow: 0 10px 32px rgba(0, 0, 0, 0.22);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.print-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 12px;
  border-bottom: 1px solid var(--rmx-edge);
  background: #e8eaed;
  flex-shrink: 0;
}

.print-title {
  font-weight: 700;
  color: var(--rmx-charcoal);
}

.print-actions {
  display: flex;
  gap: 8px;
}

/* Stampaj / Zatvori — isti narandzasti hover kao ostali sivi tasteri. */

/* Telu rama: iframe + wait overlay (Word PDF moze trajati ~10–15 s). */
.print-body {
  position: relative;
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: #fff;
}

.print-wait {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  background: #fff;
  color: var(--rmx-charcoal);
}

.print-wait[hidden] {
  display: none !important;
}

/* Isti spinner kao Formiram fakturu/nalog — u confirm overlay posle DA (SEF slanje/provera). */
.confirm-overlay > .print-wait {
  position: relative;
  inset: auto;
  background: #f4f6f8;
  border: 1px solid var(--rmx-edge);
  border-radius: 3px;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.2);
  padding: 28px 32px;
  min-width: 240px;
}

.print-wait-spin {
  width: 36px;
  height: 36px;
  border: 3px solid #d0d5db;
  border-top-color: #e0a35a;
  border-radius: 50%;
  animation: rmx-print-spin 0.8s linear infinite;
}

.print-wait-text {
  font-size: 1rem;
  font-weight: 600;
}

@keyframes rmx-print-spin {
  to { transform: rotate(360deg); }
}

.print-frame {
  flex: 1;
  width: 100%;
  border: 0;
  background: #fff;
  /* Faktura A4 je fiksna 210mm — skrol u ramu, ne stiskaj HTML (stampa = pregled). */
  overflow: auto;
}

.btn-danger-rmx {
  height: 28px;
  padding: 0 12px;
  border: 1px solid #8e2a20;
  border-radius: var(--rmx-radius-panel);
  background: linear-gradient(180deg, #d45648 0%, var(--rmx-red) 100%);
  color: #fff;
  font-weight: 600;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

/* Mala SVG ikona pored naziva na tasteru (currentColor = boja teksta). */
.btn-ico {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  display: block;
}

.btn-danger-rmx:hover { background: var(--rmx-red-hover); }

.toolbar-search {
  display: flex;
  gap: 6px;
  align-items: center;
  margin-left: auto;
  /* toolbar gap 8px + ovo ≈ 4 mm ispred ▲/▼ */
  margin-right: calc(4mm - 8px);
  position: static;
  z-index: 2;
}

/* Filter pored pretrage (default ukljucen): /Dokumenti, /Rokovnik, /Vozila (2026-10-23). */
.toolbar-samo-aktivni {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-right: 4px;
  white-space: nowrap;
  cursor: pointer;
  font-weight: 600;
  user-select: none;
}

.toolbar-samo-aktivni input {
  margin: 0;
  cursor: pointer;
}

/* ▲ ▼ osveži download — skroz desno. Kad ima pretragu, ona je odmah levo (ne auto). */
.toolbar-desno {
  display: flex;
  gap: 6px;
  align-items: center;
  margin-left: auto;
  flex-shrink: 0;
  z-index: 3;
}

.toolbar:has(.toolbar-search) .toolbar-desno {
  margin-left: 0;
}

/* Pretraga: X unutar polja za ponistavanje. */
.search-field {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.search-field #txtPretraga {
  padding-right: 26px;
  min-width: 200px;
}

.search-clear {
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  padding: 0;
  border: 0;
  border-radius: 3px;
  background: transparent;
  color: #6b7280;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.search-clear[hidden] {
  display: none !important;
}

/* Samo strelice — vrh / dno liste. */
.btn-icon-rmx {
  width: 28px;
  height: 28px;
  padding: 0;
  border: 1px solid var(--rmx-taster-ivica); /* = .btn-secondary-rmx, BOJA TRAKA (2026-10-14) */
  border-radius: var(--rmx-radius-panel);
  background: var(--rmx-taster);
  color: var(--rmx-charcoal);
  font-size: calc(var(--rmx-font-size) - 1px);
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* IZUZETAK (provera_dupliranja): isti blok kao .btn-secondary-rmx:hover, ali MORA ostati ovde, posle .btn-hover-novi / -brisi
   :hover — ikonica sa tim klasama (RMX_Web) je pod mišem narandžasta; spojeno gore bi postala zelena / crvena. */
.btn-icon-rmx:hover {
  background: #ffe8cc;
  border-color: #e0a35a;
  color: #8a4b00;
}

/* Izvoz liste — ikonica pored ▲/▼; hover plavo (.btn-icon-rmx.btn-hover-stampa:hover u pravilu .btn-hover-stampa:hover gore —
   jača klasa, pa pobeđuje .btn-icon-rmx:hover bez obzira na redosled). */

.izvoz-wrap {
  position: relative;
  display: inline-flex;
}

.izvoz-menu {
  display: none;
  position: absolute;
  top: 100%;
  right: 0;
  left: auto;
  z-index: 40;
  margin-top: 4px;
  min-width: 140px;
  padding: 6px;
  background: #fff;
  border: 1px solid var(--rmx-edge);
  border-radius: var(--rmx-radius-panel);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12);
}

.izvoz-menu.is-open {
  display: block;
}

.izvoz-menu button {
  display: block;
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
  padding: 6px 10px;
  font: inherit;
  font-weight: 600;
  color: var(--rmx-text);
  cursor: pointer;
  border-radius: 2px;
}

.izvoz-menu button:hover {
  background: #ffe8cc;
  color: #8a4b00;
}

.izvoz-print-box {
  width: min(1100px, 100%);
  height: min(92vh, 1100px);
}

.search-clear:hover {
  background: #ffe8cc;
  color: #8a4b00;
}

.grid-scroll {
  max-height: min(52vh, 520px);
  overflow: auto;
}

/* Partneri: ne skroluje cela stranica — gornji panel ostaje, skrola samo tabela. */
body:has(.partneri-page) {
  overflow: hidden;
  height: 100vh;
}

body:has(.partneri-page) .app-body {
  height: 100vh;
  overflow: hidden;
}

/* IZUZETAK (provera_dupliranja): okvir LISTE (body:has(.partneri-page) …, .partneri-page) i okvir KARTICE (body:has(.kartica-page) …,
   .kartica-page, niže) imaju danas iste vrednosti, ali su dva obrasca RMX_Web (ui_toolbar.md §5 lista, §7 kartica) koji se
   menjaju odvojeno (npr. telefon) — ne spajati. */
body:has(.partneri-page) .app-shell,
body:has(.partneri-page) .app-content {
  flex: 1;
  min-height: 0;
  overflow: hidden;
}

body:has(.partneri-page) .app-main {
  flex: 1;
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  padding-bottom: 8px;
}

.partneri-page {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  overflow: hidden;
}

.partneri-page-top {
  flex-shrink: 0;
}

.partneri-page-top .toolbar {
  margin-bottom: 0;
}

.partneri-page .grid-scroll {
  flex: 1 1 auto;
  min-height: 120px;
  max-height: none;
  overflow: auto;
}

.partneri-page .grid-scroll thead th {
  position: sticky;
  top: 0;
  z-index: 2;
}

.partneri-page-bottom {
  flex-shrink: 0;
}

/* Izvestaj vozaca — filter traka + zbirovi (Excel Izvestaj_Vozaca). */
.izvestaj-filter {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 10px 14px;
  margin: 8px 0;
}

.izvestaj-label {
  display: flex;
  flex-direction: column;
  gap: 3px;
  font-size: calc(var(--rmx-font-size) - 1px);
  color: var(--rmx-muted);
}

.izvestaj-label .form-input {
  min-width: 11rem;
}

.izvestaj-label .form-input-date,
.izvestaj-label .rmx-date-wrap {
  width: 9rem;
  min-width: 9rem;
  max-width: 9rem;
}

.izvestaj-label .rmx-date-prikaz {
  min-width: 0;
  width: 100%;
}

/* /Sluzbena: Novi + Period od/do + Prikazi u jednom redu, isti nivo (label pored polja). */
.toolbar-levo-red {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

/* Izvestaj kamiona: servisi kamiona / prikolice jedan pored drugog (Excel Izvestaj_Kamiona R..X, korisnik 2026-09-27). */
.izvestaj-sum {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
  align-items: baseline;
  padding: 8px 10px;
  margin: 0 0 6px;
  background: #eceff2;
  border: 1px solid var(--rmx-edge);
  border-radius: 4px;
  font-size: var(--rmx-font-size);
}

.izvestaj-sum-count {
  color: var(--rmx-muted);
}

/* Izvestaj Potrazivanja kupaca: kolona Broj sira (D-487-2026). */
.izv-potr-broj {
  min-width: 9rem;
}

/* Izvestaji Potrazivanja kupaca / Potrazivanja AP: polje Partner/Prevoznik sire. */
#kupacTypeahead,
#kupacTypeahead .form-input,
#prevoznikTypeahead,
#prevoznikTypeahead .form-input {
  width: 30rem;
  min-width: 30rem;
}

/* Isti izvestaji: red je bold kad ima dug (Dug > 1). */
.row-dug {
  font-weight: 650;
}

/* Lista /Ture: oznaka P uz broj ture sa privremenim troskovima (Pages/Ture/Index.cshtml, 2026-09-27). */
/* Vise izlazaka dodatnog vozaca = vise ikonica jedna do druge (korisnik 2026-09-29, Pages/Ture/Index.cshtml). */
.filter-hint {
  margin: 4px 0 0;
  font-size: calc(var(--rmx-font-size) - 1px);
  color: var(--rmx-muted);
  min-height: 1.2em;
}

/* Pregled odmah ispod izabranog reda. */
.partner-detail-row > td,
.uvoz-detail-row > td {
  padding: 0 !important;
  background: #eef1f4;
  border-bottom: 1px solid var(--rmx-edge);
}

.uvoz-opis {
  white-space: pre-wrap;
  line-height: 1.45;
  margin-top: 10px;
  max-width: 72rem;
}

.row-detail {
  padding: 10px 14px 8mm;
  background: linear-gradient(180deg, #f4f6f8 0%, #eef1f4 100%);
}

.row-detail-title {
  font-weight: 650;
  color: var(--rmx-charcoal);
  margin-bottom: 8px;
  font-size: var(--rmx-font-size);
}

/* =====================================================================================================
   PREGLED ISPOD REDA — PANELI (ODOBRENI OBRAZAC, korisnik 2026-11-03: „mi se dopadaju pregledi tipa“ RMX_Web Ulazni računi → SEF;
   slika docs/slike/uzor_pregled_paneli_RMX_Web_ulazni_2026-11-03.png, pravila_ui.md § Odobreni obrasci).
   U RMX_Web je ovo pisano na strani (Pages/UlazneFakture/Sef.cshtml <style>, .sef-pregled / .nalog-fld); ovde JEDNO mesto za sve
   preglede: sifarnik-lista.js opt.paneli pravi markup. Beli paneli na sivoj podlozi .row-detail, naslov dela, mali sivi natpis iznad,
   vrednost ispod sa tankom crtom, polja jedno pored drugog (prelamaju se); paneli sa istim `red` u 2 kolone (uži ekran = 1 kolona).
   Fiksne su samo bela podloga i svetle crte, kao bele površine u ostatku programa; veličine slova iz --rmx-* (Podešavanja → Prikaz).
   ===================================================================================================== */
.row-detail .pregled-paneli { display: flex; flex-direction: column; gap: 10px; }
.row-detail .pregled-red { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 12px; align-items: start; }
.row-detail .pregled-panel {
  background: #fff;
  border: 1px solid #e1e4e8;
  border-radius: 6px;
  padding: 8px 10px;
  min-width: 0;
}
.row-detail .pregled-deo { font-weight: 650; color: var(--rmx-charcoal); margin-bottom: 4px; }
.row-detail .pregled-polja { display: flex; flex-wrap: wrap; gap: 6px 8px; align-items: start; }
.row-detail .pregled-fld { display: flex; flex-direction: column; gap: 2px; min-width: 7.2rem; flex: 0 1 9rem; }
.row-detail .pregled-fld-wide { flex: 1 1 16rem; min-width: 12rem; }
.row-detail .pregled-fld-lab {
  font-size: var(--rmx-label-font-size, 10px);
  font-weight: 600;
  color: #4a5560;
  line-height: 1.15;
}
.row-detail .pregled-fld-val {
  border-bottom: 1px solid #f0f1f3;
  padding: 1px 0 3px;
  min-height: 18px;
  font-weight: 500;
  line-height: 1.35;
  color: var(--rmx-text);
  word-break: break-word;
}
.row-detail .pregled-fld-num .pregled-fld-val { font-variant-numeric: tabular-nums; }
@media (max-width: 900px) { .row-detail .pregled-red { grid-template-columns: 1fr; } }

/* IZUZETAK (korisnik 2026-11-03): stari pregled „natpis levo, vrednost desno“ (.preview-grid / .preview-row) samo za ekrane sa
   mnogo teksta (npr. kontni plan); svi ostali pregledi = PANELI iznad. */
.preview-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px 18px;
}

.preview-row {
  display: grid;
  grid-template-columns: 90px 1fr;
  gap: 8px;
  align-items: start;
}

/* Partneri pregled: duzi labeli (slanje postom). */
.partner-detail-row .preview-row {
  grid-template-columns: 11rem 1fr;
}

.uvoz-detail-row .preview-row {
  grid-template-columns: 5.5rem 1fr;
}

.preview-wide {
  grid-column: 1 / -1;
}

/* Dokumenti — donji pregled: tri kolone, desna = prikačeni fajlovi. (korisnik 2026-10-13) */
.dok-preview {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 6px 18px;
  align-items: start;
}
.dok-preview-red {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}
.dok-preview-fajl-lista { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; }
.dok-preview-fajl { color: var(--rmx-link); text-decoration: var(--rmx-link-podvlaka); }   /* Prikaz → Boja linka (2026-10-24) */
.dok-preview-fajl:hover { text-decoration: underline; }
@media (max-width: 1100px) {
  .dok-preview { grid-template-columns: 1fr; }
}

.preview-label {
  text-align: right;
  color: var(--rmx-muted);
  font-weight: 500;
}

.preview-val {
  color: var(--rmx-text);
  word-break: break-word;
}

.tura-preview .preview-row {
  grid-template-columns: 7.5rem 1fr;
}

@media (max-width: 800px) {
  .preview-grid { grid-template-columns: 1fr; }
}

/* Pregled ture ispod reda — read-only tabovi, diskretno (bez okvira). */
/* Jedan stupanj veći od tela liste (Prikaz: +1px). */
.row-detail:has(.tura-preview) .row-detail-title {
  font-size: calc(13px + 1px);
}

.tura-preview {
  margin-top: 2px;
  font-size: calc(1em + 1px);
}

.tura-preview .tura-tabs {
  margin-bottom: 6px;
  gap: 2px;
  border-bottom: none;
  padding-bottom: 0;
}

/* Diskretniji tabovi samo u pregledu (Kartica zadrzava pun stil). */
.tura-preview .tura-tab {
  border: none;
  background: transparent;
  color: var(--rmx-muted);
  padding: 4px 10px;
  font-size: calc(0.85rem + 1px);
  border-radius: 3px;
  box-shadow: none;
}

.tura-preview .tura-tab:hover {
  background: #ffe8cc;
  border-color: transparent;
  color: #222;
}

.tura-preview .tura-tab.active {
  background: transparent;
  border: none;
  box-shadow: inset 0 -2px 0 #555;
  color: var(--rmx-charcoal);
  font-weight: 650;
}

.tura-preview .tura-tab.active::after {
  display: none;
}

.tura-preview-badge {
  display: inline-block;
  min-width: 1.1em;
  padding: 0 5px;
  margin-left: 2px;
  border-radius: 8px;
  background: transparent;
  color: var(--rmx-muted);
  font-size: calc(0.75rem + 1px);
  font-weight: 650;
  line-height: 1.35;
  vertical-align: middle;
}

.tura-preview .tura-tab.active .tura-preview-badge {
  background: transparent;
  color: var(--rmx-charcoal);
}

.tura-preview-panel {
  display: none;
  max-height: min(42vh, 360px);
  overflow: auto;
  padding: 4px 0 2px;
  background: transparent;
  border: none;
  border-radius: 0;
}

.tura-preview-panel.active {
  display: block;
}

/* Tabela samo u pregledu (nema klasu .grid) — svetlo zaglavlje pomocne tabele (--rmx-podtabela-*, korisnik 2026-10-30
   „kao ova“ = SEF stavke; zajednicko pravilo za pomocne tabele u .grid / kartici / prozoru je posle .grid th). */
.tura-preview-table {
  width: 100%;
  border-collapse: collapse;
  font-size: calc(0.82rem + 1px);
  margin: 0;
  background: transparent;
}

.tura-preview-table th {
  text-align: left;
  background: var(--rmx-podtabela-vrh);
  color: var(--rmx-podtabela-tekst);
  border-bottom: 1px solid var(--rmx-podtabela-ivica);
  padding: 5px 8px;
  font-weight: 650;
  white-space: nowrap;
}

.tura-preview-table td {
  padding: 4px 8px;
  border-bottom: 1px solid #e4e7eb;
  white-space: nowrap;
  color: var(--rmx-text);
}
/* Pregled ture u listi, tab Gorivo (korisnik 2026-10-22): vreme sipanja uz datum, uska kolona Pun (✓) — Pages/Ture/Index.cshtml. */
.tura-preview-table .tura-preview-vreme { margin-left: 6px; color: var(--rmx-muted); font-variant-numeric: tabular-nums; }
.tura-preview-table td.tura-preview-uska { width: 1%; text-align: center; font-weight: 700; }

.tura-preview-table tbody tr:nth-child(even) {
  background: rgba(255, 255, 255, 0.55);
}

.tura-preview-table th.num,
.tura-preview-table td.num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.tura-preview-empty {
  margin: 10px 12px;
  color: var(--rmx-muted);
  font-style: italic;
  font-size: calc(0.9rem + 1px);
}

.tura-preview-hint {
  margin: 8px 2px 0;
  font-size: calc(0.78rem + 1px);
  color: var(--rmx-muted);
}

.toolbar a.btn-primary-rmx,
.toolbar a.btn-secondary-rmx {
  line-height: 1;
}

.alert-ok {
  background: #e8f5e9;
  border: 1px solid #a5d6a7;
  color: #1b5e20;
  padding: 8px 10px;
  border-radius: 3px;
  margin-bottom: 10px;
}

.hidden-form { display: none; }

.card-panel {
  background: #fff;
  border: 1px solid var(--rmx-edge);
  border-radius: var(--rmx-radius-panel);
  overflow: hidden;
  margin-bottom: 12px;
}

/* Crna traka naslova kontejnera: 3 px gore / dole na svim karticama (korisnik 2026-10-13 uvece: „naslovi kontejnera
   debeli … po visini smanjio“, slika predlog_naslov_kontejnera „B“; do tada 8 px, a Nalog / Angazovani / Isplata 5 px). */
.card-panel-title {
  padding: 3px 12px;
  background: linear-gradient(180deg, var(--rmx-traka-vrh) 0%, var(--rmx-traka) 100%);
  color: var(--rmx-traka-tekst);
  font-weight: 650;
  border-bottom: 1px solid var(--rmx-traka-crta);
}

[data-panel="dnevnice"] .btn-secondary-rmx {
  font-family: var(--rmx-font-family);
  font-size: var(--rmx-font-size);
}

/* Obracun dnevnica glavnog vozaca ispod tabele dnevnica (tab Dnevnice, Ture/Kartica #dnevObracun, 2026-09-26).
   Kolone Razlika i tabela poreza se vide samo kad je isplata iznad neoporezivog (klasa .ima-razliku iz JS). */
/* plavo kao Stampa/otvori (ui_toolbar hover) */
/* Carinjenje na glavnoj tacki (faza 6b, 2026-09-30): omotac .tacka-car je samo za JS (ponuda + veza) — redovi ostaju
   u istoj mrezi .form-grid kao pre (izbor + tekst jedno ispod drugog). */
/* Pretraga preko liste (rmx-select-pretraga.js, 2026-09-30): select skriven (ostaje u formi), polje pretrage zauzima
   njegovo mesto — u paru sa [+] / olovkom se siri kao ranije select. */
.rmx-sel-skriven {
  display: none !important;
}
.form-inline-pair > .rmx-sel-pretraga,
.angaz-izbor > .rmx-sel-pretraga {
  flex: 1 1 auto;
  min-width: 0;
}
.rmx-sel-pretraga .form-input {
  width: 100%;
  max-width: none;
}
/* form-input kao ostali izbori na kartici (Partner, Vrsta, Status) — ne form-select, koji nema stil (korisnik 2026-09-30:
   „nisu ista slova kao ostatak forme“). */
/* Opstina / region izmedju Mesta i Drzave (SQL 123, 2026-09-30). Red Posta | Mesto | Opstina | Drzava (korisnik
   2026-10-01: „posta malo kraca kao i mesto, region da se malo poveca, razmak u redu 1mm“): Mesto i Opstina dele ostatak
   pola-pola (bilo: Opstina 10rem, a u dve kolone stisnuta na 5rem dok je Mesto uzimalo sve), Posta 5.5rem, razmak 1mm.
   Drzava ostaje 11rem (poravnata sa Radno vreme / GPS / Telefon). Red = jedini .tacka-termin-red bez .tacka-red-80 u .tacka-polja-adr (_NalogTacka) — nalog i angazovani. */
.card-panel-body {
  padding: 14px 16px;
  background: #f7f8fa;
}

/* Fakture kartica: gore pola ekrana — levo Dokument + Iznosi + Vozilo, desno Kupac (ista visina). */
.faktura-glava {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 8px;
  align-items: stretch;
  margin-bottom: 8px;
}
.faktura-glava-levo,
.faktura-glava-desno {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}
.faktura-glava .card-panel {
  margin-bottom: 0;
}
.faktura-glava-desno > .card-panel {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.faktura-glava-desno .card-panel-body {
  flex: 1 1 auto;
}
/* SEF fajlovi (D) ispod panela Kupac u istoj desnoj koloni /Fakture/Kartica (korisnik 2026-10-06): visina po sadržaju,
   Kupac (pravilo iznad) puni ostatak kolone — isto kao I-faktura bez SEF panela. */
.faktura-glava-desno > .card-panel.faktura-sef-panel {
  flex: 0 0 auto;
}

/* Napomena za SEF i Napomena za plaćanje (korisnik 2026-10-06: „napomenu suzi i stavi u dva reda“): ista širina kao lista
   priloga (ne 100ch), samo 2 reda. Pages/Fakture/Kartica.cshtml u RMX_Web (textarea, maxlength 200). */
.kartica-form .faktura-glava-desno .form-row-wide > .faktura-sef-napomena,
.kartica-form .faktura-sef-napomena-row > .faktura-sef-napomena,
.kartica-form .faktura-napomena-placanja-row > .faktura-napomena-placanja {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  min-height: calc(2 * 1.35em + 0.65rem);
  height: calc(2 * 1.35em + 0.65rem);
  max-height: calc(2 * 1.35em + 0.65rem);
  resize: none;
}

/* Kupac (/Fakture/Kartica): red Partner, ispod tekst partnera | napomena, red adrese za poštu, linija, komentar (2026-10-06). */
.kartica-form .form-grid.faktura-kupac-grid {
  grid-template-columns: minmax(0, 1fr);
}
.faktura-kupac-partner-row {
  display: flex;
  gap: 2mm;
  align-items: center;
  max-width: 100%;
}
.faktura-kupac-partner-row .partner-typeahead {
  flex: 1 1 auto;
  min-width: 0;
  max-width: none;
}
.faktura-kupac-partner-row #btnKupacIzmena {
  flex: 0 0 auto;
  white-space: nowrap;
}
/* Podaci kupca kao TEKST, ne polja (korisnik 2026-10-06: „umesto u poljima … kao labels text … kao kod naloga podaci
   partnera“, da se skrati kontejner). Tekst = obrazac .nalog-partner-tekst sa /Nalozi/Kartica (stil na toj stranici:
   pre-line, line-height 1.35, --rmx-text; menjati zajedno). Razmak od reda Partner = gap reda (2 mm), zato margin 0.
   Levo tekst partnera, desno napomena partnera crveno + bold (kao ranije okvir Napomene); na uskom panelu napomena
   pada ispod (flex-wrap; zamena za raniji @media 1100px). Prazan blok se ne vidi. JS: Fakture/Kartica.cshtml kupacTekstRender. */
.faktura-kupac-body {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 2mm 4mm;
  grid-column: 1 / -1;
  min-width: 0;
}
.faktura-kupac-tekst,
.faktura-kupac-napomena-tekst {
  margin: 0;
  white-space: pre-line;
  line-height: 1.35;
  color: var(--rmx-text);
  min-width: 0;
  overflow-wrap: anywhere;
}
.faktura-kupac-body > .faktura-kupac-tekst { flex: 1 1 16rem; }
.faktura-kupac-body > .faktura-kupac-napomena-tekst {
  flex: 1 1 12rem;
  color: #c92a2a;   /* = ranija .faktura-kupac-napomena textarea (readonly): crveno + bold */
  font-weight: 700;
}
.faktura-kupac-tekst:empty,
.faktura-kupac-napomena-tekst:empty {
  display: none;
}
.faktura-kupac-sep {
  grid-column: 1 / -1;
  display: flex;
  justify-content: center;
  margin: 6px 0 4px;
  pointer-events: none;
}
.faktura-kupac-sep::before {
  content: "";
  width: 100%;
  border-top: 1px solid #d0d5db;
}
/* Adresa za slanje poštom: svoj red (.form-row-wide, labela iznad teksta), korisnik 2026-10-06; `hidden` kad partner nema
   adresu za poštu — .form-row ima display: grid, pa bez ovog pravila hidden ne bi sakrio red. */
.faktura-kupac-posta[hidden] {
  display: none;
}
.partner-typeahead-hit {
  display: flex;
  align-items: stretch;
  border-bottom: 1px solid #eceff2;
}
.partner-typeahead-hit .partner-typeahead-item {
  flex: 1 1 auto;
  min-width: 0;
}
.partner-typeahead-edit {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 0 10px;
  font: inherit;
  font-size: 0.85em;
  color: #555;
  text-decoration: none;
  border-left: 1px solid #eceff2;
  background: #f7f8fa;
}
.partner-typeahead-edit:hover,
.partner-typeahead-hit:hover .partner-typeahead-edit {
  background: #ff9a2e;
  color: #fff;
}
/* Vozilo | Vozac u jednom redu; 1fr mora posle max-content pravila za .form-grid. */
@media (max-width: 900px) {
  .faktura-glava {
    grid-template-columns: 1fr;
  }
}

.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 16px;
}

/* Fakture Dokument: 3 / 4 kolone u jednom redu. Na karticama kolone po sadrzaju (ne 1fr). */
.form-grid-3 {
  grid-template-columns: 1fr 1fr 1fr;
}

.form-grid-4 {
  grid-template-columns: max-content max-content max-content max-content;
  justify-content: start;
}

.form-grid-5 {
  grid-template-columns: max-content max-content max-content max-content max-content;
  justify-content: start;
}

.form-grid-3 .form-row,
.form-grid-4 .form-row,
.form-grid-5 .form-row {
  grid-template-columns: 88px 1fr;
}

.form-grid-gap-top {
  margin-top: 2mm;
}

.form-row {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 8px;
  align-items: center;
}

/* Atribut hidden mora da sakrije red i traku tabova (korisnik 2026-10-08: „ispravi i te dve stare greške“): display: grid
   iznad (i display: flex na .tura-tabs) gazio je HTML [hidden] — na /Dokumenti/Kartica „Novi dokument“ videli su se i red
   Zaposleni i red Vozilo (JS skriva jedan, Pages/Dokumenti/Kartica.cshtml), na /Dozvole/Kartica traka CEMT tabova
   (#cemtTabs) i kad dozvola nije CEMT. Jedno pravilo za sve stranice; !important = jace od pravila po stranici / telefona
   koja postavljaju display redu. Ranija pojedinacna ispravka istog: .tacka-red-80 > .form-row[hidden] i sl. */
.form-row[hidden],
.tura-tabs[hidden] {
  display: none !important;
}

.form-row-wide {
  grid-column: 1 / -1;
}

.form-row label {
  text-align: right;
  font-weight: 500;
}

/* Kartice (ceo program): label IZNAD polja — ne levo od polja.
   Obuhvata .kartica-form / .nalog-kartica-form / .tura-kartica-form / .card-form.
   Pravilo: AGENTS.md + docs/ui_toolbar.md §7. */
.kartica-form .form-grid,
.card-form .form-grid {
  gap: 2mm; /* razmak izmedju polja; ui_toolbar.md §7b */
  /* Sirina polja na karticama — docs/ui_toolbar.md §7b (ne razvlaciti): kolone po sadrzaju; -3 / -4 / -5 u bloku „Sirina polja“. */
  /* minmax(0, max-content): kolona je široka koliko sadržaj, ali se SUŽAVA kad je panel uži (npr. kartica u dve kolone —
     Podešavanja → Firma); ranije „max-content max-content“ je gurao polje od 80ch preko ivice panela (2026-11-03). */
  grid-template-columns: minmax(0, max-content) minmax(0, max-content);
  justify-content: start;
}
.kartica-form .form-row,
.card-form .form-row,
.kartica-form .form-grid-3 .form-row,
.card-form .form-grid-3 .form-row,
.kartica-form .form-grid-4 .form-row,
.card-form .form-grid-4 .form-row,
.kartica-form .form-grid-5 .form-row,
.card-form .form-grid-5 .form-row {
  /* minmax(0, 1fr) umesto 1fr: kolona reda sme ispod sirine polja, pa max-width 100% polja vazi i kad je panel
     uzi od polja (Surface; bez ovoga polje od 80ch gura red preko ivice). Na karticama sa kolonama po sadrzaju
     isto kao ranije (korisnik 2026-09-29; ui_toolbar.md §7e). */
  grid-template-columns: minmax(0, 1fr);
  min-width: 0;
  gap: 3px;
  align-items: stretch;
}
/* SVE KARTICE (korisnik 2026-10-13: „ovako treba da bude svuda“): isti vertikalni razmak kao Nalog / Angazovani gore —
   red polja ↔ red 1mm, labela ↔ polje 2px. Tab Isplata ture ima svoj .isplata-grid (gap 2mm 5mm) — red i tu 1mm.
   Samo PC (> 700 px, ista granica kao rmxJeTelefon) — telefon ima svoja pravila (blokovi „TELEFON — …“, skill rmx-telefon).
   Pravilo: AGENTS.md / ui_toolbar.md §7b. Vracanje = obrisati ovaj blok. */
@media (min-width: 701px) {
  :is(.kartica-form, .card-form) :is(.form-grid, [class*="form-grid-"]) {
    row-gap: 1mm;
  }
  :is(.kartica-form, .card-form) .form-row,
  :is(.kartica-form, .card-form) :is([class*="form-grid"], .isplata-grid) .form-row {
    gap: 2px;
  }
  /* Kontejneri jedan ispod drugog na tabovima kartice ture bili su spojeni (.tura-tab-panel .card-panel margin-bottom 0) —
     razmak 2mm kao kontejner ↔ kontejner ostalih kartica (korisnik 2026-10-13: „bar 1mm a ne nula“). */
  .tura-tab-panel > .card-panel + .card-panel,
  .isplata-levo > .card-panel + .card-panel {
    margin-top: 2mm;
  }
}
/* Labele svetlije na karticama naloga i angazovanog (korisnik 2026-10-01: „malo posvetli naslove polja“): #6b7580
   umesto opsteg #4a5560 (ostale kartice nepromenjene). */
/* Kartica naloga — jednaki razmaci (korisnik 2026-10-01: „razmak izmedju kontejnera 2mm, ne negde vise negde manje“ i
   „svuda izmedju polja u redu razmak 1mm“). Kontejneri: skrol kolona, red .faktura-glava i kolone levo / desno = 2mm
   (bilo: kolona 8px + margin reda 8px = 16px izmedju redova, 8px u redu). Dodatne tacke (#nalog-extra-*-lista,
   rmx-tacke-naloga.js ih puni) = display: contents, pa njihovi paneli dobijaju isti razmak kao glavna tacka. Polja u redu:
   column-gap 1mm (form-grid, redovi tacke, Partner | Kontakt, Broj, Iznosi, Vrsta + Odaberi fajl). Mora posle pravila iznad
   (.nalog-dok-unos / .form-grid-5 iste jacine). Kartica angazovanog (#angazovaniForm) isto (korisnik 2026-10-01 „uradi
   razmake na angazovanom“): + redovi Faktura prevoznika (.angaz-red, bilo 12px) i Vozilo | Komentar (.angaz-red-vozilo,
   5mm — izuzetak ispod) — pravila u <style> Angazovani/Kartica.cshtml su slabija (klasa). Kartica IOS-a (#frmIos, korisnik
   2026-11-02 „Da, po D“) isto. Ostale kartice (§7b 2mm) jos po starom. */
#frmIos .kartica-scroll {
  gap: 2mm;
}
#frmIos .faktura-glava {
  gap: 2mm;
  margin-bottom: 0;
}
#frmIos .faktura-glava-levo,
#frmIos .faktura-glava-desno {
  gap: 2mm;
}
#frmIos .form-grid {
  column-gap: 1mm;
}
/* Kartica IOS-a (korisnik 2026-11-02 „Da, po D“, _tmp/predlog_ios/D): dva reda polja u istom kontejneru (Vrsta | Partner, pa
   Stanje na dan | Primljen | Valuta) = red ↔ red 1 mm kao unutar reda (SVE KARTICE); Pages/Ios/Kartica.cshtml. */
#frmIos .card-panel-body > .form-grid + .form-grid {
  margin-top: 1mm;
}
.kartica-form .form-row label,
.card-form .form-row label {
  text-align: left;
  font-size: var(--rmx-label-font-size);
  font-weight: 600;
  color: #4a5560;
  line-height: 1.15;
}
/* Checkbox redovi: prazan label levo se sakriva; ostaje samo check-line. */
.kartica-form .form-row > label:empty,
.card-form .form-row > label:empty {
  display: none;
}
.kartica-form .form-row:has(.check-line),
.card-form .form-row:has(.check-line) {
  align-items: center;
}
.kartica-form .form-row .check-line,
.card-form .form-row .check-line {
  font-size: inherit;
  font-weight: 500;
  color: inherit;
}

.form-input {
  width: 100%;
  height: 28px;
  padding: 2px 8px;
  font: inherit;
}

/* ===== Sirina polja na karticama — docs/ui_toolbar.md §7b (ne razvlaciti). ===== */
/* .form-grid (dve kolone po sadrzaju) = pravilo „label IZNAD polja“ gore. */
.kartica-form .form-grid-3,
.card-form .form-grid-3 {
  grid-template-columns: repeat(3, max-content);
  justify-content: start;
}
.kartica-form .form-grid-4,
.card-form .form-grid-4 {
  grid-template-columns: repeat(4, max-content);
  justify-content: start;
}
.kartica-form .form-grid-5,
.card-form .form-grid-5 {
  grid-template-columns: repeat(5, max-content);
  justify-content: start;
}

/* Podrazumevano: obican tekst / select — max 16rem. */
.kartica-form .form-row:not(.form-row-wide) > .form-input,
.card-form .form-row:not(.form-row-wide) > .form-input {
  width: 16rem;
  max-width: 16rem;
}

/* Naziv firme / adresa: 80 karaktera (korisnik 2026-09-29; ranije 100), najvise 100% reda. Sirina OSTAJE fiksna
   (width 80ch): vecina kartica ima kolone po sadrzaju (max-content), pa bi „width: 100%“ skupio polje na ~160 px
   (incident isti dan, /PodaciNaloga/Kartica). Suzavanje u uskom panelu radi preko reda polja (minmax(0, 1fr) ispod). */
.kartica-form .form-row-wide > .form-input,
.card-form .form-row-wide > .form-input {
  width: calc(80ch + 1.15rem);
  max-width: 100%;
}

/* Datum: siroko koliko datum + kalendar. Jacina = kao default 16rem. */
.kartica-form .form-row:not(.form-row-wide) > input[type="date"],
.card-form .form-row:not(.form-row-wide) > input[type="date"],
.kartica-form .form-row:not(.form-row-wide) > .form-input-date,
.card-form .form-row:not(.form-row-wide) > .form-input-date,
.kartica-form .form-row:not(.form-row-wide) > .rmx-date-wrap,
.card-form .form-row:not(.form-row-wide) > .rmx-date-wrap {
  width: 11.6rem;
  max-width: 11.6rem;
}
/* Datum + vreme (datetime-local) — isto kao dnevnice; sire od samog datuma. */
.kartica-form .form-row:not(.form-row-wide) > input[type="datetime-local"],
.card-form .form-row:not(.form-row-wide) > input[type="datetime-local"],
.kartica-form .form-row:not(.form-row-wide) > .form-input-datetime,
.card-form .form-row:not(.form-row-wide) > .form-input-datetime {
  width: 16.5rem;
  max-width: 16.5rem;
}

/* Dana: 4 karaktera. */
.kartica-form .form-row:not(.form-row-wide) > .form-input-dana,
.card-form .form-row:not(.form-row-wide) > .form-input-dana,
#txtDana {
  width: calc(4ch + 0.9rem);
  max-width: calc(4ch + 0.9rem);
  padding-left: 6px;
  padding-right: 6px;
  text-align: right;
  font-variant-numeric: tabular-nums;
  -moz-appearance: textfield;
}
.form-input-dana::-webkit-outer-spin-button,
.form-input-dana::-webkit-inner-spin-button,
#txtDana::-webkit-outer-spin-button,
#txtDana::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Godina YYYY. */
.kartica-form .form-row:not(.form-row-wide) > .form-input-godina,
.kartica-form .form-row:not(.form-row-wide) > input[name$=".Godina"],
.card-form .form-row:not(.form-row-wide) > input[name$=".Godina"],
#txtGodina {
  width: calc(8ch + 1.1rem);
  max-width: calc(8ch + 1.1rem);
  -moz-appearance: textfield;
}
.form-input-godina::-webkit-outer-spin-button,
.form-input-godina::-webkit-inner-spin-button,
#txtGodina::-webkit-outer-spin-button,
#txtGodina::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Kratak broj dokumenta (npr. 448). */
.kartica-form .form-row:not(.form-row-wide) > .form-input-broj,
#txtBroj {
  width: calc(6ch + 1.1rem);
  max-width: calc(6ch + 1.1rem);
}

/* Knjiga ulaznih — kolona Registrator (korisnik 2026-10-27, PNG _tmp/predlog_registrator: „smanji širinu kolone da ne bude toliki
   razmak“): široka koliko sadržaj („N-161/26“), odmah posle R.B. Klasa iz Pages/UlazneFakture/Index.cshtml (th + td). */
#tblUlazne th.ulazne-registrator, #tblUlazne td.ulazne-registrator { width: 1%; white-space: nowrap; }
/* Knjiga ulaznih — kolona PDV mesec (korisnik 2026-10-27, PNG _tmp/predlog_pdv_mesec): uska („08/2026“), svetlo žuto = PDV mesec
   drugačiji od meseca datuma računa, sivo „van PDV“. Klase iz Pages/UlazneFakture/Index.cshtml (Data/PdvPeriod.cs DrugiMesec / VanPdv). */
#tblUlazne th.ulazne-pdvmes, #tblUlazne td.ulazne-pdvmes { width: 1%; white-space: nowrap; }
#tblUlazne td.ulazne-pdvmes { font-weight: 600; }
#tblUlazne td.ulazne-pdvmes-drugi { background: #fff1c2; }
#tblUlazne td.ulazne-pdvmes-van { font-weight: 400; color: var(--rmx-muted, #6b7280); }

/* Ulazni račun AP: R.B. = „N-166/26“ (SEF-089-AP, 2026-10-15) — polje šire samo za račun AP. OD 2026-10-27 SE NE KORISTI (AP ima
   R.B. programa, N-broj ture je kolona Registrator na listi) — ostaje dok se ne očisti CSS. */
.kartica-form .form-row:not(.form-row-wide) > .form-input-broj.ulazna-rb-ap {
  width: calc(9ch + 1.1rem);
  max-width: calc(9ch + 1.1rem);
}

/* Kratka vrsta D/I. */
.kartica-form .form-row:not(.form-row-wide) > .form-input-vrsta,
#selVrsta {
  width: 9.2rem;
  max-width: 9.2rem;
}

/* Postanski broj. */
.kartica-form .form-row:not(.form-row-wide) > .form-input-posta,
.kartica-form .form-row:not(.form-row-wide) > input[name$=".Posta"],
.kartica-form .form-row:not(.form-row-wide) > input[name$="Posta"],
.card-form .form-row:not(.form-row-wide) > input[name$=".Posta"],
.card-form .form-row:not(.form-row-wide) > input[name$="Posta"] {
  width: calc(8ch + 1.1rem);
  max-width: calc(10ch + 1.1rem);
}

/* PIB i MB / maticni: ista sirina, min 12 karaktera. */
.kartica-form .form-row:not(.form-row-wide) > .form-input-pib,
.kartica-form .form-row:not(.form-row-wide) > .form-input-mb,
.kartica-form .form-row:not(.form-row-wide) > input[name$=".Pib"],
.kartica-form .form-row:not(.form-row-wide) > input[name$="Pib"],
.kartica-form .form-row:not(.form-row-wide) > input[name$=".Mb"],
.kartica-form .form-row:not(.form-row-wide) > input[name$="KupacMb"],
.kartica-form .form-row:not(.form-row-wide) > input[name$="MaticniBroj"],
.card-form .form-row:not(.form-row-wide) > input[name$=".Pib"],
.card-form .form-row:not(.form-row-wide) > input[name$="Pib"],
.card-form .form-row:not(.form-row-wide) > input[name$=".Mb"],
.card-form .form-row:not(.form-row-wide) > input[name$="KupacMb"],
.card-form .form-row:not(.form-row-wide) > input[name$="MaticniBroj"] {
  width: calc(12ch + 1.15rem);
  min-width: calc(12ch + 1.15rem);
  max-width: calc(13ch + 1.15rem);
}

/* Decimalni broj u polju za UNOS = UVEK desno, u celom programu (kartice, tabele stavki, prozori) — ui_toolbar.md §10.
   Korisnik 2026-10-06 (stavke izvoda, Zaduzenje „7702.48“ levo): „decimalni iznosi su UVEK desno poredjani!!! koliko puta ovo
   trebam naglasavati???“ — pravilo je stajalo u uputstvu, a u CSS-u ga nije bilo, pa je svaka nova tabela ostajala levo.
   Novo polje sa decimalom = jedna od ovih oznaka (obicno form-input-iznos + inputmode="decimal"), ne poravnanje po stranici.
   Izuzetak sa jacim selektorom ostaje (.stavke-edit-table .stavka-kol centrirano na fakturi). */
input.form-input-iznos,
input.form-input-num,
input.form-kurs,
input[inputmode="decimal"],
input[step^="0."] {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

/* Iznos EUR/DIN — samo polja u .form-row, ne tabele stavki. */
.kartica-form .form-row:not(.form-row-wide) > .form-input-iznos,
.kartica-form .form-row:not(.form-row-wide) > input[name$="IznosEur"],
.kartica-form .form-row:not(.form-row-wide) > input[name$="IznosDin"],
.card-form .form-row:not(.form-row-wide) > input[name$="IznosEur"],
.card-form .form-row:not(.form-row-wide) > input[name$="IznosDin"] {
  width: 8.5rem;
  max-width: 8.5rem;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

/* Kurs: vise decimala, ne razvlacenje. */
.kartica-form .form-row:not(.form-row-wide) > .form-kurs,
.card-form .form-row:not(.form-row-wide) > .form-kurs {
  width: calc(14ch + 1.2rem);
  max-width: calc(14ch + 1.2rem);
  min-width: calc(12ch + 1.2rem);
}

/* Tabele stavki: sirina = kolona (ne §7b klase). */
.stavke-edit-table .form-input,
.tura-stavke-grid .form-input {
  width: 100%;
  max-width: none;
  min-width: 0;
}

/* Select + dugme (npr. sablon + Primeni) u istom redu. */
.form-inline-pair {
  display: flex;
  gap: 8px;
  align-items: center;
  width: 100%;
  min-width: 0;
}

.form-inline-pair .form-input {
  flex: 1 1 auto;
  min-width: 0;
}

.form-inline-pair .btn-secondary-rmx {
  flex: 0 0 auto;
  white-space: nowrap;
}

/* Lookup sifarnik (sablon naloga): polje + … → dijalog, ne dropdown preko forme. */
.lookup-box {
  width: min(720px, 100%);
  max-height: min(80vh, 640px);
  background: #f4f6f8;
  border: 1px solid var(--rmx-edge);
  border-radius: 3px;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.22);
  padding: 12px 14px 10px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.lookup-head {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

/* .lookup-search = pravilo .partner-typeahead-field (polje + ikonica u redu). */

.lookup-search .form-input {
  padding-right: 28px;
}

.lookup-search .search-clear {
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
}

.lookup-list {
  flex: 1 1 auto;
  min-height: 180px;
  max-height: 48vh;
  overflow-y: auto;
  background: #fff;
  border: 1px solid var(--rmx-edge);
  border-radius: 2px;
}

.lookup-row {
  display: block;
  width: 100%;
  border: 0;
  border-bottom: 1px solid #e8eaed;
  background: #fff;
  text-align: left;
  padding: 7px 10px;
  cursor: pointer;
  font: inherit;
  color: var(--rmx-text);
}

/* display:block gore gazi HTML [hidden] — bez ovoga filter ne sakriva redove. */
.lookup-row[hidden] {
  display: none !important;
}

.lookup-row:hover {
  background: #eef1f4;
}

.lookup-row.is-focus,
.lookup-row.is-selected.is-focus {
  background: #dde2e8;
}

.lookup-row.is-selected {
  background: #e8ecef;
}

.lookup-row-name {
  display: block;
  font-weight: 600;
  font-size: var(--rmx-font-size);
  line-height: 1.25;
}

.lookup-row-note {
  display: block;
  margin-top: 2px;
  font-size: calc(var(--rmx-font-size) - 2px);
  line-height: 1.3;
  color: var(--rmx-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Zakljucana sifra — vidi se, ne moze da se kuca.
   Jaciji selektor: globalni input[type=...] { background:#fff } inace pobedi. */
.form-input.form-input-locked,
input.form-input-locked,
input[type="text"].form-input-locked,
input[type="number"].form-input-locked,
textarea.form-input-locked {
  background: #e8eaed;
  color: var(--rmx-muted);
  cursor: default;
}

.form-textarea {
  height: auto;
  min-height: 72px;
  resize: vertical;
  padding: 6px 8px;
}

/* Interni komentar fakture — puno širina, veća visina, ispod Kupac/posta. */
.kartica-form .form-row.faktura-kupac-komentar {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  grid-column: 1 / -1;
  margin-top: 0;
}
.kartica-form .faktura-kupac-komentar > .form-textarea {
  width: 100%;
  max-width: 100%;
  min-height: 6.5rem;
  resize: vertical;
}

.check-line {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  text-align: left !important;
  font-weight: 600;
}

.card-actions {
  display: flex;
  gap: 8px;
}

@media (max-width: 800px) {
  .form-grid,
  .form-grid-3,
  .form-grid-4,
  .form-grid-5 { grid-template-columns: 1fr; }
  .toolbar-search {
    position: static;
    transform: none;
    width: 100%;
    justify-content: flex-start;
    margin-left: 0;
    margin-right: 0;
  }
}

.panel {
  background: #fff;
  border: 1px solid var(--rmx-edge);
  border-radius: var(--rmx-radius-panel);
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(0,0,0,0.06);
}

/* Fakture lista — donja tabela Stavke (nije .panel). */
.fakture-stavke-panel {
  border-radius: var(--rmx-radius-panel);
  overflow: hidden;
}

.grid {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--rmx-font-size);
}

.grid th {
  text-align: left;
  background: var(--rmx-traka-vrh);
  color: var(--rmx-traka-tekst);
  border-bottom: 1px solid var(--rmx-traka-dno);
  /* Nize zaglavlje kolona u celom programu (korisnik 2026-10-14, varijanta „C“): 7 → 3px gore / dole = 23,5 px, kao
     naslov kontejnera kartice (.card-panel-title 3px). Isto Board (.board-*-scroll, .board-rokovi-tabela), traka
     „Pregled“ (Fakture / Izvodi) i CEMT razduzenja (Dozvole/Kartica) — menjati zajedno. */
  padding: 3px 10px;
  font-weight: 600;
  white-space: nowrap;
}

/* ZAGLAVLJE POMOCNIH TABELA — jedno mesto za ceo program (korisnik 2026-10-30: „tabelice ispod 'pomocne' … zatamljenje
   zaglavlja svetlije … nego glavni kontejner“, izbor boje „kao ova“ = tabela „Stavke i iznosi (SEF)“ .sef-stavke).
   Boja = --rmx-podtabela-vrh / -ivica / -tekst (blok „BOJE PROGRAMA PO KORISNIKU“ gore, docs/ui_toolbar.md „Traka zaglavlja
   tabele u belom panelu pregleda“, „2b“ 2026-10-16). Pomocna = tabela u pregledu ispod reda (.tura-preview-table, i kad nosi
   .grid ili je red unutar tabele liste), .grid u kontejneru kartice (.card-panel-body) i u prozoru (.confirm-box, .lookup-box).
   Glavna lista strane (table.grid van .card-panel-body) ostaje tamna (.grid th, --rmx-traka-vrh).
   :is(#nalog-kartica-form …) daje specificnost id-a (isti trik kao „Tasteri UNUTAR kontejnera kartice“) — jace od .grid th i od
   id / sticky pravila po karticama (#tblRaspodela, .cemt-voznje-grid thead th, .izvod-kartica .stavke-edit-table thead th).
   Rucne boje po stranama (thStyle Ture / Partneri / Dobavljaci / Sluzbena / Vozila, Dozvole !important, #e3e7ec ulazni) uklonjene
   2026-10-30 — novu pomocnu tabelu ne bojiti posebno. */
.grid.tura-preview-table th,
.grid .tura-preview-table th,
:is(#nalog-kartica-form .card-panel-body, .card-panel-body, .confirm-box, .lookup-box) .grid th {
  background: var(--rmx-podtabela-vrh);
  color: var(--rmx-podtabela-tekst);
  border-bottom: 1px solid var(--rmx-podtabela-ivica);
}
.grid.tura-preview-table th,
.grid .tura-preview-table th { font-weight: 650; }
/* Sort naziv kolone (.th-sort ima boju trake — svetla slova na tamnim paletama) na svetlom zaglavlju pomocne tabele = tamna slova. */
:is(#nalog-kartica-form .card-panel-body, .card-panel-body, .confirm-box, .lookup-box) .grid th .th-sort,
:is(#nalog-kartica-form .card-panel-body, .card-panel-body, .confirm-box, .lookup-box) .grid th .th-sort:is(:hover, .active) {
  color: var(--rmx-podtabela-tekst);
}

/* Klik na naziv kolone — sort; zapamcen po korisniku. */
.th-sort {
  color: var(--rmx-traka-tekst); /* naziv kolone na traci zaglavlja — BOJA TRAKA (2026-10-14, Svetla: tamna slova) */
  text-decoration: none;
  display: inline-block;
  cursor: pointer;
}

.th-sort:hover {
  color: var(--rmx-traka-tekst-jak);
  text-decoration: underline;
}

.th-sort.active {
  color: var(--rmx-traka-tekst-jak);
}

/* Liste: ivica kolone = CSS (nema JS span na ulasku). */
.grid-scroll table.grid > thead > tr:first-child > th::after,
.board-ture-scroll table.grid > thead > tr:first-child > th::after,
.board-nalozi-scroll table.grid > thead > tr:first-child > th::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 6px;
  cursor: col-resize;
  z-index: 4;
}

.rmx-col-drop-before::before,
.rmx-col-drop-after::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 3px;
  background: #ff9a2e;
  z-index: 5;
  pointer-events: none;
}

.rmx-col-drop-before::before { left: 0; }
.rmx-col-drop-after::after { right: 0; }

table.grid thead th.rmx-col-dragging {
  opacity: 0.45;
}

table.grid.rmx-col-resizing {
  user-select: none;
}

table.grid thead th.rmx-col-resizing {
  cursor: col-resize;
}

body.rmx-col-noselect {
  user-select: none;
  cursor: col-resize;
}

.grid td {
  padding: 6px 10px;
  /* Linija ispod reda = podešavanje korisnika (blok „LINIJE U LISTAMA“ na vrhu, 2026-10-27); bez zapisa = --rmx-edge kao ranije. */
  border-bottom: 1px solid var(--rmx-lista-linija, var(--rmx-edge));
}

/* Kolona Mesto (8h) — GPS iz Almaksa (SQL 125, 2026-10-02): jedan red, pin = mapa. Pages/Tracking/Index.cshtml. */
.grid tbody tr:nth-child(even) { background: var(--rmx-row-alt); }
.grid tbody tr:hover { background: var(--rmx-row-sel); }
/* Faktura / račun iz Opisa stavke izvoda u Kartici kupca / dobavljača (taster pored olovke na izvodu, korisnik 2026-11-01,
   predlog_kartica_partnera_izvod.png; Data/KarticaOznaka.cs). Žuto = paleta stanja „pažnja“; posle :nth-child / :hover da ih nadjača. */
.grid tbody tr.kartica-oznacena, .grid tbody tr.kartica-oznacena:hover { background: var(--rmx-st-upoz-bg); font-weight: 600; }

/* Grupa-red: deli listu na sekcije — siva osnova; zlatna (.lista-grupa-zlatna, klik sklopi) je dole. Zaposleni i Vozila su
   od 2026-10-14 zlatne (korisnik: „grupe isto u boji“). */
.grid tbody tr.lista-grupa-red,
.grid tbody tr.lista-grupa-red:nth-child(even),
.grid tbody tr.lista-grupa-red:hover {
  background: var(--rmx-edge);
  cursor: default;
}
.grid tbody tr.lista-grupa-red td {
  font-weight: 650;
  padding: 4px 10px;
  color: #5b6570;
  border-top: 2px solid var(--rmx-edge);
  border-bottom: 1px solid var(--rmx-edge);
}
/* Zlatna traka — OPSTA (korisnik 2026-10-06: „boje zlatne treba koristiti ovde da to bude uniformisano“): trake po mesecu
   po mesecu (server ListaMeseci.cs, klik / pamcenje = sifarnik-lista.js RmxListaSekcije). Sekcija je dinamicka (mesec), pa se
   sklapanje ne pise po sekciji: klasa sklopljena na traci (▶) + u-sklopu na redovima te sekcije (sakriveni). Pretraga
   (inline style.display) je odvojena od u-sklopu. */
.grid tbody tr.lista-grupa-red.lista-grupa-zlatna,
.grid tbody tr.lista-grupa-red.lista-grupa-zlatna:nth-child(even),
.grid tbody tr.lista-grupa-red.lista-grupa-zlatna:hover { background: var(--rmx-grupa); cursor: pointer; }
/* Zlatne trake mirnije — slova jedan stupanj manja i tanja, traka niza (korisnik 2026-10-06: „za jedan stupanj manji font da
   ne bude ovoliko u prvom planu“). Siva traka (opste .lista-grupa-red bez zlatne) ostaje kao pre. Trougao je u em. */
.grid tbody tr.lista-grupa-red.lista-grupa-zlatna td {
  color: var(--rmx-grupa-tekst);
  border-top-color: var(--rmx-grupa-crta);
  border-bottom-color: var(--rmx-grupa-crta);
  font-size: calc(var(--rmx-font-size, 13px) - 1px);
  font-weight: 600;
  padding-top: 2px;
  padding-bottom: 2px;
}
/* ASCII escape (RMX_Web incident 2026-10-01 pokvaren bajt); \FE0E = tekst, ne emoji. */
.grid tbody tr.lista-grupa-red.lista-grupa-zlatna td::before {
  content: "\25BC";
  display: inline-block;
  width: 1.2em;
  font-size: 1.2em;
  line-height: 1;
  vertical-align: -0.1em;
}
.grid tbody tr.lista-grupa-red.lista-grupa-zlatna.sklopljena td::before { content: "\25B6\FE0E"; }
.grid tbody tr.lista-row.u-sklopu { display: none; }

.alert-soft {
  background: #fdecea;
  border: 1px solid #e0a8a1;
  color: #8a241c;
  padding: 8px 10px;
  border-radius: 3px;
  margin-bottom: 10px;
}

.empty-hint {
  margin: 0;
  padding: 16px 12px;
  color: var(--rmx-muted);
}

/* ========== POCETNA MENI ========== */

.home-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 12px;
}

.home-block {
  background: #fff;
  border: 1px solid var(--rmx-edge);
  border-radius: 3px;
  overflow: hidden;
}

.home-block-title {
  margin: 0;
  padding: 8px 12px;
  background: linear-gradient(180deg, var(--rmx-traka-vrh) 0%, var(--rmx-traka) 100%);
  color: var(--rmx-traka-tekst);
  font-size: var(--rmx-font-size);
  font-weight: 650;
  border-bottom: 1px solid var(--rmx-traka-crta);
}

.home-tiles {
  display: flex;
  flex-direction: column;
  padding: 6px;
  gap: 4px;
}

.home-tile {
  display: block;
  padding: 8px 10px;
  border: 1px solid var(--rmx-edge);
  border-radius: 3px;
  background: #f7f8fa;
  color: var(--rmx-text);
  text-decoration: none;
  font-weight: 500;
}

/* .home-tile:hover = podrazumevani hover sivih tastera (.btn-secondary-rmx:hover). */

.home-tile-active {
  background: #e8eaed;
  border-color: var(--rmx-slate);
  font-weight: 650;
}

.home-tile-soon {
  color: var(--rmx-muted);
}

/* POČETNA — rasporedi B „Stanje firme“ i C „Radni sto“ (Podešavanja → Početna; slike predlog_pocetna_B/C_2026-11-03.png, korisnik
   2026-11-03 odobrio rasporede). Samo raspored (kolone, razmak) — boje i slova dolaze od .panel / .grid / .home-* kao svuda.
   Pages/Index.cshtml i Pages/Shared/Pocetna/*. Uži prozor (≤ 900 px): B i C u jednoj koloni. */
.pocetna-mreza-kartice { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }   /* B: 5 kartica u redu */
.pocetna-mreza-b { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 12px; align-items: start; }
.pocetna-mreza-c { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2.3fr) minmax(0, 1fr); gap: 12px; align-items: start; }
/* Uska desna kolona C (Brzi pristup, Poslednje radnje): tabela ne sme da izađe iz panela — kolone po širini zaglavlja, dug tekst
   se prelama (korisnik 2026-11-03: „Poslednje radnje“ je izlazila desno). */
.pocetna-mreza-c > :last-child .grid { table-layout: fixed; }
.pocetna-mreza-c > :last-child .grid td { overflow-wrap: anywhere; }
/* Jedan deo Početne (lista ili blok pločica) — razmak do sledećeg dela u istoj koloni. */
.pocetna-deo { margin-bottom: 12px; }
/* „Brzi pristup“ u C: dve pločice u redu (A „Moduli“ ostaje .home-grid). */
.home-tiles.pocetna-mreza-plocice { display: grid; grid-template-columns: 1fr 1fr; }
/* Red stanja ispod naziva pločice („3 partnera“, „uskoro · F1“). */
.home-tile > .page-note { display: block; }
@media (max-width: 900px) {
  .pocetna-mreza-b,
  .pocetna-mreza-c { grid-template-columns: minmax(0, 1fr); }
}

.soon-panel {
  padding: 16px;
}

.soon-text {
  margin: 0 0 14px;
  line-height: 1.45;
}

.btn-back {
  display: inline-block;
  padding: 6px 12px;
  border: 1px solid var(--rmx-edge);
  border-radius: 3px;
  background: #e8eaed;
  color: var(--rmx-text);
  text-decoration: none;
  font-weight: 600;
}

/* .btn-back:hover = podrazumevani hover sivih tastera (.btn-secondary-rmx:hover). */

/* ========== KARTICA — izmena podataka (ceo program) ========== */
/* Gore: naslov (+ opciono fiksni panel). Sredina: skrol. Dole: Snimi/Odustani uvek vidljivi.
   Klase: .kartica-* (opste) | .nalog-kartica-* (Board) | .tura-kartica-* (Ture tabovi). */

body:has(.kartica-page) {
  overflow: hidden;
  height: 100vh;
}

body:has(.kartica-page) .app-body {
  height: 100vh;
  overflow: hidden;
}

/* IZUZETAK (provera_dupliranja): isti blok kao okvir liste (body:has(.partneri-page) …) — vidi tamo. */
body:has(.kartica-page) .app-shell,
body:has(.kartica-page) .app-content {
  flex: 1;
  min-height: 0;
  overflow: hidden;
}

body:has(.kartica-page) .app-main {
  flex: 1;
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  padding-bottom: 8px;
}

.kartica-page {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  overflow: hidden;
}

.kartica-top {
  flex-shrink: 0;
}

.kartica-top .page-head {
  margin-bottom: 4px;
}

.kartica-form {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  overflow: hidden;
  margin: 0;
}

/* Rokovi (korisnik 2026-10-06): samo prikaz; lista ima svoj skrol da ne podigne visinu reda iznad leve kolone.
   Bez .grid (globalni Izvoz / sirina kolona) — lagano zaglavlje kao pregled ture (.tura-preview-table).
   Isteklo = crveno (#b3261e kao ostale greske na kartici). Puni ga JS osveziRokove (OnGetRokoviAsync). */
/* Mesec u izvestajima (ture.mesec_obracuna, 2026-10-05) — sirina za „Septembar 2026“ + strelica (ui_toolbar §7b);
   10.5rem secao tekst, prosireno (korisnik 2026-10-05 „prosiri malo polje“). */
.kartica-fixed {
  flex-shrink: 0;
}

.kartica-fixed .card-panel {
  margin-bottom: 0;
}

.kartica-scroll {
  flex: 1 1 auto;
  min-height: 80px;
  overflow: auto;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-right: 2px;
}

.kartica-scroll .card-panel {
  margin-bottom: 0;
  flex-shrink: 0;
}

/* /Refakcija/Obracun — forma Zahtev je unutar .kartica-scroll posle tabela: .kartica-form (flex 1, min-height 0, overflow hidden)
   na PC-u dobija visinu 0 kad su tabele više od ekrana (od 2026-10-17 panel „Prethodna godina po vozilu“) — korisnik 2026-10-17:
   „nisam našao“. Isto pravilo kao telefon (blok „/Refakcija/Obracun“ u TELEFON delu). Samo ta forma (#zStatus). */
.kartica-actions {
  flex-shrink: 0;
  padding-top: 4px;
  border-top: 1px solid var(--rmx-edge);
}

/* ========== BOARD ========== */
/* Razdelnik gore / dole na Boardu (korisnik 2026-10-02 „kliknes i podesavas“): traka koja se vuce misem = visina gornje
   tabele; dupli klik = podrazumevano. JS + pamcenje po korisniku: Pages/Board/Index.cshtml (board.ture.visina).
   Mirno sivo, prelaz / vucenje = zuto-narandzasto kao ostali sivi tasteri (#ffe8cc, ui_toolbar). */
body.rmx-row-noselect {
  user-select: none;
  cursor: row-resize;
}


.grid th.num,
.grid td.num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.grid th.num .th-sort {
  display: block;
  width: 100%;
  text-align: right;
}

.row-click {
  cursor: pointer;
}

/* Transport liste: Aktivan = bold; loptica boja statusa pored radio / u Status koloni. */
.grid tr.row-status-aktivan > td {
  font-weight: 700;
}
/* Board gore (putni nalozi): red NIJE podebljan, samo Status (korisnik 2026-10-05: „ovde u tabeli Board Putni nalozi ne
   moraju da budu bold, to stavi da bold bude samo status“) — gore su ionako samo ture u radu. Dole nalozi i ostale liste
   nepromenjeno (pravilo iznad). */
.grid tr.row-status-otkazan > td {
  text-decoration: line-through;
  color: #666;
  opacity: 0.88;
}

.grid tr.row-status-otkazan > td.status-cell {
  text-decoration: none;
}

.status-cell {
  white-space: nowrap;
  vertical-align: middle;
  overflow: hidden;
  text-overflow: ellipsis;
}

.status-dot {
  display: inline-block;
  width: 0.62rem;
  height: 0.62rem;
  margin-right: 0.35rem;
  border-radius: 50%;
  vertical-align: middle;
  background: #adb5bd;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.18);
  flex-shrink: 0;
}

.status-dot-aktivan { background: #2f9e44; }
.status-dot-zavrsen { background: #868e96; }
.status-dot-neaktivan { background: #f08c00; }
/* Tura „Završena – čeka obračun“ (SQL 100, korisnik 2026-09-26): plava — vratila se, ceka obracun. StatusTure.Kljuc = ceka. */
.status-dot-ceka { background: #1c7ed6; }
.status-dot-otkazan { background: #c92a2a; }
/* Nalog „Istovaren“ (SQL 130, plan_status_tacke.md, korisnik 2026-10-05: „narandžasta tačkica uz status Istovaren“) —
   istovareno, ceka fakturu. Kljuc istovaren: Board statusKey, /Nalozi StatusKey + statusInner, sifarnik-lista.js. */
.status-dot-istovaren { background: #fd7e14; }
.status-dot-ostalo { background: #adb5bd; }

/* SEF liste: isti krug kao Ture/Board, malo veci. Boje (korisnik 2026-10-15: „nova … plavi krug kao što na SEF-u bude“,
   „prihvaćeno može da bude sivo da znamo da je završeno, a pregledano može da bude zeleno da znamo da nije prihvaćeno“):
   Nova = plava, Pregledano / Nova* = zelena, Prihvaćeno = siva. Ključ = SefClient.StatusDotKljuc i sifarnik-lista.js
   sefDotKey (menjati zajedno). */
.status-dot-sef {
  width: 0.72rem;
  height: 0.72rem;
}
.status-dot-sef-pregledano { background: #2f9e44; }
.status-dot-sef-prihvaceno { background: #adb5bd; }
.status-dot-sef-poslato { background: #228be6; }
.status-dot-sef-salje { background: #4dabf7; }
.status-dot-sef-odbijeno,
.status-dot-sef-greska { background: #e03131; }
.status-dot-sef-nova { background: #1c7ed6; }
.status-dot-sef-ostalo { background: #adb5bd; }

.status-cell .status-dot,
.sef-status-cell .status-dot {
  margin-right: 0.4rem;
}

.preview-val .status-dot {
  margin-top: -1px;
}

/* SEF Storno/Otkaz komentar u pregledu liste Fakture — samo ovde, ne na kartici. */
.preview-val .faktura-pregled-sef-komentar {
  color: #c62828;
  font-weight: 600;
}

.row-selected {
  background: var(--rmx-row-izabran) !important;
  cursor: pointer;
  font-weight: 600;
}

.grid tbody tr.lista-row.is-selected,
.grid tbody tr.lista-row.is-selected:hover {
  background: var(--rmx-row-izabran) !important;   /* sve liste, 2026-10-01 (bilo #fff3cc) */
}

/* Rokovnik koristi postojece NivoObavestenja pragove; nivo 90 je planski, ostali nivoi imaju svoje boje (korisnik 2026-09-28). */
#tblLista tbody tr[data-rok-nivo="90"] {
  --rokovnik-rok-boja: #ad8b00;
  --rokovnik-rok-podloga: #fff3bf;
  --rokovnik-rok-tekst: #6f5700;
}

#tblLista tbody tr[data-rok-nivo="isteklo"] {
  --rokovnik-rok-boja: #c92a2a;
  --rokovnik-rok-podloga: #ffe3e3;
  --rokovnik-rok-tekst: #8a1c1c;
}

#tblLista tbody tr[data-rok-nivo="7"] {
  --rokovnik-rok-boja: #e8590c;
  --rokovnik-rok-podloga: #fff0e6;
  --rokovnik-rok-tekst: #a63d00;
}

#tblLista tbody tr[data-rok-nivo="15"] {
  --rokovnik-rok-boja: #f08c00;
  --rokovnik-rok-podloga: #fff4d6;
  --rokovnik-rok-tekst: #9a5700;
}

#tblLista tbody tr[data-rok-nivo="30"] {
  --rokovnik-rok-boja: #d28a00;
  --rokovnik-rok-podloga: #fff8db;
  --rokovnik-rok-tekst: #765000;
}

/* Reseno nije nivo obavestenja ni bedz, ali zelena tacka ga odvaja od stavki koje traze akciju (korisnik 2026-09-28). */
/* data-stanje-kljuc = kljuc stanja (prikaz „Rešeno“ je velikim slovom, 2026-10-09). */
#tblLista tbody tr[data-stanje-kljuc="reseno"] {
  --rokovnik-rok-boja: #52b788;
}

/* Ivice se skroluju bez compositing traga; ne koristiti inset senku na grid redu (korisnik 2026-09-28). */
#tblLista tbody tr[data-rok-nivo]:not([data-rok-nivo=""]) > td:first-child {
  border-left: 3px solid var(--rokovnik-rok-boja);
}

/* Kartica Dokumenti: lista verzija — glavna = trenutna u roku */
.kartica-form .dok-verzija-grid tbody tr {
  cursor: pointer;
}
.kartica-form .dok-verzija-grid tbody tr.is-selected {
  background: var(--rmx-row-izabran);
}
.kartica-form .dok-verzija-grid tbody tr.dok-verzija-glavna td:first-child {
  font-weight: 600;
  box-shadow: inset 3px 0 0 #2d6a4f;
}
/* Status u jedan red (najduže „Istorija · početak nepoznat · glavna“). Fajl dobija ostatak, ne gazi status.
   (korisnik 2026-10-13) */
.kartica-form .dok-verzija-grid th:nth-child(7),
.kartica-form .dok-verzija-grid td[data-label="Status"] {
  white-space: nowrap;
  width: 1%;
}
.kartica-form .dok-verzija-fajl {
  width: 100%;
  min-width: 12rem;
  vertical-align: top;
}
/* Jedan isprekidani okvir oko fajlova i „Izaberi / prevuci“ (kao .tdok-dodaj na turi).
   Snimljeni fajlovi su .dok-fajl-lista, iznad tastera. (korisnik 2026-10-13) */
.kartica-form .dok-fajl-polje {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 4px;
  /* Do desne ivice panela Verzija (kolona Fajl je ostatak tabele). (korisnik 2026-10-13) */
  width: 100%;
  max-width: none;
  box-sizing: border-box;
  margin-top: 0;
  padding: 7px 10px;
  border: 1.5px dashed var(--rmx-green);
  border-radius: var(--rmx-radius-panel, 8px);
  background: #f4faf5;
}
.kartica-form .dok-fajl-polje .dok-fajl-lista {
  display: flex;
  flex-direction: column;
  gap: 2px;
  order: 1;
}
.kartica-form .dok-verzija-fajl a {
  display: inline-block;
  margin-right: 0.15rem;
}
.kartica-form .dok-verzija-fajl-jedan {
  display: inline-flex;
  align-items: center;
  gap: 0.1rem;
  margin-right: 0.45rem;
  vertical-align: middle;
}
.kartica-form label.dok-verzija-dodaj {
  display: inline-block;
  margin: 0;
  padding: 0.12rem 0.45rem;
  font-size: 0.85rem;
  cursor: pointer;
  border: 1px solid var(--rmx-edge);
  border-radius: 6px;
  background: #f3f4f6;
}
.kartica-form label.dok-verzija-dodaj input {
  display: none;
}

.row-click:hover {
  background: var(--rmx-row-sel);
}

/* ========== KARTICA TURE — tabovi (layout = .kartica-page iznad) ========== */

.tura-tabs {
  flex-shrink: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  border-bottom: 1px solid var(--rmx-edge);
  padding: 0 2px;
  margin-bottom: 8px;
}

.tura-tab {
  appearance: none;
  border: none;
  background: transparent;
  color: var(--rmx-muted);
  padding: 8px 16px;
  white-space: nowrap;
  font: inherit;
  font-family: var(--rmx-font-family);
  font-size: var(--rmx-font-size);
  cursor: pointer;
  border-radius: var(--rmx-radius-panel) var(--rmx-radius-panel) 0 0;
  position: relative;
  box-shadow: none;
}

.tura-tab:hover {
  background: #ffe8cc;
  color: #222;
}

.tura-tab.active {
  background: transparent;
  color: var(--rmx-charcoal);
  font-weight: 650;
  box-shadow: none;
}

.tura-tab.active::after {
  content: "";
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: -1px;
  height: 2px;
  background: var(--rmx-tamna);
  border-radius: 2px;
}

.tura-tab-panel {
  display: none;
  flex-direction: column;
  gap: 8px;
}

.tura-tab-panel.active {
  display: flex;
}

.tura-tab-panel .card-panel {
  margin-bottom: 0;
}

.card-panel-note {
  font-weight: 400;
  font-size: 0.78rem;
  color: var(--rmx-muted);
  margin-left: 8px;
}

.tura-stavke-grid {
  width: 100%;
  font-family: var(--rmx-font-family);
  font-size: var(--rmx-font-size);
}

.tura-stavke-grid th,
.tura-stavke-grid td {
  padding: 4px 4px;
  vertical-align: middle;
}

.tura-stavke-grid .form-input {
  width: 100%;
  min-width: 0;
  padding: 4px 6px;
  font: inherit;
  font-size: inherit;
  font-family: inherit;
}

.tura-stavke-grid input[type="datetime-local"]::-webkit-datetime-edit,
.tura-stavke-grid input[type="datetime-local"]::-webkit-datetime-edit-fields-wrapper,
.tura-stavke-grid input[type="datetime-local"]::-webkit-datetime-edit-text,
.tura-stavke-grid input[type="datetime-local"]::-webkit-datetime-edit-year-field,
.tura-stavke-grid input[type="datetime-local"]::-webkit-datetime-edit-month-field,
.tura-stavke-grid input[type="datetime-local"]::-webkit-datetime-edit-day-field,
.tura-stavke-grid input[type="datetime-local"]::-webkit-datetime-edit-hour-field,
.tura-stavke-grid input[type="datetime-local"]::-webkit-datetime-edit-minute-field {
  font: inherit;
  font-size: inherit;
  font-family: inherit;
  line-height: inherit;
}

.tura-stavke-grid .rb-cell {
  width: 28px;
  text-align: center;
  color: var(--rmx-muted);
}

/* Tab Troskovi: red Ukupno (EUR / RSD posebno + zbir u RSD). */
.tura-stavke-grid tfoot .tura-stavke-zbir td {
  font-weight: 650;
  border-top: 2px solid var(--rmx-edge);
  vertical-align: top;
}

/* Datum troska (Troskovi ture i panel Troskovi na nalogu). */
.tura-stavke-grid .td-check {
  text-align: center;
  width: 40px;
}

/* Troskovi "Priznat" (checkbox + select kome, samo kad tura ima dodatnog vozaca/dvojnu posadu). */
.tura-stavke-grid .td-priznato {
  width: auto;
  min-width: 40px;
  white-space: nowrap;
}
/* === Tabele za unos (.tura-stavke-grid) — sirina po VRSTI polja, fleksibilno (korisnik 2026-09-29) ===
   Svaki ekran: kolone su u procentima pa rastu/skupljaju se sa sirinom; najmanji podrzani ekran = Surface Pro 6/7
   (~1368 px, za sadrzaj ~1250 px) — min-width polja = citljivo tu. Tekst (Opis/Relacija/Napomena) nema procenat i
   uzima ostatak. Incident: Putarine na uzem ekranu — Iznos/Valuta skupljeni na 2 znaka, Kurs preveliki (polja bez
   sirine kolone). Pravilo vazi za sve tabele stavki; pojedinacna pravila po #id (npr. #tblKes) i dalje imaju prednost.
   Detalj: docs/ui_toolbar.md §7e. */
.tura-stavke-grid td:has(> input.form-input-num) { width: 8%; }
.tura-stavke-grid td:has(> input[type="date"]) { width: 9%; }
.tura-stavke-grid td:has(> input[type="datetime-local"]) { width: 12%; }
.tura-stavke-grid td:has(> select[name$=".Valuta"]) { width: 6%; }
.tura-stavke-grid input.form-input-num { min-width: 5.5rem; }
.tura-stavke-grid input.form-input-num.ptr-kurs,
.tura-stavke-grid input.form-kurs { min-width: 6.5rem; }
.tura-stavke-grid input[type="date"] { min-width: 8.8rem; }
.tura-stavke-grid input[type="datetime-local"] { min-width: 11.5rem; }
.tura-stavke-grid select[name$=".Valuta"] { min-width: 4.8rem; }
/* Datum u tabeli JS obavija u .rmx-date-wrap (prikaz po ui.datum) — isto pravilo kao gore za input[type=date],
   inace se kolona skupi na nulu (tab Gorivo: Datum / Dat. placanja „d…“) (korisnik 2026-09-29, Surface; ui_toolbar.md §7e). */
.tura-stavke-grid td:has(> .rmx-date-wrap) { width: 9%; }
.tura-stavke-grid .rmx-date-wrap { width: 100%; min-width: 8.8rem; }
/* Tab Isplata: km pocetak = km kraj prethodne ture istog kamiona, samo prikaz (korisnik 2026-10-22) — „= kraj N“ sitno u redu naziva,
   ne ispod polja (varijanta B: red ispod je pomerao susedna polja). */
.tura-stavke-actions {
  margin: 8px 0 0;
}

/* Brojcana polja — poravnanje desno (kartica ture i drugde gde se doda klasa). */
.form-input-num,
.form-kurs {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.tura-stavke-grid th.num {
  text-align: right;
}

/* Partneri — child tabele (Kontakti / Adrese / Aktivnosti). */
.partner-kontakti-title {
  display: flex;
  align-items: center;
  gap: 10px;
}

.partner-kontakti-title .btn-secondary-rmx {
  margin-left: auto;
  font-weight: 500;
}

.partner-kontakti-body {
  padding-top: 16px;
}

.partner-kontakti-grid.grid {
  width: 100%;
  font-size: calc(var(--rmx-font-size, 13px) + 2px);
}

.partner-kontakti-grid th,
.partner-kontakti-grid td {
  padding: 8px 12px;
  vertical-align: middle;
}

.partner-kontakti-aktivan {
  width: 5.5rem;
}

.partner-kontakti-akcije {
  width: 4.8rem;
  text-align: right;
  white-space: nowrap;
}

.partner-kontakti-akcije a {
  text-decoration: none;
  color: inherit;
}

.partner-kontakti-akcije .btn-icon-rmx {
  margin-left: 4px;
}

.partner-kontakti-body .empty-hint {
  margin: 12px 0 4px;
}

/* Kartica partnera: Sifra, PIB, Maticni broj i taster Provera na SEF u jednom redu. */
.kartica-form .partner-sef-red {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 2mm;
}
.kartica-form .partner-sef-red > .form-row > .form-input {
  width: 9rem;
  max-width: 9rem;
}
.kartica-form .partner-sef-red > .form-row:first-child > .form-input {
  width: 5rem;
  max-width: 5rem;
}

/* Tab Putni: Nalozi ove ture ide do donje linije (iznad Snimi/Odustani); tabela skroluje unutra. */
.tura-tab-panel.active[data-panel="putni"] {
  flex: 1 1 auto;
  min-height: 0;
}
/* Kartica partnera: izbor firme iz NBS registra (vise pogodaka). */
.kartica-form .nbs-lista {
  display: flex;
  flex-direction: column;
  gap: 2px;
  max-height: 14rem;
  overflow-y: auto;
  margin-top: 2px;
}
.kartica-form .nbs-lista .nbs-stavka {
  text-align: left;
  justify-content: flex-start;
  white-space: normal;
}
.kartica-form #sefPoruka,
.kartica-form #nbsPoruka,
.kartica-form .nbs-lista {
  max-width: 46rem;
}
.kartica-form .racuni-akcije {
  display: inline-flex;
  gap: 2mm;
}

/* Kurs NBS stiker: taster Preuzmi sa NBS ispod "Svi kursevi" */
.podesavanja-widget-red-wrap {
  flex-wrap: wrap;
}

.podesavanja-widget-dodatno {
  display: flex;
  flex: 0 0 100%;
  gap: 12px;
  align-items: flex-start;
  margin-top: 4px;
  padding-top: 10px;
  border-top: 1px solid var(--rmx-edge);
  cursor: pointer;
}

/* Tab Isplata: zaglavlje kontejnera = opste .card-panel-title 3 px (od 2026-10-13 uvece; ranije ovde 5 px). */
/* Zarada vozaca (tab Isplata): Opis + FTL/LTL | Osnova € | % | Zarada € po smeru (korisnik 2026-09-27).
   Vezano: Pages/Ture/Kartica.cshtml okvir Zarada vozaca, obracun.*_opis / *_utovar (SQL 103). */
/* Prva kolona 30rem (bila 22rem): sire polje opisa odlaska/povratka, ostala polja se samo pomeraju (korisnik 2026-09-27).
   Polje Bonusi / umanjenja € = sirina iznosa kao ostala polja, 10rem (korisnik 2026-09-27: „samo za iznos“). */
/* Lista Ture — pregled tab Putni: desno Realizacija (EUR), isti stil kao pregled (2026-09-24). */
.tura-preview-split {
  display: flex;
  gap: 24px;
  align-items: flex-start;
}
.tura-preview-split-main {
  flex: 1 1 auto;
  min-width: 0;
}
.tura-preview-real {
  flex: 0 0 300px;
  border-left: 1px solid var(--rmx-edge);
  padding-left: 16px;
}
.tura-preview-real-title {
  font-weight: 650;
  margin: 0 0 6px;
}
.preview-grid.preview-grid-1 {
  grid-template-columns: 1fr;
  gap: 4px;
}
.tura-preview-real .preview-row {
  grid-template-columns: 9rem 1fr;
}
.tura-preview-real-sum .preview-label,
.tura-preview-real-sum .preview-val {
  font-weight: 700;
  color: var(--rmx-text);
}
@media (max-width: 1000px) {
  .tura-preview-split { flex-direction: column; }
  .tura-preview-real { border-left: 0; padding-left: 0; flex-basis: auto; }
}

/* Bocni meni — izbor tastaturom (2026-09-25): isto kao hover (od 2026-10-13 zlatno — tamno polje, #ded3b4 + crta #c8b788). */
.app-sidebar .app-side-link:focus-visible,
.app-sidebar .app-side-summary:focus-visible,
.app-sidebar .app-side-sub a:focus-visible,
.app-side-flyout a:focus-visible {
  background: var(--rmx-mpod-polje);
  color: var(--rmx-meni-tekst);
  box-shadow: inset 3px 0 0 var(--rmx-meni-crta);
  font-weight: 600;   /* podebljano kao pod misem (2026-10-13, „B“) */
  outline: none;
}

/* Kartica — tab izabran tastaturom (2026-09-25): ista svetla boja kao hover taba (#ffe8cc), korisnik izabrao. */
button[data-tab]:focus-visible {
  outline: none;
  background: #ffe8cc;
  color: #222;
  border-radius: var(--rmx-radius-panel, 8px) var(--rmx-radius-panel, 8px) 0 0;
}
/* Dok je tab izabran tastaturom — hover misa na ostalim tabovima se ne vidi (samo jedna oznaka, korisnik 2026-09-25). */
*:has(> button[data-tab]:focus-visible) > .tura-tab:hover:not(:focus-visible) {
  background: transparent;
  color: var(--rmx-muted);
}
*:has(> button[data-tab]:focus-visible) > .tura-tab.active:hover:not(:focus-visible) {
  color: var(--rmx-charcoal);
}

/* Broj naloga + ID naloga (varijanta C, korisnik 2026-09-30): ID samo u izmeni, kao TEKST u posebnoj koloni; kutija iste
   visine kao polje (providna ivica + isti padding) pa labela i tekst stoje u liniji sa brojem. /Angazovani/Kartica link na
   /Nalozi/Kartica, /Nalozi/Kartica obican tekst. Varijanta A = isti ID u naslovu panela (.panel-title-id). */
.broj-id-par { display: flex; align-items: stretch; gap: 2mm; min-width: 0; }
/* Oba reda iste visine (stretch); drugi red = prostor polja, link centriran u njemu — labele u istoj liniji. */
.broj-id-par > .form-row { min-width: 0; grid-template-rows: auto 1fr; }
.broj-id-par > input.form-input { flex: 1 1 auto; min-width: 0; }
/* Ikonica „otvori“ (kvadrat sa strelicom) uz ID naloga — isti znak u naslovu panela i pored broja. */
.ico-otvori { width: 0.95em; height: 0.95em; flex: 0 0 auto; vertical-align: -0.1em; }
/* Prikaz → Boja linka (2026-10-24) */
.card-panel-title.panel-title-id { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; }
.card-panel-title .panel-id { font-weight: 400; font-size: 0.92em; color: var(--rmx-traka-tekst-miran); white-space: nowrap; }
.card-panel-title .panel-id a { color: var(--rmx-traka-link); text-decoration: underline; }
/* Hover na tamnom naslovu: svetlija narandzasta (korisnik 2026-09-30: #ff9a2e prejak na tamnoj traci). */
.card-panel-title .panel-id a:hover { color: var(--rmx-traka-link-hover); }

/* Prozor raspodele uplate kupca (Pages/Shared/_RaspodelaDlg.cshtml, wwwroot/js/rmx-raspodela.js — plan_uplate_placanja.md
   F2, 2026-10-05). Širi od DA/NE dijaloga (tabela faktura), visina do 92vh, tabela skroluje, zbir i tasteri uvek vidljivi. */
.confirm-box.rasp-box {
  width: min(1100px, 100%);
  max-height: 92vh;
  display: flex;
  flex-direction: column;
}
/* Prozor izveštaja probe uvoza (Pages/Posta/Index — „Uvoz iz programa Pošte“, 2026-11-02): širi od DA/NE, tekst probe skroluje,
   tasteri Upiši / Odustani uvek vidljivi. Isti obrazac kao .rasp-box. */
.confirm-box.uvoz-proba-box { width: min(900px, 100%); max-height: 92vh; display: flex; flex-direction: column; }
.confirm-box.uvoz-proba-box pre { flex: 1; min-height: 0; overflow: auto; white-space: pre-wrap; font-size: 12px; margin: 6px 0 10px;
  background: #fff; border: 1px solid var(--rmx-edge); border-radius: 3px; padding: 6px 8px; }
/* hidden mora da pobedi display: flex / grid blokova prozora (.rasp-nova, .rasp-glava, .rasp-filteri …) — bez ovoga se od
   2026-10-08 blok „nova uplata“ (Kupac / Valuta / Datum uplate) video i u prozoru stavke izvoda (korisnik 2026-10-30, slika). */
#raspDlg [hidden] { display: none !important; }
.rasp-glava {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2px 2mm;
  background: #e8eaed;
  border-radius: 6px;
  padding: 6px 10px;
  margin-bottom: 2mm;
  line-height: 1.35;
}
.rasp-lab {
  font-size: var(--rmx-label-font-size, 10px);
  font-weight: 600;
  color: #4a5560;
  margin-right: 4px;
}
.rasp-siv { color: var(--rmx-muted); }
.rasp-filteri {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1mm 3mm;
  margin-bottom: 2mm;
}
.rasp-filteri .check-line { margin: 0; }
.rasp-trazi-polje input { width: 16rem; }
.rasp-filteri-desno { margin-left: auto; display: flex; gap: 1mm; }
.rasp-upozorenje {
  background: #fff3cd;
  border: 1px solid #e0b400;
  border-radius: 6px;
  padding: 5px 10px;
  margin-bottom: 2mm;
  color: #5a4500;
}
.rasp-tabela-wrap {
  flex: 1 1 auto;
  min-height: 6rem;
  max-height: 52vh;
  overflow: auto;
  border: 1px solid var(--rmx-edge);
  border-radius: 6px;
  background: #fff;
}
.rasp-tabela { width: 100%; }
.rasp-tabela thead th { position: sticky; top: 0; z-index: 1; }
.rasp-tabela td { white-space: nowrap; }
.rasp-tabela .rasp-otvoreno { cursor: pointer; text-decoration: underline dotted; }
.rasp-tabela .rasp-otvoreno:hover { color: var(--rmx-link); }
.rasp-tabela .rasp-unos { width: 8.5rem; text-align: right; }
.rasp-tabela .rasp-unos.rasp-los { border-color: #c62828; background: #fdecea; }
/* Rasporedi i Provizija jedna uz drugu, razmak ~2 mm (korisnik 2026-10-30 „jedno pored drugog sa razmakom od 1-2mm“):
   kolone široke koliko polje (width 1% + nowrap), višak širine ide ostalim kolonama. Klase daje wwwroot/js/rmx-raspodela.js
   (ćelije) i Pages/Shared/_RaspodelaDlg.cshtml (naslovi). */
.rasp-tabela .rasp-kol-rasp, .rasp-tabela .rasp-kol-prov { width: 1%; }
.rasp-tabela td.rasp-kol-rasp, .rasp-tabela th.rasp-kol-rasp { padding-right: 1mm; }
.rasp-tabela td.rasp-kol-prov, .rasp-tabela th.rasp-kol-prov { padding-left: 1mm; }
.rasp-tabela tr.rasp-tudja td { background: #fff8e1; }
.rasp-zbir {
  display: flex;
  justify-content: flex-end;
  gap: 6mm;
  margin: 2mm 0;
}
.rasp-zbir .rasp-minus { color: #c62828; }
/* „Povraćaj“ u nazivu kolone prozora raspodele — isto crveno kao minus u zbiru (korisnik 2026-10-30 „da može koja se već
   koristi“, „može samo naslov kolone“). Klasu daje wwwroot/js/rmx-raspodela.js samo kad je stavka povraćaj.
   #raspTabela: opšte pravilo naslova u dijalogu (gore „Sort naziv kolone“, :is(#nalog-kartica-form …, .confirm-box …)) nosi
   ID iz :is() pa je bilo jače i naslov je ostao crn (ispravka 2026-10-31, korisnik „još stoji u crnoj boji“). */
#raspTabela.grid.rasp-tabela th .th-sort.rasp-povracaj { color: #c62828; }
/* Isti prozor, režim „nova uplata“ = uplata pre izvoda (plan_uplate_placanja.md §1.16, korisnik 2026-10-08): polja Kupac /
   Valuta / Datum uplate / Iznos / Napomena umesto glave stavke; labeli iznad polja (kartica §7), razmak 1 mm polje ↔ polje.
   Ispod glave stavke: uplate kupca koje čekaju izvod sa tasterom Poveži (.rasp-ceka). JS: wwwroot/js/rmx-raspodela.js. */
.rasp-nova {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 1mm;
  background: #e8eaed;
  border-radius: 6px;
  padding: 6px 10px;
  margin-bottom: 2mm;
}
.rasp-nova-polje { display: flex; flex-direction: column; }
.rasp-nova-polje label { font-size: var(--rmx-label-font-size, 10px); font-weight: 600; color: #4a5560; }
.rasp-nova-kupac { width: min(28rem, 100%); }
.rasp-nova-kupac .partner-typeahead { width: 100%; }
.rasp-nova-napomena { flex: 1 1 14rem; }
.rasp-nova-napomena input { width: 100%; }
.rasp-nova-kupac-txt { font-weight: 600; padding: 4px 0; }
.rasp-nova-hint { flex-basis: 100%; color: var(--rmx-muted); }
.rasp-ceka {
  background: #fff8e1;
  border: 1px solid #e0b400;
  border-radius: 6px;
  padding: 5px 10px;
  margin-bottom: 2mm;
}
.rasp-ceka table { width: 100%; }
/* Kontejner Plaćanja na /Fakture/Kartica i oznaka raspodele pored stavke na /Izvodi/Kartica (isti F2). */
/* Panel Plaćanje preko cele širine (korisnik 2026-10-06: „po širini celog ekrana … tabela floatuje dole ako je ekran manji“):
   kolona zauzima oba stupca .faktura-glava (SEF fajlovi D-fakture su od 2026-10-06 gore, ispod Kupca); u panelu levo polja,
   desno tabela uplata — kad okvir polja (širina po sadržaju) + 36rem tabele ne staju, tabela pada ispod i širi se
   (flex-wrap). Pages/Fakture/Kartica.cshtml. */
.faktura-glava > .faktura-placanje-kol { grid-column: 1 / -1; }
.faktura-placanje-telo { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 2mm 6mm; }
/* Polja u svom okviru (korisnik 2026-10-06: „stavi ovaj deo u podkvadratić kontejner“) — izgled kao .toolbar / paneli
   (ivica, krivina --rmx-radius-panel, unutrašnji razmak 2 mm); širina po sadržaju (dve kolone polja). */
.faktura-placanje-polja {
  flex: 0 0 auto;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  background: var(--rmx-panel);
  border: 1px solid var(--rmx-edge);
  border-radius: var(--rmx-radius-panel);
  padding: 2mm;
}
.faktura-placanje-polja .form-grid { margin: 0; }
.faktura-placanje-polja #fuExcel { margin-bottom: 0 !important; }
.faktura-placanje-uplate { flex: 1 1 36rem; min-width: 0; }
.faktura-uplate-zbir { display: flex; gap: 6mm; margin-bottom: 2mm; }
.faktura-uplate-zbir strong { font-weight: 650; }
.faktura-uplate-rucni { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 1mm; margin-top: 2mm; }
.faktura-uplate-rucni .form-row { margin: 0; }
/* Ikonica Raspodela pored × na /Izvodi/Kartica (jedan red, ne širi kolonu): siva = nije, narandžasta = deo, zelena = sve. */
/* Raspodela i × u istoj liniji (korisnik 2026-10-09: „nisu u liniji“): inline-flex tasteri bi se poravnali po osnovnoj
   liniji (ikonica / znak ×) — middle ih stavlja na istu visinu. Kolona 76 px u Pages/Izvodi/Kartica.cshtml (colgroup). */
.izvod-akcije-cell { white-space: nowrap; }
.izvod-akcije-cell .btn-icon-rmx { vertical-align: middle; }
/* Taster ugovora (rata lizinga / kredita) = ista zelena kao „raspoređeno“ (korisnik 2026-10-31, predlog C: zeleno = povezano
   sa ugovorom). Link, ne button — otvara /Vozila/Ugovor u novom prozoru. Pages/Izvodi/Kartica.cshtml. */
.izvod-rasp-btn, .izvod-ugovor-btn { margin-right: 4px; }
.izvod-rasp-btn.rasp-puno, .izvod-ugovor-btn { color: #2e7d32; border-color: #9ccfa8; background: #e6f4ea; }
.izvod-ugovor-btn { text-decoration: none; box-sizing: border-box; }
.izvod-rasp-btn.rasp-deo { color: #a15c00; border-color: #e0b400; background: #fff3cd; }

/* Lista /Placanja (F2, 2026-10-05): fiksan raspored, duge kolone (Partner, Opis, Banka…) skraćene sa „…“ i title,
   da iznosi desno uvek stanu (slika korisnika: Iznos / Raspoređeno / Ostatak su bili van ekrana). Pages/Placanja/Index.cshtml. */
#tblPlacanja { table-layout: fixed; width: 100%; }
#tblPlacanja tr.lista-row > td { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }  /* pregled ispod reda nije skraćen */

/* Interni komentar / napomena — crvena slova (korisnik 2026-10-07: „Komentari (interni) ili Napomene (interno) moraju imati
   crveni font“). Ista crvena kao napomena partnera na fakturi (.faktura-kupac-napomena-tekst). Klasa rmx-interni: textarea
   Komentar (interni) na /Nalozi/Kartica i /Angazovani/Kartica, polje u pregledu ispod reda /Nalozi i /Angazovani
   (fld extraCls), Board pregled naloga (board-nd-k). Novo interno polje = ista klasa. */
.form-input.rmx-interni,
.board-nd-k.rmx-interni .board-nd-tekst {
  color: #c92a2a;
}

/* ========== TELEFON — okvir (korisnik 2026-10-07: „hoću i mobilni da lepo prikazuje“; zatim „na tel ne mora kao na desktop
   stiker prozori … nađi nešto ali da je u stilu RMX Web“ → predlog sa slike, obrazac RMX TMS, „da, kreni po predlogu“) ==========
   Samo ekran do 700 px — ista granica kao window.rmxJeTelefon u _Layout.cshtml <head> (menjati zajedno). PC izgled se ne
   menja. Blok je namerno na kraju fajla (pobedjuje ranija pravila iste jacine). Pravilo: docs/ui_toolbar.md §7f.
   - Gornja traka: logo + RMX | firma, desno godina i Beleška (ikonica + broj); ☰, ime korisnika, Izlaz i donja statusna
     traka se ne vide (Izlaz i verzija su na dnu fioke — _ShellSidebar .app-side-tel).
   - Donji meni (_Layout .app-donji-meni): Početna · Board · Nalozi · Tracking · Više (= fioka bocnog menija).
   - Bocni meni = fioka iznad donjeg menija (html.rmx-mob-meni), uvek sa tekstom i podmenijima; skupljen meni sa PC-a
     (html.sidebar-collapsed) se ovde ne primenjuje, flyout se ne koristi. JS u _Layout.cshtml (bocni meni).
   - Pocetna: plocice + rokovi (Index.cshtml .home-tel) umesto stikera. */

/* Van telefona: delovi samo za telefon se ne vide. */
.app-brand-ico,
.app-ico-tel,
.app-donji-meni,
.app-side-tel,
.home-tel,
.app-mob-pozadina { display: none; }
/* „Ikonica na telefonu“ u podmeniju Podesavanja (2026-10-08): .app-side-sub a / .app-menu-panel a su jaci od .app-side-tel,
   zato posebno pravilo; prikaz na telefonu dole u @media (isti selektor). Stavka: _ShellSidebar / _ShellTopMenu. */
.app-side-sub a.app-side-tel,
.app-menu-panel a.app-side-tel { display: none; }

/* Bocne sistemske ivice (iPhone polozen, „notch“): padding-left / -right u prvom pravilu .app-body (APP SHELL). */

@media (max-width: 700px) {
  /* --rmx-tel-dno = deo ekrana ispod sistemske donje trake (korisnik 2026-10-09, Samsung S25: Snimi / Odustani ispod trake
     i kod navigacije pokretima i kod 3 tastera). Chrome (od 135) pusta stranu ispod trake; safe-area-max-inset-bottom je
     stalna vrednost od prvog crtanja (safe-area-inset-bottom ume da bude 0 do prvog skrola), iPhone / ostali = inset-bottom.
     Radi samo uz viewport-fit=cover (_Layout.cshtml). Koriste je donji meni, --rmx-tel-dole (liste, „+“), dno kartice,
     fioka menija na kartici i dijalozi — menjati zajedno. --rmx-tel-top = gornja traka + statusna traka kad strana ide
     ispod nje (inace 0). */
  :root {
    --rmx-tel-dno: env(safe-area-max-inset-bottom, env(safe-area-inset-bottom, 0px));
    --rmx-tel-top: calc(48px + env(safe-area-inset-top, 0px));
    --rmx-tel-dole: calc(58px + var(--rmx-tel-dno));
  }
  /* --rmx-vis = innerHeight (_Layout.cshtml <head>, 2026-10-09): u aplikaciji sa ikonice (S25) 100dvh za stranu = prozor +
     donja sistemska traka (merenje RMX-EKRAN: 710 umesto 653) — strana se pomerala za visinu trake. 100dvh = rezerva. */
  .app-body { min-height: var(--rmx-vis, 100dvh); }

  /* Gornja traka */
  .app-topbar {
    position: sticky;
    top: 0;
    z-index: 1600;
    height: var(--rmx-tel-top);
    /* Statusna traka telefona iznad (viewport-fit=cover, 2026-10-09): visina = 48 px + razmak, box-sizing border-box. */
    padding: env(safe-area-inset-top, 0px) 10px 0;
    gap: 8px;
  }
  .app-topbar-left { flex: 1 1 auto; gap: 8px; }
  .app-topbar-right { flex: 0 0 auto; gap: 8px; }
  .app-brand-ico { display: block; width: 26px; height: 26px; border-radius: 5px; flex: 0 0 26px; }
  .app-firma { max-width: none; min-width: 0; flex: 1 1 auto; }
  .app-firma + .app-sep { display: none; }
  .app-sidebar-toggle,
  .app-user,
  .app-top-link,
  .app-logout-form { display: none; }
.app-ico-tel {
    display: block;
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.6;
    stroke-linecap: round;
    stroke-linejoin: round;
  }
/* Donji meni */
  .app-donji-meni {
    display: flex;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1600;
    height: var(--rmx-tel-dole);
    padding-bottom: var(--rmx-tel-dno);
    background: linear-gradient(180deg, var(--rmx-tamna-vrh) 0%, var(--rmx-tamna) 100%);
    border-top: 1px solid #000;
  }
  .app-donji-meni a,
  .app-donji-meni button {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 0;
    border: 0;
    background: none;
    font: inherit;
    font-size: 11px;
    color: #a8b0b8;
    text-decoration: none;
    cursor: pointer;
  }
  .app-donji-meni svg {
    width: 22px;
    height: 22px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-linejoin: round;
  }
  .app-donji-meni .active,
  html.rmx-mob-meni #btnMobVise { color: #ff9a2e; font-weight: 600; }
  /* Kartice: dole su Snimi / Odustani — donjeg menija nema (kao RMX TMS). */
  body:has(.kartica-page) .app-donji-meni { display: none; }

  /* Fioka menija (zatvorena = van ekrana i nevidljiva za Tab; otvara se klizanjem sleva, iznad donjeg menija). */
  body.shell-mode-sidebar .app-sidebar {
    position: fixed;
    top: var(--rmx-tel-top);
    left: 0;
    bottom: var(--rmx-tel-dole);
    width: min(290px, 86vw);
    z-index: 1500;
    transform: translateX(-102%);
    visibility: hidden;
    transition: transform 0.18s ease, visibility 0s linear 0.18s;
    overscroll-behavior: contain;
  }
  body.shell-mode-sidebar:has(.kartica-page) .app-sidebar { bottom: var(--rmx-tel-dno); }
  html.rmx-mob-meni body.shell-mode-sidebar .app-sidebar {
    transform: none;
    visibility: visible;
    transition: transform 0.18s ease;
    box-shadow: 4px 0 18px rgba(0, 0, 0, 0.45);
  }
  html.sidebar-collapsed body .app-sidebar .app-side-text { display: block !important; }
  html.sidebar-collapsed body .app-sidebar .app-side-sub { display: flex !important; }
  html.sidebar-collapsed body .app-sidebar .app-side-link,
  html.sidebar-collapsed body .app-sidebar .app-side-summary {
    justify-content: flex-start;
    padding: 8px 12px;
    gap: 12px;
  }
  .app-side-sub a { padding-top: 10px; padding-bottom: 10px; }
  .app-side-flyout { display: none !important; }
  .app-side-tel { display: block; }
  .app-side-sub a.app-side-tel,
  .app-menu-panel a.app-side-tel { display: block; }
  .app-side-tel .app-side-link {
    width: 100%;
    border: 0;
    background: none;
    font: inherit;
    text-align: left;
  }
  .app-side-tel.app-side-verzija {
    padding: 10px 12px 4px;
    color: var(--rmx-mpod-tekst-podnaslov);
    font-size: 11px;
    border-top: 1px solid #3a424c;
    margin-top: 6px;
  }
  .app-mob-pozadina {
    position: fixed;
    top: var(--rmx-tel-top);
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1400;
    background: rgba(0, 0, 0, 0.35);
  }
  html.rmx-mob-meni .app-mob-pozadina { display: block; }

  /* Sadrzaj */
  .app-main { padding: 10px 10px calc(var(--rmx-tel-dole) + 12px); }
  body:has(.kartica-page) .app-main { padding-bottom: 8px; }
  .page-head { flex-wrap: wrap; row-gap: 2px; }
  .app-status { display: none; }

  /* Pocetna na telefonu (Index.cshtml .home-tel): plocice umesto stikera. Bez .home-tel (sirok PC prozor suzen ispod
     700 px) stikeri ostaju jedan ispod drugog. */
  .home-page { flex: 0 0 auto; }
  .home-page:has(.home-tel) .page-note,
  .home-page:has(.home-tel) .home-welcome,
  body:has(.home-tel) .home-stickers { display: none; }
  .home-tel { display: block; }
/* Prijava: na telefonu ista kartica (labeli su iznad polja u osnovnom stilu, 2026-10-07). */
  .login-body { padding: 8vh 14px 16px; align-items: flex-start; }
}

/* ========== TELEFON — Nalozi i Board kao kartice (korisnik 2026-10-07, predlog sa slike „da, kreni po predlogu“) ==========
   Samo do 700 px (ista granica kao blok iznad i rmxJeTelefon). Tabela ostaje ista (isti JS izbora / pregleda / pretrage);
   CSS svaki red crta kao karticu: ivica levo = status (boje kao .status-dot-*), red pregleda ispod (.partner-detail-row)
   preko cele sirine. /Nalozi: celije po data-col (Pages/Nalozi/Index.cshtml) — nova kolona = dodati ovde (ili sakriti).
   Board: kolone po redosledu (#tblTure iz Pages/Board/Index.cshtml, #tblNalozi iz JS renderNalozi — menjati zajedno);
   strana skroluje cela (bez razdelnika), blok rokova je na Pocetnoj. Sakriveno na telefonu: zaglavlje kolona, strelice
   gore / dole, Trazi (pretraga radi dok se kuca), Brisanje, Izvoz; Novi = narandzasto + dole desno. */
@media (max-width: 700px) {
  /* Visina = --rmx-vis (innerHeight; aplikacija sa ikonice S25 — 100dvh ispod donje trake, 2026-10-09, blok „TELEFON — okvir“). */
  body:has(.partneri-page) { height: var(--rmx-vis, 100dvh); }
  body:has(.partneri-page) .app-body { height: var(--rmx-vis, 100dvh); }
  body:has(.partneri-page) .app-main { padding-bottom: calc(var(--rmx-tel-dole) + 8px); }
  .partneri-page #listaScroll { background: transparent; border: 0; box-shadow: none; }
  /* Poslednja kartica se moze odvuci iznad narandzastog + (54 px + razmak). */
  .partneri-page #listaScroll { padding-bottom: 72px; }

  }

/* ========== TELEFON — Pocetna: spisak rokova do dna (korisnik 2026-10-08: „pocetna treba da ostane kako je bila“, „s tim
   da ova lista kao i sve druge osim ako nemaju redove treba da popune ekran dole“) ==========
   Pocetna ostaje ista (plocice + „Istice u 30 dana“); spisak sada nosi sve rokove (Index.cshtml.cs UcitajTelefonAsync, ranije
   5) i ide do donjeg menija, redovi se pomeraju prstom unutar spiska, traka naslova ostaje gore. Malo rokova = spisak se
   zavrsava na poslednjem redu (flex 0 1 auto). Ista granica 700 px kao blok „TELEFON — okvir“; PC se ne menja. */
@media (max-width: 700px) {
  body:has(.home-tel),
  body:has(.home-tel) .app-body { height: var(--rmx-vis, 100dvh); } /* --rmx-vis = innerHeight (2026-10-09, S25 aplikacija) */
  body:has(.home-tel) .app-main { overflow: hidden; }
  .home-page:has(.home-tel),
  .home-page-content:has(.home-tel) { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
  .home-tel { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; }
}

/* ##########################################################################################################################
   TELEFON — kartice (korisnik 2026-10-08: „pregledaj kartice na mob telefonu da se preprave … prilagođeno za telefon, ne da
   se šeta levo-desno“, „da se pregledaju sve kartice i prilagode prozorima telefona“, „iskoristi ceo prostor za ove liste“,
   „i sve u mobilnoj aplikaciji da se prilagodi“, „da sve u stilu rmx-a“). JEDINO mesto telefonskih pravila za kartice i
   liste (docs/ui_toolbar.md §7f, AGENTS.md Telefon): prvo osnova za sve kartice, pa dopune po grupi stranica, pa liste.
   Sve samo do 700 px (= window.rmxJeTelefon u _Layout.cshtml, blok „TELEFON — okvir“) — PC izgled se ne menja. Nova /
   menjana kartica ili lista: dopuna ide ovde u svoju grupu, ne u <style> stranice.
   ########################################################################################################################## */

/* ========== TELEFON — kartice: osnova (korisnik 2026-10-08: „pregledaj kartice na mob telefonu da se preprave …
   prilagođeno za telefon, ne da se šeta levo-desno“, „da se pregledaju sve kartice i prilagode prozorima telefona“) ==========
   Samo do 700 px — ista granica kao blok „TELEFON — okvir“ i window.rmxJeTelefon u _Layout.cshtml <head> (menjati zajedno);
   PC izgled se ne menja. Zajednicka osnova za SVE kartice (.kartica-* / .nalog-kartica-* / .tura-kartica-* / .card-form):
   strana kartice nikad sira od ekrana, polja jedno ispod drugog (dva kratka — datum / broj — u istom redu), paneli jedan
   ispod drugog, tabele skroluju u svom okviru, Snimi / Odustani uvek vidljivi, dijalozi staju u ekran. Nista se ne
   sakriva (sva polja ostaju za unos), labeli ostaju iznad polja (ui_toolbar.md §7, §7b). Pravila po stranici (ID / klasa
   stranice) su u blokovima „TELEFON — kartice: …“ posle ovog bloka. Pravilo: docs/ui_toolbar.md §7f. */
@media (max-width: 700px) {
  /* --- Visina i dno kartice --- */
  /* --rmx-vis (innerHeight, _Layout <head>; 2026-10-09 S25 aplikacija sa ikonice: 100dvh = prozor + donja traka, Snimi se
     nije video) = vidljivi deo ekrana, rezerva 100dvh. Blok KARTICA gore zakljucava stranu na 100vh (overflow hidden), a na telefonu je 100vh
     visina BEZ trake adrese — Snimi / Odustani su ostajali ispod ivice ekrana. <body> je sam .app-body (_Layout.cshtml),
     zato pravilo ide na body. Isto kao lista Naloga (TELEFON — Nalozi i Board). Ugradjen prozor (body.rmx-embed-short)
     ima jace pravilo i ostaje visine sadrzaja. */
  body:has(.kartica-page) { height: var(--rmx-vis, 100dvh); }
  /* Snimi / Odustani iznad sistemske donje trake (iPhone „home“, Android pokreti / 3 tastera — korisnik 2026-10-09 S25:
     100dvh ide ispod trake, Snimi se nije video). --rmx-tel-dno = blok „TELEFON — okvir“, uz viewport-fit=cover. */
  body:has(.kartica-page) .app-main { padding-bottom: calc(8px + var(--rmx-tel-dno)); }

  /* --- Okvir kartice nikad siri od ekrana --- */
  /* Delovi iz bloka KARTICA (.kartica-page / -top / -form / -fixed / -scroll / -actions) i paneli u njima: dete flex /
     grid okvira sa min-width auto ne sme da raste preko ekrana zbog sireg sadrzaja (ui_toolbar.md §7). */
  :is(.kartica-page),
  :is(.kartica-top),
  :is(.kartica-form, .card-form),
  :is(.kartica-fixed),
  :is(.kartica-scroll),
  :is(.kartica-actions),
  :is(.kartica-page) :is(.card-panel, .card-panel-body, .tura-tab-panel, fieldset) {
    min-width: 0;
    max-width: 100%;
  }
  /* Dugacka rec bez razmaka (putanja fajla, link, broj) u poruci gore / u dijalogu se lomi, ne siri stranu. */
  :is(.kartica-top) :is(.alert-soft, .alert-ok, .page-note),
  .confirm-text { overflow-wrap: anywhere; }

  /* --- Polja: jedno ispod drugog, dva kratka u redu --- */
  /* Kartice imaju kolone po sadrzaju (repeat(N, max-content), blok „Sirina polja“ §7b) — 2–5 polja u redu je sire od
     telefona. Ovde: dve jednake kolone, a svaki red preko obe (jedno polje u redu)… */
  :is(.kartica-form, .card-form) :is(.form-grid, .form-grid-3, .form-grid-4, .form-grid-5) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  :is(.kartica-form, .card-form) :is(.form-grid, .form-grid-3, .form-grid-4, .form-grid-5) > * {
    grid-column: 1 / -1;
  }
  /* …osim reda sa jednim kratkim poljem (datum, iznos, broj, godina, dana, posta, PIB / MB, kurs, D/I) — on uzima pola
     reda, pa dva takva stoje jedno pored drugog (korisnik 2026-10-08: telefon). Klase / name = tabela §7b. Red sa
     tasterom, tekstom ili drugim izborom ostaje preko celog reda. align-content end = polja poravnata i kad se labela
     prelomi u dva reda. :not(:has(…)) mora odmah iza )) bez razmaka — novi red pre njega bio je kombinator „potomak“
     i pravilo nije gadjalo red (ispravka 2026-10-08, faktura: kratka polja svako u svom redu). */
  :is(.kartica-form, .card-form) :is(.form-grid, .form-grid-3, .form-grid-4, .form-grid-5)
    > .form-row:not(.form-row-wide):has(> :is(input[type="date"], input[type="number"], .rmx-date-wrap, .form-input-date,
      .form-input-iznos, .form-input-num, .form-input-dana, .form-input-godina, .form-input-broj, .form-input-posta,
      .form-input-pib, .form-input-mb, .form-input-vrsta, .form-kurs, input[name$="IznosEur"], input[name$="IznosDin"],
      input[name$=".Godina"], input[name$="Posta"], input[name$="Pib"], input[name$=".Mb"], input[name$="MaticniBroj"])):not(:has(> :is(textarea, button, a, select:not(.form-input-vrsta), .form-inline-pair, .partner-typeahead, .check-line))) {
    grid-column: auto;
    align-content: end;
  }
  /* Red polja unutar reda (Posta | Mesto | Drzava, Firma | Radno vreme, Sifra | PIB | MB …) se prelama — neki su
     flex-wrap: nowrap (.tacka-red-80, .tacka-polja-adr .tacka-termin-red, Izvodi .izvod-glava-red). Bira se samo okvir
     sa dva+ .form-row koji je dete .form-row / .form-grid (vodoravan red); na grid / blok nema dejstva. */
  :is(.kartica-form, .card-form) :is(.form-row, .form-grid) > :has(> .form-row ~ .form-row) {
    flex-wrap: wrap;
    min-width: 0;
    max-width: 100%;
  }
  /* Red polja (labela + polje) i sve u njemu najvise sirine reda. */
  :is(.kartica-form, .card-form) .form-row {
    min-width: 0;
    max-width: 100%;
  }
  :is(.kartica-form, .card-form) .form-row > * { max-width: 100%; }
  /* Polje zadrzava svoju sirinu iz §7b (datum 11.6rem, iznos 8.5rem, tekst 16rem, siroko 80ch …), ali nikad sire od reda:
     jace od §7b pravila (.kartica-form .form-row:not(.form-row-wide) > input[type="date"] = 0,4,1) i od klasnih pravila
     stranice (npr. Vozac 22rem na kartici ture) — :is(input:not(×3)) daje jacinu 0,5,1. Inline sirina (select
     style="width:auto", JS sirina .rmx-sel-pretraga) se ovim ogranicava bez !important (inline postavlja samo width). */
  :is(.kartica-form, .card-form) .form-row
    > :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea, .form-input, .rmx-date-wrap,
      .partner-typeahead, .form-inline-pair) {
    min-width: 0;
    max-width: 100%;
  }
  /* Polja van .form-row (toolbar u tabu, red sa tasterom, dijalog): najvise sirine okvira. Ne u celiji tabele — tamo bi
     procenat ucinio da se kolona skupi na nulu (tabela skroluje, v. dole). */
  :is(.kartica-page, .confirm-box)
    :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea):not(td *):not(th *) {
    max-width: 100%;
  }

  /* --- Paneli jedan ispod drugog --- */
  /* Levo / desno (.faktura-glava: Fakture, Nalozi, Angazovani, Ulazne, PodaciNaloga, Tracking) — vec jedna kolona ispod
     900 px, ovde minmax(0, 1fr) da kolona ne raste po sadrzaju (isti razlog kao .form-row §7e). */
  :is(.kartica-page) .faktura-glava { grid-template-columns: minmax(0, 1fr); }

  /* --- Tabovi kartice --- */
  /* Traka tabova (.tura-tabs i svaki okvir sa button[data-tab]) prelama se u vise redova, ne siri stranu (Ture ima 11). */
  :is(.kartica-page) :is(.tura-tabs, [role="tablist"], :has(> button[data-tab])) {
    flex-wrap: wrap;
    min-width: 0;
    max-width: 100%;
  }
  /* Naslov panela sa tasterima (Kontakti + Dodaj, Dnevnice posade + Clan posade …): tasteri prelaze u drugi red. */
  :is(.kartica-page) .card-panel-title { flex-wrap: wrap; row-gap: 4px; }

  /* --- Tabele: skroluju u svom okviru, strana ne --- */
  /* Tabela u kartici / dijalogu postaje blok sa svojim vodoravnim skrolom (panel, naslov i polja oko nje ostaju na mestu).
     Bez okvira koji vec skroluje (.grid-scroll, .stavke-table-wrap, …) — tamo sticky zaglavlje mora ostati vezano za taj
     okvir. [hidden] tabele (gorivo / AdBlue zbir, dokumenti vozila) ostaju sakrivene — display:block bi pregazio hidden. */
  :is(.kartica-page, .confirm-box) table:not([hidden]):not(:is(.grid-scroll, .stavke-table-wrap,
      .tura-nalozi-scroll, .tura-rokovi-lista, .cemt-voznje-wrap, .rasp-tabela-wrap, .kes-rasp-scroll, .gor-izbor-scroll) table) {
    display: block;
    max-width: 100%;
    overflow-x: auto;
  }
  /* Postojeci okviri tabela skroluju i vodoravno (CEMT voznje na /Dozvole/Kartica nemaju overflow van rezima zakljucano). */
  :is(.kartica-page, .confirm-box) :is(.grid-scroll, .stavke-table-wrap, .tura-nalozi-scroll,
      .tura-rokovi-lista, .cemt-voznje-wrap, .rasp-tabela-wrap, .kes-rasp-scroll, .gor-izbor-scroll) {
    max-width: 100%;
    overflow-x: auto;
  }
  /* table-layout fixed (CEMT voznje, troskovi naloga) daje koloni „auto“ nulu kad zbir fiksnih kolona predje ekran —
     polje Dokaz bi nestalo. Auto = kolona bar koliko sadrzaj, tabela skroluje. */
  :is(.kartica-page, .confirm-box) table { table-layout: auto; }
  /* Tabele za unos (§7e): tekstualno polje bez svoje najmanje sirine se na uskoj tabeli skupi na par piksela (width 100%
     u celiji). Najmanje 6rem; polja sa svojim pravilom (broj 5.5rem, datum 8.8rem, Opis 14–15rem — jaca pravila) ostaju. */
  .tura-stavke-grid .form-input { min-width: 6rem; }

  /* --- Snimi / Odustani --- */
  /* Uvek vidljivi (pedala kartice, §7): vise tastera (SEF, Zakljucaj, Otkaz / Storno) prelazi u drugi red umesto da
     ih overflow hidden kartice odsece. */
  :is(.kartica-actions) { flex-wrap: wrap; row-gap: 6px; }

  /* --- Dijalozi (DA / NE, raspodela, prozor kartice u ramu, pregled stampe) --- */
  /* Uz ivicu 8 px gore / dole i 2vw levo / desno: prozori sa 96vw (kartica partnera / ture / dokumenta u ramu) staju
     tacno. Visok prozor: overlay skroluje, a auto margine (umesto center) cuvaju vrh prozora (naslov, Zatvori) — center bi
     ga gurnuo iznad ekrana. */
  /* Dole + --rmx-tel-dno (2026-10-09): taster DA / Zatvori na dnu prozora ne ide ispod sistemske trake. */
  .confirm-overlay,
  .print-overlay {
    padding: calc(8px + env(safe-area-inset-top, 0px)) 2vw calc(8px + var(--rmx-tel-dno));
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .confirm-overlay > *,
  .print-overlay > * {
    margin-top: auto;
    margin-bottom: auto;
  }
  .confirm-overlay > .confirm-box,
  .print-overlay > .print-box { max-width: 100%; }
  /* Pregled stampe (inline visina min(94vh, …)) = vidljivi deo ekrana; dokument skroluje u ramu. */
  .print-overlay > .print-box { max-height: calc(100dvh - 16px - env(safe-area-inset-top, 0px) - var(--rmx-tel-dno)); }
  .confirm-actions,
  .print-bar,
  .print-actions,
  .rasp-zbir { flex-wrap: wrap; }

  /* --- Poslednja zastita: nista se ne sece, strana se ne pomera --- */
  /* .card-panel ima overflow hidden (sirok sadrzaj se ODSECE — polje van ekrana ne moze da se popuni). Na telefonu
     vodoravno skroluje sam panel: ostatak koji pravila iznad i blokovi stranica nisu prelomili ostaje dostupan, a strana
     (.kartica-scroll) se ne pomera. Uspravno ostaje hidden (isto kao ranije — padajuce liste, visina panela). */
  :is(.kartica-page) .card-panel { overflow-x: auto; }

  /* Unutrasnji razmak panela 14 / 16 px → 10 px: 12 px vise za polja (pola reda sa dva kratka polja ~155 px na 360 px).
     Samo razmak, bez promene izgleda panela. Traka clana posade (.posada-blok, kartica ture) ide od ivice do ivice
     negativnom marginom = bocni razmak panela — menjati zajedno (inace bi panel dobio 6 px vodoravnog skrola). */
  :is(.kartica-page) .card-panel-body { padding: 10px; }
  :is(.kartica-page) .posada-blok {
    margin-left: -10px;
    margin-right: -10px;
    padding-left: 10px;
    padding-right: 10px;
  }
}

/* ---------- TELEFON — kartice: nalozi, angažovani, šifarnici adresa (korisnik 2026-10-08) ---------- */
/* Korisnik 2026-10-08: „kartice na mob telefonu … prilagođeno za telefon, ne da se šeta levo-desno“. Samo do 700 px
   (= window.rmxJeTelefon i blok „TELEFON — okvir“, menjati zajedno); PC izgled se ne menja. Ide POSLE opšteg bloka
   kartica (B1–B9) — ovde samo pravila stranica koja su jača od opšteg. <style> na stranici (Nalozi / Angazovani /
   PodaciNaloga Kartica) dolazi posle site.css, pa je ovde selektor uvek JAČI (ne isti) od pravila na stranici.
   Raspored polja i labela iznad polja ostaju; ništa se ne sakriva osim praznih ćelija. Pravilo: docs/ui_toolbar.md §7f. */
@media (max-width: 700px) {

  /* --- zajedničko za ove kartice --- */
  /* Pretraga preko liste (wwwroot/js/rmx-select-pretraga.js) pri učitavanju dobija inline width u px — ne sme preko
     kolone (okret ekrana / uži panel). Nalog Partner, Angažovani Nalogodavac / Prevoznik, Lokacije Partner / Država,
     Carinjenja Ispostava / Špediter (korisnik 2026-10-08). */
  .kartica-form .rmx-sel-pretraga { max-width: 100%; }
  /* Dug naslov kartice („Izmena lokacije · …“, „Izmena carinjenja · …“) se lomi, ne gura stranu (korisnik 2026-10-08). */
  .kartica-top .page-title { min-width: 0; overflow-wrap: anywhere; }

  /* --- /Nalozi/Kartica: mreže polja u jednoj koloni --- */
  /* --- /Nalozi/Kartica: Naziv naloga (šablon) i Naziv šablona --- */
  /* --- /Nalozi/Kartica: Nalog dokumentacija --- */
  /* --- Roba: /Nalozi/Kartica i /Angazovani/Kartica (ista klasa u <style> obe stranice) --- */
  /* --- Tačke utovara / istovara (Pages/Nalozi/_NalogTacka.cshtml — nalog i angažovani) --- */
  /* --- Troškovi (prefaktura) #tblNalogTroskovi: /Nalozi/Kartica i /Angazovani/Kartica (.angaz-troskovi) --- */
  /* --- /Angazovani/Kartica --- */
  /* --- /PodaciNaloga/Kartica --- */
  /* --- /Board/KarticaNalog --- */
  /* /Lokacije, /Carinjenja, /CarinskeIspostave, /Drzave Kartica: nema posebnih širina na stranici — dovoljno je opšte
     pravilo kartica (B1–B9) + .rmx-sel-pretraga gore (korisnik 2026-10-08). */
}

/* ---------- TELEFON — kartice: tura, službeno, tracking, zarada, refakcija (korisnik 2026-10-08) ---------- */
/* Korisnik 2026-10-08: „pregledaj kartice na mob telefonu … prilagođeno za telefon, ne da se šeta levo-desno“.
   Samo do 700 px — ista granica kao window.rmxJeTelefon (_Layout.cshtml) i ostali TELEFON blokovi (menjati zajedno);
   PC izgled se ne menja. Dopuna osnove „TELEFON — kartice“ (B1–B9): ovde samo pravila stranica čiji su PC selektori
   jači od osnove ili ih osnova ne pokriva. Tabele za unos sa mnogo kolona (Dnevnice, Troškovi, Putarine, AdBlue, Gorivo,
   Akontacije, Bonusi, Dozvole, Kretanja) ostaju tabele i skroluju vodoravno u svom okviru (osnova B6) — bez data-label
   na ćelijama kartica-red bi izgubila naslove kolona. Stranice: Pages/Ture/Kartica, Sluzbena/Kartica, Tracking/Kartica,
   Refakcija/Obracun (NetoZarade/Kartica, Refakcija/Kartica, AkcizaKvartali/Kartica pokriva osnova). */
@media (max-width: 700px) {

  /* ===== /Ture/Kartica — zaglavlje ===== */
  /* ===== /Ture/Kartica — tab Putni ===== */
/* Nalozi ove ture: na PC-u tab i panel pune ostatak visine (flex + min-height 0, site.css #turaNaloziPanel) — na telefonu
     je gornji panel viši od ekrana pa bi se panel naloga skupio na 0 (nalozi nevidljivi). Ovde visina po sadržaju,
     vertikalno skroluje kartica (.tura-kartica-scroll), tabela samo vodoravno u .tura-nalozi-scroll (svoj okvir, ostaje table). */
  .tura-tab-panel.active[data-panel="putni"] { flex: 0 0 auto; }
  /* ===== /Ture/Kartica — sve tabele ===== */
  /* ===== /Ture/Kartica — Kurs + taster … (tab Dnevnice posade, tab Isplata) ===== */
  /* ===== /Ture/Kartica — tab Dnevnice posade ===== */
  /* ===== /Ture/Kartica — tab Isplata (+ Porez BOP na tabu Dnevnice, ista .isplata-grid) ===== */
  /* ===== /Sluzbena/Kartica ===== */
  /* ===== /Tracking/Kartica ===== */
  /* ===== /Refakcija/Obracun ===== */
  /* Forma Zahtev je unutar .kartica-scroll, posle dve tabele: .kartica-form ima flex 1 + min-height 0 + overflow hidden,
     pa kad su tabele više od ekrana forma dobije visinu 0 i ne vidi se. Na telefonu visina po sadržaju. (Jedina takva
     strana — provereno grep-om 2026-10-08.) */
  .kartica-scroll > form.kartica-form { flex: 0 0 auto; overflow: visible; }
  /* Filter Period: padajuća lista (dug tekst perioda · datumi · RSD/L) ceo red, tasteri štampe ispod. */
  .kartica-top > .izvestaj-filter .izvestaj-label { flex: 1 1 100%; min-width: 0; }
  .kartica-top > .izvestaj-filter .izvestaj-label .form-input { min-width: 0; }

  /* ===== /Refakcija/Kartica ===== */
  }

/* ---------- TELEFON — kartice: fakture, ulazni računi, izvodi, kurs i šifarnici finansija (korisnik 2026-10-08) ---------- */
/* Samo do 700 px (ista granica kao rmxJeTelefon u _Layout.cshtml i ostali TELEFON blokovi) — PC izgled se ne menja.
   Korisnik 2026-10-08: „kartice na mob telefonu … prilagođeno za telefon, ne da se šeta levo-desno“. Ovde samo ono sto je
   posebno za stranice finansija; opsta pravila kartica (jedna kolona polja, paneli jedan ispod drugog, tabele u svom
   okviru, dijalozi do sirine ekrana) su u osnovnom TELEFON bloku kartica. Pravilo: docs/ui_toolbar.md §7f.
   Kurs, Tekuci racuni, Neoporezivi iznosi, Napomene SEF, Vrste troskova: dovoljno je osnovno pravilo (nema svojih pravila). */
@media (max-width: 700px) {

  /* --- Placanje (/Fakture/Kartica #fakturaUplate, /UlazneFakture/Kartica #ulaznaPlacanja; site.css .faktura-placanje-*) --- */
  /* Okvir polja je na PC-u sirok po sadrzaju (~200 px) pa je Napomena za placanje uska; na telefonu okvir preko celog reda,
     polja zadrzavaju svoje sirine (§7b), tabela uplata pada ispod. Angazovani ima svoje pravilo (#angazovaniForm). */
  #fakturaUplate .faktura-placanje-telo > .faktura-placanje-polja,
  #ulaznaPlacanja .faktura-placanje-telo > .faktura-placanje-polja { flex: 1 1 100%; }
  /* Iznos · Placeno · Otvoreno: na PC-u jedan red bez preloma (gap 6 mm) — na telefonu prelom umesto prelaska ivice. */
  #fakturaUplate .faktura-uplate-zbir,
  #ulaznaPlacanja .faktura-uplate-zbir { flex-wrap: wrap; row-gap: 1mm; }

  /* --- /Fakture/Kartica --- */
  /* Dokument red 1 (Pages/Fakture/Kartica.cshtml): prazna celija i nevidljiva labela iznad XML / PDF sluze samo poravnanju
     5 kolona na PC-u; u jednoj koloni prave prazan red. Red XML / PDF bez fajla sa portala nema sadrzaja — ne crta se. */
  .kartica-form .form-grid-5:has(> .faktura-sef-portal-btns) > .form-row[aria-hidden="true"] { display: none; }
  .kartica-form .form-grid-5 > .faktura-sef-portal-btns > label { display: none; }
  .kartica-form .form-grid-5 > .faktura-sef-portal-btns:not(:has(.sef-portal-btn)) { display: none; }
/* --- Tabele unosa stavki kao kartice: #tblStavke (/Fakture/Kartica i /Izvodi/Kartica), #tblRaspodela (/UlazneFakture/Kartica) ---
     Na PC-u tabela min. 54rem (site.css .stavke-edit-table) — na telefonu red = mreza od 6 kolona (Rb | 4 jednake | ×),
     labela iznad polja = tekst <th> te kolone (td::before; menjati zajedno sa <th> i sa redom koji pravi JS — isti redosled
     <td>). Ista polja, isti name / JS; zaglavlje kolona se ne crta jer je labela uz svako polje. id = jace od <style> stranica. */
  #tblStavke,
  #tblRaspodela { display: block; width: 100%; min-width: 0; overflow: visible; }
  #tblStavke > colgroup,
  #tblStavke > thead,
  #tblRaspodela > thead { display: none; }
  #tblStavke > tbody,
  #tblRaspodela > tbody { display: block; }
  #tblStavke > tbody > tr.stavka-row,
  #tblRaspodela > tbody > tr.rasp-red {
    display: grid;
    grid-template-columns: auto repeat(4, minmax(0, 1fr)) auto;
    gap: 1mm;
    align-items: end;
    padding: 2mm 1mm;
    border-bottom: 1px solid var(--rmx-edge);
  }
  #tblStavke > tbody > tr.stavka-row > td,
  #tblRaspodela > tbody > tr.rasp-red > td {
    display: block;
    width: auto;
    min-width: 0;
    max-width: none;
    padding: 0;
    border: 0;
    text-align: left;
    white-space: normal;
  }
  /* Labela = izgled labela kartice (.kartica-form .form-row label). */
  #tblStavke > tbody > tr.stavka-row > td::before,
  #tblRaspodela > tbody > tr.rasp-red > td::before {
    display: block;
    margin-bottom: 3px;
    font-size: var(--rmx-label-font-size);
    font-weight: 600;
    line-height: 1.15;
    color: #4a5560;
  }
  /* Rb u ravni sa poljem (visina polja 28 px). */
  #tblStavke > tbody > tr.stavka-row > td.stavka-rb-cell,
  #tblRaspodela > tbody > tr.rasp-red > td.stavka-rb-cell { grid-area: rb; line-height: 28px; }

  /* Stavke fakture: 1 Rb, 2 Opis, 3 JM, 4 Kol, 5 Cena EUR, 6 Cena DIN (I-faktura: JS je sakriva — ostaje prazno mesto),
     7 Napomena, 8 Iznos EUR, 9 × (Pages/Fakture/Kartica.cshtml tbl + JS dodajStavku). #tblStavke postoji samo na
     /Fakture i /Izvodi — :not(.izvod-kartica) = faktura. Napomena: site.css .col-napomena min 14rem ponisteno iznad. */
  .kartica-page:not(.izvod-kartica) #tblStavke > tbody > tr.stavka-row {
    grid-template-areas:
      "rb  opis opis opis opis del"
      "jm  jm   jm   kol  kol  kol"
      "eur eur  eur  din  din  din"
      "nap nap  nap  izn  izn  izn";
  }
  .kartica-page:not(.izvod-kartica) #tblStavke > tbody > tr.stavka-row > td:nth-child(2) { grid-area: opis; }
  .kartica-page:not(.izvod-kartica) #tblStavke > tbody > tr.stavka-row > td:nth-child(3) { grid-area: jm; }
  .kartica-page:not(.izvod-kartica) #tblStavke > tbody > tr.stavka-row > td:nth-child(4) { grid-area: kol; }
  .kartica-page:not(.izvod-kartica) #tblStavke > tbody > tr.stavka-row > td:nth-child(5) { grid-area: eur; }
  .kartica-page:not(.izvod-kartica) #tblStavke > tbody > tr.stavka-row > td:nth-child(6) { grid-area: din; }
  .kartica-page:not(.izvod-kartica) #tblStavke > tbody > tr.stavka-row > td:nth-child(7) { grid-area: nap; }
  .kartica-page:not(.izvod-kartica) #tblStavke > tbody > tr.stavka-row > td:nth-child(8) { grid-area: izn; }
  .kartica-page:not(.izvod-kartica) #tblStavke > tbody > tr.stavka-row > td:nth-child(9) { grid-area: del; }
  .kartica-page:not(.izvod-kartica) #tblStavke > tbody > tr.stavka-row > td:nth-child(2)::before { content: "Opis"; }
  .kartica-page:not(.izvod-kartica) #tblStavke > tbody > tr.stavka-row > td:nth-child(3)::before { content: "JM"; }
  .kartica-page:not(.izvod-kartica) #tblStavke > tbody > tr.stavka-row > td:nth-child(4)::before { content: "Kol"; }
  .kartica-page:not(.izvod-kartica) #tblStavke > tbody > tr.stavka-row > td:nth-child(5)::before { content: "Cena EUR"; }
  .kartica-page:not(.izvod-kartica) #tblStavke > tbody > tr.stavka-row > td:nth-child(6)::before { content: "Cena DIN"; }
  .kartica-page:not(.izvod-kartica) #tblStavke > tbody > tr.stavka-row > td:nth-child(7)::before { content: "Napomena"; }
  .kartica-page:not(.izvod-kartica) #tblStavke > tbody > tr.stavka-row > td:nth-child(8)::before { content: "Iznos EUR"; }

  /* --- /UlazneFakture/Kartica --- */
/* --- /Izvodi (lista) — pregled Stavke ispod liste --- */
  /* Na PC-u natpis „Stavke“ i nazivi kolona stoje, skroluje samo .izvod-stavke-scroll (<style> u Pages/Izvodi/Index.cshtml,
     korisnik 2026-10-09). Na telefonu stavke su kartice (lista-tel) — skroluje ceo blok kao ranije. #stavkePanel = jace od
     <style> stranice (ona dolazi posle site.css). */
  #stavkePanel .izvod-stavke-block { display: block; overflow: auto; padding-bottom: 8px; }
  #stavkePanel .izvod-stavke-block > .izvod-stavke-scroll { overflow: visible; margin-bottom: 0; }

  /* --- /Izvodi/Kartica --- */
  /* Na PC-u glava izvoda stoji (.kartica-fixed), skroluju samo redovi stavki (<style> stranice: .kartica-scroll overflow
     hidden). Na telefonu bi glava u jednoj koloni pojela ekran, a Napomena i Snimi bi se odsekli — zato skroluje cela
     forma, Snimi / Odustani zalepljeni dole (pozadina = .app-body --rmx-bg). Isti obrazac kao /Board/KarticaNalog na
     telefonu. id forme = jace od <style> na stranici. JS: lista predloga se krije na skrol stavki — v. 03_finansije.md. */
  #izvod-kartica-form { overflow-y: auto; -webkit-overflow-scrolling: touch; }
  #izvod-kartica-form > .kartica-fixed,
  #izvod-kartica-form > .kartica-scroll { flex: 0 0 auto; min-height: 0; overflow: visible; }
  #izvod-kartica-form > .kartica-scroll > .card-panel.izvod-stavke-panel { flex: 0 0 auto; }
  #izvod-kartica-form .izvod-stavke-panel .card-panel-body { overflow: visible; }
  #izvod-kartica-form .stavke-table-wrap { flex: 0 0 auto; min-height: 0; overflow: visible; }
  /* margin-top auto: kad je izvod kratak, Snimi ostaje na dnu ekrana (kao ranije), a ne odmah ispod Napomene. */
  #izvod-kartica-form > .kartica-actions {
    position: sticky;
    bottom: 0;
    z-index: 3;
    margin-top: auto;
    background: var(--rmx-bg);
  }
  /* Glava: levo (datum, broj, tekuci, zbirovi) i desno (fajl, Procitaj izvod) jedno ispod drugog — na PC-u dve polovine. */
  .izvod-kartica .kartica-fixed .izvod-glava-body { flex-direction: column; }
  .izvod-kartica .kartica-fixed .izvod-glava-levo,
  .izvod-kartica .kartica-fixed .izvod-glava-desno { flex: 0 0 auto; }
  /* Datum | Broj izvoda: prelom ako ne staju (~297 px u ~306 px — zavisi od fonta u Prikazu). */
  .izvod-kartica .kartica-form .izvod-glava-red { flex-wrap: wrap; }
  .izvod-kartica .kartica-form .izvod-glava-red > .form-row { flex: 0 1 auto; width: auto; max-width: 100%; }
  /* Tekuci racun ceo red; ispod Valuta | Zaduzenje | Odobrenje u jednom redu (na PC-u zbirovi 8.5rem u redu bez preloma,
     ~350 px — prelazili bi ivicu). Zbirovi dele ostatak reda, ostaju desno poravnati (input.form-input-iznos). */
  .izvod-kartica .kartica-form .izvod-tekuci-red { flex-wrap: wrap; }
  .izvod-kartica .kartica-form .izvod-tekuci-red > .izvod-tekuci { flex: 1 1 100%; }
  .izvod-kartica .kartica-form .izvod-zbir-red {
    flex: 1 1 100%;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) minmax(0, 1fr);
  }
  .izvod-kartica .kartica-form .izvod-zbir-red > .form-row:not(.form-row-wide) > .form-input-iznos { width: 100%; max-width: 100%; }
  /* Saldo (2026-10-09) u drugom redu ispod Zaduzenje / Odobrenje, preko obe kolone. */
  .izvod-kartica .kartica-form .izvod-zbir-red > .izvod-saldo-red { grid-column: 2 / -1; }
  /* Podpartija (SQL 202, 2026-11-01) na telefonu svoj red — da Valuta | Zaduženje | Odobrenje ostanu u jednom redu. */
  .izvod-kartica .kartica-form .izvod-zbir-red > #izvodPodRed { grid-column: 1 / -1; }
  /* Stavke izvoda: 1 Rb, 2 Partner, 3 Vrsta troska, 4 Opis, 5 Zaduzenje, 6 Odobrenje, 7 Raspodela + ×
     (Pages/Izvodi/Kartica.cshtml tbl + JS dodajStavku — menjati zajedno). Tasteri u jednom redu (kao .izvod-akcije-cell). */
  .izvod-kartica #tblStavke > tbody > tr.stavka-row {
    grid-template-areas:
      "rb  par  par  par  par  akc"
      "vrs vrs  vrs  opis opis opis"
      "zad zad  zad  odb  odb  odb";
  }
  .izvod-kartica #tblStavke > tbody > tr.stavka-row > td:nth-child(2) { grid-area: par; }
  .izvod-kartica #tblStavke > tbody > tr.stavka-row > td:nth-child(3) { grid-area: vrs; }
  .izvod-kartica #tblStavke > tbody > tr.stavka-row > td:nth-child(4) { grid-area: opis; }
  .izvod-kartica #tblStavke > tbody > tr.stavka-row > td:nth-child(5) { grid-area: zad; }
  .izvod-kartica #tblStavke > tbody > tr.stavka-row > td:nth-child(6) { grid-area: odb; }
  .izvod-kartica #tblStavke > tbody > tr.stavka-row > td:nth-child(7) { grid-area: akc; white-space: nowrap; }
  .izvod-kartica #tblStavke > tbody > tr.stavka-row > td:nth-child(2)::before { content: "Partner"; }
  .izvod-kartica #tblStavke > tbody > tr.stavka-row > td:nth-child(3)::before { content: "Vrsta troska"; }
  .izvod-kartica #tblStavke > tbody > tr.stavka-row > td:nth-child(4)::before { content: "Opis"; }
  .izvod-kartica #tblStavke > tbody > tr.stavka-row > td:nth-child(5)::before { content: "Zaduzenje"; }
  .izvod-kartica #tblStavke > tbody > tr.stavka-row > td:nth-child(6)::before { content: "Odobrenje"; }

  /* --- Prozor raspodele (Pages/Shared/_RaspodelaDlg.cshtml, site.css .rasp-*; Fakture / Ulazni / Izvodi / Placanja) --- */
  /* Sirinu prozora ogranicava osnovno pravilo dijaloga; ovde unutrasnji raspored. Glava stavke (Izvod / Partner / Opis /
     Uplata) u jednoj koloni umesto dve. */
  .confirm-box.rasp-box .rasp-glava { grid-template-columns: minmax(0, 1fr); }
  /* Uplata · Rasporedjeno · Nerasporedjeno: prelom umesto prelaska ivice (na PC-u jedan red, gap 6 mm). */
  .confirm-box.rasp-box .rasp-zbir { flex-wrap: wrap; gap: 1mm 4mm; }
  /* Uplate upisane pre izvoda (Poveži): tabela nema svoj okvir za skrol — skroluje okvir .rasp-ceka, ne prozor. */
  .confirm-box.rasp-box .rasp-ceka { overflow-x: auto; }
  /* Ako glava + filteri + tabela + zbir ne stanu u 92vh (nizak ekran), skroluje prozor — Snimi / Odustani dostupni. */
  .confirm-box.rasp-box { overflow-y: auto; }
}

/* Faktura / angazovani — pretraga kupca / prevoznika (#kupacTypeahead, #prevoznikTypeahead): na PC-u min-width 30rem (360 px), na telefonu je u panelu ~331 px
   pa je polje izlazilo preko ivice panela (merenje u browseru 375 px, 2026-10-08). Ovde puna sirina reda, bez min-width;
   red .faktura-kupac-partner-row (pretraga + tasteri) sme da se skupi. Ostalo kao PC. (korisnik 2026-10-08) */
@media (max-width: 700px) {
  /* id u selektoru = jace od PC pravila „#kupacTypeahead, #prevoznikTypeahead … 30rem“ (isto polje prevoznika na
     /Angazovani/Kartica). */
  .kartica-form #kupacTypeahead, .kartica-form #kupacTypeahead .form-input,
  .kartica-form #prevoznikTypeahead, .kartica-form #prevoznikTypeahead .form-input,
  .kartica-form .faktura-kupac-partner-row .partner-typeahead-field { min-width: 0; width: 100%; flex: 1 1 auto; }
  .kartica-form .faktura-kupac-partner-row { min-width: 0; }
}

/* ---------- TELEFON — kartice: partneri, dobavljači, CRM, vozila, zaposleni, šifarnici (korisnik 2026-10-08) ---------- */
/* Korisnik 2026-10-08: „kartice na mob telefonu … prilagodjeno za telefon, ne da se seta levo-desno“. Samo do 700 px
   (ista granica kao window.rmxJeTelefon u _Layout.cshtml i ostali blokovi TELEFON). Opste kartice (B1–B9) su u bloku
   pre ovoga; ovde samo ono sto je posebno za stranice: Partneri / Dobavljaci (tabovi Kontakti, Adrese, Racuni,
   Aktivnosti; i u prozoru embed=1), Vozila, Zaposleni. CRM kartice (Crm/Kartica, Adresa, Aktivnost, Racun), Gume, Oprema,
   Vrste* i TipoviDokumenata nemaju svoje pravilo — dovoljna su opsta. PC (> 700 px) se ne menja. */
@media (max-width: 700px) {

  /* --- zajednicko: tabela u kartici = red kao blok (naziv kolone sivo levo, vrednost desno od njega) ---
     Zasto: tabele od 5–7 kolona sa zaglavljem bez prelamanja (.grid th nowrap) su sire od telefona (~380–560 px prema
     ~306 px u panelu), pa bi Izmena / Brisanje / Kartica na kraju reda bili van ekrana. Isti obrazac kao Kamioni /
     Nalozi na telefonu (.kam-kv: naziv sivo 12px, vrednost do kraja reda). Zaglavlje se ne vidi — naziv kolone ide kao
     ::before ispred vrednosti (tekst = <th> u markupu, menjati zajedno — vidi grupe ispod). Prazna celija se ne crta.
     Vazi za: Partneri / Dobavljaci child tabele (.partner-kontakti-grid, i Dozvole je koristi — zato samo kroz id forme),
     Vozila #vozilo-dok-grid / #vozilo-srv-grid (JS osvezi pravi iste celije), Zaposleni tabele Dokumenti i Senka.
     Vozila: tabela ima atribut hidden kad nema redova — display samo za :not([hidden]). (korisnik 2026-10-08) */
  #frmPartnerKartica .partner-kontakti-grid,
  #frmDobavljacKartica .partner-kontakti-grid,
  .kartica-form #vozilo-dok-grid:not([hidden]),
  .kartica-form #vozilo-srv-grid:not([hidden]),
  .kartica-form:has(> #Z_Id) .card-panel-body > table.grid {
    display: block;
    width: 100%;
    min-width: 0;
  }
  #frmPartnerKartica .partner-kontakti-grid > thead,
  #frmDobavljacKartica .partner-kontakti-grid > thead,
  .kartica-form #vozilo-dok-grid > thead,
  .kartica-form #vozilo-srv-grid > thead,
  .kartica-form:has(> #Z_Id) .card-panel-body > table.grid > thead { display: none; }
  #frmPartnerKartica .partner-kontakti-grid > tbody,
  #frmDobavljacKartica .partner-kontakti-grid > tbody,
  .kartica-form #vozilo-dok-grid > tbody,
  .kartica-form #vozilo-srv-grid > tbody,
  .kartica-form:has(> #Z_Id) .card-panel-body > table.grid > tbody {
    display: block;
    border-top: 1px solid var(--rmx-edge);   /* gornja ivica umesto tamnog zaglavlja (ista linija kao .grid td) */
  }
  /* Red: 1. red = prva kolona (naslov) levo + akcije desno; ostale kolone svaka u svom redu ispod. Zebra / izbor reda
     (.grid tbody tr:nth-child(even), .lista-row.is-selected) ostaju iz osnovnog stila. */
  #frmPartnerKartica .partner-kontakti-grid > tbody > tr,
  #frmDobavljacKartica .partner-kontakti-grid > tbody > tr,
  .kartica-form #vozilo-dok-grid > tbody > tr,
  .kartica-form #vozilo-srv-grid > tbody > tr,
  .kartica-form:has(> #Z_Id) .card-panel-body > table.grid > tbody > tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 3px 8px;
    padding: 7px 10px;
    border-bottom: 1px solid var(--rmx-edge);
  }
  /* Celija = naziv (::before, 6rem) + vrednost; dugacak tekst (email, broj racuna, opis) se lomi u svom redu.
     width auto: .partner-kontakti-aktivan 5.5rem / -akcije 4.8rem su sirine kolone za PC (site.css „Partneri — child tabele“). */
  #frmPartnerKartica .partner-kontakti-grid > tbody > tr > td,
  #frmDobavljacKartica .partner-kontakti-grid > tbody > tr > td,
  .kartica-form #vozilo-dok-grid > tbody > tr > td,
  .kartica-form #vozilo-srv-grid > tbody > tr > td,
  .kartica-form:has(> #Z_Id) .card-panel-body > table.grid > tbody > tr > td {
    grid-column: 1 / -1;
    display: flex;
    align-items: baseline;
    gap: 8px;
    width: auto;
    min-width: 0;
    padding: 0;
    border: 0;
    white-space: normal;
    overflow-wrap: anywhere;
  }
  #frmPartnerKartica .partner-kontakti-grid > tbody > tr > td::before,
  #frmDobavljacKartica .partner-kontakti-grid > tbody > tr > td::before,
  .kartica-form #vozilo-dok-grid > tbody > tr > td::before,
  .kartica-form #vozilo-srv-grid > tbody > tr > td::before,
  .kartica-form:has(> #Z_Id) .card-panel-body > table.grid > tbody > tr > td::before {
    flex: 0 0 6rem;
    color: var(--rmx-muted);
    font-size: 12px;
    font-weight: 400;
    text-align: left;
    overflow-wrap: normal;
  }
/* Prva kolona = naslov reda (bez naziva ispred). */
  #frmPartnerKartica .partner-kontakti-grid > tbody > tr > td:first-child,
  #frmDobavljacKartica .partner-kontakti-grid > tbody > tr > td:first-child,
  .kartica-form #vozilo-dok-grid > tbody > tr > td:first-child,
  .kartica-form #vozilo-srv-grid > tbody > tr > td:first-child,
  .kartica-form:has(> #Z_Id) .card-panel-body > table.grid > tbody > tr > td:first-child {
    grid-column: 1;
    grid-row: 1;
    display: block;
    font-weight: 600;
  }
/* Akcije (olovka / korpa; Zaposleni: Kartica / Brisi) desno u prvom redu — uvek vidljive bez pomeranja. */
  #frmPartnerKartica .partner-kontakti-grid > tbody > tr > td.partner-kontakti-akcije,
  #frmDobavljacKartica .partner-kontakti-grid > tbody > tr > td.partner-kontakti-akcije,
  .kartica-form:has(> #Z_Id) .card-panel-body > table.grid > tbody > tr > td:last-child {
    grid-column: 2;
    grid-row: 1;
    display: block;
    align-self: start;
    white-space: nowrap;
    text-align: right;
  }

  /* --- Partneri / Dobavljaci: nazivi kolona child tabela (= <th> u Pages/Partneri/Kartica.cshtml, Pages/Dobavljaci/
     Kartica.cshtml i Pages/Shared/_RacuniTab.cshtml — nova / promenjena kolona = promeniti i ovde) (korisnik 2026-10-08) --- */
  /* Kontakti: Ime | Funkcija | Telefon | Email | Aktivan | akcije */
  #frmPartnerKartica [data-panel="kontakti"] .partner-kontakti-grid > tbody > tr > td:nth-child(2)::before,
  #frmDobavljacKartica [data-panel="kontakti"] .partner-kontakti-grid > tbody > tr > td:nth-child(2)::before { content: "Funkcija"; }
  #frmPartnerKartica [data-panel="kontakti"] .partner-kontakti-grid > tbody > tr > td:nth-child(3)::before,
  #frmDobavljacKartica [data-panel="kontakti"] .partner-kontakti-grid > tbody > tr > td:nth-child(3)::before { content: "Telefon"; }
  #frmPartnerKartica [data-panel="kontakti"] .partner-kontakti-grid > tbody > tr > td:nth-child(4)::before,
  #frmDobavljacKartica [data-panel="kontakti"] .partner-kontakti-grid > tbody > tr > td:nth-child(4)::before { content: "Email"; }
  #frmPartnerKartica [data-panel="kontakti"] .partner-kontakti-grid > tbody > tr > td:nth-child(5)::before,
  #frmDobavljacKartica [data-panel="kontakti"] .partner-kontakti-grid > tbody > tr > td:nth-child(5)::before { content: "Aktivan"; }
  /* Adrese (samo Partneri): Naziv | Adresa | Posta i mesto | Vazi od | Glavna | akcije */
  #frmPartnerKartica [data-panel="adrese"] .partner-kontakti-grid > tbody > tr > td:nth-child(2)::before { content: "Adresa"; }
  #frmPartnerKartica [data-panel="adrese"] .partner-kontakti-grid > tbody > tr > td:nth-child(3)::before { content: "Posta i mesto"; }
  #frmPartnerKartica [data-panel="adrese"] .partner-kontakti-grid > tbody > tr > td:nth-child(4)::before { content: "Vazi od"; }
  #frmPartnerKartica [data-panel="adrese"] .partner-kontakti-grid > tbody > tr > td:nth-child(5)::before { content: "Glavna"; }
  /* Racuni (_RacuniTab): Broj racuna | Banka | Valuta | Izvor | Aktivan | akcije */
  #frmPartnerKartica [data-panel="racuni"] .partner-kontakti-grid > tbody > tr > td:nth-child(2)::before,
  #frmDobavljacKartica [data-panel="racuni"] .partner-kontakti-grid > tbody > tr > td:nth-child(2)::before { content: "Banka"; }
  #frmPartnerKartica [data-panel="racuni"] .partner-kontakti-grid > tbody > tr > td:nth-child(3)::before,
  #frmDobavljacKartica [data-panel="racuni"] .partner-kontakti-grid > tbody > tr > td:nth-child(3)::before { content: "Valuta"; }
  #frmPartnerKartica [data-panel="racuni"] .partner-kontakti-grid > tbody > tr > td:nth-child(4)::before,
  #frmDobavljacKartica [data-panel="racuni"] .partner-kontakti-grid > tbody > tr > td:nth-child(4)::before { content: "Izvor"; }
  #frmPartnerKartica [data-panel="racuni"] .partner-kontakti-grid > tbody > tr > td:nth-child(5)::before,
  #frmDobavljacKartica [data-panel="racuni"] .partner-kontakti-grid > tbody > tr > td:nth-child(5)::before { content: "Aktivan"; }
  /* Aktivnosti: Datum | Vrsta | Opis | Ko | akcije */
  #frmPartnerKartica [data-panel="aktivnosti"] .partner-kontakti-grid > tbody > tr > td:nth-child(2)::before,
  #frmDobavljacKartica [data-panel="aktivnosti"] .partner-kontakti-grid > tbody > tr > td:nth-child(2)::before { content: "Vrsta"; }
  #frmPartnerKartica [data-panel="aktivnosti"] .partner-kontakti-grid > tbody > tr > td:nth-child(3)::before,
  #frmDobavljacKartica [data-panel="aktivnosti"] .partner-kontakti-grid > tbody > tr > td:nth-child(3)::before { content: "Opis"; }
  #frmPartnerKartica [data-panel="aktivnosti"] .partner-kontakti-grid > tbody > tr > td:nth-child(4)::before,
  #frmDobavljacKartica [data-panel="aktivnosti"] .partner-kontakti-grid > tbody > tr > td:nth-child(4)::before { content: "Ko"; }

  /* --- Partneri / Dobavljaci: traka naslova taba sa tasterima (Racuni: „Osvezi sa NBS“ + „Novi“) se prelama u novi red
     umesto da izadje iz panela na uskom telefonu (~320 px); isto kao Dozvole/Kartica .partner-kontakti-title (wrap).
     Raspored tastera kao na PC-u (bez pomeranja udesno). (korisnik 2026-10-08) --- */
  #frmPartnerKartica .partner-kontakti-title { flex-wrap: wrap; row-gap: 6px; }
  #frmPartnerKartica .racuni-akcije { flex-wrap: wrap; row-gap: 6px; }

  /* --- Partneri: red Sifra | PIB | Maticni broj | Provera na SEF / NBS ostaje flex sa prelamanjem i polja po sadrzaju
     (site.css .kartica-form .partner-sef-red); stiti ga ako opste pravilo telefona .form-row rasiri na ceo red. Drzava
     (_DrzavaIzbor + rmx-select-pretraga.js) dobija inline px sirinu omotaca pri ucitavanju — ne sme preko panela
     (max-width ne treba !important, inline je samo width). (korisnik 2026-10-08) --- */
  #frmPartnerKartica .partner-sef-red {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
  }
  #frmPartnerKartica .partner-sef-red > .form-row { flex: 0 0 auto; width: auto; }
  #frmPartnerKartica .rmx-sel-pretraga { max-width: 100%; }

/* --- zajednicko (na kraju da pobedi naslov / akcije iste jacine): prazna celija se ne crta --- */
  #frmPartnerKartica .partner-kontakti-grid > tbody > tr > td:empty,
  #frmDobavljacKartica .partner-kontakti-grid > tbody > tr > td:empty,
  .kartica-form #vozilo-dok-grid > tbody > tr > td:empty,
  .kartica-form #vozilo-srv-grid > tbody > tr > td:empty,
  .kartica-form:has(> #Z_Id) .card-panel-body > table.grid > tbody > tr > td:empty { display: none; }
}

/* ---------- TELEFON — kartice: dokumenti, dozvole, servisi, beleške, podešavanja (korisnik 2026-10-08) ---------- */
/* Korisnik 2026-10-08: „pregledaj kartice na mob telefonu … prilagođeno za telefon, ne da se šeta levo-desno“.
   Samo do 700 px (ista granica kao blok „TELEFON — okvir“ i window.rmxJeTelefon u _Layout.cshtml — menjati zajedno);
   PC izgled se ne menja. Blok ide POSLE opšteg bloka kartica (B1–B9) i dopunjuje ga samo za ove stranice.
   Stranice imaju svoj <style> u body-ju (dolazi posle site.css), zato su selektori ovde namerno jači
   (.kartica-page.dozvola-kartica-lock, #frmFirmaKartica …) — ne skraćivati. Pravilo: docs/ui_toolbar.md §7f. */
@media (max-width: 700px) {

  /* --- Dokumenti /Dokumenti/Kartica (Pages/Dokumenti/Kartica.cshtml) --- */
  /* Tabela verzija (8 kolona) = kartica po verziji, kao liste na telefonu (blok „TELEFON — liste u stilu RMX TMS“):
     naslov „Verzija N“, pa nazivi i vrednosti u redu (naziv = td data-label u Pages/Dokumenti/Kartica.cshtml, isti kao
     <th>), Trošak svoj red desno, Fajl ceo red. Ranije je tabela skrolovala u okviru i sekla se (korisnik 2026-10-08
     19:25: „i ovo isečeno dole“). Glavna verzija = zelena traka levo, otvorena = boja izbora. */
  .kartica-form .dok-verzija-grid,
  .kartica-form .dok-verzija-grid > tbody { display: block; width: auto; max-width: 100%; border: 0; background: transparent; }
  .kartica-form .dok-verzija-grid > thead { display: none; }
  .kartica-form .dok-verzija-grid > tbody > tr {
    display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 14px; margin-top: 8px; padding: 9px 12px 9px 15px;
    background: #fff; border: 0; border-radius: 12px; box-shadow: inset 4px 0 0 var(--rmx-accent), 0 1px 3px rgba(0, 0, 0, 0.12);
  }
  .kartica-form .dok-verzija-grid > tbody > tr:first-child { margin-top: 0; }
  .kartica-form .dok-verzija-grid > tbody > tr.dok-verzija-glavna { box-shadow: inset 4px 0 0 #2d6a4f, 0 1px 3px rgba(0, 0, 0, 0.12); }
  .kartica-form .dok-verzija-grid > tbody > tr.is-selected { background: #ffe8cc; box-shadow: inset 4px 0 0 #e0a35a, 0 1px 3px rgba(0, 0, 0, 0.12); }
  .kartica-form .dok-verzija-grid > tbody > tr > td {
    display: flex; align-items: baseline; gap: 4px; flex: 0 1 auto; min-width: 0; max-width: 100%;
    padding: 0; border: 0; background: transparent; box-shadow: none; font-size: 12px; white-space: normal; text-align: left;
  }
  .kartica-form .dok-verzija-grid > tbody > tr > td:empty { display: none; }
  .kartica-form .dok-verzija-grid > tbody > tr > td[data-label]::before { content: attr(data-label); color: var(--rmx-muted); }
  .kartica-form .dok-verzija-grid > tbody > tr > td:first-child { flex: 1 1 100%; font-size: 13px; font-weight: 600; }
  .kartica-form .dok-verzija-grid > tbody > tr > td:first-child::before { color: var(--rmx-text); font-weight: 600; }
  /* Zelena oznaka glavne verzije je na celoj kartici (traka levo), ne na ćeliji Rb kao na PC-u. */
  .kartica-form .dok-verzija-grid > tbody > tr.dok-verzija-glavna > td:first-child { box-shadow: none; }
  .kartica-form .dok-verzija-grid > tbody > tr > td.num { flex: 1 1 100%; justify-content: space-between; }
  .kartica-form .dok-verzija-grid > tbody > tr > td.dok-verzija-fajl { flex: 1 1 100%; flex-wrap: wrap; min-width: 0; }
  .kartica-form .dok-verzija-fajl a { overflow-wrap: anywhere; }
  /* Putanja foldera (RootNapomena / folder firme) nema razmaka — lomi se umesto da gura panel (Dokumenti, Firma tab Firma). */
  .kartica-form:has(> input[name="D.FolderPrikaz"]) .card-panel-body > p.page-note,
  #frmFirmaKartica .card-panel-body > p.page-note { overflow-wrap: anywhere; }

  /* --- Dozvole /Dozvole/Kartica + /Dozvole/Razduzenje (.dozvola-kartica-lock, <style> u obe stranice) --- */
/* --- Servisi /Servisi/Kartica (Pages/Servisi/Kartica.cshtml <style>: min(32rem, 100%)) --- */
/* --- Beleške /Beleske/Kartica (site.css „Kartica Beleska“) --- */
/* --- Podešavanja → Firma /Podesavanja/Firma (#frmFirmaKartica) --- */
  /* Redovi .form-grid-4 (format broja D / I, SEF ključ, Zaključane ture, ATOL, Uplate): na PC-u 4 kolone po sadržaju
     (~500 px). Na telefonu se ređaju i prelamaju (kratka polja ostaju u redu), široko polje (ključ) preko celog reda. */
  #frmFirmaKartica .form-grid-4 {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 2mm;
  }
  #frmFirmaKartica .form-grid-4 > .form-row {
    flex: 0 1 auto;
    min-width: 0;
    max-width: 100%;
  }
  #frmFirmaKartica .form-grid-4 > .form-row-wide { flex: 1 1 100%; }
  /* .form-select (SEF mapiranje, Kurs, Nalozi) nema širinu — dug tekst opcije (~430 px) bi razvukao listu preko panela;
     .firma-sef-map je to već rešio samo za tab SEF. */
  #frmFirmaKartica .form-select { max-width: 100%; }

  /* --- Podešavanja → Prikaz /Podesavanja/Prikaz (site.css .prikaz-layout) --- */
  /* Dve kolone se već slažu ispod 900 px; minmax(0) da pregled polja (16rem) i pločice veličina ne guraju stranu. */
  .prikaz-layout { grid-template-columns: minmax(0, 1fr); }
  .prikaz-levo,
  .prikaz-desno { min-width: 0; }

  /* --- Podešavanja → Početni ekran /Podesavanja/PocetniEkran (site.css .podesavanja-widget-*) --- */
  /* Red stikera: opis preko celog reda, Poslednjih / Boja ispod — inače opis ostane u koloni ~120 px (6–7 redova). */
  .podesavanja-widget-red {
    flex-wrap: wrap;
    row-gap: 8px;
  }
  .podesavanja-widget-red > label:first-child { flex: 1 1 100%; }
}

/* ---------- TELEFON — liste na ceo slobodan prostor, bez pomeranja levo-desno (korisnik 2026-10-08) ---------- */
/* Korisnik 2026-10-08 (slika /Nalozi): „iskoristi ceo prostor za ove liste … da se lepo uklapa u ceo slobodan prostor“,
   „ne da se šeta levo-desno“. Vazi za sve liste sa .partneri-page (57 strana: Nalozi, Ture, Fakture, sifarnici,
   izvestaji …). Board / Kamioni / Pocetna / kartice nemaju .partneri-page — ovde se ne diraju. Samo do 700 px = ista
   granica kao window.rmxJeTelefon (_Layout.cshtml) i blokovi „TELEFON — …“ (menjati zajedno). PC izgled se ne menja.
   Blok ide POSLE „TELEFON — Nalozi u stilu Kamiona“ i PRE blokova koji neku listu pretvaraju u kartice (oni ga pobedjuju).
   Pravilo: docs/ui_toolbar.md §7f. */
@media (max-width: 700px) {
  /* 1) Lista do donjeg menija. Ispod liste je stajao prazan .partneri-page-bottom (prazan p#filterHint: margin 4 px +
     min-height 1.2em = 14,4 px) plus razmak flex 8 px = ~26 px sive trake iznad menija (slika /Nalozi). Kad u njemu
     nema teksta (samo skrivene forme Brisi / Uvoz / SEF …) ne zauzima mesto; „Prikazano: n / m“ (sifarnik-lista.js,
     Partneri, TekuciRacuni) se i dalje vidi dok traje pretraga. Razmak do menija ostaje 8 px = padding-bottom
     body:has(.partneri-page) .app-main (blok „Nalozi i Board kao kartice“). (korisnik 2026-10-08) */
  .partneri-page-bottom:not(:has(> :not(.hidden-form, .filter-hint:empty))) { display: none; }

  /* 2) Visok gornji deo (izvestaji: filteri + zbir koji se na telefonu lome u vise redova, Admin SEF / Uvoz): strana
     liste se pomera gore-dole umesto da dno liste ostane odseceno; levo-desno nikad. Kad sve stane, nista se ne menja —
     lista i dalje puni ostatak (.partneri-page .grid-scroll flex 1 1 auto). (korisnik 2026-10-08) */
  .partneri-page { overflow-x: hidden; overflow-y: auto; }

  /* 3) Lista koja jos nije kartica (siroka tabela): levo-desno se pomera samo kutija liste, ne strana; potez do ivice
     tabele se ne prenosi dalje. /Nalozi ima svoje overflow-x hidden (jaci selektor u bloku „Nalozi u stilu Kamiona“).
     (korisnik 2026-10-08) */
  .partneri-page .grid-scroll { overflow: auto; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; }

  /* 4) Bela kutija liste sa ivicom kao na PC-u (.panel) i na /Nalozi — da se vidi da lista puni prostor do menija.
     „.partneri-page #listaScroll { transparent; border 0 }“ iz bloka „Nalozi i Board kao kartice“ bilo je za kartice
     /Nalozi, a skidalo je okvir svim listama. Lista koja na telefonu postane kartice sa providnom pozadinom: dodati njen
     id tabele u :not(…) ili je njen blok (posle ovog) pobedjuje. (korisnik 2026-10-08) */
  .partneri-page:not(:has(#tblNalozi)) #listaScroll {
    background: #fff;
    border: 1px solid var(--rmx-edge);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
  }

  /* 5) Traka liste (Novi · Izmena … · filteri · Pretraga · ▲▼ osvezi izvoz iz rmx-izvoz-liste.js) se lomi u vise redova
     umesto da izlazi van ekrana (.partneri-page je odsece, dugmad nedostupna). Grupe dobijaju min-width 0; polja sa
     sirinom u style= (Izvodi 32rem, Kartica kupca / dobavljaca 24rem, Prikaz / Mesec po 18rem) ne prelaze red.
     (korisnik 2026-10-08) */
  .partneri-page-top,
  .partneri-page-top .toolbar { min-width: 0; max-width: 100%; }
  .partneri-page-top .toolbar > :is(form, span, div, label),
  .partneri-page-top :is(.toolbar-levo-red, .sluzbena-period, .toolbar-when-selected) > :is(form, span, div, label),
  .partneri-page-top .izvestaj-label { min-width: 0; max-width: 100%; }
  .partneri-page-top :is(.toolbar-levo-red, .sluzbena-period, .toolbar-when-selected, .toolbar-search, .toolbar-desno) {
    flex-wrap: wrap;
  }
  .partneri-page-top .toolbar select,
  .partneri-page-top .toolbar input:not([type="checkbox"]):not([type="radio"]),
  .partneri-page-top .toolbar .rmx-sel-pretraga { max-width: 100% !important; }
  /* Pretraga zauzme ostatak reda (kao na /Nalozi); polje sme uze od PC 200 / 220 px na uskom telefonu (320 px). */
  .partneri-page-top .toolbar-search { flex: 1 1 14rem; min-width: 0; margin-right: 0; }
  .partneri-page-top .toolbar-search .search-field { flex: 1 1 auto; min-width: 0; }
  .partneri-page-top .search-field #txtPretraga { width: 100%; min-width: 0; }
}

/* ---------- TELEFON — lista se završava na poslednjem redu kad je redova malo (korisnik 2026-10-08: „ova lista kao i sve
   druge osim ako nemaju redove treba da popune ekran dole“) ---------- */
/* Lista raste do donjeg menija (blok iznad) samo dok ima redova; sa malo redova se zavrsava na poslednjem (flex 0 1 auto)
   umesto prazne bele kutije do dna. min-height 120 px = osnovno .partneri-page .grid-scroll (ne nestaje ispod visokog
   gornjeg dela). Isto pravilo kao spisak rokova na Pocetnoj (blok „TELEFON — Pocetna: spisak rokova do dna“). */
@media (max-width: 700px) {
  .partneri-page .grid-scroll { flex: 0 1 auto; }
}

/* ========== TELEFON — liste kao kartice (korisnik 2026-10-08: „ove ture sve da budu u karticama kao i ostali deo aplikacije
   ne ovako kao na desktopu“, „i sve u mobilnoj aplikaciji da se prilagodi“; za /Angazovani „da sve u stilu rmx-a vodi računa
   da tako bude“) ==========
   Sve liste sa .partneri-page (Ture, Angazovani, Fakture, Ulazne, sifarnici, izvestaji, Kartica kupca / dobavljaca, Admin …)
   do 700 px izgledaju kao /Nalozi i Kamioni na telefonu: jedna bela tabla (ivica --rmx-edge, krivina --rmx-radius-panel),
   trake meseca / grupe = tamna traka naslova kao .kam-naslov, svaki red = blok: podebljan naslov gore („21/4-26 · SA218ZK /
   AG441SA“), ispod poravnati redovi naziv / vrednost (naziv sivo u koloni 70 px kao .kam-kv / NALOG PREGLED). Nista se ne
   pomera levo-desno. Bez novih boja (sve vec postoji u site.css).
   Tabela ostaje ista (isti JS izbora / pregleda / pretrage / sort / izvoz) — CSS samo crta redove drugacije. Nazive kolona
   upisuje skript „Telefon — liste kao kartice“ u Pages/Shared/_Layout.cshtml (menjati zajedno): td[data-label] = naslov kolone
   iz <thead> (th data-tel-label = kraci naziv samo za telefon), td[data-tel] = naslov / naslov2 / kv, tabela
   data-tel-naslov = kolone naslova (npr. Ture „1 4“ = Broj · Vozilo). Tabela liste = direktno dete .grid-scroll (kartice odmah,
   bez cekanja JS-a) ili table.grid.lista-tel (JS: ostale tabele strane sa vise od 3 kolone). Nije ovde: /Nalozi (#tblNalozi —
   svoja celija .nalog-tel, blok „Nalozi u stilu Kamiona“), Board, Kamioni, Pocetna, kartice za unos, ugnjezdene tabele u
   pregledu ispod reda, tabele sa klasom .tel-svoja-kartica (lista ima svoju karticu na telefonu — redizajn E 2026-10-10,
   npr. Podaci naloga; JS u _Layout ih isto preskace). Samo do 700 px = window.rmxJeTelefon (_Layout <head>) i ostali blokovi „TELEFON — …“ (menjati zajedno);
   PC izgled se ne menja. Blok ide POSLE „TELEFON — liste na ceo slobodan prostor …“ i „… lista se završava na poslednjem redu“:
   za liste-kartice zamenjuje tacku 3 (kutija ne skroluje levo-desno) i dopunjuje tacku 4 (bela tabla + krivina).
   Pravilo: docs/ui_toolbar.md §7f. */
@media (max-width: 700px) {
  /* --- 1) Kutija liste: bela tabla RMX (kao .kam-lista); kartice staju u sirinu, pa nema pomeranja levo-desno (siroka
     tabela u pregledu ispod reda skroluje samo u svom okviru, tacka 7). padding-bottom 0: 72 px iz bloka „Nalozi i Board
     kao kartice“ (.partneri-page #listaScroll) je prostor iznad narandzastog + samo na /Nalozi — ostale liste ga nemaju,
     bela tabla se zavrsava na poslednjem redu. --- */
  .partneri-page .grid-scroll:has(> table.grid:not(#tblNalozi, .tel-svoja-kartica)) {
    background: #fff;
    border: 1px solid var(--rmx-edge);
    border-radius: var(--rmx-radius-panel);
    padding-bottom: 0;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* --- 2) Tabela → blokovi. width / min-width !important: stranice imaju svoju sirinu tabele (Fakture #listaScroll
     table.grid min-width 68rem, Admin SEF style max-width). Zaglavlje kolona se ne vidi — naziv kolone je uz vrednost. --- */
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica),
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody {
    display: block;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > thead,
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > colgroup { display: none; }

  /* --- 3) Red = blok (kao .kam-red): naslov gore, pa redovi naziv / vrednost; redovi odvojeni --rmx-row-alt, bez zebre.
     Grupe (trake meseca / Aktivni / Kamioni …) i pregled ispod reda imaju svoja pravila (tacke 6 i 7). --- */
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:not(.partner-detail-row, .uvoz-detail-row, .lista-grupa-red, .tracking-grupa, .vozila-grupa) {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 2px 0;
    padding: 9px 12px;
    background: #fff;
    border-top: 1px solid var(--rmx-row-alt);
  }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:first-child,
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:is(.lista-grupa-red, .tracking-grupa, .vozila-grupa) + tr { border-top: 0; }
  /* Sklopljen mesec (RmxListaSekcije, site.css .u-sklopu) ostaje sakriven — pravilo reda iznad je jace od opsteg. Pretraga
     sakriva inline style (jaca od ovog bloka). */
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:is(.u-sklopu, [hidden]) { display: none; }
  /* Izabran red i dodir = #ffe8cc kao /Nalozi na telefonu i sivi tasteri (!important: site.css izabran red ima !important). */
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:is(.is-selected, .row-selected) { background: #ffe8cc !important; }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:not(.partner-detail-row, .uvoz-detail-row, .lista-grupa-red, .tracking-grupa, .vozila-grupa):active { background: #ffe8cc; }
  /* Znacenje reda koje je na PC-u boja celija (td) prelazi na ceo blok — iste boje kao site.css / stranica: Beleske kasni /
     podsetnik, privremeno DKV / MOL, umetnut red akcize, zbir i sumarno Zarade vozaca (tamna traka, bela slova), rok u
     Rokovniku (ivica levo, na PC-u prva celija). */
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr.row-beleska-kasni { background: #fdecea; }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr.row-beleska-podsetnik { background: #fff6e0; }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr.row-privremeno { background: #fff6d6; }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr.akciza-umetnut { background: #f1f3f5; }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:is(.zarade-ukupno, .zarade-vrsta) { background: var(--rmx-tamna-izabrano); }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr[data-rok-nivo]:not([data-rok-nivo=""]) { box-shadow: inset 3px 0 0 var(--rokovnik-rok-boja); }

  /* --- 4) Celija = red „naziv | vrednost“ (kao .kam-kv): naziv = ::before iz data-label u koloni 70 px, vrednost do kraja
     reda. Flex (ne grid): vrednost moze biti tekst + loptica statusa / ikonice posade / link — ostaju u istom redu.
     !important: stranice daju celijama sirinu / padding / poravnanje (Fakture col-*, Ture Datum obr. text-align center). --- */
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:not(.partner-detail-row, .uvoz-detail-row, .lista-grupa-red, .tracking-grupa, .vozila-grupa) > td {
    display: flex;
    align-items: baseline;
    column-gap: 4px;
    flex: 1 1 100%;
    order: 0;
    min-width: 0;
    max-width: 100%;
    width: auto !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.35;
    text-align: left !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
    overflow: hidden;
  }
  /* Prazna celija se ne vidi (kao prazni redovi na Kamionima). */
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:not(.partner-detail-row, .uvoz-detail-row, .lista-grupa-red, .tracking-grupa, .vozila-grupa) > td:empty { display: none !important; }
  /* Podebljanje reda ostaje samo gde nosi podatak: dug u izvestajima (.row-dug) i status aktivne ture / naloga (PC: ceo red
     bold, ui_toolbar.md §3c — na kartici samo vrednost Status, ostalo mirno kao Kamioni). */
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr.row-dug > td,
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr.row-status-aktivan > td.status-cell { font-weight: 600; }

  /* Naziv kolone. Rokovnik: ::before celije Stanje je loptica roka (site.css #tblLista … .rokovnik-stanje-cell::before), zato
     tu naziv ide u ::after sa order -1 (isto mesto levo). */
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:not(.partner-detail-row, .uvoz-detail-row, .lista-grupa-red, .tracking-grupa, .vozila-grupa) > td[data-label]:not([data-tel="naslov"], [data-tel="naslov2"], .rokovnik-stanje-cell)::before,
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:not(.partner-detail-row, .uvoz-detail-row, .lista-grupa-red, .tracking-grupa, .vozila-grupa) > td.rokovnik-stanje-cell[data-label]:not([data-tel="naslov"], [data-tel="naslov2"])::after {
    content: attr(data-label);
    order: -1;
    /* 100 px (bilo 70): nazivi „Datum polaska“, „Predjeno (KM)“ u jednom redu — kartica niza (korisnik 2026-10-08:
       „zato se dole ne vidi niti jedna cela kartica“). */
    flex: 0 0 100px;
    margin-right: 4px;
    color: var(--rmx-muted);
    font-size: 12px;
    font-weight: 400;
    font-style: normal;
    text-align: left;
    white-space: normal;
    overflow-wrap: anywhere;
  }
  /* Kolona bez naziva (npr. link „kartica zarade →“): vrednost od leve ivice, bez prazne kolone naziva. */
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:not(.partner-detail-row, .uvoz-detail-row, .lista-grupa-red, .tracking-grupa, .vozila-grupa) > td[data-label=""]:not([data-tel="naslov"], [data-tel="naslov2"], .rokovnik-stanje-cell)::before { content: none; }
  /* Iznosi / brojevi (td.num) desno (memorija korisnika 2026-10-06: decimalni iznosi UVEK desno): naziv levo, vrednost uz
     desnu ivicu reda. */
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:not(.partner-detail-row, .uvoz-detail-row, .lista-grupa-red, .tracking-grupa, .vozila-grupa) > td.num[data-label]:not([data-tel="naslov"], [data-tel="naslov2"])::before { margin-right: auto; }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:not(.partner-detail-row, .uvoz-detail-row, .lista-grupa-red, .tracking-grupa, .vozila-grupa) > td.num[data-label=""] { justify-content: flex-end; }
  /* Tamni redovi Zarade vozaca (tacka 3): naziv svetlo sivo kao drugi deo .kam-naslov. */
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:is(.zarade-ukupno, .zarade-vrsta) > td::before { color: #c5cad1 !important; }

  /* --- 5) Naslov kartice (kao „broj · nalogodavac“ na /Nalozi): prva kolona, ili kolona iz data-tel-naslov / prva
     neprazna (JS data-tel="naslov"); pre JS-a prva celija. Drugi deo naslova (data-tel="naslov2", npr. vozilo ture) u istom
     redu posle „ · “. Jedan red, „…“ kad je dugacko. --- */
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:not(.partner-detail-row, .uvoz-detail-row, .lista-grupa-red, .tracking-grupa, .vozila-grupa) > :is(td[data-tel="naslov"], td:first-child:not([data-tel])) {
    display: block;
    order: -2;
    flex: 0 1 auto;
    max-width: 100%;
    margin-bottom: 1px;
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap !important;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:not(.partner-detail-row, .uvoz-detail-row, .lista-grupa-red, .tracking-grupa, .vozila-grupa) > td[data-tel="naslov2"] {
    display: block;
    order: -1;
    flex: 1 1 0;
    min-width: 0;
    margin-bottom: 1px;
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap !important;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:not(.partner-detail-row, .uvoz-detail-row, .lista-grupa-red, .tracking-grupa, .vozila-grupa) > td[data-tel="naslov2"]::before { content: "\00a0\00b7\00a0"; }
  /* Sa drugim delom naslova prvi deo najvise ~3/5 reda, da se vidi i drugi (broj ture je ionako kratak). */
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:has(> td[data-tel="naslov2"]:not(:empty)) > td[data-tel="naslov"] { max-width: 62%; }

  /* --- 6) Trake grupa = tamna traka naslova kao .kam-naslov / /Nalozi na telefonu: zlatne trake meseca (Ture, Angazovani,
     Fakture, Ulazne, Placanja), Aktivni / Neaktivni (Zaposleni), dan (Tracking), Kamioni / Prikolice (Vozila). Klik sklapa /
     otvara kao i do sada (trougao ▼ / ▶ iz site.css ostaje, boja slova). Sakrivanje prazne trake posle pretrage je inline
     style (jace). --- */
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:is(.lista-grupa-red, .tracking-grupa, .vozila-grupa) {
    display: block;
    padding: 0;
    border: 0;
    background: transparent;
  }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:is(.lista-grupa-red, .tracking-grupa, .vozila-grupa) > td {
    display: block;
    padding: 7px 12px !important;
    border: 0 !important;
    background: linear-gradient(180deg, var(--rmx-tamna-vrh) 0%, var(--rmx-tamna) 100%) !important;
    color: #e8eaed !important;
    font-size: 13px;
    font-weight: 650;
    text-decoration: none;
    text-align: left;
  }

  /* --- 7) Pregled ispod reda (klik na red) preko cele sirine kartice; siroka tabela / polja u njemu skroluju samo u svom
     okviru (ne strana). Nazivi u pregledu kao naziv / vrednost iznad (kolona 70 px, levo). Polja Angazovani / Ulazne /
     Dozvole (.nalog-fld, PC fiksne sirine 7–14rem) se prelamaju dva u red. --- */
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:is(.partner-detail-row, .uvoz-detail-row) {
    display: block;
    padding: 0;
    border-top: 0;
    background: #fff;
  }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:is(.partner-detail-row, .uvoz-detail-row) > td {
    display: block;
    width: auto !important;
    max-width: 100%;
    padding: 0 !important;
    border-top: 0;
    border-left: 0;
    border-right: 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    white-space: normal;
  }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:is(.partner-detail-row, .uvoz-detail-row) .row-detail { padding: 8px 12px 12px; }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:is(.partner-detail-row, .uvoz-detail-row) .preview-row { grid-template-columns: 70px minmax(0, 1fr); gap: 8px; }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:is(.partner-detail-row, .uvoz-detail-row) .preview-label { text-align: left; }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:is(.partner-detail-row, .uvoz-detail-row) :is(.tura-preview-panel, .preview-grid) { min-width: 0; overflow-x: auto; }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:is(.partner-detail-row, .uvoz-detail-row) .row-detail :is(.nalozi-pregled-kompakt, .nalozi-pregled-desno, .dozvole-pregled-kompakt) { flex-wrap: wrap; }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:is(.partner-detail-row, .uvoz-detail-row) .row-detail .nalozi-pregled-desno { flex: 1 1 100%; margin-left: 0; }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:is(.partner-detail-row, .uvoz-detail-row) .row-detail :is(.nalozi-pregled-kompakt, .nalozi-pregled-desno, .dozvole-pregled-kompakt) > .nalog-fld {
    flex: 1 1 8rem;
    min-width: 0;
    max-width: 100%;
  }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:is(.partner-detail-row, .uvoz-detail-row) .row-detail .nalozi-pregled-2 { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- TELEFON — objašnjenje ispod naslova i vrh izveštaja (korisnik 2026-10-08: „mnogo ova gore polja zauzimaju
   prostora… zato se dole ne vidi niti jedna cela kartica“, „oni label objašnjenja gore ispod naslova su totalno nepotrebna
   u celom programu na telefonu“) ---------- */
/* Samo do 700 px (rmxJeTelefon, blokovi TELEFON — …); PC se ne menja. */
@media (max-width: 700px) {
  /* Recenica ispod naslova strane (.page-note u .page-head) se ne vidi; ostaje kad nosi link / taster (kartice: „← Nazad
     na listu · Id …“, faktura uz nalog). */
  .page-head > .page-note:not(:has(a, button)) { display: none; }

  /* Filter izvestaja (.izvestaj-filter: Izvestaji vozac / kamion / sumarno / DKV / MOL / putarine, Kartica kupca /
     dobavljaca, Zarada vozaca, Refakcija, Sluzbena …): naziv levo uz polje, a ne iznad; izbor (vozac, kamion…) ceo red,
     dva datuma u jednom redu, Prikazi + ikonice (osvezi, izvoz) u sledecem. */
  .partneri-page .izvestaj-filter { gap: 6px 8px; margin: 4px 0; padding: 6px 8px; align-items: center; }
  .izvestaj-filter .izvestaj-label { flex-direction: row; align-items: center; gap: 6px; font-size: 12px; min-width: 0; }
  .izvestaj-filter .izvestaj-label:has(select) { flex: 1 1 100%; }
  .izvestaj-filter .izvestaj-label:has(select) .form-input { flex: 1 1 auto; min-width: 0; }
  /* Dva datuma dele jedan red (pola - pola); Prikazi i ikonice prelaze u sledeci red (inace se prvi datum skupi na ikonicu). */
  .izvestaj-filter .izvestaj-label:has(input[type="date"]) { flex: 1 1 calc(50% - 4px); }
  .izvestaj-filter .izvestaj-label .form-input-date,
  .izvestaj-filter .izvestaj-label .rmx-date-wrap { flex: 1 1 auto; width: auto; min-width: 0; max-width: none; }
  .izvestaj-filter .izvestaj-label > span { flex: 0 0 auto; white-space: nowrap; }
  /* Zbirovi ispod filtera (Ukupno, Kartica zarade) zbijeniji. */
  .partneri-page .izvestaj-sum { gap: 2px 12px; padding: 6px 10px; margin: 4px 0; font-size: 13px; }

  /* Izvestaj: cela strana se pomera gore-dole (vrh odlazi sa ekrana), tabela / kartice u punoj visini — kao Board na
     telefonu. Obicne liste (bez .izvestaj-filter) ostaju lista do donjeg menija. */
  .partneri-page:has(.izvestaj-filter) .grid-scroll { flex: 0 0 auto; max-height: none; min-height: 0; overflow: visible; }
}

/* ========== TELEFON — liste u stilu RMX TMS (korisnik 2026-10-08: „ovi tasteri na telefonu ne izgledaju baš idealno“,
   „da se može sortirati … taster pa meni mali sortiraj po“, izvoz liste „neka ga ipak … možda zatreba“, „uprosti … da ne bude
   komplikovano i prenatrpano“, „sve što je u meniju … da se slova vide lepo … ni pretrpano a ni previše sitno“, slika RMX TMS
   Drivers „ovo mi se svidelo“, Kamioni „vidiš koliko je ovo ružnije“, „zadrži ipak veličinu fonta“) ==========
   Traka liste: prvi red Pretraga · ⇅ Sortiraj · ⤓ Izvoz, Novi = narandžasti krug dole desno (kao /Nalozi), broj zapisa uz
   naslov („13 od 15“). Taster ⇅, spisak „Sortiraj po“, prelom reda (.tel-red-kraj) i broj (.tel-broj) pravi
   wwwroot/js/rmx-tel-sort.js (menjati zajedno) — samo u traci koja ima pretragu liste (#frmPretraga, klasa .tel-traka); izveštaji sa
   serverskim filterom se ne menjaju. Na telefonu se ne vide Traži (pretraga radi slovo po slovo, Enter i dalje šalje),
   ▲ ▼ i Osveži. Ostali elementi trake ispod prvog reda, Izmena / Brisanje izabranog reda poslednji red.
   Kartice: svaki zapis = bela zaobljena kartica sa senkom i tamnom trakom levo (izabran = narandžasta traka), nazivi i
   vrednosti teku u redu; iznosi (td.num) i dalje svaki u svom redu desno (ui_toolbar.md §10). Trake grupa / meseci =
   tamna zaobljena traka (ne zlatna). Isto za /Nalozi i stranice Kamioni / tura / strana naloga (.kam-*). Veličine slova
   ostaju kao do sada. Samo do 700 px = window.rmxJeTelefon (_Layout.cshtml) i ostali TELEFON blokovi; PC se ne menja.
   Pravilo: docs/ui_toolbar.md §7f. */
.tel-sort-btn,
.tel-sort-meni,
.tel-red-kraj,
.tel-broj { display: none; }

@media (max-width: 700px) {
  /* --- Traka liste (.tel-traka = traka sa #frmPretraga, stavlja rmx-tel-sort.js) --- */
  .partneri-page-top :is(#btnScrollTop, #btnScrollBottom, #btnOsveziListu),
  .partneri-page-top .toolbar.tel-traka #btnTrazi { display: none !important; }
  .partneri-page-top .toolbar.tel-traka { gap: 6px; }
  /* Redosled: Pretraga · ⇅ · ⤓ (prvi red), sve ostalo ispod (6), Izmena / Brisanje poslednje (7); filter tipa na /Nalozi
     ostaje iznad pretrage (0). .toolbar-desno sa ⤓ je poslednji u DOM-u (rmx-izvoz-liste.js), zato CSS order. */
  .partneri-page-top .toolbar.tel-traka > * { order: 6; }
.partneri-page-top .toolbar.tel-traka > .toolbar-search { order: 2; flex: 1 1 6rem; min-width: 0; margin: 0; }
.partneri-page-top .toolbar.tel-traka > .toolbar-search #txtPretraga { height: 38px; border-radius: 10px; }
  .partneri-page-top .toolbar > .tel-sort-btn { order: 3; display: inline-flex; flex: 0 0 38px; width: 38px; height: 38px; border-radius: 10px; }
  .partneri-page-top .toolbar.tel-traka > .toolbar-desno { order: 4; flex: 0 0 auto; margin: 0; }
  .partneri-page-top .toolbar.tel-traka > .toolbar-desno #btnIzvozListe { width: 38px; height: 38px; border-radius: 10px; }
  .partneri-page-top .toolbar > :is(.tel-sort-btn, .toolbar-desno) .btn-ico { width: 18px; height: 18px; }
  .partneri-page-top .toolbar > .tel-sort-btn[aria-expanded="true"] { background: #ffe8cc; border-color: #e0a35a; color: #8a4b00; }
  /* Prelom posle prvog reda; margin -6px poništava prazan razmak reda (gap). */
  .partneri-page-top .toolbar > .tel-red-kraj { order: 5; display: block; flex: 0 0 100%; height: 0; margin-top: -6px; }
  .partneri-page-top .toolbar.tel-traka > .toolbar-when-selected { order: 7; flex: 1 1 100%; }
  /* Izmena / Brisanje izabranog reda = samo ikonica (olovka / ×), bez teksta — korisnik 2026-10-09 („umesto tastera možeš
     smanjiti na + ili olovka isto na mob telefonu“; Novi je već narandžasti krug). Tekst ostaje u tasteru (font-size 0,
     čitač ekrana); samo standardni tasteri .btn-hover-izmena / .btn-hover-brisi (ostali u grupi imaju svoj tekst). */
  .partneri-page-top .toolbar.tel-traka > .toolbar-when-selected > :is(a, button).btn-secondary-rmx:is(.btn-hover-izmena, .btn-hover-brisi) {
    font-size: 0;
    gap: 0;
    min-width: 44px;
    height: 40px;
    padding: 0 10px;
    justify-content: center;
  }
  .partneri-page-top .toolbar.tel-traka > .toolbar-when-selected > :is(a, button):is(.btn-hover-izmena, .btn-hover-brisi) .btn-ico { width: 20px; height: 20px; }
/* Novi = narandžasti krug dole desno (isto kao /Nalozi u bloku „Nalozi i Board kao kartice“ — menjati zajedno). */
  .partneri-page-top .toolbar.tel-traka > :is(a, button)[data-kbd="novi"],
  .partneri-page-top .toolbar.tel-traka > .toolbar-levo-red > :is(a, button)[data-kbd="novi"] {
    position: fixed; right: 16px; bottom: calc(var(--rmx-tel-dole) + 16px); z-index: 1550;
    width: 54px; height: 54px; padding: 0; border-radius: 50%; justify-content: center; font-size: 0;
    color: #fff; background: #ff9a2e; border-color: #ff9a2e; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
  }
  .partneri-page-top .toolbar.tel-traka > :is(a, button)[data-kbd="novi"] svg,
  .partneri-page-top .toolbar.tel-traka > .toolbar-levo-red > :is(a, button)[data-kbd="novi"] svg { width: 26px; height: 26px; }
  /* Službena putovanja (korisnik 2026-10-08 19:53, slika: „i ovi tasteri i datum polja su sjebani“): Novi je u
     .toolbar-levo-red zajedno sa periodom — isti narandžasti krug (pravilo iznad); period = naziv iznad polja, datumi
     pola-pola (ikonica kalendara više ne prekriva datum), Prikaži ceo red. Pages/Sluzbena/Index.cshtml #frmPeriod. */
  .partneri-page-top .toolbar.tel-traka > .toolbar-levo-red { flex: 1 1 100%; flex-wrap: wrap; gap: 6px; min-width: 0; }
.partneri-page-top .toolbar.tel-traka .sluzbena-period .izvestaj-label :is(.form-input-date, .rmx-date-wrap) { width: 100%; max-width: none; }
/* Prostor ispod poslednje kartice da je narandžasti krug ne pokrije. */
  .partneri-page:has(.partneri-page-top .toolbar.tel-traka) .grid-scroll:has(> table.grid) { padding-bottom: 72px; }
  /* Broj zapisa uz naslov („13 od 15“). */
  .tel-broj { display: inline; margin-left: 10px; color: var(--rmx-muted); font-size: 13px; font-weight: 400; }
  /* Spisak „Sortiraj po“ ispod ⇅ (top postavlja rmx-tel-sort.js prema mestu tastera). Slova 14 px, stavka 40 px za prst. */
  .partneri-page-top .toolbar > .tel-sort-meni {
    display: block; position: absolute; top: 50px; right: 10px; z-index: 60;
    min-width: 210px; max-width: calc(100% - 20px); max-height: 60vh; overflow-y: auto; padding: 6px;
    background: #fff; border: 1px solid var(--rmx-edge); border-radius: 12px; box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);
  }
  .partneri-page-top .toolbar > .tel-sort-meni[hidden] { display: none; }
  .tel-sort-naslov { padding: 6px 10px 4px; font-size: 13px; color: var(--rmx-muted); }
  .tel-sort-stavka {
    display: flex; justify-content: space-between; align-items: center; gap: 10px; width: 100%; min-height: 40px;
    padding: 0 10px; border: 0; border-radius: 8px; background: transparent; color: var(--rmx-text);
    font: inherit; font-size: 14px; text-align: left; cursor: pointer;
  }
  .tel-sort-stavka:active,
  .tel-sort-stavka.is-aktivna { background: #ffe8cc; color: #8a4b00; font-weight: 600; }

  /* --- Kartice zapisa: kutija liste bez bele table, svaki zapis svoja kartica na sivoj pozadini. --- */
  .partneri-page .grid-scroll:has(> table.grid:not(#tblNalozi, .tel-svoja-kartica)),
  .partneri-page:not(:has(#tblNalozi)) #listaScroll:has(> table.grid),
  .partneri-page:has(#tblNalozi) #listaScroll { background: transparent; border: 0; border-radius: 0; box-shadow: none; }
  /* border 0 !important: tačka 3 bloka „liste kao kartice“ crta liniju između redova. Senka bez !important: red roka u
     Rokovniku zadržava svoju obojenu traku levo (data-rok-nivo). Pozadinu ne diramo (obojeni redovi: beleška kasni,
     privremeno, akciza …). */
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:not(.partner-detail-row, .uvoz-detail-row, .lista-grupa-red, .tracking-grupa, .vozila-grupa) {
    margin-top: 8px;
    padding: 9px 12px 9px 15px;
    border: 0 !important;
    border-radius: 12px;
    box-shadow: inset 4px 0 0 var(--rmx-accent), 0 1px 3px rgba(0, 0, 0, 0.12);
  }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:is(.is-selected, .row-selected) {
    box-shadow: inset 4px 0 0 #e0a35a, 0 1px 3px rgba(0, 0, 0, 0.12);
  }
  /* /Nalozi: blok „Nalozi u stilu Kamiona“ ima box-shadow none !important — zato ovde !important. */
.partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:first-child,
  .partneri-page #tblNalozi tbody tr:first-child { margin-top: 0; }
  /* Nazivi i vrednosti teku u redu (kao RMX TMS): naslov kartice sam u prvom redu (prelom = tr::after posle naslova),
     ostali parovi koliko staju; naziv bez fiksne kolone. Iznos (td.num) ostaje ceo red, vrednost desno. */
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:not(.partner-detail-row, .uvoz-detail-row, .lista-grupa-red, .tracking-grupa, .vozila-grupa)::after {
    content: ""; order: -1; flex: 0 0 100%; height: 0;
  }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:not(.partner-detail-row, .uvoz-detail-row, .lista-grupa-red, .tracking-grupa, .vozila-grupa) > td:not(.num, [data-tel="naslov"], [data-tel="naslov2"], :first-child:not([data-tel])) {
    flex: 0 1 auto;
    margin-right: 14px;
  }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:not(.partner-detail-row, .uvoz-detail-row, .lista-grupa-red, .tracking-grupa, .vozila-grupa) > td[data-label]:not([data-tel="naslov"], [data-tel="naslov2"], .rokovnik-stanje-cell)::before,
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:not(.partner-detail-row, .uvoz-detail-row, .lista-grupa-red, .tracking-grupa, .vozila-grupa) > td.rokovnik-stanje-cell[data-label]:not([data-tel="naslov"], [data-tel="naslov2"])::after {
    flex: 0 0 auto;
  }
  /* Trake grupa / meseca (Kamioni / Prikolice, meseci, Aktivne / Završene ture …) = tamna zaobljena traka (korisnik
     2026-10-08: „stavi u tamno umesto zlatno“, „ove grupe“ — ne zlatna .lista-grupa-zlatna ni običan naslov); klik i dalje
     sklapa. Red (tr) bez pozadine, da se zlatna ne vidi iza krivine. */
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:is(.lista-grupa-red, .tracking-grupa, .vozila-grupa),
  .partneri-page #tblNalozi tbody tr.lista-grupa-red { margin-top: 14px; }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:first-child:is(.lista-grupa-red, .tracking-grupa, .vozila-grupa),
  .partneri-page #tblNalozi tbody tr.lista-grupa-red:first-child { margin-top: 0; }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:is(.lista-grupa-red, .tracking-grupa, .vozila-grupa) > td,
  .partneri-page #tblNalozi tbody tr.lista-grupa-red > td {
    padding: 7px 12px !important;
    background: linear-gradient(180deg, var(--rmx-tamna-vrh) 0%, var(--rmx-tamna) 100%) !important;
    color: #e8eaed !important;
    border-radius: 8px;
  }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:is(.lista-grupa-red, .tracking-grupa, .vozila-grupa),
  .partneri-page #tblNalozi tbody tr.lista-grupa-red { background: transparent !important; }
  /* Pregled ispod reda (sifarnik-lista.js ga ubaci posle izabranog reda): kartica bez donje krivine, pregled je nastavlja. */
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:has(+ tr:is(.partner-detail-row, .uvoz-detail-row)) {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
  }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:is(.partner-detail-row, .uvoz-detail-row) {
    margin-top: 0;
    border-top: 1px dashed var(--rmx-edge);
    border-radius: 0 0 12px 12px;
    box-shadow: inset 4px 0 0 #e0a35a, 0 1px 3px rgba(0, 0, 0, 0.12);
    overflow: hidden;
  }

}

/* ========== SPAJALICA — link na fajl (korisnik 2026-10-08: „treba ikonica za te linkove da se vidi“, izbor „1 spajalica“,
   „B — link kao fajl“) ==========
   Crtež = Pages/Shared/_IkonaSpajalica.cshtml (.ikona-spajalica). Mesta: kartica dokumenta (ime fajla verzije, i Drive link),
   Rokovnik (kolona Fajl, siv taster kao ostali .btn-icon-rmx), Početna na telefonu (taster desno u redu „Ističe u 30 dana“).
   Link = RokovnikStavka.FajlUrl / handler Fajl na /Dokumenti (Drive = redirect). Siva, mirna — ne takmiči se sa crvenim
   „isteklo“. */
.kartica-form .dok-verzija-fajl a .ikona-spajalica { width: 14px; height: 14px; margin-right: 3px; vertical-align: -2px; }
/* ========== TELEFON — dodir i pokret (korisnik 2026-10-10: „uradi a + d“ — pregled telefona po Vercel web-design-guidelines) ==========
   Samo do 700 px = window.rmxJeTelefon (_Layout.cshtml <head>) i ostali TELEFON blokovi (menjati zajedno); PC se ne menja.
   Fioka i dijalozi (.app-sidebar, .confirm-overlay, .print-overlay) vec imaju overscroll-behavior: contain (blokovi
   „TELEFON — okvir“ / „TELEFON — kartice: osnova“). Pravilo: docs/ui_toolbar.md §7f red „Dodir i pokret“. */
@media (max-width: 700px) {
  /* Bljesak pri dodiru: umesto plavog (Android Chrome) svetlo narandzasti RMX (#ff9a2e = hover bocnog menija; na beloj
     pozadini kao #ffe8cc tastera). Nasledjuje se na sve elemente. */
  html { -webkit-tap-highlight-color: rgba(255, 154, 46, 0.22); }
  /* Tasteri, linkovi, polja: dupli dodir ne zumira stranu (iOS) i dodir se ne zadrzava cekajuci drugi; zum sa dva prsta
     ostaje (manipulation). Namerno NE na redove liste (tr) — dupli dodir reda = Izmena (ui_toolbar §6) ostaje kako jeste.
     Rucke za prevlacenje (touch-action: none na .home-sticker-head / .board-razdelnik) su klase — jace, nepromenjene. */
  a, button, input, select, textarea, label, summary, [role="button"] { touch-action: manipulation; }
  /* Spiskovi koji sami skroluju (predlozi pretrage .partner-typeahead-list — rmx-select-pretraga.js, „Sortiraj po“ —
     rmx-tel-sort.js, meni Beleska — _Layout.cshtml): na kraju spiska ne pomera se strana iza niti krece povlacenje za
     osvezavanje (Android) — isto kao fioka i dijalozi. */
  .partner-typeahead-list,
  .tel-sort-meni,
  .beleska-meni { overscroll-behavior: contain; }
}
/* Smanjeno kretanje (podesavanje telefona „Ukloni animacije“ / „Smanji pokrete“): fioka menija se otvara i zatvara bez
   klizanja (isti selektori kao u bloku „TELEFON — okvir“, ovde kasnije u fajlu = jaci). Spiner cekanja (.print-wait-spin,
   ui_toolbar §7d) se namerno vrti i dalje — bez njega bi „Snimam…“ izgledalo kao da je program stao. */
@media (max-width: 700px) and (prefers-reduced-motion: reduce) {
  body.shell-mode-sidebar .app-sidebar,
  html.rmx-mob-meni body.shell-mode-sidebar .app-sidebar { transition: none; }
}

/* ========== TELEFON — polja 16 px i mete za prst (korisnik 2026-10-10: „uradi 1 + 2“ posle pregleda RMX_Loads blok
   „PHONE — touch & reading“; pravila: skill .cursor/skills/rmx-telefon) ==========
   Samo do 700 px = window.rmxJeTelefon (_Layout.cshtml <head>) i ostali TELEFON blokovi (menjati zajedno); PC se ne menja.
   1) Polje sa tekstom manjim od 16 px: iPhone (Safari i aplikacija sa ikonice) uvelica stranu kad se dodirne polje i ostane
      uvelicana. 2) Mete za prst: tasteri i polja >= 40 px, stavke menija 44 px, kvacice 20 px (isto RMX_Loads; Apple 44 pt,
   Material 48 dp). Pravilo: docs/ui_toolbar.md §7f red „Polja i mete za prst“. */
@media (max-width: 700px) {
  /* 1 · Tekst u svakom polju za unos 16 px. :not() daju jacinu 0,5,1 — pobedjuju klasna pravila (.form-input inherit,
     .login-body .login-input 15 px, .tura-stavke-grid / .dnevnice-title-akcije .form-input). Labele, liste i meni ostaju
     po /Podesavanja/Prikaz — menja se samo tekst u polju. */
  input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]),
  select:not([multiple]):not([hidden]),
  body textarea:not([hidden]) { font-size: 16px; }
  /* fieldset je inace sirok koliko najsire polje (min-width: min-content) — sa vecim poljima bi izasao van ekrana
     (RMX_Loads 2026-10-10: 386 px na 375). Kartice to vec imaju (blok „TELEFON — kartice: osnova“); ovde za sve ostalo. */
  fieldset { min-width: 0; }

  /* 2a · Polja >= 40 px (osnova .form-input 28 px) van tabela: kartica, traka liste, dijalog, prijava. U celiji tabele 36 px
     (tabela skroluje u svom okviru, red ne sme biti previsok). Skriveni nativni datum .rmx-date-native (1 x 1 px ispod
     prikaza datuma, _Layout) se ne dira. min-height pobedjuje height stranica (traka liste 36 / 38 px → 40). */
  :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]):not(.rmx-date-native), select:not([multiple])):not(td *) {
    min-height: 40px;
  }
  td :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]):not(.rmx-date-native), select:not([multiple])) {
    min-height: 36px;
  }

  /* 2b · Tasteri >= 40 px (osnova 28 px): Snimi / Odustani, DA / NE, Novi / Izmena, tasteri u panelima i tabovi kartice.
     .btn-icon-rmx (olovka, ×, ⇅, ⤓, spajalica) 40 x 40. Traka tabova (.tura-tab: Ture, Partneri, Dobavljaci, Dozvole,
     Firma …) se i dalje prelama u vise redova (blok „TELEFON — kartice: osnova“). */
  :is(.btn-primary-rmx, .btn-secondary-rmx, .btn-danger-rmx) { min-height: 40px; }
  .btn-icon-rmx { min-width: 40px; min-height: 40px; }
  .btn-back { display: inline-flex; align-items: center; min-height: 40px; }
  .tura-tab { min-height: 40px; }
/* × u pretrazi liste: znak isti (16 px), polje za dodir 36 x 36 umesto 20 x 20; tekst pretrage ne ide ispod njega. */
  .search-field .search-clear { width: 36px; height: 36px; right: 2px; }
  .search-field #txtPretraga { padding-right: 40px; }

  /* 2c · Stavke fioke menija 44 px: glavne (.app-side-link / .app-side-summary, osnova min 40) i podstavke (.app-side-sub a,
     bilo 10 + 10 px = ~36). line-height 20 px staje i za najveci meni iz Prikaza (16 px). */
  :is(.app-side-link, .app-side-summary) { min-height: 44px; }
  .app-side-sub a { padding-top: 12px; padding-bottom: 12px; line-height: 20px; }

  /* 2d · Kvacice i radio 20 px (osnova ~13 px; .grid input.chk-zavrseno 16 px — :not([hidden]) daje istu jacinu 0,2,1,
     kasnije u fajlu = jace; znak ✓ ostaje 11 px u sredini). */
  input:is([type="checkbox"], [type="radio"]):not([hidden]) { width: 20px; height: 20px; }
}

/* ========== TELEFON — redizajn E: osnova (korisnik 2026-10-10: slika 4 ekrana, od 6 kombinacija boja „E sivo“ = siva podloga
   kao PC, grafitna traka, bele kartice sa sivom ivicom, zeleno za glavne radnje; „hajde da vidim kako to izgleda lokalno“) ==========
   Samo do 700 px = window.rmxJeTelefon (_Layout.cshtml <head>) i ostali TELEFON blokovi (menjati zajedno); PC se ne menja.
   Tacka povratka: git tag pre-redizajn-telefona. Skill .cursor/skills/rmx-telefon, docs/ui_toolbar.md §7f red „Redizajn E“. */
@media (max-width: 700px) {
  /* Donji meni (_Layout .app-donji-meni): svetao kao statusna traka PC-a (#f2f3f5 / ivica --rmx-edge), izabrano = siva
     „pilula“ (#dde2e8 = --rmx-row-sel ton) sa tamnim tekstom; ranije taman sa narandzastim izabranim (blok „TELEFON — okvir“). */
  .app-donji-meni { background: #f2f3f5; border-top: 1px solid var(--rmx-edge); }
  .app-donji-meni a,
  .app-donji-meni button { color: var(--rmx-muted); }
  .app-donji-meni .active,
  html.rmx-mob-meni #btnMobVise { color: var(--rmx-charcoal); font-weight: 600; background: #dde2e8; border-radius: 10px; margin: 5px 3px; }
  /* Novi = zeleni krug (E: zeleno kao taster Novi na PC-u, --rmx-green) umesto narandzastog — isti selektori kao blokovi
     „TELEFON — Nalozi i Board kao kartice“ i „TELEFON — liste u stilu RMX TMS“ (ovde kasnije u fajlu = jace). */
  .partneri-page:has(#tblNalozi) .toolbar > a[data-kbd="novi"],
  .board-page .board-nalog-toolbar > a[data-kbd="novi"],
  .partneri-page-top .toolbar.tel-traka > :is(a, button)[data-kbd="novi"],
  .partneri-page-top .toolbar.tel-traka > .toolbar-levo-red > :is(a, button)[data-kbd="novi"] {
    color: #fff; background: var(--rmx-green); border-color: var(--rmx-green);
  }
}

/* --- Kamioni redizajn E, dopuna (korisnik 2026-10-10: „ostaviti kako je, uz kratko objašnjenje kad se dodirne“, „to sada
   treba usaglasiti kada sam kliknuo iz Kamiona“) --- */
/* ========== TELEFON — Početna redizajn E (korisnik 2026-10-10: „da kreni na pocetnu ovo mi se dopada“, slika 4 ekrana E) ==========
   Pages/Index.cshtml .home-tel. Samo do 700 px = rmxJeTelefon i ostali TELEFON blokovi; PC (stikeri) se ne menja. Gore tamni
   panel sa pozdravom (.home-tel-glava, kao .kam-e-glava na Kamionima), plocice: ikonica levo iznad broja (ranije sivo gore
   desno, varijanta 1 od 2026-10-08), zelena kad ima utovara danas, narandzasta kad isticu rokovi; rokovi: broj dana kao oznaka
   (crveno do 7, narandzasto do 20, sivo posle — klase u Index.cshtml), traka naslova ravna #3a434e. */
@media (max-width: 700px) {
  .home-tel-glava {
    flex: 0 0 auto; display: flex; flex-direction: column; gap: 1px; margin: 0 0 8px; padding: 12px 14px;
    background: var(--rmx-tamna); color: #fff; border-radius: var(--rmx-radius-panel);
  }
  .home-tel-glava span { font-size: 12px; color: var(--rmx-gray-light); }
  .home-tel-glava b { font-size: 20px; font-weight: 600; line-height: 1.2; }
}

/* ========== TELEFON — Početna: cela strana skroluje (korisnik 2026-10-10, slika: „nije problem koliko god da se stavi ovih
   plocica ali je vise problem sto se one ne skroluju jer su fiksno postavljene pa mi samo to promeni za sada“) ==========
   Ponistava blok „TELEFON — Pocetna: spisak rokova do dna“ (2026-10-08: strana zakljucana na visinu ekrana, pomera se samo
   spisak rokova u svom okviru — sa visim plocicama redizajna E ostajao je 1 red). Sada isto kao Beleske / Board na
   telefonu: pomera se ceo dokument (pozdrav, plocice, rokovi), donji meni (fixed) lezi preko, dno ima mesta za meni.
   Samo do 700 px = rmxJeTelefon i ostali TELEFON blokovi; PC (stikeri) se ne menja. Blok na kraju fajla = jaci. */
@media (max-width: 700px) {
  body:has(.home-tel),
  body:has(.home-tel) .app-body { height: auto; overflow: visible; }
  body:has(.home-tel) .app-shell,
  body:has(.home-tel) .app-content,
  body:has(.home-tel) .app-main { overflow: visible; }
  body:has(.home-tel) .app-main { padding-bottom: calc(var(--rmx-tel-dole) + 12px); }
  .home-page:has(.home-tel),
  .home-page-content:has(.home-tel),
  .home-tel { flex: none; min-height: 0; }
}

/* ========== TELEFON — izabrana kartica + pregled u jednom narandzastom okviru (korisnik 2026-10-10, slika Sluzbena: „treba
   taj ram narandzaste boje da obuhvati ceo okvir ovog sto je selektovan, mislim da bi bilo lepse“) ==========
   Do sada: izabrana kartica i pregled ispod nje (sifarnik-lista.js) imali su narandzastu samo ivicu levo (inset 4px #e0a35a,
   blok „liste u stilu RMX TMS“). Sada okvir (ivica) 2 px sa svih strana: izabrana kartica gore + bocno (dno kad je pregled
   otvoren ide na pregled), pregled bocno + dole — izgleda kao jedna celina. Ista boja #e0a35a (= ivica izabranog / taster ⇅).
   Opste liste + Podaci naloga (#tblSabloni, svoja kartica). Samo do 700 px = rmxJeTelefon i ostali TELEFON blokovi. */
@media (max-width: 700px) {
  /* Prava ivica (ne inset senka): siva pozadina celije pregleda (.row-detail / td) prekrivala je senku reda — okvir se nije
     video oko pregleda (korisnik 2026-10-10 slika: „ne radi boja za ceo okvir“). border !important: blok „liste u stilu RMX
     TMS“ daje redu border 0 !important. */
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:is(.is-selected, .row-selected) {
    border: 2px solid #e0a35a !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
  }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:is(.is-selected, .row-selected):has(+ tr:is(.partner-detail-row, .uvoz-detail-row)) {
    border-bottom: 0 !important;
  }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:is(.partner-detail-row, .uvoz-detail-row) {
    border: 2px solid #e0a35a !important;
    border-top: 1px dashed var(--rmx-edge) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
  }
}

/* ========== TELEFON — naslov kartice bez tacke (korisnik 2026-10-10: „kod vozaca treba gore lepo da pise ime i prezime“) ==========
   Tabela sa data-tel-naslov-spoj="razmak" (Pages/Zaposleni/Index.cshtml: data-tel-naslov="2 1" = Ime pa Prezime): drugi deo
   naslova ide posle razmaka umesto „ · “ (blok „TELEFON — liste kao kartice“ tacka 5) i prvi deo nije skracen na 62 %. */
@media (max-width: 700px) {
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica)[data-tel-naslov-spoj="razmak"] > tbody > tr > td[data-tel="naslov2"]::before { content: "\00a0"; }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica)[data-tel-naslov-spoj="razmak"] > tbody > tr > td[data-tel="naslov"] { max-width: none; }
}

/* ========== Link u pregledu ispod reda (korisnik 2026-10-10: „linkovi da se vide kao ikonica ne kao tekst“) ==========
   wwwroot/js/sifarnik-lista.js previewVal: vrednost koja je ceo http(s) link = <a class="rmx-fajl-cip preview-link"> — od
   2026-10-29 (korisnik „ovi linkovi treba da budu ikonice klikabilne“, „sve liste“) i na PC-u čip: papir + naziv polja (Drive fajl
   u našem prozoru). Telefon: samo ikonica u tasteru 36 x 36 (kao spajalica roka na Pocetnoj .home-tel-fajl), tekst sakriven. */
.preview-link { color: inherit; text-decoration: none; overflow-wrap: anywhere; }
.preview-link:hover { text-decoration: underline; }
.preview-link-ico { display: none; }
@media (max-width: 700px) {
  .preview-link {
    display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 9px;
    border: 1px solid #c3c9d0; background: #eef0f2; color: #1a4f8a;
  }
  .preview-link:active { background: #ffe8cc; border-color: #e0a35a; color: #8a4b00; }
  .preview-link-tekst { display: none; }
  .preview-link-ico { display: block; width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
}

/* ========== TELEFON — pregled ispod reda: skroluje samo siroka tabela, ne cela kartica (korisnik 2026-10-10, slika Sluzbena
   188/26: „treba da se skroluju na stranu samo kretanja dole ne cela kartica“) ==========
   Do sada je celija pregleda imala overflow-x auto (blok „TELEFON — liste kao kartice“ tacka 7) — kad je tabela Kretanja /
   Troskovi sira od ekrana, vodoravno se pomerao ceo pregled (polja gore i okvir). Sada: celija ne skroluje, svaka tabela u
   pregledu (.row-detail table) je blok sa svojim vodoravnim skrolom (thead / tbody ostaju tabela — anonimni omotac).
   Opste liste + Podaci naloga; samo do 700 px = rmxJeTelefon i ostali TELEFON blokovi. */
@media (max-width: 700px) {
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:is(.partner-detail-row, .uvoz-detail-row) > td,
  .partneri-page #tblSabloni > tbody > tr.partner-detail-row > td { overflow-x: hidden; }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr:is(.partner-detail-row, .uvoz-detail-row) .row-detail table,
  .partneri-page #tblSabloni > tbody > tr.partner-detail-row .row-detail table {
    display: block; width: auto; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain;
  }
}

/* ZAPOSLENI — mobilna aplikacija (korisnik 2026-10-11, slika _tmp/predlog_zaposleni_app.png): kolona „App“ na listi = zelena
   ikonica telefona (varijanta 2) kad zaposleni ima aktivan nalog (Vozac.ImaAplikaciju); na kartici polje lozinke sa tackicama kao
   placeholder kad je lozinka vec postavljena (varijanta A) — tackice tamnije od obicnog placeholdera da lice na upisano polje. */
.lozinka-postavljena::placeholder { color: #4a5462; opacity: 1; letter-spacing: 2px; }
.lozinka-hint { display: block; margin: 2px 0 0; font-size: calc(var(--rmx-font-size) - 2px); }

/* TURA — tab „Dokumenti“ (VZ-F2, korisnik 2026-10-10, slika predloga 4): broj na tabu (ceka odluku), sličica prijave, Odobri
   zeleno / Odbij crveno na prelaz (paleta tastera ui_toolbar.md), pregled PDF-a u ramu. Pages/Ture/Dokumenti.cshtml + Kartica.cshtml. */
.tura-tab-broj { display: inline-block; min-width: 18px; margin-left: 4px; padding: 0 6px; border-radius: 999px; background: #fff4e0;
  color: #6b4200; font-size: calc(var(--rmx-font-size) - 2px); font-weight: 600; line-height: 18px; text-align: center; }
.tura-tab-broj[hidden] { display: none; }
/* Link fajla sa blagom ikonicom (korisnik 2026-10-16, predlog_pregled_link.png varijanta B) — pregled ture tab Dokumenti
   (Pages/Ture/Index.cshtml). Siva ikonica lista papira, plavo ime kao .tdok-link. */
.fajl-link { color: var(--rmx-link); text-decoration: var(--rmx-link-podvlaka); }
.fajl-link:hover { text-decoration: underline; }
.fajl-ik { display: inline-block; width: 12px; height: 14px; margin-right: 5px; vertical-align: -2px; }
.fajl-ik svg { width: 12px; height: 14px; display: block; fill: #eef1f4; stroke: #8a96a3; stroke-width: 1; }
.fajl-ik svg path + path { fill: none; }
/* PRAVA — radnje (korisnik 2026-11-03, prava = modul × radnja, Data/Moduli.cs). FirmaScopePageFilter stavi na body
   (_Layout.cshtml) klasu rmx-bez-{radnja} za svaku radnju koju korisnik NEMA na modulu strane — sakriju se njeni tasteri:
   unos = Novi (btn-hover-novi), izmena = Izmena na listi i Snimi na kartici (Snimi na novoj kartici sakriva rmx-bez-unos —
   kartica bez prava izmene je samo za čitanje), brisanje = Brisanje, štampa = Štampa / izvoz meni, izvoz = Izvoz filtrirane liste.
   Odustani ostaje. Server svejedno odbija radnju (FirmaScopePageFilter → Moduli.RadnjaZahteva). Jedini mehanizam — nema drugog.
   Traka .rmx-pravo-traka: plutajuća poruka posle odbijene radnje ispod gornje trake (ne pomera raspored kartice). */
body.rmx-bez-unos .btn-hover-novi,
body.rmx-bez-izmena .btn-hover-izmena,
body.rmx-bez-izmena .kartica-actions button[type="submit"],
body.rmx-bez-izmena .card-actions button[type="submit"],
body.rmx-bez-brisanje .btn-hover-brisi,
body.rmx-bez-stampa .btn-hover-stampa:not(#btnIzvozListe),
body.rmx-bez-izvoz #btnIzvozListe { display: none !important; }
.rmx-pravo-traka { margin: 4px 0 8px; padding: 6px 10px; border: 1px solid #f0b866; border-radius: var(--rmx-radius-panel, 8px);
  background: #fff4e0; color: #6b4200; font-size: var(--rmx-font-size); }
/* Plutajuca traka nestane posle 6 s (ne pokriva naslov strane stalno); poruka je i u dnevniku servera ako treba. */
.rmx-pravo-plutajuca { position: fixed; top: 42px; left: 50%; transform: translateX(-50%); z-index: 950; margin: 0;
  max-width: calc(100vw - 32px); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12); pointer-events: none;
  animation: rmxPravoNestaje 0.4s ease-in 6s forwards; }
@keyframes rmxPravoNestaje { to { opacity: 0; visibility: hidden; } }

/* KORISNICI I ULOGE (kao RMX_Web KU-F2) — Pages/Korisnici, Pages/Uloge: tabovi Korisnici / Uloge (linkovi kao .tura-tab),
   neaktivan nalog / uloga sivo, tabela prava na kartici uloge (kor-prava: grupa menija, kolone radnji kor-k sa kvačicama). */
.kor-tabovi { margin: 0 0 6px; }
.kor-tabovi a.tura-tab { text-decoration: none; display: inline-block; }
tr.kor-neaktivan td { color: var(--rmx-muted, #8a9099); }
.kor-firme { width: auto; min-width: 60%; }
.kor-firme select.form-input { min-width: 220px; }
.kor-prava { width: 100%; }
.kor-prava th.kor-k, .kor-prava td.kor-k { text-align: center; width: 110px; }
.kor-prava tr.kor-grupa td { background: #eef0f3; font-weight: 600; padding-top: 8px; }

/* POSLOVNA GODINA (KU-F2b, korisnik 2026-10-10) — godina u gornjoj traci je link na Podesavanja → Poslovna godina (_Layout.cshtml);
   boja ostaje (bela / crvena .app-godina-ranija). Dijalog pitanja pri snimanju iznad svih prozora i spinera. Strana izbora godine. */
a.app-godina { text-decoration: none; cursor: pointer; }
a.app-godina:hover { text-decoration: underline; }
.rmx-godina-dlg { z-index: 10050; }
.rmx-godina-nepitaj { display: flex; align-items: center; gap: 6px; margin: 4px 0 10px; font-size: var(--rmx-font-size); }
.godina-izbor { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.godina-dugme { min-width: 110px; }
.godina-dugme.on { background: #ffe8cc; border-color: #f0b866; font-weight: 600; }
.godina-dugme.ranija { color: #c0392b; }
.godina-panel { max-width: 640px; }

/* ========== TELEFON — traka naslova od ivice do ivice (korisnik 2026-10-11: „svidelo ovo sa naslovom u traci umesto u ovim
   poljima … izmenio i u RMX_Web mobilnoj aplikaciji“, slika _tmp/predlog_pocetna_traka.png → „B može“, „da u svim zameni“) ==========
   Isto kao zaglavlje aplikacije vozaca (.voz-glava): traka odmah ispod gornje trake, od ivice do ivice (minus padding .app-main
   na telefonu 10 px — blok „TELEFON — okvir“, menjati zajedno), levo datum + veliki naslov (#b4bcc5), desno gore oznaka strane
   (.tel-traka-strana — kao „Čeka potvrdu“ kod vozaca). Pocetna: .home-tel-glava, naslov strane „Pocetna“ iznad se ne crta.
   Samo do 700 px = rmxJeTelefon; PC (stikeri) se ne menja. */
@media (max-width: 700px) {
  .home-page:has(.home-tel) .page-head { display: none; }
  .home-tel-glava {
    position: relative; margin: -10px -10px 8px; padding: 12px 14px 13px; border-radius: 0;
    background: linear-gradient(180deg, var(--rmx-tamna-vrh) 0%, var(--rmx-tamna) 100%); border-bottom: 1px solid #000;
  }
  .home-tel-glava b { color: #b4bcc5; padding-right: 88px; }
  .tel-traka-strana {
    position: absolute; top: 11px; right: 12px; padding: 2px 10px; border: 1px solid var(--rmx-tamna-ivica); border-radius: 10px;
    background: var(--rmx-tamna-izabrano); color: #e8eaed; font-size: 12px; font-weight: 600; line-height: 1.4;
  }
  .home-tel-glava .tel-traka-strana { color: #e8eaed; font-size: 12px; }
}

/* EMAIL — sabloni i potpis (EM-F1, korisnik 2026-10-11, slika _tmp/predlog_email.png): tekst sa oznakama levo, pregled
   kao u emailu desno (Calibri 11 pt kao Outlook potpis uzora). Pages/Podesavanja/EmailPotpis + Firma tab Email,
   pregled crta wwwroot/js/rmx-email-tekst.js. Telefon: jedan ispod drugog. */
.email-sablon-red { display: flex; gap: 12px; align-items: stretch; margin-top: 6px; }
.email-sablon-red > .form-row { flex: 1 1 0; min-width: 0; }
/* globalni .form-input je 28px visok — tekst sablona / potpisa je polje za pisanje (kao Beleska Opis). */
.kartica-form textarea.email-sablon-polje, textarea.email-sablon-polje { width: 100%; max-width: 100%; height: auto; min-height: 12rem;
  padding: 6px 8px; font-family: Consolas, "Cascadia Mono", monospace; font-size: 12px; line-height: 1.4; resize: vertical; }
.email-pregled { flex: 1 1 0; min-width: 0; margin-top: 16px; border: 1px solid var(--rmx-edge); border-radius: var(--rmx-radius-panel);
  background: #fff; padding: 10px 12px; font-family: Calibri, Arial, sans-serif; font-size: 11pt; line-height: 1.35; color: #1a1f26;
  overflow-wrap: anywhere; }
.email-pregled a { color: var(--rmx-link); }
@media (max-width: 700px) {
  .email-sablon-red { flex-direction: column; }
  .email-pregled { margin-top: 0; }
}

/* Podešavanja → Firma → Email: polje „Logo za email“ (2026-10-12) — pregled loga na beloj podlozi u visini prikaza u emailu (48 px). */
.email-logo-polje { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.email-logo-okvir { display: inline-flex; align-items: center; min-height: 60px; min-width: 120px; padding: 6px 10px; background: #fff;
  border: 1px solid var(--rmx-edge); border-radius: var(--rmx-radius-panel); }
.email-logo-okvir img { height: 48px; width: auto; display: block; }
.email-logo-okvir img[hidden] { display: none; }
/* Logo na dokumentima (Podešavanja → Firma, 2026-10-15, slika _tmp/predlog_stampa_2/predlog_logo_firma.png): red = naziv + gde
   se koristi | okvir slike + Izaberi sliku / Ukloni (isti okvir kao Logo za email). */
.dok-logo-red { display: grid; grid-template-columns: 220px 1fr; gap: 6px 14px; align-items: center; padding: 8px 0;
  border-bottom: 1px solid #e3e6ea; }
.dok-logo-naziv { font-weight: 600; }
.dok-logo-gde { font-size: 11.5px; color: #5d6670; margin-top: 2px; line-height: 1.35; }
.dok-logo-zag img { height: 56px; }
.dok-logo-prazno { color: #8a929b; font-size: 12px; font-style: italic; }
.dok-logo-prazno[hidden] { display: none; }
@media (max-width: 700px) { .dok-logo-red { grid-template-columns: 1fr; } }

/* Prozor „Nova poruka“ iznad pregleda štampe (.print-overlay z-index 85) — EM-F3: email se otvara iz pregleda fakture / naloga (2026-10-12). */
#tdokEmailDlg, #emPorukaWait { z-index: 95; }
/* Prilog u prozoru „Nova poruka“: dupli klik otvara pregled (2026-10-12); pregled priloga iznad prozora poruke. */
#emPrilogPregled { z-index: 97; }

/* ========== TELEFON — meni u boji menija (korisnik 2026-10-13: „glavni meni na telefonu da bude isti kao što je odabrano —
   one boje menija“, slika _tmp/predlog_tel_meni_boja.png varijanta C) ==========
   Fioka „Više“: izabrana strana / grupa = tekst + crta levo u boji menija (na PC-u se boja vidi pod mišem, telefon miša nema).
   Donji meni: taman kao gornji meni PC-a (#262d36), izabrano = tamno polje (#2f3742) + tekst i crta ispod u boji menija.
   Boje samo kroz --rmx-meni-* (blok „BOJA MENIJA“, ShellMenu.Boje) — menjati zajedno. Zamenjuje svetao donji meni iz bloka
   „TELEFON — redizajn E: osnova“ (ovaj blok je kasnije u fajlu = jači). Granica 700 px = window.rmxJeTelefon. */
@media (max-width: 700px) {
  .app-side-link.active,
  .app-side-sub a.active,
  .app-side-summary.active-group {
    background: var(--rmx-mpod-izabrano);
    color: var(--rmx-meni-tekst);
    box-shadow: inset 3px 0 0 var(--rmx-meni-crta);
  }
  .app-donji-meni { background: var(--rmx-tamna-meni); border-top: 1px solid #000; }
  .app-donji-meni a,
  .app-donji-meni button { color: #a8b0b8; }
  .app-donji-meni .active,
  html.rmx-mob-meni #btnMobVise {
    color: var(--rmx-meni-tekst);
    font-weight: 600;
    background: var(--rmx-tamna-polje);
    border-radius: 10px;
    margin: 5px 3px;
    box-shadow: inset 0 -3px 0 var(--rmx-meni-crta);
  }
}

/* ========== TELEFON — lista: cela strana skroluje (korisnik 2026-10-15, Samsung S25: SEF ulazne „na telefonu ne skroluje
   dole uopšte“, „mora da se skroluje cela strana“) ==========
   Visok gornji deo (istorija, filteri stanja, traka) ostavljao je listi samo min 120 px (#listaScroll flex 0 1 auto) — prst
   je pomerao tu malu kutiju. ISTI obrazac kao „TELEFON — Beleške: cela strana skroluje“ (2026-10-09, S25) i „Početna“
   (2026-10-10): bez okvira liste sa svojim skrolom — pomera se ceo dokument, donji meni (fixed) leži preko, dno ima mesta za
   meni. Uz klasu tel-strana-skrol na .partneri-page (sada Pages/UlazneFakture/Sef.cshtml); ostale liste nepromenjene.
   JS: sifarnik-lista.js skrolBox() (izabrani red u vidljivi deo, ▲ ▼ — skroluje dokument) — menjati zajedno. PC se ne menja. */
@media (max-width: 700px) {
  body:has(.tel-strana-skrol),
  body:has(.tel-strana-skrol) .app-body { height: auto; overflow: visible; }
  body:has(.tel-strana-skrol) .app-shell,
  body:has(.tel-strana-skrol) .app-content,
  body:has(.tel-strana-skrol) .app-main { overflow: visible; }
  body:has(.tel-strana-skrol) .app-main { display: block; padding-bottom: calc(var(--rmx-tel-dole) + 12px); }
  .partneri-page.tel-strana-skrol { display: block; overflow: visible; }
  .partneri-page.tel-strana-skrol > * + * { margin-top: 8px; }
  .partneri-page.tel-strana-skrol .grid-scroll {
    flex: none;
    max-height: none !important;
    height: auto !important;
    min-height: 0;
    overflow: visible !important;
  }
}

/* TRAKA LISTE — spojene strelice (korisnik 2026-10-13, slika predlog_traka_liste „3“, „izmeni kod svih“): ▲ ▼ su
   tanke SVG strelice (rmx-izvoz-liste.js strelica()) u jednom okviru .strelice-par (pravi ga placeChrome — menjati zajedno);
   ↻ i izvoz ostaju posebni uokvireni tasteri. Varijanta D bez okvira vazi samo za tamnu traku tacke naloga (blok ispod).
   Telefon: strelice su sakrivene (blok „TELEFON — Traka liste“), pa i prazan okvir. */
.strelice-par {
  display: inline-flex;
  border: 1px solid var(--rmx-edge);
  border-radius: var(--rmx-radius-panel);
  overflow: hidden;
  background: #e8eaed;
}
.strelice-par > .btn-icon-rmx {
  width: 26px;
  height: 26px;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.strelice-par > .btn-icon-rmx + .btn-icon-rmx { border-left: 1px solid var(--rmx-edge); }
.strelice-par > .btn-icon-rmx:hover { background: #ffe8cc; color: #8a4b00; }
@media (max-width: 700px) {
  .partneri-page-top .strelice-par { display: none !important; }
}

/* ========== PROZOR ŠTAMPE — predlog A (korisnik 2026-10-14 „A uradi“, slika _tmp/predlog_stampa/predlog_prozor_stampe_A.png)
   Zajednički deo Pages/Shared/_StampaPregled.cshtml (Models/StampaPregled.cs; prvo /Fakture). Tamna traka kao gornja traka
   programa; zlatno = boja menija (--rmx-meni-*, blok „BOJA MENIJA“) — nikad fiksna boja, prati izbor korisnika. Dokument =
   list na sivoj podlozi. Od 2026-10-15 (korisnik „da, ovako uradi za sve prozore pregleda i štampe“) svi prozori štampe
   (_StampaPregled) i pregleda fajla (_FajlPregled, Models/FajlPregled.cs) — nov prozor pregleda / štampe = jedan od ta dva
   dela, ne nov ram. Telefonski pregled fajla preko celog ekrana (_Layout, rmxFajlPregled) ostaje svoj. */
.sp-prozor > .sp-box {
  width: min(1100px, 98vw);
  height: min(94vh, 1100px);
  background: #fff;
  border: 0;
  border-radius: 10px;
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.45);
}
.sp-prozor .sp-bar {
  justify-content: flex-start;
  gap: 16px;
  min-height: 60px;
  padding: 10px 12px 10px 16px;
  background: var(--rmx-traka-meni);
  border-bottom: 0;
  /* Crta u boji menija na vrhu prozora — gornja ivica se vidi i na tamnoj pozadini (korisnik 2026-10-15: „na crnoj površini se
     ne vidi lepo ivica prozora u gornjem delu“ → varijanta B, „diskretno je i uklapa se“; slika
     _tmp/predlog_stampa_2/predlog_ivica_prozora.png). Važi za štampu i pregled fajla (oba .sp-prozor). */
  border-top: 3px solid var(--rmx-traka-akcent-crta);
}
.sp-ttl { display: flex; align-items: center; gap: 11px; min-width: 0; }
.sp-ik {
  width: 34px; height: 34px; flex: none;
  display: grid; place-items: center;
  border-radius: 8px;
  background: var(--rmx-traka-polje);
  color: var(--rmx-traka-akcent-crta);
}
.sp-ik svg { width: 19px; height: 19px; }
.sp-ttl-tekst { min-width: 0; }
.sp-prozor .sp-naslov { color: var(--rmx-traka-tekst-jak); font-size: calc(var(--rmx-font-size) + 2px); font-weight: 600; white-space: nowrap; }
.sp-pod {
  color: var(--rmx-traka-akcent);
  font-size: calc(var(--rmx-font-size) - 1px);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  max-width: 320px;
}
.sp-seg { display: flex; flex: none; padding: 3px; border-radius: 8px; background: var(--rmx-traka); }
.sp-seg-btn {
  padding: 6px 15px;
  border: 0; border-radius: 6px;
  background: transparent;
  color: var(--rmx-traka-tekst-sivi);
  font: inherit; font-size: var(--rmx-font-size);
  cursor: pointer;
}
.sp-seg-btn:hover:not(:disabled) { color: var(--rmx-traka-akcent); }
.sp-seg-btn.on { background: var(--rmx-traka-izabrano); color: var(--rmx-traka-tekst-jak); box-shadow: inset 0 -2px 0 var(--rmx-traka-akcent-crta); }
.sp-akcije { margin-left: auto; display: flex; align-items: center; gap: 8px; flex: none; }
.sp-btn {
  height: 32px;
  padding: 0 13px;
  display: inline-flex; align-items: center; gap: 7px;
  border: 1px solid var(--rmx-traka-akcent-crta);
  border-radius: 8px;
  background: transparent;
  color: var(--rmx-traka-akcent);
  font: inherit; font-size: var(--rmx-font-size);
  cursor: pointer;
}
.sp-btn svg, .sp-x svg { width: 16px; height: 16px; flex: none; }
.sp-btn:hover:not(:disabled) { background: var(--rmx-traka-izabrano); }
.sp-btn.sp-glavni { background: var(--rmx-traka-akcent-crta); color: #1e242c; font-weight: 600; }
.sp-btn.sp-glavni:hover:not(:disabled) { background: var(--rmx-traka-akcent-crta); filter: brightness(1.1); }
.sp-btn:disabled, .sp-seg-btn:disabled { opacity: 0.45; cursor: default; }
.sp-btn[hidden], .sp-seg-btn[hidden] { display: none !important; }
.sp-sep { width: 1px; height: 28px; margin: 0 4px; background: var(--rmx-traka-sep); }
.sp-x {
  width: 34px; height: 34px;
  display: grid; place-items: center;
  border: 0; border-radius: 8px;
  background: transparent;
  color: var(--rmx-traka-tekst-sivi);
  cursor: pointer;
}
.sp-x:hover { background: var(--rmx-traka-izabrano); color: var(--rmx-traka-akcent); }
.sp-btn:focus-visible, .sp-seg-btn:focus-visible, .sp-x:focus-visible { outline: 2px solid var(--rmx-traka-akcent-crta); outline-offset: 2px; }
/* List na sivoj podlozi: A4 (210 mm) + skrol ≈ 840 px; koverta C5 položeno (229 mm) šira — .sp-siroko. */
.sp-prozor .sp-telo { align-items: center; padding-top: 16px; background: #d5d9de; }
.sp-prozor .sp-list { width: min(840px, calc(100% - 24px)); box-shadow: 0 2px 10px rgba(0, 0, 0, 0.25); }
.sp-box.sp-siroko .sp-list { width: min(900px, calc(100% - 24px)); }
/* A4 položeno (putni nalog ture; rmxStampaPregled.polozeno, korisnik 2026-10-15 „ovako uradi za sve prozore … štampe“):
   širi prozor i list preko cele širine. */
.sp-prozor > .sp-box.sp-polozeno { width: min(1240px, 98vw); }
.sp-box.sp-polozeno .sp-list, .sp-box.sp-puna .sp-list { width: calc(100% - 24px); }
/* Široka tabela (korisnik 2026-10-27, knjiga ulaznih — PNG _tmp/predlog_knjiga_prozor): prvo 98 % × 88 %, pa isti dan „ipak
   treba nešto kraći i uži“ → „stavi na 90% i 70% visina“ (98 % je zalazio pod levi meni). Uključuje strana:
   rmxStampaPregled.sirokaTabela (Pages/Shared/_StampaPregled.cshtml). Telefon ostaje kao blok „TELEFON — prozor štampe“
   (zato samo iznad 700 px). */
@media (min-width: 701px) {
  .sp-prozor > .sp-box.sp-siroka-tabela { width: 90vw; height: 70vh; }
  .sp-box.sp-siroka-tabela .sp-list { width: calc(100% - 24px); }
}
/* Pregled FAJLA (_FajlPregled, .sp-fajl) — ceo prostor prozora, bez sive podloge sa strana i gore (korisnik 2026-10-16: „možda je
   i rešenje dovoljno da samo bude korišćen ceo prostor tog pregleda bez ovih sivih sa strana“ — položen PDF / slika se uklopi u
   ceo prozor). Automatsko prepoznavanje položene strane probano i odbačeno (neki PDF-ovi se ne prepoznaju, fajl bi se preuzimao
   dvaput). Prozor ŠTAMPE (_StampaPregled) ostaje A4 list na sivom. Telefon već ovako (blok ispod). */
.sp-prozor.sp-fajl .sp-telo { padding-top: 0; }
.sp-prozor.sp-fajl .sp-list { width: 100%; box-shadow: none; }
/* Uvećanje u pregledu fajla (korisnik 2026-10-16, PNG _tmp/predlog_zoom — „može A“): − · procenat · + · Po širini u traci;
   _FajlPregled JS menja širinu rama (pregledač PDF-a uklapa stranu po širini rama). Šire od prozora = ram uz levu ivicu i skrol
   levo-desno (sredina bi odsekla levi deo); uže = ram na sredini. Telefon: tasteri se ne prikazuju. */
.sp-seg[hidden], .sp-sep[hidden] { display: none !important; }
.sp-zoom .sp-seg-btn { padding: 6px 10px; }
.sp-zoom .sp-seg-btn svg { width: 15px; height: 15px; vertical-align: -3px; }
.sp-zoom .sp-zoom-pct { min-width: 56px; text-align: center; cursor: default; }
.sp-zoom .sp-zoom-pct:hover { color: var(--rmx-traka-tekst-sivi); }
.sp-prozor.sp-fajl .sp-telo.sp-zoom-vece { align-items: flex-start; overflow-x: auto; }
.sp-prozor.sp-fajl .sp-telo.sp-zoom-vece .sp-list { flex: 1 0 auto; }
.sp-dno {
  flex: none;
  height: 30px;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 16px;
  border-top: 1px solid #dfe3e7;
  background: #f4f5f7;
  color: #5d6670;
  font-size: calc(var(--rmx-font-size) - 1px);
}
.sp-oznaka { padding: 1px 9px; border-radius: 10px; background: #e8f3ea; color: #2e6b3a; font-weight: 600; }
.sp-oznaka[hidden] { display: none; }
/* Traka kvačica ispod naslova prozora štampe (korisnik 2026-10-22, spisak vozila — PNG _tmp/predlog_stampa_vozila D: „i trebaju
   kvačice po vrsti da mogu da se ne vide na štampi“). Markup _StampaPregled (KvaciceNaslov), puni rmxStampaPregled.kvacice.
   Kvačica u boji menija (accent-color), skinuta = sivo. Telefon: lomi se u redove. */
.sp-kvacice { flex: none; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 18px; padding: 7px 16px;
  background: #eef0f3; border-bottom: 1px solid #c3c9d0; color: #222; font-size: var(--rmx-font-size); }
.sp-kvacice[hidden] { display: none; }
.sp-kv-naslov { font-weight: 600; color: #333; }
.sp-kv-lista { display: flex; flex-wrap: wrap; gap: 6px 18px; }
.sp-kv { display: inline-flex; align-items: center; gap: 2px; cursor: pointer; user-select: none; }
.sp-kv input { width: 15px; height: 15px; margin: 0 4px 0 0; accent-color: var(--rmx-traka-akcent-crta); cursor: pointer; }
.sp-kv i { font-style: normal; color: #666; }
.sp-kv-off { color: #888; }
/* Razdelnik grupe kvačica (vrste | Status: Aktivna / Neaktivna — spisak vozila PNG E, 2026-10-22). */
.sp-kv-sep { width: 1px; height: 18px; margin: 0 4px; background: #b8bec6; align-self: center; }
.sp-kv-napomena { margin-left: auto; font-size: calc(var(--rmx-font-size) - 1px); color: #555; }
@media (max-width: 700px) { .sp-kv-napomena { display: none; } }
/* Traka fajlova istog dokumenta u pregledu fajla (korisnik 2026-11-03, varijanta A, _tmp/predlog_fajl_pregled/predlog.png): ispod
   tamne trake, ista podloga kao .sp-kvacice; tasteri 24 px / slova 12 px (ui_toolbar.md §1 „Visina“), izabrani u boji trake kao na
   slici. Markup _FajlPregled (data-pf="fajlovi"), puni rmxPregledFajla.fajlovi — bez spiska skrivena. Telefon: blok ispod. */
.sp-fajlovi { flex: none; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 6px 16px;
  background: #eef0f3; border-bottom: 1px solid #c3c9d0; }
.sp-fajlovi[hidden] { display: none; }
.sp-fajl-btn { flex: none; height: 24px; padding: 0 10px; display: inline-flex; align-items: center; gap: 6px;
  border: 1px solid #c3c9d0; border-radius: 12px; background: #fff; color: #333;
  font: inherit; font-size: calc(var(--rmx-font-size) - 1px); white-space: nowrap; cursor: pointer; }
.sp-fajl-btn svg { width: 12px; height: 14px; flex: none; }
.sp-fajl-btn:hover:not(.on) { border-color: var(--rmx-traka-akcent-crta); }
.sp-fajl-btn.on { background: var(--rmx-traka-meni); border-color: var(--rmx-traka-akcent-crta); color: var(--rmx-traka-tekst-jak);
  box-shadow: inset 0 -2px 0 var(--rmx-traka-akcent-crta); font-weight: 600; cursor: default; }
.sp-fajl-btn:focus-visible { outline: 2px solid var(--rmx-traka-akcent-crta); outline-offset: 2px; }
/* Promena veličine prozora uglom dole desno (korisnik 2026-10-21, pregled fajla: „da može da se pomera i resize i da se i dokument
   srazmerno povećava“). Ugao dodaje wwwroot/js/rmx-prozor-pomeranje.js ({ velicina: true }, prvo _FajlPregled); dok se vuče
   (pomeranje ili veličina) ram ne hvata miš — inače PDF u ramu prekine vučenje. Izgled kao ugao za resize u pregledaču. */
.rmx-prozor-ima-ugao { position: relative; }
.rmx-prozor-ugao {
  position: absolute; right: 0; bottom: 0; z-index: 3;
  width: 18px; height: 18px;
  cursor: nwse-resize; touch-action: none;
  background: linear-gradient(135deg, transparent 0 55%, #9aa3ad 55% 62%, transparent 62% 72%, #9aa3ad 72% 79%, transparent 79%);
}
.rmx-prozor-vuce { user-select: none; }
.rmx-prozor-vuce iframe { pointer-events: none; }
@media (max-width: 700px) { .rmx-prozor-ugao { display: none; } }

/* TELEFON — prozor štampe: traka u redove (naslov · prekidač · radnje), list preko cele širine, bez donje trake. */
@media (max-width: 700px) {
  .sp-prozor > .sp-box { width: 100%; height: calc(100dvh - 16px - env(safe-area-inset-top, 0px) - var(--rmx-tel-dno)); border-radius: 8px; }
  .sp-prozor .sp-bar { position: relative; flex-wrap: wrap; gap: 8px; padding: 8px 10px; }
  .sp-ttl { flex: 1 1 100%; padding-right: 40px; }
  .sp-pod { max-width: 100%; }
  /* Radnje se lome u redove (ne guraju prozor van ekrana); × uvek gore desno, uz naslov. */
  .sp-akcije { flex: 1 1 100%; margin-left: 0; flex-wrap: wrap; }
  .sp-sep { display: none; }
  .sp-x { position: absolute; top: 8px; right: 8px; }
  .sp-prozor .sp-telo { padding-top: 0; }
  .sp-prozor .sp-list, .sp-box.sp-siroko .sp-list { width: 100%; box-shadow: none; }
  .sp-dno { display: none; }
  /* Traka fajlova (2026-11-03): jedan red, skrol levo-desno samo u traci (strana se ne šeta); tasteri 40 px kao svi na telefonu
     (ui_toolbar.md §1 „Telefon ≤ 700px: 40px“). */
  .sp-fajlovi { flex-wrap: nowrap; overflow-x: auto; overscroll-behavior-x: contain; padding: 6px 10px; }
  .sp-fajl-btn { height: 40px; padding: 0 14px; border-radius: 20px; }
}

/* ========== TELEFON — pregled fajla preko celog ekrana (korisnik 2026-10-15, slika S25 SEF PDF: vrh prozora ispod gornje
   trake programa — naslov i × se nisu videli; .print-overlay z-index 85 < gornja traka / donji meni 1600) ==========
   Isto kao telefonski prozor fajla 2026-10-09 (_Layout #rmxFajlPregled: z-index 1700, ceo ekran, bez ivica — „da lepo zauzme
   ceo ekran“). Visina var(--rmx-vis) (nikad gol 100dvh — skill rmx-telefon §1). Samo .sp-fajl (_FajlPregled); prozor
   štampe (_StampaPregled) nepromenjen. PDF u ovom prozoru na telefonu = slike stranica (JS u _FajlPregled, Pages/PdfPregled). */
@media (max-width: 700px) {
  .print-overlay.sp-fajl { z-index: 1700; padding: 0; }
  .print-overlay.sp-fajl > .sp-box {
    width: 100vw;
    max-width: none;
    height: var(--rmx-vis, 100dvh);
    max-height: none;
    margin: 0;
    border: 0;
    border-radius: 0;
    padding-top: env(safe-area-inset-top, 0px);
    padding-bottom: var(--rmx-tel-dno);
    box-sizing: border-box;
  }
}

/* ---------- Lista sa kvačicama (korisnik 2026-10-15: „treba nam ovakva lista sa checkboksima“, slika — padajuća „All weeks“:
   dugme kao padajuća lista sa ▾, ispod spisak sa kvačicama, prvo „Svi“ podebljano i crta ispod). JS wwwroot/js/rmx-kvacice.js
   (jednom u _Layout). Prvo mesto: knjiga ulaznih računa, Prikaz SVI / SEF / AP (SEF-089-AP). Širina dugmeta = stara padajuća
   Prikaz (18rem), visina / ivica = .form-input. ---------- */
.rmx-kvac { position: relative; display: inline-block; vertical-align: middle; }
.rmx-kvac-dugme {
  /* Ivica malo zaobljenija od ostalih polja (3px) — korisnik 2026-10-15: „vrlo malo curvature to polje ali vrlo malo“. */
  border-radius: 5px;
  width: 18rem; max-width: 18rem; height: 28px; padding: 2px 26px 2px 8px; text-align: left; cursor: pointer;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; position: relative;
}
.rmx-kvac-dugme::after {
  content: "▾"; position: absolute; right: 9px; top: 50%; transform: translateY(-52%); color: var(--rmx-muted); font-size: calc(var(--rmx-font-size) - 1px);
}
.rmx-kvac-lista {
  position: absolute; z-index: 60; top: calc(100% + 2px); left: 0; min-width: 100%; max-height: 320px; overflow-y: auto;
  background: #fff; border: 1px solid var(--rmx-polje-ivica); border-radius: 4px; box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
  padding: 3px 0;
}
.rmx-kvac-lista[hidden] { display: none; }
.rmx-kvac-lista label {
  display: flex; align-items: center; gap: 7px; padding: 5px 10px; margin: 0; cursor: pointer; white-space: nowrap;
  font-weight: 400; color: var(--rmx-text);
}
.rmx-kvac-lista label:hover { background: var(--rmx-row-alt); }
.rmx-kvac-lista input[type="checkbox"] { margin: 0; width: 15px; height: 15px; cursor: pointer; }
.rmx-kvac-lista .rmx-kvac-svi { font-weight: 700; border-bottom: 1px solid #d5d9de; margin-bottom: 3px; padding-bottom: 6px; }
@media (max-width: 700px) {
  .partneri-page-top .toolbar .rmx-kvac, .partneri-page-top .toolbar .rmx-kvac-dugme { max-width: 100%; }
}

/* Fajl u pregledu ispod reda (korisnik 2026-10-15, PNG _tmp/predlog_ikonice): obojeni papir po vrsti (RmxLista.fajlIkonaSvg u
   sifarnik-lista.js). Prvo izabrana varijanta C (čip u okviru), pa isti dan „i ove prebaci na ovakve da vidim kako izgleda“ —
   varijanta B: papir + naziv bez okvira. Knjiga ulaznih, tab SEF, lista Angažovani.
   + panel pregleda ispod liste (.fakture-stavke-panel — /Izvodi kolona Fajlovi, 2026-11-01: bez ovoga ikonica preko cele širine). */
.row-detail a.rmx-fajl-cip,
.fakture-stavke-panel a.rmx-fajl-cip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 2px 0;
    margin: 0 16px 2px 0;
    color: inherit;
    text-decoration: none;
    font-size: calc(var(--rmx-font-size) - 0.5px);
    font-weight: 600;
    line-height: 1.2;
}
.row-detail a.rmx-fajl-cip:hover,
.fakture-stavke-panel a.rmx-fajl-cip:hover { color: #8a4b00; }
.row-detail a.rmx-fajl-cip svg,
.fakture-stavke-panel a.rmx-fajl-cip svg { width: 15px; height: 17px; flex: 0 0 auto; }

/* Link u tamnom naslovu panela (korisnik 2026-10-15: plavi link „račun N-161/26 u knjizi“ na Angažovani kartici — „boja nije dobra“,
   pa „ne ova boja nego ova gore desno“ = link „ID naloga 32677“ u naslovu panela): isti stil kao .card-panel-title .panel-id a
   (gore u ovom fajlu, --rmx-traka-link / -hover) — menjati zajedno. */
.card-panel-title a.card-panel-title-link { color: var(--rmx-traka-link); text-decoration: underline; }
.card-panel-title a.card-panel-title-link:hover { color: var(--rmx-traka-link-hover); }

/* ===== PREGLED PREDATIH ZAHTEVA (/Refakcija/Predati, korisnik 2026-10-17 — slika _tmp/predlog_pregled_predatih, „U redu je ovako —
   uradi“) ===== Donji pregled = tačke „Pregleda prijave“ redom kao portal ePorezi (siva traka naslova + vrednost desno, detalj
   ispod), tabovi Pregled prijave / Stavke / Prilozi. Boje = postojeće promenljive (podtabela u belom panelu, izbor, tekst).
   Samo ova strana (Pages/Refakcija/Predati.cshtml — klase u JS-u strane, menjati zajedno). */
/* Podesavanja → Prikaz, paneli Naslov strane / Boja linka (2026-10-24) — razmaci kao postojeci paneli, bez inline style. */
.prikaz-napomena { margin-top: 0; }
.prikaz-napomena-2 { margin: 8px 0 4px; }
.prikaz-naslov-pregled { margin: 4px 0 0; }

/* /Refakcija/Predati prikaz Po računima — delovi REF-T po redu ćelije, litri desno (StampaModel.DeoHtml, korisnik 2026-10-22 „ipak je B
   preglednije“). Isto pravilo u stilu štampe (Pages/Refakcija/Stampa.cshtml) — menjati zajedno. */
.deo-mreza { display: inline-grid; grid-template-columns: auto auto; column-gap: 10px; }
.deo-mreza .deo-l { text-align: right; font-variant-numeric: tabular-nums; }

/* kao ostali prekidači (paleta 2026-10-24) */
/* /Servisi Svi servisi — zbir meseca na zlatnoj traci (korisnik 2026-10-29); period i zbir gore = isti izgled kao /Sluzbena
   (izvestaj-filter, izvestaj-sum). Pages/Servisi/Index.cshtml; zbir posle pretrage = sifarnik-lista.js RmxListaSekcije.brojevi. */
/* Ćelije zbira na zlatnoj traci (opšte pravilo crta ▼ u svakoj ćeliji trake — ovde samo u prvoj), iznos desno. */
.grid tbody tr.lista-grupa-red.lista-grupa-zlatna td.sekcija-zbir::before { content: none; }
.grid tbody tr.lista-grupa-red.lista-grupa-zlatna td.sekcija-zbir { text-align: right; font-variant-numeric: tabular-nums; }
/* Krug servisa kao kartice B2 (korisnik 2026-10-22 „B2 može“, slika _tmp/predlog_servisi_na_redu/7_kartice_redizajn.png):
   traka nivoa levo (S svetlo, M plavo-sivo, L tamno, R plavo), km i procena desno; urađen zeleno, sledeći obod + traka. */
/* Tab Lizing kao pregled (korisnik 2026-10-24: varijanta A „jednostavna lista“, pa B „mapa preko cele širine“ i „do kraja
   prozora lepo da se uklapa … mislim na kontejnere“): Pages/Vozila/_LizingPregled.cshtml. Tab popunjava visinu prozora kao
   tab Putni na kartici ture (.kartica-scroll je flex kolona): panel stanja ne skuplja se, panel Plaćanja dobija ostatak, a
   okvir uplata svoj skrol (JS ga skroluje na kraj — Kartica.cshtml). */
.tura-tab-panel.active[data-panel="lizing"] { flex: 1 1 auto; min-height: 0; }
/* LK-F5 čip ugovora ispod Opisa stavke izvoda uklonjen 2026-10-31 (korisnik: predlog C) — sada .izvod-ugovor-btn (blok „Ikonica Raspodela“). */
/* celija samo za telefon (Pages/Sengen/Index.cshtml) */
@media (max-width: 700px) {
  /* Redovi 6 / 7: upozorenja (rokovi, servis, GPS nije javio) i dozvole kao male pilule; prazna celija ne pravi razmak. */
  .planer-page #tblPlaner tbody tr.planer-row > td:is(:nth-child(6), :nth-child(7)):has(> span) { margin-top: 7px; }
  /* --- 3) 90/180 — polja Na dan / Tura dana pune sirine, naziv iznad (na S25 odsečeno „24/10/202(“, „3(“). Kao Službena
     .sluzbena-period. sengen.css se ucitava posle site.css — zato .sengen-page ispred (jaci selektor). --- */
  .sengen-page .sengen-na-dan :is(input[type=date], input[type=number], .rmx-date-wrap) { width: 100%; max-width: none; box-sizing: border-box; }

  /* --- 4) 90/180 — kartica A (tabela .tel-svoja-kartica, celija .sengen-tel; obrazac Podaci naloga #tblSabloni): ime + oznaka,
     traka iskorišćeno / 90, gde je sada, sme do · tura najranije. Cela strana skroluje = tel-strana-skrol na strani. --- */
  .partneri-page #tblSengen > tbody > tr.lista-row:is(.u-sklopu, [hidden]) { display: none; }
  }

/* ========== TELEFON — traka meseca sa zbirom u jednom redu (korisnik 2026-10-29: Servisi „vidi kako radi na telefonu da može da
   bude lepo pregledno“, PNG _tmp/predlog_servisi_telefon/predlog_telefon.png → „Da, uradi“) ==========
   Traka sa zbirom (td.sekcija-zbir — Pages/Servisi/Index.cshtml, zbir sifarnik-lista.js RmxListaSekcije.brojevi) ima 3 ćelije;
   opšti blok „Trake grupa = tamna traka“ (6) svaku ćeliju crta kao svoju traku → bile su 3 trake. Ovde: jedna traka, naziv
   meseca levo, zbir desno, prazna ćelija sakrivena. Boja / slova iz bloka (6) — menjati zajedno. PC se ne menja. */
@media (max-width: 700px) {
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr.lista-grupa-red:has(> td.sekcija-zbir) { display: flex; align-items: stretch; }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr.lista-grupa-red:has(> td.sekcija-zbir) > td:first-child {
    flex: 1 1 auto; min-width: 0; margin-right: 0 !important;
    border-top-right-radius: 0 !important; border-bottom-right-radius: 0 !important;
  }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr.lista-grupa-red > td.sekcija-zbir {
    flex: 0 0 auto; text-align: right !important; font-variant-numeric: tabular-nums; margin-left: 0 !important;
    border-top-left-radius: 0 !important; border-bottom-left-radius: 0 !important;
  }
  .partneri-page :is(.grid-scroll > table.grid, table.grid.lista-tel):not(#tblNalozi, .tel-svoja-kartica) > tbody > tr.lista-grupa-red > td.sekcija-zbir:empty { display: none !important; }
}

/* Knjiga ulaznih, pregled ispod reda „Vezano za ovaj račun“: kolona „Vozilo / vozač“ dovoljno široka za ceo naslov (7rem ga je sekao —
   slika korisnika 2026-10-30). Jače od pravila na strani (Pages/UlazneFakture/Index.cshtml, ostale kolone tamo). */
.row-detail .ulazne-pregled-veze .tura-preview-table th.k-ko { width: 8.6rem; }
/* „Iznos bez PDV“: podebljan naslov + razmak ćelije (2 × 8px) ne staje u 7rem — prelazio je desnu ivicu (slika korisnika 2026-10-30). */
.row-detail .ulazne-pregled-veze .tura-preview-table th.k-iznos { width: 8.4rem; }