/*
 * Skin corporativo de La Gestora del Alquiler.
 *
 * La paleta procede del brandbook del proyecto LaGestoraDelAlquiler:
 * Marino para la estructura, Terracota para acciones y Hueso para superficies.
 * Todos los selectores están acotados a ``skin-lagestora`` para no afectar a
 * los demás tenants.
 */

.skin-lagestora {
    --lga-marino: #1b2a4a;
    --lga-marino-profundo: #132038;
    --lga-terracota: #c96f4a;
    --lga-terracota-cta: #b45c38;
    --lga-terracota-cta-hover: #9c4e2e;
    --lga-terracota-texto: #a85333;
    --lga-hueso: #f4f1e8;
    --lga-hueso-claro: #fbf9f3;
    --lga-pizarra-clara: #b9c1d0;
    --lga-tinta: #26303f;
    --lga-borde: #d8d2c2;
}

.skin-lagestora .main-header,
.skin-lagestora .main-header .navbar,
.skin-lagestora .main-header > .logo,
.skin-lagestora .main-header > .logo:hover {
    background-color: var(--lga-marino) !important;
    color: var(--lga-hueso);
}

.skin-lagestora .main-header .navbar .nav > li > a,
.skin-lagestora .main-header .navbar .sidebar-toggle,
.skin-lagestora .main-header .navbar .navbar-toggle {
    color: var(--lga-hueso);
}

.skin-lagestora .main-header .navbar .nav > li > a:hover,
.skin-lagestora .main-header .navbar .nav > li > a:active,
.skin-lagestora .main-header .navbar .nav > li > a:focus,
.skin-lagestora .main-header .navbar .nav .open > a,
.skin-lagestora .main-header .navbar .nav .open > a:hover,
.skin-lagestora .main-header .navbar .nav .open > a:focus,
.skin-lagestora .main-header .navbar .nav > .active > a,
.skin-lagestora .main-header .navbar .sidebar-toggle:hover {
    background-color: var(--lga-marino-profundo);
    color: var(--lga-hueso);
}

.skin-lagestora .wrapper,
.skin-lagestora .main-sidebar,
.skin-lagestora .left-side {
    background-color: var(--lga-marino-profundo);
}

.skin-lagestora .sidebar-menu > li.header {
    background-color: var(--lga-marino-profundo);
    color: var(--lga-pizarra-clara);
}

.skin-lagestora .sidebar-menu > li > a {
    border-left: 3px solid transparent;
    color: var(--lga-hueso);
}

.skin-lagestora .sidebar-menu > li:hover > a,
.skin-lagestora .sidebar-menu > li.active > a {
    background-color: var(--lga-marino);
    border-left-color: var(--lga-terracota);
    color: #ffffff;
}

.skin-lagestora .sidebar-menu > li > .treeview-menu {
    background-color: var(--lga-marino);
}

.skin-lagestora .treeview-menu > li > a {
    color: var(--lga-pizarra-clara);
}

.skin-lagestora .treeview-menu > li.active > a,
.skin-lagestora .treeview-menu > li > a:hover {
    background-color: var(--lga-marino);
    color: #ffffff;
}

.skin-lagestora .content-wrapper,
.skin-lagestora .right-side {
    background-color: var(--lga-hueso);
    color: var(--lga-tinta);
}

.skin-lagestora .box,
.skin-lagestora .nav-tabs-custom,
.skin-lagestora .content .panel,
.skin-lagestora .content .card {
    background-color: var(--lga-hueso-claro);
    border-color: var(--lga-borde);
}

.skin-lagestora .box.box-primary,
.skin-lagestora .box.box-corporativo,
.skin-lagestora .nav-tabs-custom > .nav-tabs > li.active {
    border-top-color: var(--lga-terracota) !important;
}

.skin-lagestora .btn-primary,
.skin-lagestora .btn.btn-primary,
.skin-lagestora .label.label-corporativo,
.skin-lagestora .pagination > .active > a,
.skin-lagestora .pagination > .active > span {
    background-color: var(--lga-terracota-cta) !important;
    border-color: var(--lga-terracota-cta) !important;
    color: #ffffff !important;
}

.skin-lagestora .btn-primary:hover,
.skin-lagestora .btn-primary:active,
.skin-lagestora .btn-primary:focus {
    background-color: var(--lga-terracota-cta-hover) !important;
    border-color: var(--lga-terracota-cta-hover) !important;
}

.skin-lagestora .content-wrapper a:not(.btn):not(.label) {
    color: var(--lga-marino);
}

.skin-lagestora .content-wrapper a:not(.btn):not(.label):hover,
.skin-lagestora .content-wrapper a:not(.btn):not(.label):focus {
    color: var(--lga-terracota-texto);
}

.skin-lagestora .main-footer,
.skin-lagestora .main-header .navbar .nav > li.user-menu > .dropdown-menu > .user-header {
    background-color: var(--lga-hueso-claro) !important;
    border-color: var(--lga-borde);
    color: var(--lga-tinta) !important;
}

/* Login y pantallas públicas que extienden base_sr.html. */
.skin-lagestora .registration {
    background-color: var(--lga-marino) !important;
}

.skin-lagestora .registration .sidebar {
    background-color: var(--lga-hueso-claro);
    color: var(--lga-tinta);
    opacity: 1;
}

.skin-lagestora .registration .btn,
.skin-lagestora .registration .btn-large {
    background-color: var(--lga-terracota-cta) !important;
    color: #ffffff;
}

.skin-lagestora .registration .btn:hover,
.skin-lagestora .registration .btn-large:hover {
    background-color: var(--lga-terracota-cta-hover) !important;
}

.skin-lagestora .registration .input-field input:focus + label,
.skin-lagestora .registration .material-icons.active {
    color: var(--lga-terracota) !important;
}

.skin-lagestora .registration .row .input-field input:focus {
    border-bottom-color: var(--lga-terracota) !important;
    box-shadow: 0 1px 0 0 var(--lga-terracota) !important;
}

.skin-lagestora .pace .pace-progress,
.skin-lagestora .circular-menu .floating-btn,
.skin-lagestora .circular-menu::after {
    background-color: var(--lga-terracota-cta) !important;
}

@media (max-width: 767px) {
    .skin-lagestora .main-header > .logo {
        background-color: var(--lga-marino) !important;
    }
}