/*
 * Sena UI · modo móvil y menú por perfil
 *
 * Breakpoints: < 992px (lateral deslizable, en sena-sidebar.css), < 768px (móvil: barra
 * inferior, tablas y formularios compactos) y < 576px (modales a pantalla completa).
 */

/* ---------- menú por perfil: lo oculto solo se ve con «menú completo» ---------- */
html.sena-ui:not(.sena-menu-full) .sena-menu-hidden {
    display: none !important;
}

html.sena-ui .sena-menu-full-toggle[aria-pressed='true'] {
    color: var(--sena-primary);
}

/* ---------- barra inferior: solo móvil ---------- */
html.sena-ui .sena-bottombar {
    display: none;
}

@media (max-width: 767.98px) {
    html.sena-ui .sena-bottombar {
        display: flex;
        position: fixed;
        inset: auto 0 0 0;
        z-index: 1030;
        padding-bottom: env(safe-area-inset-bottom);
        background: var(--sena-surface);
        border-top: 1px solid var(--sena-border);
        box-shadow: 0 -4px 16px rgba(15, 23, 42, .06);
    }

    html.sena-ui .sena-bottombar-item {
        flex: 1 1 0;
        min-width: 0;
        min-height: 56px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 2px;
        padding: 6px 2px;
        border: 0;
        background: none;
        color: var(--bs-secondary-color, var(--sena-text));
        font-size: .68rem;
        line-height: 1.1;
        text-decoration: none;
    }

    html.sena-ui .sena-bottombar-item .svg-inline--fa {
        font-size: 1.25rem;
    }

    html.sena-ui .sena-bottombar-item span {
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    html.sena-ui .sena-bottombar-item.active {
        color: var(--sena-primary);
        font-weight: 600;
    }

    /* que la barra no tape el final de la página */
    html.sena-ui body {
        padding-bottom: calc(64px + env(safe-area-inset-bottom));
    }

    /* ---------- lateral y barra superior ---------- */
    html.sena-menu-sidebar .sena-sidebar {
        width: min(var(--sena-sidebar-w), 85vw);
        padding-bottom: env(safe-area-inset-bottom);
    }

    html.sena-menu-sidebar .sena-sidebar-link,
    html.sena-menu-sidebar .sena-sidebar-sublink {
        min-height: 44px;
    }

    html.sena-ui nav.navbar .nav-link {
        min-width: 40px;
        min-height: 40px;
    }

    /* ---------- contenido ---------- */
    html.sena-ui .container-fluid {
        padding-left: 12px;
        padding-right: 12px;
    }

    /* 16px evita el zoom automático de iOS al enfocar un campo */
    html.sena-ui .form-control,
    html.sena-ui .form-select,
    html.sena-ui .select2-selection {
        font-size: 16px;
        min-height: 42px;
    }

    html.sena-ui .input-group {
        flex-wrap: nowrap;
    }

    html.sena-ui .input-group > .form-control,
    html.sena-ui .input-group > .form-select {
        min-width: 0;
    }

    html.sena-ui .select2-container {
        max-width: 100%;
    }

    /* botones de cabeceras y barras de herramientas: en varias líneas, con zona táctil */
    html.sena-ui .btn-group,
    html.sena-ui .btn-toolbar {
        flex-wrap: wrap;
        gap: .25rem;
    }

    html.sena-ui .btn {
        min-height: 40px;
    }

    html.sena-ui .btn-sm {
        min-height: 34px;
    }

    html.sena-ui .nav-tabs,
    html.sena-ui .nav-pills {
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    html.sena-ui .nav-tabs::-webkit-scrollbar,
    html.sena-ui .nav-pills::-webkit-scrollbar {
        display: none;
    }

    html.sena-ui .nav-tabs .nav-link,
    html.sena-ui .nav-pills .nav-link {
        white-space: nowrap;
    }

    /* botones de guardar siempre a mano, por encima de la barra inferior */
    html.sena-ui form .card-footer,
    html.sena-ui .sena-sticky-actions {
        position: sticky;
        bottom: calc(56px + env(safe-area-inset-bottom));
        z-index: 5;
        background: var(--sena-surface);
    }

    /* ---------- tablas: desplazamiento horizontal y primera columna fija ---------- */
    html.sena-ui .table-responsive,
    html.sena-ui div:has(> table.table) {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    html.sena-ui table.table th,
    html.sena-ui table.table td {
        padding: .5rem .55rem;
        font-size: .875rem;
    }

    html.sena-ui table.table > tbody > tr > :first-child,
    html.sena-ui table.table > thead > tr > :first-child {
        position: sticky;
        left: 0;
        z-index: 1;
        background: var(--sena-surface);
    }

    /* columnas secundarias de los listados fuera: se ven entrando en la ficha */
    html.sena-ui .table-responsive table.table-hover > :is(thead, tbody) > tr > :nth-child(n+5):not(:last-child) {
        display: none;
    }

    /* ---------- cuadro de bienvenida y tarjetas ---------- */
    html.sena-ui[data-sena-page="Dashboard"] body > .bg-light.pt-4.pb-5 {
        margin-top: 0;
        padding-bottom: 1.5rem !important;
    }

    html.sena-ui .card:hover {
        transform: none;
    }
}

/* ---------- móviles pequeños: modales a pantalla completa ---------- */
@media (max-width: 575.98px) {
    html.sena-ui .modal-dialog:not(.modal-dialog-centered) {
        margin: 0;
        max-width: none;
        min-height: 100%;
    }

    html.sena-ui .modal-content {
        min-height: 100vh;
        border-radius: 0;
        border: 0;
    }

    html.sena-ui .modal-dialog-scrollable .modal-content {
        max-height: 100vh;
    }
}

@media print {
    html.sena-ui .sena-bottombar {
        display: none !important;
    }
}