/* ═══════════════════════════════════════════════════════════════════════════
   Hromadný filter — štýly
   ═══════════════════════════════════════════════════════════════════════════

   ┌─ AKO MENIŤ ŠÍRKY STĹPCOV ──────────────────────────────┐
   │  Zmeň hodnoty CSS premenných v sekcii :root nižšie.    │
   │  Uložiť → Reload stránky → zmena sa prejaví.           │
   └────────────────────────────────────────────────────────┘
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── ŠÍRKY STĹPCOV — uprav tu ──────────────────────────────── */
:root {
    --hf-w-cb: 25px;
    /* Checkbox (1. stĺpec)     */
    --hf-w-num: 25px;
    /* Číslo riadku (2. stĺpec) */
    --hf-w-pracovnik: 230px;
    /* Pracovník                */
    --hf-w-nabor: 65px;
    /* Nábor                    */
    --hf-w-telefon: 110px;
    /* Telefón (+421 948 359 969) */
    --hf-w-miasto: 90px;
    /* Miesto príchodu          */
    --hf-w-cas: 40px;
    /* Čas príchodu             */
    --hf-w-poznamka: 290px;
    /* Poznámka                 */
    --hf-w-cestovne: 65px;
    /* Cestovné                 */
    --hf-w-stredisko: 180px;
    /* Stredisko                */
}

/* Page count */
.page-count {
    font-size: 13px;
    color: var(--text2);
}

/* Toolbar */
.hf-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
}

.hf-toolbar-left {
    display: flex;
    gap: 10px;
}

