﻿/* COLORES AIRLAN */
/*#E52613*/

:root {
    --primaryGreen: #61a93e;
    --secondaryGreen: #a0cb8b;
    --primaryRed: #e81c14;
}

@media (min-width: 992px) {
    .horizontal .header.fixed-header.hor-header {
        position: fixed !important;
    }
}

.login-background {
    background-color: #FFF;
    background-image: url("../assets/images/brand/login.png") !important;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 80%;
    width: 100%;
    z-index: -100;
    position: absolute;
    margin-top: 5%;
    margin-bottom: 5%;
}

a {
    color: var(--primaryGreen);
}

    a:hover {
        color: var(--primaryRed);
    }

.dropdown-item:hover, .dropdown-item:focus, .dropdown-item.active, .dropdown-item:active {
    color: var(--primaryGreen);
}

.footer a:not(.btn) {
    color: var(--primaryGreen);
}

.side-menu__item.active {
    background: -webkit-gradient(linear, left top, right bottom, from(var(--secondaryGreen)), to(var(--primaryGreen))) !important;
    background: linear-gradient(to bottom right, var(--secondaryGreen) 0%, var(--primaryGreen) 100%) !important;
    -webkit-box-shadow: 0 7px 12px 0 rgb(229 38 19 / 21%);
    box-shadow: 0 7px 12px 0 rgb(229 38 19 / 21%);
}

.slide-item.active, .slide-item:hover, .slide-item:focus {
    color: var(--primaryGreen) !important;
}

.side-menu__item:hover, .side-menu__item:focus {
    color: var(--primaryGreen) !important;
}

    .side-menu__item:hover .side-menu__icon, .side-menu__item:hover .side-menu__label, .side-menu__item:focus .side-menu__icon, .side-menu__item:focus .side-menu__label {
        color: var(--primaryGreen) !important;
    }

.side-menu__item.active .side-menu__label {
    color: #ffffff !important;
}

.side-menu__item.active:hover, .side-menu__item.active:focus {
    color: #ffffff !important;
    background: -webkit-gradient(linear, left top, right bottom, from(var(--secondaryGreen)), to(var(--primaryGreen))) !important;
    background: linear-gradient(to bottom right, var(--secondaryGreen) 0%, var(--primaryGreen) 100%) !important;
    -webkit-box-shadow: 0 7px 12px 0 rgb(229 38 19 / 21%);
    box-shadow: 0 7px 12px 0 rgb(229 38 19 / 21%);
}

.page-link:hover {
    color: var(--primaryGreen) !important;
}

.page-item.active .page-link {
    background-color: var(--primaryGreen);
    border-color: var(--primaryGreen);
    color: #fff !important;
}

#back-to-top {
    background-image: linear-gradient(to bottom right, var(--secondaryGreen) 0%, var(--primaryGreen) 100%);
    bottom: 80px;
}

.back-to-top {
    bottom: 20px !important;
}

#back-to-top:hover {
    color: var(--primaryGreen) !important;
    border: 2px solid var(--primaryGreen);
}

.ui-autocomplete.ui-widget {
    font-family: Roboto,sans-serif;
    font-size: 14px;
}

[data-bs-toggle="card-collapse"] {
    cursor: pointer;
}


.table-sm td {
    font-size: 14px;
}

.table td {
    vertical-align: middle;
    text-align: center;
}

.table th {
    text-align: center;
}

.sw-theme-dots > ul.step-anchor > li.active > a {
    color: var(--primaryGreen);
}

    .sw-theme-dots > ul.step-anchor > li.active > a:after {
        background: var(--primaryGreen);
    }

.sw-theme-dots .nav-tabs .nav-link:hover:not(.disabled) {
    color: var(--primaryGreen);
}

[data-bs-toggle="card-collapse"] {
    cursor: pointer;
}

.swal2-styled.swal2-confirm {
    background-color: var(--primaryGreen) !important;
}

.btn.btn-primary.status {
    width: 100%;
}

.linktablas {
    text-decoration: underline;
}

.calendar .months-container .month-container {
    height: auto !important;
}


.calendar table td, .calendar table th {
    width: 30.5px !important;
}

.calendar .months-container .month-container {
    margin-bottom: 15px !important;
}

.calendar .calendar-header .year-title:not(.year-neighbor):not(.year-neighbor2) {
    border-bottom: 6px solid var(--primary-bg-color) !important;
}

.calendar table.month th.month-title {
    background-color: #61a93e !important;
    color: #ffffff !important;
    border-top-left-radius: 10px !important;
    border-top-right-radius: 10px !important;
}

.calendar table.month {
    border-radius: 10px !important;
}

    .calendar table.month td.day .day-content {
        border-radius: 20px !important;
    }

table.month td.day .day-content:hover {
    background: #a0cb8b !important;
}

.ribbon-custom {
    margin-right: 60px !important;
}

.table > thead {
    background-color: #efefef !important;
}

