:root {
    --prim-color: #1C5577;
    --sec-color: #083850;
    --ter-color: #2877AA;
    --quat-color: #D1E1FF;
    --dark-color: #1D2127;
    --text-color: #696969;
    --disabled-color: #818181;
    --progress-bar-color: #629bf8;
    --scroll-thumb-color: #CCC;
    --header-font: 'Barlow', 'sans-serif';
    --bs-font-sans-serif: 'Figtree', 'Public Sans', -apple-system, 'Segoe UI', 'Oxygen';
    --bs-menu-width: 14.5rem;
    --bs-menu-bg: #0C2432;
    --bs-breadcrumb-divider: '>';
    --modal-backdrop-light: rgba(0, 0, 0, 0.07);
    --modal-backdrop-dark: rgba(255, 255, 255, 0.07);
}

[data-bs-theme="dark"] {
    --dark-color: #dDd1d7;
    --text-color: #696969;
    --progress-bar-color: #42a2d5;
    --scroll-thumb-color: #202230;
    --bs-body-bg: #202230;
    --bs-paper-bg: #0b171d;
    --bs-menu-bg: #0b171d;
    --bs-dark: #181824;
    --bs-light: #35353a;
    --bs-border-color: #181824;
    --bs-modal-bg: #212129;
    --modal-backdrop: var(--modal-backdrop-dark);
}

[data-bs-theme="light"] {
    --modal-backdrop: var(--modal-backdrop-light);
}


.row {
    --bs-gutter-x: 1rem;
    --bs-gutter-y: 0.75rem;
}


h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1 {
    font-family: var(--header-font) "Calibri", "Segoe UI", "Arial", sans-serif;
    margin-top: 0;
    margin-bottom: 0.4rem;
    font-weight: 500;
    line-height: 1.3;
    color: var(--dark-color);
}

.content-wrapper {
    transition: opacity 0.3s ease-in-out;
    margin-top: 20px;
}

.navigating .content-wrapper {
    opacity: 0;
}

@media (min-width: 992px) {
    .container, .container-fluid {
        padding-inline: 1.1rem;
    }
}


.h1, h1 {
    font-size: 24px;
}

.h2, h2 {
    font-size: 22px;
}

.h3, h3 {
    font-size: 20px;
}

.h4, h4 {
    font-size: 18px;
}

.h5, h5 {
    font-size: 16px;
}

.h6, h6 {
    font-size: 14px;
}

.text-1 {
    font-size: 0.85em !important;
}

.text-2 {
    font-size: 0.95em !important;
}

.text-3 {
    font-size: 1em !important;
}

.text-4 {
    font-size: 1.15em !important;
}

.text-5 {
    font-size: 1.3em !important;
}

.text-6 {
    font-size: 1.6em !important;
}

.text-7 {
    font-size: 1.8em !important;
}

.text-8 {
    font-size: 2em !important;
}

.text-9 {
    font-size: 2.25em !important;
}

.text-10 {
    font-size: 2.5em !important;
}


p, li {
    color: var(--text-color);
    font-weight: 400;
    margin: 0;
}

small, .small {
    font-size: .9em;
}

b {
    font-weight: 600;
}

.text-compact {
    line-height: 14px;
}

.ti {
    font-size: var(--bs-icon-size);
}

.text-color-white, .text-color-white {
    color: white !important;
}

.text-color-primary {
    color: var(--prim-color);
}

.text-color-secondary {
    color: var(--sec-color);
}

.text-color-tertiary {
    color: var(--ter-color);
}

.text-color-quaternary {
    color: var(--quat-color);
}

.text-color-success {
    color: #28c76f;
}

.text-color-info {
    color: #00cfe8;
}

.text-color-warning {
    color: #ff9f43;
}

.text-color-danger {
    color: #ea5455;
}

.text-muted {
    color: #aaa;
}

.text-muted.small, .text-muted.text-1 {
    color: #bbb;
}


p {
    margin-top: 0;
    margin-bottom: 0.2rem;
}

.required::after {
    content: " *"; /* Agrega un asterisco y un espacio despues del contenido de la etiqueta */
    color: #cc3333;
}

