:root{--bg:#071018;--bg2:#0b1620;--panel:#0d1b26;--panel2:#102330;--line:#203847;--text:#eef6f7;--muted:#86a1ad;--accent:#2dd4bf;--accent2:#22c55e;--warn:#f59e0b;--danger:#ef4444}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,Segoe UI,Arial,sans-serif;background:radial-gradient(circle at 55% 10%,#102b37 0,#071018 38%,#050b10 100%);color:var(--text)}
button,input,select{font:inherit}.shell{min-height:100vh;display:grid;grid-template-columns:245px 1fr}.sidebar{border-right:1px solid var(--line);background:rgba(5,14,20,.92);padding:22px 16px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh}.brand{display:flex;gap:12px;align-items:center;padding:4px 6px 28px}.brand img{width:48px;height:48px;object-fit:contain}.brand strong{display:block;letter-spacing:1.4px}.brand small{display:block;color:var(--accent);font-size:10px;letter-spacing:2px;margin-top:4px}.sidebar nav{display:grid;gap:8px}.nav{border:0;background:transparent;color:#9eb0ba;text-align:left;padding:13px 14px;border-radius:10px;cursor:pointer}.nav.active,.nav:hover{background:#112631;color:#fff}.nav.active{box-shadow:inset 3px 0 var(--accent)}.side-bottom{margin-top:auto;padding:12px}.side-bottom a{color:#93aab4;text-decoration:none}main{padding:24px 28px 42px;min-width:0}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}header h1{font-size:24px;margin:0 0 4px}header p{margin:0;color:var(--muted)}#clock{color:#a9bdc6}.stats{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:14px;margin-bottom:16px}.stat,.panel{border:1px solid var(--line);background:linear-gradient(145deg,rgba(15,34,46,.96),rgba(8,23,32,.96));border-radius:14px;box-shadow:0 16px 45px rgba(0,0,0,.16)}.stat{padding:17px 19px}.stat span{display:block;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.8px}.stat strong{display:block;font-size:25px;margin-top:8px}.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(300px,.8fr);gap:16px}.panel{padding:16px}.panel-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.panel-title h2{font-size:15px;margin:0}.panel-title button,.filters button,.pair-box button,.device-actions button{background:#123541;color:#dff;border:1px solid #286071;border-radius:8px;padding:8px 11px;cursor:pointer}.panel-title button:hover,.filters button:hover,.pair-box button:hover,.device-actions button:hover{border-color:var(--accent)}#map{height:610px;border-radius:11px;background:#0a151c}.device-list{display:grid;gap:10px;max-height:610px;overflow:auto}.device{border:1px solid #1d3947;background:#0b1a23;border-radius:11px;padding:13px}.device-head{display:flex;justify-content:space-between;gap:10px}.device-name{font-weight:700}.badge{font-size:10px;padding:4px 7px;border-radius:20px;background:#16303c;color:#a9c3cd}.badge.live{background:#123e36;color:#5eead4}.device-meta{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:10px;color:#9db0ba;font-size:12px}.device-actions{display:flex;gap:6px;margin-top:11px;flex-wrap:wrap}.device-actions button{padding:6px 8px;font-size:11px}.view{display:none}.view.active{display:block}.filters{display:grid;grid-template-columns:1.2fr 1.3fr 1.3fr .8fr .8fr .7fr auto;gap:8px;margin-bottom:14px}.filters input,.filters select,.pair-box input,.login-card input{background:#08151d;border:1px solid #28404c;color:#eaf5f7;border-radius:8px;padding:10px}.table-wrap{overflow:auto;max-height:65vh;border:1px solid #1d3440;border-radius:9px}table{border-collapse:collapse;width:100%;font-size:12px}th,td{padding:10px;border-bottom:1px solid #18313d;text-align:left;white-space:nowrap}th{position:sticky;top:0;background:#10232e;color:#9fb4bd}.db-summary{color:#9fb4bd;font-size:12px;margin:10px 0}.narrow{max-width:700px}.pair-box{display:grid;gap:12px}.pair-code{font-size:38px;letter-spacing:5px;font-weight:800;color:var(--accent);padding:18px 0}.muted{color:var(--muted)}.error{background:#3a171b;border:1px solid #6d252c;padding:10px;border-radius:8px;margin:12px 0}.login-page{display:grid;place-items:center;min-height:100vh}.login-card{width:min(390px,92vw);text-align:center;padding:35px;border:1px solid var(--line);background:#0b1922;border-radius:18px}.login-logo{width:105px;height:105px;object-fit:contain}.login-card h1{margin:10px 0 2px}.login-card p{color:var(--muted);margin:0 0 25px}.login-card form{display:grid;gap:10px}.login-card button{padding:11px;background:#173b45;border:1px solid #2d6b76;color:#fff;border-radius:9px;cursor:pointer}
@media(max-width:1050px){.shell{grid-template-columns:76px 1fr}.brand div,.nav span{display:none}.brand img{width:42px}.dashboard-grid{grid-template-columns:1fr}.stats{grid-template-columns:repeat(2,1fr)}.filters{grid-template-columns:repeat(2,1fr)}}@media(max-width:650px){main{padding:15px}.shell{display:block}.sidebar{height:auto;position:static;flex-direction:row;align-items:center}.sidebar nav{display:flex}.side-bottom{margin-left:auto}.stats{grid-template-columns:1fr 1fr}}


/* ---------- Dashboard v2 ---------- */
body{background:
radial-gradient(circle at 68% -15%,rgba(21,94,104,.23),transparent 35%),
radial-gradient(circle at 18% 100%,rgba(13,64,76,.18),transparent 30%),
#061018}
.sidebar{background:linear-gradient(180deg,#07151d 0%,#061018 100%);box-shadow:18px 0 45px rgba(0,0,0,.12)}
.brand{border-bottom:1px solid rgba(57,91,105,.35);margin-bottom:18px;padding-bottom:22px}
.brand img{filter:drop-shadow(0 0 12px rgba(45,212,191,.18))}
main{max-width:1900px;width:100%;margin:0 auto}
header{padding:3px 2px 4px}
header h1{font-size:27px;letter-spacing:-.4px}
.eyebrow,.section-kicker{font-size:9px;letter-spacing:2.1px;color:#40d7c2;font-weight:800;margin-bottom:6px}
.header-right{display:flex;align-items:center;gap:16px}
.system-pill{font-size:10px;letter-spacing:1px;border:1px solid #1c4d4a;background:#0b2829;color:#8be7d8;padding:8px 11px;border-radius:20px}
.pulse{display:inline-block;width:7px;height:7px;border-radius:50%;background:#37d6a2;box-shadow:0 0 0 4px rgba(55,214,162,.1);margin-right:5px}
.stats{gap:12px;margin-top:19px;margin-bottom:17px}
.stat{min-height:105px;display:flex;align-items:center;gap:15px;padding:18px 19px;background:linear-gradient(145deg,rgba(14,35,46,.98),rgba(7,23,31,.98));position:relative;overflow:hidden}
.stat:after{content:"";position:absolute;width:90px;height:90px;border-radius:50%;right:-38px;top:-40px;background:rgba(45,212,191,.035)}
.stat-icon{display:grid;place-items:center;width:43px;height:43px;min-width:43px;border:1px solid #28515d;border-radius:12px;background:#0b252e;color:#48d9c6;font-size:18px}
.stat span{font-size:9px;letter-spacing:1.3px}
.stat strong{font-size:23px;margin:3px 0 1px}
.stat small{font-size:10px;color:#627e89}
.panel{border-color:#1b3946;background:linear-gradient(155deg,rgba(12,31,42,.98),rgba(7,21,29,.98));box-shadow:0 18px 50px rgba(0,0,0,.18)}
.panel-title{min-height:42px}
.panel-title h2{font-size:16px}
.map-panel{padding:15px}
#map{height:625px;border:1px solid #1d3a45;box-shadow:inset 0 0 30px rgba(0,0,0,.15)}
.devices-panel{padding:15px}
.device-list{gap:9px}
.device{padding:14px;border-color:#1b3b47;background:linear-gradient(145deg,#0b202a,#091922);transition:.15s ease}
.device:hover{border-color:#2b5966;transform:translateY(-1px)}
.device-live{border-color:#23655c;box-shadow:inset 3px 0 #35d2b8}
.device-identity{display:flex;align-items:center;gap:10px}
.device-avatar{display:grid;place-items:center;width:35px;height:35px;border-radius:10px;background:#102d38;border:1px solid #28505d;color:#5de0ce;font-weight:800}
.device-name{font-size:13px}
.device-last{font-size:10px;color:#6f8b96;margin-top:3px}
.badge{display:flex;align-items:center;gap:5px;letter-spacing:.6px}
.badge i{width:6px;height:6px;border-radius:50%;background:#78909a}
.badge.online{color:#83dfc8;background:#12332f}.badge.online i{background:#45d7a9}
.badge.live{color:#7cead9;background:#123e36}.badge.live i{background:#4ee4c5;box-shadow:0 0 8px #4ee4c5}
.badge.offline{color:#8498a1;background:#17242a}
.device-metrics{display:grid;grid-template-columns:.65fr .8fr 1.55fr;gap:7px;margin-top:13px}
.device-metrics>div{padding:8px;background:#08171f;border:1px solid #15313d;border-radius:8px;min-width:0}
.device-metrics small{display:block;font-size:8px;letter-spacing:.8px;color:#607b86;margin-bottom:4px}
.device-metrics strong{display:block;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.device-actions{border-top:1px solid #17313b;padding-top:10px;margin-top:11px}
.device-actions button{background:#0d2c36;border-color:#24505c;color:#b8d1d8}
.device-actions button.danger{border-color:#67363b;background:#321b20;color:#f0a8ae}
@media(max-width:1200px){.dashboard-grid{grid-template-columns:1fr}.device-list{max-height:none}#map{height:500px}}

.map-tools{display:flex;align-items:center;gap:8px}.map-tools label{font-size:10px;color:#78929d}
.map-tools select{background:#0b222c;border:1px solid #28505d;color:#dcebed;border-radius:8px;padding:8px 10px}
.map-message{display:none;margin-top:9px;padding:9px 11px;border:1px solid #654c25;background:#2b2112;color:#e9c982;border-radius:8px;font-size:11px}
/* Google Maps információs ablak */
.gm-style .gm-style-iw-c,
.gm-style .gm-style-iw-d {
    color: #111827 !important;
}

.gm-style .gm-style-iw-c {
    background: #ffffff !important;
}

.gm-style .gm-style-iw-d {
    background: #ffffff !important;
}

.gm-style .gm-style-iw-c b,
.gm-style .gm-style-iw-c div {
    color: #111827 !important;
}
/* Hórusz Google Maps popup */
.horus-google-popup {
    color: #1f2937 !important;
    font-size: 13px;
    line-height: 1.35;
    padding: 0;
    margin: 0;
    min-width: 90px;
}

.horus-google-popup-name {
    color: #111827 !important;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.2;
    margin: 0 0 4px 0;
}

/* Google saját felesleges felső területének csökkentése */
.gm-style .gm-style-iw-c {
    padding: 10px 12px 10px 12px !important;
}

.gm-style .gm-style-iw-d {
    overflow: hidden !important;
    padding: 0 !important;
}

.gm-style .gm-style-iw-chr {
    height: 18px !important;
}

.gm-style .gm-style-iw-ch {
    padding-top: 0 !important;
}
/* Helyelőzmények térképe */

.history-map-panel {
    margin-top: 18px;
    margin-bottom: 18px;
}

.history-map-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.history-map-header h2 {
    margin: 2px 0 0 0;
}

.history-map-tools {
    display: flex;
    align-items: center;
    gap: 8px;
}

.history-map-tools label {
    color: #9aa7bd;
    font-size: 13px;
}

#historyMap {
    width: 100%;
    height: 420px;
    border-radius: 12px;
    overflow: hidden;
}

/* Helyelőzmény útvonal összesítő */
.history-route-summary {
    margin-top: 10px;
    padding: 10px 14px;
    border-radius: 10px;
    line-height: 1.7;
    font-size: 14px;
}

.history-route-summary strong {
    font-weight: 700;
}


/* ==========================================================
   HÓRUSZ SZEME — Reference UI
   ========================================================== */

:root{
    --horus-bg:#07111d;
    --horus-bg-deep:#040b13;
    --horus-sidebar:#08121f;
    --horus-panel:#111d2a;
    --horus-panel-2:#0d1824;
    --horus-line:#283746;
    --horus-line-soft:#1d2d3c;

    --horus-gold:#f5c518;
    --horus-gold-soft:#d8aa12;

    --horus-blue:#3182f6;
    --horus-green:#39d353;
    --horus-red:#ef4b3e;
    --horus-purple:#a43cf2;

    --horus-text:#f4f7fb;
    --horus-muted:#91a0b3;
}


/* ---------- OLDAL / HÁTTÉR ---------- */

html,
body{
    background:
        radial-gradient(circle at 52% 10%,
            rgba(37,65,91,.24) 0,
            rgba(10,23,37,.10) 35%,
            transparent 58%),
        linear-gradient(135deg,#07111d 0%,#091522 50%,#050c15 100%) !important;

    color:var(--horus-text);
}

.shell{
    grid-template-columns:282px minmax(0,1fr);
}


/* ---------- SIDEBAR ---------- */

.sidebar{
    padding:18px 14px;
    background:
        linear-gradient(180deg,#091523 0%,#07111d 62%,#06101b 100%) !important;

    border-right:1px solid #1e3041;
    box-shadow:
        12px 0 35px rgba(0,0,0,.20);

    z-index:10;
}

.brand{
    min-height:62px;
    padding:0 12px 18px;
    margin-bottom:10px;

    border-bottom:1px solid rgba(100,121,143,.18);
    gap:13px;
}

.brand img{
    width:55px;
    height:55px;
    object-fit:contain;

    filter:
        drop-shadow(0 2px 4px rgba(0,0,0,.45))
        drop-shadow(0 0 7px rgba(245,197,24,.12));
}

.brand strong{
    color:#f7f8fa;
    font-size:17px;
    line-height:1.15;
    letter-spacing:.4px;
}

.brand small{
    color:#aeb9c8;
    font-size:9px;
    letter-spacing:1.4px;
    margin-top:5px;
}


/* ---------- MENÜ ---------- */

.sidebar nav{
    gap:4px;
}

.nav{
    position:relative;

    min-height:42px;
    padding:11px 13px;

    color:#aeb9c9;

    border-radius:6px;

    font-size:13px;
    font-weight:500;

    transition:
        background .15s ease,
        color .15s ease,
        transform .15s ease;
}

.nav:hover{
    color:#fff;
    background:#142131;
    transform:translateX(1px);
}

.nav.active{
    color:var(--horus-gold);
    background:
        linear-gradient(90deg,#182537 0%,#152231 100%);

    box-shadow:
        inset 3px 0 var(--horus-gold),
        0 3px 10px rgba(0,0,0,.12);

    font-weight:700;
}

.side-bottom{
    border-top:1px solid rgba(100,121,143,.18);
    padding:16px 13px 5px;
}

.side-bottom a{
    color:#9baabc;
    font-size:13px;
}

.side-bottom a:hover{
    color:#fff;
}


/* ---------- MAIN ---------- */

main{
    max-width:none;
    padding:20px 28px 38px;
}


/* ---------- HEADER ---------- */

header{
    min-height:66px;
    margin-bottom:17px;
    padding:0 1px 13px;

    border-bottom:1px solid rgba(72,94,115,.28);
}

header h1{
    color:#f7f9fc;
    font-size:25px;
    font-weight:700;
    letter-spacing:-.35px;
}

header p{
    color:#8f9eaf;
    font-size:13px;
}

.eyebrow,
.section-kicker{
    color:var(--horus-gold);
    font-size:9px;
    font-weight:800;
    letter-spacing:1.8px;
}

.header-right{
    gap:18px;
}

#clock{
    color:#c6d0dc;
    font-size:13px;
    font-weight:500;
}

.system-pill{
    color:#73e0b3;

    background:#0c2a27;
    border:1px solid #195047;

    padding:7px 11px;

    font-size:9px;
    font-weight:700;
    letter-spacing:.8px;
}

.pulse{
    background:#39d79f;
}


/* ---------- STAT KÁRTYÁK ---------- */

.stats{
    gap:10px;
    margin-top:0;
    margin-bottom:12px;
}

.stat{
    min-height:96px;

    padding:14px 16px;

    border-radius:7px;
    border:1px solid var(--horus-line);

    background:
        linear-gradient(145deg,
            rgba(19,32,46,.98),
            rgba(13,25,37,.98));

    box-shadow:
        0 7px 18px rgba(0,0,0,.14);

    gap:13px;
}

.stat:after{
    display:none;
}

.stat-icon{
    width:39px;
    height:39px;
    min-width:39px;

    border-radius:7px;

    border:1px solid #33475c;
    background:#101d2a;

    color:var(--horus-gold);

    font-size:18px;
}

.stat span{
    color:#b6c0cd;
    font-size:9px;
    font-weight:600;
    letter-spacing:.6px;
}

.stat strong{
    font-size:25px;
    line-height:1.1;
    margin:6px 0 2px;
}

.stat small{
    color:#76879a;
    font-size:10px;
}


/* külön stat színek */

.stat:nth-child(1) .stat-icon{
    color:#3b82f6;
    border-color:#244f88;
}

.stat:nth-child(2) .stat-icon,
.stat:nth-child(2) strong{
    color:#3dd65c;
}

.stat:nth-child(3) .stat-icon,
.stat:nth-child(3) strong{
    color:#b448ef;
}

.stat:nth-child(4) .stat-icon{
    color:#438cf5;
}


/* ---------- PANELEK ---------- */

.panel{
    padding:13px;

    border-radius:7px;
    border:1px solid var(--horus-line);

    background:
        linear-gradient(145deg,
            rgba(17,30,43,.98),
            rgba(12,24,36,.98));

    box-shadow:
        0 9px 24px rgba(0,0,0,.15);
}

.panel-title{
    min-height:35px;
    margin-bottom:10px;
}

.panel-title h2,
.history-map-header h2{
    color:#f4f7fb;

    font-size:14px;
    font-weight:700;
}

.muted{
    color:#8393a6;
}


/* ---------- DASHBOARD GRID ---------- */

.dashboard-grid{
    grid-template-columns:minmax(0,2fr) minmax(330px,.9fr);
    gap:11px;
}


/* ---------- TÉRKÉP ---------- */

.map-panel{
    padding:12px;
}

#map{
    height:600px;

    border-radius:6px;
    border:1px solid #344556;

    box-shadow:
        inset 0 0 20px rgba(0,0,0,.12),
        0 3px 8px rgba(0,0,0,.14);
}

.map-tools{
    gap:6px;
}

.map-tools label,
.history-map-tools label{
    color:#9aa9ba;
    font-size:10px;
}

.map-tools select,
.history-map-tools select{
    color:#e6ebf1;

    background:#101e2c;

    border:1px solid #34485d;
    border-radius:5px;

    padding:6px 8px;
}


/* ---------- GOMBOK ---------- */

.panel-title button,
.filters button,
.pair-box button,
.device-actions button{
    border-radius:5px;

    background:
        linear-gradient(180deg,#183a55,#112d43);

    border:1px solid #315c79;

    color:#edf5fb;

    font-size:11px;
    font-weight:600;

    padding:7px 10px;

    box-shadow:
        inset 0 1px rgba(255,255,255,.04);
}

.panel-title button:hover,
.filters button:hover,
.pair-box button:hover,
.device-actions button:hover{
    border-color:#4b86ae;
    background:
        linear-gradient(180deg,#1d4767,#15364f);
}


/* ---------- KÉSZÜLÉK KÁRTYÁK ---------- */

.device-list{
    gap:7px;
}

.device{
    padding:12px;

    border-radius:6px;
    border:1px solid #273a4b;

    background:
        linear-gradient(145deg,#111f2d,#0c1925);

    box-shadow:
        0 4px 12px rgba(0,0,0,.10);
}

.device:hover{
    border-color:#425a70;
    transform:translateY(-1px);
}

.device-live{
    border-color:#226353;
    box-shadow:
        inset 3px 0 #35d2a2,
        0 4px 12px rgba(0,0,0,.12);
}

.device-avatar{
    border-radius:6px;

    background:#102535;
    border-color:#2b465d;

    color:#e9c62a;
}

.device-name{
    color:#f1f4f8;
    font-size:13px;
}

.device-last{
    color:#75879a;
}

.device-metrics>div{
    border-radius:5px;
    border-color:#213546;
    background:#0a1621;
}


/* ---------- BADGE ---------- */

.badge{
    border-radius:12px;
    font-weight:700;
}

.badge.online{
    color:#50df74;
    background:#102d20;
}

.badge.live{
    color:#51e0d1;
    background:#10342f;
}

.badge.offline{
    color:#ff756b;
    background:#321c1d;
}


/* ---------- HISTORY / FILTEREK ---------- */

.filters{
    gap:7px;
    margin-bottom:11px;
}

.filters input,
.filters select,
.pair-box input,
.login-card input{
    background:#0b1722;

    border:1px solid #304354;

    color:#eef3f7;

    border-radius:5px;

    padding:9px 10px;
}

.filters input:focus,
.filters select:focus,
.pair-box input:focus{
    outline:none;
    border-color:#a48620;
    box-shadow:0 0 0 2px rgba(245,197,24,.07);
}


/* ---------- HISTORY MAP ---------- */

.history-map-panel{
    margin-top:15px;
    margin-bottom:15px;
}

.history-map-header{
    margin-bottom:9px;
}

#historyMap{
    height:440px;

    border-radius:6px;

    border:1px solid #334658;

    box-shadow:
        0 5px 14px rgba(0,0,0,.16);
}

.history-route-summary{
    color:#aebaca;

    background:#0b1722;

    border:1px solid #273b4d;

    border-radius:5px;

    padding:9px 12px;

    font-size:12px;
}

.history-route-summary strong{
    color:#e7edf4;
}


/* ---------- TÁBLÁZAT ---------- */

.table-wrap{
    border:1px solid #293c4e;
    border-radius:6px;

    background:#0b1722;
}

table{
    font-size:11px;
}

th{
    color:#aebccc;
    background:#132232;

    font-size:10px;
    font-weight:700;
    letter-spacing:.25px;
}

th,
td{
    padding:9px 10px;
    border-bottom:1px solid #1d3041;
}

tbody tr{
    transition:background .12s ease;
}

tbody tr:hover{
    background:#122334;
}

.db-summary{
    color:#8e9eb0;
}


/* ---------- PÁROSÍTÁS ---------- */

.pair-code{
    color:var(--horus-gold);

    text-shadow:
        0 0 15px rgba(245,197,24,.13);
}


/* ---------- SCROLLBAR ---------- */

*{
    scrollbar-width:thin;
    scrollbar-color:#33485c #0b1722;
}

::-webkit-scrollbar{
    width:8px;
    height:8px;
}

::-webkit-scrollbar-track{
    background:#0b1722;
}

::-webkit-scrollbar-thumb{
    background:#33485c;
    border-radius:8px;
}

::-webkit-scrollbar-thumb:hover{
    background:#455e75;
}


/* ---------- RESPONSIVE ---------- */

@media(max-width:1200px){

    .shell{
        grid-template-columns:230px minmax(0,1fr);
    }

    .dashboard-grid{
        grid-template-columns:1fr;
    }

    #map{
        height:500px;
    }
}

@media(max-width:1050px){

    .shell{
        grid-template-columns:76px 1fr;
    }

    .brand div,
    .nav span{
        display:none;
    }

    .brand{
        padding-left:3px;
        padding-right:3px;
    }

    .brand img{
        width:45px;
        height:45px;
    }
}

@media(max-width:650px){

    main{
        padding:14px;
    }

    .stats{
        grid-template-columns:1fr 1fr;
    }
}


/* ==========================================================
   HÓRUSZ SZEME — Sidebar brand finomhangolás
   ========================================================== */

.brand{
    min-height:78px;
    padding:5px 10px 19px;
    margin-bottom:12px;
    gap:14px;
    align-items:center;
}

.brand img{
    width:58px;
    height:58px;
    min-width:58px;
    object-fit:contain;
    filter:
        drop-shadow(0 2px 2px rgba(0,0,0,.45))
        drop-shadow(0 0 8px rgba(245,197,24,.16));
}

.brand > div{
    min-width:0;
}

.brand strong{
    display:block;
    color:#f5f7fa;
    font-size:18px;
    font-weight:750;
    line-height:1.05;
    letter-spacing:.25px;
    white-space:nowrap;
}

.brand small{
    display:block;
    margin-top:7px;
    color:#aeb8c5;
    font-size:9px;
    font-weight:500;
    letter-spacing:1.35px;
}


/* aranyabb aktív menüpont */

.nav.active{
    color:#f5c518 !important;
    background:
        linear-gradient(90deg,
            rgba(40,49,59,.96),
            rgba(22,34,48,.96)) !important;

    box-shadow:
        inset 3px 0 #f5c518,
        0 4px 13px rgba(0,0,0,.16) !important;
}


/* menüpontok referencia-szerű méretezése */

.nav{
    font-size:12px;
    letter-spacing:.1px;
    padding:12px 14px;
    min-height:44px;
}


/* kijelentkezés kevésbé különálló */

.side-bottom{
    margin-top:auto;
    border-top:1px solid rgba(104,123,143,.18);
    padding:15px 13px 7px;
}

.side-bottom a{
    display:block;
    padding:7px 0;
    color:#9daaba;
    font-size:12px;
}

.side-bottom a:hover{
    color:#f5c518;
}


/* desktopon sidebar arány a referenciához */

@media(min-width:1201px){
    .shell{
        grid-template-columns:282px minmax(0,1fr);
    }
}


/* ==========================================================
   HÓRUSZ SZEME — Dashboard stat kártyák
   ========================================================== */

.stats{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin-bottom:13px;
}

.stat{
    position:relative;
    min-height:82px;
    padding:12px 14px;

    display:flex;
    align-items:center;
    gap:12px;

    background:
        linear-gradient(145deg,#142231 0%,#0e1a27 100%);

    border:1px solid #293c4d;
    border-radius:6px;

    box-shadow:
        0 5px 15px rgba(0,0,0,.14);
}

.stat-icon{
    width:38px;
    height:38px;
    min-width:38px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:6px;

    background:#101c28;
    border:1px solid #304456;

    font-size:18px;
}

.stat > div:last-child{
    min-width:0;
}

.stat span{
    display:block;

    color:#aab6c4;

    font-size:9px;
    font-weight:700;
    letter-spacing:.55px;
    text-transform:uppercase;
}

.stat strong{
    display:block;

    margin:4px 0 1px;

    color:#f5f7fa;

    font-size:24px;
    font-weight:750;
    line-height:1;
}

.stat small{
    display:block;

    color:#738598;

    font-size:9px;
    line-height:1.25;
}


/* Kártyánként referencia-szerű kiemelések */

.stat:nth-child(1) .stat-icon{
    color:#438df5;
    background:#10243a;
    border-color:#244b73;
}

.stat:nth-child(2) .stat-icon{
    color:#45dc67;
    background:#102a20;
    border-color:#24583a;
}

.stat:nth-child(2) strong{
    color:#43dc65;
}

.stat:nth-child(3) .stat-icon{
    color:#bd52ef;
    background:#281536;
    border-color:#59306d;
}

.stat:nth-child(3) strong{
    color:#bc50ed;
}

.stat:nth-child(4) .stat-icon{
    color:#438df5;
    background:#10243a;
    border-color:#244b73;
}


/* finom hover, nem ugrál */

.stat{
    transition:border-color .15s ease,background .15s ease;
}

.stat:hover{
    border-color:#3b5165;

    background:
        linear-gradient(145deg,#172738 0%,#101d2b 100%);
}


/* kisebb kijelző */

@media(max-width:1100px){
    .stats{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media(max-width:600px){
    .stats{
        grid-template-columns:1fr;
    }
}


/* ==========================================================
   HÓRUSZ SZEME — Térkép + Készülékek panel
   ========================================================== */

/* Fő dashboard arányok */
.dashboard-grid{
    display:grid;
    grid-template-columns:minmax(0,2.15fr) minmax(320px,.85fr);
    gap:12px;
    align-items:start;
}


/* ---------- TÉRKÉP PANEL ---------- */

.map-panel{
    padding:12px;
    overflow:hidden;
}

.map-panel .panel-title{
    min-height:38px;
    margin-bottom:9px;
    padding:0 2px;
}

.map-panel .panel-title h2{
    font-size:14px;
    font-weight:700;
    letter-spacing:.1px;
}

.map-panel .section-kicker{
    margin-bottom:3px;
    color:#f5c518;
}

#map{
    height:590px;
    width:100%;

    border:1px solid #35495b;
    border-radius:5px;

    overflow:hidden;

    background:#0a1621;

    box-shadow:
        inset 0 0 0 1px rgba(255,255,255,.015),
        0 4px 13px rgba(0,0,0,.17);
}


/* térképszolgáltató választó */

.map-tools{
    display:flex;
    align-items:center;
    gap:7px;
}

.map-tools label{
    color:#8798aa;
    font-size:9px;
    font-weight:600;
    text-transform:uppercase;
    letter-spacing:.5px;
}

.map-tools select{
    min-width:145px;
    height:30px;

    padding:4px 28px 4px 9px;

    color:#e4eaf0;
    background:#0c1925;

    border:1px solid #30475b;
    border-radius:4px;

    font-size:11px;
}


/* ---------- KÉSZÜLÉKEK PANEL ---------- */

.devices-panel{
    padding:12px;
}

.devices-panel .panel-title{
    min-height:38px;
    margin-bottom:9px;
    padding:0 2px 8px;

    border-bottom:1px solid #223545;
}

.devices-panel .panel-title h2{
    margin-top:2px;

    font-size:14px;
    font-weight:700;
}

.devices-panel .panel-title .muted{
    font-size:9px;
    text-transform:uppercase;
    letter-spacing:.5px;
}


/* készülék lista */

.device-list{
    display:flex;
    flex-direction:column;
    gap:7px;
}


/* készülék kártya */

.device{
    position:relative;

    padding:11px;

    border:1px solid #263b4d;
    border-radius:5px;

    background:
        linear-gradient(145deg,#101e2b 0%,#0b1722 100%);

    box-shadow:
        0 3px 9px rgba(0,0,0,.11);

    transition:
        border-color .15s ease,
        background .15s ease;
}

.device:hover{
    transform:none;

    border-color:#3c566c;

    background:
        linear-gradient(145deg,#132333 0%,#0d1b28 100%);
}


/* LIVE készülék */

.device-live{
    border-color:#276354;

    box-shadow:
        inset 3px 0 #35d2a2,
        0 3px 10px rgba(0,0,0,.12);
}


/* felső sor */

.device-head{
    gap:9px;
}

.device-avatar{
    width:34px;
    height:34px;
    min-width:34px;

    border-radius:5px;

    color:#f5c518;
    background:#132535;

    border:1px solid #30485c;

    font-size:15px;
}

.device-name{
    color:#f0f4f8;

    font-size:12px;
    font-weight:700;
}

.device-last{
    margin-top:2px;

    color:#718397;

    font-size:9px;
}


/* státusz */

.badge{
    padding:3px 7px;

    border-radius:10px;

    font-size:8px;
    font-weight:800;
    letter-spacing:.45px;
}

.badge.online{
    color:#55e574;
    background:#102b1d;
    border:1px solid #205332;
}

.badge.live{
    color:#53e0d2;
    background:#10302d;
    border:1px solid #21564f;
}

.badge.offline{
    color:#ff756c;
    background:#301a1b;
    border:1px solid #5b2c2c;
}


/* Akku / sebesség / hely */

.device-metrics{
    margin-top:9px;
    gap:5px;
}

.device-metrics > div{
    padding:7px 8px;

    background:#091520;

    border:1px solid #203445;
    border-radius:4px;
}

.device-metrics small{
    color:#687c90;

    font-size:7px;
    font-weight:700;
    letter-spacing:.55px;
}

.device-metrics strong{
    margin-top:3px;

    color:#dce4ec;

    font-size:10px;
    font-weight:600;
}


/* műveleti gombok */

.device-actions{
    margin-top:8px;
    gap:5px;
}

.device-actions button{
    min-height:29px;

    padding:5px 8px;

    border-radius:4px;

    font-size:9px;
    font-weight:700;
}

.device-actions button.danger{
    color:#ff8b83;

    background:#351b1c;

    border-color:#693232;
}

.device-actions button.danger:hover{
    background:#442021;
    border-color:#84403e;
}


/* ---------- LEAFLET FINOMHANGOLÁS ---------- */

.leaflet-control-zoom a{
    background:#101d29 !important;
    color:#e9eef3 !important;
    border-color:#314658 !important;
}

.leaflet-control-zoom a:hover{
    background:#172838 !important;
}

.leaflet-control-attribution{
    background:rgba(7,17,29,.82) !important;
    color:#8fa0b0 !important;
}

.leaflet-control-attribution a{
    color:#d7b82c !important;
}


/* ---------- RESPONSIVE ---------- */

@media(max-width:1200px){
    .dashboard-grid{
        grid-template-columns:minmax(0,1.7fr) minmax(300px,.8fr);
    }

    #map{
        height:540px;
    }
}

@media(max-width:950px){
    .dashboard-grid{
        grid-template-columns:1fr;
    }

    #map{
        height:500px;
    }
}


/* ==========================================================
   HÓRUSZ SZEME — Előzmények referencia UI
   ========================================================== */

/* fő előzmény panel */
#history > .panel{
    padding:14px;
}

#history > .panel > .panel-title{
    min-height:43px;
    padding:0 2px 10px;
    margin-bottom:11px;

    border-bottom:1px solid #223545;
}

#history > .panel > .panel-title h2{
    color:#f4f7fa;
    font-size:15px;
    font-weight:700;
}

#history > .panel > .panel-title .muted{
    color:#75879a;
    font-size:9px;
}


/* ---------- SZŰRŐSÁV ---------- */

#history .filters{
    display:grid;
    grid-template-columns:
        minmax(135px,1.1fr)
        minmax(175px,1.3fr)
        minmax(175px,1.3fr)
        minmax(100px,.7fr)
        minmax(105px,.7fr)
        85px
        auto;

    gap:7px;

    padding:10px;

    margin-bottom:11px;

    background:#0a1621;

    border:1px solid #24394b;
    border-radius:5px;
}

#history .filters input,
#history .filters select{
    width:100%;
    height:34px;

    padding:6px 9px;

    color:#dfe6ed;
    background:#101d29;

    border:1px solid #304557;
    border-radius:4px;

    font-size:10px;
}

#history .filters input::placeholder{
    color:#64778a;
}

#history .filters input:hover,
#history .filters select:hover{
    border-color:#405a70;
}

#history .filters input:focus,
#history .filters select:focus{
    border-color:#b59622;

    box-shadow:
        0 0 0 2px rgba(245,197,24,.06);

    outline:none;
}

#history .filters button{
    height:34px;

    padding:6px 15px;

    color:#0b1118;
    background:
        linear-gradient(180deg,#f2cd32,#d6aa13);

    border:1px solid #f3d44b;
    border-radius:4px;

    font-size:10px;
    font-weight:800;

    box-shadow:
        0 3px 8px rgba(0,0,0,.15);
}

#history .filters button:hover{
    color:#080d12;

    background:
        linear-gradient(180deg,#ffdb42,#e5b91b);

    border-color:#ffe36b;
}


/* ---------- ADATBÁZIS ÖSSZESÍTŐ ---------- */

#history .db-summary{
    min-height:26px;

    display:flex;
    align-items:center;

    margin:0 1px 8px;

    color:#8192a4;

    font-size:10px;
    font-weight:500;
}


/* ---------- ELŐZMÉNY TÉRKÉP PANEL ---------- */

.history-map-panel{
    padding:12px;

    margin-top:13px;
    margin-bottom:13px;

    border:1px solid #293d4f;
    border-radius:6px;

    background:
        linear-gradient(145deg,#101e2b,#0b1722);

    box-shadow:
        0 5px 15px rgba(0,0,0,.13);
}

.history-map-header{
    min-height:36px;

    display:flex;
    justify-content:space-between;
    align-items:center;

    gap:12px;

    margin-bottom:9px;
    padding:0 2px;
}

.history-map-header h2{
    color:#f2f5f8;

    font-size:13px;
    font-weight:700;
}

.history-map-tools{
    display:flex;
    align-items:center;
    gap:7px;
}

.history-map-tools label{
    color:#7f91a4;

    font-size:9px;
    font-weight:600;

    text-transform:uppercase;
    letter-spacing:.45px;
}

.history-map-tools select{
    height:29px;
    min-width:145px;

    padding:4px 8px;

    color:#dfe6ed;
    background:#0b1824;

    border:1px solid #30475b;
    border-radius:4px;

    font-size:10px;
}

#historyMap{
    width:100%;
    height:440px;

    overflow:hidden;

    background:#08131d;

    border:1px solid #35495b;
    border-radius:5px;

    box-shadow:
        inset 0 0 0 1px rgba(255,255,255,.01),
        0 4px 12px rgba(0,0,0,.15);
}


/* ---------- GPS ÜZENET ---------- */

#historyMapMessage{
    min-height:0;

    margin-top:7px;

    color:#d4b93d;

    font-size:9px;
    font-weight:600;
}


/* ---------- ÚTVONAL ÖSSZESÍTŐ ---------- */

.history-route-summary{
    margin-top:8px;

    padding:9px 11px;

    color:#93a4b6;
    background:#091520;

    border:1px solid #223749;
    border-radius:4px;

    font-size:10px;
    line-height:1.65;
}

.history-route-summary strong{
    color:#dce4ec;
    font-weight:700;
}

.history-route-summary strong:first-child{
    color:#f0c927;
}


/* ---------- ADATTÁBLA ---------- */

#history .table-wrap{
    overflow:auto;

    border:1px solid #293d4f;
    border-radius:5px;

    background:#091520;

    box-shadow:
        0 4px 12px rgba(0,0,0,.11);
}

#history table{
    width:100%;

    border-collapse:collapse;

    color:#cbd5df;

    font-size:10px;
}

#history thead{
    position:sticky;
    top:0;
    z-index:2;
}

#history th{
    padding:9px 10px;

    color:#9cabb9;
    background:#132231;

    border-bottom:1px solid #35495a;

    font-size:9px;
    font-weight:800;

    text-transform:uppercase;
    letter-spacing:.45px;

    white-space:nowrap;
}

#history td{
    padding:8px 10px;

    color:#b9c5d0;

    border-bottom:1px solid #1d3040;

    white-space:nowrap;
}

#history tbody tr:nth-child(even){
    background:rgba(18,33,47,.28);
}

#history tbody tr:hover{
    background:#14283a;
}

#history tbody tr:last-child td{
    border-bottom:0;
}


/* első két oszlop hangsúlyosabb */

#history td:first-child{
    color:#8fa2b5;
}

#history td:nth-child(2){
    color:#eef2f6;
    font-weight:650;
}


/* akku oszlop */

#history td:nth-child(3){
    color:#55d978;
}


/* kimaradás */

#history td:last-child{
    color:#d8b936;
}


/* ---------- GOOGLE POPUP ---------- */

.horus-google-popup{
    min-width:150px;

    color:#17212b;

    font-size:11px;
    line-height:1.5;
}

.horus-google-popup-name{
    margin-bottom:3px;

    color:#0c1720;

    font-size:12px;
    font-weight:800;
}


/* ---------- RESPONSIVE ---------- */

@media(max-width:1250px){
    #history .filters{
        grid-template-columns:
            repeat(3,minmax(130px,1fr));
    }
}

@media(max-width:800px){
    #history .filters{
        grid-template-columns:
            repeat(2,minmax(120px,1fr));
    }

    #historyMap{
        height:390px;
    }
}

@media(max-width:520px){
    #history .filters{
        grid-template-columns:1fr;
    }

    .history-map-header{
        align-items:flex-start;
        flex-direction:column;
    }

    #historyMap{
        height:340px;
    }
}


/* ==========================================================
   HÓRUSZ SZEME — Párosítás + végső UI finomhangolás
   ========================================================== */

/* ---------- PÁROSÍTÁS OLDAL ---------- */

#pairing .panel.narrow{
    max-width:620px;
    margin:0 auto;

    padding:16px;

    border:1px solid #293d4f;
    border-radius:6px;

    background:
        linear-gradient(145deg,#111f2d 0%,#0b1722 100%);

    box-shadow:
        0 8px 24px rgba(0,0,0,.16);
}

#pairing .panel-title{
    min-height:42px;

    padding:0 2px 11px;
    margin-bottom:14px;

    border-bottom:1px solid #223545;
}

#pairing .panel-title h2{
    color:#f3f6f9;

    font-size:15px;
    font-weight:700;
}


/* párosító doboz */

.pair-box{
    display:flex;
    flex-direction:column;
    gap:10px;
}

.pair-box input{
    width:100%;
    height:40px;

    padding:8px 11px;

    color:#e9eef3;
    background:#091620;

    border:1px solid #304557;
    border-radius:5px;

    font-size:11px;
}

.pair-box input::placeholder{
    color:#687b8e;
}

.pair-box input:focus{
    outline:none;

    border-color:#b99a25;

    box-shadow:
        0 0 0 2px rgba(245,197,24,.07);
}


/* párosítás gomb */

.pair-box button{
    align-self:flex-start;

    min-width:145px;
    min-height:36px;

    padding:7px 15px;

    color:#10151a;

    background:
        linear-gradient(180deg,#f3cf35,#d6aa13);

    border:1px solid #f4d74f;
    border-radius:4px;

    font-size:10px;
    font-weight:800;

    box-shadow:
        0 3px 9px rgba(0,0,0,.16);
}

.pair-box button:hover{
    color:#080c10;

    background:
        linear-gradient(180deg,#ffdc45,#e4b91b);

    border-color:#ffe16a;
}


/* generált párosító kód */

#pairResult{
    margin-top:7px;
}

.pair-code{
    display:inline-block;

    margin:5px 0 8px;

    padding:12px 18px;

    color:#f5c518;

    background:#0a1621;

    border:1px solid #66571e;
    border-radius:5px;

    font-size:28px;
    font-weight:800;

    letter-spacing:5px;

    text-shadow:
        0 0 14px rgba(245,197,24,.15);

    box-shadow:
        inset 0 0 18px rgba(245,197,24,.025),
        0 4px 12px rgba(0,0,0,.12);
}

#pairResult .muted{
    color:#8394a6;
    font-size:10px;
}


/* ---------- ÁLTALÁNOS TIPOGRÁFIA ---------- */

body{
    letter-spacing:0;
}

h1,h2,h3,strong{
    text-rendering:optimizeLegibility;
}

button,
input,
select{
    font-family:inherit;
}


/* ---------- SELECT ---------- */

select{
    cursor:pointer;
}


/* ---------- GOMB ÁTMENETEK ---------- */

button{
    cursor:pointer;

    transition:
        background .14s ease,
        border-color .14s ease,
        color .14s ease,
        box-shadow .14s ease;
}

button:active{
    transform:translateY(1px);
}


/* ---------- FÓKUSZ ---------- */

button:focus-visible,
input:focus-visible,
select:focus-visible,
a:focus-visible{
    outline:1px solid #d4b52e;
    outline-offset:2px;
}


/* ---------- PANEL FINOM FÉNY ---------- */

.panel{
    position:relative;
}

.panel::before{
    content:"";

    position:absolute;
    left:1px;
    right:1px;
    top:0;

    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,.055),
            transparent
        );

    pointer-events:none;
}


/* ---------- OLDALVÁLTÁS ---------- */

.view.active{
    animation:horusViewIn .16s ease-out;
}

@keyframes horusViewIn{
    from{
        opacity:.65;
        transform:translateY(2px);
    }

    to{
        opacity:1;
        transform:translateY(0);
    }
}


/* ---------- KIJELÖLÉS ---------- */

::selection{
    background:rgba(245,197,24,.28);
    color:#fff;
}


/* ---------- LINK ---------- */

a{
    transition:color .14s ease;
}


/* ---------- MOBIL PÁROSÍTÁS ---------- */

@media(max-width:650px){

    #pairing .panel.narrow{
        max-width:none;
    }

    .pair-code{
        font-size:23px;
        letter-spacing:3px;
    }

    .pair-box button{
        width:100%;
    }
}


/* ==========================================================
   HÓRUSZ SZEME — végleges sidebar logo / brand
   ========================================================== */

.brand{
    min-height:70px !important;
    padding:2px 6px 15px !important;
    margin-bottom:11px !important;

    display:flex !important;
    align-items:center !important;
    gap:11px !important;

    border-bottom:1px solid rgba(100,121,143,.18) !important;
}

/* Az új logo 1536x1024 = 3:2 képarány */
.brand img{
    width:66px !important;
    height:44px !important;
    min-width:66px !important;

    object-fit:cover !important;
    object-position:center !important;

    border-radius:2px;

    filter:
        drop-shadow(0 2px 4px rgba(0,0,0,.55))
        drop-shadow(0 0 8px rgba(245,197,24,.12)) !important;
}

.brand > div{
    min-width:0;
}

.brand strong{
    display:block !important;

    color:#f4f6f8 !important;

    font-size:17px !important;
    font-weight:750 !important;
    line-height:1.05 !important;

    letter-spacing:.15px !important;
    white-space:nowrap;
}

.brand small{
    display:block !important;

    margin-top:5px !important;

    color:#aab6c4 !important;

    font-size:8px !important;
    font-weight:600;

    letter-spacing:1.25px !important;
    white-space:nowrap;
}


/* Keskeny sidebar */
@media(max-width:1050px){

    .brand{
        justify-content:center !important;
        padding-left:0 !important;
        padding-right:0 !important;
    }

    .brand img{
        width:58px !important;
        height:39px !important;
        min-width:58px !important;
    }
}


/* ==========================================================
   HÓRUSZ SZEME — Dashboard stat kártyák FINAL
   ========================================================== */

#dashboard .stats{
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:10px !important;

    margin-top:14px !important;
    margin-bottom:12px !important;
}


