/* ==========================================================================
   MAAT — vizuelni sistem demo klinike (svetla verzija).
   Svetla radna povrsina, beli bocni meni sa ikonicama u svetlim kvadratima,
   bela gornja traka, bele kartice sa tankom ivicom, pastelne ikonice i oznake.
   NIGDE crna povrsina — radimo za klinike.
   Ucitava se POSLEDNJI na svakoj stranici; boje su tokeni (jedno mesto).
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

:root {
  --m-side: 264px;
  --m-side-t: 232px;     /* bocni meni na tabletu polozeno */
  --m-bar: 64px;
  --m-title: #1e293b;      /* naslovi — tamni skriljac, ne crna */
  --m-text: #334155;
  --m-muted: #64748b;
  --m-faint: #94a3b8;
  --m-line: #e6ebf1;
  --m-line-2: #d5dde6;
  --m-canvas: #f4f7fa;
  --m-surface: #ffffff;
  --m-subtle: #f8fafc;
  --m-head: #f1f5f9;       /* zaglavlje tabele */
  --m-accent: #0f9890;
  --m-accent-h: #0c8079;
  --m-accent-t: #0d8178;   /* akcenat kao tekst na belom */
  --m-accent-50: #e7f6f4;
  --m-accent-100: #c8ece7;
  --m-ok: #16a34a;   --m-ok-50: #e8f7ee;
  --m-warn: #ea8a1a; --m-warn-50: #fff3e5;
  --m-bad: #e5484d;  --m-bad-50: #fdecee;
  --m-info: #3b82f6; --m-info-50: #eaf2fe;
  --m-r: 12px;
  --m-r-sm: 8px;
  --m-ring: 0 0 0 3px rgba(15, 152, 144, .18);
  --m-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 1px 3px rgba(16, 24, 40, .04);
  --m-shadow-pop: 0 16px 40px rgba(30, 41, 59, .14), 0 2px 8px rgba(30, 41, 59, .06);
  --m-sans: Inter, system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --bs-primary: #0f9890;
  --bs-primary-rgb: 15, 152, 144;
  --bs-link-color: #0d8178;
  --bs-link-hover-color: #0c8079;
  --bs-body-font-family: var(--m-sans);
  --bs-body-color: #334155;
  --bs-border-radius: 8px;
  --accent-color: #0f9890;
  --heading-color: #1e293b;
  --default-font: var(--m-sans);
  --heading-font: var(--m-sans);
  --nav-font: var(--m-sans);
}