.btn:not([class*=btn-label-]):not([class*=btn-outline-]) {
    box-shadow: .1rem .1rem .1rem rgba(50, 75, 150, .3)
}

.layout-menu {
    border-right: 2px solid var(--bs-border-color);
}


.menu-vertical .menu-sub .menu-link {
    padding-top: .25rem;
    padding-bottom: .25rem;
}

.menu-vertical .menu-item .menu-link {
    font-size: 1rem;
}

.menu-vertical .menu-sub .menu-item .menu-link {
    font-size: 0.875rem;
}

.menu .menu-sub > .menu-item > .menu-link::before {
    mask-size: 75% 75%;
}

.menu .menu-sub > .menu-item > .menu-link::before {
    content: unset;
}

.menu-vertical .menu-sub .menu-item {
    margin-block: 0;
    font-weight: 300;
    opacity: 90%;
}


@media print {
    .no-print {
        display: none;
    }
}

.layout-navbar.navbar-detached {
    margin: .85rem 1rem 5px 1rem;
    border-radius: 0.375rem;
    padding: 0 1rem;
}

.layout-navbar-fixed .layout-navbar.navbar-detached {
    width: calc(100% - calc(.8rem * 2) - 15rem);
}

@media (max-width: 992px) {
    .layout-navbar-fixed .layout-navbar.navbar-detached {
        width: 100% !important;
        margin: 0;
        padding: 0 10px;
    }
}

.layout-navbar-fixed.layout-menu-collapsed .layout-navbar.navbar-detached {
    inline-size: calc(100% - 1rem * 2 - var(--bs-menu-collapsed-width));
}

.layout-navbar .navbar-dropdown .dropdown-menu {
    min-inline-size: 25rem;
    border: 1px solid var(--bs-body-bg);
}

.layout-navbar-fixed .layout-wrapper:not(.layout-horizontal) .layout-page::before {
    backdrop-filter: saturate(120%) blur(5px);
    background: none;
    block-size: 4.75rem;
    content: "";
    inline-size: 100%;
    inset-block-start: 0;
    mask: linear-gradient(var(--bs-body-bg), var(--bs-body-bg) 18%, transparent 100%);
}

@media (min-width: 1200px) {
    .layout-menu-fixed.layout-navbar-fixed:not(.layout-menu-collapsed) .modal-open .layout-content-navbar:not(.layout-without-menu) .layout-navbar,
    .layout-menu-fixed.layout-navbar-fixed:not(.layout-menu-collapsed).swal2-shown .layout-content-navbar:not(.layout-without-menu) .layout-navbar,
    .layout-navbar-fixed:not(.layout-menu-collapsed) .modal-open .layout-content-navbar:not(.layout-without-menu) .layout-navbar,
    .layout-navbar-fixed:not(.layout-menu-collapsed).swal2-shown .layout-content-navbar:not(.layout-without-menu) .layout-navbar
    {
        inset-inline-start: var(--bs-menu-width); /* calc(16.25rem - var(--bs-scrollbar-width)); */
    }
}

.menu-vertical .menu-inner > .menu-item .menu-link {
    margin-inline: 0.5rem;
}

.menu-vertical .menu-item .menu-toggle::after {
    inset-inline-end: 5px;
}


.table.table-sm thead tr th {
    padding: 0.5rem 0.5rem 0.5rem 0.5rem;
}

.table tbody tr td {
    padding: 0.5rem 0.8rem;
}

.table thead.table-primary {
    background-color: var(--bs-menu-bg);
}

.table > thead > tr > th {
    color: white;
}

.table th {
    font-size: .9rem;
    text-transform: uppercase;
    font-weight: 500;
}


.table.table-hover tbody tr:hover {
    background-color: rgba(205, 225, 255, 0.02);
}

.nav-tabs {
    height: 100%;
    max-width: 250px;
}

.nav-tabs .nav-link, .nav-pills .nav-link {
    text-transform: none;
}

.nav-link {
    padding: 0 0 20px 0;
    white-space: normal;
}

.nav-link i {
    flex-shrink: 0;
}


.grayscale {
    filter: grayscale(100%);
    opacity: 0.5;
}

