/* ==========================================================================
   Utilidades genéricas (color, links)
   ========================================================================== */

.text-primary-custom {
    color: var(--primary-color) !important;
}

[data-bs-theme="dark"] .text-primary-custom {
    color: var(--text-primary) !important;
}

.bg-primary-custom {
    background-color: var(--primary-color) !important;
}

.border-primary-custom {
    border-color: var(--primary-color) !important;
}

/* Links estilizados (rojo primario, sin subrayado) */
.custom-link {
    color: var(--primary-color);
    text-decoration: none;
    transition: color 0.2s ease-in-out;
}

.custom-link:hover {
    color: var(--text-primary);
    text-decoration: underline;
}


/* ==========================================================================
   Layout helpers
   ========================================================================== */

/* Centra el contenido en el alto disponible considerando navbar + footer fijos.
   Reemplaza el inline:
     style="min-height: calc(100vh - var(--navbar-height) - var(--footer-height))"
   usado en Login, Register, ForgotPassword. */
.viewport-centered {
    min-height: calc(100vh - var(--navbar-height) - var(--footer-height));
}

/* Variante para vistas que no quedan tapadas por el footer. */
.viewport-centered--no-footer {
    min-height: calc(100vh - var(--navbar-height));
}

/* Wrapper principal del Layout — usado para ocupar la altura completa */
.app-wrapper-min-vh {
    min-height: 100vh;
}

/* Fondo "soft" para secciones intercaladas en la home.
   Reemplaza inline: style="background-color: var(--bg-secondary) !important;" */
.bg-section-soft {
    background-color: var(--bg-secondary) !important;
}

/* Ocultar elementos que JS controlará después (no usar para layout permanente). */
.d-none-init {
    display: none;
}

/* Modal con imagen grande (Activity foto, certificate, etc.) */
.modal-media-preview {
    max-height: 70vh;
}

.modal-media-preview--contain {
    max-height: 70vh;
    object-fit: contain;
}
