/* =========================================================
   asistent.chat — dizajn sistem
   Sve je prefiksovano sa .ac / --ac- da ne dira temu sajta.
   ========================================================= */

.ac, .ac-auth {
  --ac-font: -apple-system, BlinkMacSystemFont, "Inter", "Segoe UI", Roboto, sans-serif;
  --ac-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  /* Samo za logotip — jedan rez, jedno mesto. */
  --ac-brand: "Schibsted Grotesk", "Inter", "Segoe UI", system-ui, sans-serif;

  --ac-1:4px; --ac-2:8px; --ac-3:12px; --ac-4:16px; --ac-5:20px;
  --ac-6:24px; --ac-8:32px; --ac-10:40px; --ac-12:48px; --ac-16:64px;

  --ac-r-sm:6px; --ac-r-md:8px; --ac-r-lg:10px; --ac-r-xl:14px;

  --ac-bg:#ffffff; --ac-bg-subtle:#fafafa; --ac-bg-inset:#f4f4f5;
  --ac-surface:#ffffff; --ac-surface-hover:#f7f7f8;
  --ac-border:#ebebeb; --ac-border-strong:#dcdcdc;
  --ac-fg:#171717; --ac-fg-2:#4d4d4d; --ac-muted:#71717a; --ac-disabled:#a1a1aa;
  --ac-accent:#b4552f; --ac-accent-hover:#9a4526; --ac-accent-soft:#fbf0e9; --ac-accent-border:#f0d7c6;
  --ac-ok:#0f9d58; --ac-ok-soft:#e8f6ee;
  --ac-warn:#c47f16; --ac-warn-soft:#fdf5e3;
  --ac-err:#dc2626; --ac-err-soft:#fdeeee;
  --ac-info:#2563eb; --ac-info-soft:#eef4ff;

  --ac-sh-card:0 0 0 1px var(--ac-border), 0 1px 2px rgba(0,0,0,.04);
  --ac-sh-hover:0 0 0 1px var(--ac-border-strong), 0 4px 12px rgba(0,0,0,.06);
  --ac-sh-pop:0 0 0 1px var(--ac-border), 0 6px 16px rgba(0,0,0,.08);
  --ac-sh-modal:0 0 0 1px var(--ac-border), 0 12px 24px -6px rgba(0,0,0,.10), 0 24px 48px -12px rgba(0,0,0,.12);
  --ac-ring:0 0 0 3px rgba(110,86,207,.20);

  --ac-ease:cubic-bezier(.16,1,.3,1);
  --ac-fast:120ms; --ac-base:200ms; --ac-slow:300ms;

  font-family: var(--ac-font);
  font-size: 14px;
  line-height: 1.5;
  color: var(--ac-fg);
  -webkit-font-smoothing: antialiased;
}

.ac.ac-dark {
  --ac-bg:#08090a; --ac-bg-subtle:#0f1011; --ac-bg-inset:#141516;
  --ac-surface:#0f1011; --ac-surface-hover:#18191b;
  --ac-border:#232427; --ac-border-strong:#33353a;
  --ac-fg:#f7f8f8; --ac-fg-2:#d0d6e0; --ac-muted:#8a8f98; --ac-disabled:#5c6169;
  --ac-accent:#e08a5f; --ac-accent-hover:#eb9d74; --ac-accent-soft:#2a1a12; --ac-accent-border:#4a2f22;
  --ac-ok:#3dd68c; --ac-ok-soft:#10241a;
  --ac-warn:#e5a44a; --ac-warn-soft:#241d10;
  --ac-err:#f16a6a; --ac-err-soft:#2a1414;
  --ac-info:#6ba3f5; --ac-info-soft:#101a2e;
  --ac-sh-card:0 0 0 1px var(--ac-border);
  --ac-sh-hover:0 0 0 1px var(--ac-border-strong);
  --ac-sh-pop:0 0 0 1px var(--ac-border), 0 8px 24px rgba(0,0,0,.5);
  --ac-sh-modal:0 0 0 1px var(--ac-border), 0 16px 48px rgba(0,0,0,.6);
  --ac-ring:0 0 0 3px rgba(159,131,240,.25);
}

/**
 * Skrolbarovi. Na Windows-u su podrazumevano široki i sivi i probijaju se
 * kroz trake sa tabovima; ovde su tanki i u bojama teme, isto na svim OS-ovima.
 */
.ac, .ac * { scrollbar-width:thin; scrollbar-color:var(--ac-border-strong) transparent; }
.ac ::-webkit-scrollbar { width:10px; height:10px; }
.ac ::-webkit-scrollbar-track { background:transparent; }
.ac ::-webkit-scrollbar-thumb { background:var(--ac-border-strong); border-radius:99px; border:3px solid var(--ac-bg); }
.ac ::-webkit-scrollbar-thumb:hover { background:var(--ac-muted); }
.ac ::-webkit-scrollbar-corner { background:transparent; }
/* Horizontalne trake (tabovi, filteri) ne smeju uopšte da prikažu skrolbar. */
.ac-tabs, .ac-ib-filters { scrollbar-width:none; }
.ac-tabs::-webkit-scrollbar, .ac-ib-filters::-webkit-scrollbar { display:none; }

