@charset "UTF-8";

html {
  scrollbar-gutter: stable;
}

/* ============================================================
   Inter (self-hosted, variable 400–700) — srpska latinica + ćirilica.
   Povučeno lokalno sa fonts.gstatic.com; bez eksternog CDN-a.
   ============================================================ */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('../vendor/fonts/inter/inter-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('../vendor/fonts/inter/inter-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('../vendor/fonts/inter/inter-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('../vendor/fonts/inter/inter-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

/* ============================================================
   BAZA — preuzeto iz nekadašnjeg style.css (uklonjen 24.07.2026).
   main.css je od sada jedini stylesheet teme, pa mora da nosi i
   reset. Zadržane su samo stavke koje se stvarno koriste; ostatak
   starog fajla (.infobox, .galleryprivju, .currentpageslist,
   #CMS-identifier, .bannerholder, .cat, .sub, .tip, .top,
   .istaknut, .primer, .spacer0) nema nijednu upotrebu u šablonima.
   ============================================================ */
html, body, p, ul, ol, li, form {
  margin: 0;
  padding: 0;
}

/* Cela tema je građena na pretpostavci da linkovi nisu podvučeni po defaultu
   (podvlačenje se dodaje ciljano tamo gde treba). Bilo je u starom resetu. */
a { text-decoration: none; }

ul#nav,
.kt ul.tabs,
ul.lista-poseta, ul.lista-dokumenata, ul.lista-podsetnika {
  list-style: none;
}

img { border: none; }

.spacer10 { height: 10px; clear: both; }
.clear    { clear: both; }

/* Bazna skala naslova — doslovno iz style.css. `.kt h1..h4` postavlja samo
   boju, pa bi bez ovoga svaki h2/h3/h4 koji tema ne stilizuje posebno pao na
   browser default (h2 bi skočio sa 14px na 21px). */
h1 { font-size: 16px; font-weight: bold; margin: 10px 0 10px 10px; }
h2 { font-size: 14px; font-weight: bold; margin: 10px 0 10px 10px; }
h3 { font-size: 13px; font-weight: bold; margin: 10px 0 10px 10px; }
h4 { font-size: 12px; font-weight: bold; margin: 0 0 5px 0; }

/* text-align:left je bio na body-ju u starom resetu; `start` je isto u LTR,
   ali držimo doslovnu parnost sa ranijim renderom. */
body { text-align: left; }

/* Kontejneri moraju ostati pozicionirani — #minilist se apsolutno pozicionira
   unutar #center, a bez ovoga bi ispao u odnosu na viewport. */
#wrapper,
#center,
ul#nav li { position: relative; }

/* Minilist (pretraga vlasnika u kartonu): main.css je preuzeo samo izgled,
   a strukturu je nosio style.css — bez ovoga se panel vidi stalno, u toku strane. */
#minilist {
  display: none;
  position: absolute;
  z-index: 99;
  padding: 5px;
  overflow: hidden;
  background-color: #ffffff;
}

#minilist.is-open {
  display: block;
}

.kt {
  /* ===== DIZAJN TOKENI (vidi thm/kt/DESIGN.md) ===== */
  /* Površine */
  --page-bg: #f2f7f7;
  --surface: #fefffd;
  --surface-muted: #f6fbf7;
  --surface-soft: #eaf7ef;
  --surface-alt: #f7f9fa;
  --surface-alt-2: #f6fbfb;
  /* Linije */
  --line: #d9e9df;
  --line-strong: #bbd3c5;
  /* Tekst */
  --text: #20302a;
  --muted: #61756a;
  --on-dark: #ffffff;
  /* Navigacija */
  --nav: #2f4941;
  --nav-2: #41645a;
  /* Akcent */
  --accent: #16846e;
  --accent-strong: #0e6856;
  --accent-soft: #ddf2e7;
  --accent-tint: #e6f4f2;
  /* Serije podataka — nisu statusne boje. */
  --data-1: #16846e;
  --data-2: #3f739a;
  --data-3: #8c6b34;
  --data-4: #8a5f8f;
  --data-5: #667568;
  /* Link */
  --link: #0a5f8f;
  --link-strong: #073f60;
  /* Tabele — jedna metrika za SVE liste.
     `--tbl-line` je visina jedne linije u ćeliji; sve što ćelija sme da sadrži
     (tekst, link, ikonica, dugme) staje u tu liniju, pa red sa ikonicom nije
     viši od reda bez nje. `--tbl-cell-y`/`--tbl-cell-x` su jedini padding
     ćelije — pojedinačne tabele ga više ne prepisuju. */
  --tbl-line: 20px;
  --tbl-cell-y: 7px;
  --tbl-cell-x: 10px;
  /* Slate (sekundarno dugme) */
  --slate: #4f606c;
  --slate-strong: #3c4a54;
  /* Danger */
  --danger: #c4606a;
  --danger-strong: #a94751;
  --danger-soft: #fdf3f4;
  --danger-row: #fff0f0;
  --danger-row-hover: #ffe4e6;
  /* Info obavestenje */
  --info: #3f739a;
  --info-strong: #285677;
  --info-soft: #edf5fb;
  /* Success obavestenje — semanticki alias brend zelenoj */
  --success: #16846e;
  --success-strong: #0e6856;
  --success-soft: #ddf2e7;
  /* Warning / alarm */
  --warning: #fff4ce;
  --warning-2: #fff2c9;
  --warning-border: #d8a931;
  --warning-text: #684d00;
  --warning-hover: #ffe9a8;
  /* Highlight (podsetnik ističe) */
  --highlight: #fff1f2;
  --highlight-soft: #fff7f7;
  --highlight-border: #d97b83;
  /* Fokus */
  --focus: #d8a931;
  --focus-ring: rgba(224, 161, 0, 0.45);
  /* Spacing (4px baza + polukoraci za gust app) */
  --space-0_5: 2px;
  --space-1: 4px;
  --space-1_5: 6px;
  --space-2: 8px;
  --space-2_5: 10px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  /* Radijusi (jedna familija) */
  --radius-sm: 4px;
  --radius: 6px;
  --radius-pill: 9999px;
  /* Elevacija (3 nivoa) */
  --elev-raised: 0 4px 18px rgba(29, 37, 40, 0.05);
  --elev-grouped: 0 10px 28px rgba(42, 72, 78, 0.06);
  --elev-floating: 0 14px 34px rgba(42, 72, 78, 0.09);
  --shadow: var(--elev-floating);
  /* Tipografija (veličine) */
  --text-h1: 22px;
  --text-h2: 17px;
  --text-body: 14px;
  --text-sm: 13px;
  --text-label: 12px;
  --text-caps: 11px;
  /* Motion */
  --motion-fast: 120ms;
  --motion: 160ms;
  --ease: cubic-bezier(0.2, 0.8, 0.3, 1);
  background: var(--page-bg);
  background-image: none;
  color: var(--text);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
  font-size: var(--text-body);
  line-height: 1.45;
  letter-spacing: -0.006em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: 'cv05' 1, 'ss03' 1;
  min-width: 0;
}

.kt a,
.kt #nav a,
.kt #nav .kt-nav-logout-button,
.kt .kt-button,
.kt input[type="submit"],
.kt input[type="button"],
.kt input[type="reset"],
.kt button,
.kt ul.tabs.kt-tabs li a.kt-tab-link,
.kt .kt-list li a,
.kt .tblh tr,
.kt input[type="text"],
.kt input[type="search"],
.kt input[type="password"],
.kt input[type="number"],
.kt input:not([type]),
.kt select,
.kt textarea {
  transition: background-color var(--motion-fast) var(--ease),
              border-color var(--motion-fast) var(--ease),
              color var(--motion-fast) var(--ease),
              box-shadow var(--motion-fast) var(--ease);
}

@media (prefers-reduced-motion: reduce) {
  .kt * {
    transition-duration: 0.001ms !important;
    animation-duration: 0.001ms !important;
  }
}

.kt *,
.kt *::before,
.kt *::after {
  box-sizing: border-box;
}

.kt a {
  color: var(--link);
}

.kt a:hover {
  color: var(--link-strong);
  text-decoration: underline;
}

.kt .kt-fa-icon {
  width: 1.15em;
  min-width: 1.15em;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: currentColor;
  font-size: 0.92em;
  line-height: 1;
}

.kt .kt-has-fa-icon {
  gap: 9px;
}

.kt .kt-hidden-post-form {
  display: none;
}

.kt a:focus,
.kt select:focus,
.kt button:focus {
  outline: 3px solid rgba(224, 161, 0, 0.45);
  outline-offset: 2px;
}

.kt a:focus:not(:focus-visible),
.kt select:focus:not(:focus-visible),
.kt button:focus:not(:focus-visible) {
  outline: none;
}

.kt a:focus-visible,
.kt input:focus-visible,
.kt select:focus-visible,
.kt textarea:focus-visible,
.kt button:focus-visible {
  outline: 3px solid rgba(224, 161, 0, 0.45);
  outline-offset: 2px;
}

.kt input[type="text"]:focus,
.kt input[type="search"]:focus,
.kt input:not([type]):focus,
.kt input[type="password"]:focus,
.kt textarea:focus {
  outline: 3px solid rgba(224, 161, 0, 0.45);
  outline-offset: 2px;
}

.kt .kt-button:active,
.kt input[type="submit"]:active,
.kt input[type="reset"]:active,
.kt input[type="button"]:active,
.kt button:active {
  transform: translateY(1px);
  filter: brightness(0.95);
}

.kt #wrapper {
  width: min(1180px, calc(100% - 32px));
  float: none;
  margin: 0 auto;
  padding: 0 0 32px;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
}

.kt #nav {
  grid-column: 1 / -1;
  position: sticky;
  z-index: 100;
  top: 0;
  left: auto;
  width: 100%;
  min-height: 42px;
  height: auto;
  transform: none;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  padding: 4px;
  background: var(--nav);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 0 0 var(--radius) var(--radius);
  box-shadow: var(--shadow);
}

.kt #nav::before {
  content: "";
  position: absolute;
  top: -11px;
  left: -1px;
  right: -1px;
  height: 10px;
  background: var(--page-bg);
}

.kt #nav li {
  float: none;
  display: block;
}

.kt #nav li.desno {
  float: none;
  padding: 0;
}

/* Podešavanja + Odjava se odvajaju na desni kraj nav trake. Nav je flex, pa
   `float: right` iz stare teme ne radi — prva `.nav-desno` stavka dobija
   `margin-left: auto` i gura sebe i sve posle sebe udesno. Susedno pravilo
   poništava marginu ostalima, da grupa ostane spojena i kad Podešavanja
   nema (stavka se ispisuje samo adminu, pa je tada Odjava prva). */
.kt #nav li.nav-desno {
  margin-left: auto;
}

.kt #nav li.nav-desno ~ li.nav-desno {
  margin-left: 0;
}

.kt #nav a,
.kt #nav .kt-nav-logout-button {
  min-height: 32px;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 8px 10px;
  border-radius: var(--radius-sm);
  color: #fff;
  font-size: 13px;
  line-height: 1;
  text-decoration: none;
}

.kt #nav .kt-nav-logout {
  margin: 0;
}

.kt #nav .kt-nav-logout-button {
  border: 0;
  background: transparent;
  cursor: pointer;
  font-family: inherit;
}

.kt #nav a:hover,
.kt #nav a.current,
.kt #nav .kt-nav-logout-button:hover,
.kt #nav .kt-nav-logout-button:focus-visible {
  background: var(--nav-2);
  color: #ffffff;
  text-shadow: none;
}

.kt #nav img {
  display: none;
}

.kt #nav .kt-fa-icon {
  color: #9fe3c4;
}

.kt #center {
  width: auto;
  min-width: 0;
  float: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

.kt .app-main {
  min-width: 0;
}

.kt #center h1 {
  margin: 0 0 14px;
  color: var(--text);
  font-size: 22px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.019em;
  display: flex;
  align-items: center;
  gap: 9px;
}

/* Naslov strane sa akcijom desno (npr. Lista vlasnika + Novi vlasnik) */
.kt .kt-page-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 16px;
  margin: 0 0 14px;
}

.kt .kt-page-header h1 {
  margin: 0;
}

.kt .kt-page-header-action {
  flex: 0 0 auto;
}

/* Karton vlasnika: dug mora biti vidljiv odmah uz identitet vlasnika, pre
   forme i finansijske kartice. Ikonica i tekst nose značenje zajedno sa
   danger bojom, pa stanje nije označeno samo bojom. */
.kt .kt-owner-debt-alert {
  display: inline-flex;
  flex: 1 1 100%;
  align-items: center;
  gap: var(--space-2);
  width: 100%;
  box-sizing: border-box;
  min-height: 36px;
  margin: 0;
  padding: 7px 12px;
  border: 1px solid var(--danger);
  border-radius: var(--radius);
  background: var(--danger-soft);
  color: var(--danger-strong);
  font-size: var(--text-sm);
  font-weight: 700;
  line-height: 1.2;
}

.kt .kt-owner-debt-alert i {
  font-size: 18px;
}

.kt .kt-owner-debt-alert strong {
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

/* Poravnanje brojeva (cene,
datumi,
JMBG,
brojevi kartona) u tabelama */
.kt .tblh td,
.kt .kt-document-meta dd {
  font-variant-numeric: tabular-nums;
}

.kt h1,
.kt h2,
.kt h3,
.kt h4 {
  color: var(--text);
}

.kt h1 .kt-fa-icon,
.kt h2 .kt-fa-icon,
.kt h3 .kt-fa-icon {
  width: 30px;
  min-width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #dff1ef;
  color: var(--accent-strong);
  font-size: 14px;
}

.kt h2.kt-has-fa-icon,
.kt h3.kt-has-fa-icon {
  display: flex;
  align-items: center;
  gap: 8px;
}

.kt .group,
.kt #settings,
.kt #center > form,
.kt #center > fieldset {
  width: 100% !important;
  max-width: none;
  margin: 0 0 16px;
  padding: 12px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--elev-raised);
}

.kt form {
  color: var(--text);
}

.kt .group form {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.kt .kt-owner-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  column-gap: 24px;
  row-gap: 12px;
}

.kt .kt-owner-form > hr {
  width: 100%;
  grid-column: 1 / -1;
  margin: 4px 0 0;
}

/* Kartice sa zbirnim brojkama iznad liste. `.duznici-*` je zatečeno ime,
   `.kt-stat*` je isti izgled pod imenom koje ne veže stil za jednu stranicu
   (koriste ga rođendani). Stara imena ostaju da dužnici ne moraju da se diraju. */
.kt .duznici-stats,
.kt .kt-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(150px, 1fr)) minmax(260px, 1.4fr);
  gap: 10px;
  margin: 0 0 12px;
}

.kt .duznici-stat-card,
.kt .kt-stat-card {
  min-width: 0;
  min-height: 112px;
  padding: 12px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--elev-raised);
}

.kt .duznici-stat-label,
.kt .duznici-stat-note,
.kt .kt-stat-label,
.kt .kt-stat-note {
  display: block;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.25;
}

.kt .duznici-stat-label,
.kt .kt-stat-label {
  margin: 0 0 8px;
  font-weight: 600;
  text-transform: uppercase;
}

.kt .duznici-stat-card strong,
.kt .kt-stat-card strong {
  display: block;
  color: var(--text);
  font-size: 24px;
  line-height: 1.1;
  overflow-wrap: anywhere;
}

.kt .duznici-stat-note,
.kt .kt-stat-note {
  margin-top: 6px;
}

.kt .duznici-stat-top ol,
.kt .kt-stat-top ol {
  margin: 0;
  padding-left: 20px;
}

.kt .duznici-stat-top li,
.kt .kt-stat-top li {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: baseline;
  margin: 0 0 5px;
  color: var(--muted);
}

.kt .duznici-stat-top a,
.kt .kt-stat-top a {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 600;
}

.kt .duznici-stat-top li span,
.kt .kt-stat-top li span {
  color: var(--text);
  font-weight: 600;
  white-space: nowrap;
}

.kt .kt-list-counter {
  margin-left: auto;
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
}

.kt .kt-list-summary {
  display: flex;
  justify-content: flex-start;
  margin: -4px 0 8px;
}

.kt .kt-list-summary .kt-list-counter {
  margin-left: 0;
  text-align: left;
}

.kt .kt-list-more {
  margin: 12px 0 0;
}

/* Traka liste: ikonica + naslov levo (40%), pretraga desno (60%), a akcija
   („Novi …") uz desnu ivicu iste trake. Jedna kartica zamenjuje raniji par
   `kt-page-header` + zasebna traka pretrage, pa lista počinje odmah ispod. */
.kt .kt-search-header {
  width: 100%;
  min-height: 57px;
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
  align-items: center;
  gap: 8px 16px;
  margin: 0 0 12px;
  padding: 10px 12px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 0 0 var(--radius) var(--radius);
  box-shadow: var(--elev-raised);
}

/* Tipografija naslova se ponavlja umesto da se nasledi iz `#center h1`: to
   pravilo je vezano za ID, pa ga selektor bez ID-a ne može nadjačati (margina),
   a van `#center` — u `DESIGN.html` — uopšte ne važi, pa bi živi uzorak
   prikazivao manji naslov nego prava strana. */
.kt .kt-search-header h1,
.kt #center .kt-search-header h1 {
  min-width: 0;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 9px;
  color: var(--text);
  font-size: 22px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.019em;
}

.kt .kt-search-header-body {
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
}

/* Forma nosi pretragu i prateće kontrole (checkbox, Poništi) i uzima slobodan
   prostor, pa akcija ostaje prislonjena uz desnu ivicu. */
.kt .kt-search-header-body > form {
  flex: 1 1 240px;
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  margin: 0;
}

/* Samo natpis pretrage je podebljan — checkbox uz njega nema `for` i ostaje
   normalne težine. */
.kt .kt-search-header label[for] {
  color: var(--text);
  font-weight: 600;
}

.kt .kt-search-header input[type="text"],
.kt .kt-search-header input[type="search"] {
  flex: 1 1 160px;
  min-width: 0;
}

.kt .kt-search-header .kt-list-counter,
.kt .kt-search-header .kt-action-link {
  flex: 0 0 auto;
}

.kt .kt-search-header .kt-action-link {
  margin-left: auto;
}

.kt .kt-search-header .kt-dash-actions {
  margin-left: auto;
  justify-content: flex-end;
}

.kt .kt-search-header-dashboard {
  grid-template-columns: minmax(230px, 1fr) minmax(0, 4fr);
  margin-top: -1px;
}

.kt .kt-title-header {
  grid-template-columns: minmax(0, 1fr);
}

.kt .kt-search-header .kt-dash-actions .kt-action-link {
  margin-left: 0;
}

.kt .kt-visually-hidden {
  position: absolute !important;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  border: 0;
  white-space: nowrap;
}

/* Ispod 900px naslov i pretraga više ne stanu jedno pored drugog u čitljivoj
   širini — traka se slaže u dva reda, akcija ostaje desno. */