.hf-toolbar-right {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Export button */
.hf-export-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    height: 30px;
    padding: 0 10px;
    border-radius: var(--radius-sm);
    border: 1px solid var(--accent, #4a6cf7);
    background: var(--accent, #4a6cf7);
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: opacity 0.15s;
    white-space: nowrap;
}

.hf-export-btn:hover:not(:disabled) {
    opacity: 0.85;
}

.hf-export-btn:disabled {
    opacity: 0.38;
    cursor: not-allowed;
}

.hf-export-btn svg {
    width: 13px;
    height: 13px;
    flex-shrink: 0;
}

.hf-paste-hint {
    font-size: 12px;
    color: var(--text3);
    background: var(--surface2);
    padding: 6px 12px;
    border-radius: var(--radius-sm);
    border: 1px dashed var(--border2);
}

/* Table wrap */
.hf-tbl-wrap {
    min-width: 100%;
}

.hf-tbl-scroll {
    border: 1px solid var(--border2);
    border-radius: var(--radius);
    background: var(--surface);
    overflow: auto;
}

/* Table */
.hf-tbl {
    border-collapse: collapse;
    font-size: 10px;
    table-layout: fixed;
    width: 100%;
    min-width: max-content;
}

.hf-tbl thead {
    background: var(--surface2);
    position: sticky;
    top: 0;
    z-index: 10;
}

.hf-tbl th {
    text-align: left;
    padding: 3px 6px 4px;
    font-size: 9px;
    font-weight: 600;
    color: var(--text3);
    text-transform: uppercase;
    letter-spacing: 0.6px;
    border-bottom: 1px solid var(--border2);
    cursor: pointer;
    user-select: none;
}

.hf-tbl th:hover {
    background: var(--surface3);
}

.hf-th-inner {
    display: flex;
    align-items: center;
    gap: 6px;
}

.hf-th-label {
    flex: 1;
}

.hf-si {
    font-size: 9px;
    color: var(--accent);
    min-width: 12px;
}

.hf-th-cb,
.hf-th-num {
    width: 36px;
    min-width: 36px;
    text-align: center;
    cursor: default;
}

.hf-th-num {
    color: var(--text3);
}

/* ── ŠÍRKY DÁTOVÝCH STĹPCOV — riadi :root vyššie ────────────── */
.hf-tbl th[data-sort="pracovnik"] {
    width: var(--hf-w-pracovnik);
    min-width: var(--hf-w-pracovnik);
}

.hf-tbl th[data-sort="nabor"] {
    width: var(--hf-w-nabor);
    min-width: var(--hf-w-nabor);
}

.hf-tbl th[data-sort="telefon"] {
    width: var(--hf-w-telefon);
    min-width: var(--hf-w-telefon);
}

.hf-tbl th[data-sort="miesto_prichodu"] {
    width: var(--hf-w-miasto);
    min-width: var(--hf-w-miasto);
}

.hf-tbl th[data-sort="cas_prichodu"] {
    width: var(--hf-w-cas);
    min-width: var(--hf-w-cas);
}

.hf-tbl th[data-sort="poznamka"] {
    width: var(--hf-w-poznamka);
    min-width: var(--hf-w-poznamka);
}

.hf-tbl th[data-sort="cestovne"] {
    width: var(--hf-w-cestovne);
    min-width: var(--hf-w-cestovne);
}

.hf-tbl th[data-sort="stredisko"] {
    width: var(--hf-w-stredisko);
    min-width: var(--hf-w-stredisko);
}

.hf-tbl td {
    padding: 8px 12px;
    border-bottom: 1px solid var(--border);
    vertical-align: middle;
}

.hf-tr:hover {
    background: var(--surface2);
}

.hf-tr:last-child td {
    border-bottom: none;
}

/* Checkbox cell */
.hf-cb-td {
    width: 36px;
    min-width: 36px;
    max-width: 36px;
    text-align: center;
    cursor: default;
}

.hf-cb-td:hover {
    background: transparent !important;
}

.hf-cb {
    cursor: pointer;
    width: 14px;
    height: 14px;
    accent-color: var(--accent);
}

/* Row number */
.hf-rn {
    width: 36px;
    min-width: 36px;
    max-width: 36px;
    text-align: right;
    color: var(--text3);
    font-size: 11px;
    font-family: var(--font-mono);
}

/* Cell value */
.hf-cv {
    min-height: 18px;
    line-height: 18px;
}

/* Selected row */
.hf-sel-row {
    background: rgba(99, 102, 241, 0.1);
}

.hf-sel-row:hover {
    background: rgba(99, 102, 241, 0.15);
}

/* Editor input */
.hf-editor-input {
    width: 100%;
    height: 100%;
    border: none;
    background: transparent;
    font: inherit;
    color: inherit;
    outline: none;
    padding: 0;
}

/* Virtual scroll spacer */
.hf-vs-spacer td {
    padding: 0;
    border: none;
}

/* Bulk bar */
.hf-bulk-bar {
    position: fixed;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--accent);
    color: white;
    padding: 10px 20px;
    border-radius: var(--radius);
    display: flex;
    align-items: center;
    gap: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    z-index: 1000;
    font-size: 13px;
}

.hf-bulk-bar button {
    background: rgba(255, 255, 255, 0.2);
    border: none;
    color: white;
    padding: 6px 12px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 12px;
}

.hf-bulk-bar button:hover {
    background: rgba(255, 255, 255, 0.3);
}

/* Buttons */
.btn-primary-sm {
    display: inline-flex;
    align-items: center;
    background: var(--accent);
    color: white;
    border: none;
    padding: 8px 14px;
    border-radius: var(--radius-sm);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: background .15s;
}

.btn-primary-sm:hover {
    background: var(--accent-dark);
}

.btn-ghost-sm {
    display: inline-flex;
    align-items: center;
    background: transparent;
    color: var(--text2);
    border: 1px solid var(--border2);
    padding: 8px 14px;
    border-radius: var(--radius-sm);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all .15s;
}

.btn-ghost-sm:hover {
    background: var(--surface2);
    color: var(--text);
}

/* Flag icons */
.fi {
    display: inline-block;
    width: 18px;
    height: 12px;
    background-size: cover;
    background-position: center;
    border-radius: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .hf-toolbar {
        flex-direction: column;
        gap: 10px;
    }

    .hf-tbl {
        font-size: 10px;
    }

    .hf-tbl th,
    .hf-tbl td {
        padding: 6px 8px;
    }
}

/* ═══════════════════════════════════════════════════════════════════════════
   Nájazdy — wide layout
   ═══════════════════════════════════════════════════════════════════════════ */
#main-content.main-content--wide {
    max-width: none;
    overflow-x: hidden;
}

