/* ══════════════════════════════════════════════════════════════════════
   ORGANIZATOR PORTAL — chrome + Početna (O-F0 pilot, 2026-07-17)

   Svijetli, couple-paritetan portal za restorane/dvorane/planere.
   Surface mode: quiet utility s Dalia identitetom — tokeni i tipografija
   Dalia, bez ornamenata i ceremonije. Akcent dolazi iz .portal-theme-org
   (--portal-accent #9f7a5f, design_tokens.html) — nikad direktan hex.

   Motion: reuse dpFadeUp iz dalia-portal.css (content tier) — nijedan novi
   keyframe. Micro tier = token tranzicije (--transition-fast, --ease).
   ══════════════════════════════════════════════════════════════════════ */

/* Dark parity s couple shellom (body.dark-mode ide iz localStorage
   'dalia-theme' u base.html). Vrijednosti su iste kao u shell_couple
   dark bloku — nisu tokeni pa ih vežemo jednom ovdje, nigdje drugdje. */
.portal-theme-org {
  --org-d-bg: #1e1c1a;
  --org-d-card: #252220;
  --org-d-line: #3a3530;
  --org-d-text: #d4c4b0;
  --org-d-mute: #9b9188;
  --org-d-head: #e8ded0;

  /* Token re-anchor (isti trik kao base_admin .app-layout i .portal-theme-vendor):
     design_tokens.html veže --gold* na couple deep-mauve, a naslijeđeni org
     templati koriste --gold kao akcent — bez ovoga migrirane stranice
     renderiraju rozno pod org shellom. */
  --gold: var(--portal-accent);
  --gold-accent: var(--portal-accent);
  --gold-light: color-mix(in srgb, var(--portal-accent) 55%, var(--paper));
  --gold-hover: color-mix(in srgb, var(--portal-accent) 85%, black);
}
/* .btn-primary gradient je hardkodiran rose u design_tokens.html (ne token),
   pa ga re-anchor ne hvata — scope override kao u base_admin. */
.portal-theme-org .btn-primary {
  background: var(--portal-accent) !important;
  box-shadow: 0 10px 24px -12px color-mix(in srgb, var(--portal-accent) 60%, transparent);
}
.portal-theme-org .btn-primary:hover {
  background: color-mix(in srgb, var(--portal-accent) 85%, black) !important;
}
/* Pilot jezik nema breadcrumbe (couple S5 presedan) — legacy blok se ne crta. */
.org-main .breadcrumb { display: none; }

/* ── LAYOUT ─────────────────────────────────────────────────────────── */
.org-layout {
  display: flex;
  min-height: 100vh;
  background: var(--paper);
}
.org-main {
  flex: 1;
  min-width: 0;
  max-width: 1440px;
  margin-inline: auto;
  width: 100%;
  padding: clamp(24px, 4vw, 40px);
  font-family: var(--font-sans);
  font-size: 15px;
  line-height: 1.6;
  color: var(--ink);
}

/* ── SIDEBAR (desktop) ──────────────────────────────────────────────── */
.org-sidebar {
  width: 240px;
  flex-shrink: 0;
  position: sticky;
  top: 0;
  height: 100vh;
  display: flex;
  flex-direction: column;
  background:
    radial-gradient(circle at top left, var(--portal-tint, rgba(244,229,214,0.82)), transparent 32%),
    var(--paper);
  border-right: 1px solid var(--ink-faint);
  font-family: var(--font-sans);
}
.org-sidebar-header {
  padding: 28px 20px 18px;
  border-bottom: 1px solid var(--paper-2);
}
/* Marka dolazi iz `.dw-lockup` (makro `dalia_lockup`) — ovdje ostaje samo
   pozicija. Do 2026-08-01 je organizator vozio STARU obrnutu hijerarhiju koju
   je ostatak proizvoda napustio 29.7.: „Dalia" 13 px Manrope razmaknuto (sitan
   nadpis), „Weddings" 21 px Cardo bold u akcentu (display-riječ). Doslovno
   obrnuto od svih drugih ploha — organizator koji se prebaci na javnu stranicu
   vidio je drugu marku. */
.org-brand-link { line-height: 1; }
/* Riječ marke NAMJERNO bez tona po ulozi (Vedran 11.8.: „siva svugdje, samo
   cvijet nosi boju") — ulogu nosi latica kroz mark='venue', tinta riječi je
   kanonski `--lk-ink` iz `.dw-lockup`. */
.org-portal-tag {
  display: inline-block;
  margin-top: 8px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-mute);
}

.org-sidebar-nav {
  flex: 1;
  padding: 12px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.org-nav {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  min-height: 40px;
  border-radius: 10px;
  border-left: 3px solid transparent;
  color: var(--ink);
  font-size: 14px;
  text-align: left; /* i kad je <button> (theme toggle u ladici) */
  background: none;
  border-top: none; border-right: none; border-bottom: none;
  font-family: inherit;
  cursor: pointer;
  text-decoration: none;
  transition: background var(--transition-fast, 180ms ease),
              color var(--transition-fast, 180ms ease),
              border-color var(--transition-fast, 180ms ease);
}
.org-nav svg {
  width: 18px; height: 18px; flex-shrink: 0;
  stroke: currentColor; opacity: 0.5;
  transition: opacity var(--transition-fast, 180ms ease);
}
/* Samo label se rasteže. NE `.org-nav span` — taj selektor (0,1,1) nadjačava
   .org-nav-badge/.org-nav-soon-tag (0,1,0) pa im je curio flex:1 i razvlačio ih. */
.org-nav-label { flex: 1; }
.org-nav:hover { background: var(--portal-tint, rgba(244,229,214,0.82)); color: var(--portal-accent); }
.org-nav:hover svg { opacity: 0.8; }
.org-nav.is-active {
  background: var(--portal-tint, rgba(244,229,214,0.82));
  border-left-color: var(--portal-accent);
  color: var(--portal-accent);
  font-weight: 500;
}
.org-nav.is-active svg { opacity: 0.85; }
/* Naslov zone „Moja dvorana" (BRIEF_MOJA_DVORANA presuda 6, čeka Vedranov
   OK): verzalni micro-label, isti registar kao org-card-note — naslov je
   orijentir, ne stavka, pa nema hover ni fokus stanja. */
.org-nav-zona {
  display: block;
  margin: 14px 12px 4px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-mute);
}
.org-nav-zona-razmak { margin-top: 10px; }
/* Površina koja još nije spojena — poštenje umjesto mrtvog linka. */
.org-nav.is-soon { color: var(--ink-mute); cursor: default; }
.org-nav.is-soon:hover { background: none; color: var(--ink-mute); }
.org-nav-soon-tag {
  flex: 0 0 auto;
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-mute);
  border: 1px solid var(--ink-faint);
  border-radius: 999px;
  padding: 2px 8px;
}
.org-nav-badge {
  flex: 0 0 auto;
  min-width: 20px;
  padding: 1px 7px;
  box-sizing: border-box;
  border-radius: 10px;
  background: var(--portal-accent);
  color: var(--paper);
  font-size: 11px;
  font-weight: 600;
  text-align: center;
}
.org-nav-badge[hidden] { display: none; }

/* ── SIDEBAR BOTTOM: avatar + postavke iza avatara ─────────────────── */
.org-sidebar-bottom {
  padding: 12px;
  border-top: 1px solid var(--paper-2);
  position: relative;
}
.org-user-chip {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 8px 10px;
  border: none;
  background: none;
  border-radius: 10px;
  cursor: pointer;
  font-family: inherit;
  text-align: left;
  transition: background var(--transition-fast, 180ms ease);
}
.org-user-chip:hover { background: var(--portal-tint, rgba(244,229,214,0.82)); }
.org-user-avatar {
  width: 34px; height: 34px;
  border-radius: 50%;
  flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: var(--paper-2);
  color: var(--portal-accent);
  font-size: 13px; font-weight: 600;
}
.org-user-meta { flex: 1; min-width: 0; }
.org-user-name {
  font-size: 13px; font-weight: 600; color: var(--ink);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.org-user-role { font-size: 11px; color: var(--ink-mute); }

.org-profile-menu {
  position: absolute;
  bottom: calc(100% + 6px);
  left: 12px; right: 12px;
  padding: 6px;
  background: var(--paper);
  border: 1px solid var(--paper-2);
  border-radius: 14px;
  box-shadow: var(--shadow, 0 14px 40px -22px rgba(45,34,56,0.32));
  z-index: var(--z-sticky, 10);
}
.org-profile-menu[hidden] { display: none; }
.org-profile-item {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  box-sizing: border-box;
  padding: 10px 12px;
  min-height: 44px;
  border: none;
  background: none;
  font-family: inherit;
  font-size: 13.5px;
  color: var(--ink);
  text-align: left;
  text-decoration: none;
  cursor: pointer;
  border-radius: 9px;
  transition: background var(--transition-fast, 180ms ease);
}
.org-profile-item:hover { background: var(--paper-2); }
.org-profile-item svg { width: 17px; height: 17px; flex-shrink: 0; stroke: currentColor; opacity: 0.55; }
.org-profile-divider { height: 1px; background: var(--paper-2); margin: 6px 4px; }
.org-profile-item--danger { color: var(--badge-danger-fg); }

/* ── MOBILE TOPBAR + LADICA ─────────────────────────────────────────── */
.org-topbar {
  display: none;
  position: fixed;
  top: 0; left: 0; right: 0;
  height: var(--dw-topbar-h, 48px);
  /* Auto-sklanjanje na skrol: data-dw-autohide atribut; CSS+mehanika dijeljeni
     (dalia-portal.css `dw-topbar-hide` + dw-topbar-autohide.js). */
  z-index: var(--z-topbar, 50);
  align-items: center;
  justify-content: space-between;
  padding: 0 12px 0 16px;
  background: color-mix(in srgb, var(--paper) 92%, transparent);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--paper-2);
  font-family: var(--font-sans);
}
/* Mobilna traka NE smanjuje lockup (pravilo kanona: uska ploha mijenja oblik,
   ne mjeru). Ovdje je do 2026-08-01 stajalo 11 px / 16 px — treća veličina iste
   marke u istom fajlu. */