@media (max-width: 900px) {
  .kt .kt-search-header {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Karton pacijenta: polja su u .kt-settings-block mreži, pa sama forma više ne
   raspoređuje u kolone (dvokolonski grid je bio za nekadašnju layout-tabelu i
   gurao bi svaki dodatni element — npr. napomenu — u zasebnu kolonu). */
.kt .kt-patient-form {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: 16px;
}

/* Vrsta = segmentirana kontrola. Nema slobodnog unosa; izbor je uvek jedno
   od ponuđenih dugmadi, pa mora da se jasno vidi koje je izabrano. */
.kt .kt-species-picker {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}

/* Osnovno stanje — belo. */
.kt button.kt-species-button {
  box-sizing: border-box;
  height: 34px;                 /* ista visina kao sve ostale kontrole */
  gap: 6px;
  margin: 0;
  padding: 0 12px;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-sm);
  background: #ffffff;
  color: var(--text);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0;
  box-shadow: none;
  cursor: pointer;
  transition: background .12s ease, border-color .12s ease, color .12s ease;
}

.kt button.kt-species-button .kt-species-icon {
  color: var(--muted);
  font-size: 0.95em;
}

.kt button.kt-species-button:hover {
  border-color: var(--accent);
  background: var(--accent-tint);
  color: var(--accent-strong);
}

.kt button.kt-species-button:hover .kt-species-icon {
  color: var(--accent);
}

/* Izabrano — zeleno, sa pratećom bojom teksta i ikonice. */
.kt button.kt-species-button.kt-species-active,
.kt button.kt-species-button.kt-species-active:hover {
  border-color: var(--accent-strong);
  background: var(--accent);
  color: #ffffff;
}

.kt button.kt-species-button.kt-species-active .kt-species-icon {
  color: #ffffff;
}

.kt .kt-species-label {
  line-height: 1;
}

/* Izbor iz malog skupa (Pol) — isti jezik kao dugmad za Vrstu: belo osnovno,
   zeleno izabrano. Radio ostaje u DOM-u zbog tastature i čitača ekrana, samo
   je vizuelno sakriven; stanje nosi `:has(:checked)` — bez JS-a. */
.kt .kt-choice-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}

.kt label.kt-choice {
  box-sizing: border-box;
  height: 34px;                 /* ista visina kao input/select u istom redu */
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0 12px;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-sm);
  background: #ffffff;
  color: var(--text);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background .12s ease, border-color .12s ease, color .12s ease;
}

.kt label.kt-choice input[type="radio"] {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.kt label.kt-choice i {
  color: var(--muted);
  font-size: 0.95em;
}

.kt label.kt-choice:hover {
  border-color: var(--accent);
  background: var(--accent-tint);
  color: var(--accent-strong);
}

.kt label.kt-choice:hover i { color: var(--accent); }

.kt label.kt-choice:has(input:checked) {
  border-color: var(--accent-strong);
  background: var(--accent);
  color: #ffffff;
}

.kt label.kt-choice:has(input:checked) i { color: #ffffff; }

/* Fokus s tastature mora da se vidi kad je sam radio skriven. */
.kt label.kt-choice:has(input:focus-visible) {
  outline: 2px solid var(--focus);
  outline-offset: 2px;
}

/* Napomena u formi (npr. „broj kartona se dodeljuje automatski"). */
.kt .kt-form-note {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0 0 var(--space-3);
  color: var(--muted);
  font-size: 12.5px;
}

.kt .kt-form-note i { color: var(--accent); }

/* ===== Vlasnik sekcija: horizontalni tabovi (kao Posete/Protokoli) + panel ===== */
.kt .kt-owner-block {
  margin: 20px 0 0;
}

.kt .kt-owner-heading {
  margin: 0 0 10px;
  color: var(--text);
  font-size: 16px;
  font-weight: 700;
  letter-spacing: -0.01em;
}

.kt .kt-owner-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0;
  padding: 0;
}

.kt .kt-owner-tab {
  position: relative;
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 9px 16px;
  border: 1px solid var(--line);
  border-bottom: 0;
  border-radius: 6px 6px 0 0;
  background: var(--surface-muted);
  color: var(--muted);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  user-select: none;
}

.kt .kt-owner-tab input[type="radio"] {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  opacity: 0;
  pointer-events: none;
}

.kt .kt-owner-tab > i.ph {
  color: var(--accent);
  font-size: 1.05em;
}

.kt .kt-owner-tab:hover {
  background: var(--accent-tint);
  color: var(--accent-strong);
}

.kt .kt-owner-tab.kt-owner-tab-active {
  z-index: 2;
  margin-bottom: -1px;
  padding-bottom: 10px;
  border-color: var(--accent);
  background: var(--accent);
  color: #ffffff;
}

.kt .kt-owner-tab.kt-owner-tab-active > i.ph {
  color: #ffffff;
}

.kt .kt-owner-panel {
  position: relative;
  z-index: 1;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 0 var(--radius) var(--radius) var(--radius);
  background: var(--surface);
  box-shadow: var(--elev-raised);
}

/* Sadašnji vlasnik — čist key-value grid (u duhu prikaza dokumenta) */
.kt .kt-owner-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 32px;
  margin: 0;
}

.kt .kt-owner-meta > div {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  align-items: baseline;
  gap: 12px;
  padding: 9px 0;
  border-bottom: 1px solid var(--line);
}

.kt .kt-owner-meta dt {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.kt .kt-owner-meta dd {
  margin: 0;
  color: var(--text);
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}

/* Izaberi / Novi vlasnik — polja u grid-u */
.kt .kt-owner-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 24px;
}

.kt .kt-owner-field {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin: 0;
}

.kt .kt-owner-field-label {
  color: var(--text);
  font-size: 12px;
  font-weight: 600;
}

.kt .kt-owner-field input[type="text"] {
  width: 100% !important;
}

/* Forma za korisnika (Podešavanja → Korisnici): uzak, poravnat stack.
   Uski kontejner drži i custom select (kt-select je width:100%) da ne beži
   preko cele širine. Pravila složenosti su suptilan helper ispod polja. */
.kt .kt-userform {
  max-width: 460px;
  margin: 24px auto;
  padding: 20px 22px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--elev-raised);
}
.kt .kt-userform .kt-owner-field {
  margin-bottom: 16px;
}
.kt .kt-userform input[type="text"],
.kt .kt-userform input[type="password"] {
  width: 100%;
}
.kt .kt-userform .kt-uf-note {
  font-size: var(--text-label);
  color: var(--muted);
  margin-top: 2px;
}
.kt .kt-uf-rules {
  list-style: none;
  margin: 8px 0 0;
  padding: 0;
  font-size: var(--text-label);
  display: grid;
  gap: 4px;
}
.kt .kt-uf-rules li {
  position: relative;
  padding-left: 20px;
  color: var(--muted);
  transition: color .12s ease;
}
.kt .kt-uf-rules li::before {
  content: "•";
  position: absolute;
  left: 4px;
  opacity: .45;
}
.kt .kt-uf-rules li.ok {
  color: var(--accent-strong);
}
.kt .kt-uf-rules li.ok::before {
  content: "✓";
  opacity: 1;
}
.kt .kt-uf-rules li.fail {
  color: var(--danger-strong);
}
.kt .kt-uf-rules li.fail::before {
  content: "✕";
  opacity: 1;
}

/* Potvrda brisanja korisnika — informativni modal + dodatni "siguran sam" korak.
   Objasnjava da se podaci u bazi ne brisu, pa tek cekiranje otkljucava dugme. */
.kt .kt-confirm {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  background: rgba(20, 40, 32, 0.42);
}
.kt .kt-confirm[hidden] { display: none; }
.kt .kt-confirm-box {
  width: 100%;
  max-width: 440px;
  padding: 22px 24px 20px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: 0 18px 48px rgba(20, 40, 32, 0.28);
}
.kt .kt-confirm-box h2 {
  margin: 0 0 10px;
  font-size: 18px;
  font-weight: 700;
  color: var(--text);
}
.kt .kt-confirm-lead { margin: 0 0 12px; color: var(--text); }
.kt .kt-confirm-info {
  margin: 0 0 14px;
  padding: 11px 13px;
  font-size: 13px;
  line-height: 1.5;
  color: var(--muted);
  background: var(--danger-soft);
  border: 1px solid var(--line);
  border-radius: 4px;
}
.kt .kt-confirm-info strong { color: var(--text); }
.kt .kt-confirm-ack {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 0 0 18px;
  font-size: 13px;
  color: var(--text);
  cursor: pointer;
}
.kt .kt-confirm-ack input { margin-top: 2px; flex: none; }
.kt .kt-confirm-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}
.kt .kt-confirm-actions button {
  padding: 8px 16px;
  font-size: 13px;
  font-weight: 600;
  border: 1px solid transparent;
  border-radius: 4px;
  cursor: pointer;
}
.kt .kt-confirm-cancel {
  background: var(--surface);
  border-color: var(--line);
  color: var(--text);
}
.kt .kt-confirm-ok { background: var(--danger); color: #fff; }
.kt .kt-confirm-ok:hover { background: var(--danger-strong); }
.kt .kt-confirm-ok[disabled] { opacity: 0.5; cursor: not-allowed; }

.kt .kt-owner-selected {
  min-height: 36px;
  display: flex;
  align-items: center;
  padding: 7px 11px;
  border: 1px dashed var(--line-strong);
  border-radius: var(--radius-sm);
  background: var(--surface-muted);
  color: var(--text);
}

.kt .kt-owner-selected:empty::before {
  content: "Nije izabran";
  color: var(--muted);
}

/* Karton forma kao prvi tab: tab je već kartica, forma bez dodatnog paddinga */
.kt #tab_karton .kt-patient-form {
  padding: 0;
}

/* Novi karton (bez istorije/tabova): forma kao samostalna kartica */
.kt .kt-karton-solo {
  margin: 0 0 16px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--elev-raised);
}

/* Vlasnik = jasno odvojen segment ispod kartona (ikonicu-badge dodaje JS) */
.kt .kt-owner-heading {
  display: flex;
  align-items: center;
  gap: 9px;
}

.kt .kt-patient-form > input[type="submit"],
.kt .kt-patient-form > input[type="reset"] {
  float: none !important;
  min-width: 124px;
  margin: 0;
}

.kt .kt-patient-form > input[type="submit"] {
  grid-column: 1;
  justify-self: start;
}

.kt .kt-patient-form > input[type="reset"] {
  grid-column: 2;
  justify-self: end;
}

.kt .kt-patient-form > hr {
  width: 100%;
  grid-column: 1 / -1;
  margin: 0;
  border: 0;
  border-top: 1px solid var(--line-strong);
}

.kt ul.tabs.kt-tabs {
  width: 100% !important;
  height: auto !important;
  float: none !important;
  clear: both;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 6px;
  margin: 10px 0 0;
  padding: 0;
  border: 0;
  list-style: none;
  background: transparent;
}

.kt ul.tabs.kt-tabs li {
  height: auto !important;
  min-height: 0;
  float: none !important;
  display: block;
  margin: 0;
  padding: 0;
  overflow: visible;
  border: 0;
  background: transparent;
  line-height: 1.2;
}

.kt ul.tabs.kt-tabs li a.kt-tab-link {
  min-height: 36px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 14px;
  border: 1px solid var(--line);
  border-bottom: 0;
  border-radius: 5px 5px 0 0;
  background: var(--surface-muted);
  color: var(--muted);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none;
}

.kt ul.tabs.kt-tabs li a.kt-tab-link:hover {
  background: var(--accent-tint);
  color: var(--accent-strong);
  text-decoration: none;
}

.kt ul.tabs.kt-tabs li.active a.kt-tab-link,
.kt ul.tabs.kt-tabs li.active a.kt-tab-link:hover {
  position: relative;
  z-index: 2;
  border-color: var(--accent);
  background: var(--accent);
  color: #ffffff;
}

.kt ul.tabs.kt-tabs li.active a.kt-tab-link .kt-fa-icon {
  color: #ffffff;
}

.kt .kt-tab-link .kt-fa-icon {
  color: var(--accent);
}

/* Danger tab (karton -> "Dugovanja"): postoji samo kad vlasnik duguje, pa nosi
   crvene nijanse umesto akcenta. Boja nije jedini signal — tab ima naslov i
   ikonicu novca, a sadržaj ponavlja iznos. */
.kt ul.tabs.kt-tabs li.kt-tab-danger a.kt-tab-link {
  border-color: var(--danger);
  background: var(--danger-soft);
  color: var(--danger-strong);
}

.kt ul.tabs.kt-tabs li.kt-tab-danger a.kt-tab-link:hover {
  background: var(--danger-row-hover);
  color: var(--danger-strong);
}

.kt ul.tabs.kt-tabs li.kt-tab-danger.active a.kt-tab-link,
.kt ul.tabs.kt-tabs li.kt-tab-danger.active a.kt-tab-link:hover {
  border-color: var(--danger);
  background: var(--danger);
  color: #ffffff;
}

.kt ul.tabs.kt-tabs li.kt-tab-danger a.kt-tab-link .kt-fa-icon {
  color: var(--danger-strong);
}

.kt ul.tabs.kt-tabs li.kt-tab-danger.active a.kt-tab-link .kt-fa-icon {
  color: #ffffff;
}

.kt .kt-tab-container {
  width: 100% !important;
  height: auto !important;
  min-height: 0;
  clear: both;
  float: none !important;
  overflow: visible;
  margin: 0 0 16px;
  border: 1px solid var(--line);
  border-radius: 0 var(--radius) var(--radius) var(--radius);
  background: var(--surface);
  box-shadow: var(--elev-raised);
}

.kt .kt-tab-content {
  width: 100%;
  min-height: 0;
  padding: 14px;
  overflow: visible; /* dropdown paneli moraju da izađu van taba (clearfix je ::after) */
}

.kt .kt-tab-content::after {
  content: "";
  display: table;
  clear: both;
}

/* Stacked master-detail: lista pun width gore, detalj (izveštaj/potvrda) pun
   width dole (col-12) — umesto ranije col-6/col-6 podele. */
.kt .kt-split-tab.kt-tab-active {
  display: block !important;
  overflow: visible;
}

.kt .kt-split-tab > .kt-records-list,
.kt .kt-split-tab > .kt-records-detail {
  width: 100%;
  min-width: 0;
}

.kt .kt-split-tab > .kt-inline-action-form,
.kt .kt-split-tab > .kt-tab-actions,
.kt .kt-split-tab > .clear {
  grid-column: 1 / -1;
}

.kt .kt-tab-content a[rel="visitview"],
.kt .kt-tab-content a[rel="docview"] {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 5px 8px;
  border-radius: var(--radius-sm);
  text-decoration: none;
}

.kt .kt-tab-content a[rel="visitview"]:hover,
.kt .kt-tab-content a[rel="docview"]:hover,
.kt .kt-tab-content a.current {
  background: var(--accent-tint);
  color: var(--accent-strong);
  text-decoration: none;
}

.kt .kt-tab-list-pane {
  width: 100% !important;
  max-width: 100%;
  height: auto !important;
  min-width: 0;
  min-height: 0;
  float: none !important;
  margin: 0;
}

/* Detalj (protokol/poseta) ostaje u glavnoj sekciji (tab panel) — bez okvira;
   samo tanak separator odvaja od liste gore. */
.kt .kt-detail-pane {
  width: 100% !important;
  min-width: 0;
  float: none !important;
  overflow: visible !important;
  margin-top: 16px;
  padding: 16px 0 0;
  border: 0;
  border-top: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
}

/* Prazan detalj se ne prikazuje (bez praznog boksa dok stavka nije izabrana) */
.kt .kt-detail-pane:empty {
  display: none;
}.kt .kt-detail-pane table.tblh {
  min-width: 0;
}

/* Prikaz dokumenta unutar detalja: bez unutrašnje kartice (nije box-u-boxu) */
.kt .kt-detail-pane .kt-document-view {
  width: 100%;
  max-width: none;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

/* Tabela u detalju (npr. prikaz posete): bez okvira-kartice — sadržaj u glavnoj sekciji */
.kt .kt-detail-pane .kt-table-scroll {
  margin: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.kt .kt-list {
  margin: 6px 0 0;
  padding: 0;
  list-style: none;
}

.kt .kt-list li {
  margin: 0 0 6px;
}

.kt .kt-list li a,
.kt .lista-podsetnika li {
  display: block;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: #ffffff;
  color: var(--text);
  text-decoration: none;
}

.kt .kt-list li a:hover,
.kt .kt-list li a.current {
  border-color: rgba(8, 127, 122, 0.42);
  background: var(--accent-tint);
  color: var(--accent-strong);
  text-decoration: none;
}

.kt .kt-inline-action-form {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0 0 14px;
  padding: 0;
}

.kt .kt-inline-action-form select,
.kt .kt-inline-action-form input[type="text"] {
  flex: 1 1 180px;
  width: auto !important;
}

.kt .kt-tab-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  margin: 0 0 14px;
  padding: 0;
}

.kt .kt-action-link {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 7px 12px;
  border: 1px solid transparent;
  border-radius: var(--radius);
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
}

.kt .kt-action-link::before {
  content: "+";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  font-size: 16px;
  font-weight: 600;
  line-height: 1;
}

.kt .kt-action-secondary {
  border-color: var(--accent);
  background: #ffffff;
  color: var(--accent-strong);
}

.kt .kt-action-secondary:hover,
.kt .kt-action-secondary:focus-visible {
  border-color: var(--accent-strong);
  background: var(--accent-soft);
  color: var(--accent-strong);
  text-decoration: none;
}

.kt .kt-action-primary {
  background: var(--accent);
  color: #ffffff;
}

.kt .kt-action-primary:hover,
.kt .kt-action-primary:focus {
  background: var(--accent-strong);
  color: #ffffff;
  text-decoration: none;
}

.kt #minilist .kt-minilist-close {
  float: right;
  width: 26px;
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 2px;
  padding: 0;
  border: 0;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  font-size: 13px;
}

.kt #minilist .kt-minilist-close:hover {
  background: var(--accent-soft);
  color: var(--accent-strong);
}

.kt #minilist .kt-minilist-content {
  padding: 5px;
}

/* Rezultati pretrage vlasnika — obična lista, ne tabela (vidi vlasnici-minilist.php). */
.kt #minilist .kt-minilist-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.kt #minilist .kt-minilist-list li + li {
  border-top: 1px solid var(--line);
}

.kt #minilist .kt-minilist-list a,
.kt #minilist .kt-minilist-option {
  width: 100%;
  display: block;
  padding: 6px 9px;
  border: 0;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--text);
  cursor: pointer;
  font-family: inherit;
  font-size: 13px;
  text-align: left;
  text-decoration: none;
}

.kt #minilist .kt-minilist-list a:hover,
.kt #minilist .kt-minilist-list a:focus-visible,
.kt #minilist .kt-minilist-option:hover,
.kt #minilist .kt-minilist-option:focus-visible {
  background: var(--accent-tint);
  color: var(--accent-strong);
  text-decoration: none;
}

.kt #minilist .kt-minilist-option.is-active {
  background: var(--accent-tint);
  color: var(--accent-strong);
}