.dark-mode .table > thead {
    background-color: #50506d !important;
}

.dark-mode .calendar .calendar-header {
    background-color: #50506d !important;
}

.dark-mode .calendar table.month th.month-title {
    background-color: #30304d !important;
    color: #dedcf8 !important;
}

.dark-mode .calendar table.month {
    background-color: #50506d !important;
}

    .dark-mode .calendar table.month td.day .day-content {
        color: #bbb !important;
    }


    .dark-mode .calendar table.month th.day-header {
        color: #dedcf8 !important;
    }


.dark-mode .form-select {
    background-color: #2e2e4a !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e")
}

/*.downloadOrder {
    color: #eaedf1;
}*/
.dark-mode .card .card {
    box-shadow: 0px 0px 0px #22223d;
}

.responsive-logo .header-logo {
    position: unset;
}

/* SWITCH */
.form-switch .form-check-input {
    width: 2em !important;
    background-color: #FFFFFF !important;
}

.form-check-input:checked {
    background-color: #61a93e !important;
    border-color: #61a93e !important;
}

.form-switch .form-check-input:focus {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%280, 0, 0, 0.25%29'/%3e%3c/svg%3e") !important;
}

.form-check-input:focus {
    border: 1px solid rgba(0,0,0,.25);
    box-shadow: none !important;
}

.form-switch .form-check-input:checked {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e") !important;
}

/* SWITCH DARKMODE */
.dark-mode .form-check-input {
    background-repeat: no-repeat !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%280, 0, 0, 0.25%29'/%3e%3c/svg%3e") !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
}
/* END SWITCH */

/* DATEPICKER */
.datepicker table tr td.old, .datepicker table tr td.new {
    opacity: 1;
    color: #7f88a5;
}

.datepicker table tr td.active {
    color: #ffffff !important;
}

/* ICONO CENTRO DE AYUDA */
#help-center {
    color: #fff;
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 99;
    display: block;
    text-align: center;
    z-index: 10000;
    height: 50px;
    width: 50px;
    background-repeat: no-repeat;
    background-position: center;
    transition: background-color 0.1s linear;
    -moz-transition: background-color 0.1s linear;
    -webkit-transition: background-color 0.1s linear;
    -o-transition: background-color 0.1s linear;
    border-radius: 5px;
    background-image: linear-gradient(to bottom right, var(--secondaryGreen) 0%, var(--primaryGreen) 100%);
    cursor: pointer;
}

    #help-center i {
        padding-top: 17px;
        font-size: 16px;
        font-weight: 600;
    }

    #help-center:hover {
        color: var(--primaryGreen) !important;
        border: 2px solid var(--primaryGreen);
        background: #fff !important;
    }

.nav-bar-custom {
    width: 95%;
}

@media (min-width: 992px) {
    .nav-bar-custom {
        width: 90%;
    }
}

@media (min-width: 1200px) {
    .nav-bar-custom {
        width: 85%;
    }
}

@media (max-width: 500px) {
    .dropdown-submenu.mobile {
        display: block !important;
        top: 96% !important;
        left: 0% !important;
    }
}

@media (min-width: 993px) {
    .dropdown-parent:hover > .dropdown-submenu {
        display: block !important;
        /*top: 63% !important;
		left: -100% !important;*/
        position: sticky;
        box-shadow: none !important;
    }
}

.modal-md {
    width: 600px;
    height: 150px;
    position: absolute;
    z-index: 9999;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.dark-background {
    background-color: rgba(0,0,0,0.5);
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 9998;
    top: 0%;
    left: 0%;
}

.dropdown-submenu > li > .dropdown-item:hover {
    background-color: var(--bs-gray-200) !important;
}

.dropdown-submenu > li > .dropdown-item {
    background-color: var(--bs-gray-100) !important;
}

@media (min-width: 991px) {
    .sub-slide:hover .sub-slide-menu {
        display: block !important;
    }
}

.sub-slide-menu {
    width: 190px !important;
    position: absolute !important;
    background-color: #fff !important;
    z-index: 9999 !important;
    border-radius: 5px !important;
    padding-left: 0px !important;
    padding-right: 0px !important;
    padding-top: 5px !important;
    padding-bottom: 5px !important;
    min-width: fit-content !important;
    box-shadow: none !important;
    border: none !important;
    top: auto !important;
    right: 255px !important;
    left: auto !important;
}

.sub-slide {
    height: 53.8px !important;
    justify-content: center !important;
    display: flex !important;
}

body.dark-mode .sub-slide-menu {
    background-color: #30304d !important;
}

body.light-mode .mobile-submenu .dropdown-item {
    background-color: #f7f7f7 !important;
}

body.dark-mode .mobile-submenu .dropdown-item {
    background-color: #22223d !important;
}

body.dark-mode .mobile-submenu li {
    border-bottom: 1px solid var(--bs-dark);
}

body.light-mode .mobile-submenu li {
    border-bottom: 1px solid var(--bs-light);
}