.org-topbar-btn {
  width: 44px; height: 44px;
  display: inline-flex; align-items: center; justify-content: center;
  border: none; background: none; border-radius: 50%;
  color: var(--ink); cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.org-topbar-btn svg { width: 22px; height: 22px; }

.org-drawer-backdrop {
  position: fixed; inset: 0;
  z-index: var(--z-sheet-backdrop, 1040);
  background: rgba(20, 15, 12, 0.42);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}
.org-drawer-backdrop[hidden] { display: none; }
.org-drawer {
  position: fixed;
  top: 0; right: 0; bottom: 0;
  width: min(86vw, 340px);
  height: 100dvh;
  z-index: var(--z-sheet, 1050);
  background: var(--paper);
  border-left: 1px solid var(--paper-2);
  box-shadow: var(--shadow-lg, 0 30px 70px -36px rgba(45,34,56,0.42));
  display: flex;
  flex-direction: column;
  transform: translateX(100%);
  transition: transform 300ms var(--ease);
  overscroll-behavior: contain;
}
.org-drawer[hidden] { display: none; }
.org-drawer.is-open { transform: translateX(0); }
.org-drawer-head {
  flex-shrink: 0;
  display: flex; align-items: center; justify-content: space-between;
  min-height: 52px;
  padding: max(8px, env(safe-area-inset-top)) 8px 8px 18px;
  border-bottom: 1px solid var(--paper-2);
}
.org-drawer-scroll {
  flex: 1; min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 12px 12px calc(20px + env(safe-area-inset-bottom));
  display: flex; flex-direction: column; gap: 2px;
}
.org-drawer .org-nav { min-height: 48px; }

@media (min-width: 769px) {
  .org-topbar, .org-drawer, .org-drawer-backdrop { display: none !important; }
}
@media (max-width: 768px) {
  .org-sidebar { display: none; }
  .org-topbar { display: flex; }
  .org-main {
    padding: calc(var(--dw-topbar-h, 48px) + env(safe-area-inset-top) + 16px) 16px max(16px, env(safe-area-inset-bottom));
  }
}
@media (prefers-reduced-motion: reduce) {
  .org-drawer { transition: none; }
}

/* ── PAGE HEADER (couple-paritetan .couple-page-header pattern) ─────── */
.org-page-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  padding: 8px 0 16px;
  margin-bottom: 20px;
}
.org-page-title {
  font-family: var(--font-serif);
  font-size: clamp(22px, 3vw, 30px);
  font-weight: 400;
  color: var(--ink);
  letter-spacing: -0.01em;
  margin: 0;
  line-height: 1.3;
}
.org-page-title strong { font-weight: 400; color: var(--portal-accent); }
.org-page-sub {
  font-size: 13px;
  color: var(--ink-mute);
  margin: 6px 0 0;
}
/* Eyebrow = put natrag, ne breadcrumb (presuda §2, odluka 3). Breadcrumb se
   NE vraća (`organizator.css:43` ga gasi, couple S5 presedan) — ali ekran u
   dubini (Studio, predlošci) mora imati vidljiv izlaz. Nosi ga ovaj redak. */
.org-page-eyebrow {
  display: block;
  margin-bottom: 6px;
  font-size: 12px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-weight: 500;
  color: var(--ink-mute);
}
.org-page-eyebrow a { color: inherit; text-decoration: none; }
.org-page-eyebrow a:hover { color: var(--portal-accent); text-decoration: underline; }
.org-page-eyebrow > span { margin: 0 6px; opacity: 0.55; }

/* ── `.page-header*` KOMPAT — privremeno, do prijevoda po ekranu ──
   Osam org ekrana (`venues`, `venue_layout`, `layout_templates`,
   `wedding_layouts`, `checklist`, `dietary`, `my_users`, `wedding_new`)
   renderira `.page-header` iako je ta obitelj definirana SAMO u inline
   <style> bloku `base_admin.html:554-559` — dakle u ljusci koju ti ekrani ne
   nasljeđuju. Pod ovom ljuskom su danas bez ijednog pravila.

   Gore od neuglednog: uz njih ide `style="margin:-32px -40px 32px"`, margina
   koja računa na padding kojeg ovdje nema. Na 390 px reže ~24 px sa svake
   strane, a `dalia-portal.css` ima `overflow-x: hidden` — tekst se ne skrola
   nego se TIHO ODSIJECA. Zato `margin-inline: 0 !important`: ne uljepšava,
   nego vraća odrezani tekst na ekran.

   Ovi ekrani NISU dirani u ovom prolazu (paralelni rad na koracima 3-4
   presude); kad se svaki prevede na `.org-page-*`, ovaj blok se briše. */
.org-main .page-header {
  margin-inline: 0 !important;
  padding: 8px 0 16px;
  background: transparent;
  margin-bottom: 20px;
}
.org-main .page-header h1 {
  font-family: var(--font-serif);
  font-size: clamp(22px, 3vw, 30px);
  font-weight: 400;
  color: var(--ink);
  letter-spacing: -0.01em;
  margin: 0;
  line-height: 1.3;
}
.org-main .page-header p {
  font-size: 13px;
  color: var(--ink-mute);
  margin: 6px 0 0;
}
.org-main .page-header-eyebrow {
  display: block;
  margin-bottom: 6px;
  font-size: 12px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-weight: 500;
  color: var(--ink-mute);
}
.org-main .page-header-eyebrow a { color: inherit; text-decoration: none; }
.org-main .page-header-eyebrow a:hover { color: var(--portal-accent); text-decoration: underline; }
.org-main .page-header-actions { display: flex; gap: 10px; margin-top: 14px; flex-wrap: wrap; }
.org-page-action {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 20px;
  min-height: 44px;
  box-sizing: border-box;
  background: transparent;
  color: var(--portal-accent);
  border: 1px solid color-mix(in srgb, var(--portal-accent) 45%, transparent);
  border-radius: 999px;
  font-family: var(--font-sans);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.02em;
  white-space: nowrap;
  cursor: pointer;
  text-decoration: none;
  transition: background var(--transition-fast, 180ms ease),
              border-color var(--transition-fast, 180ms ease);
}
.org-page-action:hover {
  background: color-mix(in srgb, var(--portal-accent) 8%, transparent);
  border-color: var(--portal-accent);
}
/* V8 (RASMUS_ORG_VAL3, 2026-08-07): Presloži traka i picker gumbi (Odustani/
   Premjesti/Vrati/Gotovo) su svi .org-page-action bez ijednog fokusnog
   pravila — tipkovnički put je padao na couple-lilac. Org prsten je --gold
   kroz :focus-visible, 2px/offset 2 (V7 presuda). */
.org-page-action:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }

/* ── KPI KARTICE ────────────────────────────────────────────────────── */
.org-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 24px;
}
.org-kpi {
  display: block;
  background: var(--paper-soft);
  border: 1px solid var(--paper-2);
  border-radius: 14px;
  padding: 20px;
  text-decoration: none;
  box-shadow: var(--shadow-sm, 0 4px 14px -8px rgba(45,34,56,0.18));
  animation: dpFadeUp 320ms var(--ease) both;
  transition: transform var(--transition-fast, 180ms ease),
              box-shadow var(--transition-fast, 180ms ease),
              border-color var(--transition-fast, 180ms ease);
}
.org-kpi:nth-child(2) { animation-delay: 40ms; }
.org-kpi:nth-child(3) { animation-delay: 80ms; }
.org-kpi:nth-child(4) { animation-delay: 120ms; }
.org-kpi:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--portal-accent) 35%, transparent);
  box-shadow: var(--shadow, 0 14px 40px -22px rgba(45,34,56,0.32));
}
.org-kpi-num {
  display: block;
  font-family: var(--font-serif);
  font-size: 40px;
  font-weight: 400;
  line-height: 1;
  color: var(--ink);
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}
.org-kpi-label {
  display: block;
  margin-top: 8px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.org-kpi-cue {
  display: inline-block;
  margin-top: 10px;
  font-size: 12px;
  color: var(--portal-accent);
  opacity: 0.75;
  transition: opacity var(--transition-fast, 180ms ease);
}
.org-kpi:hover .org-kpi-cue { opacity: 1; }
@media (max-width: 900px) {
  .org-kpi-grid { grid-template-columns: repeat(2, 1fr); }
  .org-kpi { padding: 16px; }
  .org-kpi-num { font-size: 32px; }
}

/* ── TABOVI (Vjenčanja / Novac / Statistika) ────────────────────────── */
.org-tabs {
  display: flex;
  gap: 6px;
  margin-bottom: 20px;
  padding: 5px;
  background: var(--paper-2);
  border-radius: 12px;
  width: fit-content;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.org-tab {
  padding: 10px 18px;
  min-height: 40px;
  border: none;
  background: transparent;
  border-radius: 8px;
  font-family: var(--font-sans);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.02em;
  color: var(--ink-soft);
  cursor: pointer;
  white-space: nowrap;
  transition: background var(--transition-fast, 180ms ease),
              color var(--transition-fast, 180ms ease);
}
.org-tab:hover { color: var(--ink); }
.org-tab.is-active {
  background: var(--paper);
  color: var(--ink);
  font-weight: 600;
  box-shadow: var(--shadow-sm, 0 4px 14px -8px rgba(45,34,56,0.18));
}
.org-tab-panel[hidden] { display: none; }
.org-tab-panel { animation: dpFadeIn 220ms var(--ease) both; }

/* ── SEKCIJSKA KARTICA (nosiva ploha za liste i brojke) ─────────────── */
.org-card {
  background: var(--paper-soft);
  border: 1px solid var(--paper-2);
  border-radius: 14px;
  box-shadow: var(--shadow-sm, 0 4px 14px -8px rgba(45,34,56,0.18));
  overflow: hidden;
}
.org-card + .org-card { margin-top: 16px; }
.org-card-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  padding: 16px 20px 0;
}
.org-card-title {
  font-family: var(--font-serif);
  font-size: 18px;
  font-weight: 400;
  color: var(--ink);
  margin: 0;
}
.org-card-note { font-size: 12px; color: var(--ink-mute); }
.org-card-body { padding: 16px 20px 20px; }

/* Filter pills (status lista vjenčanja) */
.org-filter-bar {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  padding: 14px 20px 0;
}
.org-filter-pill {
  padding: 8px 14px;
  min-height: 36px;
  border-radius: 999px;
  border: 1px solid var(--paper-2);
  background: transparent;
  font-family: var(--font-sans);
  font-size: 12px;
  font-weight: 500;
  color: var(--ink-soft);
  text-decoration: none;
  transition: background var(--transition-fast, 180ms ease),
              color var(--transition-fast, 180ms ease),
              border-color var(--transition-fast, 180ms ease);
}
.org-filter-pill:hover { color: var(--ink); border-color: var(--ink-faint); }
.org-filter-pill.is-active {
  background: var(--portal-tint, rgba(244,229,214,0.82));
  border-color: color-mix(in srgb, var(--portal-accent) 40%, transparent);
  color: var(--portal-accent);
}
.org-result-count { font-size: 12px; color: var(--ink-mute); align-self: center; margin-left: auto; }

/* Pretraga na listi vjenčanja — hvata imena i prostor (IK#6) */
.org-search-form { flex: 1 1 220px; min-width: 180px; }
.org-search-input {
  width: 100%;
  padding: 9px 14px;
  min-height: 36px;
  box-sizing: border-box;
  border: 1px solid var(--paper-2);
  border-radius: 999px;
  background: var(--paper);
  font-family: var(--font-sans);
  font-size: 13px;
  color: var(--ink);
  outline: none;
  transition: border-color var(--transition-fast, 180ms ease);
}
.org-search-input:focus { border-color: var(--portal-accent); }
.org-search-input::placeholder { color: var(--ink-mute); }
body.dark-mode .org-search-input { background: var(--org-d-card); border-color: var(--org-d-line); color: var(--org-d-text); }

/* ── NOVAC / STATISTIKA brojčane plohe ──────────────────────────────── */
.org-stat-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 12px;
}
.org-stat {
  padding: 14px 16px;
  border: 1px solid var(--paper-2);
  border-radius: 12px;
}
.org-stat-num {
  display: block;
  font-family: var(--font-serif);
  font-size: 26px;
  color: var(--ink);
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
}
.org-stat-label {
  display: block;
  margin-top: 4px;
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-mute);
}
.org-stat-context { display: block; margin-top: 6px; font-size: 12px; color: var(--ink-soft); }

/* Status pill s objašnjenjem — amber za "čeka", nikad crveno za recoverable */
.org-wait-note {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  padding: 8px 14px;
  border-radius: 10px;
  background: var(--badge-warning-bg);
  color: var(--badge-warning-fg);
  font-size: 12.5px;
}

/* Vodoravne trake (RSVP lijevak, popunjenost) — živi postoci, ne dekor */
.org-bar-row {
  display: grid;
  grid-template-columns: 130px 1fr 84px;
  align-items: center;
  gap: 12px;
  padding: 9px 0;
  font-size: 13px;
}
.org-bar-row + .org-bar-row { border-top: 1px solid var(--paper-2); }
.org-bar-label { color: var(--ink-soft); }
.org-bar-track {
  height: 8px;
  border-radius: 4px;
  background: var(--paper-2);
  overflow: hidden;
}
.org-bar-fill {
  display: block;
  height: 100%;
  border-radius: 4px;
  background: var(--portal-accent);
  opacity: 0.75;
}
.org-bar-num {
  text-align: right;
  color: var(--ink);
  font-variant-numeric: tabular-nums;
}
@media (max-width: 480px) {
  .org-bar-row { grid-template-columns: 96px 1fr 72px; }
}

