/**
 * procedures.css — Estilos específicos del módulo de Trámites
 * Portal Ciudadano Sisvantec V8.3
 *
 * Clases globales (.bg-*-soft, .transition-all, .hover-up, .shadow-sm-hover,
 * .hover-burgundy, .letter-spacing-1, .btn-burgundy, .btn-outline-burgundy,
 * .text-burgundy) viven en global.css o variables.css.
 */

/* ──────────────────────────────────────────
   Hero Section — Home del portal ciudadano
   ────────────────────────────────────────── */
.hero-home {
    min-height: 400px;
    display: flex;
    align-items: center;
}

.hero-home .hero-video {
    object-fit: cover;
    top: 0;
    left: 0;
    z-index: 1;
}

.hero-home .hero-overlay {
    background: rgba(0, 0, 0, 0.6);
    top: 0;
    left: 0;
    z-index: 2;
}

.hero-home .hero-content {
    z-index: 3;
}

.home-dashboard-container {
    margin-top: -3rem;
    z-index: 10;
}

/* ──────────────────────────────────────────
   Procedure Cards
   ────────────────────────────────────────── */
.procedure-card {
    transition: all 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    border: 1px solid rgba(0, 0, 0, 0.06);
    border-radius: var(--radius-xl);
}

.procedure-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-hover);
    border-color: rgba(var(--color-primary-rgb), 0.1);
}

.procedure-card.hidden {
    display: none;
}

/* ──────────────────────────────────────────
   List Group (sidebar de procedimiento)
   ────────────────────────────────────────── */
.list-group-item-action:hover {
    background-color: transparent !important;
    color: var(--color-primary) !important;
}

.list-group-item-action:focus,
.list-group-item-action.active {
    background-color: transparent !important;
    color: var(--color-primary) !important;
    border: none !important;
    box-shadow: none !important;
}

/* ──────────────────────────────────────────
   Card lateral de gestión del trámite
   ────────────────────────────────────────── */
.card-procedure-sidebar {
    top: 90px;
    z-index: 10;
}

.card-procedure-body {
    background: linear-gradient(135deg, var(--color-background) 0%, var(--color-surface) 100%);
}

/* ──────────────────────────────────────────
   Header del catálogo de trámites (/procedures)
   ────────────────────────────────────────── */
.catalog-header {
    background: linear-gradient(rgba(var(--color-primary-rgb), 0.9), rgba(var(--color-primary-rgb), 0.9)), url('/img/portal_banner.png');
    background-size: cover;
    background-position: center;
}

/* ──────────────────────────────────────────
   Catalog sidebar
   ────────────────────────────────────────── */
.catalog-sidebar {
    top: 2rem;
    border-radius: var(--radius-xl);
    border: 1px solid rgba(0, 0, 0, 0.06);
    box-shadow: var(--shadow-md);
}

/* ──────────────────────────────────────────
   Utilidades de tamaño
   ────────────────────────────────────────── */
.w-70px {
    width: 70px;
}

/* ──────────────────────────────────────────
   Procedure Detail — Inline style replacements
   ────────────────────────────────────────── */
.active-submission-card {
    background-color: var(--warning-light);
    border-color: var(--warning) !important;
}

.line-height-snug {
    line-height: 1.4;
}

.cedula-icon {
    font-size: 1.1rem;
}

.tag-badge-burgundy {
    border: 1px solid var(--color-primary);
}

.modal-rounded-lg {
    border-radius: 15px;
}

.modal-body-lg {
    min-height: 500px;
}

/* ──────────────────────────────────────────
   Document Viewer (HTML generado por JS)
   ────────────────────────────────────────── */
.prereq-link {
    color: var(--color-primary);
}

.doc-viewer-iframe {
    border: none;
    border-radius: 0 0 12px 12px;
}

.doc-viewer-fallback-icon {
    font-size: 3rem;
}