.border-dirty {
    border-color: #a9926c;
}

/* Popovers */
.popover .popover-header {
    padding: 6px 6px 0 12px;
    font-size: 0.95rem;
    font-weight: bold;
    color: var(--prim-color);
}

.popover .popover-body {
    padding: 6px 9px 9px 12px;
    font-size: .85em;
}

.cursor-pointer {
    cursor: pointer !important;
}


.btn-secondary {
    background-color: var(--sec-color);
    color: white;
}


/* Images */
.img-fluid-center {
    height: 100% !important;
    background-size: cover;
    background-position: center center;
    min-height: 240px;
}

@media (max-width: 576px) {
    .img-fluid-center {
        min-height: 160px;
    }
}

/* Scrollbars */
* {
    scrollbar-width: auto;
    scrollbar-color: var(--scroll-thumb-color) var(--bs-paper-bg); /* thumb, fondo */
}

::-webkit-scrollbar, .scrollbar {
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: thin;

}


/* Estilos para el editor Quill cuando está deshabilitado */
.quill-editor.disabled .ql-editor,
.quill-editor.ql-disabled .ql-editor {
    background-color: #e9ecef;
    opacity: 0.65;
    cursor: not-allowed;
}

.quill-editor.disabled .ql-toolbar,
.quill-editor.ql-disabled .ql-toolbar {
    opacity: 0.65;
    pointer-events: none;
}

.quill-editor.disabled,
.quill-editor.ql-disabled {
    border-color: #ced4da;
}

/* Opcional: Cambiar el cursor cuando está deshabilitado */
.quill-editor.disabled *,
.quill-editor.ql-disabled * {
    cursor: not-allowed !important;
}


.choices {
    margin-bottom: 0;
}

.choices__inner {
    background-color: transparent;
    padding: 4px 4px 3px 6px;
    border: 1px solid #ccc;
    border-radius: 6px;
    min-height: 38px;
    font-size: 15px;
}


.choices__item--choice {
    padding: 6px 12px !important;
}

.choices[data-type*=select-one] .choices__input {
    padding: 8px 10px;
}

.choices[data-type*=select-one] .choices__inner {
    padding-bottom: 3px;
}

/* Ocultar la flecha por defecto */
.choices[data-type*=select-one]::after {
    display: none;
}

/* Usar las clases de Tabler Icons */
.choices__inner::before {
    font-family: 'tabler-icons-300', sans-serif;
    content: '\ea5f'; /* Código del icono ti-chevron-down */
    font-size: 18px;
    position: absolute;
    right: 10px;
    top: 52%;
    transform: translateY(-50%);
    pointer-events: none;
    transition: transform 0.2s ease;
}

/* Cambiar el icono cuando esté abierto */
.choices.is-open .choices__inner::before {
    content: '\ea62'; /* Código del icono ti-chevron-up */
}

.choices.is-disabled .choices__inner, .choices.is-disabled .choices__input {
    background-color: #FFF;
    border: none;
    border-bottom: 1px dashed var(--bs-border-color);
}

.choices__list--dropdown {
    z-index: 3999 !important;
}

.choices__inner {
    z-index: 3998 !important;
}


.choices__group {
    font-weight: bold;
    color: var(--bs-secondary-color);
    padding: 8px 12px 4px;
    font-size: 0.875rem;
    text-transform: uppercase;
}

.choices__item--choice.in-group {
    padding-left: 24px; /* Indentar opciones del grupo */
}


[data-bs-theme="dark"] .choices {
    /* Input principal */

    .choices__inner {
        background-color: var(--bs-menu-bg) !important;
        border: 1px solid #333;
        color: var(--bs-body-color) !important;
    }

    /* Lista desplegable */

    .choices__list--dropdown {
        background-color: var(--bs-menu-bg) !important;
        border: 1px solid var(--text-color);
        box-shadow: var(--bs-box-shadow) !important;
    }

    /* Opciones individuales */

    .choices__item--choice {
        background-color: var(--bs-menu-bg) !important;
        color: var(--bs-body-color) !important;
    }

    /* Hover de las opciones */

    .choices__item--choice:hover,
    .choices__item--choice.is-highlighted {
        background-color: var(--bs-primary) !important;
        color: var(--bs-primary-text-emphasis) !important;
    }

    /* Placeholder text */

    .choices__placeholder {
        color: var(--bs-secondary-color) !important;
    }

    /* Input de búsqueda */

    .choices__input {
        background-color: var(--bs-menu-bg) !important;
        color: var(--bs-body-color) !important;
        border: none !important;
    }

    /* Placeholder del buscador */

    .choices__input::placeholder {
        color: var(--bs-secondary-color) !important;
    }

    /* Focus del input de búsqueda */

    .choices__input:focus {
        background-color: var(--bs-menu-bg) !important;
        color: var(--bs-body-color) !important;
        outline: none !important;
    }

}