/* Alapkártya */

#dashboard .stat{
    min-height:82px !important;

    display:flex !important;
    align-items:center !important;
    gap:12px !important;

    padding:12px 14px !important;

    position:relative;
    overflow:hidden;

    background:
        linear-gradient(145deg,#111e2b 0%,#0c1824 100%) !important;

    border:1px solid #2b3b4c !important;
    border-radius:6px !important;

    box-shadow:
        inset 0 1px rgba(255,255,255,.025),
        0 3px 10px rgba(0,0,0,.12) !important;
}


/* Finom felső fény */

#dashboard .stat::before{
    content:"";

    position:absolute;
    left:0;
    right:0;
    top:0;

    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,.07),
            transparent
        );
}


/* Régi dekoráció kikapcsolása */

#dashboard .stat::after{
    display:none !important;
}


/* Ikon */

#dashboard .stat-icon{
    width:38px !important;
    height:38px !important;
    min-width:38px !important;

    display:grid !important;
    place-items:center !important;

    border-radius:5px !important;

    font-size:17px !important;
    font-weight:700 !important;
}


/* szöveges rész */

#dashboard .stat > div:last-child{
    min-width:0 !important;
}


/* cím */

#dashboard .stat span{
    display:block !important;

    margin:0 0 3px !important;

    color:#9ba9b8 !important;

    font-size:8px !important;
    font-weight:700 !important;

    letter-spacing:.55px !important;
    line-height:1.15 !important;

    text-transform:uppercase !important;

    white-space:nowrap;
}


