/* @font-face { font-family: 'Montserrat'; src: url('../fonts/Montserrat/Montserrat-Thin.ttf'); font-weight: 100; font-display: swap; }
@font-face { font-family: 'Montserrat'; src: url('../fonts/Montserrat/Montserrat-ThinItalic.ttf'); font-weight: 100; font-display: swap; font-style: italic; }
@font-face { font-family: 'Montserrat'; src: url('../fonts/Montserrat/Montserrat-ExtraLight.ttf'); font-weight: 200; font-display: swap; }
@font-face { font-family: 'Montserrat'; src: url('../fonts/Montserrat/Montserrat-ExtraLightItalic.ttf'); font-weight: 200; font-display: swap; font-style: italic; }
@font-face { font-family: 'Montserrat'; src: url('../fonts/Montserrat/Montserrat-Light.ttf'); font-weight: 300; font-display: swap; }
@font-face { font-family: 'Montserrat'; src: url('../fonts/Montserrat/Montserrat-LightItalic.ttf'); font-weight: 300; font-display: swap; font-style: italic; }
@font-face { font-family: 'Montserrat'; src: url('../fonts/Montserrat/Montserrat-Regular.ttf'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Montserrat'; src: url('../fonts/Montserrat/Montserrat-Italic.ttf'); font-weight: 400; font-display: swap; font-style: italic; }
@font-face { font-family: 'Montserrat'; src: url('../fonts/Montserrat/Montserrat-Medium.ttf'); font-weight: 500; font-display: swap; }
@font-face { font-family: 'Montserrat'; src: url('../fonts/Montserrat/Montserrat-MediumItalic.ttf'); font-weight: 500; font-display: swap; font-style: italic; }
@font-face { font-family: 'Montserrat'; src: url('../fonts/Montserrat/Montserrat-SemiBold.ttf'); font-weight: 600; font-display: swap; }
@font-face { font-family: 'Montserrat'; src: url('../fonts/Montserrat/Montserrat-SemiBoldItalic.ttf'); font-weight: 600; font-display: swap; font-style: italic; }
@font-face { font-family: 'Montserrat'; src: url('../fonts/Montserrat/Montserrat-Bold.ttf'); font-weight: 700; font-display: swap; }
@font-face { font-family: 'Montserrat'; src: url('../fonts/Montserrat/Montserrat-BoldItalic.ttf'); font-weight: 700; font-display: swap; font-style: italic; }
@font-face { font-family: 'Montserrat'; src: url('../fonts/Montserrat/Montserrat-ExtraBold.ttf'); font-weight: 800; font-display: swap; }
@font-face { font-family: 'Montserrat'; src: url('../fonts/Montserrat/Montserrat-ExtraBoldItalic.ttf'); font-weight: 800; font-display: swap; font-style: italic; }
@font-face { font-family: 'Montserrat'; src: url('../fonts/Montserrat/Montserrat-Black.ttf'); font-weight: 900; font-display: swap; }
@font-face { font-family: 'Montserrat'; src: url('../fonts/Montserrat/Montserrat-BlackItalic.ttf'); font-weight: 900; font-display: swap; font-style: italic; }

@font-face { font-family: 'Roboto'; src: url('../fonts/Roboto/Roboto-Thin.ttf'); font-weight: 100; font-display: swap; }
@font-face { font-family: 'Roboto'; src: url('../fonts/Roboto/Roboto-ThinItalic.ttf'); font-weight: 100; font-display: swap; font-style: italic; }
@font-face { font-family: 'Roboto'; src: url('../fonts/Roboto/Roboto-Light.ttf'); font-weight: 300; font-display: swap; }
@font-face { font-family: 'Roboto'; src: url('../fonts/Roboto/Roboto-LightItalic.ttf'); font-weight: 300; font-display: swap; font-style: italic; }
@font-face { font-family: 'Roboto'; src: url('../fonts/Roboto/Roboto-Regular.ttf'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Roboto'; src: url('../fonts/Roboto/Roboto-Italic.ttf'); font-weight: 400; font-display: swap; font-style: italic; }
@font-face { font-family: 'Roboto'; src: url('../fonts/Roboto/Roboto-Medium.ttf'); font-weight: 500; font-display: swap; }
@font-face { font-family: 'Roboto'; src: url('../fonts/Roboto/Roboto-MediumItalic.ttf'); font-weight: 500; font-display: swap; font-style: italic; }
@font-face { font-family: 'Roboto'; src: url('../fonts/Roboto/Roboto-Bold.ttf'); font-weight: 700; font-display: swap; }
@font-face { font-family: 'Roboto'; src: url('../fonts/Roboto/Roboto-BoldItalic.ttf'); font-weight: 700; font-display: swap; font-style: italic; }
@font-face { font-family: 'Roboto'; src: url('../fonts/Roboto/Roboto-Black.ttf'); font-weight: 900; font-display: swap; }
@font-face { font-family: 'Roboto'; src: url('../fonts/Roboto/Roboto-BlackItalic.ttf'); font-weight: 900; font-display: swap; font-style: italic; } */