.quill-text p {
    margin: 0 0 10px 0;
    font-size: 90%;
}

.list-group-item-action.active {
    border: 1px solid var(--prim-color);
    border-radius: 3px;
    background-color: #E8ECFD;
    color: #333;
}

.list-group-item-action.active:hover {
    border: 1px solid var(--sec-color);
    background-color: #E8ECFD;
    color: var(--prim-color);
}

.list-group .list-group-item-action.active h6 {
    color: var(--prim-color);
}

.custom-option.custom-option-image.custom-option-image-check .form-check-input {
    position: absolute;
    border: 1px solid transparent;
    inset-block-start: .3rem;
    inset-inline-end: .3rem;
}

.btn-check:checked + .btn {
    color: white;
    background-color: var(--prim-color);
}


/* Maps */
.google-map {
    height: 400px;
}


/* Modal */
.modal {
    --bs-modal-backdrop-bg: var(--modal-backdrop, var(--modal-backdrop-light));
    backdrop-filter: blur(1px) saturate(120%);
    --bs-modal-margin: 1rem !important;
}



.modal-content {
    border: 1px solid var(--bs-border-color);
    padding: 5px 0 10px 0;
}

.modal-header {
    padding: .5em 1.2em;
}

.modal-body {
    padding: .75em 1.2em;
}

.modal .modal-footer {
    padding: .75rem 1.1rem;
}

.modal .modal-header .btn-close {
    inset-block-start: 1.75rem;
    inset-inline-end: 1rem;
    background-color: var(--bs-body-bg);
}

@media (max-width: 768px) {
    .modal .modal-dialog:not(.modal-fullscreen) {
        padding-inline: 0;
    }
}



.offcanvas-header {
    padding: 1rem 1rem;
}

.offcanvas-body {
    padding: .25rem 1rem;
}

.offcanvas-footer {
    padding: 1rem 1rem .5rem .5rem
}


/* Forms */
.form-label {
    font-size: .9rem;
    font-weight: 600;
    padding: 0 5px;
    color: var(--bs-card-subtitle-color);
}


.form-control:enabled {
    box-shadow: 0 .075rem .125rem rgba(0, 0, 0, 0.05);
}

fieldset:disabled .input-group span, fieldset:disabled .input-group button {
    display: none;
}

input:-internal-autofill-selected {
    padding: 5px 5px 5px 14px;
}

.form-control:enabled {
    box-shadow: 0 .05rem .15rem rgba(0, 0, 0, 0.05);
}

.form-control:disabled {
    border: none;
    border-bottom: 1px solid #E1E1E1;
    border-radius: 0;
}

.form-control:focus {
    border: 1px solid var(--prim-color);
    box-shadow: 0 .25rem .5rem rgba(0, 0, 0, 0.15);
}


fieldset:disabled .input-group button,
fieldset:disabled .form-text {
    color: var(--text-color);
}

.btn:disabled, fieldset:disabled .btn {
    border: none;
}


fieldset:disabled .input-group span {
    border: none;
    border-bottom: 1px dashed var(--bs-border-color);
}


fieldset:disabled .form-control, fieldset:disabled .form-select, fieldset:disabled .input-group-append {
    border: none;
    border-bottom: 1px dashed var(--bs-border-color);
    background-color: transparent;
}

.form-select {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23999999' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='m6 9 6 6 6-6'/%3e%3c/svg%3e");
}

.form-select:disabled {

}


.switch-sm {
    font-size: 0.9rem;
}