/* nagy szám */

#dashboard .stat strong{
    display:block !important;

    margin:0 !important;

    color:#eef2f6;

    font-size:22px !important;
    font-weight:700 !important;
    line-height:1.05 !important;
}


/* alsó információ */

#dashboard .stat small{
    display:block !important;

    margin-top:4px !important;

    color:#718397 !important;

    font-size:8px !important;
    font-weight:500 !important;

    line-height:1.15 !important;

    white-space:nowrap;
}


/* ==========================================================
   1 — ÖSSZES ESZKÖZ / KÉK
   ========================================================== */

#dashboard .stat:nth-child(1) .stat-icon{
    color:#438bff !important;

    background:#10253b !important;

    border:1px solid #28548a !important;
}

#dashboard .stat:nth-child(1) strong{
    color:#eef3f8 !important;
}

#dashboard .stat:nth-child(1) small{
    color:#4c9bff !important;
}


/* ==========================================================
   2 — ELÉRHETŐ / ZÖLD
   ========================================================== */

#dashboard .stat:nth-child(2) .stat-icon{
    color:#42d865 !important;

    background:#102d20 !important;

    border:1px solid #235a37 !important;
}

#dashboard .stat:nth-child(2) strong{
    color:#3ddd62 !important;
}

#dashboard .stat:nth-child(2) small{
    color:#54c96d !important;
}


