/* =============================================================================
   mrorh-v2.css — CSS de módulo MRORH para el stack mro-frontend v1.12 (BS5)
   -----------------------------------------------------------------------------
   Slot "[modulo].css" del orden de carga oficial (zeus-base.css):
       bootstrap → fontawesome → montserrat → (libs) → zeus-base → ESTE ARCHIVO

   Solo contiene el scaffold de página propio de MRORH que NO cubre zeus-base:
   layout del contenido, page-header, variantes de card-header y footer.
   Los tokens de marca (--mro-navy, --mro-cyan, etc.) vienen de zeus-base.css.
   Portado de mro-theme.css (BS4) — las páginas BS4 siguen usando mro-theme.css.
   ============================================================================ */

/* ---- 1. Layout del contenido (equivalente a .mBody/.body-content de BS4) --- */
/* Ancho completo (pedido de Gerardo 2026-06-06): sin max-width, solo padding lateral. */
.mBody {
    margin: 1.5rem auto 3rem;
    padding: 0 1.5rem;
    max-width: 100%;
}

/* Barra de usuario logueado, pegada al navbar (sticky junto con él vía .zeus-header) */
.zeus-userbar {
    background-color: var(--mro-white);
    border-bottom: 1px solid #e9eef5;
    box-shadow: var(--mro-shadow-sm);
    padding: 0.35rem 0;
    font-size: 0.85rem;
    color: var(--mro-navy);
}

    .zeus-userbar i {
        color: var(--mro-cyan);
        margin-right: 0.35rem;
    }

    .zeus-userbar span + span {
        margin-left: 1.25rem;
    }

@media (max-width: 768px) {
    .mBody {
        margin-top: 1rem;
        margin-bottom: 1.5rem;
        padding: 0 0.75rem;
    }
}

.body-content {
    min-height: calc(100vh - 180px);
}

/* ---- 2. Page header (título de pantalla + acciones) ------------------------ */
.page-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.75rem;
    border-bottom: 1px solid #e9eef5;
    padding-bottom: 0.75rem;
    margin-bottom: 1.5rem;
}

    .page-header h1,
    .page-header h2,
    .page-header h3 {
        margin: 0;
        color: var(--mro-navy);
    }

    .page-header .page-actions {
        display: flex;
        gap: 0.5rem;
        flex-wrap: wrap;
    }

/* ---- 3. Headers de cards (paleta corporativa §7.4) ------------------------- */
.card .card-header {
    background-color: var(--mro-navy);
    color: var(--mro-white);
    font-weight: 600;
}

    .card .card-header.card-header-light {
        background-color: var(--mro-gray-100);
        color: var(--mro-navy);
        border-bottom: 1px solid #e9eef5;
    }

        .card .card-header.card-header-light h1,
        .card .card-header.card-header-light h2,
        .card .card-header.card-header-light h3,
        .card .card-header.card-header-light h4,
        .card .card-header.card-header-light h5,
        .card .card-header.card-header-light h6 {
            color: var(--mro-navy);
        }

    .card .card-header.card-header-accent {
        background-color: var(--mro-cyan);
        color: var(--mro-white);
    }

/* ---- 4. Tiles de menú (Inicio.aspx / Menu.aspx) ----------------------------- */
/* Versión compacta (pedido Gerardo 2026-06-06): mitad de alto, icono a la izquierda. */
.tile-btn {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 0.5rem;
    text-align: start;
    width: 100%;
    height: 100%;
    min-height: 54px;
    padding: 0.5rem 0.75rem;
    background-color: var(--mro-white);
    border: 1px solid #e9eef5;
    border-left: 3px solid var(--mro-cyan);
    border-radius: 6px;
    box-shadow: var(--mro-shadow-sm);
    color: var(--mro-navy);
    font-weight: 500;
    font-size: var(--mro-fs-sm);
    line-height: 1.2;
    transition: transform 0.15s ease, box-shadow 0.15s ease, border-left-color 0.1s ease, color 0.1s ease;
    text-decoration: none;
}

    .tile-btn:hover,
    .tile-btn:focus {
        transform: translateY(-2px);
        box-shadow: var(--mro-shadow-md);
        border-left-color: var(--mro-navy);
        color: var(--mro-navy);
        text-decoration: none;
    }

    .tile-btn:active {
        transform: translateY(0);
    }

    .tile-btn i,
    .tile-btn .fa,
    .tile-btn .fas,
    .tile-btn .far,
    .tile-btn .fab,
    .tile-btn .bi {
        font-size: 1.15rem;
        color: var(--mro-cyan);
        margin-bottom: 0;
        margin-right: 0;
        flex-shrink: 0;
        transition: color 0.1s ease;
    }

    .tile-btn:hover i,
    .tile-btn:focus i,
    .tile-btn:hover .fas,
    .tile-btn:hover .far,
    .tile-btn:hover .fab {
        color: var(--mro-navy);
    }

/* Variante para tiles que DESCARGAN archivos (Excel) — acento verde estándar BS */
.tile-btn-descarga {
    border-left-color: #198754;
}

    .tile-btn-descarga i {
        color: #198754;
    }

    .tile-btn-descarga:hover,
    .tile-btn-descarga:focus {
        border-left-color: var(--mro-navy);
    }

/* ---- 5. Footer institucional ------------------------------------------------ */
.mro-footer {
    border-top: 1px solid #e9eef5;
    padding: 1rem 0;
    margin-top: 2rem;
    background-color: var(--mro-white);
    color: var(--mro-gray-500);
}

    .mro-footer p {
        margin: 0;
    }