.kt .kt-typeahead-error,
.kt .kt-server-list-error {
  margin: var(--space-2) 0;
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--danger);
  border-radius: var(--radius-sm);
  background: var(--danger-soft);
  color: var(--danger-strong);
  font-size: 13px;
}

.kt .kt-server-list-error[hidden] {
  display: none;
}

.kt .kt-control,
.kt input[type="text"],
.kt input[type="search"],
.kt input:not([type]),
.kt input[type="password"],
.kt input[type="date"],
.kt input[type="number"],
.kt select,
.kt textarea {
  min-height: 34px;
  max-width: 100%;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-sm);
  background: #ffffff;
  box-shadow: none;
  color: var(--text);
  font-family: inherit;
  font-size: 14px;
  padding: 6px 8px;
}

/* Native date polje.
   `appearance:none` — bez toga Safari/iOS renderuje polje kao inline dugme sa
   sopstvenom visinom, pa iskace iz reda pored ostalih kontrola.
   Standardna kontrola popunjava svoj form/grid track kao i ostali inputi.
   Kompaktni inline konteksti (npr. unos uplate u tabeli) moraju to eksplicitno
   da zatraze sopstvenim komponentnim pravilom. */
.kt input[type="date"] {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  min-width: 0;
  flex: 0 0 auto;
}

.kt input[type="checkbox"],
.kt input[type="radio"] {
  width: 16px;
  height: 16px;
  vertical-align: -3px;
  accent-color: var(--accent);
}

.kt .kt-button:disabled,
.kt input[type="submit"]:disabled,
.kt input[type="button"]:disabled,
.kt input[type="reset"]:disabled,
.kt button:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  box-shadow: none;
  transform: none;
}

.kt input:disabled,
.kt select:disabled,
.kt textarea:disabled {
  background: #f1f5f4;
  color: var(--muted);
}

.kt textarea {
  min-height: 92px;
}

.kt .kt-button,
.kt input[type="submit"],
.kt input[type="reset"],
.kt input[type="button"] {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px 14px;
  margin: 4px 4px 4px 0;
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  background: var(--nav-2);
  box-shadow: none;
  color: #ffffff;
  cursor: pointer;
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.005em;
}

.kt input[type="submit"],
.kt .kt-button-primary {
  background: var(--accent);
}

.kt input[type="submit"]:hover,
.kt .kt-button-primary:hover {
  background: var(--accent-strong);
  box-shadow: none;
}

.kt input[type="button"]:hover,
.kt input[type="reset"]:hover,
.kt .kt-button-secondary:hover {
  box-shadow: none;
}

.kt input[type="submit"].red,
.kt .kt-button-danger,
.kt .del input[type="button"] {
  background: var(--danger);
}

.kt input[type="submit"].red:hover,
.kt .kt-button-danger:hover,
.kt .del input[type="button"]:hover {
  background: var(--danger-strong);
}

/* ===== Dosledna stanja dugmadi na CELOM projektu =====
   Anchor-dugmad (npr. "Izmeni podatke o vlasniku") su <a>, pa im je `.kt a:hover`
   nametao link stil (plavo + podvučeno). Ovde se to poništava u SVIM stanjima —
   dugme uvek ostaje dugme (beo tekst, bez podvlačenja), hover/focus/active dosledni. */
.kt a.kt-button,
.kt a.kt-button:link,
.kt a.kt-button:visited,
.kt a.kt-button:hover,
.kt a.kt-button:focus,
.kt a.kt-button:active {
  color: #ffffff;
  text-decoration: none;
}

.kt a.kt-action-link,
.kt a.kt-action-link:hover,
.kt a.kt-action-link:focus,
.kt a.kt-action-link:active,
.kt .kt-document-actions a:hover,
.kt .kt-document-actions a:focus,
.kt .kt-document-actions a:active {
  text-decoration: none;
}

/* Pressed feedback i za anchor-dugmad (input dugmad ga već imaju) */
.kt a.kt-button:active,
.kt a.kt-action-link:active,
.kt .kt-document-actions a:active {
  transform: translateY(1px);
  filter: brightness(0.95);
}

.kt .kt-table-scroll {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow: auto;
  margin: 0 0 16px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--elev-raised);
}.kt table.tblh {
  width: 100% !important;
  min-width: 680px;
  border-collapse: collapse;
  background: var(--surface);
}.kt .tblh tr.listtitle {
  height: auto;
  background: var(--nav-2);
  color: #ffffff;
}.kt .tblh th {
  padding: 9px var(--tbl-cell-x);
  text-align: left;

  /* caps-11 iz DESIGN.md: zaglavlje liste je verzalno i sitnije od tela, da bi
     se čitalo kao etiketa kolone a ne kao još jedan red podataka. */
  font-size: 11px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0.02em;
  text-transform: uppercase;

  /* Sortiranje klikom na zaglavlje: pravo dugme nosi celu ćeliju da bi meta
     klika bila cela kolona, bez `javascript:` URL-a. */
  & .kt-sort-link {
    width: calc(100% + 20px);
    display: block;
    margin: -9px -10px;
    padding: 9px 10px;
    -webkit-appearance: none;
    appearance: none;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    letter-spacing: inherit;
    text-align: inherit;
    text-decoration: none;
    text-transform: inherit;
    white-space: nowrap;
    cursor: pointer;

    &:hover {
      background: rgba(255, 255, 255, 0.14);
      text-decoration: none;
    }
    &:focus-visible {
      outline: 2px solid #ffffff;
      outline-offset: -2px;
    }
  }

  & .kt-sort-arrow {
    font-size: 9px;
    opacity: 0.9;
  }

  &.kt-sorted .kt-sort-link {
    background: rgba(255, 255, 255, 0.1);
  }
}.kt .tblh td {
  padding: var(--tbl-cell-y) var(--tbl-cell-x);
  border-bottom: 1px solid var(--line);
  vertical-align: top;

  /* body-13 iz DESIGN.md — liste su gušće od ostalog sadržaja. Visina linije
     ostaje --tbl-line, pa promena veličine slova ne pomera visinu reda. */
  font-size: 13px;
  line-height: var(--tbl-line);
}.kt .tblh tr.par {
  background: var(--surface-alt);
}.kt .tblh tr.nepar {
  background: var(--surface);
  color: var(--text);
}.kt .tblh tr:hover:not(.listtitle) {
  background: var(--accent-tint);
}

/* `invisible` = neaktivan pacijent (danger), `highlight` = podsetnik koji
   ističe (highlight). Ranije su delile `danger-row`, pa je podsetnik izgledao
   kao greška; uz to je tabela podsetnika imala svoje pravilo, tj. ista klasa
   je davala dva izgleda. */
.kt .tblh tr.invisible {
  background: var(--danger-row);
}

.kt .tblh tr.invisible:hover {
  background: var(--danger-row-hover);
}

.kt .tblh tr.highlight {
  background: var(--highlight);
}

.kt .tblh tr.highlight:hover {
  background: var(--highlight-soft);
}

/* ==== Jedinstven red liste ====

   1) Link u ćeliji nosi SAMO boju iz teme (najtamnija zelena) — font, veličina
      i visina linije su iste kao kod običnog teksta, pa link i ne-link stoje u
      istoj liniji i ne prave dve vrste teksta u tabeli. Da je klikabilan
      dodatno potvrđuje strelica koja izlazi na hover (tačka 3).

   2) Sve što ćelija sme da sadrži staje u jednu liniju (`--tbl-line`), pa red
      sa ikonicom/dugmetom ima ISTU visinu kao red sa običnim tekstom. Ranije
      su tri visine živele jedna pored druge: 35.3px (samo tekst), 37.8px
      (kanta u koloni "Akcija") i 42.5px (dugme "Poruka" u dužnicima i
      rođendanima).

   3) Strelica na hover je `background-image` NA SAMOM LINKU, a ne `::after`.
      Pozadina po definiciji ne ulazi u layout, pa ne može da pomeri tekst ni
      da povisi red. `::after` je ovde već jednom promašio: i sa
      `position: absolute` je podizao red sa 35px na 55px, jer pseudo-element
      i dalje učestvuje u line box-u svog inline roditelja. Mesto za strelicu
      drži `padding-right`, koji na inline elementu utiče samo na širinu. */
.kt .tblh td a {
  color: var(--accent-strong);
  font: inherit;
  text-decoration: none;
}

.kt .tblh td a:hover,
.kt .tblh td a:focus-visible {
  text-decoration: underline;
}

/* Ikonice-akcije (kanta, "idi na posetu") su same po sebi ikonica — njima ne
   treba još jedna strelica, niti rezervisan prostor koji bi ih rascentrirao. */
.kt .tblh td a:not(.kt-icon-only) {
  padding-right: 15px;
  background-repeat: no-repeat;
  background-position: right center;
  background-size: 11px 11px;
}

/* Phosphor `arrow-square-out`. Boja je upisana u SVG (`--accent-strong`) jer
   pozadina ne ume da prati `currentColor`; link u tabeli ionako ima tačno tu
   boju u svim stanjima. */
.kt .tblh td a:not(.kt-icon-only):hover,
.kt .tblh td a:not(.kt-icon-only):focus-visible {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256' fill='%230e6856'%3E%3Cpath d='M216,104a8,8,0,0,1-16,0V59.32l-66.33,66.34a8,8,0,0,1-11.32-11.32L188.68,48H144a8,8,0,0,1,0-16h64a8,8,0,0,1,8,8Zm-16,40a8,8,0,0,0-8,8v40H56V72h48a8,8,0,0,0,0-16H56A16,16,0,0,0,40,72V192a16,16,0,0,0,16,16H192a16,16,0,0,0,16-16V152A8,8,0,0,0,200,144Z'/%3E%3C/svg%3E");
}

/* Kontrole u ćeliji: ista visina kao linija teksta, bez sopstvenog min-height
   koji bi gurao red. Ikonica se centrira u toj liniji. */
.kt .tblh td .kt-msg-btn,
.kt .tblh td .kt-rodj-btn,
.kt .tblh td .kt-icon-only {
  height: var(--tbl-line);
  min-width: 0;
  min-height: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-1);
  vertical-align: top;
  line-height: 1;
}

.kt .tblh td .kt-msg-btn,
.kt .tblh td .kt-rodj-btn {
  padding: 0 var(--space-1_5);
  font-size: 12px;
}

.kt .tblh td .kt-icon-only {
  width: var(--tbl-line);
  padding: 0;
}

/* Ćelija sa akcijom: uska koliko i sama akcija, uvek centrirana. */
.kt .tblh td.kt-cell-action,
.kt .tblh th.kt-cell-action {
  width: 1%;
  text-align: center;
  white-space: nowrap;
}

/* Brojevi (cene, iznosi, količine) su desno poravnati u SVIM tabelama. */
.kt .tblh td.kt-num,
.kt .tblh th.kt-num {
  text-align: right;
  white-space: nowrap;
}

.kt .tblh td.kt-cell-center,
.kt .tblh th.kt-cell-center {
  text-align: center;
}

/* Prazna vrednost u ćeliji je crtica u `muted`, ne prazan prostor — prazna
   ćelija se čita kao greška u podacima, crtica kao „nema podatka". */
.kt .tblh .kt-cell-empty {
  color: var(--muted);
}

/* „+N" kad se nabrajanje u ćeliji skraćuje (npr. ljubimci vlasnika). */
.kt .tblh .kt-cell-more {
  display: inline-block;
  padding: 0 var(--space-1);
  border-radius: var(--radius-sm);
  background: var(--surface-alt);
  color: var(--muted);
  font-size: 11px;
  font-weight: 600;
}

/* Kolona se bira klasom, ne rednim brojem. `nth-child` je ovde već jednom
   promašio: rođendani su u međuvremenu izgubili kolonu "Br. k.", a pravila su
   ostala na starim indeksima, pa je kolona "Poruka" bila bez `width: 1%`, a
   `nowrap` je pao na pogrešne tri kolone. Klase drže isto ponašanje u svim
   listama i ne pomeraju se kad kolona dođe ili ode. */
.kt .tblh td.kt-nowrap,
.kt .tblh th.kt-nowrap {
  white-space: nowrap;
}

/* Kolona sa dugmetom "Poruka": uska koliko i dugme, nikad prelomljena. */
.kt .tblh td.kt-msg-cell,
.kt .tblh th.kt-msg-cell {
  width: 1%;
  white-space: nowrap;
}

/* Finansijska kartica — saldo je zbir, ne stavka: odvojen je linijom, a znak
   ostaje obojen (dug crveno, pretplata zeleno). Boja je ranije bila inline. */
.kt .kt-finance-table tr.kt-finance-saldo td {
  border-top: 2px solid var(--line-strong);
  font-weight: 600;
}

.kt .kt-finance-table td.kt-saldo-dug {
  color: var(--danger-strong);
}

.kt .kt-finance-table td.kt-saldo-ok {
  color: var(--accent-strong);
}

/* Današnji rođendan — blagi akcenat, ne crveni `highlight` koji u ostatku
   aplikacije znači "dospelo / kasni". */
.kt .tblh tr.kt-rodj-today {
  background: var(--surface-soft);
}

.kt .tblh tr.kt-rodj-today:hover {
  background: var(--accent-soft);
}

.kt .tblh tr.kt-rodj-today td:first-child {
  box-shadow: inset 3px 0 0 var(--accent);
}

/* Red čija je čestitka poslata ostaje čitljiv, ali vizuelno "skinut sa spiska". */
.kt .tblh tr.kt-rodj-sent td {
  color: var(--muted);
}

.kt .tblh tr.kt-rodj-sent a {
  color: var(--muted);
}

/* Čestitka je poslata — dugme za slanje nema više šta da radi, pa se sklanja i
   ostaje samo oznaka (klik na nju poništava grešku i dugme se vraća). Pravilo
   je vezano za klasu reda, koju održavaju i serverski ispis i JS, pa radi u
   oba smera bez osvežavanja strane. */
/* Dugme u koloni "Poruka" — JEDNO po redu, dva stanja na istom elementu.
   `min-width` je jedini razlog zbog kog kolona ne skače: "Poruka" i "Poslato"
   zauzimaju istu kutiju, pa su sva dugmad u koloni poravnata bez obzira na
   stanje. Ne dodavati drugo dugme u ovu ćeliju. */
.kt .kt-rodj-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-1_5);
  min-width: 104px;
  min-height: 28px;
  padding: 4px 10px;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-sm);
  background: var(--surface);
  color: var(--accent-strong);
  cursor: pointer;
  font-family: inherit;
  font-size: 12px;
  font-weight: 600;
  transition: background var(--motion-fast) var(--ease), border-color var(--motion-fast) var(--ease);
}

.kt .kt-rodj-btn:hover,
.kt .kt-rodj-btn:focus-visible {
  border-color: var(--accent);
  background: var(--accent-tint);
}

/* Poslato je evidencija, ne akcija — zato tiho, bez punog fila koji bi u gustoj
   tabeli vukao pažnju jače od dugmeta koje tek treba kliknuti. */
.kt .kt-rodj-btn.is-sent {
  border-color: var(--line);
  background: transparent;
  color: var(--muted);
  font-weight: 600;
}

.kt .kt-rodj-btn.is-sent:hover,
.kt .kt-rodj-btn.is-sent:focus-visible {
  border-color: var(--line-strong);
  background: var(--surface-alt);
  color: var(--text);
}

/* Rođendan koji tek dolazi: dugme se vidi (kolona ne skače, korisnik zna da će
   akcija postojati) ali ne reaguje — ni na hover. Bez ovog reseta hover
   pravilo iznad i dalje menja ivicu i pozadinu na onemogućenom dugmetu, pa
   deluje kao da se može kliknuti. */
.kt .kt-rodj-btn[disabled] {
  opacity: 0.55;
  cursor: not-allowed;
}

.kt .kt-rodj-btn[disabled]:hover,
.kt .kt-rodj-btn[disabled]:focus-visible {
  border-color: var(--line-strong);
  background: var(--surface);
  color: var(--accent-strong);
}

.kt #stavke th,
.kt #stavke td {
  padding: 4px 8px 4px 0;
  text-align: left;
  vertical-align: middle;
}

.kt #stavke td:first-child {
  width: 44px;
}

.kt #stavke th:nth-child(2),
.kt #stavke th:nth-child(3),
.kt #stavke td:nth-child(3),
.kt #stavke td:nth-child(4) {
  width: 150px;
}

.kt #stavke select {
  width: 100%;
}

.kt #stavke input[type="text"] {
  width: 100% !important;
  text-align: right;
}

.kt .kt-empty-row td,
.kt td.kt-empty-row,
.kt li.kt-empty-note {
  padding: 14px 12px;
  color: var(--muted);
  font-style: italic;
}

.kt li.kt-empty-note {
  list-style: none;
  padding: 4px 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.kt .kt-payment-form {
  margin: 0 0 16px;
}

.kt .kt-payment-form .kt-table-scroll {
  margin-bottom: 0;
}

.kt table.kt-payment-table {
  min-width: 560px;
}

.kt .kt-payment-table td {
  vertical-align: middle;
}

.kt .kt-payment-table tr:last-child:hover {
  background: var(--surface-alt-2);
}

/* Red za unos uplate je forma u podnožju tabele. `display: flex` na ćeliji
   poništava `colspan`, pa se traka završavala na ~2/3 tabele; unutrašnji
   omotač drži raspored polja, a ćelija ostaje ćelija i pokriva ceo red. */
.kt .kt-payment-entry-row td {
  padding: 12px !important;
  background: var(--surface-alt-2);
  white-space: nowrap;
}

.kt .kt-payment-entry-row input[name="u_datum"],
.kt .kt-payment-entry-row input[name="u_iznos"],
.kt .kt-payment-entry-row input[type="submit"],
.kt .kt-payment-entry-row button[type="submit"] {
  width: auto !important;
  margin: 0 8px 0 0;
  vertical-align: middle;
}

.kt .kt-payment-entry-row input[name="u_datum"] {
  min-width: 170px;
}

.kt .kt-payment-entry-row input[name="u_iznos"] {
  min-width: 190px;
  text-align: right !important;
}

.kt .kt-payment-entry-row input[type="submit"],
.kt .kt-payment-entry-row button[type="submit"] {
  min-width: 166px;
  margin-right: 0;
}

/* ===== Karton -> tab „Dugovanja" =====
   Zbirni dug vlasnika + izvod finansijske kartice. Uplata se ne unosi odavde,
   nego na strani vlasnika — zato tab nudi samo poruku i link ka kartici. */
.kt .kt-debt-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  margin: 0 0 var(--space-3);
  padding: var(--space-3);
  border: 1px solid var(--danger);
  border-radius: var(--radius);
  background: var(--danger-soft);
}

.kt .kt-debt-total {
  display: flex;
  flex-direction: column;
  gap: var(--space-0_5);
  margin: 0;
}

.kt .kt-debt-label {
  color: var(--danger-strong);
  font-size: var(--text-label);
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.kt .kt-debt-total strong {
  color: var(--danger-strong);
  font-size: var(--text-h2);
}

.kt .kt-debt-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
}

