/* =============================================================
   Tamna tema ZetraERP-a: javni sajt (.zl), portal i prijava (.zp) i cloud.css.
   VS Code Dark Modern: neutralne sive površine i Zetra crvene akcije.
   Statusi greške, upozorenja i uspjeha zadržavaju semantičke boje.
   Klasu dark-mode ili light-mode na <html> postavlja skripta u App.razor
   (izbor iz localStorage "zetra.theme" ili postavka sistema); prekidač je
   Components/Shared/ThemeToggle.razor, a ponašanje u wwwroot/landing/zl.js.
   Ovaj izvor je početak generisanog dark.css (scripts/build-dark-css.py).
   ============================================================= */
html.dark-mode {
    color-scheme: dark;
    --chrome: #181818;
    --input: #313131;
    --button-bg: #bd2433;
    --button-hover: #a61f2d;
    --button-text: #ffffff;
    --danger: #ff9aa5;
    --danger-tint: #2a1a1e;
    --bg: #1f1f1f;
    --surface: #1f1f1f;
    --soft: #252526;
    --ink: #cccccc;
    --muted: #a0a0a0;
    --line: #313131;
    --red: #f06464;
    --red-dark: #ff8585;
    --tint: #29191c;
    --green: #4ec98a;
    --green-tint: #14271e;
    --amber: #efc074;
}
html.dark-mode body { background: var(--bg); color: var(--ink); }

/* Tokeni javnog sajta i portala */
html.dark-mode :is(.zl, .zp) {
    --ui-bg: #1f1f1f;
    --ui-surface: #1f1f1f;
    --ui-soft: #252526;
    --ui-border: #313131;
    --ui-border-strong: #6b6b6b;
    --ui-text: #cccccc;
    --ui-muted: #a0a0a0;
    --ui-accent: #bd2433;
    --ui-accent-hover: #a61f2d;
    --ui-link: #f06464;
    --ui-link-hover: #ff8585;
    --ui-indicator: #d93643;
    --ui-tint: #29191c;
    --ui-rail: #181818;
    --ui-rail-text: #cccccc;
    --ui-rail-muted: #a0a0a0;
    --ui-success: #4ec98a;
    --ui-success-tint: #14271e;
    --ui-warning: #efc074;
    --ui-warning-tint: #2e2617;
    --ui-shadow: 0 1px 2px rgb(0 0 0 / 40%), 0 12px 30px -16px rgb(0 0 0 / 65%);
    --ui-shadow-lift: 0 2px 6px rgb(0 0 0 / 45%), 0 22px 48px -20px rgb(0 0 0 / 75%);
    --ui-action-text: var(--button-text);
}