/* ==========================================================
   3 — ÉLŐ KÖVETÉS / LILA
   ========================================================== */

#dashboard .stat:nth-child(3) .stat-icon{
    color:#ae48ef !important;

    background:#29143a !important;

    border:1px solid #59306f !important;
}

#dashboard .stat:nth-child(3) strong{
    color:#b34ef1 !important;
}

#dashboard .stat:nth-child(3) small{
    color:#a986bc !important;
}


/* ==========================================================
   4 — FRISSÍTVE / ARANY
   ========================================================== */

#dashboard .stat:nth-child(4) .stat-icon{
    color:#f2c729 !important;

    background:#302814 !important;

    border:1px solid #66551d !important;
}

#dashboard .stat:nth-child(4) strong{
    color:#eef2f6 !important;

    font-size:17px !important;
}

#dashboard .stat:nth-child(4) small{
    color:#c5a92f !important;
}


/* Hover csak nagyon finoman */

#dashboard .stat:hover{
    border-color:#3a4e61 !important;

    background:
        linear-gradient(145deg,#132231 0%,#0d1b28 100%) !important;
}


/* ==========================================================
   RESPONSIVE
   ========================================================== */

@media(max-width:1200px){

    #dashboard .stats{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    }
}

@media(max-width:650px){

    #dashboard .stats{
        grid-template-columns:1fr 1fr !important;
        gap:7px !important;
    }

    #dashboard .stat{
        min-height:74px !important;
        padding:10px !important;
        gap:8px !important;
    }

    #dashboard .stat-icon{
        width:33px !important;
        height:33px !important;
        min-width:33px !important;
    }

    #dashboard .stat strong{
        font-size:19px !important;
    }
}



/* ==========================================================
   HÓRUSZ SZEME — SIDEBAR FINAL / SVG ICONS
   ========================================================== */

.sidebar nav{
    display:flex !important;
    flex-direction:column !important;
    gap:4px !important;
}


/* Menüelem */

.sidebar .nav{
    width:100% !important;
    min-height:44px !important;

    display:flex !important;
    align-items:center !important;

    gap:12px !important;

    padding:10px 12px !important;

    position:relative;

    color:#9eacbd !important;
    background:transparent !important;

    border:0 !important;
    border-radius:5px !important;

    font-size:11px !important;
    font-weight:600 !important;

    text-align:left !important;

    box-shadow:none !important;
}


/* SVG ikon */

.sidebar .nav-icon{
    width:20px !important;
    height:20px !important;
    min-width:20px !important;

    display:block;

    fill:none;

    stroke:currentColor;
    stroke-width:1.7;
    stroke-linecap:round;
    stroke-linejoin:round;

    color:#8292a6;

    transition:
        color .15s ease,
        filter .15s ease;
}


/* Hover */

.sidebar .nav:hover{
    color:#e1e7ed !important;

    background:#111f2e !important;
}

.sidebar .nav:hover .nav-icon{
    color:#c8d2dd !important;
}


/* Aktív menü */

.sidebar .nav.active{
    color:#f3c91e !important;

    background:
        linear-gradient(
            90deg,
            rgba(245,197,24,.10),
            rgba(24,39,55,.94) 38%,
            rgba(24,39,55,.94)
        ) !important;

    box-shadow:
        inset 3px 0 #f5c518 !important;
}


/* aktív ikon */

.sidebar .nav.active .nav-icon{
    color:#f5c518 !important;

    filter:
        drop-shadow(0 0 4px rgba(245,197,24,.15));
}