/* Dva dugmeta u istom redu moraju da budu ISTA kutija. <button> (poruka) i <a>
   (kartica vlasnika) inače daju različitu visinu — <a> nosi bazne margine i
   veći line-height — zato se oba ovde izjednačavaju na sekundarni (outline)
   recept. Compact siva varijanta iz `.kt-msg-cell` važi samo u gustim tabelama. */
.kt .kt-debt-actions .kt-msg-btn,
.kt .kt-debt-actions a.kt-button {
  height: 36px;
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-1_5);
  margin: 0;
  padding: 0 14px;
  border: 1px solid var(--accent);
  border-radius: var(--radius);
  background: #ffffff;
  color: var(--accent-strong);
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
}

.kt .kt-debt-actions .kt-msg-btn:hover,
.kt .kt-debt-actions .kt-msg-btn:focus-visible,
.kt .kt-debt-actions a.kt-button:hover,
.kt .kt-debt-actions a.kt-button:focus-visible {
  border-color: var(--accent-strong);
  background: var(--accent-tint);
  color: var(--accent-strong);
}

.kt .kt-debt-note {
  align-items: flex-start;
}

.kt .kt-debt-note i {
  margin-top: 2px;
}

.kt table.kt-debt-table {
  min-width: 520px;
}

/* Iznosi u kartici duga koriste zajednički `kt-num`, kao i sve ostale liste. */

/* Stavka koja pripada ovom kartonu — oznaka je tekst, ne samo boja. */
.kt .kt-debt-mine {
  display: inline-block;
  margin-left: var(--space-1);
  padding: 1px var(--space-1_5);
  border-radius: var(--radius-sm);
  background: var(--accent-soft);
  color: var(--accent-strong);
  font-size: var(--text-caps);
  font-weight: 600;
}

.kt .kt-debt-foot {
  margin: 0;
  color: var(--muted);
  font-size: var(--text-sm);
}

@media (max-width: 620px) {
  .kt .kt-debt-head {
    align-items: stretch;
    flex-direction: column;
  }

  .kt .kt-debt-actions a.kt-button,
  .kt .kt-debt-actions .kt-msg-btn {
    flex: 1 1 auto;
    justify-content: center;
  }
}

.kt .kt-settings-form {
  display: flex !important;
  flex-direction: column;
  align-items: stretch;
  gap: var(--space-5);
  margin: 0;
}

/* Sekcija podešavanja: naslov + (opciono) objašnjenje + mreža polja. */
.kt .kt-settings-section {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.kt .kt-settings-section h2 {
  margin: 0;
  color: var(--text);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.3;
}

/* Sekcija odvojena linijom od sadržaja iznad (npr. grupne akcije ispod forme). */
.kt .kt-settings-section-separated {
  margin-top: var(--space-5);
  padding-top: var(--space-5);
  border-top: 1px solid var(--line);
}

/* Objašnjenje uz sekciju. */
.kt .kt-settings-hint {
  max-width: 72ch;
  margin: 0;
  color: var(--muted);
  font-size: 12.5px;
  line-height: 1.5;
}

.kt .kt-settings-hint code,
.kt .kt-settings-field code {
  padding: 1px 4px;
  border-radius: var(--radius-sm);
  background: var(--surface-alt-2);
  font-size: 11.5px;
}

/* Mreža polja: labela iznad, polje ispod, objašnjenje na dnu. */
.kt .kt-settings-block {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: var(--space-4);
  /* bez ovoga grid izjednači visine kolona i input se rastegne kao textarea */
  align-items: start;
}

/* Uži jednokolonski blok za kratke forme (Osnovna naslov, Privatnost). */
.kt .kt-settings-block-narrow {
  grid-template-columns: minmax(0, 420px);
}

.kt .kt-settings-field {
  display: flex;
  flex-direction: column;
  gap: var(--space-1_5);
  min-width: 0;
}

.kt .kt-settings-field > span {
  color: var(--text);
  font-size: 12px;
  font-weight: 600;
}

.kt .kt-settings-field input[type="text"],
.kt .kt-settings-field input[type="password"],
.kt .kt-settings-field input[type="number"],
.kt .kt-settings-field textarea {
  width: 100%;
  margin: 0;
  flex: 0 0 auto;
}

.kt .kt-settings-field textarea {
  min-height: 78px;
  resize: vertical;
}

.kt .kt-settings-field > small {
  color: var(--muted);
  font-size: 11.5px;
  line-height: 1.45;
}

/* Kratko polje (npr. pozivni broj) — input ne mora preko cele kolone. */
.kt .kt-settings-field-narrow input {
  max-width: 150px;
}

/* Polje + prateca dugmad/opcije u istom redu (npr. Vrsta: input + presetovi,
   Pol: dva radio dugmeta). Prelama se na uzem ekranu umesto da izlazi iz reda. */
.kt .kt-field-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
  min-width: 0;
}

.kt .kt-field-row > input[type="text"] {
  flex: 1 1 auto;
  min-width: 0;
}

.kt .kt-field-row > label {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  white-space: nowrap;
}

/* Polje koje zauzima ceo red auto-fit mreze. */
.kt .kt-field-wide {
  grid-column: 1 / -1;
}

/* Karton pacijenta: jedna eksplicitna mreza i jedan sizing ugovor za sve
   kontrole. Svako polje popunjava svoj track; segmentirane kontrole dele
   raspolozivu sirinu na jednake opcije:
     red 1  Br. cipa | Ime | Datum | Status
     red 2  Vrsta (2 kolone) | Rasa | Pol
     red 3  Udomljen */
.kt .kt-karton-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.kt .kt-karton-grid .kt-settings-field {
  grid-column: span 1;
}

/* Eksplicitni span ne preopterecuje .kt-field-wide, koji i dalje znaci ceo red. */
.kt .kt-karton-grid .kt-field-span-2 {
  grid-column: span 2;
}

.kt .kt-karton-grid .kt-species-picker {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.kt .kt-karton-grid button.kt-species-button {
  width: 100%;
  min-width: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.kt .kt-karton-grid .kt-choice-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.kt .kt-karton-grid label.kt-choice {
  width: 100%;
  min-width: 0;
  justify-content: center;
}

@media (max-width: 1100px) {
  .kt .kt-karton-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .kt .kt-karton-grid .kt-field-span-2,
  .kt .kt-karton-grid .kt-settings-field:has(#pacijent_rasa) {
    grid-column: span 2;
  }
}

@media (max-width: 620px) {
  .kt .kt-karton-grid,
  .kt .kt-karton-grid .kt-field-span-2,
  .kt .kt-karton-grid .kt-settings-field:has(#pacijent_rasa) {
    grid-template-columns: minmax(0, 1fr);
    grid-column: span 1;
  }

  .kt .kt-karton-grid .kt-species-picker {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Vrednost koju korisnik ne unosi nego je sistem prikazuje (npr. broj kartona). */
.kt .kt-value-static,
.kt .kt-value-auto {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  font-size: 14px;
}

.kt .kt-value-static {
  color: var(--text);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.kt .kt-value-auto {
  color: var(--muted);
  font-style: italic;
}

/* Blok u kome svako polje ide u svoj red pune sirine (npr. textarea polja
   na poseti) — za razliku od podrazumevane auto-fit mreze. */
.kt .kt-block-stacked {
  grid-template-columns: minmax(0, 1fr);
}

.kt .kt-block-stacked textarea {
  width: 100%;
  min-height: 96px;
  resize: vertical;
}

/* Kratak pregled podataka iznad forme (npr. Pacijent/Vlasnik na poseti). */
.kt .kt-meta-list {
  display: grid;
  grid-template-columns: minmax(96px, auto) minmax(0, 1fr);
  gap: var(--space-1) var(--space-3);
  margin: 0 0 var(--space-4);
  padding-bottom: var(--space-4);
  border-bottom: 1px solid var(--line);
  font-size: 13px;
}

.kt .kt-meta-list dt {
  color: var(--muted);
  font-weight: 600;
}

.kt .kt-meta-list dd {
  margin: 0;
  color: var(--text);
}


/* Red sa akcijama forme: odvojen linijom, dugme levo — dosledno na svim tabovima. */
.kt .kt-settings-actions {
  display: flex;
  gap: var(--space-3);
  padding-top: var(--space-4);
  border-top: 1px solid var(--line);
}

.kt .kt-settings-submit {
  min-width: 92px;
  margin: 0 !important;
}

/* Jedinstvena alert komponenta.
   Transientne poruke nose data-kt-alert-timeout="10000"; validacione i trajna
   poslovna stanja nemaju timeout i ostaju dok ih korisnik ne resi/zatvori. */
.kt .kt-alert-stack {
  width: 100%;
  box-sizing: border-box;
}

.kt .kt-alert {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-2);
  width: 100%;
  box-sizing: border-box;
  margin: 0 0 14px;
  padding: 8px 8px 8px 12px;
  border: 1px solid transparent;
  border-radius: var(--radius);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
  overflow: hidden;
  transition:
    opacity var(--motion) var(--ease),
    transform var(--motion) var(--ease);
}

.kt .kt-alert > i:first-child {
  align-self: center;
  margin-top: 0;
  font-size: 18px;
}

.kt .kt-alert-content {
  min-width: 0;
  overflow-wrap: anywhere;
}

.kt .kt-alert-info {
  border-color: var(--info);
  background: var(--info-soft);
  color: var(--info-strong);
}

.kt .kt-alert-success {
  border-color: var(--success);
  background: var(--success-soft);
  color: var(--success-strong);
}

.kt .kt-alert-warning {
  border-color: var(--warning-border);
  background: var(--warning);
  color: var(--warning-text);
}

.kt .kt-alert-danger {
  border-color: var(--danger);
  background: var(--danger-soft);
  color: var(--danger-strong);
}

.kt .kt-alert-close {
  display: inline-grid;
  place-items: center;
  align-self: center;
  min-width: 44px;
  height: 32px;
  margin: -7px -4px -7px 0;
  padding: 0;
  border: 0;
  border-radius: var(--radius-sm);
  background: transparent;
  color: currentColor;
  font: inherit;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  opacity: 0.78;
  transition:
    background-color var(--motion-fast) var(--ease),
    opacity var(--motion-fast) var(--ease);
}

.kt .kt-alert-close:hover {
  background: rgb(255 255 255 / 55%);
  opacity: 1;
}

.kt .kt-alert-close:focus-visible {
  outline: 2px solid var(--focus);
  outline-offset: -2px;
  opacity: 1;
}

.kt .kt-alert.is-dismissing {
  opacity: 0;
  transform: translateY(-4px);
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  .kt .kt-alert {
    transition: opacity 1ms linear;
  }

  .kt .kt-alert.is-dismissing {
    transform: none;
  }
}

.kt .kt-reminder-type-group h2 {
  margin: 0 0 12px;
  font-size: 17px;
}

.kt .kt-reminder-type-group .kt-table-scroll {
  margin-bottom: 14px;
}

.kt table.kt-reminder-type-table {
  min-width: 0;
}

.kt .kt-reminder-type-table td:first-child {
  width: 64px;
  color: var(--muted);
}

/* Kolona "Brisanje" nosi `kt-cell-action`, a kontrola `kt-icon-only`, kao i u svim
   ostalim listama — izgled i visina reda dolaze iz jedinstvenog bloka. */

/* Forma za nov tip podsetnika: labele iznad polja, dugme poravnato sa poljima. */
.kt .kt-reminder-type-form {
  display: flex !important;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--space-3);
  padding-top: var(--space-4);
  border-top: 1px solid var(--line);
}

.kt .kt-reminder-type-field-pos {
  flex: 0 0 auto;
}

.kt .kt-reminder-type-field-name {
  flex: 1 1 220px;
  max-width: 360px;
}

.kt .kt-reminder-type-pos {
  width: 72px !important;
  text-align: center;
}

.kt .kt-reminder-type-name {
  width: 100% !important;
}

.kt .kt-reminder-type-form input[type="submit"],
.kt .kt-reminder-type-form button[type="submit"] {
  min-width: 92px;
  margin: 0 !important;
}

.kt .kt-pagination {
  width: 100% !important;
  clear: both;
  float: none !important;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: 16px 0 0;
  padding: 10px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--elev-grouped);
}

.kt .kt-pagination-pages {
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.kt .kt-page-link,
.kt .kt-page-current,
.kt .kt-page-disabled,
.kt .kt-page-ellipsis {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 7px 11px;
  border-radius: var(--radius-sm);
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0;
  text-decoration: none;
}

.kt .kt-page-link {
  -webkit-appearance: none;
  appearance: none;
  border: 1px solid var(--line);
  background: #ffffff;
  color: var(--accent-strong);
  font-family: inherit;
  cursor: pointer;
}

.kt .kt-page-link:not(:disabled):hover {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent-strong);
  text-decoration: none;
}

.kt .kt-page-link:disabled {
  border-color: #e5ebee;
  background: var(--surface-alt);
  color: var(--muted);
}

.kt .kt-page-current {
  min-width: 34px;
  border: 1px solid var(--accent);
  background: var(--accent);
  color: #ffffff;
}

.kt .kt-page-disabled {
  border: 1px solid #e5ebee;
  background: var(--surface-alt);
  color: var(--muted);
}

.kt .kt-page-ellipsis {
  min-width: 28px;
  padding-inline: 4px;
  color: var(--muted);
}

.kt .kt-pagination-jump {
  float: none !important;
  margin-left: auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  color: var(--text);
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
}

.kt .kt-pagination-jump [data-page-jump] {
  width: 58px !important;
  min-height: 34px;
  margin: 0;
  text-align: center !important;
}

.kt .kt-pagination-go {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 7px 12px;
  -webkit-appearance: none;
  appearance: none;
  border: 1px solid var(--nav-2);
  border-radius: var(--radius-sm);
  background: var(--nav-2);
  color: #ffffff;
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
  cursor: pointer;
}

.kt .kt-pagination-go:hover {
  border-color: var(--nav);
  background: var(--nav);
  color: #ffffff;
  text-decoration: none;
}

.kt .kt-split-tab .kt-pagination {
  align-items: stretch;
  flex-direction: column;
  justify-content: flex-start;
  gap: 8px;
  margin-top: 12px;
}

.kt .kt-split-tab .kt-pagination-pages {
  width: 100%;
  justify-content: flex-start;
}

.kt .kt-split-tab .kt-pagination-jump {
  width: 100%;
  margin-left: 0;
  justify-content: flex-start;
  white-space: normal;
}

.kt .kt-split-tab .kt-pagination-jump [data-page-jump] {
  flex: 0 0 64px;
  width: 64px !important;
}.kt .tblh .kt-has-fa-icon {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  text-decoration: none;
}.kt .tblh .kt-has-fa-icon:hover {
  text-decoration: none;
}

.kt .kt-icon-only {
  min-width: 34px;
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 7px;
  -webkit-appearance: none;
  appearance: none;
  border: 0;
  border-radius: var(--radius-sm);
  background: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
}
/* Veličinu ikonice-akcije u listama drži jedinstveni blok „Jedinstven red
   liste" gore — ovde bi lokalni padding vratio raskorak visina redova. */

.kt .kt-icon-only:hover,
.kt .kt-icon-only:focus {
  background: var(--danger-soft);
}

.kt .kt-icon-only:hover .kt-fa-danger,
.kt .kt-icon-only:focus .kt-fa-danger {
  color: var(--danger-strong);
}

.kt .kt-fa-danger {
  color: var(--danger);
}

.kt .kt-fa-action {
  color: var(--accent);
}

.kt #minilist {
  width: min(420px, calc(100vw - 32px));
  border: 1px solid var(--line-strong);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

/* Obojena leva ivica je ravna — pravilo za ceo projekat. Traka u boji nosi
   značenje (tip, hitnost, alarm), a zaobljen ugao je pravi klinom i stanjuje
   je pri vrhu i dnu. Zaobljenje ostaje samo na desnoj strani. */
.kt .napomena {
  border: 1px solid var(--line-strong);
  border-left: 4px solid var(--accent);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  background: var(--surface-alt-2);
}

/* Login izgled je u celosti u css/login.css (učitava se posle ovog fajla) */

@media (max-width: 760px) {
  .kt {
    font-size: 14px;
  }

  .kt input[type="text"],
  .kt input[type="search"],
  .kt input[type="password"],
  .kt input[type="number"],
  .kt input[type="date"],
  .kt select,
  .kt textarea,
  .kt .kt-control {
    font-size: 16px;
  }

  .kt #wrapper {
    width: min(100% - 20px, 760px);
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    padding-top: 0;
  }

  .kt #nav {
    width: 100%;
    position: sticky;
    top: 0;
    flex-wrap: wrap;
  }

  .kt #nav a,
  .kt #nav .kt-nav-logout-button {
    min-height: 32px;
    padding: 8px;
  }

  .kt #center {
    order: 2;
  }

  .kt #center h1,
  .kt .kt-search-header h1,
  .kt #center .kt-search-header h1 {
    font-size: 20px;
  }

  .kt .kt-owner-debt-alert {
    width: 100%;
  }

  .kt .group,
  .kt #settings {
    padding: 10px;
  }

  .kt .group form {
    align-items: stretch;
  }

  .kt .group form > * {
    max-width: 100%;
  }

  .kt .group form input[type="text"] {
    flex: 1 1 180px;
  }

  .kt .kt-owner-form {
    grid-template-columns: minmax(0, 1fr);
  }

  .kt .kt-owner-form > hr {
    grid-column: 1;
    grid-row: auto;
  }

  .kt .kt-patient-form {
    padding: 10px;
  }

  .kt .kt-owner-tabs {
    flex-wrap: wrap;
  }

  .kt .kt-owner-tab {
    flex: 1 1 auto;
    justify-content: center;
    padding: 9px 10px;
  }

  .kt .kt-owner-panel {
    padding: 14px;
  }

  .kt .kt-owner-meta,
  .kt .kt-owner-fields {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }

  .kt .kt-owner-fields {
    gap: 12px;
  }

  .kt .kt-owner-meta > div {
    grid-template-columns: minmax(0, 1fr);
    gap: 2px;
    padding: 8px 0;
  }

  .kt .kt-patient-form > input[type="submit"],
  .kt .kt-patient-form > input[type="reset"],
  .kt .kt-patient-form > hr {
    grid-column: 1;
  }

  .kt .kt-patient-form > input[type="submit"],
  .kt .kt-patient-form > input[type="reset"] {
    width: 100%;
    justify-self: stretch;
  }

  .kt ul.tabs.kt-tabs {
    align-items: stretch;
  }

  .kt ul.tabs.kt-tabs li {
    flex: 1 1 120px;
  }

  .kt ul.tabs.kt-tabs li a.kt-tab-link {
    justify-content: center;
    border-bottom: 1px solid var(--line);
    border-radius: var(--radius);
  }

  .kt .kt-tab-container {
    border-radius: var(--radius);
  }

  .kt .kt-split-tab.kt-tab-active {
    display: block !important;
  }

  .kt .duznici-stats,
  .kt .kt-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .kt .kt-tab-list-pane,
  .kt .kt-detail-pane {
    width: 100% !important;
    max-width: 100%;
    float: none !important;
    margin: 0 0 10px;
  }

  .kt .kt-detail-pane {
    min-height: 120px;
  }

  .kt .kt-inline-action-form {
    align-items: stretch;
  }

  .kt .kt-inline-action-form select,
  .kt .kt-inline-action-form input[type="text"],
  .kt .kt-inline-action-form input[type="submit"],
  .kt .kt-inline-action-form button[type="submit"] {
    width: 100% !important;
    flex: 1 1 100%;
  }

  .kt .kt-pagination {
    align-items: stretch;
    flex-direction: column;
  }

  .kt .kt-pagination-pages {
    gap: 5px;
  }

  .kt .kt-page-link,
  .kt .kt-page-current,
  .kt .kt-page-disabled,
  .kt .kt-page-ellipsis {
    min-height: 32px;
    padding: 6px 9px;
    font-size: 12px;
  }

  .kt .kt-pagination-jump {
    width: 100%;
    margin-left: 0;
    justify-content: flex-start;
    white-space: normal;
  }

  .kt .kt-pagination-jump [data-page-jump] {
    flex: 1 1 auto;
    width: auto !important;
    max-width: 120px;
  }.kt table.tblh {
    min-width: 640px;
  }

  .kt .kt-table-scroll {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .kt table.kt-payment-table {
    width: 100% !important;
    min-width: 0;
    max-width: 100%;
    table-layout: fixed;
  }

  .kt .kt-payment-table th.kt-cell-action {
    width: auto;
    white-space: normal;
  }

  .kt .kt-payment-entry-row {
    display: table-row;
    width: auto !important;
  }

  .kt .kt-payment-entry-row td {
    width: auto !important;
    white-space: normal;
  }

  .kt .kt-payment-entry-row input[name="u_datum"],
  .kt .kt-payment-entry-row input[name="u_iznos"],
  .kt .kt-payment-entry-row input[type="submit"],
  .kt .kt-payment-entry-row button[type="submit"] {
    width: 100% !important;
    min-width: 0;
    margin: 0 0 8px;
  }

  .kt .kt-settings-actions {
    flex-direction: column;
  }

  .kt .kt-settings-actions input[type="submit"],
  .kt .kt-settings-actions button[type="submit"] {
    width: 100% !important;
  }

  /* .tab_content u selektoru daje veću specifičnost od baznog
     `.kt .kt-settings-bulk form { width: auto !important }` na dnu fajla. */
  .kt .tab_content .kt-settings-bulk,
  .kt .tab_content .kt-settings-bulk form,
  .kt .tab_content .kt-settings-bulk input[type="submit"],
  .kt .tab_content .kt-settings-bulk button[type="submit"] {
    width: 100% !important;
  }

  .kt .kt-settings-field-narrow input {
    max-width: none;
  }

  .kt .kt-reminder-type-form {
    align-items: stretch;
  }

  .kt .kt-reminder-type-field-pos,
  .kt .kt-reminder-type-field-name {
    flex: 1 1 100%;
    max-width: none;
  }

  .kt .kt-reminder-type-pos,
  .kt .kt-reminder-type-name,
  .kt .kt-reminder-type-form input[type="submit"],
  .kt .kt-reminder-type-form button[type="submit"] {
    width: 100% !important;
    max-width: none;
  }
}