/* ── SLJEDEĆA VJENČANJA (kompaktni redovi) ──────────────────────────── */
.org-wedding-list { padding-top: 10px; }
.org-next-row {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 20px;
  min-height: 56px;
  text-decoration: none;
  border-bottom: 1px solid var(--paper-2);
  transition: background var(--transition-fast, 180ms ease);
}
.org-next-row:last-child { border-bottom: none; }
.org-next-row:hover { background: var(--portal-tint, rgba(244,229,214,0.82)); }
.org-next-date {
  flex: 0 0 auto;
  width: 52px;
  text-align: center;
  font-variant-numeric: tabular-nums;
}
.org-next-date b {
  display: block;
  font-family: var(--font-serif);
  font-size: 20px;
  font-weight: 400;
  color: var(--ink);
  line-height: 1.1;
}
.org-next-date span {
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-mute);
}
.org-next-main { flex: 1; min-width: 0; }
.org-next-names {
  font-family: var(--font-serif);
  font-size: 16px;
  color: var(--ink);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.org-next-sub { font-size: 12px; color: var(--ink-mute); margin-top: 2px; }
.org-next-count {
  flex: 0 0 auto;
  text-align: right;
  font-size: 13px;
  color: var(--ink-soft);
  font-variant-numeric: tabular-nums;
}
.org-next-count b { color: var(--ink); font-weight: 600; }
.org-next-persons { color: var(--ink-mute); font-size: 12px; }
body.dark-mode .org-next-persons { color: var(--org-d-mute); }

/* ── HEADCOUNT TRACKER (detalj vjenčanja, O-F1) ─────────────────────── */
.wd-hc-note { font-size: 12px; color: var(--ink-mute); font-family: var(--font-sans); }
.wd-hc-track {
  position: relative;
  height: 12px;
  border-radius: 6px;
  background: var(--paper-2);
  overflow: visible;
  margin: 6px 0 10px;
}
.wd-hc-fill {
  display: block;
  height: 100%;
  border-radius: 6px;
  background: var(--portal-accent);
  opacity: 0.8;
  max-width: 100%;
}
/* Ugovoreni minimum kao okomita crta na skali — cilj, ne dekoracija. */
.wd-hc-min {
  position: absolute;
  top: -4px;
  bottom: -4px;
  width: 2px;
  background: var(--ink);
  border-radius: 1px;
}
.wd-hc-legend { font-size: 13.5px; color: var(--ink-soft); font-family: var(--font-sans); margin: 0 0 2px; }
.wd-hc-legend b { color: var(--ink); }
.wd-hc-trend { font-size: 12.5px; color: var(--ink-mute); font-family: var(--font-sans); margin: 0; }
.wd-hc-warn {
  display: inline-block;
  margin-top: 12px;
  padding: 10px 14px;
  border-radius: 10px;
  background: var(--badge-warning-bg, #f6ecd4);
  color: var(--badge-warning-fg, #8a6d1f);
  font-size: 13px;
  font-family: var(--font-sans);
  line-height: 1.5;
  max-width: 56ch;
}
body.dark-mode .wd-hc-track { background: var(--org-d-line); }
body.dark-mode .wd-hc-legend b { color: var(--org-d-head); }
body.dark-mode .wd-hc-min { background: var(--org-d-head); }

/* ── UPITI (inbox javne forme) ──────────────────────────────────────── */
/* N2/N3 dodatak (Iva runda 2, 2026-08-06): [data-action] vidljivost vozi
   ISKLJUČIVO `data-status` atribut retka — static/js/org-inquiries.js nakon
   uspješnog fetcha samo prepiše taj atribut, CSS ispod odlučuje koje su
   akcije vidljive. Jedan izvor pravila umjesto grananja u JS-u i predlošku. */
.org-inq-row {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 16px 20px;
  border-bottom: 1px solid var(--paper-2);
}
.org-inq-row:last-child { border-bottom: none; }
.org-inq-row[data-status="new"] { background: var(--portal-tint, rgba(244,229,214,0.4)); }
.org-inq-msg {
  display: block;
  margin: 8px 0 0;
  font-size: 13.5px;
  color: var(--ink);
  line-height: 1.55;
  max-width: 64ch;
}
/* Poruka > 160 znakova renderira kao <details class="org-inq-msg"> (N3 t.c):
   sažeto u <summary>, cijela poruka u <p> tek na otvaranje — bez JS-a. */
.org-inq-msg summary { cursor: pointer; }
.org-inq-msg summary::-webkit-details-marker { display: none; }
.org-inq-msg p { margin: 6px 0 0; }
.org-inq-contact { display: block; margin-top: 8px; font-size: 12.5px; }
.org-inq-contact a { color: var(--portal-accent); text-decoration: none; }
.org-inq-contact a:hover { text-decoration: underline; }
.org-inq-side {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
  max-width: 240px;
}
.org-inq-pill {
  font-size: 11.5px;
  color: var(--ink-mute);
  text-align: right;
  line-height: 1.4;
}
.org-inq-pill--new { color: var(--badge-warning-fg, #8a6d1f); font-weight: 600; }
.org-inq-actions { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
/* Sve četiri akcije su uvijek u DOM-u (SSR/no-JS ispravno); default sakrivene,
   po statusu otkrivene ispod. Redak sam ne bira vidljivost u Jinjau (D2). */
.org-inq-row [data-action] { display: none; }
.org-inq-row[data-status="new"] [data-action="contact"],
.org-inq-row[data-status="new"] [data-action="won"],
.org-inq-row[data-status="contacted"] [data-action="won"] { display: inline-flex; }
.org-inq-row[data-status="new"] [data-action="lost"],
.org-inq-row[data-status="contacted"] [data-action="lost"] { display: inline-block; }
.org-inq-row[data-status="closed"] [data-action="reopen"] { display: inline-flex; }
.org-inq-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 14px;
  min-height: 44px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--portal-accent) 45%, transparent);
  background: transparent;
  color: var(--portal-accent);
  font-family: var(--font-sans);
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  white-space: nowrap;
  transition: background var(--transition-fast, 180ms ease);
}
.org-inq-btn:hover { background: color-mix(in srgb, var(--portal-accent) 8%, transparent); }
.org-inq-btn--ghost { border-color: var(--ink-faint); color: var(--ink-mute); }
/* Tailwind-classe finding #30: gumb bez :disabled stila je "radi" i na klik
   ne radi ništa — ovdje boja/pozadina su autorske pa moramo eksplicitno. */
.org-inq-btn:disabled,
.org-inq-btn[aria-busy="true"] { opacity: .55; cursor: default; pointer-events: none; }
/* "Izgubljeno" — kompaktni picker usidren uz objekt (IK#2), NE modal i NE
   native confirm()/prompt(). <summary> nosi .org-inq-btn izgled; nativni
   trokutić maknut jer već izgleda kao gumb. */
.org-inq-lost summary { list-style: none; }
.org-inq-lost summary::-webkit-details-marker { display: none; }
.org-inq-lost-form {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
  padding: 10px;
  border-radius: 10px;
  background: var(--paper-2);
}
.org-inq-lost-label { font-size: 11.5px; color: var(--ink-mute); }
.org-inq-lost-form select {
  min-height: 44px;
  padding: 8px 10px;
  border-radius: 8px;
  border: 1px solid var(--ink-faint);
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-sans);
  font-size: 13px;
}
@media (max-width: 640px) {
  .org-inq-row { flex-wrap: wrap; }
  .org-inq-side { align-items: flex-start; max-width: none; width: 100%; }
  .org-inq-pill { text-align: left; }
  .org-inq-actions { justify-content: flex-start; }
  .org-inq-lost-form { width: 100%; }
}
body.dark-mode .org-inq-row { border-bottom-color: var(--org-d-line); }
body.dark-mode .org-inq-row[data-status="new"] { background: var(--org-d-card); }
body.dark-mode .org-inq-msg { color: var(--org-d-text); }
body.dark-mode .org-inq-lost-form { background: var(--org-d-card); }
body.dark-mode .org-inq-lost-form select {
  background: var(--org-d-bg);
  border-color: var(--org-d-line);
  color: var(--org-d-text);
}

/* ── OCCUPANCY HEATMAPA + CHAIN (kalendar, O-F2) ────────────────────── */
.org-heat-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.org-heat, .org-chain {
  border-collapse: collapse;
  font-family: var(--font-sans);
  font-size: 12px;
  min-width: 640px;
  width: 100%;
}
.org-heat th, .org-chain th {
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-mute);
  padding: 6px 4px;
  text-align: center;
}
.org-heat .org-heat-venue {
  text-align: left;
  font-size: 12.5px;
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
  color: var(--ink);
  padding-right: 12px;
  white-space: nowrap;
  max-width: 220px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.org-heat td { padding: 3px; text-align: center; }
.org-heat-cell {
  /* Dodirna meta: ćelija je poveznica koja NAVIGIRA, pa promašaj nije
     kozmetika. Flex + `min-height` drži 44 px bez ijednog piksela širine
     više (stupaca je dvanaest, širina je ovdje najskuplja). */
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  min-width: 40px;
  padding: 7px 4px;
  border-radius: 8px;
  font-variant-numeric: tabular-nums;
  color: var(--ink);
  /* M2-R2: ćelija je sad <a> (klik skace dan-mrezu na taj mjesec+dvoranu),
     ranije <span> — text-decoration mora ici eksplicitno ili UA link-stil
     (podcrtano, plavo) procuri kroz. */
  text-decoration: none;
  transition: box-shadow var(--transition-fast);
}
.org-heat-cell:hover, .org-heat-cell:focus-visible {
  box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--portal-accent) 55%, transparent);
  outline: none;
}
.org-heat-cell--free { background: var(--paper-2); color: var(--ink-faint); }
.org-chain td {
  padding: 10px 8px;
  text-align: center;
  border-top: 1px solid var(--paper-2);
  font-variant-numeric: tabular-nums;
  color: var(--ink);
}
.org-chain-name { text-align: left !important; white-space: nowrap; }
.org-chain-name a { color: var(--ink); text-decoration: none; font-weight: 500; }
.org-chain-name a:hover { color: var(--portal-accent); }
.org-chain-name span { color: var(--ink-mute); font-size: 11.5px; }
body.dark-mode .org-heat-cell { color: var(--org-d-head); }
body.dark-mode .org-heat-cell--free { background: var(--org-d-line); color: var(--org-d-mute); }
body.dark-mode .org-chain td { border-top-color: var(--org-d-line); color: var(--org-d-text); }
body.dark-mode .org-chain-name a { color: var(--org-d-head); }

/* ── KALENDAR KAPACITETA — dan-mreža + dan-kartica (M2, BRIEF_ORG_KALENDAR.md) ──
   Dan-ćelija nosi STATUS po dvorani (M2-R1), ne imena — identitet je iza
   klika, u sheetu (IK#1). "Sudar" (2+ vjenčanja isti venue_id+datum) dobiva
   amber/warning ton, reuse `--badge-warning-*` (isti par kao notifications.css
   "amber patina, not construction yellow"): sudar je "treba paznju, može se
   razriješiti" stanje, ne nepovratni gubitak — crveno ostaje rezervirano
   za to (DALIA_FRONTEND_STANDARD §d). Nema novog CSS fajla; ovo je isti
   fajl/ugovor kao ostatak org portala. */
.org-page-header-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.org-cal-month-label {
  font-family: var(--font-serif);
  font-size: 15px;
  color: var(--org-ink);
  padding: 0 2px;
  white-space: nowrap;
}
.org-cal-year-select { width: auto; min-width: 84px; flex: 0 0 auto; }

.org-card-note--block { display: block; margin-top: 10px; max-width: 64ch; }

/* N5: sezonski brojac (slobodne subote do kraja godine + sudari) — isti
   tihi registar kao `.odb-foot-note`/`.odb-foot-note.is-degraded`
   (org-dashboard.css:350-358): amber je isti par kao sudar niže, ne novi ton. */
.org-cal-season {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 10px;
  padding: 16px 20px 0;
  max-width: 62ch;
  font-size: 12.5px;
  color: var(--ink-mute);
}
.org-cal-season-warn { color: var(--badge-warning-fg); }

/* "Samo slobodni" (N5): isti `.org-filter-pill` izgled (reuse, ne nova
   obitelj), ali <button> toggle umjesto <a> — AND filtar preko venue OR
   filtra ("kako se leće slažu", DALIA_INTERACTION_CANON). Reset UA button
   defaulta da nasljeđeni font/padding ne procuri ispod `.org-filter-pill`. */
.org-cal-freeonly-toggle {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  /* `.org-filter-pill` zatečeno nosi 36px (repo-wide konvencija, drugi
     pill-ovi u istom retku); ovo je NOVI element pa dobiva punu dodirnu
     metu od početka (touch ≥44px), i uz malu visinsku razliku od susjeda. */
  min-height: 44px;
  font-family: inherit;
  appearance: none;
  -webkit-appearance: none;
}

