:root {
    --omesco-borde-navegacion: #cbd5e1;
    --omesco-fondo-navegacion: #ffffff;
    --omesco-texto-navegacion: #475569;
    --omesco-resalte-navegacion: #0f766e;
    --omesco-foco-navegacion: rgba(13, 148, 136, 0.22);
    --omesco-departamento: #0f766e;
    --omesco-departamento-suave: #d7f4ea;
}

.omesco-pagina {
    width: 100%;
    min-width: 0;
}

.omesco-cabecera-pagina {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 16px !important;
}

.omesco-navegacion {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

.omesco-cabecera-acciones {
    display: grid;
    justify-items: end;
    gap: 8px;
}

.omesco-navegacion-departamentos {
    justify-content: flex-start !important;
    width: 100%;
    min-width: 0;
    padding: 7px;
    border: 1px solid #d6dee8;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 3px 12px rgba(15, 23, 42, .045);
}

.omesco-navegacion-departamentos__titulo {
    flex: 0 0 auto;
    padding: 0 8px 0 5px;
    color: #526174;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.omesco-navegacion-departamentos .omesco-boton-navegacion {
    --enlace-departamento: #0f766e;
    --enlace-departamento-suave: #d1fae5;
    min-width: 108px !important;
    min-height: 44px !important;
    padding: 0 14px !important;
    border-color: color-mix(in srgb, var(--enlace-departamento) 20%, #d6dee8) !important;
    background: color-mix(in srgb, var(--enlace-departamento-suave) 48%, #ffffff) !important;
    color: color-mix(in srgb, var(--enlace-departamento) 82%, #1e293b) !important;
    box-shadow: none !important;
}

.omesco-enlace-departamento[data-departamento="AUTOS"] { --enlace-departamento: #4338ca; --enlace-departamento-suave: #e0e7ff; }
.omesco-enlace-departamento[data-departamento="NO_SGR"] { --enlace-departamento: #047857; --enlace-departamento-suave: #d1fae5; }
.omesco-enlace-departamento[data-departamento="SGR"] { --enlace-departamento: #7e22ce; --enlace-departamento-suave: #f3e8ff; }
.omesco-enlace-departamento[data-departamento="EXTERNO"] { --enlace-departamento: #b45309; --enlace-departamento-suave: #fef3c7; }

.omesco-navegacion-departamentos .omesco-boton-navegacion:hover {
    border-color: var(--enlace-departamento) !important;
    background: var(--enlace-departamento-suave) !important;
    color: var(--enlace-departamento) !important;
}

.omesco-navegacion-departamentos .omesco-boton-navegacion--activo {
    border-color: var(--enlace-departamento) !important;
    background: var(--enlace-departamento-suave) !important;
    color: var(--enlace-departamento) !important;
    box-shadow: inset 0 -3px 0 var(--enlace-departamento) !important;
}

.omesco-boton-navegacion {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 112px !important;
    width: auto !important;
    min-height: 40px !important;
    margin: 0 !important;
    padding: 0 14px !important;
    border: 1px solid var(--omesco-borde-navegacion) !important;
    border-radius: 10px !important;
    background: var(--omesco-fondo-navegacion) !important;
    color: var(--omesco-texto-navegacion) !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
    font-family: inherit !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
    text-decoration: none !important;
    text-transform: none !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    transition: border-color .15s ease, color .15s ease, background-color .15s ease, transform .15s ease !important;
}

.omesco-boton-navegacion:hover {
    border-color: #99f6e4 !important;
    background: #f0fdfa !important;
    color: var(--omesco-resalte-navegacion) !important;
    transform: translateY(-1px);
}

.omesco-boton-navegacion:focus-visible {
    outline: 3px solid var(--omesco-foco-navegacion) !important;
    outline-offset: 2px !important;
}

.omesco-boton-volver {
    gap: 7px !important;
}

.omesco-boton-volver__icono {
    flex: 0 0 auto;
    font-size: 16px;
    font-weight: 800;
    line-height: 1;
}

.omesco-boton-navegacion--activo,
.omesco-boton-navegacion[aria-current="page"] {
    border-color: #5eead4 !important;
    background: #ccfbf1 !important;
    color: #115e59 !important;
}

.omesco-boton-navegacion--peligro:hover {
    border-color: #fecdd3 !important;
    background: #fff1f2 !important;
    color: #be123c !important;
}

.omesco-boton-navegacion--oscuro {
    border-color: #525252 !important;
    background: #262626 !important;
    color: #e5e5e5 !important;
    box-shadow: none !important;
}

.omesco-boton-navegacion--oscuro:hover {
    border-color: #737373 !important;
    background: #404040 !important;
    color: #ffffff !important;
}

.omesco-desplazamiento {
    max-width: 100%;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
}

@media (max-width: 900px) {
    .omesco-pagina {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    .omesco-cabecera-pagina {
        align-items: flex-start !important;
        flex-direction: column !important;
    }

    .omesco-navegacion {
        justify-content: flex-start !important;
        width: 100% !important;
    }

    .omesco-cabecera-acciones {
        justify-items: stretch;
        width: 100%;
    }

    .omesco-pagina table {
        display: block;
        max-width: 100%;
        overflow-x: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
    }

    .omesco-formulario-adaptable {
        align-items: stretch !important;
    }
}

@media (max-width: 560px) {
    .omesco-navegacion-departamentos__titulo {
        flex: 1 0 100%;
        padding: 2px 5px;
    }

    .omesco-boton-navegacion {
        flex: 1 1 calc(50% - 4px) !important;
        min-width: 0 !important;
    }
}