﻿/* Styles by RB */

.login-background {
    background-image: url(../img/background-dws.png);
    background-size: cover; 
    background-position: center; 
    background-repeat: no-repeat; 
    color: white;
}

#sidebarToggle svg {
    color: #009000 !important;
}

.sidenav-light .sidenav-menu .nav-link:hover {
    color: #007000 !important;
}


.sidenav-light .sidenav-menu .nav-link .nav-link-icon {
    color: #009000 !important;
}

    .sidenav-light .sidenav-menu .nav-link .nav-link-icon:hover {
        color: #007000 !important;
    }

.dropdown-item:hover, .dropdown-item:focus {
    color: #007000 !important;
}

.dropdown-item.active, .dropdown-item:active {
    background-color: #007000 !important;
    color: white !important;
}

.card:not([class*=bg-]) .card-header {
    color: black !important;
}

.nav-link .nav-link-icon span {
    color: black !important;
}

.nav-item a.active {
    color: #009000 !important;
}

    .nav-item a.active:hover {
        color: #007000 !important;
    }


.nav-item .nav-link {
    color: black !important;
}

    .nav-item .nav-link:hover {
        color: #007000 !important;
    }

a {
    color: black;
}

    a:hover {
        color: #007000;
    }

    a svg {
        color: #009000 !important;
        font-size: medium !important;
    }

        a svg:hover {
            color: #007000 !important;
        }

        a svg.icon-action {
            margin-left: 6px;
            margin-right: 6px;
        }

.btn .feather:hover {
    color: #007000 !important;
}

.btn .fa:hover {
    color: #007000 !important;
}

.btn .fas:hover {
    color: #007000 !important;
}

.bg-gradient-primary-to-secondary {
    background-color: #007000 !important;
    background-image: linear-gradient(135deg, lightgrey 0%, rgba(0, 135, 46, 0.7) 150%) !important;
}

/*.bg-gradient-primary-to-secondary {
    background-color: ghostwhite !important;
    background-image: linear-gradient( 135deg, lightgrey 0%, rgba(0, 0, 0, 0.1) 100%) !important;
}*/

.fixed-top, .nav-fixed #layoutSidenav #layoutSidenav_nav, .nav-fixed .topnav {
    background-color: #dbdcdd !important;
}

.sidenav-light {
    background-color: #e9ebee !important;
}


.sidenav .sidenav-menu .nav .nav-link .nav-link-icon {
    width: 20px !important;
}

.table th {
    text-align: center !important;
}

.table th, .table td {
    font-size: 10px !important;
}

.table th {
    padding: 0.4rem !important;
}

.table td {
    padding: 0.2rem !important;
}

.table-striped-head tbody tr th {
    background-color: rgba(0, 0, 0, 0.05) !important;
}

td a {
    color: #009000 !important;
}

.progress-bar-custom {
    background-color: #00ac69 !important;
}

.options-buttons {
    margin: 9px 0px 9px 0px;
    min-width: 175px;
    text-align: right;
}

.dropdown-button {
    display: none !important;
}

.grid-pagination td table tbody tr {
    background-color: transparent !important;
}

    .grid-pagination td table tbody tr td {
        width: 20px;
    }

        .grid-pagination td table tbody tr td a {
            font-size: small;
        }

.grid-table-options tbody tr {
    background-color: transparent !important;
}

.separator-10 {
    margin-top: 10px;
}

.separator-20 {
    margin-top: 20px;
}

.hidden {
    display: none;
}

.vertical-align-middle {
    vertical-align: middle !important;
}

.custom-control-input:checked ~ .custom-control-label::before {
    color: #fff;
    border-color: #009000 !important;
    background-color: #009000 !important;
}

.sweet-alert {
    border: 2px solid #007000;
}

.label-150 {
    width: 150px;
}

.cars-img {
    width: auto;
    height: auto;
    max-width: -webkit-fill-available;
    max-height: -webkit-fill-available;
    margin: auto;
    display: block;
}

.pull-right {
    float: right;
}

.custom-control {
    z-index: unset !important;
}

.custom-control-input:checked ~ .custom-control-label::before {
    color: #fff;
    border-color: #009000 !important;
    background-color: #009000 !important;
}