.org-cal-grid-wrap { border: 1px solid var(--paper-2); border-radius: 12px; overflow: hidden; }
.org-cal-weekdays, .org-cal-week { display: grid; grid-template-columns: repeat(7, 1fr); }
.org-cal-weekdays { border-bottom: 1px solid var(--paper-2); }
.org-cal-weekday {
  padding: 8px 4px;
  text-align: center;
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-mute);
  font-family: var(--font-sans);
}
.org-cal-weekday--weekend { background: var(--paper-2); }
.org-cal-week:not(:last-child) { border-bottom: 1px solid var(--paper-2); }

/* `role="gridcell"` sjedi na OMOTAČU, ne na gumbu: uloga ćelije na
   `<button>` poništava ulogu gumba i čitač ekrana izgovori "ćelija" umjesto
   "gumb". Omotač je grid stavka, gumb je ono što se pritišće. */
.org-cal-cell-slot { display: flex; min-width: 0; }

/* Svaka ćelija je <button> (uvijek klikabilna, i prazan dan otvara sheet s
   "+ Novo vjencanje" CTA-om — jeftin način da D11-stil prazno stanje ne
   treba drugi markup, v. calendar.html openDaySheet). */
.org-cal-cell {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 76px;
  padding: 8px 4px;
  border: none;
  border-right: 1px solid var(--paper-2);
  background: var(--paper-soft);
  font-family: var(--font-sans);
  cursor: pointer;
  transition: background var(--transition-fast);
}
.org-cal-week .org-cal-cell-slot:last-child .org-cal-cell { border-right: none; }
.org-cal-cell:hover { background: var(--portal-tint); }
.org-cal-cell:focus-visible { outline: 2px solid var(--portal-accent); outline-offset: -2px; z-index: var(--z-content); position: relative; }
.org-cal-cell--empty { background: var(--paper-2); cursor: default; }
.org-cal-cell--weekend { background: var(--paper-2); }
.org-cal-cell--weekend:hover { background: var(--portal-tint); }
.org-cal-cell--today { outline: 2px solid var(--gold); outline-offset: -2px; }

.org-cal-daynum { font-size: 12px; color: var(--ink-mute); font-variant-numeric: tabular-nums; }
.org-cal-cell--today .org-cal-daynum { color: var(--gold); font-weight: 600; }

/* Chip nosi status — boja je jedini nositelj kad nema teksta (M2-R1: "ime
   nije potrebno na ovoj razini"), pa svaka varijanta ostaje čitljiva i bez
   teksta preko oblika/pozadine, ne samo preko riječi u njoj. */
.org-cal-chip {
  min-height: 22px;
  box-sizing: border-box;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: var(--ink-mute);
  background: transparent;
  white-space: nowrap;
}
.org-cal-chip--free, .org-cal-chip--agg-free { color: var(--ink-faint); }
/* Gradacija se čita iz PLOHE, tinta ostaje `--ink`. Obrtanje tinte na
   `--paper` iznad nekog postotka je tvornica kontrastnih padova: 75 % s
   bijelom tintom mjerilo je 2,54 : 1 (prag je 4,5), a uz `--past` 1,61 : 1.
   Na 40 % podloga je #ccb4a3 i `--ink` (#3f3138) daje 7,0 : 1; razlika
   partial/full ostaje vidljiva jer se mijenja ploha, a čip usto piše
   "3/5" i "5/5" (§e#26: stanje nosi imenicu, boja je treći signal). */
.org-cal-chip--agg-partial { background: color-mix(in srgb, var(--portal-accent) 22%, var(--paper)); color: var(--ink); }
.org-cal-chip--agg-full { background: color-mix(in srgb, var(--portal-accent) 40%, var(--paper)); color: var(--ink); }
.org-cal-chip--active { background: var(--status-active-bg); color: var(--status-active-text); }
.org-cal-chip--draft { background: var(--status-draft-bg); color: var(--status-draft-text); }
.org-cal-chip--completed { background: var(--status-completed-bg); color: var(--status-completed-text); }
.org-cal-chip--archived { background: var(--paper-2); color: var(--ink-mute); }
.org-cal-chip--conflict {
  background: var(--badge-warning-bg);
  color: var(--badge-warning-fg);
  border: 1px solid color-mix(in srgb, var(--badge-warning-fg) 45%, transparent);
}
/* Prošli dani i završena vjenčanja: prigušen ton, ne obrisano (brief "Model
   prikaza" — Irena treba i prošle datume za trend). Prošlost nosi PODLOGA,
   ne prozirnost: `opacity` dimi i plohu i tintu, pa svaka izmjerena
   vrijednost pada dvostruko (agregatni čip je uz `opacity: .55` padao na
   1,61 : 1). Ovako ostaje čitljiv, a i dalje je vidljivo tiši od tekućih. */
.org-cal-chip--past { background: transparent; color: var(--ink-mute); }

/* "Samo slobodni" (N5): isti uzor kao komentar iznad — PODLOGA nosi
   prigušenje, ne `opacity` (opacity dimi i plohu i tintu, mjerena vrijednost
   pada dvostruko). Dan koji ne odgovara filtru se ne skriva: geometrija
   mjeseca (redci/stupci, orijentacija) ostaje ista, samo se stiša. */
.org-cal-grid-wrap.is-free-only .org-cal-cell[data-date]:not([data-status="free"]) {
  background: var(--paper-2);
}
.org-cal-grid-wrap.is-free-only .org-cal-cell[data-date]:not([data-status="free"]) .org-cal-chip {
  background: transparent;
  color: var(--ink-faint);
}

.org-cal-legend { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 14px; font-size: 11px; color: var(--ink-mute); font-family: var(--font-sans); }
.org-cal-legend span { display: inline-flex; align-items: center; gap: 6px; }
.org-cal-legend-dot { width: 12px; height: 12px; border-radius: 4px; display: inline-block; }

/* D12: prazan red (dvorana bez ijedne rezervacije 12 mj unaprijed) ide na
   vrh za org_admin s >1 dvoranom, s ovom oznakom — isti amber par kao sudar
   iznad, ovdje znači "traži pažnju", ne "greška". */
.org-heat-attention {
  display: inline-block;
  margin-left: 8px;
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--badge-warning-bg);
  color: var(--badge-warning-fg);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.02em;
  vertical-align: middle;
}

/* JS retrigger na filtar-promjenu (M2-R2 motion plan: dpFadeIn, content
   tier) — isti poziv-obrazac kao `.org-tab-panel` iznad, nema novog keyframea. */
.org-cal-refresh { animation: dpFadeIn 240ms var(--ease) both; }

/* ── Dan-kartica (sheet, M2-R3) — isti obrazac kao `.vd-sheet`
   (vendor-discovery.css:351-453, DALIA_FRONTEND_STANDARD §c): ladica s dna
   na mobitelu, centrirani dijalog >=769px, grab-ručka, safe-area u
   podnožju, zatvaranje 44x44, z-index iz registra. Org-scoped klase, ne
   osmi modal — isti ugovor, drugi portal. */
.org-cal-sheet-backdrop {
  position: fixed;
  inset: 0;
  z-index: var(--z-sheet-backdrop);
  /* Scrim je ploha i mora biti u paleti (VISUAL_CANON §3: nijedna nova
     površina ne uzima vlastitu `rgba(...)`). `--lb-*` obitelj je LOKALNA za
     `#cg-lb` i živi u `lightbox.css`, koji org ljuska ne učitava, pa se
     preuzima njezina konstrukcija a ne njezino ime: veo je `--ink` s alfom,
     točno kao `--lb-veil` / `--lb-veil-2`, samo gušći jer ovo je ladica
     preko cijelog ekrana. Nula sirovih boja i nula novih tokena. */
  background: color-mix(in srgb, var(--ink) 42%, transparent);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  opacity: 0;
  transition: opacity 220ms var(--ease);
}
.org-cal-sheet-backdrop.is-open { opacity: 1; }
.org-cal-sheet-backdrop[hidden] { display: none; }

.org-cal-sheet {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: var(--z-sheet);
  max-height: min(84vh, 640px);
  display: flex;
  flex-direction: column;
  background: var(--paper);
  border-radius: 22px 22px 0 0;
  box-shadow: var(--shadow-lg);
  padding-bottom: env(safe-area-inset-bottom, 0);
  transform: translateY(100%);
  transition: transform 280ms var(--ease);
}
.org-cal-sheet.is-open { transform: translateY(0); }
.org-cal-sheet[hidden] { display: none; }
body.dark-mode .org-cal-sheet { background: var(--org-d-card); }