/* Menü szöveg */

.sidebar .nav span{
    display:block;

    overflow:hidden;

    text-overflow:ellipsis;
    white-space:nowrap;
}


/* Finom elválasztás a brand alatt */

.sidebar nav{
    padding-top:2px;
}


/* keskeny sidebar */

@media(max-width:1050px){

    .sidebar .nav{
        justify-content:center !important;

        padding-left:0 !important;
        padding-right:0 !important;
    }

    .sidebar .nav-icon{
        width:21px !important;
        height:21px !important;
        min-width:21px !important;
    }
}



/* ==========================================================
   HÓRUSZ SZEME — LOGIN FINAL
   ========================================================== */

body.login-page{
    min-height:100vh !important;

    display:grid !important;
    place-items:center !important;

    padding:20px !important;

    background:
        radial-gradient(
            circle at 50% 25%,
            rgba(30,50,67,.32) 0%,
            rgba(8,19,29,.20) 30%,
            transparent 55%
        ),
        #07111b !important;
}


/* Login kártya */

.login-card{
    width:min(390px,92vw) !important;

    padding:42px 32px 34px !important;

    text-align:center !important;

    background:
        linear-gradient(
            180deg,
            rgba(11,26,37,.98),
            rgba(7,21,31,.98)
        ) !important;

    border:1px solid #243c4c !important;
    border-radius:16px !important;

    box-shadow:
        0 24px 70px rgba(0,0,0,.30),
        inset 0 1px rgba(255,255,255,.018) !important;
}


/* Nagyobb Hórusz logó */

.login-logo{
    display:block !important;

    width:170px !important;
    height:113px !important;

    margin:0 auto 23px !important;

    object-fit:cover !important;
    object-position:center !important;

    filter:
        drop-shadow(0 4px 8px rgba(0,0,0,.45))
        drop-shadow(0 0 13px rgba(245,197,24,.10)) !important;
}


/* HÓRUSZ SZEME */

.login-card h1{
    margin:0 0 28px !important;

    color:#f5c518 !important;

    font-size:25px !important;
    font-weight:750 !important;

    line-height:1.1 !important;

    letter-spacing:1.5px !important;

    text-shadow:
        0 2px 8px rgba(0,0,0,.35) !important;
}


/* Régi alcím biztosan ne jelenjen meg */

.login-card > p{
    display:none !important;
}


/* Form */

.login-card form{
    display:grid !important;
    gap:10px !important;

    width:100% !important;
}


/* Jelszó mező */

.login-card input{
    width:100% !important;
    height:46px !important;

    padding:0 13px !important;

    background:#08151f !important;

    border:1px solid #8b7416 !important;
    border-radius:6px !important;

    color:#f1f4f6 !important;

    font-size:14px !important;

    outline:none !important;

    transition:
        border-color .15s ease,
        box-shadow .15s ease !important;
}

.login-card input::placeholder{
    color:#718293 !important;
}


/* Jelszómező fókusz */

.login-card input:focus{
    border-color:#f5c518 !important;

    box-shadow:
        0 0 0 1px rgba(245,197,24,.18),
        0 0 13px rgba(245,197,24,.07) !important;
}


/* BELÉPÉS — arany */

.login-card button{
    width:100% !important;
    height:44px !important;

    padding:0 16px !important;

    background:
        linear-gradient(
            180deg,
            #f5cb25 0%,
            #dcae0c 100%
        ) !important;

    border:1px solid #f6d143 !important;
    border-radius:6px !important;

    color:#10151a !important;

    font-size:14px !important;
    font-weight:750 !important;

    cursor:pointer !important;

    box-shadow:
        inset 0 1px rgba(255,255,255,.25),
        0 4px 12px rgba(0,0,0,.18) !important;

    transition:
        transform .12s ease,
        filter .12s ease !important;
}

.login-card button:hover{
    filter:brightness(1.07) !important;
}

.login-card button:active{
    transform:translateY(1px) !important;
}


/* Hibás jelszó */

.login-card .error{
    margin:0 0 14px !important;

    padding:9px 11px !important;

    font-size:12px !important;

    border-radius:5px !important;
}


/* Mobil */

@media(max-width:500px){

    .login-card{
        padding:35px 22px 28px !important;
    }

    .login-logo{
        width:150px !important;
        height:100px !important;
    }

    .login-card h1{
        font-size:22px !important;
    }
}



/* ==========================================================
   HÓRUSZ SZEME — TRANSPARENT LOGO FINAL
   ========================================================== */

/* SIDEBAR */

.brand img{
    width:72px !important;
    height:72px !important;
    min-width:72px !important;

    object-fit:contain !important;
    object-position:center !important;

    background:transparent !important;
    border:0 !important;
    border-radius:0 !important;

    filter:
        drop-shadow(0 3px 5px rgba(0,0,0,.35))
        drop-shadow(0 0 8px rgba(245,197,24,.12)) !important;
}


/* LOGIN — nagy Hórusz szem */

.login-logo{
    display:block !important;

    width:240px !important;
    height:180px !important;

    margin:0 auto 18px !important;

    object-fit:contain !important;
    object-position:center !important;

    background:transparent !important;
    border:0 !important;
    border-radius:0 !important;

    filter:
        drop-shadow(0 5px 8px rgba(0,0,0,.35))
        drop-shadow(0 0 14px rgba(245,197,24,.13)) !important;
}


/* Mobil */

@media(max-width:500px){
    .login-logo{
        width:210px !important;
        height:155px !important;
    }
}



/* ==========================================================
   HÓRUSZ SZEME — LOGIN LARGE FINAL
   ========================================================== */

.login-card{
    width:min(460px,94vw) !important;

    padding:
        32px
        32px
        34px !important;

    overflow:hidden !important;
}


/* Nagy Hórusz-szem */

.login-logo{
    display:block !important;

    width:360px !important;
    height:220px !important;

    max-width:none !important;

    margin:
        -15px auto
        0 !important;

    object-fit:contain !important;

    background:transparent !important;

    transform:scale(1.35) !important;
    transform-origin:center center !important;

    filter:
        drop-shadow(0 5px 8px rgba(0,0,0,.30))
        drop-shadow(0 0 12px rgba(245,197,24,.10)) !important;
}


/* Cím közelebb a logóhoz */

.login-card h1{
    position:relative !important;
    z-index:2 !important;

    margin:
        -4px
        0
        27px !important;

    color:#f5c518 !important;

    font-size:28px !important;
    font-weight:750 !important;

    letter-spacing:1.8px !important;
}


/* Jelszó */

.login-card input{
    height:48px !important;

    border:1px solid #f5c518 !important;

    background:#07141e !important;

    border-radius:6px !important;

    padding:0 14px !important;
}


/* Belépés */

.login-card button{
    height:48px !important;

    background:
        linear-gradient(
            180deg,
            #ffd42a 0%,
            #edbd0c 100%
        ) !important;

    border:1px solid #ffdb3d !important;

    border-radius:6px !important;

    color:#111 !important;

    font-weight:750 !important;
}


/* A form szélesebben használja a kártyát */

.login-card form{
    width:100% !important;
    gap:10px !important;
}


/* Mobil */

@media(max-width:500px){

    .login-card{
        width:94vw !important;
        padding:27px 25px 30px !important;
    }

    .login-logo{
        width:310px !important;
        height:195px !important;

        transform:scale(1.32) !important;

        margin:-16px auto -2px !important;
    }

    .login-card h1{
        font-size:25px !important;
        margin-bottom:25px !important;
    }
}



/* ==========================================================
   HÓRUSZ SZEME — LOGIN LOGO MÉRET / POZÍCIÓ FINAL
   ========================================================== */

.login-card{
    width:min(460px,94vw) !important;
    padding:27px 32px 34px !important;
}


/* A meglévő átlátszó PNG sokkal nagyobban */

.login-logo{
    display:block !important;

    width:430px !important;
    height:255px !important;
    max-width:none !important;

    position:relative !important;
    left:50% !important;

    margin:-27px 0 -22px 0 !important;

    object-fit:contain !important;
    object-position:center !important;

    transform:
        translateX(-50%)
        scale(1.55) !important;

    transform-origin:center center !important;

    background:transparent !important;

    filter:
        drop-shadow(0 5px 8px rgba(0,0,0,.28))
        drop-shadow(0 0 12px rgba(245,197,24,.09)) !important;
}


/* Cím közelebb a szemhez */

.login-card h1{
    position:relative !important;
    z-index:2 !important;

    margin:0 0 26px !important;

    color:#f5c518 !important;

    font-size:28px !important;
    font-weight:750 !important;

    line-height:1.1 !important;
    letter-spacing:1.8px !important;
}


/* Form */

.login-card form{
    width:100% !important;
    gap:10px !important;
}


/* Mobil */

@media(max-width:500px){

    .login-card{
        padding:24px 25px 29px !important;
    }

    .login-logo{
        width:370px !important;
        height:225px !important;

        margin:-25px 0 -20px 0 !important;

        transform:
            translateX(-50%)
            scale(1.48) !important;
    }

    .login-card h1{
        font-size:25px !important;
        margin-bottom:24px !important;
    }
}



/* ==========================================================
   HÓRUSZ SZEME — DEVICE CARDS REFERENCE FINAL
   ========================================================== */