:root {
    --color-kapta-verde: #00A1A8;
    --color-kapta-verde--rgb: 0, 161, 168;
    --color-kapta-verde--shade-10: #009197;
    --color-kapta-verde--shade-10--rgb: 0, 145, 151;
    --color-kapta-verde--shade-15: #00898f;
    --color-kapta-verde--shade-15--rgb: 0, 137, 143;
    --color-kapta-verde--shade-20: #008186;
    --color-kapta-verde--shade-20--rgb: 0, 129, 134;
    --color-kapta-verde--shade-25: #00797e;
    --color-kapta-verde--shade-25--rgb: 0, 121, 126;
    --color-kapta-verde--tint-10: #1aaab1;
    --color-kapta-verde--tint-10--rgb: 26, 170, 177;
    --color-kapta-verde--tint-15: #26afb5;
    --color-kapta-verde--tint-15--rgb: 38, 175, 181;
    --color-kapta-verde--tint-20: #33b4b9;
    --color-kapta-verde--tint-20--rgb: 51, 180, 185;
    --color-kapta-verde--tint-80: #cce4e5;
    --color-kapta-verde--tint-80--rgb: 204, 228, 229;
    --color-kapta-verde--tint-90: #e6f2f2;
    --color-kapta-verde--tint-90--rgb: 230, 242, 242;

    --color-kapta-gris: #5E5E5E;
    --color-kapta-gris--rgb: 94, 94, 94;
    --color-kapta-gris--shade-10: #555555;
    --color-kapta-gris--shade-10--rgb: 85, 85, 85;
    --color-kapta-gris--shade-15: #505050;
    --color-kapta-gris--shade-15--rgb: 80, 80, 80;
    --color-kapta-gris--shade-20: #4b4b4b;
    --color-kapta-gris--shade-20--rgb: 75, 75, 75;
    --color-kapta-gris--shade-25: #474747;
    --color-kapta-gris--shade-25--rgb: 71, 71, 71;
    --color-kapta-gris--tint-10: #6e6e6e;
    --color-kapta-gris--tint-10--rgb: 110, 110, 110;
    --color-kapta-gris--tint-15: #767676;
    --color-kapta-gris--tint-15--rgb: 118, 118, 118;
    --color-kapta-gris--tint-20: #7e7e7e;
    --color-kapta-gris--tint-20--rgb: 126, 126, 126;

    /* DataTables */
    --dt-row-selected: var(--color-kapta-verde--tint-80--rgb);
    --dt-row-selected-text: var(--dt-row-selected-text);
    --dt-row-selected-link: var(--dt-row-selected-text);
}
html {
    font-size: 14px;
}

/* Estructura */
.body-app {
    background-image: url(../images/generales/background.png);
    position: relative;
}
.body-app:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: white;
    z-index: -1;
    opacity: .85;
}
.contenedor-app {
    display: grid;
    grid-template-areas: 'header header' 'menu-auxiliar vista';
    grid-template-rows: min-content 1fr;
    grid-template-columns: min-content 1fr;
    height: 100vh;
    overflow: hidden;
}
.contenedor-app > .header {
    grid-area: header;
}
.contenedor-app > .menu-auxiliar {
    grid-area: menu-auxiliar;
    overflow-y: auto;
}
.contenedor-app > .vista {
    grid-area: vista;
    overflow-y: auto;
}