/* Crveni Zetra naglasak; bijeli tekst na tamnocrvenom dugmetu. */
html.dark-mode :is(.button.primary, .zl .btn-primary, .zp .button.primary, .zl .zl-start-num, .zl .zl-flow-list li::before) { background: var(--button-bg); border-color: var(--button-bg); color: var(--button-text); }
html.dark-mode :is(.button.primary, .zl .btn-primary, .zp .button.primary):hover { background: var(--button-hover); border-color: var(--button-hover); color: var(--button-text); }
html.dark-mode :is(.brand-mark, .plan-ribbon) { background: var(--button-bg); color: var(--button-text); }
html.dark-mode :is(.main-nav a.active::after, .progress-track > span) { background: #d93643; }
html.dark-mode :is(.zp, .zl) :is(.button.danger, .tag.red) { color: var(--danger); border-color: var(--danger); }
html.dark-mode :is(.zp, .zl) :is(.tag.red, .button.danger:hover) { background: var(--danger-tint); }
html.dark-mode .zp :is(.portal-sidebar, .portal-topbar) { background: var(--chrome); }
html.dark-mode :is(.zp, .zl) :is(input:not([type=checkbox]):not([type=radio]), select, textarea) { background: var(--input); border-color: var(--ui-border-strong); }
html.dark-mode .zp .company-search input[type=search] { border: 0; background: transparent; }
html.dark-mode :is(.zp, .zl) :is(input, select, textarea):focus { border-color: var(--ui-accent); }
html.dark-mode input:is([type=checkbox], [type=radio]) { accent-color: var(--button-bg); }
html.dark-mode .zp .button.primary:disabled { background: color-mix(in srgb, var(--ui-accent) 45%, var(--ui-surface)); color: var(--button-text); }
html.dark-mode .zp .data-table tbody tr:hover td { background: var(--ui-soft); }
html.dark-mode .site-header .brand { color: var(--ink); }
html.dark-mode .zl a.zl-tag:hover { color: var(--button-text); }
html.dark-mode .tag.amber { background: #2e2617; color: var(--amber); }
html.dark-mode .callout.warning { background: #2e2617; color: #efc074; }
html.dark-mode .callout.success { background: #14271e; color: #4ec98a; }
html.dark-mode .callout.error { background: #2a1a1e; color: #ff9aa5; }
html.dark-mode :is(input, select, textarea) { color-scheme: dark; }

/* Prekidač teme (zaglavlje sajta, portala i prijave) */
.theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    padding: 0;
    color: var(--ink);
    background: transparent;
    border: 1px solid var(--line);
    border-radius: 8px;
    cursor: pointer;
    transition: background-color .2s, border-color .2s;
}
.theme-toggle:hover { background: var(--soft); border-color: var(--muted); }
.theme-toggle:focus-visible { outline: 3px solid var(--red); outline-offset: 3px; }
.theme-toggle .fa-sun { display: none; }
html.dark-mode .theme-toggle .fa-sun { display: inline-block; }
html.dark-mode .theme-toggle .fa-moon { display: none; }
.header-actions .theme-toggle { margin-right: 4px; }
.portal-topbar .zp-topbar-end { display: flex; align-items: center; gap: 12px; }
@media (prefers-reduced-motion: reduce) { .theme-toggle { transition: none; } }


/* ===== generisano iz cloud.css ===== */
html.dark-mode .button:hover{border-color:var(--line)}
html.dark-mode .button.dark{background:var(--chrome)}
html.dark-mode .button.danger{border-color:var(--line)}
html.dark-mode .skip-link{background:var(--surface)}
html.dark-mode .utility-bar{background:var(--chrome)}
html.dark-mode .site-header{background:color-mix(in srgb, var(--chrome) 92%, transparent)}
html.dark-mode .menu-toggle{background:var(--surface)}
html.dark-mode .hero-badge{background:var(--surface)}
html.dark-mode .product-window{background:var(--surface);border:1px solid var(--line)}
html.dark-mode .window-top{background:var(--soft)}
html.dark-mode .window-dot{background:var(--soft)}
html.dark-mode .window-top>span:last-child{color:var(--muted)}
html.dark-mode .preview-rail{background:var(--chrome)}
html.dark-mode .preview-main{background:var(--soft)}
html.dark-mode .preview-stat{background:var(--surface)}
html.dark-mode .preview-activity{background:var(--surface)}
html.dark-mode .preview-table th{background:var(--soft)}
html.dark-mode .preview-table td{border-bottom:1px solid var(--line)}
html.dark-mode .value-strip{background:var(--surface)}
html.dark-mode .module-card:hover{border-color:var(--line)}
html.dark-mode .module-icon{border:1px solid var(--line);background:var(--soft)}
html.dark-mode .tag.amber{background:var(--soft)}
html.dark-mode .step-number:after{background:var(--soft)}
html.dark-mode .plan-card{background:var(--surface)}
html.dark-mode .billing-toggle button.active{background:var(--surface)}
html.dark-mode .cta-panel{background:var(--soft)}
html.dark-mode .site-footer{background:var(--chrome)}
html.dark-mode .filter-pills button{background:var(--surface)}
html.dark-mode .filter-pills button.active{background:var(--chrome)}
html.dark-mode .panel{background:var(--surface)}
html.dark-mode .callout{border-left:3px solid var(--line)}
html.dark-mode .callout.warning{border-left-color:var(--line);background:var(--soft);color:var(--muted)}
html.dark-mode input:not([type=checkbox]):not([type=radio]),html.dark-mode select,html.dark-mode textarea{border:1px solid var(--line);background:var(--surface)}
html.dark-mode .addon-card{background:var(--surface)}
html.dark-mode .auth-wrap{background:var(--surface)}
html.dark-mode .empty-state{border:1px dashed var(--line)}
html.dark-mode .portal-sidebar{background:var(--chrome)}
html.dark-mode .portal-topbar{background:var(--surface)}
html.dark-mode .stat-card{background:var(--surface)}
html.dark-mode .progress-track{background:var(--soft)}
html.dark-mode .timeline li:before{background:var(--soft);border:2px solid var(--surface)}
html.dark-mode #blazor-error-ui{background:var(--soft);border-top:1px solid var(--line)}

/* ===== generisano iz companies.css ===== */
html.dark-mode .companies-section{background:var(--soft)}
html.dark-mode .companies-account{color:var(--muted)}
html.dark-mode .companies-toolbar{color:var(--muted)}
html.dark-mode .company-search{background:var(--surface);border:1px solid var(--line)}
html.dark-mode .company-search input{color:var(--ink)}
html.dark-mode .company-card{background:var(--surface);border:1px solid var(--line)}
html.dark-mode .company-card:hover{border-color:var(--line)}
html.dark-mode .company-logo img{background:var(--surface)}
html.dark-mode .company-meta{color:var(--muted)}
html.dark-mode .company-create{border:1px dashed var(--line);color:var(--muted)}
html.dark-mode .company-create:hover{background:var(--surface)}
html.dark-mode .company-create strong{color:var(--muted)}
html.dark-mode .company-add{background:var(--soft);color:var(--muted)}
html.dark-mode .companies-footer{color:var(--muted)}
html.dark-mode .companies-empty{background:var(--surface);border:1px solid var(--line)}
html.dark-mode .invitation-account{background:var(--soft)}
html.dark-mode .import-proof{background:var(--soft);border:1px solid var(--line)}