@media (max-width: 480px) {
  .kt #wrapper {
    width: calc(100% - 12px);
  }

  .kt #nav {
    width: calc(100% - 12px);
  }

}

.kt .kt-document-view {
  max-width: 760px;
  padding: 18px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--elev-raised);
}

.kt .kt-document-view h1 {
  margin: 0 0 14px;
  font-size: 22px;
}

.kt .kt-document-meta {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  gap: 8px 12px;
  margin: 0 0 16px;
}

.kt .kt-document-meta dt {
  font-weight: 600;
}

.kt .kt-document-meta dd {
  margin: 0;
}

.kt .kt-document-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.kt .kt-document-actions a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 34px;
  padding: 8px 14px;
  border-radius: var(--radius-sm);
  color: #ffffff;
  font-weight: 600;
  text-decoration: none;
}

.kt .kt-document-actions a:hover {
  color: #ffffff;
  text-decoration: none;
}

.kt .kt-visit-actions {
  margin-top: 14px;
}

/* Terapija u prikazu posete je obična lista (`tblh`) — ranije je imala svoj
   zaglavlje/ćelija recept, pa je ista tabela u detalju izgledala drugačije od
   svih ostalih. Ostaje samo margina; sve ostalo dolazi iz `tblh`. */
.kt .kt-visit-therapy {
  margin: 6px 0 0;
}

.kt .kt-visit-totals {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px 20px;
  margin: 12px 0 0;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}

.kt .kt-visit-totals strong {
  color: var(--text);
}

.kt .kt-visit-grand strong {
  color: var(--accent-strong);
  font-size: 15px;
}

/* Privacy blur za JMBG — mutan dok se ne klikne i unese PIN (Podešavanja).
   Nescope-ovano namerno: važi i u Old i u New look-u. */
.kt-jmbg {
  display: inline-block;
  filter: blur(5px);
  cursor: pointer;
  user-select: none;
  -webkit-user-select: none;
  transition: filter 0.15s ease;
}

.kt-jmbg:hover {
  filter: blur(3.5px);
}

body.kt-jmbg-revealed .kt-jmbg {
  filter: none;
  cursor: inherit;
  user-select: auto;
  -webkit-user-select: auto;
}

/* PIN modal (otkrivanje JMBG-a) — nescope-ovano, radi u oba look-a */
.kt-pin-overlay {
  position: fixed;
  inset: 0;
  z-index: 3000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  background: rgba(20, 30, 33, 0.45);
}

.kt-pin-modal {
  width: min(360px, 100%);
  padding: 20px;
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.28);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
}

.kt-pin-title {
  font-size: 16px;
  font-weight: 700;
  color: #1d2528;
}

.kt-pin-text {
  margin: 6px 0 12px;
  font-size: 13px;
  color: #5b6b72;
}

.kt-pin-input {
  width: 100% !important;
  letter-spacing: 0.18em;
  text-align: center;
  font-size: 18px;
}

.kt-pin-error {
  min-height: 18px;
  margin: 6px 0 0;
  color: #c4606a;
  font-size: 12px;
  font-weight: 600;
}

.kt-pin-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin: 14px 0 0;
}

.kt .kt-attachment-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  padding: 7px 11px;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-sm);
  background: var(--surface-muted);
  color: var(--link);
  font-weight: 600;
  text-decoration: none;
}

.kt .kt-attachment-link:hover {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent-strong);
  text-decoration: none;
}

/* Record liste (posete/protokoli/podsetnici): u New look-u su li kartice,
   pa se skida default ul marker i uvlačenje (Old look ostaje netaknut). */
.kt .lista-poseta,
.kt .lista-dokumenata,
.kt .lista-podsetnika {
  list-style: none;
  margin: 8px 0 0;
  padding-left: 0;
}

.kt .lista-podsetnika li {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

/* Brisanje podsetnika u kartonu koristi istu ikonicu-akciju kao liste
   (`kt-icon-only`), pa mu ne treba sopstveni izgled dugmeta. */
.kt .kt-list li .kt-icon-only,
.kt .lista-podsetnika li .kt-icon-only {
  width: auto;
  flex: 0 0 auto;
  border: 0;
  background: transparent;
}

.kt input[type="file"] {
  max-width: 100%;
  padding: 5px;
  border: 1px dashed var(--line-strong);
  border-radius: var(--radius-sm);
  background: var(--surface-muted);
  color: var(--text);
  font-family: inherit;
  font-size: 13px;
}

.kt input[type="file"]::file-selector-button {
  min-height: 30px;
  margin-right: 10px;
  padding: 6px 11px;
  border: 0;
  border-radius: var(--radius-sm);
  background: var(--slate);
  color: #ffffff;
  cursor: pointer;
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
}

.kt input[type="file"]::file-selector-button:hover {
  background: var(--slate-strong);
}

.kt #minilist table {
  width: 100%;
  border-collapse: collapse;
}

.kt #minilist a {
  display: block;
  padding: 7px 9px;
  border-radius: var(--radius-sm);
  color: var(--link);
  text-decoration: none;
}

.kt #minilist a:hover {
  background: var(--accent-soft);
  color: var(--accent-strong);
  text-decoration: none;
}

@media (max-width: 480px) {
  .kt .duznici-stats {
    grid-template-columns: minmax(0, 1fr);
  }

  .kt .kt-document-view {
    padding: 12px;
  }

  .kt .kt-document-meta {
    grid-template-columns: minmax(0, 1fr);
    gap: 4px;
  }

  .kt .kt-document-actions a {
    width: 100%;
  }
}

.kt #center {
  overflow: visible;
}

.kt #nav {
  background: var(--nav);
  border-color: rgba(255, 255, 255, 0.18);
}

.kt h1 .kt-fa-icon,
.kt h2 .kt-fa-icon,
.kt h3 .kt-fa-icon {
  background: var(--accent-soft);
}

.kt .group,
.kt #settings,
.kt #center > form,
.kt #center > fieldset,
/* `kt-table-scroll` nosi `raised` (DESIGN.md: „kartice i table-scroll
   kontejneri"); `grouped` je za grupisane površine i paginacionu traku. Ranije
   je ovaj blok pregazio `raised` postavljen gore, pa je lista imala dublju
   senku od kartice u kojoj stoji. */
.kt .kt-tab-container,
.kt .kt-detail-pane,
.kt .kt-document-view {
  box-shadow: var(--elev-grouped);
}

.kt .kt-button,
.kt input[type="submit"],
.kt input[type="reset"],
.kt input[type="button"] {
  border-radius: var(--radius);
}

/* Sekundarna dugmad su OUTLINE: bela povrsina, zeleni tekst i okvir.
   Tamni (slate) fill je bio pretezak — u gustom data-app ekranu je vukao
   paznju na sebe iako je rec o sporednoj akciji. Primarna akcija (Sacuvaj)
   ostaje puni zeleni fill, pa se hijerarhija i dalje jasno vidi. */
.kt input[type="button"],
.kt input[type="reset"],
.kt .kt-button-secondary,
.kt .kt-pagination-go {
  border: 1px solid var(--accent);
  background: #ffffff;
  color: var(--accent-strong);
}

.kt input[type="button"]:hover,
.kt input[type="reset"]:hover,
.kt .kt-button-secondary:hover,
.kt .kt-pagination-go:hover {
  border-color: var(--accent-strong);
  background: var(--accent-tint);
  color: var(--accent-strong);
}

.kt input[type="button"]:active,
.kt input[type="reset"]:active,
.kt .kt-button-secondary:active {
  background: var(--accent-soft);
}

/* Ikonica u outline dugmetu prati boju teksta. */
.kt .kt-button-secondary .ph,
.kt .kt-button-secondary .kt-fa-icon {
  color: inherit;
}

/* Anchor-dugme: `.kt a.kt-button` (blok „Dosledna stanja dugmadi") forsira beo
   tekst zbog filled varijanti i po specifičnosti pobeđuje outline pravilo, pa je
   sekundarno <a> dugme ostajalo belo na belom („Izmeni podatke o vlasniku",
   „Finansijska kartica i uplata"). Ovde se boja teksta vraća na accent. */
.kt a.kt-button.kt-button-secondary,
.kt a.kt-button.kt-button-secondary:link,
.kt a.kt-button.kt-button-secondary:visited,
.kt a.kt-button.kt-button-secondary:hover,
.kt a.kt-button.kt-button-secondary:focus,
.kt a.kt-button.kt-button-secondary:active {
  color: var(--accent-strong);
}

/* `min-width: 920px` je stajao ovde, ali nikad nije radio: `.kt table.tblh`
   (0,2,1) pobeđuje `.kt .kt-reminders-table` (0,2,0), pa je minimum uvek bio
   680px iz zajedničkog pravila. `table-layout: auto` je i inače podrazumevan. */

/* Bez px širina po koloni. Raniji blok je svakoj od prvih sedam kolona davao
   fiksnu širinu preko `nth-child`, pa je "Vrsta / rasa" na 160px lomila
   "pas / Labrador retriver" u dva reda i dizala red sa 35px na 55px, dok je
   "Vlasnik" na 34% + min-width 260px stajao poluprazan otkako u njemu nema
   adrese. Sada širinu diktira sadržaj, kao u svim ostalim listama; fiksira se
   samo ono što ima razlog, i to klasom (`kt-cell-center`, `kt-num`,
   `kt-msg-cell`) koja se ne pomera kad kolona dođe ili ode. */
.kt .kt-reminders-table td {
  overflow-wrap: normal;
  word-break: normal;
}

/* Oznaka reda koji ističe — `box-shadow: inset`, isto kao `kt-rodj-today` na
   rođendanima. Ranije je ovde bio `border-left: 4px`: on ulazi u layout, pa je
   pomerao sadržaj prve kolone i virio preko zaobljenog ugla `kt-table-scroll`
   omotača. Zato je tabela podsetnika izgledala „zalepljeno" i drugačije od
   svih ostalih lista, iako su joj svi ostali stilovi bili identični.
   Sama boja pozadine je gore, uz `tr.invisible` — ovde stoji samo traka. */
.kt .tblh tr.highlight td:first-child {
  box-shadow: inset 3px 0 0 var(--highlight-border);
}

.kt .kt-document-list {
  margin-top: 8px;
}

.kt .kt-document-list li a {
  width: 100%;
  min-height: 34px;
  border-color: var(--line);
  background: #fbfdfd;
  overflow-wrap: anywhere;
}

.kt .kt-document-list li a.current,
.kt .kt-document-list li a:hover {
  border-color: rgba(22, 141, 134, 0.38);
  background: var(--accent-soft);
}

@media (max-width: 760px) {
  .kt #wrapper {
    width: min(100% - 16px, 760px);
  }

  .kt #nav {
    border-radius: 0 0 var(--radius) var(--radius);
  }

  .kt #nav li {
    flex: 1 1 auto;
  }

  .kt #nav li.desno {
    flex: 0 1 auto;
  }

  /* Nav se ovde prelama u više redova — auto margina bi ostavila rupu u redu. */
  .kt #nav li.nav-desno {
    margin-left: 0;
  }

  .kt #nav a,
  .kt #nav .kt-nav-logout-button {
    justify-content: center;
  }

  .kt table.kt-reminders-table,
  .kt table.kt-reminders-table tbody,
  .kt table.kt-reminders-table tr,
  .kt table.kt-reminders-table td {
    display: block;
    width: 100% !important;
    min-width: 0 !important;
  }

  .kt table.kt-reminders-table {
    min-width: 0 !important;
    background: transparent;
    border-collapse: separate;
  }

  .kt table.kt-reminders-table tr.listtitle {
    display: none;
  }

  .kt table.kt-reminders-table tr.nepar,
  .kt table.kt-reminders-table tr.par,
  .kt table.kt-reminders-table tr.highlight {
    margin: 0 0 10px;
    padding: 10px;
    border: 1px solid var(--line);
    border-left: 4px solid var(--accent);
    /* Obojena leva ivica je ravna (vidi .napomena). */
    border-radius: 0 var(--radius) var(--radius) 0;
    background: #ffffff;
    box-shadow: var(--elev-grouped);
  }

  .kt table.kt-reminders-table tr.highlight {
    border-left-color: var(--highlight-border);
    background: var(--highlight-soft);
  }

  .kt table.kt-reminders-table tr.highlight td:first-child {
    border-left: 0;
  }

  .kt table.kt-reminders-table td {
    display: grid;
    grid-template-columns: 118px minmax(0, 1fr);
    gap: 10px;
    padding: 5px 0;
    border-bottom: 1px solid #eef4f3;
    text-align: left !important;
    overflow-wrap: anywhere;
  }

  .kt table.kt-reminders-table td:last-child {
    border-bottom: 0;
  }

  .kt table.kt-reminders-table td::before {
    content: attr(data-label);
    color: var(--muted);
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
  }

  .kt table.kt-responsive-table:not(.kt-reminders-table),
  .kt table.kt-responsive-table:not(.kt-reminders-table) tbody,
  .kt table.kt-responsive-table:not(.kt-reminders-table) tr,
  .kt table.kt-responsive-table:not(.kt-reminders-table) td {
    display: block;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .kt table.kt-responsive-table:not(.kt-reminders-table) {
    min-width: 0 !important;
    table-layout: auto;
    border-collapse: separate;
    background: transparent;
  }

  .kt table.kt-responsive-table:not(.kt-reminders-table) tr.listtitle {
    display: none;
  }

  .kt table.kt-responsive-table:not(.kt-reminders-table) tr.nepar,
  .kt table.kt-responsive-table:not(.kt-reminders-table) tr.par,
  .kt table.kt-responsive-table:not(.kt-reminders-table) tr.highlight {
    margin: 0 0 10px;
    padding: 10px;
    border: 1px solid var(--line);
    border-left: 4px solid var(--accent);
    /* Obojena leva ivica je ravna (vidi .napomena). */
    border-radius: 0 var(--radius) var(--radius) 0;
    background: var(--surface);
    box-shadow: var(--elev-grouped);
  }

  .kt table.kt-responsive-table:not(.kt-reminders-table) tr.highlight {
    border-left-color: var(--highlight-border);
    background: var(--highlight-soft);
  }

  .kt table.kt-responsive-table:not(.kt-reminders-table) tr.highlight td:first-child {
    border-left: 0;
  }

  .kt table.kt-responsive-table:not(.kt-reminders-table) td {
    display: grid;
    grid-template-columns: minmax(96px, 32%) minmax(0, 1fr);
    gap: 10px;
    padding: 6px 0;
    border: 0;
    border-bottom: 1px solid #eef4f0;
    text-align: left !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }

  .kt table.kt-responsive-table:not(.kt-reminders-table) td:last-child {
    border-bottom: 0;
  }

  .kt table.kt-responsive-table:not(.kt-reminders-table) td::before {
    content: attr(data-label);
    color: var(--muted);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.3;
    text-transform: uppercase;
  }

  .kt table.kt-responsive-table:not(.kt-reminders-table) td:empty {
    display: none;
  }

  .kt table.duznici-lista.kt-responsive-table:not(.kt-reminders-table),
  .kt table.kt-reminder-type-table.kt-responsive-table {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .kt table.kt-reminder-type-table.kt-responsive-table td:last-child {
    align-items: center;
  }

  .kt table.kt-reminder-type-table.kt-responsive-table td:last-child > .kt-icon-only {
    justify-self: start;
  }
}

/* ==== Dopune teme (kompletiranje) ==== */

.kt #center > table,
.kt #center > form > table {
  width: 100% !important;
  max-width: 100%;
}

/* Tabele-obrasci u protokolima (nalaz, sediment, test). U DESIGN.md su zavedene
   kao zatečeni izuzetak od pravila „tabela samo za podatke" — nove se ne prave.
   Širine kolona i polja dolaze odavde, ne iz inline `style` atributa. */