/* ---------- osnova ---------- */
html body {
  font-family: var(--m-sans) !important;
  color: var(--m-text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "cv11", "ss01";
  letter-spacing: -0.005em;
}
html body h1, html body h2, html body h3, html body h4, html body h5, html body h6 {
  font-family: var(--m-sans) !important; color: var(--m-title); letter-spacing: -0.015em;
}
td, th, .n, .stat, [class*="amount"], [class*="total"], [class*="price"], [class*="iznos"], time { font-variant-numeric: tabular-nums; }
a { color: var(--m-accent-t); }
a:hover { color: var(--m-accent-h); }
::selection { background: var(--m-accent-100); color: var(--m-title); }
:focus-visible { outline: 2px solid var(--m-accent); outline-offset: 2px; }

/* ---------- dugmad ---------- */
html body .btn {
  border-radius: var(--m-r-sm) !important; font-weight: 600; font-size: .875rem; padding: .5rem .95rem;
  box-shadow: none !important; transform: none !important; transition: background-color .15s, border-color .15s, color .15s;
}
html body .btn-sm { padding: .32rem .7rem; font-size: .8125rem; }
html body .btn-lg { padding: .7rem 1.2rem; font-size: 1rem; }
html body .btn-primary { background: var(--m-accent) !important; border-color: var(--m-accent) !important; color: #fff !important; }
html body .btn-primary:hover, html body .btn-primary:focus { background: var(--m-accent-h) !important; border-color: var(--m-accent-h) !important; }
html body .btn-outline-primary { background: #fff !important; color: var(--m-accent-t) !important; border-color: var(--m-accent) !important; }
html body .btn-outline-primary:hover { background: var(--m-accent-50) !important; }
html body .btn-outline-secondary, html body .btn-light, html body .btn-secondary {
  background: #fff !important; color: var(--m-text) !important; border: 1px solid var(--m-line-2) !important;
}
html body .btn-outline-secondary:hover, html body .btn-light:hover, html body .btn-secondary:hover {
  background: var(--m-subtle) !important; color: var(--m-title) !important; border-color: #b6c2cf !important;
}
html body .btn-success { background: var(--m-ok) !important; border-color: var(--m-ok) !important; color: #fff !important; }
html body .btn-danger { background: var(--m-bad) !important; border-color: var(--m-bad) !important; color: #fff !important; }
html body .btn-outline-danger { background: #fff !important; color: #d23a3f !important; border-color: rgba(229, 72, 77, .45) !important; }
html body .btn-outline-danger:hover { background: var(--m-bad-50) !important; }
html body .btn-warning { background: #f59e0b !important; border-color: #f59e0b !important; color: #fff !important; }
html body .btn:disabled, html body .btn.disabled { opacity: .55; }

/* ---------- polja ---------- */
html body .form-control, html body .form-select {
  border-radius: var(--m-r-sm) !important; border: 1px solid var(--m-line-2); background-color: #fff;
  color: var(--m-title); font-size: .9rem; box-shadow: none;
}
html body .form-control:focus, html body .form-select:focus { border-color: var(--m-accent) !important; box-shadow: var(--m-ring) !important; }
html body .form-control::placeholder { color: var(--m-faint); }
html body .form-label { font-size: .8rem; font-weight: 600; color: var(--m-text); margin-bottom: .35rem; }
html body .form-check-input:checked { background-color: var(--m-accent); border-color: var(--m-accent); }
html body .form-check-input:focus { box-shadow: var(--m-ring); border-color: var(--m-accent); }
html body .input-group-text { background: var(--m-subtle); border-color: var(--m-line-2); color: var(--m-muted); }

/* ---------- tabele ---------- */
html body .table { --bs-table-bg: transparent; font-size: .875rem; color: var(--m-text); }
html body .table > thead > tr > th, html body table thead th {
  background: var(--m-head) !important; color: var(--m-muted) !important; font-size: .72rem !important;
  font-weight: 600 !important; text-transform: uppercase; letter-spacing: .05em;
  border-bottom: 1px solid var(--m-line) !important; white-space: nowrap;
}
html body .table > :not(caption) > * > * { border-color: var(--m-line); padding: .7rem .8rem; }
html body .table-hover > tbody > tr:hover > * { background: #f8fbfb; }

/* ---------- oznake, kartice, prozori ---------- */
html body .badge { border-radius: 6px !important; font-weight: 600; padding: .38em .6em; }
html body .card { border: 1px solid var(--m-line) !important; border-radius: var(--m-r) !important; box-shadow: var(--m-shadow) !important; }
html body .card-header { background: #fff; border-bottom: 1px solid var(--m-line); font-weight: 600; color: var(--m-title); }
html body .modal-content { border: 1px solid var(--m-line) !important; border-radius: 14px !important; box-shadow: var(--m-shadow-pop) !important; overflow: hidden; }
html body .modal-header { background: #fff !important; color: var(--m-title) !important; border-bottom: 1px solid var(--m-line) !important; padding: 1rem 1.25rem; }
html body .modal-header :is(.modal-title, h1, h2, h3, h4, h5) {
  color: var(--m-title) !important; font-weight: 700 !important; font-size: 1.05rem !important; text-align: left !important;
}
html body .modal-header .btn-close-white { filter: none !important; }
html body .modal-footer { border-top: 1px solid var(--m-line); background: var(--m-subtle); }
html body .modal-backdrop.show { opacity: .4; background: #334155; }
html body .dropdown-menu { border: 1px solid var(--m-line); border-radius: 10px; box-shadow: var(--m-shadow-pop); padding: .35rem; }
html body .dropdown-item { border-radius: 6px; font-size: .875rem; padding: .45rem .7rem; }
html body .dropdown-item:active { background: var(--m-accent); }
html body .alert { border-radius: 10px; font-size: .875rem; }
html body .nav-tabs { border-bottom: 1px solid var(--m-line); gap: .25rem; }
html body .nav-tabs .nav-link { border: 0; border-bottom: 2px solid transparent; color: var(--m-muted); font-weight: 600; border-radius: 0; }
html body .nav-tabs .nav-link.active { color: var(--m-accent-t); border-bottom-color: var(--m-accent); background: transparent; }
html body .nav-pills .nav-link.active { background: var(--m-accent); }
html body .progress { border-radius: 4px; background: var(--m-line); }
html body .progress-bar { background: var(--m-accent); }
html body .tooltip-inner { background: #334155; border-radius: 6px; font-size: .78rem; }
html body [class$="-card"], html body [class*="-card "], html body [class$="-panel"], html body [class*="-panel "] { box-shadow: var(--m-shadow); }

/* obavestenje posle prijave: gore desno, ne zamagljuje ekran */
html body .medilab-portal-toast-overlay { display: none !important; }
html body .medilab-portal-toast {
  top: 76px !important; right: 20px !important; left: auto !important; transform: translateY(-6px) !important;
  width: min(360px, calc(100vw - 32px)) !important; min-height: 0 !important;
  border: 1px solid var(--m-line) !important; border-radius: 12px !important; background: #fff !important; box-shadow: var(--m-shadow-pop) !important;
}
html body .medilab-portal-toast.is-visible { transform: none !important; }
html body .medilab-portal-toast-inner { min-height: 0 !important; padding: 12px 14px !important; gap: 12px !important; }
html body .medilab-portal-toast-icon {
  width: 34px !important; height: 34px !important; border-radius: 10px !important; font-size: 1rem !important;
  background: var(--m-accent-50) !important; color: var(--m-accent) !important; box-shadow: none !important;
}
html body .medilab-portal-toast-copy, html body .medilab-portal-toast-copy strong { font-size: .875rem !important; color: var(--m-title) !important; }

/* ==========================================================================
   RADNI EKRANI (recepcija, lekar, laboratorija): zaglavlje postaje beli bocni
   meni levo, a sadrzaj dobija belu gornju traku (crta je mobilni.js).
   ========================================================================== */
html body { background-color: var(--m-canvas); }
html body :is(.service-topbar, .doctor-topbar, .lab-topbar) {
  background: #fff !important; border: 1px solid var(--m-line) !important; box-shadow: var(--m-shadow) !important; color: var(--m-text) !important;
}
html body :is(.service-topbar, .doctor-topbar, .lab-topbar) :is(h1, h2, h3, strong) { color: var(--m-title) !important; }
html body :is(.service-topbar, .doctor-topbar, .lab-topbar) :is(p, small, span) { color: var(--m-muted); }
html body :is(.service-topbar, .doctor-topbar, .lab-topbar) .btn-outline-light {
  background: #fff !important; color: var(--m-text) !important; border: 1px solid var(--m-line-2) !important;
}
html body :is(.service-kicker, .lab-kicker, .doctor-kicker, .lab-title-lockup .badge) {
  background: var(--m-accent-50) !important; color: var(--m-accent-t) !important; border: 0 !important;
}
html body :is(.service-topbar, .doctor-topbar, .lab-topbar) [class*="-topbar-toggle"] {
  background: transparent !important; border: 1px solid transparent !important; color: var(--m-text) !important;
  border-radius: 10px !important; box-shadow: none !important; font-weight: 500 !important; transform: none !important;
}
html body :is(.service-topbar, .doctor-topbar, .lab-topbar) [class*="-topbar-toggle"]:hover { background: var(--m-subtle) !important; color: var(--m-title) !important; }
html body :is(.service-topbar, .doctor-topbar, .lab-topbar) :is([class*="-topbar-toggle"].is-active, [class*="-topbar-toggle"].active) {
  background: var(--m-accent-50) !important; color: var(--m-accent-t) !important; font-weight: 600 !important;
}
html body [class*="-topbar-toggle"] > i.bi, html body [class*="-topbar-toggle"] > .m-ikonica {
  width: 32px; height: 32px; flex: 0 0 32px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center;
  background: var(--m-accent-50); color: var(--m-accent); font-size: .95rem; margin: 0 !important;
}
html body [class*="-topbar-toggle"].is-active > :is(i.bi, .m-ikonica) { background: #fff; }
/* Donja traka na telefonu (recepcija, lekar, laboratorija, tehnicar): aktivna stavka je OBOJENA, a
   ikonica bela — belo polje iza nje davalo je belo na belom (prijavio korisnik 05.10.2026). */
html body [class*="-mobile-dock"] [class*="-topbar-toggle"].is-active > :is(i.bi, .m-ikonica) {
  background: rgba(255, 255, 255, .2); color: #fff !important;
}
html body [class*="-topbar-nav-label"] {
  color: var(--m-faint) !important; text-transform: uppercase; letter-spacing: .08em; font-size: .68rem !important; font-weight: 600 !important;
}
html body [class*="-topbar-nav-label"] small { display: none !important; }
html body [class*="-topbar-nav-group"] { background: transparent !important; border: 0 !important; box-shadow: none !important; }
html body [class*="-topbar-nav-group"]::before { display: none !important; }
html body [class*="-topbar-toggle-badge"] { background: var(--m-bad) !important; color: #fff !important; border-radius: 999px !important; margin-left: auto; }

@media (min-width: 1200px) {
  html body :is(.service-shell, .doctor-shell, .lab-shell) {
    max-width: none !important; margin: 0 !important;
    padding: calc(var(--m-bar) + 24px) 28px 40px calc(var(--m-side) + 28px) !important;
  }
  html body :is(.service-topbar, .doctor-topbar, .lab-topbar) {
    position: fixed !important; top: 0 !important; left: 0 !important; bottom: 0 !important; z-index: 1030 !important;
    width: var(--m-side) !important; max-width: var(--m-side) !important; margin: 0 !important;
    display: flex !important; flex-direction: column !important; flex-wrap: nowrap !important;
    align-items: stretch !important; justify-content: flex-start !important; gap: 0 !important;
    padding: 0 0 12px !important; border-radius: 0 !important; border: 0 !important; border-right: 1px solid var(--m-line) !important;
    box-shadow: none !important; overflow-y: auto !important; overflow-x: hidden !important;
  }
  html body :is(.service-topbar, .doctor-topbar, .lab-topbar)::before {
    content: ""; order: -2; flex: 0 0 var(--m-bar); display: block; border-bottom: 1px solid var(--m-line);
    background: url("/static/assets/img/logo-klinike.svg?v=maat2") no-repeat 20px center / auto 34px;
  }
  html body .doctor-actions { display: contents !important; }
  /* naslov uloge */
  html body :is(.service-topbar-main, .doctor-brand, .lab-topbar-main) {
    order: -1; flex: 0 0 auto !important; width: 100% !important; padding: 16px 20px 6px !important; margin: 0 !important;
    display: block !important; background: transparent !important; border: 0 !important;
  }
  html body :is(.service-topbar-main, .doctor-brand, .lab-topbar-main) :is(h1, h2, strong) { font-size: 1rem !important; line-height: 1.3 !important; }
  html body .doctor-brand-mark { display: none !important; }
  /* meni */
  html body :is(.service-topbar-nav, .doctor-topbar-nav, .lab-topbar-nav) {
    order: 0; display: flex !important; flex-direction: column !important; flex-wrap: nowrap !important; align-items: stretch !important;
    gap: 2px !important; width: 100% !important; padding: 6px 12px !important; margin: 0 !important; overflow: visible !important;
    background: transparent !important; border: 0 !important;
  }
  html body [class*="-topbar-nav-group"] {
    display: flex !important; flex-direction: column !important; flex-wrap: nowrap !important; align-items: stretch !important;
    gap: 2px !important; width: 100% !important; padding: 0 !important; margin: 0 !important;
  }
  html body [class*="-topbar-nav-label"] { display: block !important; padding: 14px 10px 6px !important; margin: 0 !important; }
  html body :is(.service-topbar, .doctor-topbar, .lab-topbar) [class*="-topbar-toggle"] {
    display: flex !important; align-items: center !important; justify-content: flex-start !important; gap: 12px !important;
    width: 100% !important; min-height: 44px; padding: 6px 10px !important; text-align: left !important;
    font-size: .9rem !important; white-space: normal !important; line-height: 1.25 !important;
  }
  html body [class*="-topbar-nav-group"].is-secondary { padding-top: 6px !important; }
  html body .service-topbar-hint { display: none !important; }
  /* korisnik i odjava — dole, kao kartica */
  html body :is(.service-topbar-side, .doctor-actions-main, .lab-topbar-side) {
    order: 5; margin: auto 12px 0 !important; padding: 12px !important; width: auto !important;
    display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 8px !important;
    background: var(--m-subtle) !important; border: 1px solid var(--m-line) !important; border-radius: 12px !important;
  }
  html body :is(.service-topbar-actions, .lab-actions) { display: flex !important; flex-wrap: wrap !important; gap: 6px !important; justify-content: flex-start !important; }
  html body :is(.service-topbar-side, .doctor-actions-main, .lab-topbar-side) :is(.btn, button, a) { font-size: .8rem !important; }

  /* gornja traka (crta je mobilni.js) */
  html body .m-traka { display: flex; }
  html body.m-ima-meni { --m-levo: var(--m-side); }
}

/* gornja traka sadrzaja */
.m-traka {
  display: none; position: fixed; top: 0; right: 0; left: var(--m-levo, 0); z-index: 1025; height: var(--m-bar);
  align-items: center; justify-content: space-between; gap: 16px; padding: 0 28px;
  background: rgba(255, 255, 255, .96); backdrop-filter: saturate(160%) blur(8px); border-bottom: 1px solid var(--m-line);
}
.m-traka-levo { display: flex; align-items: center; gap: 10px; min-width: 0; }
.m-traka-putanja { font-size: .8rem; color: var(--m-faint); white-space: nowrap; }
.m-traka-naslov { font-size: 1.05rem; font-weight: 700; color: var(--m-title); letter-spacing: -0.01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.m-traka-desno { display: flex; align-items: center; gap: 14px; }
.m-traka-datum { display: inline-flex; align-items: center; gap: 8px; font-size: .82rem; color: var(--m-muted);
  padding: 7px 12px; border: 1px solid var(--m-line); border-radius: 10px; background: #fff; }
.m-traka-korisnik { display: flex; align-items: center; gap: 10px; padding-left: 14px; border-left: 1px solid var(--m-line); }
.m-traka-avatar { width: 36px; height: 36px; border-radius: 50%; background: var(--m-accent-50); color: var(--m-accent-t);
  display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: .82rem; }
.m-traka-ime { font-size: .86rem; font-weight: 600; color: var(--m-title); line-height: 1.15; }
.m-traka-uloga { font-size: .74rem; color: var(--m-muted); }

/* ==========================================================================
   UPRAVA (cl ekrani): beli bocni meni uz ivicu, ikonice u svetlim kvadratima
   ========================================================================== */
@media (min-width: 1200px) {
  html body .shell { padding: calc(var(--m-bar) + 24px) 28px 40px calc(var(--m-side) + 28px) !important; display: block !important; max-width: none !important; }
  html body .shell > .side {
    position: fixed !important; top: 0 !important; left: 0 !important; bottom: 0 !important; width: var(--m-side) !important;
    min-height: 0 !important; border-radius: 0 !important; z-index: 1030;
  }
}
html body .side {
  background: #fff !important; color: var(--m-text) !important; border-right: 1px solid var(--m-line) !important;
  box-shadow: none !important; padding: 0 12px 14px !important; gap: 4px !important; overflow-y: auto;
}
html body .side .brand { min-height: var(--m-bar); margin: 0 -12px 6px !important; padding: 14px 20px 12px !important; border-bottom: 1px solid var(--m-line) !important; }
html body .side .brand p { color: var(--m-muted) !important; opacity: 1 !important; }
html body .side .brand img { max-width: 168px !important; }
html body .side .nav-group { background: transparent !important; border: 0 !important; padding: 0 !important; gap: 2px !important; }
html body .side .nav-title { color: var(--m-faint) !important; font-size: .68rem !important; letter-spacing: .08em !important; padding: 14px 10px 6px !important; }
html body .side-link {
  padding: 6px 10px !important; border-radius: 10px !important; font-weight: 500 !important; font-size: .9rem !important;
  color: var(--m-text) !important; border: 0 !important; transform: none !important; gap: 12px !important; min-height: 44px;
}
html body .side-link i {
  width: 32px !important; height: 32px; flex: 0 0 32px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center;
  background: var(--m-accent-50); color: var(--m-accent) !important; font-size: .95rem;
}
html body .side-link:hover { background: var(--m-subtle) !important; color: var(--m-title) !important; }
html body .side-link.active { background: var(--m-accent-50) !important; color: var(--m-accent-t) !important; font-weight: 600 !important; box-shadow: none !important; }
html body .side-link.active i { background: #fff; }
html body .side-info { background: var(--m-subtle) !important; border: 1px solid var(--m-line) !important; color: var(--m-text) !important; }
html body .side-info span { color: var(--m-accent-t) !important; }
html body .side-info .row2 { color: var(--m-text) !important; }
html body .panel { background: #fff !important; border: 1px solid var(--m-line) !important; border-radius: var(--m-r) !important; box-shadow: var(--m-shadow) !important; }
html body .panel.hero { background: transparent !important; border: 0 !important; box-shadow: none !important; padding-left: 0 !important; padding-right: 0 !important; }
html body .hero h1 { font-size: 1.6rem !important; font-weight: 700 !important; }
html body .stat { background: #fff !important; border: 1px solid var(--m-line) !important; box-shadow: var(--m-shadow) !important; border-radius: var(--m-r) !important; }
html body :is(.chip, .pill) { border-radius: 6px !important; }
html body .btn-accent { background: var(--m-accent) !important; border-color: var(--m-accent) !important; color: #fff !important; border-radius: 8px !important; }

/* pocetna uprave i tehnicar: svetla zaglavlja */
html body .wrap > .topbar {
  background: #fff !important; border: 1px solid var(--m-line) !important; box-shadow: var(--m-shadow) !important; color: var(--m-title) !important;
}
html body .wrap > .topbar :is(h1, h2, strong, span, p) { color: var(--m-title) !important; }
html body .wrap > .topbar :is(.btn, a) { background: #fff !important; color: var(--m-text) !important; border: 1px solid var(--m-line-2) !important; }
html body .tech-sidebar { background: #fff !important; border: 1px solid var(--m-line) !important; box-shadow: var(--m-shadow) !important; }
html body .tech-sidebar-brand { background: var(--m-accent-50) !important; color: var(--m-title) !important; }
html body .tech-sidebar-brand :is(strong, span, h1, p) { color: var(--m-title) !important; }
html body .tech-brand-logo img { height: 36px !important; }
html body .tech-sidebar .tech-topbar-toggle {
  background: transparent !important; border: 0 !important; border-radius: 10px !important; color: var(--m-text) !important;
  font-weight: 500 !important; box-shadow: none !important; padding: 9px 12px !important;
}
html body .tech-sidebar .tech-topbar-toggle:hover { background: var(--m-subtle) !important; }
html body .tech-sidebar .tech-topbar-toggle.is-active { background: var(--m-accent-50) !important; color: var(--m-accent-t) !important; font-weight: 600 !important; }

/* ==========================================================================
   JAVNI SAJT — svetao i miran
   ========================================================================== */
#header.header .topbar { background: var(--m-accent-50) !important; font-size: .8rem; border-bottom: 1px solid var(--m-accent-100); }
#header.header .topbar :is(a, i, span, strong) { color: var(--m-accent-t) !important; }
#header.header .branding { background: #fff !important; border-bottom: 1px solid var(--m-line) !important; box-shadow: none !important; }
#header.header .navmenu a { font-family: var(--m-sans) !important; font-weight: 500 !important; font-size: .925rem !important; color: var(--m-text) !important; }
#header.header .navmenu a:hover, #header.header .navmenu .active { color: var(--m-accent-t) !important; }
:is(#header.header .cta-btn, a.cta-btn) { background: var(--m-accent) !important; border-radius: 10px !important; box-shadow: none !important; font-weight: 600 !important; }

#hero.hero::after {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(90deg, rgba(255, 255, 255, .97) 0%, rgba(255, 255, 255, .9) 36%, rgba(255, 255, 255, .35) 64%, rgba(255, 255, 255, 0) 100%);
}
#hero.hero .container { z-index: 2; }
#hero.hero :is(h1, h2) {
  font-weight: 800 !important; font-size: clamp(2.3rem, 4.4vw, 3.8rem) !important; line-height: 1.06 !important;
  letter-spacing: -0.03em !important; color: var(--m-title) !important; text-shadow: none !important; max-width: 14ch;
}
#hero.hero p { color: var(--m-text) !important; font-size: 1.12rem !important; text-shadow: none !important; max-width: 44ch; }
#hero .dk-hero-kicker {
  background: var(--m-accent-50) !important; border: 1px solid var(--m-accent-100) !important; color: var(--m-accent-t) !important;
  border-radius: 999px !important; padding: 6px 14px !important; font-size: .74rem !important; letter-spacing: .12em !important; backdrop-filter: none !important;
}
#hero .dk-hero-btn { border-radius: 10px !important; box-shadow: none !important; font-weight: 600 !important; padding: .85rem 1.35rem !important;
  background: var(--m-accent) !important; border: 1px solid var(--m-accent) !important; color: #fff !important; transform: none !important; }
#hero .dk-hero-btn:hover { background: var(--m-accent-h) !important; }
#hero .dk-hero-btn.ghost { background: #fff !important; border-color: var(--m-line-2) !important; color: var(--m-title) !important; }
#hero .dk-hero-btn.ghost:hover { background: var(--m-subtle) !important; }
:is(.onama-hero, .usluge-hero, .lab-hero) :is(.onama-hero-overlay, .usluge-hero-overlay, .lab-hero-overlay) {
  background: linear-gradient(90deg, rgba(255, 255, 255, .96) 0%, rgba(255, 255, 255, .86) 45%, rgba(255, 255, 255, .25) 100%) !important;
}
:is(.onama-hero, .usluge-hero, .lab-hero) :is(h1, p) { color: var(--m-title) !important; text-shadow: none !important; }
:is(.onama-hero, .usluge-hero, .lab-hero) p { color: var(--m-text) !important; }
:is(.onama-eyebrow, .usluge-eyebrow, .lab-eyebrow) {
  background: var(--m-accent-50) !important; border: 1px solid var(--m-accent-100) !important; color: var(--m-accent-t) !important; backdrop-filter: none !important;
}
body.index-page section.light-background, body:has(#header.header) section.light-background { background-color: var(--m-canvas) !important; }
:is(.section-title h2, .dk-doctors-title) { font-weight: 800 !important; letter-spacing: -0.025em !important; color: var(--m-title) !important; text-transform: none !important; }
.section-title h2::before, .section-title h2::after { background: var(--m-accent) !important; }
.section-title p { color: var(--m-muted) !important; }
:is(.dk-card, .onama-feature, .service-item, .info-item, .icon-box) { border: 1px solid var(--m-line) !important; border-radius: 14px !important; box-shadow: var(--m-shadow) !important; }
.dk-cta-band { background: #fff !important; border-top: 1px solid var(--m-line) !important; border-bottom: 1px solid var(--m-line) !important; }
.dk-cta-band :is(a, span, strong, i) { color: var(--m-title) !important; }
.dk-cta-cell { border-color: var(--m-line) !important; background: transparent !important; }
.dk-cta-cell:hover { background: var(--m-subtle) !important; }
.dk-cta-icon { background: var(--m-accent-50) !important; color: var(--m-accent) !important; border-radius: 10px !important; }
.dk-cta-icon i { color: var(--m-accent) !important; }
.dk-cta-label { display: block !important; font-size: .7rem !important; text-transform: uppercase; letter-spacing: .1em; color: var(--m-muted) !important; font-weight: 600 !important; }
.dk-cta-main { display: block !important; font-size: 1.02rem !important; font-weight: 700 !important; color: var(--m-title) !important; }
#footer.footer { background: #fff !important; color: var(--m-text) !important; border-top: 1px solid var(--m-line) !important; }
#footer.footer :is(h4, .sitename, strong) { color: var(--m-title) !important; }
#footer.footer a { color: var(--m-text) !important; }
#footer.footer a:hover { color: var(--m-accent-t) !important; }
#footer.footer .copyright { border-top: 1px solid var(--m-line) !important; color: var(--m-muted) !important; }
#footer.footer .social-links a { border-color: var(--m-line-2) !important; color: var(--m-text) !important; }
#footer.footer div[style*="color:#1e293b"], #footer.footer div[style*="color: #1e293b"] { color: var(--m-muted) !important; font-size: .72rem; text-transform: uppercase; letter-spacing: .1em; }
#loginModal .modal-content { border-radius: 16px !important; }
#loginModal :is(.login-submit-soft, .btn-primary) { background: var(--m-accent) !important; border-color: var(--m-accent) !important; border-radius: 10px !important; }
#loginModal .login-input-soft { border-radius: 10px !important; }
html body .booking-header { background: #fff !important; border-bottom: 1px solid var(--m-line) !important; border-radius: 0 !important; text-align: left !important; padding: 22px 28px !important; }
html body .booking-header h2 { color: var(--m-title) !important; font-weight: 800 !important; font-size: 1.6rem !important; letter-spacing: -0.02em !important; padding: 0 !important; }
html body .booking-card { border-radius: 16px !important; border: 1px solid var(--m-line) !important; }

/* demo traka (crta je mobilni.js) */
#demoTraka {
  background: #fff7ed !important; color: #b45309 !important; border: 1px solid #fed7aa !important;
  border-radius: 999px !important; font-family: var(--m-sans) !important; font-weight: 600 !important; box-shadow: var(--m-shadow-pop) !important;
}
#demoTraka::before { content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #f59e0b; margin-right: 8px; vertical-align: 1px; }
/* telefon i tablet: na vrhu je prekrivala naslove i logo, dole donji meni i kartice — zato uska oznaka uz desnu ivicu */
@media (max-width: 1199.98px) {
  #demoTraka { top: 50% !important; bottom: auto !important; left: auto !important; right: 0 !important;
    transform: translateY(-50%) !important; writing-mode: vertical-rl; font-size: 0 !important; line-height: 1 !important;
    padding: 10px 4px !important; border-right: 0 !important; border-radius: 8px 0 0 8px !important;
    box-shadow: 0 2px 8px rgba(30, 41, 59, .12) !important; }
  #demoTraka::before { width: 6px; height: 6px; margin: 0 0 6px; vertical-align: 0; }
  #demoTraka::after { content: "DEMO"; font-size: 10px; font-weight: 700; letter-spacing: .12em; }
}

/* --- ispravke rasporeda bocnog menija (izmereno u pregledacu) --- */
@media (min-width: 1200px) {
  html body :is(.service-topbar, .doctor-topbar, .lab-topbar) > :is(.service-topbar-main, .doctor-brand, .lab-topbar-main) { order: -1 !important; }
  html body :is(.service-topbar, .doctor-topbar, .lab-topbar) :is(.service-topbar-nav, .doctor-topbar-nav, .lab-topbar-nav) {
    order: 0 !important; flex: 0 0 auto !important; justify-content: flex-start !important;
  }
  html body :is(.service-topbar, .doctor-topbar, .lab-topbar) :is(.service-topbar-side, .doctor-actions-main, .lab-topbar-side) {
    order: 5 !important; flex: 0 0 auto !important; margin-top: auto !important;
  }
  html body :is(.service-topbar, .doctor-topbar, .lab-topbar) [class*="-topbar-nav-group"][class] {
    display: flex !important; order: 0 !important; flex: 0 0 auto !important; flex-direction: column !important;
  }
  html body :is(.service-topbar, .doctor-topbar, .lab-topbar) [class*="-topbar-toggle"][class] { flex: 0 0 auto !important; }
}
html body :is(.service-topbar-side, .lab-topbar-side, .doctor-actions-main) :is(.service-meta, .lab-meta, [class*="user-pill"]) {
  color: var(--m-text) !important; background: #fff !important; border: 1px solid var(--m-line) !important;
  white-space: normal !important; font-size: .78rem !important; line-height: 1.35 !important;
}
html body .side .brand { min-height: 0 !important; }
@media (min-width: 1200px) {
  html body :is(.service-topbar, .doctor-topbar, .lab-topbar) [class*="-topbar-nav-group"][class][class] {
    background: transparent !important; padding: 0 !important; border: 0 !important; box-shadow: none !important; margin: 0 !important;
  }
  html body :is(.service-topbar, .doctor-topbar, .lab-topbar) [class*="-topbar-toggle"][class][class] {
    margin: 0 !important; white-space: nowrap !important; overflow: hidden !important;
  }
}
html body [class*="-topbar-toggle-badge"].m-nula { display: none !important; }
html body .lab-sample-code { background: var(--m-accent-50) !important; color: var(--m-accent-t) !important; border: 1px solid var(--m-accent-100) !important; }
html body .lab-sample-code * { color: var(--m-accent-t) !important; }
.m-traka #demoTraka { position: static !important; box-shadow: none !important; margin: 0 !important; }
/* pocetna uprave u istom okviru kao ostale stranice uprave */
html body .shell > main > .wrap { max-width: none !important; margin: 0 !important; padding: 0 !important; }
html body .shell > main > .wrap > .topbar { background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 0 0 8px !important; justify-content: flex-end !important; }
html body .shell > main > .wrap > .topbar .brand { display: none !important; }
html body .wrap > .topbar :is(.btn-out) { background: #fff !important; color: var(--m-text) !important; border: 1px solid var(--m-line-2) !important; }
html body .side .brand { height: var(--m-bar) !important; display: flex !important; align-items: center !important; padding: 0 20px !important; overflow: hidden; }
html body .side .brand p { display: none !important; }
html body .side .brand img { margin: 0 !important; max-height: 34px; width: auto !important; }
/* tehnicar: ikonice u svetlim kvadratima, kao u ostalim menijima */
html body .tech-sidebar .tech-topbar-toggle { justify-content: flex-start !important; gap: 12px !important; }
html body .tech-sidebar .tech-topbar-toggle i.bi {
  width: 32px; height: 32px; flex: 0 0 32px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center;
  background: var(--m-accent-50); color: var(--m-accent); font-size: .95rem; margin: 0 !important;
}
html body .tech-sidebar .tech-topbar-toggle.is-active i.bi { background: #fff; }
html body .side > * { flex-shrink: 0 !important; }
html body .side .brand { min-height: var(--m-bar) !important; }
html body .service-payment-due-box { background: var(--m-accent-50) !important; border: 1px solid var(--m-accent-100) !important; color: var(--m-title) !important; box-shadow: none !important; }
html body .service-payment-due-box :is(span, strong) { color: var(--m-title) !important; }
html body .service-payment-due-box span { color: var(--m-muted) !important; }
.dk-blog-date { background: #fff !important; color: var(--m-accent-t) !important; border: 1px solid var(--m-accent-100) !important; }
html body pre.code, html body pre code { background: var(--m-head) !important; color: var(--m-title) !important; border: 1px solid var(--m-line) !important; }

/* ==========================================================================
   TELEFON I TABLET (izmereno 04.10.2026 na 390 / 768 / 1024 px)
   ========================================================================== */
@media (max-width: 991.98px) {
  /* traka sa dugmetom menija na ekranima uprave: bela, kao gornja traka na sirokom ekranu */
  html body .mb-traka {
    background: #fff !important; color: var(--m-title) !important;
    border-bottom: 1px solid var(--m-line) !important; box-shadow: 0 1px 3px rgba(16, 24, 40, .05) !important;
  }
  html body .mb-meni {
    background: var(--m-accent-50) !important; border: 1px solid var(--m-accent-100) !important;
    color: var(--m-accent-t) !important; border-radius: 10px !important;
  }
  html body .mb-naslov { color: var(--m-title) !important; }
  html body .mb-zastor { background: rgba(30, 41, 59, .28) !important; }
  html body .shell > .side { border-radius: 0 !important; box-shadow: var(--m-shadow-pop) !important; }
  /* zaglavlje radnog ekrana je ovde kolona: naslov sa „flex: 1 1 520px" bi bio visok 520px (prazna rupa) */
  html body .service-topbar > .service-topbar-main,
  html body .lab-topbar > .lab-topbar-main { flex: 0 0 auto !important; }
}
/* grupa „Ostale sluzbe" bez sive podloge — iste je vrste kao ostale grupe */
html body [class*="-topbar-nav-group"].is-secondary[class][class] { background: transparent !important; box-shadow: none !important; }
/* dugme menija tehnicara: bilo je belo (za tamno zaglavlje) i na svetlom se nije videlo */
html body .tech-sidebar-menu-btn {
  background: var(--m-accent-50) !important; border: 1px solid var(--m-accent-100) !important; color: var(--m-accent-t) !important;
}
/* tablet polozeno: meni uprave levo uz ivicu (uzi), umesto preko celog vrha stranice */
@media (min-width: 992px) and (max-width: 1199.98px) {
  html body .shell { padding: calc(var(--m-bar) + 20px) 20px 32px calc(var(--m-side-t) + 20px) !important; display: block !important; max-width: none !important; }
  html body .shell > .side {
    position: fixed !important; top: 0 !important; left: 0 !important; bottom: 0 !important; width: var(--m-side-t) !important;
    min-height: 0 !important; border-radius: 0 !important; z-index: 1030;
  }
  html body .shell > .side .nav-group { grid-template-columns: 1fr !important; display: grid !important; }
  html body.m-uprava .m-traka { display: flex; padding: 0 20px; }
  html body.m-uprava { --m-levo: var(--m-side-t); }
  html body.m-uprava .m-traka-putanja { display: none; }
}
/* tehnicar na tabletu (721-1260): meni je iznad sadrzaja, pa je kompaktan — kartice u redu, brojevi i
   dugmad u jednom redu ispod, umesto ~480px naslaganih stavki pre prvog podatka */
@media (min-width: 721px) and (max-width: 1260px) {
  html body .tech-sidebar { gap: 12px !important; padding: 14px 16px !important; }
  html body .tech-sidebar-menu-content { display: grid !important; grid-template-columns: minmax(0, 1fr) auto; gap: 12px 16px !important; align-items: center; }
  html body .tech-sidebar-nav { grid-column: 1 / -1; display: flex !important; flex-wrap: wrap; gap: 6px !important; }
  html body .tech-sidebar .tech-topbar-toggle[class] { width: auto !important; min-height: 44px; padding: 6px 12px 6px 8px !important; border: 1px solid var(--m-line) !important; }
  html body .tech-sidebar-meta { display: flex !important; flex-wrap: wrap; gap: 6px 22px; margin: 0 !important; padding: 10px 14px !important; }
  html body .tech-sidebar-meta .tech-meta-row { margin: 0 !important; padding: 0 !important; border: 0 !important; }
  html body .tech-sidebar-actions .tech-topbar-actions { flex-wrap: nowrap !important; gap: 8px !important; }
  html body .tech-sidebar-actions .tech-topbar-actions .btn { width: auto !important; min-height: 42px; white-space: nowrap; }
}

/* ==========================================================================
   LISTE RADNIH EKRANA: jedan nalog / termin u dva reda (04.10.2026)
   Kartica je imala do 6 dugmadi iste tezine, isti podatak dva-tri puta i
   staju su 2-3 stavke na ekran. Sada: levo broj i vreme, sredina ko i sta,
   desno stanje, pa JEDNO glavno dugme (sledeci korak) i meni ⋯ za ostalo.
   Iste klase koriste laboratorija, recepcija i lekar.
   ========================================================================== */
.m-lista { display: flex; flex-direction: column; gap: 6px; container-type: inline-size; container-name: lista; }
.m-red {
  display: grid; grid-template-columns: 78px minmax(0, 1fr) 200px 300px; align-items: center; gap: 6px 16px;
  padding: 10px 14px; background: #fff; border: 1px solid var(--m-line); border-left: 3px solid var(--m-line-2); border-radius: 10px;
}
.m-red:hover { border-color: var(--m-line-2); }
.m-red.is-otvoreno { border-left-color: var(--m-accent); }
.m-red.is-gotovo { border-left-color: var(--m-ok); }
.m-red.is-hitno { border-left-color: var(--m-bad); }
.m-red.is-ugaseno { border-left-color: var(--m-line-2); opacity: .72; }
.m-red-levo { display: flex; flex-direction: column; line-height: 1.2; min-width: 0; }
.m-red-broj { font-weight: 700; font-size: 1.05rem; color: var(--m-title); font-variant-numeric: tabular-nums; white-space: nowrap; }
.m-red-vreme { font-size: .78rem; color: var(--m-muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.m-red-dan::before { content: " · "; }
.m-red-glavno { min-width: 0; }
.m-red-ime { font-weight: 600; color: var(--m-title); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; line-height: 1.3; }
.m-red-opis { font-size: .84rem; color: var(--m-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 2px; }
.m-red-stanje { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; font-size: .82rem; min-width: 0; }
.m-red-radnje { display: flex; align-items: center; gap: 6px; justify-content: flex-end; }
.m-red-radnje > .btn { white-space: nowrap; }
.m-oznaka {
  display: inline-flex; align-items: center; gap: 4px; padding: 1px 8px; border-radius: 999px; font-size: .72rem; font-weight: 600;
  background: var(--m-subtle); color: var(--m-muted); border: 1px solid var(--m-line);
}
.m-oznaka.is-bad { background: var(--m-bad-50); color: #b42318; border-color: #fbd0d3; }
.m-oznaka.is-warn { background: var(--m-warn-50); color: #b54708; border-color: #fde4c4; }
.m-oznaka.is-info { background: var(--m-accent-50); color: var(--m-accent-t); border-color: var(--m-accent-100); }
.m-stanje { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; color: var(--m-text); white-space: nowrap; }
.m-stanje::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--m-faint); flex: none; }
.m-stanje.is-ok::before { background: var(--m-ok); }
.m-stanje.is-info::before { background: var(--m-info); }
.m-stanje.is-warn::before { background: var(--m-warn); }
.m-stanje.is-bad::before { background: var(--m-bad); }
.m-novac { color: var(--m-muted); white-space: nowrap; }
.m-novac.is-ok { color: var(--m-ok); }
.m-novac.is-dug { color: #b54708; font-weight: 600; }
.m-napomena { font-size: .76rem; color: #b54708; }
.m-napomena.is-ok { color: var(--m-ok); }
.m-vise-dugme {
  width: 34px; height: 34px; padding: 0; display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--m-line-2); border-radius: 8px; background: #fff; color: var(--m-text);
}
.m-vise-dugme:hover, .m-vise-dugme[aria-expanded="true"] { background: var(--m-subtle); color: var(--m-title); }
.m-vise .dropdown-menu { min-width: 250px; padding: 6px; border: 1px solid var(--m-line); border-radius: 10px; box-shadow: var(--m-shadow-pop); }
.m-vise .dropdown-item {
  display: flex; align-items: center; gap: 10px; border-radius: 6px; padding: 7px 10px; font-size: .86rem; color: var(--m-text); white-space: normal;
}
.m-vise .dropdown-item:hover, .m-vise .dropdown-item:focus { background: var(--m-subtle); color: var(--m-title); }
.m-vise .dropdown-item i { color: var(--m-accent); width: 16px; flex: none; }
.m-vise .dropdown-header { font-size: .68rem; text-transform: uppercase; letter-spacing: .08em; color: var(--m-faint); padding: 8px 10px 2px; }
.m-vise .dropdown-divider { margin: 4px 0; border-color: var(--m-line); }
/* Raspored po sirini SAME LISTE, ne ekrana: lekarov dnevni pregled je uzak
   panel pored profila i na sirokom ekranu. */
/* uza lista: dugmad prelaze u drugi red, poravnata desno */
@container lista (max-width: 899.98px) {
  .m-red { grid-template-columns: 70px minmax(0, 1fr) 190px; }
  .m-red-radnje { grid-column: 2 / -1; }
  .m-red-dan { display: block; }
  .m-red-dan::before { content: none; }
}
/* telefon: broj i ime gore, stanje ispod imena, dugmad preko cele sirine */
@container lista (max-width: 599.98px) {
  .m-red { grid-template-columns: 58px minmax(0, 1fr); padding: 10px 12px; }
  .m-red-stanje { grid-column: 2; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 4px 12px; }
  .m-red-radnje { grid-column: 1 / -1; }
  .m-red-radnje > .btn { flex: 1 1 auto; min-height: 42px; }
  .m-vise-dugme { width: 42px; height: 42px; }
}
.lab-status:empty { display: none !important; }
/* lekar: ime otvara karton; obavestenja (zakljucan unos, nalaz laboratorije, dostava) ispod reda */
.m-red-ime-link { border: 0; background: none; padding: 0; font: inherit; font-weight: 600; color: var(--m-title); text-align: left; cursor: pointer; }
.m-red-ime-link:hover { color: var(--m-accent-t); text-decoration: underline; }
.m-red-dodatak { grid-column: 2 / -1; display: flex; flex-direction: column; gap: 6px; font-size: .84rem; }
.m-red-dodatak > * { margin: 0 !important; }
.m-red-dostava:empty { display: none; }
#doctorAppointments > .m-lista, #doctorAllAppointments > .m-lista { grid-column: 1 / -1; }
@container lista (max-width: 599.98px) { .m-red-dodatak { grid-column: 1 / -1; } }
/* Meni ⋯ se crta `position: fixed`, da ga ne sece okvir liste. Zamucenje pozadine
   (`backdrop-filter`) na panelu pretvara panel u okvir za fixed, pa je meni
   iskakao sto i vise piksela nize. Na svetlim belim panelima zamucenje se ne vidi. */
html body *:has(.m-vise) { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
/* LEKAR, dnevni pregled: kartica profila je bila kolona od 300px sa lekarovim
   SOPSTVENIM mejlom i telefonom i brojem termina dvaput, a ime i slika vec stoje
   u gornjoj traci. Na sirokom ekranu postaje jedna traka iznad liste (slika, ime,
   odeljenje, dan, broj termina, soba), pa lista dobija celu sirinu. */
@media (min-width: 992px) {
  html body .doctor-grid { grid-template-columns: minmax(0, 1fr) !important; grid-template-rows: auto minmax(0, 1fr) !important; }
}
/* traka na svim sirinama — na telefonu je kartica profila zauzimala ceo prvi ekran */
@media all {
  html body .doctor-grid > .doctor-profile-card {
    height: auto !important; flex-direction: row !important; flex-wrap: wrap; align-items: center !important; gap: 10px 22px;
    padding: 10px 18px !important; overflow: visible !important;
  }
  html body .doctor-profile-card > *:not(.doctor-profile-hero) { padding: 0 !important; margin: 0 !important; }
  html body .doctor-profile-card .doctor-profile-hero { margin: 0 auto 0 0 !important; padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; }
  html body .doctor-profile-card .doctor-avatar-wrap { gap: 12px !important; align-items: center !important; }
  html body .doctor-profile-card :is(.doctor-avatar, .doctor-avatar-fallback) { width: 44px !important; height: 44px !important; min-width: 44px; border-radius: 50% !important; font-size: .9rem !important; }
  html body .doctor-profile-card .doctor-title-wrap h2 { font-size: 1rem !important; margin: 0 !important; }
  html body .doctor-profile-card .doctor-title-wrap p { font-size: .82rem !important; margin: 0 !important; }
  html body .doctor-profile-card .doctor-summary-grid { display: flex !important; gap: 22px !important; }
  html body .doctor-profile-card .doctor-summary-item { display: flex !important; align-items: baseline; gap: 6px; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; min-height: 0 !important; }
  html body .doctor-profile-card .doctor-summary-item span { font-size: .78rem; color: var(--m-muted); }
  html body .doctor-profile-card .doctor-summary-item strong { font-size: .95rem; }
  html body .doctor-profile-card .doctor-meta-row:is(:has(#doctorEmail), :has(#doctorPhone), :has(#doctorAppointmentCount)) { display: none !important; }
  html body .doctor-profile-card .doctor-meta-row:has(#doctorRoomNumber) { display: flex !important; align-items: baseline; justify-content: flex-start !important; gap: 6px; border: 0 !important; padding: 0 !important; }
  html body .doctor-profile-card #doctorRoomNumber { text-align: left !important; font-weight: 700; }
  html body .doctor-profile-card .doctor-meta-row:has(#doctorRoomNumber) .doctor-meta-label { font-size: .78rem; color: var(--m-muted); }
}
html body .doctor-grid .schedule-title p { display: none !important; }
/* recepcija: poruka „N termina ucitano…" i zastareli savet o sekciji „Operacije"
   (koje vise nema) stajali su ispod svake liste */
html body .service-status:empty { display: none !important; }
html body #serviceOperationsPlaceholder { display: none !important; }
html body .m-red-dodatak .service-lab-naplata { margin: 0 !important; }
/* zbirovi recepcije: red malih kartica (broj gore, opis ispod) umesto cetiri reda
   preko cele sirine; objasnjenje oznaka „Zakasnelo / Dospeva danas" vise ne treba */
html body .service-pending-legend { display: none !important; }
html body .service-summary-list { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 8px !important; }
html body .service-summary-list > .service-summary-item {
  display: flex !important; flex-direction: column-reverse !important; align-items: flex-start !important; justify-content: flex-end !important; gap: 2px !important;
  padding: 10px 12px !important; border: 1px solid var(--m-line) !important; border-radius: 10px !important; background: #fff !important;
}
html body .service-summary-list > .service-summary-item span { font-size: .76rem !important; color: var(--m-muted) !important; }
html body .service-summary-list > .service-summary-item strong { font-size: 1.05rem !important; color: var(--m-title) !important; }
/* pet narandzastih oznaka koje samo nabrajaju sta panel ume — bez ijedne radnje */
html body .service-lab-rules { display: none !important; }
html body .service-supply-rules { display: none !important; }

/* ==========================================================================
   KARTICA PRIJAVLJENOG (04.10.2026) — ista na dnu svakog menija: inicijali,
   ime i uloga na srpskom (crta skoljka.js), dugmad iste visine; na recepciji i
   u laboratoriji „Kasa" preko cele sirine, ostala dva u dve jednake kolone.
   ========================================================================== */
.m-ja { display: flex; align-items: center; gap: 10px; min-width: 0; width: 100%; }
.m-ja-avatar {
  width: 36px; height: 36px; flex: none; border-radius: 50%; background: var(--m-accent-50); color: var(--m-accent-t);
  display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: .8rem;
}
.m-ja-tekst { min-width: 0; line-height: 1.25; }
.m-ja-ime { font-weight: 600; font-size: .86rem; color: var(--m-title); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.m-ja-uloga { font-size: .74rem; color: var(--m-muted); }
html body :is(.service-topbar-side, .lab-topbar-side):has(.m-ja) :is(#serviceDeskMeta, #labDeskMeta) { display: none !important; }
html body :is(.service-topbar-side, .lab-topbar-side):has(.m-ja) { gap: 10px !important; }
html body :is(.service-topbar-side, .lab-topbar-side) :is(.service-topbar-actions, .lab-actions)[class] {
  display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 6px !important; width: 100% !important;
}
html body :is(.service-topbar-actions, .lab-actions) > span:has(.ks-dugme) { grid-column: 1 / -1; display: block !important; width: 100%; }
html body :is(.service-topbar-actions, .lab-actions) :is(.btn, .ks-dugme)[class],
html body .doctor-actions-main > :is(.doctor-signature-btn, #doctorLogoutBtn)[class],
html body .m-ja-kartica .m-ja-odjava[class] {
  width: 100% !important; height: 36px !important; min-height: 36px !important; margin: 0 !important; padding: 0 10px !important;
  display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 6px !important;
  font-size: .8rem !important; font-weight: 600 !important; border-radius: 8px !important; white-space: nowrap !important; box-shadow: none !important;
}
html body :is(.service-topbar-actions, .lab-actions, .doctor-actions-main, .m-ja-kartica) :is(.btn, .ks-dugme) > :is(i, svg, img) { margin: 0 !important; }
/* Odjava je svuda ista: puna boja akcenta */
html body :is(#serviceDeskLogoutBtn, #labLogoutBtn, #doctorLogoutBtn, #techLogoutBtn, .m-ja-odjava)[class] {
  background: var(--m-accent) !important; border: 1px solid var(--m-accent) !important; color: #fff !important;
}
html body :is(#serviceDeskLogoutBtn, #labLogoutBtn, #doctorLogoutBtn, #techLogoutBtn, .m-ja-odjava)[class]:hover { background: var(--m-accent-h) !important; }
html body :is(#serviceDeskRefreshBtn, #labRefreshBtn, #techRefreshBtn, .doctor-signature-btn)[class] {
  background: #fff !important; border: 1px solid var(--m-line-2) !important; color: var(--m-text) !important;
}
/* lekar: kartica, sat ispod imena, „Moj potpis" i „Odjava" u dve kolone */
html body .doctor-actions-main:has(.m-ja) { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 6px !important; align-items: center !important; }
html body .doctor-actions-main > :is(.m-ja, .doctor-topbar-clock) { grid-column: 1 / -1; }
html body .doctor-actions-main:has(.m-ja) > .doctor-topbar-clock[class] {
  background: transparent !important; border: 0 !important; box-shadow: none !important; min-height: 0 !important;
  padding: 0 0 4px 46px !important; margin: -4px 0 0 !important; font-size: .74rem !important; color: var(--m-muted) !important;
}
html body .doctor-actions-main:has(.m-ja) > .doctor-topbar-clock small { font-size: .74rem !important; color: var(--m-muted) !important; font-weight: 500 !important; }
/* uprava: kartica na dnu bocnog menija, uvek vidljiva i kad se meni klizi */
.m-ja-kartica {
  position: sticky; bottom: 0; z-index: 2; margin: auto -12px -14px !important; padding: 12px 14px 14px;
  display: flex; flex-direction: column; gap: 10px; background: #fff; border-top: 1px solid var(--m-line);
}
html body .shell > main > .wrap > .topbar #logout { display: none !important; }
/* tehnicar (bocni meni od 1261px): „Moj profil" preko cele sirine, ostala dva u dve kolone */
@media (min-width: 1261px) {
  html body .tech-sidebar-actions .tech-topbar-actions[class] { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 6px !important; }
  html body .tech-sidebar-actions .tech-topbar-actions .btn[class] {
    width: 100% !important; height: 36px !important; min-height: 36px !important; margin: 0 !important; padding: 0 10px !important;
    font-size: .8rem !important; border-radius: 8px !important; box-shadow: none !important;
  }
  html body #techProfileBtn { grid-column: 1 / -1; }
}