.org-cal-sheet-grab { width: 40px; height: 4px; margin: 10px auto 2px; border-radius: 999px; background: var(--paper-2); flex: 0 0 auto; }
.org-cal-sheet-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 18px 12px; flex: 0 0 auto; }
.org-cal-sheet-head h3 { font-family: var(--font-serif); font-weight: 500; font-size: 18px; color: var(--org-ink); }
.org-cal-sheet-close {
  flex: 0 0 auto;
  width: 44px; height: 44px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 0; border-radius: 999px;
  background: transparent;
  color: var(--ink-mute);
  font-size: 22px; line-height: 1;
  cursor: pointer;
}
.org-cal-sheet-close:hover { background: var(--paper-2); color: var(--org-ink); }
.org-cal-sheet-body { flex: 1 1 auto; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 0 18px 12px; }
.org-cal-sheet-foot {
  flex: 0 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
  padding: 12px 18px calc(12px + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid var(--paper-2);
  background: var(--paper);
}
body.dark-mode .org-cal-sheet-foot { background: var(--org-d-card); border-top-color: var(--org-d-line); }

/* Drugi potez u podnožju (N5) — isti "ghost" par kao `.org-inq-btn--ghost`
   (§c reuse): `.org-page-action` je akcentirani primarni izgled, ova
   modifikator-klasa ga stišava za sekundarni potez pored njega. */
.org-page-action--ghost {
  color: var(--ink-mute);
  border-color: var(--ink-faint);
  background: transparent;
}
.org-page-action--ghost:hover {
  color: var(--ink);
  border-color: var(--ink-mute);
  background: var(--paper-2);
}
/* `.org-page-action` postavlja `display: inline-flex` na klasi (0,1,0), ista
   specifičnost kao UA `[hidden] { display: none }` — bez ID pravila gumb
   ostaje vidljiv unatoč `hidden` atributu (isti gotcha zbog kojeg
   `.org-cal-sheet[hidden]`/`.org-cal-sheet-backdrop[hidden]` iznad postoje). */
#orgCalSheetCopyLink[hidden] { display: none; }

.org-cal-sheet-group { margin-bottom: 16px; }
.org-cal-sheet-group-head { font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-mute); margin-bottom: 6px; }
.org-cal-sheet-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 48px;
  padding: 8px 10px;
  border-radius: 10px;
  text-decoration: none;
  transition: background var(--transition-fast);
}
.org-cal-sheet-row:hover { background: var(--paper-2); }
.org-cal-sheet-row-main { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; min-width: 0; }
.org-cal-sheet-row-name { font-family: var(--font-serif); font-size: 15px; color: var(--org-ink); }
/* "jedan izlaz dublje" (M2-R1 brief) — vidljiv na dodir, ne golo čekanje
   klika na cijeli redak (IK#1: otkrivanje daje karticu S izlazom, ne samo
   implicitni link). aria-hidden jer red je već <a> s dostupnim imenom iz
   imena+statusa; ponavljanje "Otvori vjencanje" na svakom retku bilo bi buka
   za čitač ekrana. */
.org-cal-sheet-row-exit {
  flex: 0 0 auto;
  font-size: 12px;
  color: var(--ink-mute);
  white-space: nowrap;
  opacity: 0;
  transition: opacity var(--transition-fast);
}
.org-cal-sheet-row:hover .org-cal-sheet-row-exit,
.org-cal-sheet-row:focus-visible .org-cal-sheet-row-exit { opacity: 1; color: var(--portal-accent); }
@media (hover: none) {
  /* Touch parnjak (IK#9): bez hover-a izlaz mora biti vidljiv od početka,
     ne samo na prst koji zadrži. */
  .org-cal-sheet-row-exit { opacity: 0.7; }
}
/* Dvije klase u selektoru: prazno stanje u ladici mora nadjačati bazni
   padding `.org-empty` obitelji koja je u ovom fajlu niže. */
.org-empty.org-cal-sheet-empty { padding: 32px 8px; }

@media (min-width: 769px) {
  .org-cal-sheet {
    left: 50%; right: auto; bottom: auto; top: 50%;
    width: min(480px, 92vw);
    border-radius: 18px;
    transform: translate(-50%, -46%);
    opacity: 0;
    transition: transform 240ms var(--ease), opacity 240ms var(--ease);
  }
  .org-cal-sheet.is-open { transform: translate(-50%, -50%); opacity: 1; }
}

@media (max-width: 480px) {
  .org-cal-cell { min-height: 60px; padding: 6px 2px; gap: 4px; }
  .org-cal-chip { font-size: 10px; padding: 2px 6px; }
  .org-cal-weekday { font-size: 9px; padding: 6px 2px; }
  /* Mreža izlazi iz padinga kartice. Izmjereno: uz `.org-main` 16 px i
     `.org-card-body` 20 px dan-ćelija je 45,4 px na 390 px i 43,3 px na
     375 px (iPhone SE, 13 mini), dakle ispod poda od 44 na uređaju koji
     nije rijedak. Bez padinga: 49,4 px na 390 i 45,1 px na 360. Rub
     kartice se ovdje gubi jer ga preuzima rub same mreže. */
  .org-cal-grid-wrap {
    margin-inline: -14px;
    border-radius: 0;
    border-left: 0;
    border-right: 0;
  }
}

/* ── NOVO VJENČANJE — sudar termina (M2-R3a, wedding_new.html) ──
   Četiri stanja AJAX provjere: prazno (nema poziva), učitavanje (siva
   napomena ispod polja), greška (mrežni pad, honest fallback na server-side
   re-provjeru), uspjeh (bilo "termin slobodan" bilo amber upozorenje).
   Isti amber par kao kalendarska dan-ćelija (`.org-cal-chip--conflict`
   iznad) — sudar je "treba pažnju", ne nepovratni gubitak. */
.wiz-date-check-status {
  display: block;
  margin-top: 6px;
  font-size: 12px;
  color: var(--ink-mute);
  font-family: var(--font-sans);
  min-height: 16px;
}
.wiz-conflict-warn {
  margin-top: 10px;
  padding: 12px 14px;
  border-radius: 10px;
  background: var(--badge-warning-bg);
  border: 1px solid color-mix(in srgb, var(--badge-warning-fg) 35%, transparent);
}
.wiz-conflict-warn[hidden] { display: none; }
.wiz-conflict-msg {
  margin: 0 0 8px;
  font-size: 13px;
  line-height: 1.5;
  color: var(--badge-warning-fg);
  max-width: 52ch;
}
.wiz-conflict-confirm {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  font-size: 13px;
  font-family: var(--font-sans);
  color: var(--badge-warning-fg);
  cursor: pointer;
}
.wiz-conflict-confirm input { width: 18px; height: 18px; flex-shrink: 0; }

/* ── EMPTY STATE (topao, konkretan, s prvim korakom) ──────────────────
   JEDNA obitelj praznog stanja po ovom portalu. Do 6.8.2026. su ovdje
   živjela tri centrirana pravila, a nova početna je pokraj njih otvorila
   punu paralelnu obitelj (`.odb-empty*`, org-dashboard.css) — dvije
   obitelji za istu stvar u istom valu. Obitelj je preseljena ovamo i
   preimenovana; centriranje (`text-align: center`, `margin: 0 auto`) je
   ispalo jer izvršni ekran čita lijevo poravnato, s mjerom retka.

   Kanonska `.dp-empty` (dalia-portal.css) NIJE uzeta namjerno: centrirana
   je, isprekidana i lila, dakle signature ploha, a ovo su radne površine.
   Redak o tome stoji u DALIA_FRONTEND_STANDARD §e#5.

   Ton: jedna akcija, tiha alternativa je tekst a ne drugi gumb (dvaput isti
   odgovor u istom stanju je tautologija). */
.org-empty { padding: 20px 20px 18px; }
/* Unutar `.org-card-body` ploha već nosi svoj rub, pa se paddingi ne
   zbrajaju. Prazno stanje stoji u kartici i s tijelom i bez njega. */
.org-card-body .org-empty { padding: 8px 0 4px; }
.org-empty-title {
  font-family: var(--font-serif);
  font-size: 20px;
  color: var(--ink);
  margin: 0 0 8px;
}
/* `.org-empty-sub` je zatečeno ime istog retka (weddings_list.html,
   upiti.html). Dijeli pravilo umjesto da nosi svoje dok se ne preimenuje. */
.org-empty-line,
.org-empty-sub {
  margin: 0;
  max-width: 52ch;
  font-size: 14px;
  line-height: 1.6;
  color: var(--ink-soft);
}
.org-empty-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 18px;
  margin-top: 18px;
}
.org-empty-alt {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--portal-accent);
  font-size: 13.5px;
  text-decoration: none;
}
.org-empty-alt:hover { text-decoration: underline; }
.org-empty-note {
  margin: 14px 0 0;
  max-width: 52ch;
  font-size: 12.5px;
  color: var(--ink-mute);
}

/* ── MJESEČNA TABLICA I ĆELIJE TABLICE (kalendar) ─────────────────────
   Klase umjesto `style=""` na kartici, tijelu i trima ćelijama. Ništa se
   ne mijenja vizualno; mijenja se samo gdje pravilo živi. */
.org-card--stacked { margin-top: 16px; }
.org-card-body--flush { padding-top: 0; }
/* `.org-main` u selektoru nije ukras: `.data-table td` (form_styles.html)
   je `(0,1,1)` i dolazi kasnije u dokumentu, pa bi golu klasu nadjačao. */
.org-main .org-cell-name {
  font-family: var(--font-serif);
  font-size: 15px;
  color: var(--org-ink);
  text-decoration: none;
}
.org-main .org-cell-name:hover { text-decoration: underline; }
.org-main .org-cell-meta {
  font-family: var(--font-sans);
  font-size: 13px;
  color: var(--ink-mute);
}
.org-main .org-cell-meta--nowrap { white-space: nowrap; }
.org-main th.org-th--left { text-align: left; }

/* Treći prikaz istog skupa na istoj stranici (dan-mreža ga nosi iznad,
   dan-kartica nosi imena), pa stoji sklopljen: tko iz njega kopira u mail
   otvori jednim klikom, tko odgovara na pitanje "je li 14. slobodan" ga ne
   mora prelistati. Ljetva je dodirna meta, otud 44 px. */