.kt table.kt-param-table,
.kt #center > form > table.kt-param-table {
  width: 100% !important;
  min-width: 0;
  max-width: 720px;
}

/* Nalaz (parametar | rezultat | jedinice | ref) — prva kolona nosi tekst, tri
   kolone unosa su uske i jednake. */
.kt table.kt-param-table-nalaz {
  max-width: 560px;
}

.kt .kt-param-table td .kt-param-input {
  width: 100%;
  max-width: 100px;
  text-align: center;
}

.kt .kt-param-table tr.kt-param-komentar td:first-child {
  vertical-align: top;
  white-space: nowrap;
}

.kt .kt-param-table tr.kt-param-komentar textarea {
  width: 100%;
  max-width: 360px;
}

/* Test-protokol: dva široka polja + uska kolona akcije. */
.kt table.kt-param-table-test {
  max-width: 760px;
}

.kt .kt-param-table-test td input[type="text"] {
  width: 100%;
}

/* Protokol forme nisu generičke data-liste: na mobilnom svaki nalaz postaje
   zasebna kartica sa tri jasno označena polja, komentar ostaje punom širinom,
   a sediment čuva odnos naziv–vrednost. Markup ostaje tabela zbog postojećeg
   backend ugovora, ali ne prolazi kroz `kt-responsive-table` enhancer. */
@media (max-width: 760px) {
  .kt table.kt-param-table,
  .kt table.kt-param-table > thead,
  .kt table.kt-param-table > tbody {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .kt table.kt-param-table {
    display: block;
    margin-bottom: var(--space-4);
    border-collapse: separate;
    background: transparent;
  }

  .kt table.kt-param-table > tbody {
    display: grid;
    gap: var(--space-2);
  }

  .kt table.kt-param-table td {
    min-width: 0;
    padding: 0;
    border: 0;
    overflow-wrap: anywhere;
  }

  .kt table.kt-param-table td .kt-param-input {
    width: 100%;
    min-width: 0;
    max-width: none;
  }

  /* Zaglavlja nalaza/testa/sačuvanih rezultata ostaju dostupna čitačima
     ekrana; vidljive labele su uz svako polje jer se kolone na uskom ekranu
     više ne čitaju horizontalno. */
  .kt table.kt-param-table-nalaz > thead,
  .kt table.kt-param-table-test > thead,
  .kt table.kt-param-table-results > thead {
    position: absolute;
    width: 1px !important;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
  }

  .kt table.kt-param-table-nalaz > tbody > tr {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(72px, 1fr));
    gap: var(--space-2);
    padding: var(--space-3);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    background: var(--surface);
  }

  .kt table.kt-param-table-nalaz > tbody > tr:not(.kt-param-komentar) > :first-child {
    grid-column: 1 / -1;
    min-width: 0;
    padding: 0;
    border: 0;
    color: var(--text);
    font-weight: 600;
    overflow-wrap: anywhere;
  }

  .kt table.kt-param-table-nalaz > tbody > tr:not(.kt-param-komentar) > td:nth-child(n + 2)::before,
  .kt table.kt-param-table-test > tbody > tr > td:nth-child(-n + 2)::before {
    display: block;
    margin-bottom: var(--space-1);
    color: var(--muted);
    font-size: 11px;
    font-weight: 600;
    line-height: 1.25;
    text-transform: uppercase;
  }

  .kt table.kt-param-table-nalaz > tbody > tr:not(.kt-param-komentar) > td:nth-child(2)::before {
    content: "Rezultat";
  }

  .kt table.kt-param-table-nalaz > tbody > tr:not(.kt-param-komentar) > td:nth-child(3)::before {
    content: "Jedinice";
  }

  .kt table.kt-param-table-nalaz > tbody > tr:not(.kt-param-komentar) > td:nth-child(4)::before {
    content: "Ref. vrednost";
  }

  .kt table.kt-param-table-nalaz > tbody > tr.kt-param-komentar {
    grid-template-columns: minmax(0, 1fr);
  }

  .kt table.kt-param-table-nalaz > tbody > tr.kt-param-komentar > td {
    grid-column: 1 / -1;
  }

  .kt table.kt-param-table-nalaz > tbody > tr.kt-param-komentar > :first-child {
    padding: 0;
    border: 0;
    white-space: normal;
    color: var(--text);
    font-weight: 600;
  }

  .kt table.kt-param-table-nalaz > tbody > tr.kt-param-komentar textarea {
    width: 100%;
    max-width: none;
  }

  .kt table.kt-param-table-test > tbody > tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--space-2);
    padding: var(--space-3);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    background: var(--surface);
  }

  .kt table.kt-param-table-test > tbody > tr > td:nth-child(-n + 2) {
    grid-column: 1;
  }

  .kt table.kt-param-table-test > tbody > tr > td:first-child::before {
    content: "Naziv testa";
  }

  .kt table.kt-param-table-test > tbody > tr > td:nth-child(2)::before {
    content: "Rezultat";
  }

  .kt table.kt-param-table-test > tbody > tr > td.kt-cell-action {
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: end;
  }

  /* Sačuvani BH/KS/urin rezultat ima četiri podatka. Naziv parametra zauzima
     pun red, a vrednosti nose eksplicitne data-label oznake iz PHP prikaza. */
  .kt table.kt-param-table-results > tbody > tr {
    display: grid;
    grid-template-columns: repeat(3, minmax(72px, 1fr));
    gap: var(--space-2);
    padding: var(--space-3);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    background: var(--surface);
  }

  .kt table.kt-param-table-results > tbody > tr > th {
    grid-column: 1 / -1;
    min-width: 0;
    padding: 0;
    border: 0;
    color: var(--text);
    font-weight: 600;
    overflow-wrap: anywhere;
  }

  .kt table.kt-param-table-results > tbody > tr > td::before {
    content: attr(data-label);
    display: block;
    margin-bottom: var(--space-1);
    color: var(--muted);
    font-size: 11px;
    font-weight: 600;
    line-height: 1.25;
    text-transform: uppercase;
  }

  /* Sediment urina je eksplicitan podtip. Naslov ostaje vidljiv, a redovi su
     dvokolonski i dozvoljavaju prelom dugog parametra. */
  .kt table.kt-param-table-sediment > thead,
  .kt table.kt-param-table-sediment > thead > tr,
  .kt table.kt-param-table-sediment > thead th {
    display: block;
    width: 100%;
  }

  .kt table.kt-param-table-sediment > tbody > tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(96px, 1fr);
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    background: var(--surface);
  }

  .kt table.kt-param-table-sediment > tbody > tr > :first-child {
    min-width: 0;
    padding: 0;
    border: 0;
    color: var(--text);
    font-weight: 600;
    overflow-wrap: anywhere;
  }
}

.kt .kt-result-count {
  margin: -4px 0 8px !important;
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
  text-align: left;
}

.kt .lista-podsetnika .kt-reminder-text {
  flex: 1 1 220px;
  min-width: 0;
  overflow-wrap: anywhere;
}

.kt .kt-reminder-list-section {
  margin: 20px 0;
}

.kt .kt-attachment {
  margin: 12px 0 0;
}

/* Danger je uvek pun crveni fill sa belim tekstom (DESIGN.md: "Nikad
   sekundarni stil za brisanje"). Boja teksta i okvira se moraju navesti
   eksplicitno — outline pravilo za sekundarnu dugmad dolazi ranije u fajlu i
   inace ostavi zeleni tekst/okvir preko crvene pozadine. */
.kt input.kt-button-danger,
.kt button.kt-button-danger,
.kt a.kt-button-danger {
  border-color: var(--danger);
  background: var(--danger);
  color: #ffffff;
}

.kt input.kt-button-danger:hover,
.kt button.kt-button-danger:hover,
.kt a.kt-button-danger:hover {
  border-color: var(--danger-strong);
  background: var(--danger-strong);
  color: #ffffff;
}

.kt input[type="file"]::-webkit-file-upload-button {
  min-height: 30px;
  margin-right: 10px;
  padding: 6px 11px;
  border: 0;
  border-radius: var(--radius-sm);
  background: var(--slate);
  color: #ffffff;
  cursor: pointer;
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
}

.kt .kt-visit-form td:first-child {
  color: var(--text);
  font-weight: 600;
}

.kt .kt-visit-form input[type="text"],
.kt .kt-visit-form textarea {
  width: 100% !important;
}


@media print {
  .kt #nav,
  .kt .kt-tab-actions,
  .kt .kt-search-header-body,
  .kt .kt-list-more,
  .kt .kt-pagination,
  .kt .kt-inline-action-form,
  .kt .kt-document-actions,
  .kt input[type="submit"],
  .kt input[type="reset"],
  .kt input[type="button"],
  .kt button {
    display: none !important;
  }

  .kt {
    background: #ffffff;
  }

  .kt #wrapper {
    display: block;
    width: 100%;
    padding: 0;
  }

  .kt .group,
  .kt #settings,
  .kt #center > form,
  .kt .kt-table-scroll,
  .kt .kt-tab-container,
  .kt .kt-detail-pane {
    border: 0;
    box-shadow: none;
  }

  .kt .kt-table-scroll {
    overflow: visible;
  }.kt table.tblh {
    min-width: 0;
  }
}

/* ==== Phosphor ikonice + premium kontrole ==== */

/* Phosphor u .kt-fa-icon omotaču: poravnanje i optička veličina */
.kt .kt-fa-icon.ph,
.kt .ph.kt-fa-icon {
  font-size: 1.05em;
  line-height: 1;
}

.kt .ph {
  vertical-align: -0.075em;
}

/* h1/h2/h3 ikonica-krug: Phosphor malo veći za optičku ravnotežu */
.kt h1 .kt-fa-icon.ph,
.kt h2 .kt-fa-icon.ph,
.kt h3 .kt-fa-icon.ph {
  font-size: 16px;
}

/* Dropdown (native select) — custom strelica + premium izgled.
   Specifičnost 0,2,1 da pobedi .kt .kt-control (0,2,0) koji JS doda i resetuje background. */
.kt select,
.kt select.kt-control {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding-right: 30px;
  background-color: #ffffff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 256 256'%3E%3Cpath fill='%2361756a' d='M213.66 101.66l-80 80a8 8 0 0 1-11.32 0l-80-80a8 8 0 0 1 11.32-11.32L128 164.69l74.34-74.35a8 8 0 0 1 11.32 11.32Z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 9px center;
  background-size: 16px 16px;
  cursor: pointer;
}

.kt select:hover,
.kt select.kt-control:hover,
.kt select:focus,
.kt select.kt-control:focus,
.kt select:focus-visible {
  border-color: var(--accent);
}

/* Dugmad sa ikonicama: konzistentan razmak ikonice */
.kt .kt-button .ph,
.kt .kt-document-actions a .ph,
.kt .kt-visit-actions a .ph {
  font-size: 1.05em;
}

/* ==== Custom dropdown (stilizovano otvoreno stanje) ==== */
.kt .kt-select {
  position: relative;
  display: block;
  width: 100%;
  max-width: 100%;
}

/* native select ostaje radi validacije/submit-a, ali nevidljiv (klik ide na trigger) */
.kt select.kt-select-native {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  opacity: 0;
  pointer-events: none;
}

.kt .kt-select-trigger {
  width: 100%;
  min-height: 34px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 6px 10px;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-sm);
  background: #ffffff;
  color: var(--text);
  font-family: inherit;
  font-size: var(--text-body);
  text-align: left;
  cursor: pointer;
  transition: border-color var(--motion-fast) var(--ease),
              box-shadow var(--motion-fast) var(--ease);
}

.kt .kt-select-value {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kt .kt-select-caret {
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 1.05em;
  transition: transform var(--motion-fast) var(--ease);
}

.kt .kt-select-trigger:hover,
.kt .kt-select.is-open .kt-select-trigger {
  border-color: var(--accent);
}

.kt .kt-select.is-open .kt-select-caret {
  transform: rotate(180deg);
  color: var(--accent);
}

.kt .kt-select-panel {
  position: absolute;
  z-index: 1500;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  max-height: 280px;
  overflow-y: auto;
  margin: 0;
  padding: 4px;
  list-style: none;
  background: var(--surface);
  border: 1px solid var(--line-strong);
  border-radius: var(--radius);
  box-shadow: var(--elev-floating);
  outline: none;
  display: none;
}

.kt .kt-select.is-open .kt-select-panel {
  display: block;
}

.kt .kt-select-option {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  padding: 7px 10px;
  border-radius: var(--radius-sm);
  color: var(--text);
  cursor: pointer;
}

.kt .kt-select-option:hover,
.kt .kt-select-option.is-active {
  background: var(--accent-tint);
  color: var(--accent-strong);
}

.kt .kt-select-option.is-selected {
  font-weight: 600;
  color: var(--accent-strong);
}

.kt .kt-select-option-label {
  flex: 1 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kt .kt-select-check {
  flex: 0 0 auto;
  color: var(--accent);
  opacity: 0;
}

.kt .kt-select-option.is-selected .kt-select-check {
  opacity: 1;
}

.kt .kt-select-option.is-disabled {
  color: var(--muted);
  cursor: not-allowed;
  opacity: 0.6;
}

.kt .kt-select-option.is-disabled:hover {
  background: transparent;
  color: var(--muted);
}

/* Transfer sizinga u kontekstima gde je select bio inline/flex */
.kt .kt-inline-action-form .kt-select {
  flex: 1 1 180px;
  width: auto;
}

.kt .kt-reminder-tab .kt-inline-action-form .kt-select,
.kt .kt-docs-tab .kt-inline-action-form .kt-select {
  flex: 1 1 180px;
}

/* ==== Combobox rase (predefinisano + slobodan unos) ==== */
.kt .kt-combo {
  position: relative;
  display: block;
  width: 100%;
}

.kt .kt-combo .kt-breed-input {
  width: 100% !important;
  padding-right: 32px;
}

/* Strelica mora da izgleda i stoji isto kao kod stilizovanog <select>
   (.kt-select-caret): ista velicina i isto odstojanje od desne ivice — polja
   stoje jedno pored drugog u istom redu, pa se svaka razlika vidi. */
/* Strelica mora da izgleda i stoji isto kao kod stilizovanog <select>
   (.kt-select-caret): polja stoje jedno pored drugog u istom redu, pa se svaka
   razlika vidi. Zato se ikonica poravnava DESNO sa istim odstojanjem (10px +
   1px border = 11px od ivice polja), umesto centriranja u klik-zoni. */
.kt .kt-combo-caret {
  position: absolute;
  top: 1px;
  right: 1px;
  bottom: 1px;
  width: 32px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0 10px 0 0;
  border: 0;
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
}

.kt .kt-combo-caret i {
  font-size: 14.7px;           /* identicno .kt-select-caret (1.05em od 14px) */
  line-height: 1;
}

.kt .kt-combo.is-open .kt-combo-caret {
  color: var(--accent);
}

.kt .kt-combo-panel {
  position: absolute;
  z-index: 1500;
  top: calc(100% + 4px);
  left: 0;
  width: 100%;
  min-width: 220px;
  max-height: 260px;
  overflow-y: auto;
  margin: 0;
  padding: 4px;
  list-style: none;
  background: var(--surface);
  border: 1px solid var(--line-strong);
  border-radius: var(--radius);
  box-shadow: var(--elev-floating);
  display: none;
}

.kt .kt-combo.is-open .kt-combo-panel {
  display: block;
}

.kt .kt-combo-option {
  padding: 7px 10px;
  border-radius: var(--radius-sm);
  color: var(--text);
  cursor: pointer;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kt .kt-combo-option:hover,
.kt .kt-combo-option.is-active {
  background: var(--accent-tint);
  color: var(--accent-strong);
}

/* ==== Udomljen checkbox ==== */
.kt .kt-check-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  cursor: pointer;
  white-space: nowrap;
}

.kt .kt-check-label input[type="checkbox"] {
  width: 18px;
  height: 18px;
}

/* ==== Akciona traka dugmadi (jedan red, desno) ==== */
.kt .kt-form-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin: 4px 0 0;
  padding: 14px 0 0;
  border-top: 1px solid var(--line);
}

.kt .kt-patient-form > .kt-form-actions,
.kt .kt-visit-form > .kt-form-actions {
  grid-column: 1 / -1;
}

/* Sva dugmad u redu akcija moraju biti iste visine: <a> sa ikonicom je inace
   visi od <input> (ikonica podigne line-height), pa red izgleda neujednaceno. */
.kt .kt-form-actions .kt-button,
.kt .kt-form-actions input[type="submit"],
.kt .kt-form-actions input[type="reset"],
.kt .kt-form-actions input[type="button"] {
  float: none !important;
  margin: 0;
  box-sizing: border-box;
  height: 34px;
  padding: 0 14px;
  line-height: 1;
}

/* <a> je inline element — bez flex-a ikonica i tekst ne sednu na sredinu. */
.kt .kt-form-actions a.kt-button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.kt .kt-owner-form > .kt-form-actions {
  grid-column: 1 / -1;
}

/* Edit forme sa tabelom unutar .group (npr. korisnici): tabela i akciona
   traka zauzimaju pun red flex-forme pa se ređaju jedna ispod druge,
   umesto rame uz rame. */
.kt .group form > table {
  flex: 1 1 100%;
}

.kt .group form > .kt-form-actions {
  flex: 1 1 100%;
}

/* ==== Kartoni po godinama (protokoli/posete) ==== */
.kt .kt-records-list {
  min-width: 0;
}

/* Old look: nema year-filter UI (JS je samo u new look-u) -> ravna lista */
.kt-year-tabs {
  display: none;
}

.kt .kt-year-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 8px 0 10px;
}

.kt .kt-year-tab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 30px;
  padding: 5px 11px;
  border: 1px solid var(--line);
  border-radius: var(--radius-pill);
  background: var(--surface-muted);
  color: var(--muted);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background-color var(--motion-fast) var(--ease),
              border-color var(--motion-fast) var(--ease),
              color var(--motion-fast) var(--ease);
}

.kt .kt-year-tab:hover {
  border-color: var(--accent);
  color: var(--accent-strong);
}

.kt .kt-year-tab.is-active {
  border-color: var(--accent);
  background: var(--accent);
  color: #ffffff;
}

.kt .kt-year-count {
  min-width: 18px;
  padding: 0 5px;
  border-radius: var(--radius-pill);
  background: var(--accent-soft);
  color: var(--accent-strong);
  font-size: 11px;
  line-height: 16px;
  text-align: center;
}

.kt .kt-year-tab.is-active .kt-year-count {
  background: rgba(255, 255, 255, 0.25);
  color: #ffffff;
}

.kt .kt-year-panels {
  max-height: 480px;
  overflow-y: auto;
  padding-right: 2px;
}

.kt .kt-year-panel {
  display: none;
}

.kt .kt-year-panel.is-active {
  display: block;
}

/* Dropdown paneli: otvaranje nagore kad nema mesta ispod (blizu dna ekrana) */
.kt .kt-select.kt-select-up .kt-select-panel {
  top: auto;
  bottom: calc(100% + 4px);
}

.kt .kt-combo.kt-combo-up .kt-combo-panel {
  top: auto;
  bottom: calc(100% + 4px);
}