.custom-actions {
    align-items: center;
    justify-content: space-between;
    display: inline-flex;
    width: 100%;
    max-width: 100px;
    min-width: 80px;
}

    .custom-actions .custom-switch {
        margin-top: -12px;
    }

    .custom-actions .custom-control-input:not(:checked) ~ .custom-control-label::before {
        color: #fff;
        border-color: #e73d4a !important;
        background-color: #e73d4a !important;
    }

.content-user-disponibility {
    border: 1px solid lightgray;
    border-radius: 10px;
    padding: 5px;
}

.margin-horizontal-20 {
    margin: 0px 20px 0px 20px;
}

.img-grid-car {
    max-height: 70px;
    max-width: 110px;
    width: auto;
    height: auto;
    margin-left: 2px;
    margin-right: 2px;
}

.content-car-model-selected {
    border: 1px solid royalblue;
    padding: 10px;
    border-radius: 10px;
    background-color: lightblue;
}

.Pager span {
    text-align: center;
    color: #69707a;
    display: inline-block;
    width: 30px;
    margin-right: 1px;
    line-height: 150%;
    border: 1px solid #e0e5ec;
}

.Pager a {
    text-align: center;
    display: inline-block;
    width: 30px;
    color: #009000 !important;
    border: 1px solid #e0e5ec;
    margin-right: 1px;
    line-height: 150%;
    text-decoration: none;
}

.xdsoft_datetimepicker {
    min-width: 350px !important;
    min-height: 270px !important;
}

.aspNetDisabled {
    opacity: 0.7;
    cursor: not-allowed;
    pointer-events: none !important;
}

.not-allowed {
    cursor: not-allowed;
    pointer-events: none !important;
}

@media (min-width: 0) {
    .form-group-margin {
        margin-left: 0.25rem !important;
    }
}

@media (min-width: 768px) {
    .container-xl, .container-lg, .container-md, .container-sm, .container {
        max-width: 1440px !important;
    }
}
.input-width {
    width: 120px !important;
}
@media (max-width: 767px) {
    .container-xl, .container-lg, .container-md, .container-sm, .container {
        max-width: 1440px !important;
        padding: 0 !important;
    }
    .modal-dialog {
        width: 100%;
        min-width: 100%;
        padding-right: 15px;
        overflow-x: auto;
    }

    .card-body {
        overflow-x: auto;
    }
    .button-display{
        display:grid !important;
    }
    .input-width{
        width:65px !important;
    }
}

@media (max-width: 1200px) {
    .options-buttons {
        display: none !important;
    }

    .dropdown-button {
        display: inline-flex !important;
    }
}

/* ===== Módulos migrados de DigitalWorkShop.Leads ===== */
/* Semáforo de estado de mantenimiento (Connected Car) */
.font-danger {
    color: #b51000;
}

.font-warning {
    color: #c17f00;
}

.font-success {
    color: #009000;
}

/* Iframe del CRM externo (modulo migrado de Leads).
   El markup original usaba estas clases pero no estaban definidas en ninguno
   de los dos proyectos, asi que el iframe quedaba sin altura. */
.embed-container {
    position: relative;
    width: 100%;
    height: calc(100vh - 160px);
    overflow: hidden;
}

.responsive-iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* Select2 vs modal Bootstrap 5.
   styles.css es un tema de Bootstrap 4 (.modal 1050 / .modal-backdrop 1040),
   pero el CSS de Bootstrap 5 carga despues y gana: backdrop 1050, modal 1055.
   select2.min.css carga DESPUES de Bootstrap y trae .select2-dropdown con
   z-index 1051, justo entre el backdrop y el modal.

   El .select2-container (la caja cerrada del selector) no traia z-index, asi
   que quedaba pintandose por encima de la capa oscura del backdrop. Se le fija
   uno explicito por debajo del backdrop para que se oscurezca como el resto de
   la pagina.

   NO se toca .select2-dropdown: select2 lo cuelga de <body>, no del modal, y
   bajarlo romperia los Select2 que viven dentro de modales en otras pantallas
   (por ej. el de perfil en _ModalUser). */
.select2-container {
    z-index: 1039;
}