.devices-panel{
    background:linear-gradient(150deg,#0d1c29,#08141f) !important;
}

.device-list{
    gap:10px !important;
}


/* ===== KÁRTYA ===== */

.device{
    padding:15px !important;

    border:1px solid #293e50 !important;
    border-radius:8px !important;

    background:
        linear-gradient(145deg,#101f2d 0%,#0a1722 100%) !important;

    box-shadow:
        0 7px 18px rgba(0,0,0,.16) !important;
}

.device:hover{
    border-color:#3b5870 !important;
    background:linear-gradient(145deg,#132535,#0c1b28) !important;
}


/* ONLINE */

.device-online{
    border-left:2px solid rgba(51,210,92,.65) !important;
}


/* OFFLINE */

.device-offline{
    border-left:2px solid rgba(255,74,66,.75) !important;
}


/* LIVE */

.device-live{
    border-color:#6540a1 !important;
    border-left:3px solid #a946ed !important;

    box-shadow:
        inset 3px 0 rgba(169,70,237,.18),
        0 7px 20px rgba(0,0,0,.17) !important;
}


/* ===== FELSŐ RÉSZ ===== */

.device-head{
    display:flex !important;
    justify-content:space-between !important;
    align-items:flex-start !important;
    gap:12px !important;
}

.device-identity{
    display:flex !important;
    align-items:center !important;
    gap:13px !important;
    min-width:0;
}


/* TELEFON IKON */

.device-phone{
    width:48px;
    height:58px;
    min-width:48px;

    display:grid;
    place-items:center;

    border:1px solid #35c85c;
    border-radius:7px;

    background:
        radial-gradient(circle at center,
        rgba(45,200,86,.12),
        rgba(7,20,29,.9));

    color:#42db67;

    box-shadow:
        inset 0 0 15px rgba(50,210,90,.06);
}

.device-phone svg{
    width:27px;
    height:35px;

    fill:none;
    stroke:currentColor;
    stroke-width:1.6;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.device-offline .device-phone{
    color:#ff5c53;
    border-color:#c8403d;

    background:
        radial-gradient(circle at center,
        rgba(255,75,65,.10),
        rgba(7,20,29,.9));
}

.device-live .device-phone{
    color:#b24bf2;
    border-color:#9342c7;
}


/* NÉV */

.device-title{
    min-width:0;
}

.device-name{
    color:#f5f7fa !important;

    font-size:16px !important;
    font-weight:750 !important;

    line-height:1.1;
}

.device-last{
    margin-top:5px !important;

    color:#8496a8 !important;
    font-size:10px !important;
}


/* követési mód */

.device-mode{
    margin-top:6px;

    color:#718598;
    font-size:9px;
}

.device-mode strong{
    color:#38dc69;
    font-size:9px;
}

.device-live .device-mode strong{
    color:#b94cff;
}


/* ===== JOBB FELSŐ RÉSZ ===== */

.device-status-area{
    display:flex;
    flex-direction:column;
    align-items:flex-end;
    gap:8px;
}

.device-battery-top{
    color:#f2f5f7;

    font-size:14px;
    font-weight:750;
}


/* STATUS BADGE */

.badge{
    display:flex !important;
    align-items:center !important;

    padding:4px 8px !important;

    font-size:8px !important;
    font-weight:800 !important;

    border-radius:12px !important;
}

.badge.online{
    color:#48e06c !important;
    background:#0f321d !important;
    border:1px solid #205d31 !important;
}

.badge.live{
    color:#c164ff !important;
    background:#301443 !important;
    border:1px solid #71349a !important;
}

.badge.offline{
    color:#ff6259 !important;
    background:#351919 !important;
    border:1px solid #71302e !important;
}


/* ===== METRIKÁK ===== */

.device-metrics{
    display:grid !important;

    grid-template-columns:
        minmax(100px,.75fr)
        minmax(110px,.85fr)
        minmax(160px,1.5fr) !important;

    gap:8px !important;

    margin-top:14px !important;
}

.device-metrics > .device-metric{
    min-height:61px;

    display:flex;
    align-items:center;

    gap:9px;

    padding:9px 10px !important;

    background:#081620 !important;

    border:1px solid #22394c !important;
    border-radius:6px !important;
}


/* ikon alap */

.metric-icon{
    width:31px;
    height:31px;
    min-width:31px;

    display:grid;
    place-items:center;

    border-radius:50%;

    background:#0c2230;
}

.metric-icon svg{
    width:21px;
    height:21px;

    fill:none;
    stroke:currentColor;

    stroke-width:1.7;
    stroke-linecap:round;
    stroke-linejoin:round;
}


/* AKKU zöld */

.metric-battery .metric-icon{
    color:#48d75c;
}

.metric-battery strong{
    color:#50e36a !important;
}


/* SPEED kék */

.metric-speed .metric-icon{
    color:#35bdf2;
}

.metric-speed strong{
    color:#edf6fb !important;
}


/* LOCATION zöld */

.metric-location .metric-icon{
    color:#68d83d;
}

.metric-location .metric-icon svg path{
    fill:rgba(104,216,61,.16);
}


/* szövegek */

.metric-content{
    min-width:0;
    width:100%;
}

.device-metrics small{
    margin:0 0 4px !important;

    color:#8497aa !important;

    font-size:7px !important;
    font-weight:750 !important;

    letter-spacing:1px !important;
}

.device-metrics strong{
    display:block;

    color:#eef4f8 !important;

    font-size:12px !important;
    font-weight:700 !important;

    overflow:hidden;
    text-overflow:ellipsis;
}

.device-metrics strong em{
    color:#71879a;

    font-size:8px;
    font-style:normal;
    font-weight:500;
}


/* AKKU CSÍK */

.battery-track{
    width:100%;
    height:4px;

    margin-top:6px;

    overflow:hidden;

    border-radius:5px;

    background:#182b38;
}

.battery-track span{
    display:block;

    height:100%;

    border-radius:5px;

    background:#3dd75a;

    box-shadow:0 0 5px rgba(61,215,90,.35);
}

.device-offline .battery-track span{
    background:#ff5149;
}


/* ===== GOMBOK ===== */

.device-actions{
    display:grid !important;
    grid-template-columns:1fr .55fr !important;

    gap:7px !important;

    margin-top:12px !important;
    padding-top:11px !important;

    border-top:1px solid #1d3343 !important;
}

.device-actions button{
    min-height:34px !important;

    border-radius:5px !important;

    font-size:9px !important;
    font-weight:750 !important;

    cursor:pointer;
}


/* LIVE */

.device-actions .live-action{
    color:#70bdff !important;

    border:1px solid #287bc0 !important;

    background:
        linear-gradient(180deg,#123b5d,#0d2b45) !important;

    box-shadow:
        inset 0 0 12px rgba(35,140,225,.08) !important;
}

.device-actions .live-action:hover{
    color:#a6d7ff !important;
    border-color:#3e9bea !important;

    background:
        linear-gradient(180deg,#164a72,#103553) !important;
}


/* LIVE STOP */

.device-actions .live-action.danger{
    color:#ff8c85 !important;

    border-color:#813633 !important;

    background:
        linear-gradient(180deg,#4b201f,#351818) !important;
}


/* Követés */

.device-actions .settings-action{
    color:#c3d0dc !important;

    border:1px solid #354b5e !important;

    background:#101f2b !important;
}


/* kisebb kijelző */

@media(max-width:1350px){

    .device-metrics{
        grid-template-columns:1fr 1fr !important;
    }

    .metric-location{
        grid-column:1 / -1;
    }
}



/* ==========================================================
   HÓRUSZ SZEME — DEVICE ADDRESS
   ========================================================== */

.device-address{
    display:flex;
    align-items:center;
    gap:8px;

    margin-top:13px;
    padding:9px 11px;

    min-height:36px;

    border:1px solid #263d4e;
    border-radius:6px;

    background:
        linear-gradient(90deg,
        rgba(17,42,53,.88),
        rgba(8,24,34,.88));

    color:#8298a7;

    font-size:10px;
    line-height:1.35;
}

.device-address.loaded{
    color:#d8e4e8;
}

.device-address-pin{
    display:inline-grid;
    place-items:center;

    width:21px;
    height:21px;
    min-width:21px;

    color:#58dc69;

    font-size:17px;
    font-weight:800;
}

.device-live .device-address-pin{
    color:#b94cff;
}

.device-offline .device-address-pin{
    color:#ff6259;
}



/* ==========================================================
   HÓRUSZ SZEME — MAP POPUP ADDRESS
   ========================================================== */

.map-popup-name{
    font-size:14px;
    font-weight:750;
    margin-bottom:5px;
}

.map-popup-address{
    margin:6px 0 8px;

    color:#35b97c;

    font-size:11px;
    font-weight:650;
    line-height:1.35;
}

.horus-google-popup .map-popup-address{
    color:#16885b;
}

.horus-osm-popup{
    min-width:180px;
    line-height:1.45;
}



/* ==========================================================
   HÓRUSZ SZEME — SÖTÉT TÉRKÉP POPUPOK
   ========================================================== */

/* ---------- Google Maps ---------- */

.gm-style .gm-style-iw-c{
    background:#091720 !important;
    border:1px solid #263d4c !important;
    border-radius:9px !important;

    box-shadow:
        0 14px 35px rgba(0,0,0,.55),
        0 0 0 1px rgba(255,255,255,.02) !important;

    padding:0 !important;
}

.gm-style .gm-style-iw-d{
    overflow:hidden !important;
    padding:14px 17px 13px !important;

    color:#dbe7eb !important;
}

.gm-style .gm-style-iw-tc::after{
    background:#091720 !important;
}

.gm-style .gm-ui-hover-effect{
    filter:invert(1);
    opacity:.65 !important;
}

.horus-google-popup{
    min-width:210px;

    color:#aebfc7 !important;

    font-size:12px;
    line-height:1.55;
}

.horus-google-popup-name{
    margin-bottom:7px;

    font-size:16px;
    font-weight:800;
    letter-spacing:.2px;
}

.horus-google-popup .map-popup-address{
    margin:4px 0 9px;

    color:#e5edf0 !important;

    font-size:11px;
    line-height:1.45;
}


/* ---------- OpenStreetMap / Leaflet ---------- */

.leaflet-popup-content-wrapper{
    background:#091720 !important;

    border:1px solid #263d4c !important;
    border-radius:9px !important;

    color:#dbe7eb !important;

    box-shadow:
        0 14px 35px rgba(0,0,0,.55),
        0 0 0 1px rgba(255,255,255,.02) !important;
}

.leaflet-popup-content{
    margin:14px 17px !important;

    color:#aebfc7 !important;

    font-size:12px;
    line-height:1.55;
}

.leaflet-popup-tip{
    background:#091720 !important;
}

.leaflet-popup-close-button{
    color:#8ca0aa !important;

    font-size:20px !important;
}

.leaflet-popup-close-button:hover{
    color:#ffffff !important;
}

.horus-osm-popup{
    min-width:210px;

    color:#aebfc7;
}

.map-popup-name{
    margin-bottom:7px;

    font-size:16px;
    font-weight:800;
    letter-spacing:.2px;
}

.horus-osm-popup .map-popup-address{
    margin:4px 0 9px;

    color:#e5edf0 !important;

    font-size:11px;
    line-height:1.45;
}



/* ==========================================================
   HÓRUSZ SZEME — MAP POPUP V2
   ========================================================== */

.horus-map-popup{
    width:310px;
    max-width:310px;

    font-family:Inter,"Segoe UI",Arial,sans-serif;

    color:#d9e3e9;
}

.horus-map-popup .map-popup-name{
    padding:1px 0 10px;

    font-size:17px;
    line-height:1.15;
    font-weight:800;
    letter-spacing:.1px;
}

.horus-map-popup .map-popup-divider{
    height:1px;

    margin:0 0 2px;

    background:#263d4c;
}

.horus-map-popup .map-popup-row{
    display:grid;

    grid-template-columns:28px 82px minmax(0,1fr);

    align-items:center;

    min-height:47px;

    border-bottom:1px solid rgba(57,82,97,.55);
}

.horus-map-popup .map-popup-row:last-child{
    border-bottom:0;
}

.horus-map-popup .map-popup-icon{
    width:21px;
    height:21px;

    display:flex;
    align-items:center;
    justify-content:center;
}

.horus-map-popup .map-popup-icon svg{
    width:20px;
    height:20px;

    fill:none;
    stroke:currentColor;
    stroke-width:1.9;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.horus-map-popup .map-popup-icon-location{
    color:#48d86b;
}

.horus-map-popup .map-popup-icon-location svg path{
    fill:rgba(72,216,107,.13);
}

.horus-map-popup .map-popup-icon-battery{
    color:#62d96c;
}

.horus-map-popup .map-popup-icon-battery svg path:last-child{
    fill:currentColor;
    stroke:none;
}

.horus-map-popup .map-popup-icon-time{
    color:#58aef7;
}

.horus-map-popup .map-popup-label{
    color:#a9bac4;

    font-size:12px;
    font-weight:600;

    white-space:nowrap;
}

.horus-map-popup .map-popup-value{
    color:#f0f5f7;

    font-size:12px;
    font-weight:650;

    line-height:1.35;

    text-align:left;
}

.horus-map-popup .map-popup-location .map-popup-value{
    padding:8px 0;
}


/* ---------- GOOGLE ---------- */

.gm-style .gm-style-iw-c{
    background:#081721 !important;

    border:1px solid #254050 !important;
    border-radius:10px !important;

    box-shadow:0 14px 35px rgba(0,0,0,.55) !important;

    padding:0 !important;
}

.gm-style .gm-style-iw-d{
    padding:15px 18px 13px !important;

    overflow:hidden !important;
}

.gm-style .gm-style-iw-tc::after{
    background:#081721 !important;
}

.gm-style .gm-ui-hover-effect{
    filter:invert(1);
    opacity:.7 !important;
}


/* ---------- LEAFLET / OSM ---------- */

.leaflet-popup-content-wrapper{
    background:#081721 !important;

    border:1px solid #254050 !important;
    border-radius:10px !important;

    box-shadow:0 14px 35px rgba(0,0,0,.55) !important;
}

.leaflet-popup-content{
    margin:15px 18px 13px !important;

    width:auto !important;
}

.leaflet-popup-tip{
    background:#081721 !important;
}

.leaflet-popup-close-button{
    top:6px !important;
    right:7px !important;

    color:#91a5b0 !important;

    font-size:21px !important;
    font-weight:400 !important;
}

.leaflet-popup-close-button:hover{
    color:#ffffff !important;
}



/* ==========================================================
   HÓRUSZ SZEME — GOOGLE / OSM POPUP COLOR FIX V3
   ========================================================== */

.horus-map-popup{
    width:330px !important;
    max-width:330px !important;

    font-family:Inter,"Segoe UI",Roboto,Arial,sans-serif !important;

    background:#081721 !important;
    color:#dce7ed !important;
}


/* Készüléknév */

.horus-map-popup .map-popup-name{
    padding:2px 0 12px !important;

    font-size:18px !important;
    font-weight:800 !important;
    line-height:1.15 !important;
}


/* Elválasztó */

.horus-map-popup .map-popup-divider{
    height:1px !important;
    margin-bottom:4px !important;

    background:#294453 !important;
}


/* Adatsorok */

.horus-map-popup .map-popup-row{
    display:grid !important;

    grid-template-columns:38px 88px minmax(0,1fr) !important;

    align-items:center !important;

    min-height:52px !important;

    border-bottom:1px solid rgba(55,82,97,.65) !important;
}

.horus-map-popup .map-popup-row:last-child{
    border-bottom:0 !important;
}


/* ---------- IKON DOBOZOK ---------- */

.horus-map-popup .map-popup-icon{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    width:29px !important;
    height:29px !important;

    border-radius:7px !important;
}


/* HELY */

.horus-map-popup .map-popup-icon-location{
    color:#43e071 !important;

    background:rgba(34,197,94,.13) !important;
    border:1px solid rgba(34,197,94,.32) !important;

    box-shadow:0 0 14px rgba(34,197,94,.08) !important;
}


/* AKKU */

.horus-map-popup .map-popup-icon-battery{
    color:#f6c945 !important;

    background:rgba(246,201,69,.12) !important;
    border:1px solid rgba(246,201,69,.30) !important;

    box-shadow:0 0 14px rgba(246,201,69,.07) !important;
}


/* IDŐ */

.horus-map-popup .map-popup-icon-time{
    color:#4ba7ff !important;

    background:rgba(59,130,246,.13) !important;
    border:1px solid rgba(59,130,246,.32) !important;

    box-shadow:0 0 14px rgba(59,130,246,.08) !important;
}


/* SVG */

.horus-map-popup .map-popup-icon svg{
    width:18px !important;
    height:18px !important;

    stroke:currentColor !important;
    stroke-width:2 !important;

    fill:none !important;
}


/* Hely ikon legyen teltebb */

.horus-map-popup .map-popup-icon-location svg path{
    fill:currentColor !important;
    fill-opacity:.22 !important;
}


/* Akku töltöttség */

.horus-map-popup .map-popup-icon-battery svg path:last-child{
    fill:currentColor !important;
    stroke:none !important;
}


/* CÍMKÉK */

.horus-map-popup .map-popup-label{
    color:#91a6b2 !important;

    font-size:12px !important;
    font-weight:600 !important;

    letter-spacing:.1px !important;
}


/* ÉRTÉKEK */

.horus-map-popup .map-popup-value{
    color:#edf5f7 !important;

    font-size:12px !important;
    font-weight:700 !important;

    line-height:1.4 !important;
}


/* A hely legyen kissé hangsúlyosabb */

.horus-map-popup .map-popup-location .map-popup-value{
    color:#f5f8fa !important;

    padding:8px 0 !important;
}


/* ==========================================================
   GOOGLE INFOWINDOW KÉNYSZERÍTETT SÖTÉT TÉMA
   ========================================================== */

.gm-style .gm-style-iw-c{
    background:#081721 !important;

    border:1px solid #294656 !important;
    border-radius:11px !important;

    padding:0 !important;

    box-shadow:
        0 18px 45px rgba(0,0,0,.60),
        0 0 18px rgba(20,90,120,.08) !important;
}


.gm-style .gm-style-iw-d{
    background:#081721 !important;

    color:#dce7ed !important;

    padding:16px 19px 14px !important;

    overflow:hidden !important;
}


.gm-style .gm-style-iw-t{
    color:#dce7ed !important;
}


.gm-style .gm-style-iw-tc{
    filter:none !important;
}


.gm-style .gm-style-iw-tc::after{
    background:#081721 !important;
}


/* Google bezáró X */

.gm-style .gm-ui-hover-effect{
    top:4px !important;
    right:4px !important;

    width:30px !important;
    height:30px !important;

    opacity:.8 !important;

    filter:invert(1) brightness(1.8) !important;
}


/* Google esetén se legyen fehér örökölt szövegmező */

.gm-style .horus-google-popup,
.gm-style .horus-google-popup div{
    font-family:Inter,"Segoe UI",Roboto,Arial,sans-serif;
}


/* ==========================================================
   LEAFLET
   ========================================================== */

.leaflet-popup-content-wrapper{
    background:#081721 !important;

    border:1px solid #294656 !important;

    border-radius:11px !important;

    box-shadow:
        0 18px 45px rgba(0,0,0,.60),
        0 0 18px rgba(20,90,120,.08) !important;
}


.leaflet-popup-content{
    color:#dce7ed !important;
}


.leaflet-popup-tip{
    background:#081721 !important;

    border-right:1px solid #294656 !important;
    border-bottom:1px solid #294656 !important;
}



/* ==========================================================
   HÓRUSZ SZEME — MAP POPUP FINAL FIX
   Google + OSM
   ========================================================== */

/* ---------- ALAP POPUP ---------- */

.horus-map-popup{
    width:320px !important;
    max-width:320px !important;
    background:#081923 !important;
    color:#dce8ee !important;
    font-family:Inter,"Segoe UI",Roboto,Arial,sans-serif !important;
}


/* ---------- KÉSZÜLÉKNÉV ---------- */

.horus-map-popup .map-popup-name{
    padding:2px 0 13px !important;
    margin:0 !important;

    font-size:18px !important;
    line-height:1.15 !important;
    font-weight:800 !important;

    /* a színt az inline devicePopupColor adja */
}


/* ---------- ELVÁLASZTÓ ---------- */

.horus-map-popup .map-popup-divider{
    height:1px !important;
    margin:0 !important;
    padding:0 !important;

    background:#294451 !important;
}


/* ---------- SOROK ---------- */

.horus-map-popup .map-popup-row{
    display:grid !important;
    grid-template-columns:38px 86px minmax(0,1fr) !important;

    align-items:center !important;

    min-height:51px !important;
    margin:0 !important;
    padding:0 !important;

    color:#dce8ee !important;

    border-bottom:1px solid #294451 !important;
}

.horus-map-popup .map-popup-row:last-child{
    border-bottom:0 !important;
}


/* ---------- CÍMKÉK ---------- */

.horus-map-popup .map-popup-label,
.gm-style .horus-map-popup .map-popup-label,
.gm-style-iw .horus-map-popup .map-popup-label{
    color:#aebdc6 !important;

    font-size:12px !important;
    line-height:1.25 !important;
    font-weight:600 !important;

    opacity:1 !important;
}


/* ---------- ÉRTÉKEK ---------- */

.horus-map-popup .map-popup-value,
.gm-style .horus-map-popup .map-popup-value,
.gm-style-iw .horus-map-popup .map-popup-value{
    color:#f4f8fa !important;

    font-size:12px !important;
    line-height:1.35 !important;
    font-weight:700 !important;

    opacity:1 !important;
}


/* Hely hosszabb lehet */

.horus-map-popup .map-popup-location .map-popup-value{
    padding:9px 0 !important;
}


/* ==========================================================
   IKONOK
   ========================================================== */

.horus-map-popup .map-popup-icon{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    width:30px !important;
    height:30px !important;

    border-radius:7px !important;
}


/* SVG alap */

.horus-map-popup .map-popup-icon svg{
    display:block !important;

    width:18px !important;
    height:18px !important;

    fill:none !important;
    stroke:currentColor !important;
    stroke-width:2.2 !important;
    stroke-linecap:round !important;
    stroke-linejoin:round !important;

    opacity:1 !important;
}


/* HELY — ZÖLD */

.horus-map-popup .map-popup-icon-location{
    color:#32df72 !important;

    background:#0b3024 !important;
    border:1px solid #146d3d !important;
}

.horus-map-popup .map-popup-icon-location svg{
    color:#32df72 !important;
    stroke:#32df72 !important;
}

.horus-map-popup .map-popup-icon-location svg path{
    fill:none !important;
    stroke:#32df72 !important;
}

.horus-map-popup .map-popup-icon-location svg circle{
    fill:#32df72 !important;
    stroke:#32df72 !important;
}


/* AKKU — ARANY */

.horus-map-popup .map-popup-icon-battery{
    color:#f6c928 !important;

    background:#30270b !important;
    border:1px solid #756019 !important;
}

.horus-map-popup .map-popup-icon-battery svg{
    color:#f6c928 !important;
    stroke:#f6c928 !important;
}

.horus-map-popup .map-popup-icon-battery svg rect{
    stroke:#f6c928 !important;
}

.horus-map-popup .map-popup-icon-battery svg path{
    stroke:#f6c928 !important;
}

.horus-map-popup .map-popup-icon-battery svg path:last-child{
    fill:#f6c928 !important;
    stroke:none !important;
}


/* IDŐ — KÉK */

.horus-map-popup .map-popup-icon-time{
    color:#42a5ff !important;

    background:#0b2942 !important;
    border:1px solid #175a8f !important;
}

.horus-map-popup .map-popup-icon-time svg{
    color:#42a5ff !important;
    stroke:#42a5ff !important;
}


/* ==========================================================
   GOOGLE MAPS
   ========================================================== */

.gm-style .gm-style-iw-c{
    background:#081923 !important;

    border:1px solid #294654 !important;
    border-radius:11px !important;

    padding:0 !important;

    box-shadow:
        0 18px 42px rgba(0,0,0,.62),
        0 0 0 1px rgba(255,255,255,.015) !important;
}


.gm-style .gm-style-iw-d{
    background:#081923 !important;

    color:#dce8ee !important;

    padding:17px 19px 14px !important;

    overflow:hidden !important;
}


/* Google minden belső szövegének alapja */

.gm-style .gm-style-iw-d .horus-map-popup{
    color:#dce8ee !important;
}


/* Google popup nyíl */

.gm-style .gm-style-iw-tc::after{
    background:#081923 !important;
}


/* GOOGLE X TELJES ELTÜNTETÉSE */

.gm-style .gm-ui-hover-effect{
    display:none !important;
}


/* ==========================================================
   LEAFLET / OPENSTREETMAP
   ========================================================== */

.leaflet-popup-content-wrapper{
    background:#081923 !important;

    border:1px solid #294654 !important;
    border-radius:11px !important;

    box-shadow:
        0 18px 42px rgba(0,0,0,.62) !important;
}


.leaflet-popup-content{
    margin:17px 19px 14px !important;

    width:auto !important;

    color:#dce8ee !important;
}


.leaflet-popup-tip{
    background:#081923 !important;
}


/* OSM X-et is eltüntetjük, hogy azonos legyen */

.leaflet-popup-close-button{
    display:none !important;
}



/* ==========================================================
   HÓRUSZ SZEME — KÉSZÜLÉK CÍM BULLETPOINT
   ========================================================== */

/* Régi cím ikon / alakzat eltüntetése */
.device-address-pin{
    font-size:0 !important;
    width:12px !important;
    min-width:12px !important;

    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;

    color:#dce8ee !important;
}

/* Egyszerű bulletpoint */
.device-address-pin::before{
    content:"•" !important;

    display:block !important;

    font-size:17px !important;
    line-height:1 !important;
    font-weight:700 !important;

    color:#dce8ee !important;

    text-shadow:none !important;
}



/* ==========================================================
   HÓRUSZ SZEME — CÍM EGYSÉGES SZÍN
   ========================================================== */

.device-address,
.device-address.loaded,
.device-address span,
.device-address.loaded span{
    color:#dce8ee !important;
}

/* Bullet ugyanaz a szín */
.device-address-pin,
.device-address-pin::before{
    color:#dce8ee !important;
}



/* ==========================================================
   HÓRUSZ SZEME — SIDEBAR MENÜ TIPOGRÁFIA
   ========================================================== */

.sidebar .nav{
    font-size:13px !important;
    font-weight:700 !important;
    letter-spacing:.45px !important;
    text-transform:uppercase !important;

    padding-top:14px !important;
    padding-bottom:14px !important;
}

/* Menü szövege */
.sidebar .nav span{
    font-size:13px !important;
    font-weight:700 !important;
    letter-spacing:.45px !important;
    text-transform:uppercase !important;
}

/* Nem aktív menüpont legyen jobban olvasható */
.sidebar .nav:not(.active){
    color:#aab8c5 !important;
}

/* Aktív menüpont */
.sidebar .nav.active{
    color:#ffd21f !important;
    font-weight:800 !important;
}

/* Sidebar ikonok picit nagyobbak */
.sidebar .nav svg{
    width:19px !important;
    height:19px !important;
    min-width:19px !important;
}

/* Menüpontok közötti kis plusz tér */
.sidebar nav{
    gap:9px !important;
}



/* ==========================================================
   HÓRUSZ SZEME — STAT MODERN SVG ICONS
   ========================================================== */

#dashboard .stat-icon svg{
    width:22px !important;
    height:22px !important;

    display:block !important;

    fill:none !important;
    stroke:currentColor !important;
    stroke-width:1.8 !important;
    stroke-linecap:round !important;
    stroke-linejoin:round !important;
}

/* Apró részletek lehetnek kitöltve */
#dashboard .stat-icon svg circle[r=".7"],
#dashboard .stat-icon svg circle[r="1"]{
    fill:currentColor !important;
    stroke:none !important;
}

/* Ikonok picit erősebb vizuális jelenléte */
#dashboard .stat-icon{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
}



/* ==========================================================
   HÓRUSZ SZEME — STAT KÁRTYÁK NAGYOBB, OLVASHATÓ BETŰK
   ========================================================== */

#dashboard .stats{
    gap:14px !important;
}

/* Kártya */
#dashboard .stat{
    min-height:105px !important;
    padding:16px 18px !important;
    gap:16px !important;
}

/* Ikondoboz */
#dashboard .stat-icon{
    width:48px !important;
    height:48px !important;
    min-width:48px !important;
}

/* SVG ikon */
#dashboard .stat-icon svg{
    width:27px !important;
    height:27px !important;
}

/* FELSŐ FELIRAT
   ÖSSZES ESZKÖZ / ELÉRHETŐ / stb. */
#dashboard .stat span{
    font-size:13px !important;
    line-height:1.25 !important;

    font-weight:750 !important;
    letter-spacing:.7px !important;
}