/* Poseta forma: donji deo (dodaj stavku / ukupna cena / uplata) — flex umesto float */
.kt .kt-visit-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 12px 0 0;
}

.kt .kt-visit-total {
  color: var(--muted);
  font-weight: 600;
}

.kt .kt-visit-total strong {
  color: var(--text);
  font-size: 15px;
}

.kt .kt-visit-payment {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 10px 0 0;
}

.kt .kt-visit-payment label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--text);
  font-weight: 600;
}

/* Strukturisana dijagnoza na poseti. */
.kt .kt-diagnosis-editor {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-4);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-muted);
}

.kt .kt-diagnosis-editor h2,
.kt .kt-diagnosis-quality h3 {
  margin: 0;
}

.kt .kt-diagnosis-outcome {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  margin: 0;
  padding: 0;
  border: 0;
}

.kt .kt-diagnosis-outcome legend {
  width: 100%;
  margin-bottom: var(--space-1);
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
}

.kt .kt-diagnosis-outcome label {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  min-height: 34px;
  padding: var(--space-1_5) var(--space-3);
  border: 1px solid var(--line);
  border-radius: var(--radius-pill);
  background: var(--surface);
  cursor: pointer;
  font-weight: 600;
}

.kt .kt-diagnosis-outcome label.is-disabled {
  opacity: .55;
  cursor: not-allowed;
}

.kt .kt-diagnosis-empty {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3);
  border-left: 3px solid var(--accent);
  border-radius: var(--radius-sm);
  background: var(--accent-soft);
  color: var(--text);
}

.kt .kt-diagnosis-empty > .kt-fa-icon {
  flex: 0 0 auto;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--surface);
  color: var(--accent-strong);
}

.kt .kt-diagnosis-empty > div {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.kt .kt-diagnosis-empty span {
  color: var(--muted);
  font-size: 12px;
}

.kt .kt-diagnosis-empty .kt-button {
  flex: 0 0 auto;
}

.kt .kt-diagnosis-panel[hidden] {
  display: none !important;
}

.kt .kt-diagnosis-panel {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.kt .kt-diagnosis-rows {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.kt .kt-diagnosis-row {
  display: grid;
  grid-template-columns: minmax(220px, 1.2fr) minmax(140px, .55fr) minmax(220px, 1fr) auto;
  align-items: end;
  gap: var(--space-3);
  padding: var(--space-3);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--surface);
}

.kt .kt-diagnosis-row:first-child {
  border-left: 3px solid var(--accent);
}

.kt .kt-diagnosis-remove {
  margin-bottom: 1px;
}

.kt .kt-visit-diagnoses {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  margin: 0;
  padding-left: 18px;
}

.kt .kt-visit-diagnoses li span,
.kt .kt-visit-diagnoses li small {
  display: block;
  color: var(--muted);
  font-size: 11.5px;
}

/* Admin sifarnik dijagnoza. */
.kt .kt-diagnosis-search {
  display: flex;
  align-items: end;
  gap: var(--space-3);
  margin: 0;
}

.kt .kt-diagnosis-search .kt-settings-block {
  flex: 1 1 320px;
}

.kt .kt-diagnosis-search .kt-form-actions {
  flex: 0 0 auto;
  padding: 0;
  border: 0;
}

.kt .kt-diagnosis-fields {
  grid-template-columns: minmax(240px, 1.4fr) minmax(140px, .5fr) minmax(220px, 1fr);
}

.kt table.kt-diagnosis-table {
  min-width: 680px;
}

.kt .kt-diagnosis-table tr.is-muted {
  opacity: .66;
}

/* Protokol create forme: textarea popunjava karticu (bez fiksnih inline širina) */
.kt #center > form > table textarea {
  width: 100% !important;
  max-width: 100%;
}

/* Isto za pun-širinske text inpute u glavnoj tabeli create forme.
   Izuzeta je param-tabela (kompaktni 80px inputi); datum ima svoju sirinu nize. */
/* Tekstualna polja u formi-tabeli idu punom širinom ćelije — osim reda za unos
   uplate, koji je traka sa tri kontrole u nizu (datum, iznos, dugme). */
.kt #center > form > table:not(.kt-param-table) tr:not(.kt-payment-entry-row) input[type="text"] {
  width: 100% !important;
  max-width: 100%;
}


/* ==== "Novi podsetnik" — inline forma na /podsetnik ====
   Okvir/pozadinu panela već daje `.kt #center > form` (jača specifičnost),
   pa se ovde stiluje samo raspored polja i typeahead lista. */
.kt .kt-pd-new-grid {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr);
  align-items: start;
  gap: 14px;
}

.kt .kt-pd-new-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

/* label-12 token (isto kao .kt-owner-field-label) — uppercase je rezervisan za caps-11 */
.kt .kt-pd-new-field label {
  color: var(--text);
  font-size: 12px;
  font-weight: 600;
}

.kt .kt-pd-new-field .kt-control {
  width: 100%;
  margin: 0;
}

.kt .kt-pd-search-wrap {
  position: relative;
}

.kt .kt-pd-results {
  position: absolute;
  z-index: 1500;
  top: calc(100% + 4px);
  left: 0;
  width: 100%;
  max-height: 260px;
  overflow-y: auto;
  margin: 0;
  padding: 4px;
  list-style: none;
  background: var(--surface);
  border: 1px solid var(--line-strong);
  border-radius: var(--radius);
  box-shadow: var(--elev-floating);
  display: none;
}

.kt .kt-pd-results.is-open {
  display: block;
}

.kt .kt-pd-result {
  padding: 7px 10px;
  border-radius: var(--radius-sm);
  color: var(--text);
  cursor: pointer;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kt .kt-pd-result:hover,
.kt .kt-pd-result.is-active {
  background: var(--accent-tint);
  color: var(--accent-strong);
}

.kt .kt-pd-empty {
  padding: 7px 10px;
  color: var(--muted);
  font-size: 13px;
}

.kt .kt-pd-chosen {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.kt .kt-pd-chosen.is-set {
  color: var(--accent-strong);
  font-weight: 600;
}

@media (max-width: 760px) {
  .kt .kt-pd-new-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* =====================================================================
   LEKOVI — zalihe i smernica za nabavku
   ===================================================================== */

/* Karton leka: četiri polja različite prirode — šifra i brojevi su kratki,
   naziv je dug. Podrazumevani auto-fit blok im daje jednake kolone, pa inputi
   plivaju u praznini i četvrto polje ispadne samo u drugi red. Ovde kolone
   prate sadržaj i sva četiri polja stoje u jednom redu. */
.kt .kt-lek-grid {
  grid-template-columns:
    minmax(110px, 0.7fr)
    minmax(220px, 2fr)
    minmax(110px, 0.8fr)
    minmax(130px, 0.9fr);
}

@media (max-width: 900px) {
  .kt .kt-lek-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 520px) {
  .kt .kt-lek-grid { grid-template-columns: minmax(0, 1fr); }
}

/* Upozorenje o nabavci iznad liste lekova / u kartici leka. */
.kt .kt-nabavka {
  width: 100%;
  max-width: none;
  box-sizing: border-box;
  margin: 0 0 14px;
  padding: 11px 14px;
  border: 1px solid var(--danger);
  border-radius: var(--radius);
  background: var(--danger-soft);
  color: var(--danger-strong);
}

.kt .kt-nabavka-inline {
  max-width: none;
  margin: 14px 0 0;
}

.kt .kt-nabavka-head {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
}

.kt .kt-nabavka-head i {
  flex: 0 0 auto;
  font-size: 18px;
}

.kt ul.kt-nabavka-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  margin: 9px 0 0;
  padding: 0 0 0 26px;
  list-style: none;
}

.kt .kt-nabavka-list li {
  display: flex;
  align-items: baseline;
  gap: 5px;
  padding: 2px 8px;
  border-radius: var(--radius-pill);
  background: var(--surface);
  font-size: 12px;
}

.kt .kt-nabavka-list a {
  color: var(--text);
  font-weight: 600;
}

.kt .kt-nabavka-qty {
  color: var(--danger-strong);
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}

/* Ćelija zalihe u listi lekova. */
.kt .kt-zaliha {
  display: inline-block;
  padding: 1px 7px;
  border-radius: var(--radius-pill);
  font-size: 11.5px;
  font-weight: 600;
  white-space: nowrap;

  /* Čip u ćeliji staje u liniju reda. Bez ovoga nasleđuje `--tbl-line` kao
     visinu pa mu padding doda još 2px, i lista lekova je bila 37px dok su sve
     ostale liste 35px. */
  line-height: calc(var(--tbl-line) - 2px);
  vertical-align: top;
}

.kt .kt-zaliha-off {
  color: var(--muted);
}

.kt .kt-zaliha-low {
  background: var(--danger-soft);
  color: var(--danger-strong);
  font-weight: 700;
}

/* =====================================================================
   DASHBOARD (/home)
   Data-Dense Dashboard: KPI kartice + akcione liste + CSS trake.
   Gustina 8/10 — kompaktni razmaci, maksimalna vidljivost podataka.
   ===================================================================== */

.kt .kt-dash-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}

/* postojeća pravila hvataju samo li/td varijantu praznog stanja */
.kt p.kt-empty-note {
  margin: 0;
  padding: var(--space-3) 0;
  color: var(--muted);
  font-style: italic;
}

/* ---- KPI red ---- */
/* Dvanaest kolona, svaka kartica `span 2` — sve KPI kartice stoje u JEDNOM
   redu. Ranije je ovde bio `auto-fit` sa minmax(200px, 1fr): kad se pojavi
   šesta kartica (lekovi za nabavku) 200px se više ne uklapa, pa je red pucao
   na 5+1 i ostavljao praznu polovinu drugog reda. */
.kt .kt-kpi-row {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--space-3);
  margin: 0 0 var(--space-4);
}

.kt a.kt-kpi {
  grid-column: span 2;
  display: flex;
  align-items: center;
  gap: var(--space-2);
  min-width: 0;
  padding: var(--space-3);
  background: var(--surface);
  border: 1px solid var(--line);
  border-left: 3px solid var(--accent);
  /* Obojena leva ivica je ravna (vidi .napomena). */
  border-radius: 0 var(--radius) var(--radius) 0;
  box-shadow: var(--elev-raised);
  color: var(--text);
  text-decoration: none;
  transition: box-shadow var(--motion) var(--ease), transform var(--motion) var(--ease);
}

.kt a.kt-kpi:hover,
.kt a.kt-kpi:focus-visible {
  box-shadow: var(--elev-grouped);
  text-decoration: none;
  transform: translateY(-1px);
}

.kt a.kt-kpi.is-warn  { border-left-color: var(--focus); }
.kt a.kt-kpi.is-alarm { border-left-color: var(--danger); }

.kt .kt-kpi-ico {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--accent-soft);
  color: var(--accent-strong);
  font-size: 20px;
}

.kt .kt-kpi.is-warn  .kt-kpi-ico { background: var(--warning);    color: var(--warning-text); }
.kt .kt-kpi.is-alarm .kt-kpi-ico { background: var(--danger-soft); color: var(--danger-strong); }

.kt .kt-kpi-txt {
  display: flex;
  flex-direction: column;
  min-width: 0;
  gap: 1px;
}

.kt .kt-kpi-num {
  font-size: 25px;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.01em;
}

.kt .kt-kpi-lbl {
  font-size: 13px;
  font-weight: 600;
}

/* Podnaslov se prelama, ne skraćuje. U šest kolona kartica je preuska za
   "2.728.035 din ukupno" u jednoj liniji, a `ellipsis` je tu odsecao upravo
   podatak zbog kog podnaslov postoji. */
.kt .kt-kpi-sub {
  color: var(--muted);
  font-size: 11.5px;
  line-height: 1.3;
}

/* ---- Rasporedi ---- */
.kt .kt-dash-two {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  gap: var(--space-3);
  margin: 0 0 var(--space-4);
}

.kt .kt-dash-three {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-3);
  margin: 0 0 var(--space-4);
}

.kt .kt-dash-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: var(--space-4);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--elev-raised);
}

.kt .kt-dash-card h3 {
  margin: 0 0 var(--space-3);
  font-size: 14px;
}

.kt .kt-dash-card.is-alarm {
  border-left: 3px solid var(--danger);
  /* Obojena leva ivica je ravna (vidi .napomena). */
  border-radius: 0 var(--radius) var(--radius) 0;
}

/* ---- Zaglavlje kartice / sekcije ---- */
.kt .kt-dash-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-2);
  margin: 0 0 var(--space-3);
}

.kt .kt-dash-head h2 {
  margin: 0;
  font-size: 15px;
}

.kt .kt-dash-head-section {
  margin-top: var(--space-2);
}

.kt a.kt-dash-more {
  color: var(--accent-strong);
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

/* ---- Liste (podsetnici, dužnici) ---- */
.kt .kt-dash-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.kt .kt-dash-row {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  min-width: 0;
  padding: var(--space-2) var(--space-2_5);
  border-bottom: 1px solid var(--line);
  border-radius: var(--radius-sm);
  transition: background var(--motion-fast) var(--ease);
}

.kt .kt-dash-row:last-child { border-bottom: 0; }
.kt .kt-dash-row:hover      { background: var(--surface-alt); }

.kt .kt-dash-badge {
  flex: 0 0 auto;
  min-width: 62px;
  padding: 3px 8px;
  border-radius: var(--radius-pill);
  background: var(--accent-soft);
  color: var(--accent-strong);
  font-size: 11px;
  font-weight: 700;
  text-align: center;
  white-space: nowrap;
}

.kt .kt-dash-row.is-soon .kt-dash-badge { background: var(--warning);     color: var(--warning-text); }
.kt .kt-dash-row.is-late .kt-dash-badge { background: var(--danger-soft);  color: var(--danger-strong); }
.kt .kt-dash-row.is-late                   { background: var(--highlight-soft); }

.kt .kt-dash-main {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-width: 0;
  gap: 1px;
}

.kt .kt-dash-main a {
  overflow: hidden;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kt .kt-dash-meta {
  color: var(--muted);
  font-size: 11.5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kt .kt-dash-side {
  display: flex;
  flex-direction: column;
  flex: 0 1 auto;
  min-width: 0;
  gap: 1px;
  text-align: right;
}

.kt .kt-dash-owner {
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kt a.kt-dash-tel {
  color: var(--muted);
  font-size: 11.5px;
  white-space: nowrap;
}

.kt a.kt-dash-tel:hover { color: var(--link-strong); }

.kt .kt-dash-amt {
  flex: 0 0 auto;
  color: var(--danger-strong);
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
}

.kt .kt-dash-foot {
  margin: var(--space-3) 0 0;
  padding-top: var(--space-2_5);
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 12px;
}

/* ---- Trake (statistika) ---- */
.kt .kt-bars {
  margin: 0;
  padding: 0;
  list-style: none;
}

.kt .kt-bar-item {
  display: grid;
  grid-template-columns: minmax(64px, 92px) minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-2);
  padding: 3px 0;
}

.kt .kt-bar-label {
  overflow: hidden;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kt .kt-bar-track {
  height: 9px;
  border-radius: var(--radius-pill);
  background: var(--surface-alt-2);
  overflow: hidden;
}

.kt progress.kt-bar-progress {
  width: 100%;
  display: block;
  appearance: none;
  -webkit-appearance: none;
  border: 0;
}

.kt progress.kt-bar-progress::-webkit-progress-bar {
  border-radius: var(--radius-pill);
  background: var(--surface-alt-2);
}

.kt progress.kt-bar-progress::-webkit-progress-value {
  border-radius: var(--radius-pill);
  background: var(--accent);
}

.kt progress.kt-bar-progress::-moz-progress-bar {
  border-radius: var(--radius-pill);
  background: var(--accent);
}

.kt .kt-bar-fill {
  display: block;
  height: 100%;
  border-radius: var(--radius-pill);
  background: var(--accent);
}

.kt .kt-bar-val {
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

.kt .kt-bar-pct {
  color: var(--muted);
  font-weight: 400;
}

/* ---- Podeljena traka (pol) ---- */
.kt .kt-split {
  width: 100%;
  display: block;
  height: 14px;
  margin: 0 0 var(--space-3);
  border-radius: var(--radius-pill);
  background: var(--surface-alt-2);
  overflow: hidden;
}

.kt .kt-split-m { fill: var(--accent); }
.kt .kt-split-z { fill: var(--focus); }

.kt .kt-legend {
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 12.5px;
}

.kt .kt-legend li {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: 2px 0;
}

.kt .kt-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex: 0 0 auto;
}

.kt .kt-dot-m { background: var(--accent); }
.kt .kt-dot-z { background: var(--focus); }

/* ---- Prečice ka sekcijama ---- */
.kt .kt-dash-links {
  display: grid;
  /* auto-fit: non-admin vidi 5 pločica, admin 6 — mreža se prilagodi sama */
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: var(--space-3);
}

.kt .kt-dash-links a {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-1);
  min-height: 88px;
  justify-content: center;
  padding: var(--space-3);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--elev-raised);
  color: var(--text);
  text-align: center;
  text-decoration: none;
  transition: border-color var(--motion) var(--ease), transform var(--motion) var(--ease);
}

.kt .kt-dash-links a:hover,
.kt .kt-dash-links a:focus-visible {
  border-color: var(--accent);
  text-decoration: none;
  transform: translateY(-1px);
}

.kt .kt-dash-links i {
  color: var(--accent-strong);
  font-size: 22px;
}

.kt .kt-dash-links span {
  font-size: 13px;
  font-weight: 600;
}

.kt .kt-dash-links small {
  color: var(--muted);
  font-size: 11px;
}

/* ---- Responsive ---- */
@media (max-width: 1100px) {
  .kt .kt-dash-two,
  .kt .kt-dash-three { grid-template-columns: minmax(0, 1fr); }
  .kt .kt-dash-links { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* Šest kartica u redu staje samo na punoj širini; na užem ekranu ide 3 u red
   (span 4 od 12), pa 1 u red. Bez ovoga bi `span 2` držao šest kolona i na
   400px, gde kartica ostaje bez teksta. */
@media (max-width: 900px) {
  .kt a.kt-kpi { grid-column: span 4; }
}

@media (max-width: 620px) {
  .kt .kt-kpi-row   { grid-template-columns: minmax(0, 1fr); }
  /* Span mora da se resetuje: u jednokolonskom gridu `span 4` bi napravio tri
     implicitne kolone i vratio kartice u više kolona. */
  .kt a.kt-kpi      { grid-column: auto; }
  .kt .kt-dash-links { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kt .kt-dash-row  { flex-wrap: wrap; }
  .kt .kt-dash-side { flex-basis: 100%; text-align: left; }
  .kt .kt-dash-actions { width: 100%; }
  .kt .kt-dash-actions a { flex: 1 1 auto; }
}

/* Poštuj korisnikovu želju za smanjenim kretanjem */
@media (prefers-reduced-motion: reduce) {
  .kt a.kt-kpi,
  .kt .kt-dash-links a {
    transition: none;
  }
  .kt a.kt-kpi:hover,
  .kt .kt-dash-links a:hover {
    transform: none;
  }
}

/* =====================================================================
   PORUKE VLASNICIMA (Viber / WhatsApp)
   ===================================================================== */

/* --- Oznake kanala uz telefon (checkbox u formi) --- */
.kt .kt-msg-flags {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3);
  margin-left: var(--space-2);
}

.kt .kt-msg-flag {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  color: var(--muted);
  cursor: pointer;
  font-size: 12px;
  white-space: nowrap;
}

.kt .kt-msg-flag input[type="checkbox"] {
  width: 16px;
  height: 16px;
  margin: 0;
}

.kt .kt-msg-flag i {
  font-size: 14px;
}

/* --- Bedž kanala u prikazu vlasnika --- */
.kt .kt-chan {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  margin-left: var(--space-1);
  padding: 1px 7px;
  border-radius: var(--radius-pill);
  background: var(--accent-soft);
  color: var(--accent-strong);
  font-size: 11px;
  font-weight: 600;
  vertical-align: middle;
}

.kt .kt-chan-wa {
  background: #dcf3e4;
  color: #146c43;
}

/* --- Dugme "Poruka" u listama --- */
.kt .kt-msg-cell {
  white-space: nowrap;
}

.kt .kt-msg-btn {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1_5);
  min-height: 28px;
  padding: 4px 10px;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-sm);
  background: var(--surface);
  color: var(--accent-strong);
  cursor: pointer;
  font-family: inherit;
  font-size: 12px;
  font-weight: 600;
  transition: background var(--motion-fast) var(--ease), border-color var(--motion-fast) var(--ease);
}

.kt .kt-msg-btn:hover,
.kt .kt-msg-btn:focus-visible {
  background: var(--accent-tint);
  border-color: var(--accent);
}

.kt .kt-msg-btn i {
  font-size: 15px;
}

/* --- Modal apleta --- */
.kt .kt-msg-overlay {
  position: fixed;
  z-index: 2000;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-4);
  background: rgba(23, 38, 34, 0.45);
}

.kt .kt-msg-modal {
  width: min(520px, 100%);
  max-height: 90vh;
  overflow-y: auto;
  padding: var(--space-5);
  background: var(--surface);
  border-radius: var(--radius);
  box-shadow: var(--elev-floating);
}

.kt .kt-msg-title {
  margin: 0 0 var(--space-3);
  font-size: 15px;
  font-weight: 700;
}

.kt .kt-msg-text {
  width: 100%;
  min-height: 92px;
  margin: 0 0 var(--space-3);
  padding: var(--space-2_5);
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-sm);
  background: var(--surface-alt);
  color: var(--text);
  font-family: inherit;
  font-size: 13px;
  line-height: 1.5;
  resize: vertical;
}