/* ═══════════════════════════════════════════════════════════════════════════
   Nájazdy — tabuľka
   ═══════════════════════════════════════════════════════════════════════════ */

.najazdy-obalka {
    border: 1px solid var(--border);
    border-radius: var(--radius);
    margin-bottom: 8px;
    overflow: hidden;
}

.obalka-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    cursor: pointer;
    background: var(--surface2);
    user-select: none;
}

.obalka-header:hover {
    background: var(--surface3);
}

.obalka-nazov {
    font-weight: 600;
    font-size: 14px;
}

.obalka-datum {
    font-size: 12px;
    color: var(--text3);
}

.obalka-spros {
    font-size: 11px;
    font-weight: 600;
    background: var(--orange-soft, rgba(249, 115, 22, .15));
    color: var(--orange, #f97316);
    padding: 2px 10px;
    border-radius: 20px;
}

.obalka-count {
    font-size: 12px;
    font-weight: 600;
    background: var(--accent-soft2, rgba(99, 102, 241, .15));
    color: var(--accent);
    padding: 2px 10px;
    border-radius: 20px;
}

.chevron {
    font-size: 11px;
    color: var(--text3);
}

/* Resize handle v hlavičke */
.naj-resize-handle {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 5px;
    cursor: col-resize;
    z-index: 2;
    border-radius: 0 2px 2px 0;
    transition: background .1s;
}

.naj-resize-handle:hover,
.naj-resize-handle.dragging {
    background: var(--accent);
    opacity: 0.6;
}

/* Vlajka pred menom */
.naj-flag-wrap {
    padding: 0 4px 0 8px;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    pointer-events: none;
}

.naj-pracovnik-inner {
    display: flex;
    align-items: center;
    height: 100%;
}

/* ─────────────────────────────────────────────────────────────────────────────
   NÁJAZDY — kompletné štýly (presunuté z JS)
   ───────────────────────────────────────────────────────────────────────────── */

/* Loading states */
.naj-loading,
.naj-empty,
.naj-error {
    padding: 40px;
    text-align: center;
    color: var(--text3);
}

.naj-error {
    color: var(--danger);
    padding: 20px;
}

/* Header section */
.najazdy-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}

.najazdy-header h2 {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    color: var(--text);
}

.najazdy-header-actions {
    display: flex;
    gap: 8px;
    align-items: center;
}

/* Lock icon in header */
.naj-lock-icon {
    color: var(--text3);
    font-size: 13px;
    margin-left: 4px;
}

.naj-lock-icon svg {
    display: inline-block;
    vertical-align: -.15em;
    width: 1em;
    height: 1em;
}

/* Action buttons container */
.naj-actions {
    display: flex;
    gap: 6px;
    margin-left: auto;
    margin-right: 8px;
}

/* Action buttons */
.btn-nahlasit-najazd {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 3px 10px;
    font-size: 11px;
    font-weight: 600;
    background: var(--accent);
    color: #fff;
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: opacity .2s;
}

.btn-nahlasit-najazd:hover {
    opacity: 0.85;
}

.btn-nahlasit-najazd svg {
    width: 12px;
    height: 12px;
    flex-shrink: 0;
}

.btn-uzamknut-najazd,
.btn-odomknut-najazd {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 3px 10px;
    font-size: 11px;
    font-weight: 600;
    background: none;
    color: var(--text3);
    border: 1px solid var(--border2);
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: border-color .2s, color .2s;
}

.btn-uzamknut-najazd:hover,
.btn-odomknut-najazd:hover {
    border-color: var(--accent);
    color: var(--accent);
}

.btn-uzamknut-najazd svg,
.btn-odomknut-najazd svg {
    width: 12px;
    height: 12px;
}

.btn-edit-najazd {
    background: none;
    border: 1px solid var(--border2);
    color: #f97316;
    border-radius: 6px;
    padding: 2px 8px;
    font-size: 11px;
    cursor: pointer;
    transition: border-color .15s, box-shadow .15s;
}

.btn-edit-najazd:hover {
    border-color: #f97316;
    box-shadow: 0 0 0 1px #f97316;
}