/* Dashboard preuzima ceo ekran, van teme sajta */
body.ac-app-body { margin:0; padding:0; overflow:hidden; height:100%; background:#fff; }
body.ac-app-body > .ac { height:100vh; height:100dvh; }
.ac * { box-sizing:border-box; }
/* Reset ide kroz :where() da bi ostao na nultoj specifičnosti.
   Bez toga `.ac button` (0,1,1) nadjačava `.ac-btn-primary` (0,1,0),
   pa sva dugmad ostanu providna i bez boje. */
.ac :where(button) { font:inherit; color:inherit; background:none; border:none; cursor:pointer; }
.ac :where(input, select, textarea) { font:inherit; color:inherit; }
.ac :where(a) { color:inherit; text-decoration:none; }
.ac h1 { font-size:24px; line-height:1.25; margin:0; font-weight:500; letter-spacing:-.015em; }
.ac h2 { font-size:18px; line-height:1.3; margin:0; font-weight:500; letter-spacing:-.01em; }
.ac h3 { font-size:14px; line-height:1.35; margin:0; font-weight:500; }
.ac h4 { font-size:12.5px; margin:0; font-weight:500; }
.ac p { margin:0; }
.ac :focus-visible { outline:2px solid var(--ac-accent); outline-offset:2px; border-radius:var(--ac-r-sm); }
.ac .muted { color:var(--ac-muted); }
.ac .small { font-size:12.5px; }
.ac .num { font-variant-numeric:tabular-nums; }
.ac .nowrap { white-space:nowrap; }
.ac .right { text-align:right; }

/* ---------- LAYOUT ---------- */
.ac {
  display:grid;
  grid-template-columns:236px 1fr;
  grid-template-rows:52px 1fr;
  height:100vh;
  background:var(--ac-bg);
  overflow:hidden;
}
.ac-top {
  grid-column:1/-1; display:flex; align-items:center; gap:var(--ac-3);
  padding:0 var(--ac-3); border-bottom:1px solid var(--ac-border);
  background:var(--ac-bg); z-index:30;
}
.ac-side {
  border-right:1px solid var(--ac-border); background:var(--ac-bg-subtle);
  display:flex; flex-direction:column; overflow-y:auto;
}
.ac-main { overflow-y:auto; background:var(--ac-bg); }
.ac-page { max-width:1280px; margin:0 auto; padding:var(--ac-6) var(--ac-6) var(--ac-16); }
.ac-page-wide { padding:0; max-width:none; }

/* ---------- TOPBAR ---------- */
.ac-brand { display:flex; align-items:center; gap:var(--ac-2); font-weight:600; letter-spacing:-.02em; }
/* Znak: balončić na pločici, isti crtež kao na sajtu i u favikonu. */
.ac-mark { flex-shrink:0; display:block; }
.ac-brand-text { font-family:var(--ac-brand); font-weight:800; font-size:16.5px; letter-spacing:-.045em; line-height:1; }
.ac-brand-text span { color:var(--ac-accent); }
.ac-ws { position:relative; }
.ac-ws-btn {
  display:flex; align-items:center; gap:var(--ac-2); padding:5px 8px 5px 5px;
  border-radius:var(--ac-r-md); max-width:240px; transition:background var(--ac-fast);
}
.ac-ws-btn:hover { background:var(--ac-surface-hover); }
.ac-ws-name { font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ac-av {
  width:22px; height:22px; border-radius:6px; display:grid; place-items:center;
  color:#fff; font-size:10px; font-weight:600; flex-shrink:0;
}
.ac-top-right { margin-left:auto; display:flex; align-items:center; gap:var(--ac-1); }
.ac-icon-btn {
  width:30px; height:30px; border-radius:var(--ac-r-md); display:grid; place-items:center;
  color:var(--ac-muted); transition:background var(--ac-fast), color var(--ac-fast);
}
.ac-icon-btn:hover { background:var(--ac-surface-hover); color:var(--ac-fg); }
.ac-user { position:relative; }
.ac-avatar {
  width:26px; height:26px; border-radius:99px; display:grid; place-items:center;
  background:linear-gradient(135deg,#f0a06b,#e2686b); color:#fff; font-size:10.5px; font-weight:600;
}
.ac-burger { display:none; }

/* ---------- DROPDOWN ---------- */
.ac-dropdown {
  position:absolute; top:calc(100% + 6px); left:0; min-width:270px; z-index:50;
  background:var(--ac-surface); border-radius:var(--ac-r-lg); box-shadow:var(--ac-sh-pop); padding:var(--ac-2);
}
.ac-dropdown-right { left:auto; right:0; }
.ac-dd-form { margin:0; }
.ac-dd-item {
  display:flex; align-items:center; gap:10px; width:100%; text-align:left;
  padding:7px var(--ac-2); border-radius:var(--ac-r-sm); font-size:13.5px;
}
.ac-dd-item:hover { background:var(--ac-surface-hover); }
.ac-dd-text { flex:1; min-width:0; }
.ac-dd-title { display:block; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ac-dd-sub { display:block; font-size:11px; color:var(--ac-muted); }
.ac-dd-sep { height:1px; background:var(--ac-border); margin:var(--ac-2) -8px; }
.ac-dd-label {
  font-size:11px; font-weight:500; color:var(--ac-muted); text-transform:uppercase;
  letter-spacing:.05em; padding:var(--ac-2) var(--ac-2) var(--ac-1);
}

/* ---------- SIDEBAR ---------- */
.ac-nav { padding:var(--ac-3) var(--ac-2); display:flex; flex-direction:column; gap:1px; flex:1; }
.ac-nav-label {
  font-size:11px; font-weight:500; color:var(--ac-muted); text-transform:uppercase;
  letter-spacing:.05em; padding:var(--ac-4) var(--ac-2) var(--ac-2);
}
.ac-nav-item {
  display:flex; align-items:center; gap:10px; height:32px; padding:0 var(--ac-2);
  border-radius:var(--ac-r-sm); color:var(--ac-fg-2); font-size:13.5px;
  transition:background var(--ac-fast), color var(--ac-fast);
}
.ac-nav-item:hover { background:var(--ac-surface-hover); color:var(--ac-fg); }
.ac-nav-item.ac-active { background:var(--ac-surface); color:var(--ac-fg); font-weight:500; box-shadow:var(--ac-sh-card); }
.ac-dark .ac-nav-item.ac-active { background:var(--ac-bg-inset); box-shadow:none; }
.ac-count {
  margin-left:auto; font-size:11px; font-weight:500; padding:1px 6px;
  border-radius:99px; background:var(--ac-accent); color:#fff;
}
.ac-dark .ac-count { color:#12101c; }
.ac-count-muted { background:var(--ac-bg-inset); color:var(--ac-muted); }
.ac-dark .ac-count-muted { background:var(--ac-border); color:var(--ac-muted); }

.ac-sb-card { margin:var(--ac-2); padding:var(--ac-3); border-radius:var(--ac-r-lg); background:var(--ac-surface); box-shadow:var(--ac-sh-card); }
.ac-sb-card h4 { margin-bottom:var(--ac-2); }
.ac-progress { height:4px; border-radius:99px; background:var(--ac-bg-inset); overflow:hidden; margin-bottom:var(--ac-2); }
.ac-progress i { display:block; height:100%; background:var(--ac-accent); border-radius:99px; transition:width var(--ac-slow) var(--ac-ease); }
.ac-step { display:flex; align-items:center; gap:6px; font-size:12px; color:var(--ac-muted); padding:3px 0; }
.ac-step:hover { color:var(--ac-fg); }
.ac-step.ac-done { color:var(--ac-fg-2); }
.ac-step.ac-done .ac-tick { background:var(--ac-ok); border-color:var(--ac-ok); color:#fff; }
.ac-tick {
  width:14px; height:14px; border-radius:99px; border:1.5px solid var(--ac-border-strong);
  display:grid; place-items:center; flex-shrink:0;
}
.ac-tick svg { stroke-width:3; }
.ac-scrim { display:none; }

/* ---------- DIJALOG ZA POTVRDU ---------- */
.ac-dialog-wrap { position:fixed; inset:0; z-index:80; display:grid; place-items:center; padding:var(--ac-5); }
.ac-dialog-wrap[hidden] { display:none; }
.ac-dialog-veil {
  position:absolute; inset:0; background:rgba(15,15,17,.45);
  opacity:0; transition:opacity var(--ac-base) var(--ac-ease);
}
.ac-dialog-wrap.ac-on .ac-dialog-veil { opacity:1; }
.ac-dialog {
  position:relative; width:min(400px, 100%);
  background:var(--ac-surface); border-radius:var(--ac-r-xl); box-shadow:var(--ac-sh-modal);
  padding:var(--ac-6) var(--ac-6) var(--ac-4);
  opacity:0; transform:translateY(8px) scale(.97);
  transition:opacity var(--ac-base) var(--ac-ease), transform var(--ac-base) var(--ac-ease);
}
.ac-dialog-wrap.ac-on .ac-dialog { opacity:1; transform:none; }
.ac-dialog-icon {
  width:38px; height:38px; border-radius:var(--ac-r-lg); margin-bottom:var(--ac-4);
  display:grid; place-items:center;
  background:var(--ac-accent-soft); color:var(--ac-accent);
}
.ac-dialog-wrap.ac-danger .ac-dialog-icon { background:var(--ac-err-soft); color:var(--ac-err); }
.ac-dialog h3 { font-size:15.5px; margin-bottom:6px; }
.ac-dialog-text { color:var(--ac-muted); font-size:13.5px; line-height:1.55; }
.ac-dialog-text[hidden] { display:none; }
.ac-dialog-actions {
  display:flex; justify-content:flex-end; gap:var(--ac-2);
  margin-top:var(--ac-6);
}
.ac-dialog-actions .ac-btn { height:34px; padding:0 14px; }
.ac-btn-destructive { background:var(--ac-err); color:#fff; }
.ac-btn-destructive:hover { background:#c11f1f; }
.ac-dark .ac-btn-destructive { color:#2a0f0f; }
@media (max-width:520px) {
  .ac-dialog-actions { flex-direction:column-reverse; }
  .ac-dialog-actions .ac-btn { width:100%; }
}

/* ---------- SLIDE-OVER (bočni panel) ---------- */
.ac-sheet-wrap { position:fixed; inset:0; z-index:60; display:none; }
.ac-sheet-wrap.ac-on { display:block; }
.ac-sheet-veil {
  position:absolute; inset:0; background:rgba(15,15,17,.32);
  opacity:0; transition:opacity var(--ac-base) var(--ac-ease);
}
.ac-sheet-wrap.ac-on .ac-sheet-veil { opacity:1; }
.ac-sheet {
  position:absolute; top:0; right:0; bottom:0; width:min(520px, 100vw);
  background:var(--ac-bg); box-shadow:var(--ac-sh-modal);
  display:flex; flex-direction:column;
  transform:translateX(100%); transition:transform var(--ac-slow) var(--ac-ease);
}
.ac-sheet-wrap.ac-on .ac-sheet { transform:none; }
.ac-sheet-head {
  display:flex; align-items:center; gap:var(--ac-3); flex-shrink:0;
  padding:0 var(--ac-4); height:56px; border-bottom:1px solid var(--ac-border);
}
.ac-sheet-head h2 { flex:1; }
.ac-sheet-body { flex:1; overflow-y:auto; padding:var(--ac-5) var(--ac-4); }
.ac-sheet-foot {
  display:flex; align-items:center; gap:var(--ac-2); flex-shrink:0;
  padding:var(--ac-3) var(--ac-4); border-top:1px solid var(--ac-border);
  background:var(--ac-bg-subtle);
}
.ac-sheet-foot .ac-spacer { margin-left:auto; }
@media (max-width:640px) { .ac-sheet { width:100vw; } }

/* Meni radnji u redu tabele (tri tačke) */
.ac-rowmenu { position:relative; display:inline-block; }
.ac-rowmenu .ac-icon-btn { font-size:16px; line-height:1; }
.ac-dropdown-sm { min-width:170px; }
.ac-dd-danger { color:var(--ac-err); }
.ac-dd-danger:hover { background:var(--ac-err-soft); }

/* Bez ovoga x-cloak ne radi ništa i sadržaj bljesne pre nego što Alpine krene. */
[x-cloak] { display:none !important; }

.ac-note {
  display:flex; align-items:flex-start; gap:8px;
  padding:10px 12px; border-radius:var(--ac-r-md);
  background:var(--ac-accent-soft); color:var(--ac-accent);
  font-size:12.5px; line-height:1.5;
}
.ac-note svg { flex-shrink:0; margin-top:2px; }

/* Prekidač teme: koja se ikona vidi zavisi samo od klase na korenu. */
.ac .ac-theme .ac-i-sun { display:none; }
.ac.ac-dark .ac-theme .ac-i-moon { display:none; }
.ac.ac-dark .ac-theme .ac-i-sun { display:block; }

/* Prazna vrednost u statistici ne sme da bude krupna kao broj. */
.ac-stat-none { color:var(--ac-disabled); font-weight:400; }

/* Naziv u tabeli koji otvara panel */
.ac-cell-link {
  font-weight:500; text-align:left; padding:0; border-radius:var(--ac-r-sm);
  transition:color var(--ac-fast);
}
.ac-cell-link:hover { color:var(--ac-accent); }

/* Čipovi varijanti u redu tabele. Namerno NE .ac-chip — to je već ime
   filter-čipova u inboxu, pa bi se dve komponente tukle oko istih pravila. */
.ac-vchips { display:flex; flex-wrap:wrap; gap:5px; margin-top:7px; }
.ac-vchip {
  display:inline-flex; align-items:center; height:20px; padding:0 8px;
  font-size:11.5px; line-height:1; border-radius:99px; white-space:nowrap;
  background:var(--ac-bg-inset); color:var(--ac-fg-2);
}
.ac-vchip-out { background:var(--ac-err-soft); color:var(--ac-err); text-decoration:line-through; }

/* U panelu polja u dva stupca moraju da počnu na istoj visini —
   .ac-row centrira po vertikali, pa polje sa hint tekstom „pobegne” niže. */
.ac-sheet .ac-row { align-items:flex-start; }
.ac-sheet .ac-switch-row { align-items:center; }
.ac-sheet .ac-var-row { align-items:center; }

/* Varijante u panelu */
.ac-var-row { display:flex; align-items:center; gap:var(--ac-2); margin-bottom:var(--ac-2); }
.ac-var-row .ac-input { min-width:0; }
.ac-var-empty { padding:var(--ac-3) 0; }

/* ---------- DUGMAD ---------- */
.ac-btn {
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  height:32px; padding:0 12px; border-radius:var(--ac-r-md);
  font-size:13px; font-weight:500; white-space:nowrap; transition:all var(--ac-fast);
}
.ac-btn-primary { background:var(--ac-accent); color:#fff; }
.ac-btn-primary:hover { background:var(--ac-accent-hover); }
.ac-dark .ac-btn-primary { color:#12101c; }
.ac-btn-ghost { background:var(--ac-surface); color:var(--ac-fg-2); box-shadow:0 0 0 1px var(--ac-border); }
.ac-btn-ghost:hover { box-shadow:0 0 0 1px var(--ac-border-strong); color:var(--ac-fg); }
.ac-btn-quiet { color:var(--ac-muted); }
.ac-btn-quiet:hover { background:var(--ac-surface-hover); color:var(--ac-fg); }
.ac-btn-danger { color:var(--ac-err); box-shadow:0 0 0 1px var(--ac-border); }
.ac-btn-danger:hover { background:var(--ac-err-soft); }
.ac-btn-danger[disabled] { opacity:.45; cursor:not-allowed; }
.ac-btn-danger[disabled]:hover { background:none; }
.ac-btn-sm { height:26px; padding:0 9px; font-size:12.5px; }
.ac-btn-block { width:100%; }
.ac-btn-x { width:26px; height:26px; border-radius:var(--ac-r-sm); color:var(--ac-muted); display:inline-grid; place-items:center; }
.ac-btn-x:hover { background:var(--ac-err-soft); color:var(--ac-err); }
.ac-btn.htmx-request { opacity:.6; pointer-events:none; }

/* ---------- KARTICE, FORME ---------- */
.ac-card { background:var(--ac-surface); border-radius:var(--ac-r-lg); box-shadow:var(--ac-sh-card); }
.ac-card-pad { padding:var(--ac-5); }
.ac-card-head {
  display:flex; align-items:center; justify-content:space-between; gap:var(--ac-3);
  padding:var(--ac-4) var(--ac-5); border-bottom:1px solid var(--ac-border);
}
.ac-card-sub { font-size:12.5px; color:var(--ac-muted); margin-top:2px; }

.ac-label { display:block; font-size:12.5px; font-weight:500; margin:0 0 6px; }
.ac-input, .ac-select, .ac-textarea {
  width:100%; height:34px; padding:0 10px; border-radius:var(--ac-r-md);
  background:var(--ac-surface); box-shadow:0 0 0 1px var(--ac-border);
  font-size:13.5px; border:none; transition:box-shadow var(--ac-fast);
}
.ac-textarea { height:auto; padding:8px 10px; resize:vertical; line-height:1.55; font-family:inherit; }
.ac-input:hover, .ac-select:hover, .ac-textarea:hover { box-shadow:0 0 0 1px var(--ac-border-strong); }
.ac-input:focus, .ac-select:focus, .ac-textarea:focus { outline:none; box-shadow:0 0 0 1px var(--ac-accent), var(--ac-ring); }
.ac-select {
  appearance:none; padding-right:28px; background-repeat:no-repeat; background-position:right 10px center;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2371717a' stroke-width='2.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}
.ac-field { margin-bottom:var(--ac-4); }
.ac-hint { font-size:12px; color:var(--ac-muted); margin-top:5px; }

.ac-switch { display:inline-block; position:relative; width:34px; height:20px; border-radius:99px; background:var(--ac-border-strong); flex-shrink:0; cursor:pointer; transition:background var(--ac-base) var(--ac-ease); border:none; }
.ac-switch.ac-on { background:var(--ac-accent); }
.ac-switch i { position:absolute; top:2px; left:2px; width:16px; height:16px; border-radius:99px; background:#fff; box-shadow:0 1px 2px rgba(0,0,0,.2); transition:transform var(--ac-base) var(--ac-ease); }
.ac-switch.ac-on i { transform:translateX(14px); }
.ac-switch-row { display:flex; align-items:center; justify-content:space-between; gap:var(--ac-4); padding:var(--ac-3) 0; }
.ac-switch-row + .ac-switch-row { border-top:1px solid var(--ac-border); }

/* ---------- TABELE ---------- */
.ac-table { width:100%; border-collapse:collapse; }
.ac-table th {
  text-align:left; font-size:11.5px; font-weight:500; color:var(--ac-muted);
  text-transform:uppercase; letter-spacing:.04em; white-space:nowrap;
  padding:var(--ac-3) var(--ac-4) var(--ac-2); border-bottom:1px solid var(--ac-border);
}
/*
 * height na ćeliji tabele radi kao MINIMUM, pa jednoredni redovi i dalje
 * imaju istih 46px, a red sa čipovima varijanti dobija vazduh umesto da
 * naleže na liniju ispod.
 */
.ac-table td {
  padding:var(--ac-3) var(--ac-4); height:46px;
  border-bottom:1px solid var(--ac-border); vertical-align:middle;
}
.ac-table tbody tr { transition:background var(--ac-fast); }
.ac-table tbody tr:hover { background:var(--ac-surface-hover); }
@keyframes acFlash { 0% { background:var(--ac-accent-soft); } 100% { background:transparent; } }
.ac-row-new { animation:acFlash 900ms var(--ac-ease); }
.ac-row-add td { background:var(--ac-accent-soft); }

/* ---------- OSTALO ---------- */
.ac-badge {
  display:inline-flex; align-items:center; gap:5px; height:20px; padding:0 8px;
  border-radius:99px; font-size:11.5px; font-weight:500;
  background:var(--ac-bg-inset); color:var(--ac-fg-2);
}
.ac-badge-ok { background:var(--ac-ok-soft); color:var(--ac-ok); }
.ac-badge-warn { background:var(--ac-warn-soft); color:var(--ac-warn); }
.ac-badge-err { background:var(--ac-err-soft); color:var(--ac-err); }
.ac-badge-accent { background:var(--ac-accent-soft); color:var(--ac-accent); }
.ac-badge-info { background:var(--ac-info-soft); color:var(--ac-info); }
.ac-pulse { width:6px; height:6px; border-radius:99px; background:currentColor; flex-shrink:0; }

.ac-alert { padding:10px 14px; border-radius:var(--ac-r-md); background:var(--ac-warn-soft); color:var(--ac-warn); font-size:13.5px; margin-bottom:var(--ac-4); }
.ac-alert-ok { background:var(--ac-ok-soft); color:var(--ac-ok); }
.ac-alert-err { background:var(--ac-err-soft); color:var(--ac-err); }

.ac-tabs { display:flex; gap:2px; border-bottom:1px solid var(--ac-border); margin-bottom:var(--ac-5); overflow-x:auto; }
.ac-tab { padding:0 12px; height:34px; font-size:13.5px; color:var(--ac-muted); border-bottom:2px solid transparent; margin-bottom:-1px; white-space:nowrap; }
.ac-tab:hover { color:var(--ac-fg); }
.ac-tab.ac-active { color:var(--ac-fg); font-weight:500; border-bottom-color:var(--ac-accent); }

.ac-grid { display:grid; gap:var(--ac-4); }
.ac-g2 { grid-template-columns:repeat(2,1fr); }
.ac-g3 { grid-template-columns:repeat(3,1fr); }
.ac-g4 { grid-template-columns:repeat(4,1fr); }
.ac-row { display:flex; align-items:center; gap:var(--ac-3); }
.ac-between { justify-content:space-between; }
.ac-wrap { flex-wrap:wrap; }
.ac-mt2 { margin-top:var(--ac-2); } .ac-mt4 { margin-top:var(--ac-4); } .ac-mt6 { margin-top:var(--ac-6); }
.ac-mb2 { margin-bottom:var(--ac-2); } .ac-mb4 { margin-bottom:var(--ac-4); } .ac-mb6 { margin-bottom:var(--ac-6); }

.ac-page-head { display:flex; align-items:flex-start; justify-content:space-between; gap:var(--ac-4); margin-bottom:var(--ac-5); flex-wrap:wrap; }
.ac-page-head p { color:var(--ac-muted); font-size:13.5px; margin-top:3px; }

.ac-stat { padding:var(--ac-4) var(--ac-5); }
.ac-stat-label { font-size:12.5px; color:var(--ac-muted); }
.ac-stat-value { font-size:26px; font-weight:500; letter-spacing:-.02em; margin:6px 0 4px; font-variant-numeric:tabular-nums; }
.ac-stat-delta { font-size:12px; }
.ac-up { color:var(--ac-ok); } .ac-down { color:var(--ac-err); }

.ac-list-row { display:flex; align-items:center; gap:var(--ac-3); padding:var(--ac-3) var(--ac-5); border-bottom:1px solid var(--ac-border); }
.ac-list-row:last-child { border-bottom:none; }
.ac-list-icon { width:30px; height:30px; border-radius:var(--ac-r-md); background:var(--ac-bg-inset); display:grid; place-items:center; color:var(--ac-muted); flex-shrink:0; font-size:14px; }

.ac-empty { text-align:center; padding:var(--ac-16) var(--ac-6); }
.ac-empty-icon {
  width:44px; height:44px; border-radius:var(--ac-r-lg); background:var(--ac-bg-inset);
  display:grid; place-items:center; margin:0 auto var(--ac-4);
  color:var(--ac-muted); flex-shrink:0;
}
.ac-empty-ok { background:var(--ac-ok-soft); color:var(--ac-ok); }
.ac-type-icon {
  width:32px; height:32px; border-radius:var(--ac-r-md); background:var(--ac-bg-inset);
  display:inline-grid; place-items:center; color:var(--ac-fg-2); flex-shrink:0;
}
.ac-empty p { color:var(--ac-muted); font-size:13.5px; max-width:380px; margin:6px auto var(--ac-4); }

.ac-choice { padding:var(--ac-4); border-radius:var(--ac-r-lg); box-shadow:0 0 0 1px var(--ac-border); background:var(--ac-surface); cursor:pointer; text-align:left; width:100%; transition:all var(--ac-fast); }
.ac-choice:hover { box-shadow:var(--ac-sh-hover); }
.ac-choice.ac-sel { box-shadow:0 0 0 2px var(--ac-accent); background:var(--ac-accent-soft); }
.ac-choice[disabled] { opacity:.55; cursor:not-allowed; }

/* ---------- TOASTS ---------- */
.ac-toasts { position:fixed; bottom:var(--ac-5); right:var(--ac-5); z-index:90; display:flex; flex-direction:column; gap:var(--ac-2); }
.ac-toast {
  display:flex; align-items:center; gap:10px; padding:11px var(--ac-4);
  background:var(--ac-surface); border-radius:var(--ac-r-lg); box-shadow:var(--ac-sh-pop);
  font-size:13.5px; min-width:260px; max-width:380px; line-height:1.45;
  animation:acToastIn 220ms var(--ac-ease);
}
@keyframes acToastIn { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:none; } }
/* Znak se crta iz CSS-a — „✓” iz nepoznatog fonta ume da izgleda bilo kako. */
.ac-toast::before {
  content:""; width:16px; height:16px; border-radius:99px; flex-shrink:0;
  background-repeat:no-repeat; background-position:center; background-size:10px 10px;
}
.ac-toast-ok::before {
  background-color:var(--ac-ok);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
}
.ac-toast-err::before {
  background-color:var(--ac-err);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='4' stroke-linecap='round'%3E%3Cpath d='M12 6v8M12 18h.01'/%3E%3C/svg%3E");
}
.ac-toast-warn::before {
  background-color:var(--ac-warn);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='4' stroke-linecap='round'%3E%3Cpath d='M12 6v8M12 18h.01'/%3E%3C/svg%3E");
}

/* ---------- INBOX ---------- */
.ac-inbox { display:grid; grid-template-columns:300px 1fr 280px; height:calc(100vh - 52px); }
.ac-ib-list { border-right:1px solid var(--ac-border); display:flex; flex-direction:column; overflow:hidden; }
.ac-ib-filters { display:flex; gap:4px; padding:var(--ac-3); border-bottom:1px solid var(--ac-border); overflow-x:auto; }
.ac-chip {
  display:inline-flex; align-items:center; height:26px; padding:0 10px; border-radius:99px;
  font-size:12.5px; color:var(--ac-muted); box-shadow:0 0 0 1px var(--ac-border); white-space:nowrap;
  transition:background var(--ac-fast), color var(--ac-fast);
}
.ac-chip:hover { color:var(--ac-fg); }
.ac-chip.ac-active { background:var(--ac-fg); color:var(--ac-bg); box-shadow:none; font-weight:500; }
/* Dani su izbor, ne filter — sedam crnih pilula u nizu izgleda kao greška. */
.ac-days { display:flex; flex-wrap:wrap; gap:5px; }
.ac-days .ac-chip { min-width:44px; justify-content:center; cursor:pointer; }
.ac-days .ac-chip.ac-active {
  background:var(--ac-accent-soft); color:var(--ac-accent);
  box-shadow:0 0 0 1px var(--ac-accent-border);
}
.ac-ib-items { flex:1; overflow-y:auto; }
.ac-ib-item { display:flex; gap:10px; padding:var(--ac-3) var(--ac-4); border-bottom:1px solid var(--ac-border); cursor:pointer; }
.ac-ib-item:hover { background:var(--ac-surface-hover); }
.ac-ib-item.ac-active { background:var(--ac-accent-soft); }
.ac-dark .ac-ib-item.ac-active { background:var(--ac-bg-inset); }
.ac-ib-av { width:32px; height:32px; border-radius:99px; display:grid; place-items:center; color:#fff; font-size:12px; font-weight:600; flex-shrink:0; }
.ac-ib-meta { flex:1; min-width:0; }
.ac-ib-name { display:flex; align-items:center; gap:6px; font-weight:500; font-size:13.5px; }
.ac-ib-time { margin-left:auto; font-size:11.5px; color:var(--ac-muted); font-weight:400; }
.ac-ib-prev { font-size:12.5px; color:var(--ac-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:2px; }
.ac-thread { display:flex; flex-direction:column; overflow:hidden; }
.ac-thread-head { display:flex; align-items:center; gap:var(--ac-3); padding:var(--ac-3) var(--ac-4); border-bottom:1px solid var(--ac-border); }
.ac-log { flex:1; overflow-y:auto; padding:var(--ac-5); background:var(--ac-bg-subtle); }
.ac-msg { max-width:74%; margin-bottom:var(--ac-3); display:flex; flex-direction:column; }
.ac-msg-out { margin-left:auto; align-items:flex-end; }
.ac-bubble { padding:8px 12px; border-radius:var(--ac-r-lg); font-size:13.5px; line-height:1.5; white-space:pre-wrap; word-break:break-word; }
.ac-msg-in .ac-bubble { background:var(--ac-surface); box-shadow:var(--ac-sh-card); border-bottom-left-radius:4px; }
.ac-msg-out .ac-bubble { background:var(--ac-accent); color:#fff; border-bottom-right-radius:4px; }
.ac-dark .ac-msg-out .ac-bubble { color:#12101c; }
.ac-msg-time { font-size:11px; color:var(--ac-muted); margin-top:4px; }
.ac-tool { display:inline-flex; align-items:center; gap:6px; padding:4px 9px; border-radius:var(--ac-r-sm); background:var(--ac-bg-inset); font-family:var(--ac-mono); font-size:11.5px; color:var(--ac-muted); margin-bottom:var(--ac-2); }
.ac-composer { padding:var(--ac-3) var(--ac-4); border-top:1px solid var(--ac-border); }
.ac-panel { border-left:1px solid var(--ac-border); overflow-y:auto; padding:var(--ac-4); }
.ac-kv { display:flex; justify-content:space-between; gap:var(--ac-3); padding:6px 0; font-size:12.5px; }
.ac-kv span:first-child { color:var(--ac-muted); }
.ac-window { display:flex; align-items:center; gap:8px; padding:8px var(--ac-4); background:var(--ac-warn-soft); color:var(--ac-warn); font-size:12.5px; border-bottom:1px solid var(--ac-border); }

/* ---------- AUTH ---------- */
/* Prijava i registracija žive u temi, ne u ljusci aplikacije, pa nemaju
   resete koje .ac inače daje — bez ovoga link u dugmetu ostane podvučen. */
/* Odeljak u kartici: prekidač plus polje koje se otvara ispod njega. */
.ac-card-sec { padding:var(--ac-4) 0; border-bottom:1px solid var(--ac-border); }
.ac-card-sec:last-of-type { border-bottom:0; padding-bottom:0; }
.ac-card-sec .ac-textarea { margin-top:var(--ac-3); }
.ac-badge-muted { background:var(--ac-bg-inset); color:var(--ac-muted); }

.ac-auth *, .ac-auth *::before, .ac-auth *::after { box-sizing:border-box; }
.ac-auth :where(a) { color:inherit; text-decoration:none; }
.ac-auth :where(button) { font:inherit; color:inherit; background:none; border:none; cursor:pointer; }
.ac-auth :where(input, select, textarea) { font:inherit; color:inherit; }
.ac-auth :where(p) { margin:0; }
.ac-auth :where(h2) { font-size:19px; line-height:1.3; margin:0; font-weight:600; letter-spacing:-.015em; }
.ac-auth .muted { color:var(--ac-muted); }
.ac-auth { min-height:70vh; display:grid; place-items:center; padding:var(--ac-8) var(--ac-4); background:var(--ac-bg-subtle); }
.ac-auth-card { width:100%; max-width:400px; background:var(--ac-surface); border-radius:var(--ac-r-xl); box-shadow:var(--ac-sh-card); padding:var(--ac-8); }
.ac-auth-brand { display:flex; align-items:center; gap:10px; margin-bottom:var(--ac-5); }
.ac-auth-brand .ac-brand-text { font-size:19px; }
.ac-auth-card h2 { margin-bottom:4px; }
.ac-auth-sub { color:var(--ac-muted); font-size:13.5px; margin-bottom:var(--ac-5); }
.ac-auth-card .ac-label { margin-top:var(--ac-3); }
.ac-auth-card .ac-btn { margin-top:var(--ac-5); height:38px; }
.ac-auth-alt { text-align:center; margin-top:var(--ac-4); font-size:13px; color:var(--ac-muted); }
.ac-auth-alt a { color:var(--ac-accent); font-weight:500; }

/* ---------- RESPONSIVE ---------- */
@media (max-width:1200px) { .ac-inbox { grid-template-columns:280px 1fr; } .ac-panel { display:none; } }
@media (max-width:1000px) {
  .ac { grid-template-columns:1fr; }
  .ac-burger { display:grid; }
  .ac-side { position:fixed; left:0; top:52px; bottom:0; width:236px; z-index:40; transform:translateX(-100%); transition:transform var(--ac-base) var(--ac-ease); box-shadow:var(--ac-sh-modal); }
  .ac-side.ac-open { transform:none; }
  .ac-scrim { display:block; position:fixed; inset:52px 0 0; background:rgba(0,0,0,.3); z-index:35; opacity:0; pointer-events:none; transition:opacity var(--ac-base); }
  .ac-scrim.ac-on { opacity:1; pointer-events:auto; }
  .ac-g2, .ac-g3, .ac-g4 { grid-template-columns:1fr; }
  .ac-inbox { grid-template-columns:1fr; }
  .ac-page { padding:var(--ac-4); }
  .ac-brand-text { display:none; }
  .ac-ws-btn { max-width:150px; }
  .ac-table { display:block; overflow-x:auto; white-space:nowrap; }
  .ac-toasts { left:var(--ac-4); right:var(--ac-4); }
  .ac-toast { min-width:0; }
}

/* Tri tačke dok se čeka odgovor — jedini znak da se nešto dešava. */
.ac-typing { display:inline-flex; align-items:center; gap:4px; padding:11px 14px; }
.ac-typing i { width:6px; height:6px; border-radius:50%; background:var(--ac-muted); opacity:.45; animation:acDot 1.1s infinite ease-in-out; }
.ac-typing i:nth-child(2) { animation-delay:.16s; }
.ac-typing i:nth-child(3) { animation-delay:.32s; }
@keyframes acDot { 0%,80%,100% { transform:translateY(0); opacity:.35; } 40% { transform:translateY(-3px); opacity:.9; } }
@media (prefers-reduced-motion:reduce) { .ac-typing i { animation:none; } }

/* Prilozi iz poruka. Slika je ograničena da jedan snimak ekrana ne razvuče ceo razgovor. */
.ac-att { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:4px; }
.ac-att img { max-width:220px; max-height:260px; border-radius:var(--ac-r-md); border:1px solid var(--ac-border); display:block; object-fit:cover; }
.ac-att-file { display:inline-flex; align-items:center; gap:6px; padding:8px 11px; border-radius:var(--ac-r-md); background:var(--ac-bg-inset); font-size:12.5px; color:var(--ac-fg-2); }
.ac-att-file:hover { background:var(--ac-surface-hover); }

/* Red u bočnom panelu razgovora: naziv levo, iznos i stanje desno. */
.ac-side-row { display:flex; align-items:flex-start; justify-content:space-between; gap:var(--ac-3);
               padding:7px var(--ac-4); font-size:12.5px; }
.ac-side-row > span:first-child { display:flex; flex-direction:column; gap:2px; min-width:0; }
.ac-side-row > span:first-child > span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ac-side-row .right { text-align:right; white-space:nowrap; }
a.ac-side-row:hover { background:var(--ac-surface-hover); }

/* Red panela je dugme kad otvara detalje — mora da izgleda kao red, ne kao dugme. */
button.ac-side-row { background:none; border:0; font:inherit; color:inherit; cursor:pointer; }