/* --- FUENTES Y CONFIGURACIÓN BASE --- */
@import url('https://fonts.googleapis.com/css2?family=Exo+2:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

body {
    font-family: "Exo 2", sans-serif !important;
}

/* --- WIDGETS Y SIDEBAR --- */
#widgets .widget-body .full-text { white-space: normal; line-height: 1; }
#widgets .widget-title [data-device=name] { margin-right: 10px; max-width: 250px; display: inline-block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
div#device_add_btn { width: 100%; }

#widgets.collapsed .sidebar.btn-collapse, .sidebar.collapsed, .sidebar.collapsed .sidebar.btn-collapse { margin-left: -280px !important; }
#widgets.collapsed .sidebar.btn-collapse .sidebar-content, .sidebar.collapsed .sidebar-content { overflow: unset; }
#widgets.collapsed .sidebar.btn-collapse .sidebar-content .group, .sidebar.collapsed .sidebar-content .group { display: block; }

#sidebar .group { margin: 5px; border: 1px solid #ebebeb; border-radius: 20px; overflow: hidden; }
#sidebar .group:last-of-type { margin-bottom: 60px; }
.group-heading>.group-title { font-weight: bold; }
.group-heading { background-color: #fff; }

.group-list>li>.name {
    background-size: 35px;
    background-position: 0px;
    background-repeat: no-repeat;
    background-image: url(https://st5.depositphotos.com/69506604/67846/v/450/depositphotos_678468430-stock-illustration-realistic-car-isolated-white-vector.jpg);
    padding-left: 40px;
}
.group-list li:hover .name { white-space: normal!important; font-weight:bold; line-height: 1; margin-bottom:5px; }
.group-list li:hover .name [data-device=time] { font-size: 0.9em; color: #03a0ef; font-weight: 700; line-height: 1; width: 100px; margin-bottom: 5px; margin-top: 4px; }
.group-list>li.active [data-device="status"] { border:1px solid #ffffff61; }
.group-list>li>:last-child { border: none; }
.group-list>li.active>:last-child { border:none!important; }
.group-list>li.active .name { font-weight:700!important; }
.group-list>li.active .name [data-device=time] { font-weight:100!important; }
.group-list>li>.details>*+* { margin-left: 0px; }
#sidebar [data-device=speed] { font-weight: bold; font-size: 1em; color: #4282bd; }

/* --- CONTROLES DEL MAPA (DESKTOP) --- */
#map-controls { z-index: 1000; top: 2px; right: 50%; transform: translateX(50%); }
#map-controls div button { float: left; }
#map-controls div { float: left; }
#map-controls label { float: left; }
#map-controls .btn { transition: 0.9s all ease; border: 2px solid #f1f1f1; border-radius: 10px; line-height: 30px; background: #fff; color: #00528e; margin: 3px; box-shadow:none; }
#map-controls .btn.active { border: 2px solid #03a0ef; background: #03a0ef; color: #fff; }
#map-controls .btn:hover { transition: 0.5s all ease; border: 2px solid #03a0ef; transform: translateY(-3px); }

/* --- BOTONES DE TIEMPO (HISTORIAL) --- */
.time_options a { border: 1px solid #024396; width: 25%; display: inline-block; padding: 10px; text-align: center; cursor: pointer; font-size: 2em; text-decoration: none; color: #024396; }
.time_options a:first-of-type { border-radius: 15px 0px 0px 15px; }
.time_options a:last-of-type { border-radius: 0px 15px 15px 0px; }
.time_options a.active { background: #024396; color: white; font-weight: bold; }

/* --- SWAL Y POPUPS --- */
#swal2-html-container { text-align: left; }
.swal2-container.swal2-center.swal2-backdrop-show { z-index: 111111; }
.swal2-container.swal2-center>.swal2-popup { grid-column: 2; grid-row: 1; -webkit-writing-mode: horizontal-tb; place-self: center center; zoom: 1.3; padding: 15px; }
.share_whatsapp { border-radius: 99px; border: none; margin-left: 10px; }
.tooltip.left { z-index: 1111111; }

/* --- PERFIL Y DISPOSITIVOS --- */
.device_logo { width: 100px; height: 100px; padding: 5px; border-radius: 99px; border: 2px solid #f1f1f1; }
.img_profile { padding: 10px; }
.img_profile img { border-radius: 99px; width: 75px; display: block; border: 3px solid #ddd; margin: auto; }
.img_profile .profile_name { display: block; text-align: center; font-size: 1.2em; font-weight: bold; }
.img_profile .profile_email { display: block; text-align: center; }

/* --- COMANDOS GPRS --- */
.user_id_2 div#widget-gprs-command table tr { display: block; }
.onset-command { filter: initial; }
.offset-command { border-radius: 8px; filter: grayscale(1) opacity(0.8); }

div#widget-gprs-command table tr { width: 33.3%; float: right; display: none; }
div#widget-gprs-command table tbody { display: flex; width: 100%; }
#widgets .widget-gprs-command .table td+td { display: block; width: 100%!important; max-width: 100%; overflow: initial!important; }

div#widget-gprs-command table tr.engineStop, div#widget-gprs-command table tr.whatsappBtn, div#widget-gprs-command table tr.engineResume { display: block!important; }
div#widget-gprs-command table tr td button { background-repeat: no-repeat; background-color: transparent; background-position: center; background-size: 45px; }
div#widget-gprs-command table tr td .send-command { width: 100%; height: 70px; border-radius: 8px; transition: 0.8s all ease; }
div#widget-gprs-command table tr td .send-command:hover { transition: 0.2s all ease; box-shadow: 0px 10px 10px #00000026; border: white; margin-top: -3px; }
div#widget-gprs-command table tr td[rel="tooltip"] { width: 80px; max-width: 80px; padding-bottom: 0px; margin-top: 39px; text-align: center; }
div#widget-gprs-command table tr button i { display: none; }

div#widget-gprs-command table tr.whatsappBtn td button { background-image: url(https://cdn-icons-png.flaticon.com/512/189/189676.png); filter: hue-rotate(278deg) brightness(1.2); }
div#widget-gprs-command table tr.engineStop td button { background-image: url(https://cdn-icons-png.flaticon.com/512/9343/9343760.png); filter: hue-rotate(266deg) contrast(2) saturate(1); border: 1px solid #b7b7b7; }
div#widget-gprs-command table tr.engineResume td button { background-image: url(https://cdn-icons-png.flaticon.com/512/9343/9343760.png); }
div#widget-gprs-command table tr.alarmArm td button { background-image: url(https://cdn-icons-png.flaticon.com/512/3602/3602121.png); }
div#widget-gprs-command table tr.alarmDisarm td button { background-image: url(https://cdn-icons-png.flaticon.com/512/3602/3602142.png); }
div#widget-gprs-command table tr.positionStop td button { background-image: url(https://cdn-icons-png.flaticon.com/512/3102/3102715.png); }
div#widget-gprs-command table tr.positionSingle td button { background-image: url(https://cdn-icons-png.flaticon.com/512/1483/1483336.png); }

/* --- ICONOS PERSONALIZADOS FLATICON (Menú / Tabs / Sensores) --- */
.icon.chat:before { content: "\ef44"; font-family: remixicon!important; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 18px; }
.icon.account:before { content: "\f264"; font-family: remixicon!important; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 18px; }
.icon.setup:before { content: "\ea42"; font-family: remixicon!important; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 18px; }
.icon.tools:before { content: "\eeb9"; font-family: remixicon!important; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 18px; }
.icon.admin:before { content: "\f0ee"; font-family: remixicon!important; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 18px; }
.icon.traffic:before { content: "\ec34"; font-family: remixicon!important; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 18px; }
.icon.show-tail:before { content: "\ebc2"; font-family: remixicon!important; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 18px; }
.icon.show-name:before { content: "\ee60"; font-family: remixicon!important; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 18px; }
.icon.poi:before { content: "\ed4a"; font-family: remixicon!important; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 18px; }
.icon.routes:before { content: "\f09b"; font-family: remixicon!important; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 18px; }
.icon.group-devices:before { content: "\effc"; font-family: remixicon!important; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 18px; }
.icon.zoomIn:before { content: "\ea11"; font-family: remixicon!important; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 18px; }
.icon.zoomOut:before { content: "\ee57"; font-family: remixicon!important; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 18px; }
.icon.devices:before { content: "\f090"; font-family: remixicon!important; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 18px; }
.icon.map-change:before { content: "\ef0a"; font-family: remixicon!important; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 18px; }
.icon.map-expand:before { content: "\ec62"; font-family: remixicon!important; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 18px; }

i.icon.textual { background-image: url(https://cdn-icons-png.flaticon.com/512/2001/2001922.png); background-size: contain; background-position: center; background-repeat: no-repeat; }
i.icon.numerical { background-image: url(https://cdn-icons-png.flaticon.com/512/2737/2737670.png); background-size: contain; background-position: center; background-repeat: no-repeat; }
i.icon.door { background-image: url(https://cdn-icons-png.flaticon.com/512/1711/1711847.png); background-size: contain; background-position: center; background-repeat: no-repeat; }
i.icon.speed { background-image: url(https://cdn-icons-png.flaticon.com/512/1345/1345693.png); background-size: contain; background-position: center; background-repeat: no-repeat; }
i.icon.acc { background-image: url(https://cdn-icons-png.flaticon.com/512/859/859881.png); background-size: contain; background-position: center; background-repeat: no-repeat; }
i.icon.odometer { background-image: url(https://cdn-icons-png.flaticon.com/512/3563/3563395.png); background-size: contain; background-position: center; background-repeat: no-repeat; }
i.icon.battery { background-image: url(https://cdn-icons-png.flaticon.com/512/3103/3103446.png); background-size: contain; background-position: center; background-repeat: no-repeat; }
i.icon.logical { background-image: url(https://cdn-icons-png.flaticon.com/512/129/129724.png); background-size: contain; background-position: center; background-repeat: no-repeat; }
i.icon.engine_hours { background-image: url(https://cdn-icons-png.flaticon.com/512/2972/2972531.png); background-size: contain; background-position: center; background-repeat: no-repeat; }
i.icon.satellites { background-image: url(https://cdn-icons-png.flaticon.com/512/869/869181.png); background-size: contain; background-position: center; background-repeat: no-repeat; }
i.icon.numerical::before, i.icon.textual::before, i.icon.door::before, i.icon.speed::before, i.icon.acc::before, i.icon.odometer::before, i.icon.battery::before, i.icon.logical::before, i.icon.engine_hours::before, i.icon.satellites::before { opacity: 0; }
i.icon.battery::after { opacity: 0; }

[title="Motor"], [title="Detenido"], [title="En Movimiento"], [title="En Reposo"] { background-image: url(https://barolit.com/wp-content/uploads/2021/06/wifi.png); background-repeat: no-repeat; border: none; background-position: center; }
[title="Motor"] { background-size: 14px; width: 20px; height: 20px; }
[title="Detenido"] { background-size: 14px; width: 20px; height: 20px; background-color: #ffd512!important; }
[title="En Movimiento"] { background-size: 15px; width: 20px; height: 20px; }
[title="En Reposo"] { background-size: 14px; width: 20px; height: 20px; background-color: #f77a22!important; }

/* --- BOTONES NAVBAR Y ACCIONES GENERALES --- */
.whatsapp_top { position: absolute; z-index: 1; font-size: 2em; top: 4px; height: 23px; line-height: 23px; width: 23px; padding: 5px; display: inline-table; background: #6fd954; border-radius: 10px; color: #fff; }
.whatsapp_top:hover { color: #fff; background: #469f30; text-decoration: none; }
ul.nav.navbar-nav.navbar-right li:hover { box-shadow: 0px 0px 20px -10px #0000003d; transition: 0.4s all ease; }
ul.nav.navbar-nav.navbar-right li a:hover { font-weight: bold; }
ul.nav.navbar-nav.navbar-right li { transition: 0.8s all ease; }
ul.nav.navbar-nav.navbar-right li a { background: transparent; }
button.navbar-toggle:hover .icon-bar { background-color: #03a0ef!important; }

#header .main-navbar .navbar-nav>li>a>.icon, .navbar-main .navbar-nav>li>a>.icon { color: #aaa; }
.dropdown-menu>li>a>.icon, .leaflet-control-layers .leaflet-control-layers-list>li>a>.icon { color: #03a0ef; }
.leaflet-control-layers label div span { color: #aaa; }
span#unread-msg-count { display: none; }
li.img_logo a { background-image: url(https://dfctrack.com/wp-content/uploads/2019/02/icon.png)!important; background-repeat: no-repeat!important; background-size: 45px!important; background-position: center 10px!important; background: #f08f48; filter: invert(1); }

/* --- SIDEBAR, TABS Y BUSCADOR --- */
#sidebar { border-radius: 20px; max-height: calc(100% - 70px); margin: 10px; top: 40px; width: 280px; }
#sidebar .sidebar-content { background: transparent; border: none; }
#sidebar #events_tab .tab-pane-body { padding-left: 10px!important; }
div#bottombar { right: -10px!important; }
.unhide { display: block!important; }
#loading { display: none; }
.nav-default>li.active:after { background: #da974a!important; filter: invert(1); content: ''; position: absolute; display: none; width: 5px; height: 100%; left: 0; bottom: 0; background: #2c82d8; box-sizing: border-box; }

#sidebar ul.nav.nav-tabs.nav-default { border-radius: 20px; background: #fff; box-shadow: 9px 11px 30px #00000017; padding: 5px; }
#sidebar div#objects_tab .form-group.search:after { line-height: 35px; font-size: 1.4em; margin-right: 0px; }
#sidebar div#objects_tab .bs-searchbox:after { line-height: 50px; font-size: 2em; margin-right: 5px; }
#sidebar .form-group.search input { margin-top: 2px; border-radius: 99px; }
#sidebar div#objects_tab .input-group-btn { display: inline-block; width: 100%; margin-top: 10px; }
#sidebar div#objects_tab .input-group-btn button { margin-left: 0; width: 50%; border: none; border-radius: 20px; }
#sidebar div#objects_tab .input-group-btn a { width: 48%; border: none; margin: 0; border-radius: 40px; margin-right: 5px; }

#sidebar .tab-content { float: right; background: #fff; border-radius: 20px; box-shadow: 9px 11px 30px #00000017; margin-top: 10px; width: 100%; }
#sidebar .nav-tabs>li.active>a { opacity: 1; background: #fff; border: 2px solid #03a0ef!important; font-weight: bold; border-radius: 15px; }
#sidebar .nav-default>li>a { margin: 5px; opacity: 0.5; border: 2px solid #f2f2f2; background: transparent; color: #aaa; font-size: 1.1em; padding: 10px 5px; background-position: center 5px!important; background-size: 29px!important; border-radius: 15px; }
#sidebar .nav-tabs>li { display: inline-block; width: 33.3%; float: left; }
.nav-tabs>li>a { margin-right: 0px; }

#header.folded .navbar { background-color: #fff; box-shadow: 0px 5px 10px #00000012; transition: 2s all ease; cursor: pointer; }
#header.folded .navbar:hover { box-shadow: 0px 10px 20px #0000005c; transition: 0.3s all ease; }
#header.folded .navbar .navbar-brand, #header.folded .navbar .navbar-nav { border: none; }
#header.folded .navbar .navbar-nav:before, #header.folded .navbar .navbar-brand:before { display:none; }

/* Botones Sidebar Colapso */
#sidebar a.btn-collapse { background: #03a0ef; font-size: 1.4em; color: #fff; height: 60px; line-height: 60px; margin-left: 10px; width: 30px; border-radius: 30px; }
#sidebar .btn-collapse:before, .btn-collapse.collapse-left:before { display:none; }
#sidebar .btn-collapse:after, .btn-collapse.collapse-left:after { display:none; }
#widgets .btn-collapse:before, .btn-collapse.collapse-top:before { display:none; }
#widgets .btn-collapse:after, .btn-collapse.collapse-top:after { display:none; }
#widgets .btn-collapse { width: 60px; background: #03a0ef; font-size: 1.4em; color: #fff; border-radius: 30px; height:30px; line-height: 30px; }

/* Iconos Tabs Base Flaticon/Remix */
.sidebar-content ul.nav.nav-tabs.nav-default a[href="#routes_tab"], .sidebar-content ul.nav.nav-tabs.nav-default a[href="#geofencing_tab"], .sidebar-content ul.nav.nav-tabs.nav-default a[href="#geofencing_create"], .sidebar-content ul.nav.nav-tabs.nav-default a[href="#geofencing_edit"] { background-image: url(https://cdn-icons-png.flaticon.com/512/716/716014.png)!important; background-repeat: no-repeat!important; background-size: 40px!important; background-position: center 15px!important; background: #f08f48; filter:invert(1); opacity:0; }
.sidebar-content ul.nav.nav-tabs.nav-default a[href="#alerts_tab"]::before { color: #03a0ef; content: "\ea1b"; font-family: remixicon!important; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 36px; display: block; font-weight: 100; line-height: 1; }
.sidebar-content ul.nav.nav-tabs.nav-default a[href="#history_tab"]::before { color: #03a0ef; content: "\ee17"; font-family: remixicon!important; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 32px; display: block; font-weight: 100; line-height: 1; }
.sidebar-content ul.nav.nav-tabs.nav-default a[href="#objects_tab"]::before { color: #03a0ef; content: "\f090"; font-family: remixicon!important; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 32px; display: block; font-weight: 100; line-height: 1; }
.sidebar-content ul.nav.nav-tabs.nav-default a[href="#events_tab"]::before { color: #03a0ef; content: "\eb21"; font-family: remixicon!important; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 32px; display: block; font-weight: 100; line-height: 1; }
.sidebar-content ul.nav.nav-tabs.nav-default a[data-modal="send_command"]::before { color: #03a0ef; content: "\f1f6"; font-family: remixicon!important; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 32px; display: block; font-weight: 100; line-height: 1; }
.sidebar-content ul.nav.nav-tabs.nav-default a[data-modal="reports_create"]::before { color: #03a0ef; content: "\ea96"; font-family: remixicon!important; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 32px; display: block; font-weight: 100; line-height: 1; }

#sidebar li.hidden{ display:block!important; }
#sidebar li.hidden a { width: 80px; color: #000; }
#sidebar li.hidden a[href="#alerts_tab"]::after { content: 'Alertas'; }
#sidebar li.hidden a::after { content: 'Testing'; }
a[href="#pois_tab"], a[href="#pois_create"], a[href="#pois_edit"], a[href="#geofencing_tab"], a[href="#geofencing_create"], a[href="#geofencing_edit"], a[href="#routes_tab"], a[href="#routes_create"], a[href="#routes_edit"] { display:none!important; }


/* --- OCULTAR ELEMENTOS CLIENTES --- */
.clientes div#device-form-sensors .actions, .clientes [href="#device-form-icons"], .clientes [data-modal="sensors_create"], .clientes [href="#device-form-expenses"], .clientes [href="#device-form-advanced"], .clientes [href="#device-form-accuracy"], .clientes [href="#device-form-tail"] { display: none; }
.clientes div#my_account_settings_edit .nav-tabs li:nth-child(1n+2) { display: none; }
.clientes div#my_account_settings_edit .tab-content .form-group { pointer-events: none; opacity: 0.7; }

/* --- ?? CORRECCIÓN 2: FORMULARIO ICONOS (OCULTAR MARCA Y MODELO Y OPTIMIZACIÓN CONTADORES) --- */
/* Ocultamos tanto el select nativo como el div de Bootstrap-Select generado visualmente */
#device-form-icons select#marca,
#device-form-icons select#marca + .bootstrap-select,
#device-form-icons select#modelo,
#device-form-icons select#modelo + .bootstrap-select,
#device-form-icons label[for="marca"],
#device-form-icons label[for="modelo"] {
    display: none !important;
}

.device-icons-icon .icon-list .checkbox-inline:hover { box-shadow: 0px 5px 10px #0000002b; border-radius: 10px; }
.device-icons-icon .icon-list .checkbox-inline:hover img { border: 1px solid #2a95bd; }
.device-icons-icon .active { display: inline-block!important; }
.device-icons-icon.device-icons-group .icon-list { height: 300px; overflow-y: scroll; }
.icon-list .checkbox-inline { width: 19%; text-align: center; margin-top: 10px; }
.icon-list .checkbox-inline img { border: 1px solid #ddd; width: 85px!important; height: 55px!important; max-width: 100%; padding: 5px; border-radius: 4px; image-rendering: pixelated; }

/* OPTIMIZACIÓN: Enumerar iconos de autos con Contadores Nativos (Reemplaza 742 lineas) */
.modal .icon-list {
    counter-reset: icon-counter;
}
.modal .icon-list .checkbox-inline::after {
    counter-increment: icon-counter;
    content: '#' counter(icon-counter);
    position: relative;
    top: -70px;
}


/* --- DASHBOARD WIDGETS --- */
.row.new-dashboard { margin: 0px; margin-top: 10px; overflow: hidden; }
.row.new-dashboard .col-xs-6.col-sm-4.col-md-2 { padding: 0px; }
.row.new-dashboard a .link { display: none; }
.row.new-dashboard a .count { font-size: 1.2em; font-weight: bold; }
.row.new-dashboard a { text-align: center; height: 48px; display: block; line-height: 1; color: white; padding: 10px 5px; border-radius: 10px; margin: 1.5px; }
.row.new-dashboard a .title { text-overflow: ellipsis; overflow: hidden; height: 15px; }
#widgets .table { font-size: 1.15em; }
#widgets .table td:last-of-type { font-weight: 600; color: #4282bd; }
#widgets .table tr>td { border: none; }
#widgets .widget-title .icon { border-radius: 100px; background: #03a0ef; width: 25px; height: 25px; display: inline-block; color: #fff; line-height: 25px; text-align: center; }
#widgets .widget>.widget-heading { background: transparent; border: none; font-weight: bold; color: #254b93; }
#widgets .widget { border: none; margin: 10px; background: #fff; border-radius: 20px; overflow: hidden; box-shadow: 0px 5px 10px #03a0ef4d; }
#widgets .widgets-content { background:transparent!important; }

/* --- ?? CORRECCIÓN 1: MENÚ DESPLEGABLE (HOVER DE COMANDOS) --- */
/* Botón Comando (Ocultar fondo original) */
.details a[data-modal="send_command"] { background: #00528e!important; filter: invert(0)!important; background-image: none!important; color: #fff; }

/* Corrección visual Hover */
.dropdown-menu > li > a[data-modal="send_command"] {
    background: transparent !important;
    color: #333 !important; 
}
.dropdown-menu > li > a:hover {
    background-color: #f5f5f5 !important;
    color: #03a0ef !important;
    transition: 0.2s all ease;
}

div#events_tab table tbody tr td { line-height: 1.1; padding: 10px 0px; }
div#events_tab table tbody tr td .col-xs-4 { font-weight: bold; color: #03a0ef; }

/* --- LOGIN LAYOUT --- */
.sign-in-layout .btn { font-size: 1.3em; font-weight: bold; border-radius: 10px; }
input#sign-in-form-email { background-image: url(https://cdn-icons-png.flaticon.com/512/2258/2258570.png); background-size: 20px; background-position: 95% center; background-repeat: no-repeat; }
input#sign-in-form-password { background-image: url(https://cdn-icons-png.flaticon.com/512/159/159604.png); background-size: 20px; background-position: 95% center; background-repeat: no-repeat; }
.sign-in-layout .form hr { margin: 5px; }
.sign-in-layout .panel-background { background: linear-gradient(180deg, rgba(255,255,255,1) 47%, rgba(255,255,255,0) 100%)!important; }
.sign-in-layout .form-control { font-size: 1.4em; height: 40px; font-weight: 600; }
.sign-in-layout img.img-responsive.center-block { width: 200px; }
.sign-in-layout .panel, body.sign-in-layout .plan { box-shadow: none!important; }
.sign-in-layout .center-vertical { height: 100%!important; }
.sign-in-layout .container { height: 100%; width: 300px; background: #fff; position: absolute; right: 0; top: 0; background-image: url(https://barolit.com/wp-content/uploads/2021/05/bg-scaled.jpg); background-size: cover; background-repeat: no-repeat; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 20px; }
.sign-in-layout .container .col-xs-12.col-sm-8.col-sm-offset-2.col-md-6.col-md-offset-3.col-lg-4.col-lg-offset-4 { margin: 0!important; width: 100%; padding: 0; background: transparent; text-align: center; }
.sign-in-layout .checkbox { display: flex; justify-content: right; width: 100%; margin-bottom: 15px; }

/* --- POPUPS Y MODALES --- */
.popup-body table { font-family: 'Open Sans', sans-serif; }
.popup-body .table tbody>tr>th{ font-weight:bold!important; color: #254b93; }
.popup-header .nav-default { background-color: transparent; }
.popup-header { background: #03a0ef; }
.leaflet-popup-content { border-radius: 20px; overflow: hidden; }
.popup-header .popup-title { background: transparent; color: #fff; font-size: 1.8em; padding: 5px 0px 5px 10px; }
.popup-header .nav-tabs>li.active>a { background: transparent!important; border: none!important; }
.popup-header .nav-default>li>a { background: transparent; border: none; }
.popup-header .nav-default>li>a i { color:#fff; }
.modal-header button.close span { font-size: 2em; position: relative; top: -5px; }
.modal-header button.close { color: #08629a; opacity: 1; font-size: 1.8em; background: #fff; width: 35px; border-radius: 50px; height: 35px; }
.modal-body .nav-default { background-color: #424242; padding: 10px; border-radius: 0px 0px 30px 30px; }
table.table.table-list tr:nth-child(2n+2) { background: #f2f2f2; }
.table.table-list>thead>tr { color: #fff; background-color: #03a0ef!important; }
.form-group label { font-weight: 600; }
.form-control { border-radius: 7px; border: 1px solid #d4d4d4; background: transparent; }
.modal-body .nav-default>li.active:after { display:none; }
.modal-body .nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover { background: transparent; color: #fff; border: 2px solid #03a0ef; }
.modal-body .nav-tabs>li { margin: 5px; }
.modal-body .nav-tabs>li>a:hover { border: 2px solid #fff; }
.modal-body .nav-tabs>li>a { border-radius: 30px; background: transparent; color: #fff; font-size: 1em; border: 2px solid #ffffff36; padding: 5px 10px; }
.modal-content { background: transparent; box-shadow: none; border: none; }
.modal-body { background: #fff; }
.modal-footer .btn { border-radius: 20px; text-align: right; }
.modal-footer { background: #fff; text-align: center!important; border-radius: 0px 0px 30px 30px; }
.modal-header h4 { font-size: 2em; font-weight: bold; }
.modal-header i:before { color: #fff; }
.modal-header { color: #fff; border-radius: 30px 30px 0px 0px; background: #424242; }

/* --- DROPDOWNS & BUSCADORES --- */
.dropdown-menu .bs-searchbox input { border-radius: 10px!important; }
#sidebar .dropdown-menu li a::after { display:none; }
.dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover, .leaflet-control-layers .leaflet-control-layers-list>li>a:focus, .leaflet-control-layers .leaflet-control-layers-list>li>a:hover { background: transparent!important; }
div#alerts_tab span.input-group-btn, div#events_tab span.input-group-btn { display: inline-block; width: 100%; margin-top: 5px; }
[data-modal="alerts_create"] { border-radius: 20px!important; width: 100%; margin: 0!important; background-color: #03a0ef; color:#fff; }
[data-modal="events_lookup"], [data-modal="events_do_destroy"] { border-radius: 40px!important; width: 48%; margin: 0!important; background-color: #03a0ef; color:#fff; }
.datepicker.datepicker-dropdown.dropdown-menu.datepicker-orient-left.datepicker-orient-bottom { background: #fff; }

div#device-add-form-advanced .dropdown-menu ul li a, div#device-add-form-main .dropdown-menu ul li a, div#history_tab .dropdown-menu ul li a, div#alerts-form-geofences .dropdown-menu ul li a, div#alerts-form-user .dropdown-menu ul li a, div#devices_groups_edit .dropdown-menu ul li a, div#devices_groups_create .dropdown-menu ul li a { color: #3e3e3e; font-weight: 600; }
div#device-add-form-advanced .dropdown-menu, div#device-add-form-main .dropdown-menu, div#history_tab .dropdown-menu, div#alerts-form-geofences .dropdown-menu, div#alerts-form-user .dropdown-menu, div#devices_groups_edit .dropdown-menu, div#devices_groups_create .dropdown-menu { background: #fff; }
div#alerts-form-geofences ul.dropdown-menu.inner, div#alerts-form-user ul.dropdown-menu.inner, div#devices_groups_edit ul.dropdown-menu.inner, div#devices_groups_create ul.dropdown-menu.inner { border-radius: 20px; border: 1px solid #e2e2e2; }

.bs-searchbox input { border: 1px solid #d2d2d2!important; border-radius: 20px; }
button.actions-btn.bs-select-all.btn.btn-default, button.actions-btn.bs-deselect-all.btn.btn-default { background: transparent; border: 1px solid #e0e0e0; border-radius: 20px!important; }
.bootstrap-select.form-control.multiexpand .bs-actionsbox, .bootstrap-select.form-control.multiexpand .bs-searchbox input { background: #fff; border: none; margin-bottom: 10px; }
.bootstrap-select.btn-group.show-tick .dropdown-menu li a span.text::after, .bootstrap-select.btn-group.show-tick .leaflet-control-layers .leaflet-control-layers-list li a span.text::after, .leaflet-control-layers .bootstrap-select.btn-group.show-tick .leaflet-control-layers-list li a span.text::after, .bootstrap-select.btn-group.show-tick .dropdown-menu li a span.text::before, .bootstrap-select.btn-group.show-tick .leaflet-control-layers .leaflet-control-layers-list li a span.text::before, .leaflet-control-layers .bootstrap-select.btn-group.show-tick .leaflet-control-layers-list li a span.text::before { border-radius: 20px; }

li.dropdown-header { background: #fff!important; }
div#device_sharing .dropdown-menu>li>a:hover, div#command-form-gprs .dropdown-menu>li>a:hover { background: transparent; }
div#device_sharing ul.dropdown-menu.inner { border-radius: 20px; border: 1px solid #e2e2e2; }
div#command-form-gprs .dropdown-menu>li>a, div#device_sharing .dropdown-menu>li>a { color: #000; font-weight: 600; }
div#command-form-gpr .dropdown-menu>li>a:hover { background: #fff; }
div#command-form-gprs .dropdown-menu, div#device_sharing .dropdown-menu { background: #fff; margin: 0; padding: 0; }
.dropdown-menu, .leaflet-control-layers .leaflet-control-layers-list { border: none; border-radius: 15px; padding-top: 5px; padding-bottom: 5px; }

.btn-group.dropleft.droparrow.open .dropdown-menu, ul.dropdown-menu.dropdown-menu-left, ul.dropdown-menu.dropdown-menu-right { border: none; border-radius: 15px; }
id#map-controls .dropdown-menu, .leaflet-control-layers .leaflet-control-layers-list { color: #fff; }
.bootstrap-select>.dropdown-toggle { border-radius: 10px; }
.btn-group.bootstrap-select.show-tick.form-control.multiexpand { background: transparent; }
.lang-list .lang-item .btn { border: none; background: transparent; }

/* --- ICONOS CIRCULARES GLOBALES --- */
[data-modal="language-selection"], [data-modal="chat"], [id="dropMyAccount"], [data-original-title="Administrador"], [data-modal="my_account_settings_edit"], [data-original-title="ADMIN"], [data-original-title="Herramientas"] { background: #03a0ef; border-radius: 100px; width: 35px; height: 35px; padding: 0!important; line-height: 35px!important; text-align: center; position: relative; top: 5px; right: -1px; margin-left: 5px; }
[data-modal="language-selection"] { margin-right: 5px; }
[data-modal="language-selection"] img { border: none!important; padding: 0!important; }

/* --- MAPA GENERAL Y MARCADORES --- */
[onclick="app.history.get()"], div#history_tab .dropdown .btn-default, [onclick="app.history.clear()"] { border-radius: 20px; }
[onclick="app.history.clear()"] { border-radius: 25px!important; }
.btn-action, .btn-primary { background-color: #03a0ef; border-color: #03a0ef; }
.checkbox label::after { border-radius: 20px!important; box-shadow: 0px 5px 8px #03a0ef4d; }
.checkbox label::before { border-radius: 20px; }
[data-device="preview"] a { background: url(https://cdn-icons-png.flaticon.com/512/2991/2991231.png); background-repeat: no-repeat; height: 30px; width: 30px; border: none; background-size: cover; }
[data-device="preview"] i { opacity: 0; }
.details .btn.icon { font-size: 1.2em; padding: 0; font-weight: bold; }
.details .btn.icon:hover { background: transparent; }

#header .main-navbar .navbar-nav>.open>a, #header .main-navbar .navbar-nav>.open>a:focus, #header .main-navbar .navbar-nav>.open>a:hover, .navbar-main .navbar-nav>.open>a, .navbar-main .navbar-nav>.open>a:focus, .navbar-main .navbar-nav>.open>a:hover { color: #03a0ef; }
#header .main-navbar .navbar-nav>li>a:focus, #header .main-navbar .navbar-nav>li>a:hover, .navbar-main .navbar-nav>li>a:focus, .navbar-main .navbar-nav>li>a:hover { color: #03a0ef; background-color: transparent; }

.leaf-device-marker .name i { background-color: var(--marker-bg, #296f2e) !important; background: var(--marker-bg, #296f2e) !important; color: #fff !important; border: none !important; padding: 2px 8px !important; border-radius: 6px !important; font-style: normal !important; font-weight: bold !important; box-shadow: 0px 2px 4px rgba(0,0,0,0.2) !important; }
.leaf-device-marker .name:after { border-top-color: var(--marker-bg, #296f2e) !important; }
.leaf-device-marker .name { background: transparent !important; border: none !important; box-shadow: none !important; padding: 0 !important; }

/* --- MOBILE RESPONSIVE (MAX-WIDTH 600PX) --- */
@media only screen and (max-width: 600px) {
    #widgets.collapsed .sidebar.btn-collapse, .sidebar.collapsed, .sidebar.collapsed .sidebar.btn-collapse { margin-left: -330px !important; }
    .navbar-collapse.in { overflow-y: visible; }
    #header .main-navbar, .navbar-main { font-size: 13px; background-color: transparent!important; border-color: #d9d9d9; }
    .navbar-header { background: #fff; }
    ul.nav.navbar-nav.navbar-right { background: #fff; margin: 10px 0px; border-radius: 20px; padding: 0px; box-shadow: 0px 20px 30px #00000061; }
    #header.folded .navbar { box-shadow:none!important; border: none; }
    ul.nav.navbar-nav.navbar-right .icon+.text { margin-left: 40px; position: relative; top: -35px; width: 120px; display: flex; }
    [data-modal="language-selection"] { padding: 0!important; width: 50px; height: 50px; position: fixed!important; top: 70px; right: 25px; background: #fff; }
    [data-modal="language-selection"] img { border: none!important; padding: 0!important; width: 30px; margin-top: 12px; }
    ul.nav.navbar-nav.navbar-right li { margin-bottom: 0px; }
    ul.dropdown-menu.dropdown-menu-right li .text { top: -15px!important; }
    ul.dropdown-menu.dropdown-menu-right li { height: 20px; }
    ul.dropdown-menu.dropdown-menu-right li a .icon { font-size: 1.5em; background: #fff; width: 20px; height: 20px; border-radius: 20px; padding: 5px; color: #03a0ef; }
    ul.nav.navbar-nav.navbar-left li { margin-bottom: 10px; }
    ul.dropdown-menu.dropdown-menu-left li .text { top: -15px!important; }
    ul.dropdown-menu.dropdown-menu-left li { height: 20px; }
    ul.dropdown-menu.dropdown-menu-left li a .icon { font-size: 1.5em; width: 20px; height: 20px; border-radius: 20px; padding: 5px; color: #000; }
    ul.dropdown-menu.dropdown-menu-left a[href="#objects_tab"] { background-image: unset!important; background: transparent; filter: unset; }
    .bootstrap-select.form-control.multiexpand .bs-actionsbox, .bootstrap-select.form-control.multiexpand .bs-searchbox { width: 100%; }
    button.navbar-toggle { border: none; background: transparent!important; border-radius: 100px; height: 30px; width: 32px; color: gray; }
    button.navbar-toggle .icon-bar { background-color: #a9a9a9!important }
    .navbar-toggle .icon-bar+.icon-bar { margin-top: 6px; }
    .navbar-toggle .icon-bar { width: 26px; }
    #widgets .btn-collapse { left: 10px; }
    #sidebar { width: 320px; }
    #sidebar ul.nav.nav-tabs.nav-default { zoom: 0.9; }

    /* --- ?? CORRECCIÓN 3: CONTROLES MAPA MÓVIL ORDENADOS --- */
    #map-controls {
        z-index: 555 !important;
        top: 70px !important; 
        right: 5px !important; 
        width: 40px !important; 
        transform: none !important;
        display: flex !important;
        flex-direction: column !important; 
        background: rgba(255, 255, 255, 0.8) !important; 
        border-radius: 10px !important;
        padding: 2px !important;
        box-shadow: 0 2px 5px rgba(0,0,0,0.2) !important;
    }
    #map-controls .btn {
        width: 32px !important;
        height: 32px !important;
        line-height: 32px !important;
        font-size: 14px !important;
        margin: 2px auto !important;
        padding: 0 !important;
        float: none !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    .leaflet-right .leaflet-control { margin-right: 5px !important; }
    .leaflet-control-zoom a { width: 32px !important; height: 32px !important; line-height: 32px !important; }
}