/* Menú Navegación */
.menuHeader {
    --bs-navbar-color: white;
    --bs-navbar-active-color: white;

    --bs-nav-link-active-bg: rgba(var(--color-kapta-verde--rgb), 0.2);
    --bs-nav-link-active-font-weight: bold;
    --bs-nav-link-hover-color: white;
    --bs-nav-link-hover-bg: rgba(var(--color-kapta-verde--rgb), 0.4);

    --bs-dropdown-bg-opacity: 1;
}
.menuHeader.menuLateral {
    --bs-dropdown-bg-opacity: .4;
}
.menuHeader .dropdown-menu {
    --bs-dropdown-bg: rgba(0 0 0 / var(--bs-dropdown-bg-opacity));
    --bs-dropdown-link-color: var(--bs-navbar-color);
    --bs-dropdown-link-active-color: var(--bs-navbar-active-color);
    --bs-dropdown-link-active-bg: var(--bs-nav-link-active-bg);
    --bs-dropdown-link-hover-color: var(--bs-nav-link-hover-color);
    --bs-dropdown-link-hover-bg: var(--bs-nav-link-hover-bg);
}
.menuHeader .nav-item:not(.dropdown) .nav-link.active,
.menuHeader .nav-item.dropdown .nav-link.active .dropdown-toggle,
.menuHeader .nav-item.dropdown .dropdown-item.active {
    background-color: var(--bs-nav-link-active-bg);
    font-weight: var(--bs-nav-link-active-font-weight);
}
.menuHeader .nav-item:not(.dropdown) .nav-link:hover,
.menuHeader .nav-item.dropdown .nav-link:hover .dropdown-toggle,
.menuHeader .nav-item.dropdown .dropdown-item:hover {
    background-color: var(--bs-nav-link-hover-bg);
}
.menuHeader .nav-item.dropdown .dropdown-toggle {
    width: 100%;
    text-align: left;
}
.menuHeader .dropdown-item:focus,
.menuHeader .dropdown-item:hover {
    color: var(--bs-dropdown-link-hover-color) !important;
    background-color: var(--bs-dropdown-link-hover-bg) !important;
}
.menuHeader .nav-item .dropdown-toggle:active,
.menuHeader .nav-item .dropdown-toggle.show {
    border: none;
}

/* Bloques módulos */
.bloqueFiltros select > option,
.bloqueFiltros select > optgroup,
.bloqueFiltros select > optgroup > option {
    color: var(--bs-body-color);
}
.bloqueFiltros select:invalid,
.bloqueFiltros select:required > option[value=''],
.bloqueFiltros select:required > optgroup > option[value=''] {
    color: var(--bs-gray-500);
}



.select2-search.select2-search--dropdown {
    padding: .25rem!important;
}
select + .select2-container {
    width: 100% !important;
}
.select2-container.select2-container--select2-limpio .select2-selection {
    height: unset;
}
.select2-container.select2-container--select2-limpio .select2-selection__rendered {
    padding: 0;
}
.select2-container.select2-container--select2-limpio .select2-dropdown .select2-results__options:not(.select2-results__options--nested) {
    max-height: 15rem;
    overflow-y: auto;
}

.form-control-sm ~ .select2-container.select2-container--bootstrap-5 .select2-selection--single,
.form-control-sm ~ .select2-container.select2-container--bootstrap-5 .select2-selection--multiple {
    height: calc(1.5em + 0.5rem + 2px) !important;
    font-size: .875rem;
}
.form-control:not(.form-control-sm) ~ .select2-container.select2-container--bootstrap-5 .select2-selection--single .select2-selection__rendered {
    padding-top: 1px;
}
.form-control ~ .select2-container.select2-container--bootstrap-5:not(.select2) {
    font-size: .875rem;
}
/* .select2-container.select2-container--bootstrap-5 .select2-selection {
    border: none;
} */
.form-control-sm ~ .select2-container.select2-container--bootstrap-5 .select2-dropdown {
    font-size: .875rem;
}
.select2-container.select2-container--bootstrap-5 .select2-search--dropdown .select2-search__field {
    padding: 0.1875rem 0.375rem;
}
.select2-container.select2-container--bootstrap-5 .select2-results__option {
    word-wrap: break-word;
    padding: 0.1875rem 0.375rem;
}
.select2-container.select2-container--bootstrap-5 .select2-results__option[role="group"] {
    padding: 0!important;
}
.select2-container.select2-container--bootstrap-5 .select2-results__option[role="group"] {
}
.select2-container.select2-container--bootstrap-5 .select2-results__group {
    display: inline-block;
    padding: 0.09375rem 0.375rem !important;
    font-size: .85em;
    background-color: #eff6f7;
    font-weight: bold !important;
    width: 100%;
}