.org-cal-monthly > summary {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 10px 20px;
  cursor: pointer;
  list-style: none;
  font-family: var(--font-serif);
  font-size: 17px;
  color: var(--ink);
}
.org-cal-monthly > summary::-webkit-details-marker { display: none; }
.org-cal-monthly > summary:focus-visible { outline: 2px solid var(--portal-accent); outline-offset: -2px; }
.org-cal-monthly-count { font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); }

/* ── KAPARA (wedding_detail.html, M3-R4) ───────────────────────────────
   Pet deklaracija koje su bile `style=""` u najgušćem operativnom ekranu
   portala (§e#10). Ista mjera, drugo mjesto. */
.org-deposit {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--ivory);
}
.org-deposit-line {
  margin: 0;
  font-family: var(--font-sans);
  font-size: 13px;
  color: var(--charcoal);
}
.org-deposit-wait {
  margin: 0;
  font-family: var(--font-sans);
  font-size: 13px;
  color: var(--stone);
}
/* Samo dodirna meta: `inline-flex` i centriranje gumb već ima iz
   `.btn-primary` (components/form_styles.html). */
.org-deposit-btn { min-height: 44px; }
/* Neuspjelo spremanje je stanje koje se ponavlja klikom, ne gubitak:
   crveno ostaje rezervirano za nepovratno (mikro-prolaz #2). */
.org-deposit-error {
  display: none;
  margin: 8px 0 0;
  font-family: var(--font-sans);
  font-size: 12px;
  color: var(--badge-warning-fg);
}
.org-deposit-error.is-shown { display: block; }

/* ── DARK MODE ──────────────────────────────────────────────────────── */
body.dark-mode .org-layout { background: var(--org-d-bg); }
body.dark-mode .org-main { color: var(--org-d-text); }
body.dark-mode .org-sidebar {
  background: var(--org-d-bg);
  border-right-color: var(--org-d-line);
}
body.dark-mode .org-sidebar-header,
body.dark-mode .org-sidebar-bottom { border-color: var(--org-d-line); }
body.dark-mode .org-nav { color: var(--org-d-text); }
body.dark-mode .org-nav-zona { color: var(--org-d-mute); }
body.dark-mode .org-nav:hover,
body.dark-mode .org-nav.is-active { background: var(--org-d-card); }
body.dark-mode .org-user-chip:hover { background: var(--org-d-card); }
body.dark-mode .org-user-name { color: var(--org-d-head); }
body.dark-mode .org-user-avatar { background: var(--org-d-card); }
body.dark-mode .org-profile-menu { background: var(--org-d-card); border-color: var(--org-d-line); }
body.dark-mode .org-profile-item { color: var(--org-d-text); }
body.dark-mode .org-profile-item:hover { background: var(--org-d-line); }
body.dark-mode .org-profile-divider { background: var(--org-d-line); }
body.dark-mode .org-topbar { background: color-mix(in srgb, var(--org-d-bg) 92%, transparent); border-bottom-color: var(--org-d-line); }
body.dark-mode .org-topbar-btn { color: var(--org-d-text); }
body.dark-mode .org-drawer { background: var(--org-d-bg); border-left-color: var(--org-d-line); }
body.dark-mode .org-drawer-head { border-bottom-color: var(--org-d-line); }
body.dark-mode .org-page-title { color: var(--org-d-head); }
body.dark-mode .org-kpi,
body.dark-mode .org-card {
  background: var(--org-d-card);
  border-color: var(--org-d-line);
}
body.dark-mode .org-kpi-num,
body.dark-mode .org-stat-num,
body.dark-mode .org-card-title,
body.dark-mode .org-next-names,
body.dark-mode .org-next-date b,
body.dark-mode .org-bar-num,
body.dark-mode .org-empty-title { color: var(--org-d-head); }
body.dark-mode .org-tabs { background: var(--org-d-card); }
body.dark-mode .org-tab.is-active { background: var(--org-d-line); color: var(--org-d-head); }
body.dark-mode .org-tab { color: var(--org-d-mute); }
body.dark-mode .org-stat,
body.dark-mode .org-filter-pill { border-color: var(--org-d-line); }
body.dark-mode .org-filter-pill { color: var(--org-d-mute); }
body.dark-mode .org-filter-pill.is-active { background: var(--org-d-line); color: var(--org-d-head); }
body.dark-mode .org-next-row { border-bottom-color: var(--org-d-line); }
body.dark-mode .org-next-row:hover { background: var(--org-d-line); }
body.dark-mode .org-bar-row + .org-bar-row { border-top-color: var(--org-d-line); }
body.dark-mode .org-bar-track { background: var(--org-d-line); }
body.dark-mode .org-next-count b { color: var(--org-d-head); }
/* Prazno stanje i ćelije tablice: ista obitelj, dvije teme, jedno mjesto. */
body.dark-mode .org-empty-line,
body.dark-mode .org-empty-sub,
body.dark-mode .org-cell-meta { color: var(--org-d-text); }
body.dark-mode .org-empty-note { color: var(--org-d-mute); }
body.dark-mode .org-cell-name,
body.dark-mode .org-cal-monthly > summary { color: var(--org-d-head); }
body.dark-mode .org-cal-monthly-count { color: var(--org-d-mute); }
body.dark-mode .org-deposit { border-top-color: var(--org-d-line); }
body.dark-mode .org-deposit-line { color: var(--org-d-head); }
body.dark-mode .org-deposit-wait { color: var(--org-d-mute); }

/* ── REDUCED MOTION ─────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .org-kpi, .org-tab-panel { animation: none; }
  .org-kpi:hover { transform: none; }
  /* M2 kalendar (dan-kartica sheet + filtar retrigger) — isti obrazac kao
     .vd-sheet RM grana (vendor-discovery.css:761-767). */
  .org-cal-sheet, .org-cal-sheet-backdrop, .org-cal-cell, .org-cal-sheet-row,
  .org-heat-cell { transition: none; }
  .org-cal-refresh { animation: none; }
  @media (min-width: 769px) { .org-cal-sheet { opacity: 1; } }
}

/* Mobile: horizontalni scroll za siroke tablice. Wrapper NE forsira
   min-width, pa uske tablice ostaju netaknute na desktopu; siroke dobiju
   scroll umjesto da razvuku stranicu. */
.table-scroll { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* ═══════════════════════════════════════════════════════════════════════
   TLOCRT EKRANI — mobitel i tamni način (presuda §5, koraci 8 i 9)
   Kanon: docs/rasmus/RASMUS_TLOCRT_LJUSKA_PRESUDA.md
   ═══════════════════════════════════════════════════════════════════════

   ── Zašto TOKENI, a ne `body.dark-mode .nešto { background: … }` ──
   Kartica dvorane i kartice predložaka su naslijeđeni ekrani s inline
   `style=` atributima. Inline pravilo nadjačava svaki selektor bez
   `!important`, pa dark blok „odozgo" na njima fizički ne može raditi —
   izmjereno: 8 literalnih `background:white` u `venue_layout.html` i 3 u
   `layout_templates.html`, nula `var(--paper*)`.

   Zato tri semantička tokena i JEDNA zamjena u inline vrijednosti
   (`white` → `var(--org-surface)`). To je isti potez koji ova datoteka već
   radi na `--gold` (redak 22, „token re-anchor"), samo u drugom smjeru.

   NE re-anchoramo `--warm-black` globalno, iako bi to bilo kraće: na ovim
   ekranima ista varijabla nosi DVA posla — tintu na bijeloj kartici
   (`color:var(--warm-black)`) i TAMNU PLOHU AI trake
   (`background:var(--warm-black)`, venue_layout.html:131). Preokrenuti je
   značilo bi posvijetliti plohu koja mora ostati tamna. Zato tinta dobiva
   vlastito ime, a ploha zadržava staro.

   Zatečeni kvar koji ovo gasi: `--stone` u tamnom načinu postaje #aa8f9d
   (light-muted, design_tokens.html:521) — ispravno NA TAMNOJ podlozi, a na
   bijeloj kartici koja se nikad nije preokrenula daje ~2,9:1, ispod AA.
   Popravak nije stone nego bijela ispod njega. */
.portal-theme-org {
  --org-surface: #ffffff;              /* ploha kartice */
  --org-line: var(--ivory);            /* rub kartice / razdjelnik */
  --org-ink: var(--warm-black);        /* tinta naslova i brojki NA plohi */
}
body.dark-mode .portal-theme-org {
  --org-surface: var(--org-d-card);
  --org-line: var(--org-d-line);
  --org-ink: var(--org-d-head);
}

/* ── Kartica dvorane: letva + platno (korak 8) ──
   Do 2.8.2026 je ovo bio inline `grid-template-columns:260px 1fr` s NULA
   `@media` upita. Na 390 px širokom telefonu (minus 32 px paddinga = 358 px)
   letva je uzimala 260 px, platnu ostajalo 78 px — tlocrt sale u širini
   palca. Sad se u jednom stupcu letva slaže IZNAD platna: predlošci i raspon
   mjesta su odluke koje se donose prije nego što se gleda crtež. */
.vl-grid {
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 20px;
  align-items: start;
}
.vl-col { display: flex; flex-direction: column; gap: 16px; }

/* Red radnji na kartici predloška. Pet meta u redu (Uredi · Kopiraj · ★ ·
   katalog · ✕) živjelo je na `padding:6px` + 11 px fontu ≈ 24 px visine, s
   BRISANJEM među njima — na dodir je to promašaj koji briše predložak.
   IK#9 traži 44 px; ne diramo desktop gustoću, samo dodir. */
.tpl-actions { display: flex; gap: 6px; flex-wrap: wrap; }

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

  /* Brisanje ide u NOVI red, odvojeno od radnji koje se ne mogu poništiti
     krivo. Razmak je jedina obrana koju dodir ima. */
  .tpl-actions > form:last-child { margin-left: auto; }
  .tpl-actions button,
  .tpl-actions a {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
  }
}

/* Prazno stanje predložaka koristi kanonsku `.empty-state` obitelj iz
   dalia-portal.css; ondje su definirani `-title`/`-sub`, a goli `<h3>`/`<p>`
   nemaju nijedno pravilo. */
body.dark-mode .portal-theme-org .empty-state-title { color: var(--org-d-head); }
body.dark-mode .portal-theme-org .empty-state-sub { color: var(--org-d-mute); }

/* ── PLOČA DVORANE · povratak na prethodni raspored ────────────────────────
   Ulaz u `POST /organizator/venue/<id>/tlocrt/vrati`
   (docs/briefs/BRIEF_ORG_PROSTORI.md P0-1). Sjedi u dnu trake postava, ispod
   kartica: to je poništavanje poteza „Primijeni", pa stoji uz njega.

   Pravila žive OVDJE, a ne u `<style>` bloku predloška: taj blok se po
   FRONTEND_STANDARD §d ne širi novim pravilima. Imena su `.vlb-*` kao ostatak
   ploče, pa se dva izvora ne razilaze u rječniku.

   Ton je tih namjerno: gumb ne obećava spektakl i nije primarni CTA ekrana
   (to je „Primijeni" na otvorenoj kartici). Meta je 44 px i na mišu, jedna
   mjera, bez iznimke (IK#9). */
.vlb-tray-restore form { margin: 0; }
.vlb-tray-restore {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--org-line);
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: flex-start;
}
.vlb-restore-btn {
  min-height: 44px;
  padding: 0 16px;
  background: none;
  border: 1px solid var(--org-line);
  color: var(--org-ink);
  font-family: var(--font-sans);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  cursor: pointer;
  transition: border-color 0.2s var(--ease), color 0.2s var(--ease);
}
.vlb-restore-btn:hover { border-color: var(--gold); color: var(--gold); }
.vlb-restore-btn:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
/* Mjera retka: rečenica ispod gumba je objašnjenje, ne natpis. */
.vlb-tray-restore-note {
  margin: 0;
  max-width: 52ch;
  font-family: var(--font-sans);
  font-size: 11px;
  line-height: 1.5;
  color: var(--stone);
}