.switch-sm .switch-label {
    top: 0.15rem;
}

.switch-sm .switch-toggle-slider {
    width: 2rem;
    height: 1.1rem;
}

.card {
    padding: 0.85em 1.25em;
    margin-top: 0;
    margin-bottom: 1rem;
}

.card-header {
    padding: 0 0 1px 0;
    margin-bottom: 12px;
}

.card-body {
    padding: 0 0 5px 0;
}

.card-footer {
    padding: 1em 0;
    margin-top: 20px;
}

.card-item {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: translate3d(0, 0, 0);
    border-radius: 5px;
    border: 1px solid var(--bs-body-bg);
    padding: 10px 10px 12px 10px;
    transition: all 0.3s ease;
}

.card-item:hover {
    position: relative;
    background-color: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
}

.card-item.active {
    background-color: var(--bs-modal-bg);
    border: 1px solid var(--ter-color);
}


.thin-border-light {
    padding: 12px 20px;
    border: 1px solid var(--bs-border-color);
    border-radius: 8px;
    margin: 0 0 10px 0;
    background-color: var(--bs-body-bg);
    z-index: 10;
}

.thin-border {
    padding: 15px 15px;
    border: 1px solid var(--scroll-thumb-color);
    border-radius: 5px;
    margin-bottom: 20px;
}

.thin-border-dark {
    padding: 4px 4px 8px 10px;
    border: 1px solid var(--text-color);
    border-radius: 5px;
    margin-bottom: 8px;
    background-color: var(--bs-paper-bg);
    z-index: 10;
}

.select-item-list {
    padding: 6px 8px 6px 8px;
    border: 1px solid #999;
    border-radius: 5px;
    margin-bottom: 8px;
    margin-top: 4px;
    background-color: var(--bs-body-bg);
    z-index: 10;
    width: calc(100% - 8px);
    position: absolute;
}

/* Flatpicker */

.flatpickr-calendar.open {
    z-index: 1090;
}


.foto-card {
    background-size: cover;
    background-position: center;
    border-radius: 8px;
    border: 1px solid #CCC;
}


/* Filepond */
@media (min-width: 1400px) {
    .filepond--item {
        width: calc(33.33% - 0.5em) !important;
    }
}

@media (min-width: 768px) and (max-width: 1399px) {
    .filepond--item {
        width: calc(50% - 0.5em) !important;
    }
}

.filepond--root {
    max-height: 400px;
}

/* use a hand cursor intead of arrow for the action buttons */
.filepond--file-action-button {
    cursor: pointer;
}

/* the text color of the drop label*/
.filepond--drop-label {
    color: #333;
}

/* underline color for "Browse" button */
.filepond--label-action {
    text-decoration-color: transparent;
}

/* the border radius of the drop area */
.filepond--panel-root {
    border-radius: 0.5em;
}

/* the border radius of the file item */
.filepond--item-panel {
    border-radius: 0.5em;
}

/* the background color of the file and file panel (used when dropping an image) */
.filepond--item-panel {
    background-color: #555555;
}

/* the background color of the drop circle */
.filepond--drip-blob {
    background-color: var(--bs-body-bg);
}

/* the background color of the black action buttons */
.filepond--file-action-button {
    background-color: var(--bs-dark);
}

/* the icon color of the black action buttons */
.filepond--file-action-button {
    color: var(--bs-light);
}

/* the color of the focus ring */
.filepond--file-action-button:hover,
.filepond--file-action-button:focus {
    box-shadow: 0 0 0 0.125em rgba(255, 255, 255, 0.9);
}

/* the text color of the file status and info labels */
.filepond--file {
    color: var(--bs-light);
}

/* bordered drop area */
.filepond--panel-root {
    background-color: transparent;
    border: 1px solid var(--bs-border-color);
}

/* Boton para borrado de archivos */
.btn-pond-img {
    position: absolute;
    margin-left: -25px;
    margin-top: 5px;
    border-radius: 4px;
}

.btn-pond-icon {
    position: absolute;
    margin-left: 25px;
    margin-top: -56px;
    border-radius: 4px;
}