/* NAGY ÉRTÉK
   3 / 2 / 0 / idő */
#dashboard .stat strong{
    font-size:27px !important;
    line-height:1.1 !important;

    font-weight:800 !important;

    margin:5px 0 4px !important;
}

/* ALSÓ MAGYARÁZAT
   regisztrált készülék / aktív készülék / stb. */
#dashboard .stat small{
    display:block !important;

    font-size:12px !important;
    line-height:1.3 !important;

    font-weight:650 !important;
}

/* A frissítés ideje hosszabb, de ez is legyen jól látható */
#dashboard .stat:nth-child(4) strong{
    font-size:22px !important;
}


/* Kisebb képernyőn se zsugorítsuk olvashatatlanra */
@media(max-width:1200px){

    #dashboard .stat{
        min-height:100px !important;
        padding:14px !important;
    }

    #dashboard .stat span{
        font-size:12px !important;
    }

    #dashboard .stat strong{
        font-size:24px !important;
    }

    #dashboard .stat small{
        font-size:11px !important;
    }

    #dashboard .stat-icon{
        width:44px !important;
        height:44px !important;
        min-width:44px !important;
    }

    #dashboard .stat-icon svg{
        width:24px !important;
        height:24px !important;
    }
}



/* ==========================================================
   HÓRUSZ SZEME — KÉSZÜLÉK PANEL OLVASHATÓSÁG
   ========================================================== */

