/* Modern ticket-lista (app/ticketing/ticket/modern) stílusai.
   Minden szabály .mtl- előtaggal névtérezett, a lista gyökér-eleme a .mtl-wrap.
   Korábban a list.html <style> blokkjában élt — a konvenció szerint CSS fájlba került. */

.mtl-wrap{ --b:#e6e8eb; --bg:#f7f8fa; --card:#fff; --tx:#1f2d3d; --mut:#8a94a6; --pri:#2c7be5;
    --dng:#e63757; --amb:#f6803c; --yel:#f6c343; --grn:#00b274; --gry:#95aac9; --teal:#16a8a0; --pur:#8e5bd8;
    color:var(--tx); position:relative; font-size:14px; }
.mtl-wrap *{ box-sizing:border-box; }
.mtl-wrap a{ cursor:pointer; }

/* fejléc */
.mtl-pagehead{ display:flex; align-items:flex-start; gap:12px; margin-bottom:16px; flex-wrap:wrap; }
.mtl-pagehead h2{ margin:0; font-size:24px; font-weight:700; }
.mtl-pagehead .mtl-sub{ color:var(--mut); font-size:13px; margin-top:3px; }
.mtl-head-actions{ margin-left:auto; display:flex; gap:8px; flex-wrap:wrap; }
.mtl-btn{ height:38px; padding:0 14px; border:1px solid var(--b); background:var(--card); border-radius:8px;
    color:var(--tx); cursor:pointer; font-size:13px; display:inline-flex; align-items:center; gap:7px; white-space:nowrap; }