/* Colores para los iconos de archivos cargados */
.text-color-xls {
    color: #107C41;
}

.text-color-doc {
    color: #185ABD;
}

.text-color-ppt {
    color: #ED6C47;
}

.text-color-pdf {
    color: #D32F2F;
}

/* Youtube Responsive video container */
.iframe-container {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%;
    height: 0;
}

.iframe-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* Opacity */
.opacity-0 {
    opacity: 0.0 !important;
}

.opacity-1 {
    opacity: 0.1 !important;
}

.opacity-2 {
    opacity: 0.2 !important;
}

.opacity-3 {
    opacity: 0.3 !important;
}

.opacity-4 {
    opacity: 0.4 !important;
}

.opacity-5 {
    opacity: 0.5 !important;
}

.opacity-6 {
    opacity: 0.6 !important;
}

.opacity-7 {
    opacity: 0.7 !important;
}

.opacity-8 {
    opacity: 0.8 !important;
}

.opacity-9 {
    opacity: 0.9 !important;
}

.opacity-10 {
    opacity: 1 !important;
}

/* Whatsapp icon */

.whatsapp-button {
    position: fixed;
    height: 36px;
    width: 42px;
    bottom: 12px;
    right: 20px;
    background-color: #25d366;
    color: #fff;
    border-radius: 12px;
    text-align: left;
    box-shadow: rgba(0, 0, 0, 0.2) 2px 2px 3px;
    z-index: 10;
    font-size: 14px;
}

.whatsapp-icon {
    margin-top: 6px;
    margin-left: 12px;
    font-size: 1.6em;
}

.long-text {
    max-width: 800px;
    width: 800px;
    word-break: break-word;
    white-space: normal;
    overflow-wrap: break-word;
}

.bg-login-cover {
    background-position: center center;
    background-size: cover;
    width: 100%;
    height: 100vh;
    filter: brightness(1.5);
    position: absolute;
}

.bg-login-cover::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(15, 30, 45, 0.3);
}

.custom-option {
    border: 1px solid #e6e6e8 !important;
}

.custom-option:hover {
    border: 1px solid #999 !important;
    background-color: var(--bs-modal-bg);
}

.breadcrumb {
    margin-bottom: 0;
}

.breadcrumb-item {
    font-weight: 300;
    font-size: 1.2rem;
    color: var(--dark-color);
    padding: 0;
    margin: 0;
}

.breadcrumb-item.active {
    font-weight: 500;
    color: var(--dark-color);
}


.breadcrumb-item + .breadcrumb-item {
    padding-left: 3px;
}

.breadcrumb-item + .breadcrumb-item::before {
    color: var(--text-color);
    padding-right: 5px;
    margin-top: 3px;
    font-family: 'tabler-icons-300', sans-serif;
    content: "\ea61";
    font-size: 1rem;
}

/* Colores del semaforo */


.color100, .color110, .color120, .color130 {
    color: #63BE7B;
}

.color90 {
    color: #7FC77D;
}

.color80 {
    color: #9BCF7F;
}

.color70 {
    color: #B7D780;
}

.color60 {
    color: #D3DF82;
}

.color50 {
    color: #EFE784;
}

.color40 {
    color: #FEDF81;
}

.color30 {
    color: #FCC17C;
}

.color20 {
    color: #FBA476;
}

.color10 {
    color: #F98670;
}

.color0 {
    color: #F8696B;
}

.color-0, .color-10, .color-20, .color-30, .color-40 {
    color: #333333;
}


.sem100, .sem110, .sem120, .sem130 {
    color: #000000;
    background-color: #63BE7B !important;
}

.sem90 {
    color: #000000;
    background-color: #7FC77D !important;
}

.sem80 {
    color: #000000;
    background-color: #9BCF7F !important;
}

.sem70 {
    color: #000000;
    background-color: #B7D780 !important;
}

.sem60 {
    color: #000000;
    background-color: #D3DF82 !important;
}

.sem50 {
    color: #000000;
    background-color: #EFE784 !important;
}

.sem40 {
    color: #000000;
    background-color: #FEDF81 !important;
}

.sem30 {
    color: #000000;
    background-color: #FCC17C !important;
}

