/* PIMA GPS: sensores, tres pestanas, etiqueta y login. */

/* Iconos de todos los tipos de sensores. */
i.icon.textual,
i.icon.numerical,
i.icon.door,
i.icon.speed,
i.icon.acc,
i.icon.odometer,
i.icon.battery,
i.icon.logical,
i.icon.engine_hours,
i.icon.satellites {
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

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

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,
i.icon.battery::after {
    opacity: 0;
}

/* Solo Objetos, Eventos e Historial en la barra lateral. */
#sidebar ul.nav.nav-tabs.nav-default > li:nth-child(n+4),
#sidebar .nav-tabs > li:has(> a[data-modal="send_command"]),
#sidebar .nav-tabs > li:has(> a[data-modal="reports_create"]) {
    display: none !important;
}

#sidebar .nav-tabs a[data-modal="send_command"],
#sidebar .nav-tabs a[data-modal="reports_create"] {
    display: none !important;
}

#sidebar ul.nav.nav-tabs.nav-default {
    display: flex !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
}

#sidebar ul.nav.nav-tabs.nav-default > li:nth-child(-n+3) {
    display: block !important;
    float: none !important;
    flex: 1 1 0 !important;
    width: 33.333333% !important;
    min-width: 0 !important;
}

#sidebar ul.nav.nav-tabs.nav-default > li:nth-child(-n+3) > a {
    display: block !important;
    white-space: nowrap !important;
    text-align: center !important;
}

/* Etiqueta del mapa: letras limpias y fondo blanco neutro. La sombra
   interior tapa incluso un color que el mapa inyecte en linea. */
.leaf-device-marker .name {
    background: transparent !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
}

.leaf-device-marker .name i {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: inset 0 0 0 100px rgba(255, 255, 255, .97) !important;
    border: 0 !important;
    border-radius: 3px !important;
    color: #183544 !important;
    display: inline-block !important;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 13px !important;
    font-style: normal !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
    line-height: 1.25 !important;
    padding: 3px 6px !important;
    text-shadow: none !important;
    -webkit-text-stroke: 0 !important;
}

.leaf-device-marker .name::before,
.leaf-device-marker .name::after {
    display: none !important;
}

/* Login mas angosto y alto, alineado a la derecha. */
body.sign-in-layout .center-vertical {
    height: 100vh !important;
}

body.sign-in-layout .center-vertical > .container {
    position: absolute !important;
    top: 50% !important;
    right: clamp(16px, 3vw, 64px) !important;
    left: auto !important;
    width: min(360px, calc(100vw - 32px)) !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: translateY(-50%) !important;
    background: transparent !important;
    z-index: 2 !important;
}

body.sign-in-layout .container .row {
    margin: 0 !important;
}

body.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 {
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.sign-in-layout .panel {
    width: 100% !important;
    min-height: 500px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

body.sign-in-layout .panel-body {
    padding: 30px 24px 34px !important;
}

body.sign-in-layout .panel-body > hr {
    margin: 20px 0 26px !important;
}

body.sign-in-layout .panel-body img.img-responsive.center-block {
    width: 280px !important;
    max-width: 100% !important;
    height: auto !important;
}

@media only screen and (max-width: 600px) {
    body.sign-in-layout .center-vertical > .container {
        right: 50% !important;
        width: calc(100vw - 32px) !important;
        transform: translate(50%, -50%) !important;
    }

    body.sign-in-layout .panel {
        min-height: 0 !important;
    }

    body.sign-in-layout .panel-body {
        padding: 24px 20px !important;
    }

    body.sign-in-layout .panel-body img.img-responsive.center-block {
        width: 250px !important;
    }
}

@media only screen and (max-height: 600px) {
    body.sign-in-layout .center-vertical > .container {
        max-height: calc(100vh - 20px) !important;
        overflow-y: auto !important;
    }

    body.sign-in-layout .panel {
        min-height: 0 !important;
    }
}

/* Cuenta: menu compacto y avatar proporcionado. */
.dropdown-menu:has(.img_profile) {
    left: auto !important;
    right: 0 !important;
    width: min(300px, calc(100vw - 24px)) !important;
    min-width: 0 !important;
    max-width: calc(100vw - 24px) !important;
    max-height: calc(100vh - 70px) !important;
    overflow-y: auto !important;
    padding: 0 0 6px !important;
    background: #fff !important;
    border: 1px solid #dce6ef !important;
    border-radius: 12px !important;
    box-shadow: 0 12px 30px rgba(18, 45, 70, .18) !important;
}

.img_profile {
    padding: 16px 14px 12px !important;
    text-align: center !important;
    background: #f5f9fd !important;
}

.img_profile img {
    display: block !important;
    width: 76px !important;
    height: 76px !important;
    max-width: 76px !important;
    max-height: 76px !important;
    margin: 0 auto !important;
    object-fit: cover !important;
    border: 2px solid #dbe8f2 !important;
    border-radius: 50% !important;
}

.img_profile .profile_name {
    display: block !important;
    margin-top: 8px !important;
    color: #20394f !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
}

.img_profile .profile_email {
    display: block !important;
    margin-top: 3px !important;
    color: #738596 !important;
    font-size: 12px !important;
    line-height: 1.3 !important;
    overflow-wrap: anywhere !important;
}

.dropdown-menu:has(.img_profile) > li > a {
    padding: 10px 16px !important;
    color: #30485d !important;
    font-size: 13px !important;
    line-height: 1.35 !important;
}

.dropdown-menu:has(.img_profile) > li > a:hover,
.dropdown-menu:has(.img_profile) > li > a:focus {
    background: #eaf4ff !important;
    color: #1769ae !important;
}

/* Grupos: tarjetas discretas para separar encabezados y vehiculos. */
#sidebar .group {
    margin: 8px 10px !important;
    overflow: hidden !important;
    background: #fff !important;
    border: 1px solid #dce6ef !important;
    border-radius: 10px !important;
    box-shadow: 0 2px 6px rgba(30, 65, 95, .06) !important;
}

#sidebar .group-heading {
    min-height: 40px !important;
    padding: 9px 10px !important;
    background: #eef6fd !important;
    border-bottom: 1px solid #dce6ef !important;
}

#sidebar .group-heading > .group-title {
    color: #1d4566 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
}

#sidebar .group-list > li {
    background: #fff !important;
    border-bottom: 1px solid #edf1f5 !important;
}

#sidebar .group-list > li:last-child {
    border-bottom: 0 !important;
}

#sidebar .group-list > li:hover {
    background: #f4f9ff !important;
}

#sidebar .group-list > li.active {
    background: #eaf4ff !important;
}

#sidebar .group-list > li > .name {
    color: #263d51 !important;
    line-height: 1.3 !important;
}

#sidebar .group-list [data-device="time"] {
    color: #8493a0 !important;
    font-size: 11px !important;
}

@media only screen and (max-width: 600px) {
    .dropdown-menu:has(.img_profile) {
        right: 8px !important;
        width: min(300px, calc(100vw - 16px)) !important;
    }

    #sidebar .group {
        margin-right: 8px !important;
        margin-left: 8px !important;
    }
}