.mtl-btn:hover{ background:#f0f3f7; }
.mtl-btn-pri{ background:var(--pri); border-color:var(--pri); color:#fff; font-weight:600; }
.mtl-btn-pri:hover{ filter:brightness(.96); }

/* KPI kártyák */
.mtl-kpis{ display:flex; gap:14px; margin-bottom:16px; overflow-x:auto; padding-bottom:2px; }
.mtl-kpi{ flex:1 0 0; min-width:175px; background:var(--card); border:1px solid var(--b);
    border-radius:12px; padding:14px 16px; cursor:pointer; transition:box-shadow .15s, border-color .15s; }
.mtl-kpi:hover{ box-shadow:0 2px 12px rgba(31,45,61,.08); border-color:#d3dae3; }
.mtl-kpi.mtl-kpi-on{ border-color:var(--pri); box-shadow:0 0 0 2px rgba(44,123,229,.14); }
.mtl-kpi-row{ display:flex; align-items:center; gap:13px; }
.mtl-kpi-ic{ width:46px; height:46px; min-width:46px; border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:20px; flex:0 0 46px; }
.mtl-kpi-info{ min-width:0; }
.mtl-kpi-blue{ background:#e7f0fd; color:var(--pri); }
.mtl-kpi-amber{ background:#fff1e0; color:#d8641a; }
.mtl-kpi-red{ background:#fde8ec; color:var(--dng); }
.mtl-kpi-purple{ background:#f1e9fb; color:var(--pur); }
.mtl-kpi-teal{ background:#ddf4f2; color:var(--teal); }
.mtl-kpi-green{ background:#d7f5ea; color:var(--grn); }
.mtl-kpi-lbl{ color:var(--mut); font-size:13px; font-weight:500; }
.mtl-kpi-val{ font-size:27px; font-weight:700; line-height:1.1; margin-top:2px; }
.mtl-kpi-trend{ font-size:12px; color:var(--grn); display:flex; align-items:center; gap:5px; margin-top:11px; }
.mtl-kpi-trend.mtl-down{ color:var(--dng); }
.mtl-kpi-trend .mtl-tm{ color:var(--mut); }

/* szűrő-sáv */
.mtl-panel{ background:var(--card); border:1px solid var(--b); border-radius:12px; padding:14px; margin-bottom:14px; }
.mtl-filterrow{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.mtl-search{ position:relative; display:flex; flex:1 1 220px; min-width:190px; }
.mtl-search input{ height:38px; width:100%; border:1px solid var(--b); border-radius:8px; padding:0 52px 0 34px; outline:none; font-size:13px; }
.mtl-search input:focus{ border-color:var(--pri); box-shadow:0 0 0 2px rgba(44,123,229,.12); }
.mtl-search .mtl-si{ position:absolute; left:12px; top:11px; color:var(--mut); }
.mtl-search .mtl-sx{ position:absolute; right:10px; top:11px; color:var(--mut); cursor:pointer; }
/* pontos (kifejezés-) keresés kapcsoló-ikon — bekapcsolva kék */
.mtl-search .mtl-sm{ position:absolute; right:30px; top:11px; color:var(--mut); cursor:pointer; }
.mtl-search .mtl-sm.mtl-on{ color:var(--pri); }
.mtl-fdrop > .mtl-btn{ font-weight:500; }
.mtl-fdrop.mtl-fdrop-on > .mtl-btn{ border-color:var(--pri); color:var(--pri); }
.mtl-dd{ min-width:240px; max-height:300px; overflow:auto; padding:6px; }
.mtl-dd-wide{ min-width:300px; }
.mtl-opt{ display:flex; align-items:center; gap:8px; padding:6px 8px; border-radius:6px; cursor:pointer; font-size:13px; }
.mtl-opt:hover{ background:#f3f6fa; }
.mtl-opt .fa{ width:14px; color:var(--pri); }
.mtl-opt .mtl-oc{ margin-left:auto; color:var(--mut); font-size:11px; }
.mtl-toggle{ display:inline-flex; align-items:center; gap:9px; font-size:13px; color:var(--tx); cursor:pointer; }
.mtl-sw{ width:38px; height:21px; border-radius:11px; background:#cfd6df; position:relative; transition:background .15s; flex:0 0 38px; }
.mtl-sw::after{ content:''; position:absolute; top:2px; left:2px; width:17px; height:17px; border-radius:50%; background:#fff; transition:left .15s; }
.mtl-toggle.mtl-on .mtl-sw{ background:var(--pri); }
.mtl-toggle.mtl-on .mtl-sw::after{ left:19px; }
.mtl-filterrow2{ display:flex; align-items:center; gap:16px; margin-top:12px; flex-wrap:wrap; }
.mtl-link{ color:var(--pri); cursor:pointer; font-size:13px; display:inline-flex; align-items:center; gap:6px; }
.mtl-link.mtl-mut{ color:var(--mut); }
.mtl-more{ display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:14px; margin-top:12px; padding-top:12px; border-top:1px solid var(--b); }
.mtl-flabel{ font-size:11px; text-transform:uppercase; letter-spacing:.04em; color:var(--mut); font-weight:700; margin-bottom:6px; }
.mtl-opts-sm{ max-height:130px; overflow:auto; }
.mtl-pick{ margin-top:6px; }

/* nézetváltó + mentett-nézet pillek */
.mtl-viewsbar{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:12px; }
.mtl-seg{ display:inline-flex; border:1px solid var(--b); border-radius:9px; overflow:hidden; background:var(--card); }
.mtl-seg button{ border:0; background:transparent; padding:8px 16px; cursor:pointer; font-size:13px; color:var(--mut); display:inline-flex; gap:7px; align-items:center; font-weight:500; }
.mtl-seg button.mtl-on{ background:#eaf2fd; color:var(--pri); font-weight:600; }
.mtl-pills{ display:flex; gap:7px; flex-wrap:wrap; margin-left:auto; align-items:center; }
.mtl-pill-v{ display:inline-flex; align-items:center; gap:7px; padding:6px 13px; border:1px solid var(--b);
    background:var(--card); border-radius:8px; font-size:13px; cursor:pointer; color:var(--tx); }
.mtl-pill-v:hover{ border-color:var(--pri); }
.mtl-pill-v.mtl-on{ background:#eaf2fd; border-color:#cfe0fb; color:var(--pri); font-weight:600; }
.mtl-pill-v .fa{ color:var(--gry); font-size:11px; }
.mtl-pill-v.mtl-on .fa{ color:var(--pri); }
/* "Nézet mentése" pill: rendes gomb-kinézet (tömör keret, primer szín) */
.mtl-pill-add{ color:var(--pri); border:1px solid var(--pri); font-weight:600; }
.mtl-pill-add .fa{ color:var(--pri); }
.mtl-pill-add:hover{ background:#eaf2fd; }

/* chipek */
.mtl-chips{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-bottom:12px; }
.mtl-chip{ display:inline-flex; align-items:center; gap:6px; padding:4px 8px 4px 11px; background:#eef3fb;
    color:#1c4f91; border:1px solid #d4e3f7; border-radius:14px; font-size:12px; }
.mtl-chip i{ cursor:pointer; opacity:.7; }
.mtl-chip i:hover{ opacity:1; }
.mtl-chip-clear{ color:var(--dng); cursor:pointer; font-size:12px; font-weight:600; margin-left:4px; }

/* badge-ek */
.mtl-pill{ display:inline-block; padding:3px 11px; border-radius:14px; font-size:12px; font-weight:600; white-space:nowrap; }
.mtl-st-new{ background:#e7f0fd; color:#1c5fc0; }
.mtl-st-wait{ background:#fff1e0; color:#b3631a; }
.mtl-st-answered{ background:#d7f5ea; color:#067a53; }
.mtl-st-overdue{ background:#fde8ec; color:#c0182f; }
.mtl-st-progress{ background:#fef3d6; color:#9a7400; }
.mtl-st-closed{ background:#eef1f5; color:#5b6b80; }
.mtl-prio{ display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:600; white-space:nowrap; }
.mtl-prio .mtl-pd{ width:8px; height:8px; border-radius:50%; display:inline-block; }
.mtl-prio .mtl-esc{ color:var(--dng); font-size:11px; }
.mtl-pr-urgent{ color:var(--dng); } .mtl-pr-urgent .mtl-pd{ background:var(--dng); }
.mtl-pr-high{ color:var(--dng); } .mtl-pr-high .mtl-pd{ background:var(--dng); }
.mtl-pr-normal{ color:#d8641a; } .mtl-pr-normal .mtl-pd{ background:var(--amb); }
.mtl-pr-low{ color:#067a53; } .mtl-pr-low .mtl-pd{ background:var(--grn); }
.mtl-pr-default{ color:var(--mut); } .mtl-pr-default .mtl-pd{ background:var(--gry); }
.mtl-prio-pill{ padding:2px 9px 2px 8px; border-radius:12px; }
.mtl-pr-urgent.mtl-prio-pill, .mtl-pr-high.mtl-prio-pill{ background:#fde8ec; }
.mtl-pr-normal.mtl-prio-pill{ background:#fff1e0; }
.mtl-pr-low.mtl-prio-pill{ background:#d7f5ea; }
.mtl-overdue{ color:var(--dng)!important; }
.mtl-due-soon{ color:#d8641a!important; }

/* táblázat nézet */
.mtl-tablewrap{ background:var(--card); border:1px solid var(--b); border-radius:12px; overflow:auto; }
table.mtl-table{ width:100%; border-collapse:collapse; font-size:13px; }
table.mtl-table thead th{ text-align:left; padding:12px 14px; color:var(--mut); font-weight:600; font-size:12px;
    border-bottom:1px solid var(--b); white-space:nowrap; background:#fbfcfd; cursor:pointer; user-select:none; }
table.mtl-table thead th.mtl-nosort{ cursor:default; }
table.mtl-table thead th .fa{ opacity:.55; font-size:11px; }
table.mtl-table tbody td{ padding:12px 14px; border-bottom:1px solid #f0f2f5; vertical-align:middle; }
table.mtl-table tbody tr{ cursor:pointer; }
table.mtl-table tbody tr:hover{ background:#f7faff; }
table.mtl-table tbody tr.mtl-row-active{ background:#eef5ff; box-shadow:inset 3px 0 0 var(--pri); }
/* törölt (soft-deleted) jegy: piros árnyalatú sor, áthúzott tárgy/azonosító */
table.mtl-table tbody tr.mtl-deleted{ background:#fbeef0; box-shadow:inset 3px 0 0 var(--dng); }
table.mtl-table tbody tr.mtl-deleted:hover{ background:#f8e4e8; }
table.mtl-table tbody tr.mtl-deleted.mtl-row-active{ background:#f6dde2; box-shadow:inset 3px 0 0 var(--dng); }
table.mtl-table tbody tr.mtl-deleted .mtl-cell-subject span,
table.mtl-table tbody tr.mtl-deleted .mtl-id{ text-decoration:line-through; color:var(--mut); }
.mtl-tcard.mtl-deleted{ background:#fbeef0; border-color:#f1c9d0; }
.mtl-tcard.mtl-deleted .mtl-card-subj{ text-decoration:line-through; color:var(--mut); }
.mtl-badge-deleted{ display:inline-block; font-size:11px; font-weight:600; color:#fff; background:var(--dng); border-radius:4px; padding:1px 6px; margin-left:6px; white-space:nowrap; }
/* olvasatlan / új aktivitás jelző: kék pötty + darabszám */
.mtl-badge-unseen{ display:inline-flex; align-items:center; justify-content:center; min-width:18px; height:18px; padding:0 5px; font-size:11px; font-weight:700; line-height:1; color:#fff; background:var(--pri); border-radius:9px; margin-left:6px; vertical-align:middle; }
.mtl-unseen-subj{ font-weight:800; }
/* összevonás (merge) fül */
.mtl-merge-search{ display:flex; gap:6px; }
.mtl-merge-search input{ flex:1 1 auto; }
.mtl-merge-results{ max-height:230px; overflow-y:auto; margin-top:4px; }
.mtl-merge-row{ padding:8px 10px; border:1px solid var(--b); border-radius:8px; margin-bottom:6px; cursor:pointer; }
.mtl-merge-row:hover{ background:#f7faff; border-color:#d3dae3; }
.mtl-merge-target{ padding:8px 10px; border:1px solid #cfe0fb; background:#eaf2fd; border-radius:8px; }
.mtl-merge-sub{ color:var(--mut); font-size:12px; margin-top:2px; }
.mtl-merge-hmode{ margin:2px 0 6px 20px; display:flex; gap:14px; flex-wrap:wrap; font-size:13px; }
.mtl-id{ color:var(--pri); font-weight:600; white-space:nowrap; }
.mtl-cell-subject{ font-weight:600; max-width:260px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mtl-ai-sum{ color:var(--pur); cursor:help; }
/* leírás oszlop: rövidített sima szöveg (mint a tárgy), tompítva; eleji ikon a teljes megtekintéshez */
.mtl-cell-desc{ max-width:240px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--mut); font-size:13px; }
.mtl-desc-ic{ color:var(--pri); cursor:pointer; }
.mtl-wrap .tooltip-inner{ max-width:340px; text-align:left; }
.mtl-cust{ font-weight:500; }
.mtl-cust small{ display:block; color:var(--mut); font-weight:400; }
.mtl-assignee{ display:inline-flex; align-items:center; gap:7px; white-space:nowrap; }
.mtl-asg-ic{ color:var(--mut); font-size:14px; flex:0 0 auto; }
.mtl-asg-none{ color:var(--mut); }
.mtl-sla-sm{ white-space:nowrap; line-height:1.25; }
.mtl-sla-sm .mtl-slatop{ font-weight:600; }
.mtl-sla-sm small{ display:block; color:var(--mut); font-size:11px; }
.mtl-th-gear{ width:36px; text-align:center; }
.mtl-kebab{ color:var(--mut); font-size:16px; padding:4px 8px; border-radius:6px; }
.mtl-kebab:hover{ color:var(--pri); background:#eef3fb; }

/* kártya nézet */
.mtl-cards{ display:grid; grid-template-columns:repeat(auto-fill,minmax(330px,1fr)); gap:14px; }
.mtl-tcard{ position:relative; background:var(--card); border:1px solid var(--b); border-radius:12px;
    padding:14px 16px 12px 18px; cursor:pointer; overflow:hidden; }
.mtl-tcard:hover{ box-shadow:0 2px 12px rgba(31,45,61,.08); border-color:#d3dae3; }
.mtl-tcard.mtl-row-active{ border-color:var(--pri); box-shadow:0 0 0 2px rgba(44,123,229,.14); }
.mtl-tcard .mtl-stripe{ position:absolute; left:0; top:0; bottom:0; width:4px; }
.mtl-stripe.mtl-st-new{ background:var(--pri); } .mtl-stripe.mtl-st-wait,.mtl-stripe.mtl-st-progress{ background:var(--yel); }
.mtl-stripe.mtl-st-answered{ background:var(--grn); } .mtl-stripe.mtl-st-overdue{ background:var(--dng); } .mtl-stripe.mtl-st-closed{ background:var(--gry); }
.mtl-cardhead{ display:flex; align-items:center; gap:8px; }
.mtl-cardhead .mtl-slatop{ font-size:12px; font-weight:700; }
.mtl-card-subj{ font-weight:700; font-size:15px; margin:9px 0 7px; }
.mtl-card-meta{ color:var(--mut); font-size:12px; display:flex; gap:6px; flex-wrap:wrap; align-items:center; }
.mtl-card-meta .mtl-cust small{ display:inline; }
.mtl-card-row{ display:flex; align-items:center; gap:8px; margin-top:10px; font-size:12px; color:var(--mut); flex-wrap:wrap; }
.mtl-card-actions{ display:flex; gap:7px; margin-top:12px; border-top:1px solid #f0f2f5; padding-top:11px; }
.mtl-cabtn{ flex:1; border:1px solid var(--b); background:#fff; border-radius:7px; padding:7px 4px; font-size:12px;
    cursor:pointer; color:var(--tx); display:inline-flex; align-items:center; justify-content:center; gap:5px; }
.mtl-cabtn:hover{ background:#f0f3f7; }

.mtl-empty{ text-align:center; color:var(--mut); padding:52px 12px; background:var(--card); border:1px dashed var(--b); border-radius:12px; }
.mtl-empty .fa-inbox{ opacity:.4; }
.mtl-loading{ text-align:center; padding:52px 12px; color:var(--pri); }
.mtl-group-head{ display:flex; align-items:center; gap:8px; padding:9px 13px; margin:14px 0 8px;
    background:#eef1f5; border:1px solid var(--b); border-radius:8px; font-weight:600; cursor:pointer; }
.mtl-group-head .mtl-spc{ color:var(--mut); }

/* részletező drawer */
.mtl-backdrop{ display:none; position:fixed; inset:0; background:rgba(31,45,61,.35); z-index:1040; }
.mtl-wrap.mtl-has-drawer .mtl-backdrop{ display:block; }
.mtl-drawer{ position:fixed; top:0; right:0; height:100%; width:50%; max-width:94vw; background:var(--card);
    border-left:1px solid var(--b); box-shadow:-6px 0 24px rgba(31,45,61,.12); z-index:1041;
    transform:translateX(100%); transition:transform .2s ease; display:flex; flex-direction:column; }
.mtl-wrap.mtl-has-drawer .mtl-drawer{ transform:translateX(0); }
.mtl-dr-head{ display:flex; align-items:center; gap:10px; padding:15px 18px; border-bottom:1px solid var(--b); }
.mtl-dr-head .mtl-id{ font-size:16px; }
.mtl-dr-head .mtl-spc{ display:flex; gap:4px; }
.mtl-dr-ic{ color:var(--mut); cursor:pointer; font-size:15px; padding:5px; border-radius:6px; }
.mtl-dr-ic:hover{ color:var(--pri); background:#eef3fb; }
.mtl-dr-del{ color:var(--dng); }
.mtl-dr-del:hover{ color:var(--dng); background:#fde8ec; }
/* a drawer-fejléc alatti megerősítő alert-dobozok behúzása */
.mtl-dr-alert{ margin:12px 18px 0; }
.mtl-dr-badges{ display:flex; gap:9px; align-items:center; padding:12px 18px 0; }
.mtl-dr-subj{ font-size:17px; font-weight:700; padding:10px 18px 0; }
.mtl-dr-summary{ padding:14px 18px 4px; }
.mtl-tabs{ display:flex; gap:2px; padding:6px 18px 0; border-bottom:1px solid var(--b); }
.mtl-tab{ padding:9px 13px; cursor:pointer; font-size:13px; color:var(--mut); border-bottom:2px solid transparent; margin-bottom:-1px; }
.mtl-tab.mtl-on{ color:var(--pri); border-bottom-color:var(--pri); font-weight:600; }
.mtl-dr-body{ flex:1 1 auto; overflow:auto; padding:16px 18px; }
.mtl-dr-field{ margin-bottom:16px; }
.mtl-dr-field.mtl-dr-field-tight{ margin-bottom:6px; }
.mtl-dr-field .mtl-k{ font-size:11px; text-transform:uppercase; letter-spacing:.04em; color:var(--mut); font-weight:700; margin-bottom:5px; display:flex; align-items:center; }
.mtl-dr-field .mtl-v{ font-size:14px; }
/* a szélesebb drawerben a rövid meta-mezők 2 oszlopban */
.mtl-dr-grid{ display:flex; flex-wrap:wrap; }
.mtl-dr-grid .mtl-dr-field{ width:50%; padding-right:12px; box-sizing:border-box; }
/* a summary Ügyfél + SLA blokkja is férjen el egymás mellett a széles drawerben */
.mtl-dr-summary{ display:flex; flex-wrap:wrap; }
.mtl-dr-summary .mtl-dr-field{ width:50%; padding-right:12px; box-sizing:border-box; }
/* AI-jelvény + Áttekintettem sor a fülmenü felett (bármely fülről nyugtázható) */
.mtl-dr-ai{ display:flex; align-items:center; flex-wrap:wrap; gap:9px; padding:0 18px 8px; }
/* bal beúszó: Felelős szerinti szűrés (a régi dashboard-oldalsáv modern párja);
   a bal szélen ülő kompakt ikon-fogantyú nyitja */
.mtl-lhandle{ position:fixed; left:0; top:42%; z-index:1039; background:var(--card); border:1px solid var(--b); border-left:none;
    border-radius:0 9px 9px 0; padding:9px 8px; cursor:pointer; color:var(--mut); font-size:14px;
    box-shadow:2px 0 8px rgba(31,45,61,.08); }
.mtl-lhandle:hover{ color:var(--pri); background:#eef3fb; }
.mtl-lbackdrop{ display:none; position:fixed; inset:0; background:rgba(31,45,61,.35); z-index:1040; }
.mtl-wrap.mtl-has-ldrawer .mtl-lbackdrop{ display:block; }
.mtl-ldrawer{ position:fixed; top:0; left:0; height:100%; width:340px; max-width:92vw; background:var(--card);
    border-right:1px solid var(--b); box-shadow:6px 0 24px rgba(31,45,61,.12); z-index:1041;
    transform:translateX(-100%); transition:transform .2s ease; display:flex; flex-direction:column; }
.mtl-wrap.mtl-has-ldrawer .mtl-ldrawer{ transform:translateX(0); }
.mtl-ldr-head{ display:flex; align-items:center; gap:9px; padding:15px 18px; border-bottom:1px solid var(--b); font-weight:700; }
.mtl-ldr-search{ padding:10px 14px 4px; }
.mtl-ldr-search input{ width:100%; border:1px solid var(--b); border-radius:8px; padding:7px 11px; font-size:13px; outline:none; }
.mtl-ldr-search input:focus{ border-color:var(--pri); }
.mtl-ldr-body{ flex:1 1 auto; overflow:auto; padding:8px 0 16px; }
.mtl-ldr-row{ display:flex; align-items:center; gap:9px; padding:8px 18px; cursor:pointer; font-size:13.5px; }
.mtl-ldr-row:hover{ background:#f4f7fb; }
.mtl-ldr-row.mtl-on{ background:#e7f0fd; color:var(--pri); font-weight:600; }
.mtl-ldr-none{ color:var(--dng); }
.mtl-ldr-cnt{ margin-left:auto; background:#eef1f5; border-radius:10px; padding:1px 8px; font-size:11.5px; color:var(--mut); }
.mtl-ldr-row.mtl-on .mtl-ldr-cnt{ background:#d5e5fb; color:var(--pri); }
.mtl-ldr-empty{ padding:14px 18px; color:var(--mut); font-size:13px; }
.mtl-dr-summary .mtl-dr-cust{ width:100%; }
/* gyors átvétel: a statikus érték ALATT nyíló kompakt szerkesztő-panel
   (termék-választó / átadás) — a mező saját fél-oszlopában marad */
.mtl-qt-panel{ margin-top:8px; }
.mtl-qt-panel .mtl-merge-results{ max-height:180px; overflow:auto; }
/* billentyűvel kiemelt találat (↑/↓ lépkedés) */
.mtl-qt-panel .mtl-merge-row.mtl-on{ background:#e7f0fd; color:var(--pri); }
@media (max-width: 700px){
    .mtl-dr-grid .mtl-dr-field, .mtl-dr-summary .mtl-dr-field{ width:100%; }
}
.mtl-dr-cust .mtl-cl{ color:var(--mut); font-size:13px; display:flex; align-items:center; gap:7px; margin-top:3px; }
.mtl-dr-row{ display:flex; align-items:center; gap:9px; }
.mtl-slabar{ height:6px; border-radius:3px; background:#eef1f5; overflow:hidden; margin-top:7px; }
.mtl-slabar > div{ height:100%; }
.mtl-tag{ display:inline-block; background:#eef1f5; color:#5b6b80; border-radius:6px; padding:3px 9px; font-size:12px; margin:0 5px 5px 0; }
.mtl-tag-add{ border:1px dashed var(--gry); background:#fff; color:var(--mut); cursor:pointer; }
/* csatolmány-lista + hover-előnézet */
.mtl-att-list{ display:flex; flex-direction:column; gap:6px; }
.mtl-att-row{ display:flex; align-items:center; gap:11px; padding:9px 11px; border:1px solid var(--b); border-radius:9px; background:var(--card); }
.mtl-att-badge{ flex:0 0 auto; min-width:38px; height:38px; padding:0 7px; display:flex; align-items:center; justify-content:center;
    background:#eef1f5; border-radius:7px; font-size:11px; font-weight:700; text-transform:uppercase; color:var(--mut); }
.mtl-att-meta{ flex:1 1 auto; min-width:0; }
.mtl-att-name{ font-size:13px; font-weight:600; max-width:100%; }
.mtl-att-sub{ font-size:11px; color:var(--mut); margin-top:2px; }
.mtl-att-actions{ flex:0 0 auto; display:flex; gap:4px; }
.mtl-att-actions i, .mtl-att-actions a{ color:var(--mut); cursor:pointer; padding:6px; border-radius:6px; font-size:14px; }
.mtl-att-actions i:hover, .mtl-att-actions a:hover{ color:var(--pri); background:#eef3fb; }
/* előnézet a fájltípus-badge-re víve (csak previewable típusnál). A badge a sor
   bal szélén (a drawer bal éle ~50vw+), a panel a bal sávban (~50vw-ig) → gap marad,
   sosem takarják egymást, nincs mouseenter/leave-villódzás. */
.mtl-att-badge.mtl-att-hot{ cursor:zoom-in; }
.mtl-att-badge.mtl-att-hot:hover{ background:#e2ecfb; color:var(--pri); }
/* A panel a bal sávban: jobb széle a beúszó bal éléhez (50%) kötve, 16px réssel —
   így NEM ér a badge fölé. pointer-events:none: az egéresemények átmennek rajta,
   ezért ha valamiért mégis fedné a badge-et, akkor sincs bezár/kinyit villódzás
   (az egér a badge-en marad). Glance-előnézet — az interakció a sor letöltés-gombján. */
.mtl-att-preview{ position:fixed; top:70px; left:16px; right:calc(50% + 16px); height:calc(100vh - 120px);
    background:var(--card); border:1px solid var(--b); border-radius:12px; box-shadow:0 16px 48px rgba(31,45,61,.28);
    z-index:1050; display:flex; flex-direction:column; overflow:hidden; pointer-events:none; }
.mtl-att-pv-head{ display:flex; align-items:center; gap:10px; padding:10px 14px; border-bottom:1px solid var(--b); font-size:13px; font-weight:600; }
.mtl-att-pv-head span{ min-width:0; }
.mtl-att-pv-head a{ margin-left:auto; flex:0 0 auto; color:var(--mut); }
.mtl-att-pv-body{ flex:1 1 auto; overflow:auto; background:#f5f5f5; display:flex; align-items:flex-start; justify-content:center; }
.mtl-att-pv-body img{ max-width:100%; height:auto; }
.mtl-att-pv-body embed{ width:100%; height:100%; }
/* keskeny képernyőn nincs bal oldali üres sáv → hover-előnézet elrejtve (letöltés marad) */
@media (max-width: 991px){ .mtl-att-preview{ display:none; } }

/* bal oldali NAGY dokumentum-megtekintő: a drawer (50%) melletti teljes maradék sáv.
   Az iratkezelő "Dokumentum betekintő" mintája beúszó-léptékben: fülek + eszközsor + törzs. */
.mtl-att-row.mtl-att-openable{ cursor:pointer; }
.mtl-att-row.mtl-att-openable:hover{ background:#f4f7fb; }
/* bal szélen egy sáv szabadon marad (átlátszik a lista) — az arra kattintás zárja
   a megtekintőt (mtl-dv-backdrop), nem kell a fejléc X-éig egerezni */
.mtl-dviewer{ position:fixed; top:0; bottom:0; left:240px; right:50%; background:var(--card);
    border-left:1px solid var(--b); border-right:1px solid var(--b);
    box-shadow:-6px 0 24px rgba(31,45,61,.18); z-index:1042;
    display:flex; flex-direction:column; }
/* láthatatlan katt-elkapó a bal sávra: MINDENT zár (megtekintő + beúszó) egy
   kattintással — kolléga-kérés, a kétlépcsős zárás lassúnak bizonyult */
.mtl-dv-backdrop{ position:fixed; top:0; bottom:0; left:0; right:50%; z-index:1041; background:transparent; }
.mtl-dv-head{ display:flex; align-items:center; gap:6px; padding:8px 10px 0; border-bottom:1px solid var(--b); }
.mtl-dv-tabs{ display:flex; gap:2px; overflow-x:auto; overflow-y:hidden; flex:1 1 auto; }
.mtl-dv-tab{ padding:8px 12px; cursor:pointer; font-size:12.5px; color:var(--mut);
    border-bottom:2px solid transparent; margin-bottom:-1px; max-width:220px; overflow:hidden; text-overflow:ellipsis; flex:0 0 auto; }
.mtl-dv-tab:hover{ color:var(--pri); }
.mtl-dv-tab.mtl-on{ color:var(--pri); border-bottom-color:var(--pri); font-weight:600; }
.mtl-dv-close{ flex:0 0 auto; margin-bottom:4px; }
.mtl-dv-bar{ display:flex; align-items:center; gap:8px; padding:7px 12px; border-bottom:1px solid var(--b); }
.mtl-dv-meta{ color:var(--mut); font-size:12px; }
.mtl-dv-zoom{ cursor:pointer; font-size:12.5px; color:var(--mut); min-width:44px; text-align:center; }
.mtl-dv-zoom:hover{ color:var(--pri); }
.mtl-dv-body{ flex:1 1 auto; overflow:auto; background:#f5f5f5; display:flex; align-items:flex-start; justify-content:center; }
.mtl-dv-body img{ height:auto; display:block; }
.mtl-dv-body embed{ width:100%; height:100%; }
.mtl-dv-nopv{ align-self:center; text-align:center; color:var(--mut); display:flex; flex-direction:column; gap:12px; align-items:center; padding:20px; }
/* keskeny képernyőn (a drawer szinte teljes szélességű) a megtekintő ÉS a nyitó gombja rejtve */
@media (max-width: 991px){ .mtl-dviewer, .mtl-dv-backdrop, .mtl-btn-dviewer{ display:none; } }
/* közepes szélességen kisebb bal sáv, hogy a doksinak maradjon értelmes hely */
@media (max-width: 1400px){ .mtl-dviewer{ left:140px; } }
.mtl-dr-foot{ border-top:1px solid var(--b); padding:12px 18px; display:flex; gap:8px; }
.mtl-dr-foot .mtl-btn{ flex:1; justify-content:center; }
.mtl-dr-foot .mtl-btn[disabled]{ opacity:.5; cursor:not-allowed; }
.mtl-btn.mtl-on{ border-color:var(--pri); color:var(--pri); }
.mtl-dr-status{ border-top:1px solid var(--b); padding:12px 18px; }
/* állapotváltó panel apró elemei */
.mtl-dr-load{ padding:8px; }
.mtl-alert-flat{ margin:0; }
.mtl-checkbox-tight{ margin:6px 0 0; }

/* FAB (mobil) */
.mtl-fab{ display:none; position:fixed; right:18px; bottom:18px; z-index:1030; height:54px; padding:0 22px;
    border:0; border-radius:27px; background:var(--pri); color:#fff; font-weight:600; box-shadow:0 6px 18px rgba(44,123,229,.4);
    align-items:center; gap:8px; cursor:pointer; }
.mtl-mobile-filt{ display:none; }

/* --- korábbi inline style-okat kiváltó utility/kontextus-osztályok --- */
/* jobbra toló spacer/elem (margin-left:auto) — kontextustól függetlenül */
.mtl-wrap .mtl-spc{ margin-left:auto; }
/* dropdown-elem beágyazott (kendo) kereső-inputtal; a .k-widget szabály a kendo
   wrapper szélességét adja (az input inline width-je korábban ezt vezérelte) */
.mtl-dd-item{ padding:6px; }
.mtl-dd-item > input, .mtl-dd-item .k-widget{ width:100%; }
/* egyedi dátum-intervallum sor a Dátum dropdown alján */
.mtl-pick-range{ display:flex; gap:6px; padding:4px 8px; }
.mtl-pick-range .mtl-btn{ flex:1; }
/* nézet-mentése panel beviteli sora */
.mtl-save-view-row{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.mtl-save-view-row select.form-control{ width:auto; max-width:220px; }
.mtl-save-view-row input.form-control{ width:220px; }
/* "Aktív szűrők:" felirat a chip-sorban */
.mtl-chips-lbl{ font-size:12px; }
/* csoport-fejléces táblázatsor: a cella paddingját a csoport-fejléc adja */
table.mtl-table tbody td.mtl-td-flush{ padding:0; }
/* pager panel kompakt változata */
.mtl-pager-panel{ padding:8px 14px; margin-top:14px; }

@media (max-width:991px){
    .mtl-kpi{ flex:1 0 160px; min-width:160px; }
    .mtl-cell-subject{ max-width:160px; }
    .mtl-cell-desc{ max-width:120px; }
    .mtl-fab{ display:inline-flex; }
    .mtl-pills{ margin-left:0; }
    .mtl-filterrow .mtl-fdrop, .mtl-filterrow .mtl-datebtn{ display:none; }
    .mtl-mobile-filt{ display:inline-flex; }
    .mtl-drawer{ width:94vw; }
    .mtl-ldrawer{ width:88vw; }
}
@media (max-width:640px){
    .mtl-cards{ grid-template-columns:1fr; }
    .mtl-head-actions .mtl-hide-xs{ display:none; }
}