.sem20 {
    color: #000000;
    background-color: #FBA476 !important;
}

.sem10 {
    color: #000000;
    background-color: #F98670 !important;
}

.sem0 {
    color: #000000;
    background-color: #F8696B !important;
}

.sem-0, .sem-10, .sem-20, .sem-30, .sem-40 {
    color: #FFFFFF;
    background-color: #000000 !important;
}



/* Avatar styles to ensure proper display */
.avatar {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    overflow: hidden;
}

.avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.avatar.avatar-online::before {
    content: '';
    position: absolute;
    bottom: 5%;
    right: 5%;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #28c76f;
    border: 2px solid #fff;
    z-index: 1;
}

.row {
    --bs-gutter-x: 1rem;
    --bs-gutter-y: 0.75rem;
}


h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1 {
    font-family: var(--header-font) "Calibri", "Segoe UI", "Arial", sans-serif;
    margin-top: 0;
    margin-bottom: 0.4rem;
    font-weight: 500;
    line-height: 1.3;
    color: var(--dark-color);
}

.content-wrapper {
    transition: opacity 0.3s ease-in-out;
    margin-top: 20px;
}

.navigating .content-wrapper {
    opacity: 0;
}


.h1, h1 {
    font-size: 24px;
}

.h2, h2 {
    font-size: 22px;
}

.h3, h3 {
    font-size: 20px;
}

.h4, h4 {
    font-size: 18px;
}

.h5, h5 {
    font-size: 16px;
}

.h6, h6 {
    font-size: 14px;
}

.text-1 {
    font-size: 0.85em !important;
}

.text-2 {
    font-size: 0.95em !important;
}

.text-3 {
    font-size: 1em !important;
}

.text-4 {
    font-size: 1.15em !important;
}

.text-5 {
    font-size: 1.3em !important;
}

.text-6 {
    font-size: 1.6em !important;
}

.text-7 {
    font-size: 1.8em !important;
}

.text-8 {
    font-size: 2em !important;
}

.text-9 {
    font-size: 2.25em !important;
}

.text-10 {
    font-size: 2.5em !important;
}


p, li {
    color: var(--text-color);
    font-weight: 400;
    margin: 0;
}

small, .small {
    font-size: .9em;
}

b {
    font-weight: 600;
}

.text-compact {
    line-height: 14px;
}

.ti {
    font-size: var(--bs-icon-size);
}

.text-color-white, .text-color-white {
    color: white !important;
}

.text-color-primary {
    color: var(--prim-color);
}

.text-color-secondary {
    color: var(--sec-color);
}

.text-color-tertiary {
    color: var(--ter-color);
}

.text-color-quaternary {
    color: var(--quat-color);
}

.text-color-success {
    color: #28c76f;
}

.text-color-info {
    color: #00cfe8;
}

.text-color-warning {
    color: #ff9f43;
}

.text-color-danger {
    color: #ea5455;
}

.text-muted {
    color: #aaa;
}

.text-muted.small, .text-muted.text-1 {
    color: #bbb;
}


p {
    margin-top: 0;
    margin-bottom: 0.2rem;
}

.required::after {
    content: " *"; /* Agrega un asterisco y un espacio despues del contenido de la etiqueta */
    color: #cc3333;
}

/* Estilo personalizado para el tooltip de ApexCharts */
.apexcharts-tooltip {
    background: rgba(255, 255, 255, 0.95) !important;
    border: 1px solid #e0e0e0 !important;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1) !important;
    border-radius: 6px !important;
    color: #333333 !important;
}

.apexcharts-tooltip-title {
    background: rgba(248, 249, 250, 0.95) !important;
    color: #333333 !important;
    border-bottom: 1px solid #e0e0e0 !important;
    font-weight: 600 !important;
}

.apexcharts-tooltip-series-group {
    background: transparent !important;
    color: #333333 !important;
}

.apexcharts-tooltip-text-y-label,
.apexcharts-tooltip-text-y-value {
    color: #333333 !important;
}