.btn-edit-najazd svg {
    display: inline-block;
    vertical-align: -.15em;
    width: 1em;
    height: 1em;
    flex-shrink: 0;
}

.btn-delete-najazd {
    background: none;
    border: 1px solid var(--border2);
    color: var(--text3);
    border-radius: 6px;
    padding: 2px 7px;
    font-size: 13px;
    cursor: pointer;
    transition: color .15s, border-color .15s, box-shadow .15s;
}

.btn-delete-najazd:hover {
    color: var(--danger, #e05252);
    border-color: var(--danger, #e05252);
    box-shadow: 0 0 0 1px var(--danger, #e05252);
}

.btn-delete-najazd svg {
    display: inline-block;
    vertical-align: middle;
}

/* Table wrapper */
.naj-tbl-wrap {
    padding: 0;
}

.naj-tbl-wrap-outer {
    position: relative;
    width: max-content;
    min-width: 100%;
    padding-left: 0px;
    padding-right: 0px;
}

#najazdy-wrap {
    width: 100%;
}

/* Main table */
.najazdy-tabulka {
    border-collapse: collapse;
    font-size: 11px;
    table-layout: fixed;
}

.najazdy-tabulka th {
    position: relative;
    padding: 7px 10px;
    border: 1px solid var(--border);
    background: var(--surface2);
    text-align: center;
    font-weight: 600;
    font-size: 10.5px;
    color: var(--text3);
    text-transform: uppercase;
    white-space: nowrap;
    user-select: none;
}

.naj-th-narrow {
    padding-left: 3px !important;
    padding-right: 3px !important;
}

.najazdy-tabulka td {
    padding: 0;
    border: 1px solid var(--border);
    vertical-align: middle;
}

.najazdy-tabulka input[type=text],
.najazdy-tabulka input[type=date],
.najazdy-tabulka input[type=time] {
    width: 100%;
    border: none;
    background: transparent;
    padding: 5px;
    box-sizing: border-box;
    font-size: 11px;
    color: var(--text);
    outline: none;
}

.najazdy-tabulka input:focus {
    background: var(--surface3);
}

.najazdy-tabulka input[readonly] {
    color: var(--text3);
    cursor: default;
}

/* Table cell elements */
.najazdy-pracovnik-cell {
    position: relative;
}

.najazdy-pracovnik-inp {
    padding-left: 4px !important;
}

/* Checked row */
.naj-row-checked {
    background: var(--accent-soft) !important;
}

/* Strikethrough for removed */
tr[style*="grayscale"] input {
    text-decoration: line-through;
    color: var(--text3) !important;
}

/* Delete bar */
.naj-delete-bar {
    display: none;
    align-items: center;
    gap: 8px;
    padding: 5px 12px;
    background: var(--red-soft);
    border-top: 1px solid var(--red);
    font-size: 12px;
    color: var(--red);
}

.naj-delete-bar.visible {
    display: flex;
}

.naj-delete-bar .naj-del-rm {
    background: var(--red);
    color: #fff;
    border: none;
    border-radius: var(--radius-sm);
    padding: 4px 12px;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
}

.naj-delete-bar .naj-del-rm:hover {
    opacity: 0.85;
}

.naj-delete-bar .naj-del-restore {
    background: var(--accent2, #6366f1);
    color: #fff;
    border: none;
    border-radius: var(--radius-sm);
    padding: 4px 12px;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
}

.naj-delete-bar .naj-del-restore:hover {
    opacity: 0.85;
}

.naj-delete-bar .naj-del-zapisat {
    background: var(--accent);
    color: #fff;
    border: none;
    border-radius: var(--radius-sm);
    padding: 4px 12px;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 5px;
}

.naj-delete-bar .naj-del-zapisat:hover {
    opacity: 0.85;
}

.naj-delete-bar .naj-del-zapisat svg {
    width: 12px;
    height: 12px;
    flex-shrink: 0;
}

.naj-delete-bar .naj-del-export {
    background: #16a34a;
    color: #fff;
    border: none;
    border-radius: var(--radius-sm);
    padding: 4px 12px;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 5px;
}

.naj-delete-bar .naj-del-export:hover {
    background: #15803d;
}

.naj-delete-bar .naj-del-export svg {
    width: 12px;
    height: 12px;
    flex-shrink: 0;
}

/* Checkbox/th column cells */
.naj-cb-cell {
    width: 32px;
    min-width: 32px;
    text-align: center;
    border: 1px solid var(--border);
    padding: 0;
}

.naj-cb-cell input {
    cursor: pointer;
    accent-color: var(--accent);
    width: 14px;
    height: 14px;
}

/* Column widths via colgroup */
/* Column widths via colgroup */
.naj-cb-col {
    width: var(--hf-w-cb);
    min-width: var(--hf-w-cb);
}

.naj-rn-col {
    width: 15px;
    min-width: 15px;
}

/* Data column <col> classes */
.naj-col-pracovnik       { width: var(--hf-w-pracovnik);  min-width: var(--hf-w-pracovnik); }
.naj-col-nabor           { width: var(--hf-w-nabor);      min-width: var(--hf-w-nabor); }
.naj-col-telefon         { width: var(--hf-w-telefon);    min-width: var(--hf-w-telefon); }
.naj-col-miesto-prichodu { width: var(--hf-w-miasto);     min-width: var(--hf-w-miasto); }
.naj-col-cas-prichodu    { width: var(--hf-w-cas);        min-width: var(--hf-w-cas); }
.naj-col-poznamka        { width: var(--hf-w-poznamka);   min-width: var(--hf-w-poznamka); }
.naj-col-cestovne        { width: var(--hf-w-cestovne);   min-width: var(--hf-w-cestovne); }
.naj-col-stredisko       { width: var(--hf-w-stredisko);  min-width: var(--hf-w-stredisko); }

.naj-cb-header {
    width: var(--hf-w-cb);
    text-align: center;
    vertical-align: middle;
    cursor: default !important;
    padding: 0 2px !important;
}

.naj-cb-header:hover {
    background: var(--surface2) !important;
}

.naj-cb-header input {
    cursor: pointer;
    accent-color: var(--accent);
    width: 14px;
    height: 14px;
    display: block;
    margin: 0 auto;
}

.naj-rn-header {
    width: 15px;
    min-width: 15px;
    text-align: left;
    padding: 5px;
    font-size: 9px;
    font-weight: 600;
    color: var(--text3);
    text-transform: uppercase;
    letter-spacing: .5px;
    box-sizing: border-box;
}

/* Row number + checkbox cells */
.naj-rn-cell,
.naj-td-rn {
    width: 15px !important;
    min-width: 15px !important;
    max-width: 15px !important;
    text-align: left !important;
    padding: 5px !important;
    border: 1px solid var(--border);
    color: var(--text3);
    font-size: 11px;
    font-family: var(--font-mono);
    cursor: pointer;
    user-select: none;
    transition: background .15s;
    box-sizing: border-box;
}

.naj-rn-cell:hover,
.naj-td-rn:hover {
    background: var(--accent-soft2);
}

.naj-td-cb {
    width: var(--hf-w-cb);
    min-width: var(--hf-w-cb);
    max-width: var(--hf-w-cb);
    text-align: center;
    border: 1px solid var(--border);
    padding: 0;
}

/* Data cells */
.naj-cell {
    padding: 0;
}

.naj-cell input {
    pointer-events: none;
    user-select: none;
    color: var(--text3);
    cursor: default;
}

.naj-td-stredisko {
    padding: 5px !important;
    color: var(--accent2, #6366f1);
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    box-sizing: border-box;
}

.naj-td-stredisko:empty {
    color: var(--text3);
    font-weight: 400;
}

/* Čas cell */
.naj-td-cas {
    text-align: center;
}

.naj-cas-inp {
    width: 100%;
    border: none;
    background: transparent;
    padding: 5px;
    box-sizing: border-box;
    font-size: 11px;
    font-weight: 600;
    color: var(--green, #22c55e);
    font-family: var(--font);
    text-align: center;
    outline: none;
    -webkit-font-smoothing: antialiased;
}

.naj-cas-inp:focus {
    background: var(--surface3);
}

.naj-cas-inp::placeholder {
    color: var(--text3);
    font-weight: 400;
}

/* Lock banner */
.naj-lock-banner {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    background: var(--surface2);
    border-bottom: 1px solid var(--border);
    font-size: 12px;
    color: var(--text3);
}

.naj-lock-banner svg {
    width: 13px;
    height: 13px;
    flex-shrink: 0;
}

/* Autocomplete dropdown */
.naj-ac-dropdown {
    position: fixed;
    z-index: 9999;
    min-width: 220px;
    background: var(--surface2);
    border: 1px solid var(--border2);
    border-radius: var(--radius);
    box-shadow: 0 8px 24px rgba(0, 0, 0, .2);
    max-height: 260px;
    overflow-y: auto;
    font-family: var(--font);
    font-size: 13px;
}

.naj-ac-item {
    padding: 7px 12px;
    cursor: pointer;
    color: var(--text);
    display: flex;
    align-items: center;
    gap: 6px;
    border-bottom: 1px solid var(--border);
}

.naj-ac-item:hover,
.naj-ac-hover {
    background: var(--accent-soft2);
}

.naj-ac-item:last-child {
    border-bottom: none;
}

.naj-ac-item strong {
    color: var(--accent);
}

/* Mobile list */
.naj-mobile-list {
    display: none;
    flex-direction: column;
    gap: 0;
}

.naj-mobile-card {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 6px 10px;
    border-bottom: 1px solid var(--border);
    background: var(--surface);
    min-height: 0;
}

.naj-mobile-card.naj-row-checked {
    background: var(--accent-soft) !important;
}

.naj-mobile-card:last-child {
    border-bottom: none;
}

.naj-mobile-cb {
    flex-shrink: 0;
    cursor: pointer;
    accent-color: var(--accent);
    width: 14px;
    height: 14px;
}

.naj-mobile-num {
    font-size: 11px;
    color: var(--text3);
    font-family: var(--font-mono);
    min-width: 16px;
    text-align: right;
    flex-shrink: 0;
    cursor: pointer;
    transition: color .15s;
}

.naj-mobile-num:hover {
    color: var(--accent);
}

.naj-mobile-flag {
    flex-shrink: 0;
    line-height: 1;
}

.naj-mobile-body {
    flex: 1;
    min-width: 0;
}

.naj-mobile-name {
    font-size: 12px;
    font-weight: 600;
    color: var(--text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.naj-mobile-meta {
    display: flex;
    gap: 6px;
    align-items: center;
}

.naj-mobile-nabor {
    font-size: 11px;
    color: var(--text3);
    white-space: nowrap;
}

.naj-mobile-tel {
    font-size: 11px;
    color: var(--accent);
    white-space: nowrap;
}

.naj-mobile-pozn {
    font-size: 10px;
    color: var(--text3);
    font-style: italic;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.naj-mobile-right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    gap: 1px;
    flex-shrink: 0;
    width: 80px;
}

.naj-mobile-miesto-inp {
    font-size: 11px;
    color: var(--text3);
    border: none;
    background: transparent;
    width: 100%;
    text-align: right;
    outline: none;
    font-family: var(--font);
    padding: 0;
    margin: 0;
    line-height: 1;
    height: 1em;
    display: block;
}

.naj-mobile-miesto-inp:focus {
    background: var(--surface3);
    border-radius: 3px;
}

.naj-mobile-miesto-inp::placeholder {
    color: var(--text3);
    opacity: .4;
}

.naj-mobile-inp-cas {
    font-size: 12px;
    font-weight: 600;
    color: var(--green, #22c55e);
    border: none;
    background: transparent;
    width: 100%;
    outline: none;
    font-family: var(--font-mono);
    text-align: right;
    cursor: text;
    padding: 0;
    margin: 0;
    line-height: 1;
    height: 1em;
    display: block;
    -webkit-appearance: none;
    appearance: none;
}

.naj-mobile-inp-cas:focus {
    background: var(--surface3);
    border-radius: 3px;
}

.naj-mobile-inp-cas::placeholder {
    color: var(--text3);
    font-weight: 400;
    opacity: .4;
}

/* Dialog / Modal */
.naj-dialog {
    background: var(--surface);
    border: 1px solid var(--border2);
    border-radius: var(--radius-lg);
    padding: 24px;
    width: 100%;
    max-width: 400px;
    box-shadow: 0 24px 60px rgba(0, 0, 0, .4);
}

.naj-dialog-title {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 4px;
    color: var(--text);
}

.naj-dialog-title-icon {
    display: flex;
    align-items: center;
    gap: 8px;
}

.naj-dialog-title-icon svg {
    width: 18px;
    height: 18px;
    color: var(--accent);
    flex-shrink: 0;
}

.naj-dialog-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

@media (max-width: 900px) {
    .naj-dialog-grid {
        grid-template-columns: 1fr;
    }
}

.naj-dialog-section {
    margin-top: 14px;
    margin-bottom: 10px;
}

.naj-dialog-section:first-of-type {
    margin-top: 14px;
}

.naj-dialog-section:last-of-type {
    margin-bottom: 4px;
}

.naj-form-label {
    font-size: 11px;
    font-weight: 600;
    color: var(--text3);
    text-transform: uppercase;
    letter-spacing: .6px;
    margin-bottom: 5px;
    display: block;
}

.naj-input {
    width: 100%;
    box-sizing: border-box;
    background: var(--surface2);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    padding: 8px 12px;
    font-size: 13px;
    color: var(--text);
    font-family: var(--font);
}

.naj-input:focus {
    outline: none;
    border-color: var(--accent);
}

.naj-input::placeholder {
    color: var(--text3);
}

.naj-form-row {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    border-top: 1px solid var(--border);
    padding-top: 14px;
    flex-shrink: 0;
    margin-top: 14px;
}

.naj-checkbox-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
    background: var(--surface2);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    padding: 10px 12px;
}

.naj-checkbox-item {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    font-size: 13px;
    color: var(--text);
}

.naj-checkbox-item input[type="checkbox"] {
    accent-color: var(--accent);
    width: 14px;
    height: 14px;
    cursor: pointer;
}

.naj-checkbox-item span:first-of-type {
    font-weight: 500;
    min-width: 160px;
}

.naj-checkbox-item span:last-of-type {
    font-size: 11px;
    color: var(--text3);
    font-family: var(--font-mono);
}

.naj-email-extra {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 2px;
    padding-top: 6px;
    border-top: 1px solid var(--border);
}

.naj-email-extra input[type="email"] {
    flex: 1;
    background: transparent;
    border: none;
    border-bottom: 1px solid var(--border2);
    padding: 2px 4px;
    font-size: 12px;
    font-family: var(--font-mono);
    color: var(--text);
    outline: none;
}

.naj-dialog-info {
    background: var(--surface2);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    padding: 10px 12px;
    font-size: 12px;
    color: var(--text3);
    line-height: 1.6;
}

.naj-dialog-info strong {
    color: var(--text2);
}

.naj-dialog-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 4px;
}

.naj-dialog-actions-simple {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

.naj-status-box {
    display: none;
    font-size: 12px;
    padding: 8px 12px;
    border-radius: var(--radius-sm);
}

.naj-status-error {
    color: var(--danger);
    margin-bottom: 8px;
}

.naj-btn-cancel {
    padding: 9px 18px;
    background: none;
    border: 1px solid var(--border2);
    border-radius: var(--radius-sm);
    color: var(--text2);
    font-family: var(--font);
    font-size: 13px;
    cursor: pointer;
}

.naj-btn-cancel:hover {
    background: var(--surface2);
}

.naj-btn-send {
    padding: 9px 20px;
    background: var(--accent);
    border: none;
    border-radius: var(--radius-sm);
    color: #fff;
    font-family: var(--font);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 7px;
    transition: opacity .2s;
}

.naj-btn-send:hover {
    opacity: 0.85;
}

.naj-btn-send:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.naj-btn-send svg {
    width: 13px;
    height: 13px;
}

/* Selected workers list */
.naj-vybrane {
    font-size: 11px;
    color: var(--text3);
    margin: 10px 0 4px;
}

.naj-vybrane span {
    font-weight: 600;
    color: var(--accent2);
}

.naj-vybrane-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    min-height: 36px;
    background: var(--surface2);
    border-radius: var(--radius);
    padding: 8px;
}

.naj-tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--accent-soft2, rgba(99, 102, 241, .15));
    border-radius: 20px;
    padding: 3px 10px;
    font-size: 12px;
}

.naj-tag-remove {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text3);
    padding: 0;
    line-height: 1;
    font-size: 14px;
}

.naj-tag-remove:hover {
    color: var(--danger);
}

/* Search results */
.naj-search-results {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    background: var(--surface2);
    border: 1px solid var(--border2);
    border-radius: var(--radius);
    box-shadow: 0 8px 24px rgba(0, 0, 0, .15);
    max-height: 200px;
    overflow-y: auto;
    z-index: 100;
}

.naj-search-results.visible {
    display: block;
}

.naj-result-item {
    padding: 8px 12px;
    cursor: pointer;
    border-bottom: 1px solid var(--border);
    display: flex;
    align-items: center;
    gap: 8px;
    transition: background .1s;
}

.naj-result-item:hover {
    background: var(--accent-soft2);
}

.naj-result-item:last-child {
    border-bottom: none;
}

.naj-result-item span {
    font-weight: 500;
}

.naj-result-empty {
    padding: 10px 14px;
    font-size: 13px;
    color: var(--text3);
}

.naj-result-loading {
    padding: 10px;
    color: var(--text3);
}

/* Existing/novi sections */
.naj-section-label {
    font-size: 11px;
    font-weight: 600;
    color: var(--text3);
    text-transform: uppercase;
    letter-spacing: .5px;
    width: 100%;
    margin-bottom: 4px;
}

.naj-section-label-novi {
    color: var(--accent2, #4ade80);
    margin: 8px 0 4px;
}

/* Target stredisko select */
.naj-select {
    width: 100%;
    margin-bottom: 20px;
    padding: 8px 10px;
    border: 1.5px solid var(--border2);
    border-radius: 8px;
    font-size: 13px;
    background: var(--surface);
    color: var(--text);
}

.naj-select:focus {
    outline: none;
    border-color: var(--accent);
}

/* Email preview */
.naj-email-preview {
    font-family: Inter, Arial, sans-serif;
    font-size: 14px;
    color: #1a1a2e;
    line-height: 1.6;
    max-width: 520px;
}

.naj-email-preview hr {
    border: none;
    border-top: 1px solid #eee;
    margin: 16px 0;
}

.naj-email-preview small {
    font-size: 12px;
    color: #888;
}

/* Dropdown container */
.naj-dropdown {
    display: none;
}

/* Mobile responsive */
@media (max-width: 768px) {
    .naj-tbl-wrap {
        display: none !important;
    }

    .naj-mobile-list {
        display: flex !important;
    }

    .najazdy-header {
        flex-direction: row;
        align-items: center;
    }

    /* Obalka header — 2 riadky na mobile */
    .obalka-header {
        flex-wrap: wrap;
        align-items: center;
        gap: 4px 8px;
        padding: 7px 10px;
    }

    /* Riadok 1: nazov · lock · datum · count */
    .obalka-nazov { order: 1; font-size: 13px; }
    .naj-lock-icon { order: 2; }
    .obalka-datum  { order: 3; font-size: 11px; }

    .obalka-count {
        order: 4;
        font-size: 0;
        padding: 2px 8px;
    }
    .obalka-count::before {
        content: attr(data-count);
        font-size: 12px;
        font-weight: 600;
    }
    .obalka-count::after {
        content: " os.";
        font-size: 12px;
        font-weight: 600;
    }

    /* Zlom na nový riadok */
    .obalka-header::after {
        content: "";
        order: 4;
        width: 100%;
        height: 0;
    }

    /* Riadok 2: akcie + chevron */
    .naj-actions {
        order: 5;
        flex: 1;
        margin-left: 0;
        margin-right: 0;
        gap: 5px;
    }

    .chevron { order: 6; }
}