.nav-kapta-gris .nav-link {
    --bs-nav-link-color: var(--color-kapta-gris);
}
.nav-kapta-gris .nav-link.active {
    --bs-nav-pills-link-active-bg: var(--color-kapta-gris);
}
.nav-kapta-gris .nav-link:focus,
.nav-kapta-gris .nav-link:hover {
    --bs-nav-link-hover-color: var(--color-kapta-gris);
}

/* DataTables */
table.dataTable > tbody > tr.selected a {
    color: rgb(var(--dt-row-selected-link))!important;
}

/* Bootstrap 5 - Kapta Leads */
.bg-kapta-gris {
    background-color: var(--color-kapta-gris);
}
.bg-kapta-verde {
    background-color: var(--color-kapta-verde);
}

.btn-kapta-verde {
    --bs-btn-color: white;
    --bs-btn-bg: var(--color-kapta-verde);
    --bs-btn-border-color: var(--color-kapta-verde);
    --bs-btn-hover-color: white;
    --bs-btn-hover-bg: var(--color-kapta-verde--shade-15);
    --bs-btn-hover-border-color: var(--color-kapta-verde--shade-20);
    --bs-btn-focus-shadow-rgb: var(--color-kapta-verde--tint-15--rgb);
    --bs-btn-active-color: white;
    --bs-btn-active-bg: var(--color-kapta-verde--shade-20);
    --bs-btn-active-border-color: var(--color-kapta-verde--shade-25);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: white;
    --bs-btn-disabled-bg: var(--color-kapta-verde);
    --bs-btn-disabled-border-color: var(--color-kapta-verde);
}
.btn-outline-kapta-verde {
    --bs-btn-color: var(--color-kapta-verde);
    --bs-btn-border-color: var(--color-kapta-verde);
    --bs-btn-hover-color: white;
    --bs-btn-hover-bg: var(--color-kapta-verde);
    --bs-btn-hover-border-color: var(--color-kapta-verde);
    --bs-btn-focus-shadow-rgb: var(--color-kapta-verde--rgb);
    --bs-btn-active-color: white;
    --bs-btn-active-bg: var(--color-kapta-verde);
    --bs-btn-active-border-color: var(--color-kapta-verde);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--color-kapta-verde);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--color-kapta-verde);
    --bs-gradient: none;
}

.btn-kapta-gris {
    --bs-btn-color: white;
    --bs-btn-bg: var(--color-kapta-gris);
    --bs-btn-border-color: var(--color-kapta-gris);
    --bs-btn-hover-color: white;
    --bs-btn-hover-bg: var(--color-kapta-gris--shade-15);
    --bs-btn-hover-border-color: var(--color-kapta-gris--shade-20);
    --bs-btn-focus-shadow-rgb: var(--color-kapta-gris--tint-15--rgb);
    --bs-btn-active-color: white;
    --bs-btn-active-bg: var(--color-kapta-gris--shade-20);
    --bs-btn-active-border-color: var(--color-kapta-gris--shade-25);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: white;
    --bs-btn-disabled-bg: var(--color-kapta-gris);
    --bs-btn-disabled-border-color: var(--color-kapta-gris);
}
.btn-outline-kapta-gris {
    --bs-btn-color: var(--color-kapta-gris);
    --bs-btn-border-color: var(--color-kapta-gris);
    --bs-btn-hover-color: white;
    --bs-btn-hover-bg: var(--color-kapta-gris);
    --bs-btn-hover-border-color: var(--color-kapta-gris);
    --bs-btn-focus-shadow-rgb: var(--color-kapta-gris--rgb);
    --bs-btn-active-color: white;
    --bs-btn-active-bg: var(--color-kapta-gris);
    --bs-btn-active-border-color: var(--color-kapta-gris);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--color-kapta-gris);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--color-kapta-gris);
    --bs-gradient: none;
}