/* Para el marcador de color en el tooltip */
.apexcharts-tooltip-marker {
    margin-right: 5px !important;
}
/* Estilos simplificados para el menú móvil con slide básico */
@media (max-width: 1200px) {
    /* Configuración base del menú móvil */
    .layout-menu {
        top: 0;
        left: 0;
        height: 100vh;
        width: 235px;
        z-index: 1077;
        overflow-y: auto;
        overflow-x: hidden;

        /* Animación simple del sidebar */
        transform: translateX(-100%);
        transition: transform 0.3s ease-in-out;

        /* Mejoras visuales básicas */
        border-right: 1px solid rgba(0, 0, 0, 0.1);
    }

    /* Estado abierto del menú móvil */
    .layout-menu.mobile-menu-open,
    .layout-menu-mobile-open .layout-menu {
        transform: translateX(0);
    }

    /* Overlay simple */
    .mobile-menu-overlay {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.5);
        z-index: 1040;
        opacity: 0;
        visibility: hidden;
        transition: opacity 0.3s ease, visibility 0.3s ease;
    }

    /* Overlay visible */
    .mobile-menu-overlay.show {
        opacity: 1;
        visibility: visible;
    }

    /* Prevenir scroll del body cuando el menú está abierto */
    .layout-menu-mobile-open body {
        overflow: hidden;
    }
}

/* Estilos para temas oscuros (opcional) */
[data-theme="dark"] .layout-menu {
    background-color: #2c2c2c;
    border-right-color: rgba(255, 255, 255, 0.1);
}

/* Animaciones adicionales para hover en desktop */
@media (min-width: 1200px) {
    .layout-menu .menu-link {
        transition: all 0.2s ease;
    }
}

/* Mejoras adicionales para móvil */
@media (max-width: 991.98px) {
    .btn-group .btn {
        flex: 1;
        font-size: 0.875rem;
    }

    .card {
        border-radius: 12px;
    }

    .form-control {
        border-radius: 8px;
    }

    .form-label {
        font-size: 0.875rem;
        margin-bottom: 0.25rem;
    }
}

/* Animación suave para el indicador de cambios */
.alert {
    animation: slideUp 0.3s ease-out;
}

@keyframes slideUp {
    from {
        transform: translateY(100%) translateX(-50%);
        opacity: 0;
    }
    to {
        transform: translateY(0) translateX(-50%);
        opacity: 1;
    }
}


/* Tables - No More Tables technique (991px is the bootstrap SM max-width) */
@media only screen and (max-width: 991px) {
    .table.table-no-more,
    .table.table-no-more thead,
    .table.table-no-more tbody,
    .table.table-no-more tr,
    .table.table-no-more th,
    .table.table-no-more td {
        display: block;
    }

    .table.table-no-more thead tr {
        left: -9999px;
        position: absolute;
        top: -9999px;
    }

    .table.table-no-more tr {
        border-bottom: 1px solid #DDD;
    }

    .table.table-no-more td {
        border: none;
        position: relative;
        padding-left: 40%;
        text-align: left;
        white-space: normal;
    }

    .table.table-no-more td:before {
        content: attr(data-title);
        font-weight: bold;
        left: 6px;
        padding-right: 10px;
        position: absolute;
        text-align: left;
        top: 8px;
        white-space: nowrap;
        width: 45%;
    }

    .table.table-no-more.table-bordered td {
        border-bottom: 1px solid #dedede;
    }

    .table.table-no-more.table-sm td:before {
        top: 5px;
    }
}

.table.table-ecommerce-simple {
    display: table;
}

.table.table-ecommerce-simple thead th {
    border-bottom-width: 1px;
    border-top: 0;
}

.table.table-ecommerce-simple tbody td {
    vertical-align: middle;
}

.table.table-ecommerce-simple tbody tr:first-child td {
    border-top: 0;
}

.table.table-ecommerce-simple.table-striped > tbody > tr:nth-child(2n+1) > td,
.table.table-ecommerce-simple.table-striped > tbody > tr:nth-child(2n+1) > th {
    background-color: #f9f9f9;
}

.table.table-ecommerce-simple.table-striped th, .table.table-ecommerce-simple.table-striped td {
    border-top: 0;
}

.table.table-ecommerce-simple.table-ecomerce-simple-border-bottom {
    border-bottom: 1px solid #dee2e6;
}