/* Panel fejléc */

.devices-panel .section-kicker{
    font-size:11px !important;
    font-weight:800 !important;
    letter-spacing:1.5px !important;
}

.devices-panel .panel-title h2{
    font-size:17px !important;
    font-weight:800 !important;
}

.devices-panel .panel-title .muted{
    font-size:11px !important;
    letter-spacing:.7px !important;
}


/* ---------- KÉSZÜLÉK FEJLÉC ---------- */

/* Készülék neve */
.devices-panel .device-name{
    font-size:17px !important;
    line-height:1.2 !important;
    font-weight:800 !important;
}

/* Utolsó jelentés */
.devices-panel .device-last{
    margin-top:4px !important;

    font-size:12px !important;
    line-height:1.35 !important;

    color:#91a7b4 !important;
}

/* Követési mód */
.devices-panel .device-mode{
    margin-top:3px !important;

    font-size:11px !important;
    line-height:1.35 !important;

    color:#829aa7 !important;
}

.devices-panel .device-mode strong{
    font-size:11px !important;
    font-weight:800 !important;
}


/* Akku százalék jobb felső sarok */

.devices-panel .device-battery-top{
    font-size:17px !important;
    line-height:1 !important;
    font-weight:800 !important;

    color:#f3f7f9 !important;
}


/* ELÉRHETŐ / NEM ELÉRHETŐ / ÉLŐ */

.devices-panel .badge{
    font-size:10px !important;
    font-weight:800 !important;
    letter-spacing:.25px !important;

    padding:5px 9px !important;
}


/* ---------- CÍM ---------- */

.devices-panel .device-address,
.devices-panel .device-address.loaded,
.devices-panel .device-address span{
    font-size:12px !important;
    line-height:1.4 !important;
    font-weight:650 !important;

    color:#dce8ee !important;
}

.devices-panel .device-address{
    min-height:43px !important;
    padding:10px 13px !important;
}


/* Bullet */

.devices-panel .device-address-pin::before{
    font-size:18px !important;
}


/* ---------- AKKU / SEBESSÉG / HELYZET ---------- */

.devices-panel .device-metric small{
    font-size:9px !important;
    line-height:1.2 !important;

    font-weight:800 !important;
    letter-spacing:1.1px !important;

    color:#8fa5b1 !important;
}

.devices-panel .device-metric strong{
    font-size:14px !important;
    line-height:1.25 !important;

    font-weight:800 !important;

    color:#f1f6f8 !important;
}

/* km/h */
.devices-panel .device-metric strong span,
.devices-panel .device-metric .unit{
    font-size:10px !important;
}


/* Metric kártyák kapjanak helyet a nagyobb betűkhöz */

.devices-panel .device-metric{
    min-height:61px !important;
    padding:9px 10px !important;
}


/* Metric ikonok */

.devices-panel .metric-icon{
    width:32px !important;
    height:32px !important;
    min-width:32px !important;
}

.devices-panel .metric-icon svg{
    width:19px !important;
    height:19px !important;
}


/* ---------- GOMBOK ---------- */

.devices-panel .device-actions button{
    min-height:36px !important;

    font-size:11px !important;
    font-weight:800 !important;

    letter-spacing:.15px !important;
}


/* ---------- KÁRTYA TÉRKÖZ ---------- */

.devices-panel .device{
    padding:15px 16px !important;
}

.devices-panel .device-head{
    margin-bottom:12px !important;
}

.devices-panel .device-metrics{
    margin-top:13px !important;
    gap:9px !important;
}

.devices-panel .device-actions{
    margin-top:13px !important;
    padding-top:13px !important;
}


/* A lista elemei között legyen levegő */

.devices-panel .device-list{
    gap:12px !important;
}



/* ==========================================================
   HÓRUSZ SZEME — KIJELENTKEZÉS SIDEBAR GOMB
   ========================================================== */

.sidebar .side-bottom{
    margin-top:auto !important;

    padding:14px 0 0 !important;

    border-top:1px solid rgba(100,121,143,.20) !important;
}

/* Kijelentkezés ugyanabban a stílusban, mint a menüpontok */
.sidebar .side-bottom a{
    width:100% !important;
    min-height:44px !important;

    display:flex !important;
    align-items:center !important;

    padding:10px 12px !important;

    border-radius:7px !important;

    color:#aab8c5 !important;
    background:transparent !important;

    font-size:13px !important;
    font-weight:700 !important;
    line-height:1.2 !important;

    letter-spacing:.45px !important;
    text-transform:uppercase !important;

    text-decoration:none !important;

    transition:
        background .15s ease,
        color .15s ease !important;
}

/* Hover ugyanúgy, mint a sidebar menü */
.sidebar .side-bottom a:hover{
    background:#112638 !important;
    color:#ffffff !important;
}



/* ==========================================================
   HÓRUSZ SZEME — KIJELENTKEZÉS SVG IKON
   ========================================================== */

.sidebar .side-bottom a{
    gap:12px !important;
}

.sidebar .side-bottom .nav-icon{
    width:19px !important;
    height:19px !important;
    min-width:19px !important;

    fill:none !important;
    stroke:currentColor !important;
    stroke-width:1.8 !important;
    stroke-linecap:round !important;
    stroke-linejoin:round !important;

    color:#8fa4b5 !important;
}

.sidebar .side-bottom a span{
    font-size:13px !important;
    font-weight:700 !important;
    letter-spacing:.45px !important;
    text-transform:uppercase !important;
}

.sidebar .side-bottom a:hover .nav-icon{
    color:#ffffff !important;
}



/* ==========================================================
   HÓRUSZ SZEME — FEJLÉC STÁTUSZ ÉS ÓRA OLVASHATÓSÁG
   ========================================================== */

.header-right{
    gap:22px !important;
    align-items:center !important;
}

/* RENDSZER ELÉRHETŐ */
.system-pill{
    font-size:13px !important;
    font-weight:800 !important;
    line-height:1 !important;

    letter-spacing:.8px !important;

    padding:10px 15px !important;

    border-radius:22px !important;
}

/* Zöld állapotjelző pont */
.system-pill .pulse,
.pulse{
    width:9px !important;
    height:9px !important;

    margin-right:7px !important;

    box-shadow:0 0 0 4px rgba(55,214,162,.12) !important;
}

/* DÁTUM + IDŐ */
#clock{
    color:#dce7ee !important;

    font-size:16px !important;
    font-weight:700 !important;
    line-height:1.2 !important;

    letter-spacing:.15px !important;

    white-space:nowrap !important;
}


/* Kisebb kijelzőn is maradjon olvasható */
@media(max-width:1050px){

    .system-pill{
        font-size:12px !important;
        padding:9px 12px !important;
    }

    #clock{
        font-size:14px !important;
    }

    .header-right{
        gap:14px !important;
    }
}



/* ==========================================================
   HÓRUSZ SZEME — LOGIN KATTINTÁS JAVÍTÁS
   A megjelenést nem módosítja
   ========================================================== */

/* A nagyított logó ne tudja elfogni az input kattintását */
.login-page .login-logo{
    pointer-events:none !important;
    user-select:none !important;
}

/* A form mindig a dekoratív logó fölött legyen */
.login-page .login-card form{
    position:relative !important;
    z-index:10 !important;
}

/* A jelszómező garantáltan interaktív */
.login-page .login-card input{
    position:relative !important;
    z-index:11 !important;
    pointer-events:auto !important;
}

/* A gomb is maradjon biztosan kattintható */
.login-page .login-card button{
    position:relative !important;
    z-index:11 !important;
    pointer-events:auto !important;
}



/* ==========================================================
   HÓRUSZ SZEME — ELŐZMÉNYEK OLVASHATÓSÁG
   ========================================================== */

/* Szűrők */
#history .filters input,
#history .filters select,
#history .filters button{
    font-size:15px !important;
    font-weight:600 !important;
    min-height:46px !important;
    padding:10px 14px !important;
}

/* Felső összesítő információ */
#history .db-summary{
    font-size:14px !important;
    line-height:1.6 !important;
    font-weight:500 !important;
}

/* Szekciócímek */
#history .section-kicker{
    font-size:11px !important;
}

#history .panel-title h2{
    font-size:18px !important;
}

/* Táblázat */
#history table{
    font-size:14px !important;
}

/* Fejléc */
#history th{
    font-size:12px !important;
    font-weight:800 !important;
    letter-spacing:.7px !important;
    padding:13px 12px !important;
}

/* Adatsorok */
#history td{
    font-size:14px !important;
    font-weight:500 !important;
    padding:13px 12px !important;
    line-height:1.35 !important;
}

/* Eszköznév legyen hangsúlyosabb */
#history td:nth-child(2){
    font-weight:750 !important;
}

/* Útvonal összesítő */
#history .history-summary,
#history .route-summary{
    font-size:14px !important;
    line-height:1.6 !important;
}



/* ==========================================================
   HÓRUSZ SZEME — PÁROSÍTÁS NAGYOBB / OLVASHATÓBB
   ========================================================== */

#pairing .panel.narrow{
    max-width:820px !important;
    width:100% !important;
    padding:28px 30px !important;
}

/* Cím */
#pairing .panel-title{
    margin-bottom:20px !important;
    padding-bottom:17px !important;
}

#pairing .panel-title h2{
    font-size:22px !important;
    font-weight:750 !important;
}

/* Párosító tartalom */
#pairing .pair-box{
    gap:16px !important;
}

/* Készüléknév mező */
#pairing .pair-box input{
    width:100% !important;
    min-height:52px !important;

    padding:12px 15px !important;

    font-size:16px !important;
    font-weight:500 !important;

    border-radius:7px !important;
}

/* Placeholder is legyen olvasható */
#pairing .pair-box input::placeholder{
    font-size:15px !important;
    color:#718b9d !important;
}

/* Párosító gomb */
#pairing .pair-box button{
    min-height:50px !important;

    padding:12px 20px !important;

    font-size:14px !important;
    font-weight:800 !important;

    text-transform:uppercase !important;
    letter-spacing:.4px !important;

    border-radius:6px !important;
}

/* Létrehozott párosító kód */
#pairing .pair-code{
    font-size:46px !important;
    font-weight:850 !important;
    letter-spacing:7px !important;
}

/* Segédszövegek */
#pairing .muted,
#pairing p{
    font-size:15px !important;
    line-height:1.6 !important;
}


/* Kisebb képernyő */
@media(max-width:900px){

    #pairing .panel.narrow{
        max-width:none !important;
        padding:22px !important;
    }

    #pairing .panel-title h2{
        font-size:20px !important;
    }

    #pairing .pair-code{
        font-size:36px !important;
    }
}



/* ==========================================================
   HÓRUSZ SZEME — ELŐZMÉNYEK TÉRKÉP FEJLÉC NAGYÍTÁS
   ========================================================== */

/* ÚTVONAL */
#history .panel-title .section-kicker{
    font-size:13px !important;
    font-weight:850 !important;
    letter-spacing:1.6px !important;
    margin-bottom:7px !important;
}

/* Helyelőzmények térképen */
#history .panel-title h2{
    font-size:20px !important;
    font-weight:750 !important;
    line-height:1.25 !important;
}

/* Jobb oldali TÉRKÉP felirat */
#history .map-tools label{
    font-size:12px !important;
    font-weight:800 !important;
    letter-spacing:1px !important;
}

/* Térképtípus választó */
#history .map-tools select{
    min-width:180px !important;
    min-height:44px !important;

    padding:9px 13px !important;

    font-size:14px !important;
    font-weight:650 !important;

    border-radius:7px !important;
}

/* Fejlécnek kicsit több hely */
#history .panel-title{
    min-height:64px !important;
    align-items:center !important;
}



/* ==========================================================
   HÓRUSZ SZEME — ADATBÁZIS ÖSSZESÍTŐ KÁRTYÁK
   ========================================================== */

#history .db-summary{
    display:grid !important;
    grid-template-columns:
        minmax(110px,.65fr)
        minmax(220px,1.25fr)
        minmax(220px,1.25fr)
        minmax(180px,1fr)
        minmax(200px,1.1fr) !important;

    gap:14px !important;

    margin:18px 0 20px !important;
    min-height:0 !important;

    align-items:stretch !important;
}

#history .db-summary-item{
    display:flex;
    flex-direction:column;
    justify-content:center;

    min-height:72px;

    padding:13px 16px;

    background:#0b1a26;

    border:1px solid #294052;
    border-radius:7px;
}

#history .db-summary-item span{
    display:block;

    margin-bottom:7px;

    color:#829bad;

    font-size:11px !important;
    font-weight:800 !important;
    letter-spacing:1px;

    white-space:nowrap;
}

#history .db-summary-item strong{
    display:block;

    color:#eef6f8;

    font-size:16px !important;
    font-weight:750 !important;
    line-height:1.3;
}

/* Rekordszám kapjon egy kis hangsúlyt */
#history .db-summary-item:first-child strong{
    color:#56a9ff;
    font-size:20px !important;
}

/* Keskenyebb kijelző */
@media(max-width:1200px){
    #history .db-summary{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    }
}

@media(max-width:650px){
    #history .db-summary{
        grid-template-columns:1fr !important;
        gap:9px !important;
    }
}