.kt .kt-msg-copy-row {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  margin: 0 0 var(--space-4);
}

.kt .kt-msg-copied {
  color: var(--accent-strong);
  font-size: 12px;
  font-weight: 600;
}

.kt .kt-msg-channel {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-2_5) 0;
  border-top: 1px solid var(--line);
}

.kt .kt-msg-tel {
  flex: 1 1 auto;
  min-width: 120px;
  font-size: 13px;
  font-weight: 600;
}

.kt a.kt-msg-viber,
.kt a.kt-msg-wa {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  padding: 6px 14px;
  border-radius: var(--radius-sm);
  color: #ffffff;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
}

.kt a.kt-msg-viber { background: #7360f2; }
.kt a.kt-msg-wa    { background: #1da851; }

.kt a.kt-msg-viber:hover { background: #5f4de0; }
.kt a.kt-msg-wa:hover    { background: #179245; }

.kt .kt-msg-note {
  margin: var(--space-3) 0 0;
  padding-top: var(--space-3);
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 11.5px;
}

.kt .kt-msg-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: var(--space-3);
}

@media (max-width: 620px) {
  .kt .kt-msg-flags { margin: var(--space-1) 0 0; }
  .kt .kt-msg-channel a { flex: 1 1 auto; justify-content: center; }
}

/* Grupne akcije u Podešavanjima (označi/ukloni oznake telefona) */
.kt .kt-settings-bulk {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3);
}

.kt .kt-settings-bulk form {
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
  width: auto !important;
}
/* =====================================================================
   STATISTIKA (/statistika)
   Klinički i operativni pregled: završeni meseci, bez procene iz slobodnog
   teksta. Grafikoni uvek imaju tekstualnu legendu ili tabelu sa vrednostima.
   ===================================================================== */

.kt .kt-stat-header {
  align-items: flex-start;
}

.kt .kt-stat-header > div {
  min-width: 0;
}

.kt .kt-stat-period {
  margin: var(--space-1) 0 0;
  color: var(--muted);
  font-size: 12px;
}

.kt .kt-stat-kpis {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: var(--space-3);
  margin: 0 0 var(--space-4);
}

.kt .kt-stat-kpi {
  position: relative;
  min-width: 0;
  padding: var(--space-4);
  border: 1px solid var(--line);
  border-top: 3px solid var(--accent);
  border-radius: 0 0 var(--radius) var(--radius);
  background: var(--surface);
  box-shadow: var(--elev-raised);
}

.kt .kt-stat-kpi-icon {
  position: absolute;
  top: var(--space-3);
  right: var(--space-3);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--accent-soft);
  color: var(--accent-strong);
  font-size: 18px;
}

.kt .kt-stat-kpi-value {
  display: block;
  padding-right: 40px;
  color: var(--text);
  font-size: 28px;
  font-weight: 700;
  letter-spacing: -.02em;
  line-height: 1.05;
}

.kt .kt-stat-kpi h2 {
  margin: var(--space-2) 0 var(--space-1);
  padding: 0;
  font-size: 13px;
}

.kt .kt-stat-kpi h2 .kt-fa-icon {
  display: none;
}

.kt .kt-stat-kpi p {
  margin: 0;
  color: var(--muted);
  font-size: 11.5px;
  line-height: 1.4;
}

.kt .kt-stat-delta::before {
  display: inline-block;
  width: 1em;
  margin-right: var(--space-1);
  font-weight: 700;
}

.kt .kt-stat-delta.is-rast { color: var(--accent-strong); }
.kt .kt-stat-delta.is-rast::before { content: "↑"; }
.kt .kt-stat-delta.is-pad { color: var(--danger-strong); }
.kt .kt-stat-delta.is-pad::before { content: "↓"; }
.kt .kt-stat-delta.is-isto::before { content: "→"; }
.kt .kt-stat-delta.is-novo::before { content: "•"; }

.kt .kt-stat-grid {
  display: grid;
  gap: var(--space-3);
  margin: 0 0 var(--space-4);
}

.kt .kt-stat-grid-main {
  grid-template-columns: minmax(0,2fr) minmax(270px,1fr);
}

.kt .kt-stat-grid-three {
  grid-template-columns: repeat(3,minmax(0,1fr));
}

.kt .kt-stat-card {
  min-width: 0;
  padding: var(--space-4);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--elev-raised);
}

.kt .kt-stat-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-3);
  margin: 0 0 var(--space-3);
}

.kt .kt-stat-card-head h2 {
  margin: 0;
  font-size: 14px;
}

.kt .kt-stat-card-head p {
  margin: var(--space-1) 0 0;
  color: var(--muted);
  font-size: 11.5px;
}

.kt .kt-stat-card-head > a {
  flex: 0 0 auto;
  color: var(--accent-strong);
  font-size: 11.5px;
  font-weight: 600;
}

.kt .kt-stat-chart-legend {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  list-style: none;
  color: var(--muted);
  font-size: 11.5px;
}

.kt .kt-stat-chart-legend li {
  display: flex;
  align-items: center;
  gap: var(--space-1);
}

.kt .kt-stat-key {
  width: 18px;
  height: 3px;
  border-radius: var(--radius-pill);
}

.kt .kt-stat-key.is-visits { background: var(--data-1); }
.kt .kt-stat-key.is-first { background: var(--data-2); }

.kt .kt-stat-chart {
  margin: 0;
}

.kt .kt-stat-chart-scroll {
  width: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
}

.kt .kt-stat-chart svg {
  width: 100%;
  min-width: 620px;
  height: auto;
  display: block;
}

.kt .kt-stat-gridline {
  stroke: var(--line);
  stroke-width: 1;
}

.kt .kt-stat-axis-label {
  fill: var(--muted);
  font-family: inherit;
  font-size: 9px;
}

.kt .kt-stat-line {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 3;
}

.kt .kt-stat-line.is-visits { stroke: var(--data-1); }
.kt .kt-stat-line.is-first { stroke: var(--data-2); }
.kt .kt-stat-point.is-visits { fill: var(--surface); stroke: var(--data-1); stroke-width: 2; }
.kt .kt-stat-point.is-first { fill: var(--surface); stroke: var(--data-2); stroke-width: 2; }

.kt .kt-stat-chart figcaption,
.kt .kt-stat-note {
  margin: var(--space-2) 0 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.45;
}

.kt .kt-stat-details {
  margin-top: var(--space-3);
  border-top: 1px solid var(--line);
  padding-top: var(--space-2);
}

.kt .kt-stat-details summary {
  width: fit-content;
  color: var(--accent-strong);
  cursor: pointer;
  font-size: 12px;
  font-weight: 600;
}

.kt .kt-stat-details .table-scroll {
  margin-top: var(--space-2);
}

.kt .kt-stat-week {
  display: grid;
  grid-template-columns: repeat(7,minmax(0,1fr));
  gap: var(--space-2);
}

.kt .kt-stat-day {
  min-width: 0;
  padding: var(--space-3) var(--space-1);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  color: var(--text);
  text-align: center;
}

.kt .kt-stat-day span,
.kt .kt-stat-day small {
  display: block;
  font-size: 10px;
}

.kt .kt-stat-day strong {
  display: block;
  margin: var(--space-1) 0;
  font-size: 16px;
}

.kt .kt-stat-day.is-level-1 { background: var(--surface-alt-2); }
.kt .kt-stat-day.is-level-2 { background: #ecf8f1; background: color-mix(in srgb,var(--accent-soft) 55%,var(--surface)); }
.kt .kt-stat-day.is-level-3 { background: var(--accent-soft); }
.kt .kt-stat-day.is-level-4 { background: #a6d0c7; background: color-mix(in srgb,var(--accent) 38%,var(--surface)); }
.kt .kt-stat-day.is-level-5 { background: var(--accent); color: var(--on-dark); }

.kt .kt-stat-age-strip {
  width: 100%;
  height: 16px;
  display: block;
  margin-bottom: var(--space-3);
  border-radius: var(--radius-pill);
  background: var(--surface-alt-2);
  overflow: hidden;
}

.kt .is-age-1 { fill: var(--data-1); background: var(--data-1); }
.kt .is-age-2 { fill: var(--data-2); background: var(--data-2); }
.kt .is-age-3 { fill: var(--data-3); background: var(--data-3); }
.kt .is-age-4 { fill: var(--data-4); background: var(--data-4); }
.kt .is-age-5 { fill: var(--data-5); background: var(--data-5); }

.kt .kt-stat-age-legend {
  margin: 0;
  padding: 0;
  list-style: none;
}

.kt .kt-stat-age-legend li {
  display: grid;
  grid-template-columns: 10px minmax(0,1fr) auto 34px;
  align-items: center;
  gap: var(--space-2);
  padding: 3px 0;
  font-size: 11.5px;
}

.kt .kt-stat-age-legend small {
  color: var(--muted);
  text-align: right;
}

.kt .kt-stat-age-legend strong {
  font-size: 12px;
}

.kt .kt-stat-age-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
}

.kt .kt-stat-ranking {
  margin: 0;
  padding: 0;
  list-style: none;
}

.kt .kt-stat-ranking li {
  display: grid;
  grid-template-columns: 24px minmax(0,1fr) auto;
  align-items: center;
  gap: var(--space-2);
  padding: 4px 0;
  border-bottom: 1px solid var(--line);
  font-size: 11.5px;
}

.kt .kt-stat-ranking li:last-child {
  border-bottom: 0;
}

.kt .kt-stat-rank {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--surface-alt-2);
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
}

.kt .kt-stat-rank-main {
  min-width: 0;
}

.kt .kt-stat-rank-main strong {
  display: block;
  overflow: hidden;
  font-size: 12px;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kt .kt-stat-rank-main progress,
.kt .kt-stat-coverage progress {
  width: 100%;
  height: 5px;
  display: block;
  margin-top: 3px;
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  border-radius: var(--radius-pill);
  background: var(--surface-alt-2);
}

.kt .kt-stat-rank-main progress::-webkit-progress-bar,
.kt .kt-stat-coverage progress::-webkit-progress-bar {
  border-radius: var(--radius-pill);
  background: var(--surface-alt-2);
}

.kt .kt-stat-rank-main progress::-webkit-progress-value,
.kt .kt-stat-coverage progress::-webkit-progress-value {
  border-radius: var(--radius-pill);
  background: var(--accent);
}

.kt .kt-stat-rank-main progress::-moz-progress-bar,
.kt .kt-stat-coverage progress::-moz-progress-bar {
  border-radius: var(--radius-pill);
  background: var(--accent);
}

.kt .kt-stat-coverage {
  margin: 0;
  padding: 0;
  list-style: none;
}

.kt .kt-stat-coverage li {
  display: grid;
  grid-template-columns: minmax(86px,auto) minmax(0,1fr) 48px;
  align-items: center;
  gap: var(--space-2);
  padding: 5px 0;
  font-size: 11.5px;
}

.kt .kt-stat-coverage progress {
  margin: 0;
  height: 8px;
}

.kt .kt-stat-coverage strong {
  font-size: 12px;
  text-align: right;
  white-space: nowrap;
}

.kt .kt-stat-data-gap {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  padding: var(--space-4);
  border: 1px solid var(--line-strong);
  border-left: 3px solid var(--data-2);
  border-radius: 0 var(--radius) var(--radius) 0;
  background: var(--surface-muted);
}

.kt .kt-stat-data-gap > i {
  flex: 0 0 auto;
  color: var(--data-2);
  font-size: 21px;
}

.kt .kt-stat-data-gap h2 {
  margin: 0 0 var(--space-1);
  font-size: 13px;
}

.kt .kt-stat-data-gap p {
  margin: 0;
  color: var(--muted);
  font-size: 11.5px;
  line-height: 1.5;
}

.kt .kt-stat-diagnoses {
  margin-top: var(--space-4);
}

.kt .kt-stat-coverage-badge {
  padding: var(--space-1_5) var(--space-3);
  border-radius: var(--radius-pill);
  background: var(--accent-soft);
  color: var(--accent-strong);
  font-size: 11px;
  white-space: nowrap;
}

.kt .kt-stat-diagnosis-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(260px, .7fr);
  gap: var(--space-5);
}

.kt .kt-stat-diagnosis-count {
  text-align: right;
  white-space: nowrap;
}

.kt .kt-stat-diagnosis-count small {
  display: block;
  color: var(--muted);
}

.kt .kt-stat-diagnosis-quality {
  padding: var(--space-4);
  border-radius: var(--radius-sm);
  background: var(--surface-muted);
}

.kt .kt-stat-diagnosis-quality dl {
  margin: var(--space-3) 0;
}

.kt .kt-stat-diagnosis-quality dl div {
  display: flex;
  justify-content: space-between;
  gap: var(--space-3);
  padding: var(--space-1_5) 0;
  border-bottom: 1px solid var(--line);
}

.kt .kt-stat-diagnosis-quality dt {
  color: var(--muted);
}

.kt .kt-stat-diagnosis-quality dd {
  margin: 0;
  font-weight: 700;
}

.kt .kt-stat-diagnosis-quality progress {
  width: 100%;
  height: 9px;
}

@media (max-width: 1100px) {
  .kt .kt-stat-kpis { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .kt .kt-stat-grid-main,
  .kt .kt-stat-grid-three { grid-template-columns: minmax(0,1fr); }
  .kt .kt-stat-diagnosis-grid { grid-template-columns: minmax(0,1fr); }
  .kt .kt-diagnosis-row {
    grid-template-columns: minmax(220px,1fr) minmax(140px,.5fr);
  }
  .kt .kt-diagnosis-note { grid-column: 1 / -1; }
  .kt .kt-diagnosis-remove { justify-self: start; }
}

@media (max-width: 620px) {
  .kt .kt-stat-kpis { grid-template-columns: minmax(0,1fr); }
  .kt .kt-stat-card-head { flex-direction: column; }
  .kt .kt-stat-week { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .kt .kt-stat-data-gap { flex-direction: column; }
  .kt .kt-diagnosis-row,
  .kt .kt-diagnosis-fields { grid-template-columns: minmax(0,1fr); }
  .kt .kt-diagnosis-note { grid-column: auto; }
  .kt .kt-diagnosis-search { align-items: stretch; flex-direction: column; }
  .kt .kt-diagnosis-search .kt-form-actions { justify-content: stretch; }
  .kt .kt-diagnosis-search .kt-form-actions .kt-button { width: 100%; }
  .kt .kt-diagnosis-empty {
    align-items: flex-start;
    flex-wrap: wrap;
  }
  .kt .kt-diagnosis-empty .kt-button { width: 100%; }
}

/* Session warning + tab-scoped draft status for long clinical forms. */
.kt .kt-draft-note {
  display: flex;
  flex: 1 1 100%;
  align-items: center;
  justify-content: flex-end;
  gap: var(--space-2);
  min-height: 18px;
  color: var(--muted);
  font-size: 11px;
}

.kt .kt-draft-discard {
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--link);
  font: inherit;
  text-decoration: underline;
  cursor: pointer;
}

.kt .kt-draft-discard:focus-visible {
  border-radius: 2px;
  outline: 2px solid var(--focus);
  outline-offset: 2px;
}

.kt .kt-session-overlay {
  position: fixed;
  z-index: 10000;
  inset: 0;
  display: grid;
  place-items: center;
  padding: var(--space-4);
  background: rgb(12 24 32 / 58%);
}

.kt .kt-session-overlay[hidden] {
  display: none;
}

.kt .kt-session-dialog {
  width: min(100%, 430px);
  padding: var(--space-5);
  border: 1px solid var(--line-strong);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--elev-floating);
  text-align: center;
}

.kt .kt-session-icon {
  display: inline-grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--warning);
  color: var(--warning-text);
  font-size: 25px;
}

.kt .kt-session-dialog h2 {
  margin: var(--space-3) 0 var(--space-2);
}

.kt .kt-session-dialog p {
  margin: var(--space-2) 0;
}

.kt .kt-session-dialog strong {
  font-variant-numeric: tabular-nums;
}

.kt .kt-session-detail {
  color: var(--muted);
  font-size: 12px;
}

.kt .kt-session-actions {
  display: flex;
  justify-content: center;
  margin-top: var(--space-4);
}

@media (max-width: 620px) {
  .kt .kt-draft-note {
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
  }
}

@media (prefers-reduced-motion: reduce) {
  .kt .kt-session-overlay,
  .kt .kt-session-dialog {
    animation: none;
    transition: none;
  }
}