/* ═══════════════════════════════════════════════════════════════════════
   JELOVNICI — katalog + masovni unos (N7, 2026-08-06)
   Nalog: docs/cx/IVA_DIREKTORICA_RUNDA2_NALOZI.md #N7.

   Selidba iz templates/organizator/menu_catalog.html inline <style>: isti
   potez kao "PLOČA DVORANE" iznad — pravila žive ovdje, predložak se ne
   širi novim <style> blokom (FRONTEND_STANDARD §d).

   Masovni unos (jm-additem-*): jedan obrazac, N redaka, jedan submit
   umjesto N reloada (org-menu-batch.js). Prvi redak je server-rendered i
   radi bez JS-a — isto ponašanje kao stari jednoredni obrazac.
   ═══════════════════════════════════════════════════════════════════════ */
.jm-head { padding: 36px 0 20px; }
.jm-title { font-family: var(--font-serif); font-size: 30px; font-weight: 500; color: var(--warm-black); margin: 0 0 6px; }
.jm-sub { font-family: var(--font-sans); font-size: 14px; color: var(--stone); font-weight: 300; max-width: 640px; }
.jm-panel { background: white; box-shadow: 0 2px 12px rgba(44,44,44,0.06); padding: 20px 24px; margin-bottom: 24px; border-radius: 12px; }
.jm-panel-label { font-size: 9px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--stone); margin-bottom: 12px; font-family: var(--font-sans); font-weight: 600; }
.jm-field { padding: 9px 12px; border: 1px solid var(--ivory); border-radius: 7px; font-family: var(--font-sans); font-size: 13px; color: var(--charcoal); outline: none; }
.jm-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 18px; }
.jm-card { background: white; box-shadow: 0 2px 12px rgba(44,44,44,0.06); border-radius: 12px; overflow: hidden; }
.jm-card.is-inactive { opacity: 0.6; }
.jm-card-head { padding: 16px 18px; border-bottom: 1px solid var(--ivory); }
.jm-card-name { font-family: var(--font-serif); font-size: 17px; color: var(--warm-black); }
.jm-card-meta { font-family: var(--font-sans); font-size: 12px; color: var(--stone); margin-top: 4px; }
.jm-course { font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--gold); font-family: var(--font-sans); }
.jm-item { padding: 8px 18px; border-bottom: 1px solid var(--cream); display: flex; justify-content: space-between; gap: 10px; align-items: flex-start; }
.jm-item-name { font-family: var(--font-sans); font-size: 13px; color: var(--charcoal); }
.jm-item-alrg { font-size: 11px; color: var(--stone); font-weight: 300; }
.jm-btn-x { background: none; border: none; color: var(--danger); cursor: pointer; font-size: 12px; }
.jm-additem-d > summary { padding: 10px 18px; cursor: pointer; font-family: var(--font-sans); font-size: 12px; letter-spacing: 0.04em; color: var(--gold); background: var(--cream); list-style: none; user-select: none; }
.jm-additem-d > summary::-webkit-details-marker { display: none; }
.jm-additem-d[open] > summary { padding-bottom: 0; }

/* ── Masovni unos: redci (N7) ──
   `.jm-additem` je sad kontejner cijelog obrasca (redci + akcije), ne više
   jedan flex-red — sadržaj koji je nekad bio direktno u njemu sad je u
   `.jm-additem-rows`. Svaki redak nasljeđuje `.jm-field` za input/select pa
   se izgled polja ne duplicira. */
.jm-additem { padding: 12px 18px; background: var(--cream); }
.jm-additem-rows { display: flex; flex-direction: column; gap: 8px; }
.jm-additem-row { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.jm-additem-course { flex: 0 1 100px; min-width: 92px; }
.jm-additem-name { flex: 1 1 140px; min-width: 120px; }
.jm-additem-allergens { flex: 1 1 100px; min-width: 90px; }
/* Nova komponenta (nije zatečena) → puna mjera dodira od početka (IK#9,
   FRONTEND_STANDARD §d touch ≥44px), za razliku od `.jm-btn-x` iznad koje
   je samo preseljen zatečeni kod bez promjene mjere. */
.jm-additem-remove {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
  background: none;
  border: none;
  border-radius: 8px;
  color: var(--danger);
  font-size: 16px;
  cursor: pointer;
  transition: background var(--transition-fast);
}
.jm-additem-remove:hover { background: var(--ivory); }
.jm-additem-remove:focus-visible { outline: 2px solid var(--gold); outline-offset: -2px; }
.jm-additem-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin-top: 10px; }
.jm-additem-add {
  min-height: 44px;
  padding: 0 14px;
  background: none;
  border: 1px dashed var(--ivory);
  border-radius: 8px;
  color: var(--gold);
  font-family: var(--font-sans);
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: 0.02em;
  cursor: pointer;
  transition: border-color var(--transition-fast), color var(--transition-fast);
}
.jm-additem-add:hover { border-color: var(--gold); }
.jm-additem-add:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }

/* ── Tamni način ──
   `.jm-panel`/`.jm-card` su zatečeno `background:white` (literal, ne
   token) — na tamnoj podlozi ostaju bijele plohe, a `--stone` (koji SE
   gasi na tamno, design_tokens.html body.dark-mode) na njima pada na
   ~2,9:1 (isti kvar kao "PLOČA DVORANE" komentar iznad). Popravak je isti
   obrazac kao svaki `.org-*` widget u ovom fajlu: ploha prati temu preko
   `--org-d-*`, tekst onda opet čita ispravno na njoj — ne novi mehanizam. */
body.dark-mode .jm-panel,
body.dark-mode .jm-card { background: var(--org-d-card); box-shadow: none; }
body.dark-mode .jm-card-head,
body.dark-mode .jm-item { border-bottom-color: var(--org-d-line); }
body.dark-mode .jm-title,
body.dark-mode .jm-card-name,
body.dark-mode .jm-item-name { color: var(--org-d-head); }
body.dark-mode .jm-sub,
body.dark-mode .jm-panel-label,
body.dark-mode .jm-card-meta,
body.dark-mode .jm-item-alrg { color: var(--org-d-mute); }
body.dark-mode .jm-additem,
body.dark-mode .jm-additem-d > summary { background: var(--org-d-line); }
body.dark-mode .jm-field {
  background: var(--org-d-card);
  border-color: var(--org-d-line);
  color: var(--org-d-text);
}
body.dark-mode .jm-additem-add { border-color: var(--org-d-line); }
body.dark-mode .jm-additem-remove:hover { background: var(--org-d-line); }
