/* COE "Te Orienta" · hoja de estilos común (sobre Bootstrap 5.3)
 * Conserva la identidad del sistema: azul UNAM, oro, barra gris clara con
 * borde azul y el botón "ir arriba" verde petróleo. */

:root {
    --coe-azul: #003DA5;
    --coe-azul-oscuro: #002b75;
    --coe-oro: #D6A14C;
    --coe-marino: #1a237e;
    --coe-petroleo: #024959;
    --coe-gris: #e6e6e6;
    --coe-borde: #1a73e8;
    --bs-link-color: #003DA5;
    --bs-link-color-rgb: 0, 61, 165;
    --bs-link-hover-color: #002b75;
    --bs-link-hover-color-rgb: 0, 43, 117;
}

body.coe {
    background: #f7f8fb;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

body.coe > main {
    flex: 1 0 auto;
}

/* Barra de navegación */
.coe-navbar {
    background-color: var(--coe-gris);
    border-bottom: 3px solid var(--coe-borde);
}

.coe-navbar .navbar-brand {
    color: var(--coe-azul);
}

.coe-navbar .nav-link {
    color: #333;
}

.coe-navbar .nav-link:hover,
.coe-navbar .nav-link.active {
    color: var(--coe-azul);
}

.coe-navbar .nav-link.active {
    font-weight: 600;
    box-shadow: inset 0 -3px 0 var(--coe-oro);
}

/* Cabecera institucional */
.coe-cabecera {
    max-height: 260px;
    border-radius: .5rem;
}

/* Botones con el azul UNAM */
.btn-primary {
    --bs-btn-bg: var(--coe-azul);
    --bs-btn-border-color: var(--coe-azul);
    --bs-btn-hover-bg: var(--coe-azul-oscuro);
    --bs-btn-hover-border-color: var(--coe-azul-oscuro);
    --bs-btn-active-bg: var(--coe-azul-oscuro);
    --bs-btn-active-border-color: var(--coe-azul-oscuro);
    --bs-btn-disabled-bg: var(--coe-azul);
    --bs-btn-disabled-border-color: var(--coe-azul);
}

.btn-outline-primary {
    --bs-btn-color: var(--coe-azul);
    --bs-btn-border-color: var(--coe-azul);
    --bs-btn-hover-bg: var(--coe-azul);
    --bs-btn-hover-border-color: var(--coe-azul);
    --bs-btn-active-bg: var(--coe-azul);
}

.page-item.active .page-link {
    background-color: var(--coe-azul);
    border-color: var(--coe-azul);
}

.page-link {
    color: var(--coe-azul);
}

.form-check-input:checked {
    background-color: var(--coe-azul);
    border-color: var(--coe-azul);
}

/* Tarjetas y tablas */
.coe-card {
    border: 0;
    border-top: 4px solid var(--coe-azul);
    box-shadow: 0 .125rem .5rem rgba(0, 0, 0, .06);
}

.coe-card > .card-header {
    background: #fff;
    font-weight: 600;
    color: var(--coe-marino);
}

.coe-tabla thead th {
    background-color: #eef2fa;
    color: var(--coe-marino);
    font-weight: 600;
    white-space: nowrap;
}

.coe-tabla td.texto-largo {
    min-width: 16rem;
    white-space: pre-line;
}

.coe-filtros {
    background: #fff;
    border-radius: .5rem;
    padding: 1rem;
    box-shadow: 0 .125rem .5rem rgba(0, 0, 0, .05);
}

.coe-dato dt {
    color: var(--coe-marino);
    font-weight: 600;
}

.coe-dato dd {
    white-space: pre-line;
}

/* Acceso */
.coe-login {
    border: 0;
    border-top: 4px solid var(--coe-azul);
    border-bottom: 4px solid var(--coe-oro);
}

/* Bitácora de sesiones */
.coe-sesion textarea {
    min-height: 7rem;
}

.coe-sesion .fecha {
    font-size: .85rem;
    color: #6c757d;
}

/* Formulario público */
.coe-registro .descripcion,
.coe-registro .instrucciones {
    font-size: 1.05rem;
    color: var(--coe-marino);
    line-height: 1.6;
}

.coe-registro .resaltar,
.coe-registro .enlace-resaltar {
    color: var(--coe-azul);
}

.coe-registro .form-label .bi {
    color: var(--coe-azul);
    margin-right: .25rem;
}

.coe-registro .obligatorio {
    color: #c62828;
}

.coe-aviso {
    background: #f0f0ff;
    border-left: 4px solid var(--coe-azul);
    border-radius: .375rem;
    padding: 1rem 1.25rem;
    font-size: .95rem;
}

/* Botón "ir arriba" */
.ir-arriba {
    position: fixed;
    right: 20px;
    bottom: 20px;
    width: 48px;
    height: 48px;
    border: 0;
    border-radius: 50%;
    background: var(--coe-petroleo);
    color: #fff;
    font-size: 1.25rem;
    display: none;
    box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .2);
    z-index: 1030;
}

.ir-arriba.visible {
    display: block;
}

/* Pie */
.coe-pie {
    background: var(--coe-gris);
    border-top: 3px solid var(--coe-oro);
    color: #444;
    font-size: .9rem;
}

/* Créditos */
.coe-creditos {
    background-color: var(--coe-petroleo);
    color: #fff;
}

.coe-creditos hr {
    border-color: var(--coe-oro);
    opacity: 1;
}

@media print {
    .coe-navbar, .ir-arriba, .coe-pie, .no-imprimir {
        display: none !important;
    }
}