/* Stay Manager Centar – dodaci uz app.css */
.c-tag { font-size: .7rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--accent-ink);
  border: 1px solid var(--nav-border); border-radius: 999px; padding: .1rem .45rem; margin-left: .2rem; }
.mainnav .count-pill { margin-left: .25rem; }
.dot { display: inline-block; width: .6rem; height: .6rem; border-radius: 50%; background: var(--muted); margin-right: .35rem;
  vertical-align: middle; flex: none; }
.dot-ok { background: var(--success); box-shadow: 0 0 0 3px color-mix(in srgb, var(--success) 18%, transparent); }
.dot-stale { background: var(--danger); }
.dot-never { background: var(--warning); }
.dot-off { background: var(--border); }
.stats.stats-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.stats.stats-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
@media (max-width: 1000px) { .stats.stats-6 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 760px) { .stats.stats-4, .stats.stats-6 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.stat-warn { border-color: color-mix(in srgb, var(--warning) 40%, var(--border)); background: var(--warning-soft); }
.stat-warn .stat-value { color: var(--warning); }
a.stat:hover { text-decoration: none; border-color: color-mix(in srgb, var(--primary) 40%, var(--border)); }

/* stupčasti grafikon vremena korištenja po danu */
.chart { margin: .5rem 0 .25rem; }
.bars { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(4px, 1fr); align-items: end; gap: 2px;
  height: 150px; border-bottom: 1px solid var(--border); }
.bar { background: var(--primary); border-radius: 3px 3px 0 0; min-height: 2px; }
.bar.zero { background: var(--surface-2); min-height: 2px; }
.bar.weekend { background: color-mix(in srgb, var(--primary) 70%, var(--surface)); }
.bar.today { background: var(--accent); }
.bar:hover { outline: 2px solid color-mix(in srgb, var(--primary) 35%, transparent); }
.bars-axis { display: flex; justify-content: space-between; font-size: .75rem; color: var(--muted); margin-top: .3rem; }
.hbar { height: .5rem; background: var(--surface-2); border-radius: 999px; overflow: hidden; min-width: 70px; }
.hbar > span { display: block; height: 100%; background: var(--primary); border-radius: 999px; }
.heat { font-size: .8rem; }
.heat th, .heat td { text-align: center; padding: .3rem .25rem; white-space: nowrap; }
.heat td.lvl-0 { color: var(--muted); }
.heat td.lvl-1 { background: color-mix(in srgb, var(--primary) 10%, transparent); }
.heat td.lvl-2 { background: color-mix(in srgb, var(--primary) 22%, transparent); }
.heat td.lvl-3 { background: color-mix(in srgb, var(--primary) 38%, transparent); font-weight: 600; }
.heat th:first-child, .heat td:first-child { text-align: left; position: sticky; left: 0; background: var(--surface); }

.token-box { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 1.05rem; background: var(--surface-2);
  border: 1px dashed var(--border); border-radius: var(--radius-sm); padding: .8rem 1rem; word-break: break-all; }
.online-firm { margin-bottom: 1rem; }
.online-firm h3 { margin: 0 0 .4rem; font-size: 1rem; display: flex; align-items: center; gap: .4rem; }
.items-table input[name="item_tax"] { width: 70px; }
.items-table input[name="item_quantity"] { width: 70px; }
.items-table input[name="item_price"] { width: 100px; }
.items-table input[name="item_kpd"] { width: 96px; }
.items-table select[name="item_kind"] { width: 140px; }
.items-table .item-reason { min-width: 160px; }
.check-cell { width: 2rem; }
.status-line { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; }
.log-box { white-space: pre-wrap; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .8rem;
  background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: .7rem .9rem;
  max-height: 520px; overflow: auto; }
.auth-page { background: var(--nav-bg); }
.auth-page .auth-card { background: var(--surface); }
.auth-page .auth-brand img { height: 32px; }
.inline-fields { display: flex; gap: .6rem; flex-wrap: wrap; align-items: flex-end; }
.inline-fields .field { margin-bottom: .4rem; }
