/* =========================================================================
   Vista "Ver convocatoria" (glass blanco)
   Usada por:
     - El modal que abre el botón mini de cada tarjeta en index.blade.php
     - La página independiente show.blade.php (cuando se abre el enlace
       copiado directamente)
   Reutiliza a propósito clases ya existentes en index.css
   (.convocatoria-estado, .documento-icon, .documento-titulo, .btn-postularme,
   .btn-base, .btn-ver-postulantes) para que el detalle luzca como una
   extensión de la tarjeta, no como un componente aparte.
   ========================================================================= */

/* =================== Overlay del modal =================== */
.glass-overlay {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 10050;
    background: rgba(15, 23, 42, 0.55);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
    opacity: 0;
    transition: opacity 0.25s ease;
    overflow-y: auto;
}

.glass-overlay.show {
    display: flex;
    opacity: 1;
}

/* =================== Página independiente (enlace copiado) =================== */
.glass-page {
    min-height: calc(100vh - 4rem);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 2.5rem 1.25rem 4rem;
    background: radial-gradient(circle at top, #eff6ff 0%, #e0f2fe 45%, #f8fafc 100%);
}

/* =================== Tarjeta de cristal ===================
   Blanco predominante (no un vidrio muy transparente): el desenfoque de
   fondo se conserva, pero la opacidad sube para que el contenido se lea
   con más contraste. */
.glass-card {
    width: 100%;
    max-width: 820px;
    max-height: 90vh;
    overflow-y: auto;
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(255, 255, 255, 0.9);
    border-radius: 20px;
    box-shadow: 0 25px 70px rgba(15, 23, 42, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(22px) saturate(180%);
    -webkit-backdrop-filter: blur(22px) saturate(180%);
    padding: 1.5rem 1.5rem 1.75rem;
    transform: translateY(16px);
    transition: transform 0.3s ease;
    position: relative;
}

.glass-overlay.show .glass-card {
    transform: translateY(0);
}

.glass-page .glass-card {
    max-height: none;
    transform: none;
}

/* =================== Página show: detalle + visor lateral ===================
   Sin fondo de página: el detalle queda a la izquierda y el visor de
   documentos a la derecha (sticky). En pantallas chicas se apilan. */
.show-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 1.25rem;
    align-items: start;
    max-width: 1600px;
    margin: 0 auto;
    padding: 1.5rem 1.25rem 3rem;
}

.show-layout .glass-card {
    max-width: none;
    max-height: none;
    transform: none;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    box-shadow: 0 4px 24px rgba(15, 23, 42, 0.06);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    padding: 1.75rem;
}

.show-layout .glass-titulo {
    font-size: 1.2rem;
}

.show-layout .glass-descripcion {
    font-size: 0.85rem;
}

.show-layout .glass-meta {
    font-size: 0.8rem;
    padding: 0.75rem 0.9rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
}

.show-layout .glass-section {
    margin-bottom: 1.5rem;
}

.show-layout .glass-section-title {
    font-size: 0.78rem;
}

.show-layout .glass-cargo-card {
    font-size: 0.78rem;
    padding: 0.75rem 0.85rem;
    background: #f8fafc;
}

.show-layout .glass-doc-grid {
    grid-template-columns: 1fr;
}

.show-layout .glass-doc-link {
    padding: 0.55rem 0.8rem;
    background: #f8fafc;
}

.show-layout .glass-doc-link .documento-titulo {
    font-size: 0.78rem;
}

.show-layout .glass-doc-link.is-seleccionado {
    background: #eff6ff;
    border-color: #2563eb;
    box-shadow: inset 3px 0 0 #2563eb;
}

.show-layout .glass-step-label {
    font-size: 0.78rem;
}

.show-layout .glass-step-dates {
    font-size: 0.72rem;
}

.show-visor {
    position: sticky;
    top: 1rem;
    height: calc(100vh - 2rem);
    min-height: 420px;
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 20px;
    box-shadow: 0 4px 24px rgba(15, 23, 42, 0.06);
    overflow: hidden;
}

.show-visor-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid #e2e8f0;
    background: #f8fafc;
}

.show-visor-titulo {
    font-family: var(--font-display);
    font-size: 0.8rem;
    font-weight: 700;
    color: #1e3a8a;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

.show-visor-acciones {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    flex-shrink: 0;
}

.show-visor-btn {
    font-family: var(--font-display);
    font-size: 0.7rem;
    font-weight: 600;
    color: #2563eb;
    background: #ffffff;
    border: 1px solid #bfdbfe;
    border-radius: 8px;
    padding: 0.3rem 0.65rem;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.2s ease;
}

.show-visor-btn[hidden] {
    display: none;
}

.show-visor-btn:hover {
    background: #2563eb;
    color: #ffffff;
}

.show-visor-cerrar {
    font-size: 1rem;
    line-height: 1;
    padding: 0.2rem 0.55rem;
    color: #475569;
    border-color: #e2e8f0;
}

.show-visor-cerrar:hover {
    background: #fee2e2;
    color: #b91c1c;
    border-color: #fecaca;
}

.show-visor-body {
    flex: 1;
    position: relative;
    background: #f1f5f9;
}

.show-visor-frame {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    background: #ffffff;
}

.show-visor-frame[hidden],
.show-visor-vacio[hidden] {
    display: none;
}

.show-visor-vacio {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 1.5rem;
    text-align: center;
    color: #64748b;
    font-family: var(--font-display);
    font-size: 0.85rem;
}

.show-visor-vacio img {
    opacity: 0.45;
}

.show-visor-vacio p {
    margin: 0;
    max-width: 260px;
}

@media (max-width: 992px) {
    .show-layout {
        grid-template-columns: 1fr;
        padding: 1rem 0.75rem 2rem;
    }

    .show-visor {
        position: static;
        height: 75vh;
    }
}

/* =================== Encabezado =================== */
.glass-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.65rem;
}

.glass-header-main {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    min-width: 0;
    flex: 1;
}

.glass-titulo-row {
    display: flex;
    /* nowrap a propósito: el título es el que se parte en varias líneas
       (min-width: 0 se lo permite); el estado nunca debe caer debajo. */
    align-items: flex-start;
    flex-wrap: nowrap;
    gap: 0.5rem;
}

.glass-estado {
    flex-shrink: 0;
    margin-top: 0.15rem;
    font-size: 0.65rem !important;
    padding: 0.25rem 0.6rem !important;
}

.glass-titulo {
    margin: 0;
    flex: 1;
    min-width: 0;
    font-family: var(--font-display);
    font-weight: 700;
    font-size: 1.05rem;
    color: #1e3a8a;
    text-transform: uppercase;
    letter-spacing: 0.01em;
    line-height: 1.3;
}

.glass-close {
    background: rgba(15, 23, 42, 0.05);
    border: 1px solid rgba(15, 23, 42, 0.08);
    width: 32px;
    height: 32px;
    border-radius: 50%;
    font-size: 1.3rem;
    line-height: 1;
    color: #475569;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
    flex-shrink: 0;
}

.glass-close:hover {
    background: #fee2e2;
    color: #b91c1c;
    border-color: #fecaca;
}

/* =================== Barra de acciones ===================
   Ambos botones viven dentro de un mismo contenedor "segmentado", del
   mismo tamaño y alineados: antes eran dos píldoras sueltas de distinto
   peso visual que no encajaban bien una junto a la otra. */
.glass-toolbar {
    display: flex;
    gap: 0.4rem;
    margin-top: 1.15rem;
    background: rgba(148, 163, 184, 0.12);
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    padding: 0.3rem;
}

.glass-copy-btn {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    font-family: var(--font-display);
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.45rem 0.6rem;
    border-radius: 9px;
    cursor: pointer;
    background: linear-gradient(135deg, #2563eb, #1d4ed8);
    color: #ffffff;
    border: none;
    box-shadow: 0 3px 10px rgba(37, 99, 235, 0.3);
    transition: all 0.2s ease;
    text-decoration: none;
    white-space: nowrap;
}

.glass-copy-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 5px 14px rgba(37, 99, 235, 0.4);
}

.glass-copy-btn.is-copiado {
    background: linear-gradient(135deg, #10b981, #059669);
    box-shadow: 0 3px 10px rgba(16, 185, 129, 0.35);
}

.glass-copy-btn--outline {
    background: transparent;
    color: #334155;
    border: none;
    box-shadow: none;
}

.glass-copy-btn--outline:hover {
    background: rgba(255, 255, 255, 0.8);
    color: #1e3a8a;
    transform: translateY(-1px);
    box-shadow: 0 3px 10px rgba(15, 23, 42, 0.08);
}

.glass-copy-btn svg {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
}

.glass-copy-btn img {
    width: 14px;
    height: 14px;
}

/* =================== Descripción y metadatos =================== */
.glass-descripcion {
    font-family: var(--font-display);
    font-size: 0.78rem;
    color: #334155;
    line-height: 1.5;
    text-align: justify;
    hyphens: auto;
    margin: 0 0 0.75rem;
}

.glass-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem 0.7rem;
    align-items: center;
    margin-bottom: 1rem;
    font-family: var(--font-display);
    font-size: 0.72rem;
    color: #334155;
}

.glass-pill {
    background: rgba(99, 102, 241, 0.12);
    color: #4338ca;
    border: 1px solid rgba(99, 102, 241, 0.25);
    padding: 0.2rem 0.6rem;
    border-radius: 999px;
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.glass-meta-item strong {
    color: #0f172a;
}

/* =================== Secciones =================== */
.glass-section {
    margin-bottom: 1rem;
}

.glass-section:last-of-type {
    margin-bottom: 0;
}

.glass-section-title {
    font-family: var(--font-display);
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #1e3a8a;
    margin: 0 0 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.glass-section-title::after {
    content: "";
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, rgba(30, 58, 138, 0.25), transparent);
}

/* =================== Cargos =================== */
.glass-cargos-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 0.5rem;
}

.glass-cargo-card {
    background: rgba(248, 250, 252, 0.9);
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 10px;
    padding: 0.55rem 0.65rem;
    font-size: 0.7rem;
    color: #1e3a8a;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    transition: all 0.2s ease;
}

.glass-cargo-card:hover {
    background: #ffffff;
    border-color: rgba(37, 99, 235, 0.25);
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
}

.glass-cargo-card strong {
    color: #111827;
    font-weight: 600;
}

.glass-cargo-card .btn-postularme {
    margin-top: 0.3rem;
    width: 100%;
    box-sizing: border-box;
    font-size: 0.7rem !important;
    padding: 0.3rem 0.6rem !important;
}

/* =================== Documentos =================== */
.glass-doc-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 0.4rem;
}

.glass-doc-link {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: rgba(248, 250, 252, 0.9);
    border: 1px solid rgba(15, 23, 42, 0.06);
    padding: 0.4rem 0.6rem;
    border-radius: 9px;
    text-decoration: none;
    min-height: 34px;
    box-sizing: border-box;
    transition: all 0.2s ease;
}

.glass-doc-link:hover {
    background: #ffffff;
    border-color: rgba(37, 99, 235, 0.3);
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(15, 23, 42, 0.08);
}

.glass-doc-link .documento-icon {
    width: 18px;
    height: 18px;
}

.glass-doc-link .documento-titulo {
    font-size: 0.68rem;
}

.glass-empty {
    grid-column: 1 / -1;
    text-align: center;
    color: #64748b;
    font-style: italic;
    font-size: 0.75rem;
    padding: 0.5rem;
}

/* =================== Cronograma (stepper vertical) =================== */
.glass-steps {
    display: flex;
    flex-direction: column;
}

.glass-step {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    padding: 0.4rem 0;
    position: relative;
}

.glass-step:not(:last-child)::before {
    content: "";
    position: absolute;
    left: 4px;
    top: 18px;
    bottom: -0.4rem;
    width: 2px;
    background: rgba(148, 163, 184, 0.35);
}

.glass-step-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #cbd5e1;
    margin-top: 3px;
    flex-shrink: 0;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.9);
    position: relative;
    z-index: 1;
}

.glass-step.is-done .glass-step-dot {
    background: #10b981;
}

.glass-step.is-active .glass-step-dot {
    background: #ef4444;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.9);
    /* Mismo latido suave definido en index.css (.timeline-item.active), a una
       escala más discreta acorde al tamaño del punto. */
    animation: heartbeat 1.8s ease-in-out infinite;
}

.glass-step-body {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.glass-step-label {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 0.72rem;
    letter-spacing: 0.02em;
    color: #1e293b;
}

.glass-step-dates {
    font-size: 0.68rem;
    color: #64748b;
}

.glass-step-tag {
    font-size: 0.6rem;
    font-weight: 600;
    padding: 0.15rem 0.5rem;
    border-radius: 999px;
    white-space: nowrap;
    align-self: flex-start;
    margin-top: 2px;
    font-family: var(--font-display);
}

.glass-step.is-done .glass-step-tag {
    background: #d1fae5;
    color: #047857;
}

.glass-step.is-active .glass-step-tag {
    background: #fee2e2;
    color: #b91c1c;
}

.glass-step.is-upcoming .glass-step-tag {
    background: #f1f5f9;
    color: #475569;
}

/* =================== Pie =================== */
.glass-footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.5rem;
    margin-top: 1.15rem;
    padding-top: 0.85rem;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.glass-footer .btn-base {
    font-size: 0.75rem !important;
    padding: 0.4rem 0.85rem !important;
}

.glass-btn-volver {
    background: transparent;
    color: #334155;
    border: 1px solid rgba(51, 65, 85, 0.25);
}

.glass-btn-volver:hover {
    background: rgba(51, 65, 85, 0.06);
    border-color: #334155;
}

/* =================== Botón mini "Ver convocatoria" en la tarjeta =================== */
.top-info-actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}

.btn-ver-mini {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(37, 99, 235, 0.08);
    border: 1px solid rgba(37, 99, 235, 0.25);
    color: #2563eb;
    cursor: pointer;
    transition: all 0.2s ease;
    flex-shrink: 0;
    padding: 0;
}

.btn-ver-mini:hover {
    background: #2563eb;
    color: #ffffff;
    border-color: #2563eb;
    transform: translateY(-1px);
    box-shadow: 0 4px 10px rgba(37, 99, 235, 0.3);
}

.btn-ver-mini svg {
    width: 16px;
    height: 16px;
}

/* =================== Responsive =================== */
@media (max-width: 640px) {
    .glass-card {
        padding: 1.1rem 1rem 1.35rem;
        border-radius: 16px;
    }

    .glass-titulo {
        font-size: 0.95rem;
    }

    .glass-toolbar {
        flex-direction: column;
    }

    .glass-cargos-grid,
    .glass-doc-grid {
        grid-template-columns: 1fr;
    }

    .glass-footer {
        flex-direction: column-reverse;
    }

    .glass-footer .btn-base,
    .glass-footer .glass-btn-volver {
        width: 100%;
    }

    .glass-page {
        padding: 1.25rem 0.75rem 3rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .glass-step.is-active .glass-step-dot {
        animation: none;
    }
}

/* =========================================================================
   Refinamiento visual (página show + acciones del encabezado + pulso)
   ========================================================================= */

/* Acciones del encabezado (copiar enlace / cerrar) */
.glass-header-actions {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    flex-shrink: 0;
}

.glass-copy-btn--header {
    flex: none;
    font-size: 0.66rem;
    padding: 0.35rem 0.7rem;
    border-radius: 999px;
    background: #eff6ff;
    color: #1d4ed8;
    border: 1px solid #bfdbfe;
    box-shadow: none;
}

.glass-copy-btn--header:hover {
    background: #2563eb;
    color: #fff;
    border-color: #2563eb;
}

.glass-copy-btn--header.is-copiado {
    background: #10b981;
    border-color: #10b981;
    color: #fff;
    box-shadow: none;
}

/* Enlace "Descargar PDF" junto al título del cronograma */
.glass-section-title .glass-section-link {
    order: 3;
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.62rem;
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0;
    color: #1d4ed8;
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    border-radius: 999px;
    padding: 0.2rem 0.6rem;
    text-decoration: none;
    transition: all 0.2s ease;
}

.glass-section-title .glass-section-link:hover {
    background: #2563eb;
    color: #fff;
    border-color: #2563eb;
}

/* Pulso en la etapa en curso ("dónde estoy") */
.glass-step.is-active {
    background: linear-gradient(90deg, rgba(239, 68, 68, 0.07), transparent 75%);
    border-radius: 8px;
    padding-left: 0.4rem;
    padding-right: 0.4rem;
    margin: 0 -0.4rem;
}

.glass-step.is-active::before {
    left: 8px !important;
}

.glass-step.is-active .glass-step-dot {
    animation: none;
}

.glass-step.is-active .glass-step-dot::before,
.glass-step.is-active .glass-step-dot::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: rgba(239, 68, 68, 0.55);
    animation: glass-pulso 1.8s ease-out infinite;
    z-index: -1;
}

.glass-step.is-active .glass-step-dot::after {
    animation-delay: 0.9s;
}

.glass-step.is-active .glass-step-label {
    color: #b91c1c;
}

.glass-step.is-active .glass-step-tag {
    animation: glass-tag-pulso 1.8s ease-in-out infinite;
}

@keyframes glass-pulso {
    0% {
        transform: scale(1);
        opacity: 0.8;
    }

    100% {
        transform: scale(3.2);
        opacity: 0;
    }
}

@keyframes glass-tag-pulso {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.35);
    }

    50% {
        box-shadow: 0 0 0 4px rgba(239, 68, 68, 0);
    }
}

/* ---------- Página show: más elegante y con tipografía compacta ---------- */
.show-layout {
    background:
        radial-gradient(900px 300px at 0% 0%, rgba(37, 99, 235, 0.05), transparent 70%);
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
}

.show-layout .glass-card {
    padding: 0;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 10px 40px rgba(15, 23, 42, 0.07);
}

.show-layout .show-detalle > * {
    margin-left: 1.4rem;
    margin-right: 1.4rem;
}

.show-layout .glass-header {
    margin: 0 0 0.75rem;
    padding: 1.1rem 1.4rem 1rem;
    background: linear-gradient(135deg, #1e3a8a 0%, #2563eb 100%);
    align-items: center;
}

.show-layout .glass-titulo {
    font-size: 0.95rem;
    color: #fff;
    letter-spacing: 0.02em;
}

.show-layout .glass-copy-btn--header {
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
    border-color: rgba(255, 255, 255, 0.35);
}

.show-layout .glass-copy-btn--header:hover {
    background: #fff;
    color: #1e3a8a;
}


.show-layout .glass-descripcion {
    font-size: 0.76rem;
    color: #475569;
    line-height: 1.6;
}

.show-layout .glass-meta {
    font-size: 0.72rem;
    padding: 0.6rem 0.8rem;
    border-radius: 10px;
}

.show-layout .glass-section {
    margin-bottom: 1.25rem;
}

.show-layout .glass-section-title {
    font-size: 0.68rem;
}

.show-layout .glass-section-title::after {
    order: 2;
}

.show-layout .glass-cargo-card {
    font-size: 0.72rem;
    padding: 0.6rem 0.75rem;
    border-radius: 12px;
    border-left: 3px solid #2563eb;
}

.show-layout .glass-doc-grid {
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
}

.show-layout .glass-doc-link {
    padding: 0.45rem 0.7rem;
    border-radius: 10px;
}

.show-layout .glass-doc-link .documento-titulo {
    font-size: 0.7rem;
}

.show-layout .glass-step-label {
    font-size: 0.7rem;
}

.show-layout .glass-step-dates {
    font-size: 0.66rem;
}

.show-layout .glass-footer {
    margin-top: 1rem;
    margin-bottom: 1.25rem;
}

.show-visor {
    border-radius: 18px;
    box-shadow: 0 10px 40px rgba(15, 23, 42, 0.07);
}

.show-visor-header {
    background: linear-gradient(135deg, #1e3a8a 0%, #2563eb 100%);
    border-bottom: 0;
}

.show-visor-titulo {
    color: #fff;
    font-size: 0.75rem;
}

.show-visor-btn {
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
    border-color: rgba(255, 255, 255, 0.35);
    font-size: 0.65rem;
}

.show-visor-btn:hover {
    background: #fff;
    color: #1e3a8a;
}

.show-visor-vacio {
    font-size: 0.75rem;
    background: repeating-linear-gradient(45deg, #f8fafc, #f8fafc 12px, #f1f5f9 12px, #f1f5f9 24px);
}

@media (max-width: 640px) {
    .glass-copy-btn--header .glass-copy-texto {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .glass-step.is-active .glass-step-dot::before,
    .glass-step.is-active .glass-step-dot::after,
    .glass-step.is-active .glass-step-tag {
        animation: none;
    }
}

/* =========================================================================
   Version sobria y profesional: tipografia compacta (sin Oswald), cabecera
   clara en lugar del azul degradado, y visor con soporte Word.
   ========================================================================= */
.glass-card,
.glass-card *,
.show-visor-header,
.show-visor-header *,
.show-visor-vacio,
.show-visor-vacio *,
.show-visor-cargando {
    font-family: 'Oswald', sans-serif !important;
}

.glass-card {
    font-size: 13px;
}

.show-layout .glass-header {
    background: #fff;
    border-bottom: 1px solid #e5e7eb;
    border-top: 3px solid #4f46e5;
    padding: 1rem 1.4rem;
    margin-bottom: 1rem;
}

.glass-titulo,
.show-layout .glass-titulo {
    color: #0f172a;
    text-transform: none;
    letter-spacing: -0.005em;
    font-size: 1rem;
    font-weight: 650;
    line-height: 1.35;
}


.glass-estado {
    font-size: 0.62rem !important;
    letter-spacing: 0.02em;
}

.glass-copy-btn--header,
.show-layout .glass-copy-btn--header {
    background: #fff;
    color: #334155;
    border: 1px solid #d1d5db;
    font-size: 0.68rem;
    font-weight: 500;
}

.glass-copy-btn--header:hover,
.show-layout .glass-copy-btn--header:hover {
    background: #f8fafc;
    color: #4f46e5;
    border-color: #4f46e5;
    transform: none;
    box-shadow: none;
}

.glass-copy-btn--header.is-copiado,
.show-layout .glass-copy-btn--header.is-copiado {
    background: #ecfdf5;
    color: #047857;
    border-color: #6ee7b7;
}

.glass-descripcion,
.show-layout .glass-descripcion {
    font-size: 0.74rem;
    line-height: 1.65;
    color: #475569;
}

.glass-meta,
.show-layout .glass-meta {
    font-size: 0.7rem;
    background: transparent;
    border: 0;
    border-top: 1px solid #f1f5f9;
    border-bottom: 1px solid #f1f5f9;
    border-radius: 0;
    padding: 0.6rem 0;
    gap: 0.4rem 1.1rem;
}

.glass-pill {
    background: #eef2ff;
    color: #4338ca;
    border-color: #c7d2fe;
    font-size: 0.6rem;
}

.glass-section-title,
.show-layout .glass-section-title {
    font-size: 0.64rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: #475569;
}

.glass-section-title::after {
    background: #e5e7eb;
}

.glass-cargo-card,
.show-layout .glass-cargo-card {
    font-size: 0.7rem;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-left: 3px solid #4f46e5;
    color: #334155;
    padding: 0.55rem 0.7rem;
}

.glass-cargo-card strong {
    color: #0f172a;
    font-weight: 600;
}

.glass-doc-link,
.show-layout .glass-doc-link {
    background: #fff;
    border: 1px solid #e5e7eb;
    padding: 0.4rem 0.65rem;
    min-height: 32px;
}

.glass-doc-link:hover,
.show-layout .glass-doc-link:hover {
    border-color: #a5b4fc;
    background: #fafaff;
}

.glass-doc-link .documento-titulo,
.show-layout .glass-doc-link .documento-titulo {
    font-size: 0.68rem !important;
    font-weight: 500;
    color: #1e293b;
    line-height: 1.3;
}

.show-layout .glass-doc-link.is-seleccionado {
    background: #eef2ff;
    border-color: #4f46e5;
    box-shadow: inset 3px 0 0 #4f46e5;
}

.glass-step-label,
.show-layout .glass-step-label {
    font-size: 0.68rem;
    font-weight: 600;
}

.glass-step-dates,
.show-layout .glass-step-dates {
    font-size: 0.64rem;
}

.glass-step-tag {
    font-size: 0.58rem;
}

.glass-footer .btn-base,
.glass-btn-volver {
    font-size: 0.7rem !important;
}

.glass-section-title .glass-section-link {
    background: #fff;
    color: #4f46e5;
    border-color: #c7d2fe;
    font-weight: 500;
}

.glass-section-title .glass-section-link:hover {
    background: #4f46e5;
    color: #fff;
    border-color: #4f46e5;
}

/* Visor */
.show-visor-header {
    background: #fff;
    border-bottom: 1px solid #e5e7eb;
    border-top: 3px solid #4f46e5;
}

.show-visor-titulo {
    color: #0f172a;
    font-size: 0.72rem;
    font-weight: 600;
}

.show-visor-btn {
    background: #fff;
    color: #334155;
    border-color: #d1d5db;
    font-size: 0.64rem;
    font-weight: 500;
}

.show-visor-btn:hover {
    background: #f8fafc;
    color: #4f46e5;
    border-color: #4f46e5;
}

.show-visor-body {
    background: #e5e7eb;
    overflow: hidden;
}

.show-visor-docx {
    position: absolute;
    inset: 0;
    overflow: auto;
    padding: 0.75rem 0;
}

.show-visor-docx[hidden],
.show-visor-cargando[hidden] {
    display: none;
}

.show-visor-docx .docx-wrapper {
    background: transparent !important;
    padding: 0 !important;
}

.show-visor-docx .docx-wrapper > section.docx {
    margin-bottom: 0.75rem !important;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.15) !important;
    zoom: 0.72;
}

.show-visor-cargando {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(248, 250, 252, 0.85);
    color: #475569;
    font-size: 0.75rem;
    z-index: 2;
}

.show-visor-vacio {
    background: #f8fafc;
    font-size: 0.72rem;
}

/* =========================================================================
   Estilo final: mismo lenguaje visual que las tarjetas de index
   (Oswald, azul #0b3d91 / #1e3a8a, borde cian #10dbd1, chips indigo).
   ========================================================================= */
.glass-card {
    font-size: 15px;
    border: 1px solid #10dbd1;
    box-shadow: 0 0.2rem 0.9rem rgba(16, 219, 209, 0.12), 0 0.2rem 0.6rem rgba(0, 0, 0, 0.06);
}

.show-layout .glass-card {
    border: 1px solid #10dbd1;
    box-shadow: 0 0.3rem 1.2rem rgba(16, 219, 209, 0.14), 0 0.2rem 0.6rem rgba(0, 0, 0, 0.06);
}

.show-layout {
    background: none;
}

/* Cabecera: degradado clarito cian-azul, sin bloque azul oscuro */
.show-layout .glass-header {
    background: linear-gradient(135deg, #ecfeff 0%, #eff6ff 60%, #ffffff 100%);
    border-top: 0;
    border-bottom: 1px solid #c7f3ef;
    border-left: 4px solid #10dbd1;
    padding: 1.1rem 1.4rem;
}

.glass-titulo,
.show-layout .glass-titulo {
    color: #0b3d91;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 1.05rem;
    letter-spacing: 0.02em;
    line-height: 1.3;
}

.glass-estado {
    font-size: 0.7rem !important;
    padding: 0.3rem 0.8rem !important;
}


/* Botón copiar enlace */
.glass-copy-btn--header,
.show-layout .glass-copy-btn--header {
    font-size: 0.75rem;
    font-weight: 500;
    background: #fff;
    color: #1d4ed8;
    border: 1px solid #bfdbfe;
    letter-spacing: 0.02em;
}

.glass-copy-btn--header:hover,
.show-layout .glass-copy-btn--header:hover {
    background: #eff6ff;
    color: #0b3d91;
    border-color: #60a5fa;
}

/* Descripción */
.glass-descripcion,
.show-layout .glass-descripcion {
    font-size: 0.85rem;
    font-weight: 300;
    line-height: 1.6;
    color: #374151;
}

/* Meta como chips */
.glass-meta,
.show-layout .glass-meta {
    border: 0;
    padding: 0;
    gap: 0.5rem;
    font-size: 0.78rem;
    margin-bottom: 1.25rem;
}

.glass-meta-item {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 0.4rem;
    padding: 0.3rem 0.65rem;
    color: #111827;
}

.glass-meta-item strong {
    color: #1e3a8a;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.68rem;
    letter-spacing: 0.05em;
}

.glass-pill {
    background: #eef2ff;
    color: #4338ca;
    border: 1px solid #c7d2fe;
    border-radius: 0.4rem;
    font-size: 0.72rem;
    font-weight: 500;
    padding: 0.3rem 0.65rem;
    text-transform: none;
    letter-spacing: 0.01em;
}

/* Títulos de sección con barra de acento */
.glass-section-title,
.show-layout .glass-section-title {
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    color: #1e3a8a;
    margin-bottom: 0.7rem;
}

.glass-section-title::before {
    content: "";
    width: 4px;
    height: 1em;
    border-radius: 2px;
    background: linear-gradient(180deg, #10dbd1, #2563eb);
    flex-shrink: 0;
}

.glass-section-title::after {
    background: linear-gradient(90deg, #dbeafe, transparent);
}

.glass-section-title .glass-section-link {
    font-size: 0.68rem;
    font-weight: 500;
    color: #1d4ed8;
    border-color: #bfdbfe;
    background: #fff;
    text-transform: none;
    letter-spacing: 0.02em;
}

.glass-section-title .glass-section-link:hover {
    background: #1d4ed8;
    color: #fff;
    border-color: #1d4ed8;
}

/* Cargos */
.glass-cargo-card,
.show-layout .glass-cargo-card {
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-left: 3px solid #10dbd1;
    border-radius: 0.6rem;
    padding: 0.7rem 0.8rem;
    gap: 0.5rem;
    color: #000;
}

.glass-cargo-card:hover {
    background: #f3f4f6;
}

.glass-cargo-nombre {
    font-size: 0.85rem;
    font-weight: 600;
    color: #0b3d91;
    text-transform: uppercase;
    line-height: 1.25;
    letter-spacing: 0.01em;
}

.glass-cargo-datos {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.glass-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    background: #eef2ff;
    color: #4338ca;
    border-radius: 0.35rem;
    padding: 0.15rem 0.5rem;
    font-size: 0.75rem;
    font-weight: 600;
}

.glass-chip em {
    font-style: normal;
    font-weight: 400;
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    opacity: 0.75;
}

.glass-chip--sueldo {
    background: #ecfdf5;
    color: #047857;
}

.glass-cargo-card .btn-postularme {
    font-size: 0.75rem !important;
    padding: 0.35rem 0.6rem !important;
    margin-top: 0.2rem;
}

/* Documentos: como en las tarjetas (Oswald mayúsculas, azul) */
.glass-doc-grid,
.show-layout .glass-doc-grid {
    grid-template-columns: repeat(auto-fill, minmax(215px, 1fr));
    gap: 0.5rem;
}

.glass-doc-link,
.show-layout .glass-doc-link {
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 0.5rem;
    padding: 0.4rem 0.6rem;
    min-height: 40px;
}

.glass-doc-link:hover,
.show-layout .glass-doc-link:hover {
    background: #eef2ff;
    border-color: #c7d2fe;
}

.glass-doc-link .documento-icon,
.show-layout .glass-doc-link .documento-icon {
    width: 22px;
    height: 22px;
}

.glass-doc-link .documento-titulo,
.show-layout .glass-doc-link .documento-titulo {
    font-size: 0.72rem !important;
    font-weight: 600;
    color: #1e40af;
    text-transform: uppercase;
    line-height: 1.2;
    letter-spacing: 0.01em;
}

.show-layout .glass-doc-link.is-seleccionado {
    background: #eef2ff;
    border-color: #4f46e5;
    box-shadow: inset 3px 0 0 #4f46e5;
}

.glass-doc-link.documento-importante {
    background: #fffdf0;
}

.glass-doc-link.documento-importante .documento-titulo {
    color: #b8860b;
}

/* Cronograma */
.glass-step-label,
.show-layout .glass-step-label {
    font-size: 0.8rem;
    font-weight: 600;
    color: #1e293b;
    letter-spacing: 0.03em;
}

.glass-step-dates,
.show-layout .glass-step-dates {
    font-size: 0.75rem;
    font-weight: 300;
    color: #475569;
}

.glass-step-tag {
    font-size: 0.66rem;
    letter-spacing: 0.03em;
}

.show-layout .glass-step {
    padding: 0.5rem 0;
}

.show-layout .glass-step.is-active {
    padding: 0.5rem 0.5rem;
}

/* Pie */
.glass-footer .btn-base,
.glass-btn-volver {
    font-size: 0.78rem !important;
    letter-spacing: 0.03em;
}

/* Visor */
.show-visor {
    border: 1px solid #10dbd1;
    box-shadow: 0 0.3rem 1.2rem rgba(16, 219, 209, 0.14), 0 0.2rem 0.6rem rgba(0, 0, 0, 0.06);
}

.show-visor-header {
    background: linear-gradient(135deg, #ecfeff 0%, #eff6ff 60%, #ffffff 100%);
    border-top: 0;
    border-bottom: 1px solid #c7f3ef;
    border-left: 4px solid #10dbd1;
}

.show-visor-titulo {
    font-size: 0.82rem;
    font-weight: 600;
    color: #0b3d91;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.show-visor-btn {
    font-size: 0.7rem;
    color: #1d4ed8;
    border-color: #bfdbfe;
}

.show-visor-btn:hover {
    background: #eff6ff;
    color: #0b3d91;
    border-color: #60a5fa;
}

.show-visor-vacio {
    font-size: 0.85rem;
    font-weight: 300;
    background: repeating-linear-gradient(45deg, #f9fafb, #f9fafb 12px, #f3f4f6 12px, #f3f4f6 24px);
}

/* =========================================================================
   Ajuste sobrio: misma paleta (azul #0b3d91 + cian de acento) usada con
   moderación. Listas compactas para cargos y documentos, sin cajas de
   colores compitiendo entre sí.
   ========================================================================= */
.glass-card,
.show-layout .glass-card {
    border: 1px solid #e2e8f0;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .05), 0 8px 24px rgba(15, 23, 42, .06);
}

.show-visor {
    border: 1px solid #e2e8f0;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .05), 0 8px 24px rgba(15, 23, 42, .06);
}

/* Cabecera */
.show-layout .glass-header,
.show-visor-header {
    background: #fff;
    border-left: 0;
    border-top: 2px solid #10dbd1;
    border-bottom: 1px solid #eef2f7;
}

.show-layout .glass-header {
    padding: 0.9rem 1.4rem;
    margin-bottom: 0.9rem;
}

.glass-card .glass-titulo {
    font-size: 0.95rem;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.glass-card .glass-estado {
    font-size: 0.62rem !important;
    padding: 0.2rem 0.6rem !important;
}

.glass-card .glass-copy-btn--header {
    font-size: 0.68rem;
    padding: 0.3rem 0.65rem;
    background: #fff;
    color: #475569;
    border: 1px solid #e2e8f0;
}

.glass-card .glass-copy-btn--header:hover {
    color: #0b3d91;
    border-color: #93c5fd;
    background: #f8fafc;
}

/* Descripción y metadatos: texto limpio, sin cajas */
.glass-card .glass-descripcion {
    font-size: 0.78rem;
    line-height: 1.55;
    color: #475569;
    margin-bottom: 0.7rem;
}

.glass-card .glass-meta {
    gap: 0.25rem 1.25rem;
    margin-bottom: 1.1rem;
    padding-bottom: 0.9rem;
    border-bottom: 1px solid #eef2f7;
    font-size: 0.74rem;
}

.glass-card .glass-meta-item {
    background: none;
    border: 0;
    padding: 0;
    gap: 0.35rem;
    color: #1e293b;
}

.glass-card .glass-meta-item strong {
    color: #94a3b8;
    font-size: 0.62rem;
    font-weight: 500;
    letter-spacing: 0.08em;
}

.glass-card .glass-pill {
    background: #eff6ff;
    color: #1d4ed8;
    border: 0;
    font-size: 0.66rem;
    padding: 0.18rem 0.55rem;
    border-radius: 999px;
}

/* Secciones */
.glass-card .glass-section {
    margin-bottom: 1.1rem;
}

.glass-card .glass-section-title {
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    color: #0b3d91;
    margin-bottom: 0.45rem;
}

.glass-card .glass-section-title::before {
    width: 3px;
    height: 0.9em;
    background: #10dbd1;
}

.glass-card .glass-section-title::after {
    background: #eef2f7;
}

.glass-card .glass-section-title .glass-section-link {
    font-size: 0.62rem;
    padding: 0.15rem 0.5rem;
    color: #475569;
    border-color: #e2e8f0;
}

.glass-card .glass-section-title .glass-section-link:hover {
    background: #f8fafc;
    color: #0b3d91;
    border-color: #93c5fd;
}

/* Cargos: filas compactas (nombre | plazas | sueldo | aplicar) */
.glass-card .glass-cargos-grid {
    display: flex;
    flex-direction: column;
    gap: 0;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    overflow: hidden;
}

.glass-card .glass-cargo-card {
    flex-direction: row;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.4rem 0.9rem;
    background: #fff;
    border: 0;
    border-bottom: 1px solid #eef2f7;
    border-radius: 0;
    padding: 0.5rem 0.75rem;
    transform: none;
    box-shadow: none;
}

.glass-card .glass-cargo-card:last-child {
    border-bottom: 0;
}

.glass-card .glass-cargo-card:hover {
    background: #f8fafc;
    transform: none;
    box-shadow: none;
}

.glass-card .glass-cargo-nombre {
    flex: 1 1 200px;
    font-size: 0.76rem;
    font-weight: 500;
    color: #0b3d91;
    text-transform: none;
    letter-spacing: 0.01em;
    line-height: 1.25;
}

.glass-card .glass-cargo-datos {
    display: flex;
    gap: 0.9rem;
}

.glass-card .glass-chip,
.glass-card .glass-chip--sueldo {
    background: none;
    padding: 0;
    color: #0f172a;
    font-size: 0.74rem;
    font-weight: 500;
    gap: 0.3rem;
}

.glass-card .glass-chip em {
    font-size: 0.58rem;
    letter-spacing: 0.08em;
    color: #94a3b8;
    opacity: 1;
}

.glass-card .glass-cargo-card .btn-postularme {
    width: auto;
    margin: 0;
    font-size: 0.68rem !important;
    padding: 0.2rem 0.75rem !important;
    border-width: 1px;
    border-radius: 6px;
}

/* Documentos: lista compacta de una columna */
.glass-card .glass-doc-grid {
    display: flex;
    flex-direction: column;
    gap: 0;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    overflow: hidden;
}

.glass-card .glass-doc-link {
    background: #fff;
    border: 0;
    border-bottom: 1px solid #eef2f7;
    border-radius: 0;
    padding: 0.35rem 0.75rem;
    min-height: 32px;
    gap: 0.6rem;
    transform: none;
    box-shadow: none;
}

.glass-card .glass-doc-link:last-child {
    border-bottom: 0;
}

.glass-card .glass-doc-link:hover {
    background: #f8fafc;
    transform: none;
    box-shadow: none;
}

.glass-card .glass-doc-link .documento-icon {
    width: 18px;
    height: 18px;
}

.glass-card .glass-doc-link .documento-titulo {
    font-size: 0.74rem !important;
    font-weight: 400;
    text-transform: none;
    color: #1e293b;
    letter-spacing: 0.01em;
    -webkit-line-clamp: 1;
}

.glass-card .glass-doc-link:hover .documento-titulo {
    color: #0b3d91;
}

/* Importante: sin caja dorada ni estrella; solo una marca sutil */
.glass-card .glass-doc-link.documento-importante {
    border: 0 !important;
    border-bottom: 1px solid #eef2f7 !important;
    background: #fff !important;
    box-shadow: inset 2px 0 0 #f59e0b;
}

.glass-card .glass-doc-link.documento-importante::before {
    content: none;
}

.glass-card .glass-doc-link.documento-importante:hover {
    background: #f8fafc !important;
}

.glass-card .glass-doc-link.documento-importante .documento-titulo {
    color: #1e293b;
    font-weight: 500;
}

.glass-card .glass-doc-link.documento-importante:last-child {
    border-bottom: 0 !important;
}

.show-layout .glass-doc-link.is-seleccionado,
.glass-card .glass-doc-link.is-seleccionado {
    background: #eff6ff !important;
    box-shadow: inset 3px 0 0 #2563eb;
}

.glass-card .glass-doc-link.is-seleccionado .documento-titulo {
    color: #0b3d91;
    font-weight: 500;
}

/* Cronograma */
.glass-card .glass-step {
    padding: 0.3rem 0;
}

.glass-card .glass-step.is-active {
    padding: 0.35rem 0.5rem;
    background: linear-gradient(90deg, rgba(239, 68, 68, .06), transparent 80%);
}

.glass-card .glass-step-label {
    font-size: 0.72rem;
    letter-spacing: 0.04em;
}

.glass-card .glass-step-dates {
    font-size: 0.68rem;
}

.glass-card .glass-step-tag {
    font-size: 0.58rem;
    padding: 0.1rem 0.45rem;
}

/* Pie */
.glass-card .glass-footer {
    margin-top: 0.9rem;
    padding-top: 0.75rem;
}

.glass-card .glass-footer .btn-base {
    font-size: 0.7rem !important;
    padding: 0.3rem 0.8rem !important;
}

/* Visor */
.show-visor-titulo {
    font-size: 0.75rem;
    letter-spacing: 0.03em;
}

.show-visor-vacio {
    font-size: 0.78rem;
}

@media (max-width: 640px) {
    .glass-card .glass-cargo-card {
        padding: 0.5rem;
    }
}

/* Fecha de subida, estrella de importantes y "Ver más" de cargos */
.glass-card .glass-cargo-card[hidden] {
    display: none;
}

.glass-card .glass-ver-mas {
    display: block;
    margin: 0.4rem auto 0;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 999px;
    padding: 0.2rem 0.9rem;
    font-size: 0.66rem;
    font-weight: 500;
    letter-spacing: 0.03em;
    color: #0b3d91;
    cursor: pointer;
    transition: all 0.2s ease;
}

.glass-card .glass-ver-mas:hover {
    background: #eff6ff;
    border-color: #93c5fd;
}

.glass-card .glass-doc-fecha {
    flex-shrink: 0;
    font-size: 0.62rem;
    font-weight: 400;
    color: #94a3b8;
    letter-spacing: 0.02em;
    white-space: nowrap;
}

.glass-card .glass-doc-star {
    flex-shrink: 0;
    color: #e0a800;
    font-size: 0.8rem;
    line-height: 1;
}

/* Importantes: dorado claro */
.glass-card .glass-doc-link.documento-importante {
    background: #fffbea !important;
    border-bottom: 1px solid #fdeeb0 !important;
    box-shadow: inset 3px 0 0 #f5c542;
}

.glass-card .glass-doc-link.documento-importante:hover {
    background: #fff5cc !important;
}

.glass-card .glass-doc-link.documento-importante .documento-titulo {
    color: #7a5b00;
    font-weight: 500;
}

.glass-card .glass-doc-link.documento-importante .glass-doc-fecha {
    color: #b39a4a;
}

/* Numeración de documentos */
.glass-card .glass-doc-num {
    flex-shrink: 0;
    min-width: 1.35rem;
    height: 1.35rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #eff6ff;
    color: #1d4ed8;
    font-size: 0.62rem;
    font-weight: 600;
    line-height: 1;
}

.glass-card .glass-doc-num--anexo {
    background: #f1f5f9;
    color: #64748b;
    font-size: 0.75rem;
}

.glass-card .glass-doc-link.documento-importante .glass-doc-num {
    background: #fdeeb0;
    color: #7a5b00;
}

/* =================== Estado de la convocatoria (badge visual) =================== */
.glass-card .glass-estado {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    flex-shrink: 0;
    margin-top: 0;
    padding: 0.32rem 0.8rem 0.32rem 0.6rem !important;
    border-radius: 999px;
    font-size: 0.72rem !important;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    white-space: nowrap;
    border: 1px solid transparent;
    position: relative;
    background: #f1f5f9;
    color: #475569;
}

.glass-card .glass-estado svg {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
}

.glass-card .glass-estado--borrador {
    background: #f1f5f9;
    color: #475569;
    border-color: #cbd5e1;
    border-style: dashed;
}

.glass-card .glass-estado--publicada {
    background: #ecfdf5;
    color: #047857;
    border-color: #6ee7b7;
    animation: glass-estado-glow-verde 2s ease-in-out infinite;
}

.glass-card .glass-estado--en_proceso {
    background: #fffbeb;
    color: #b45309;
    border-color: #fcd34d;
    animation: glass-estado-glow-ambar 2s ease-in-out infinite;
}

.glass-card .glass-estado--en_proceso svg {
    animation: glass-estado-giro 6s linear infinite;
}

.glass-card .glass-estado--finalizada {
    background: #f1f5f9;
    color: #334155;
    border-color: #94a3b8;
}

.glass-card .glass-estado--anulada {
    background: #fef2f2;
    color: #b91c1c;
    border-color: #fca5a5;
}

.glass-card .glass-estado--anulada svg {
    stroke-width: 2.8;
}

@keyframes glass-estado-glow-verde {
    0%, 100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.35); }
    50% { box-shadow: 0 0 0 5px rgba(16, 185, 129, 0); }
}

@keyframes glass-estado-glow-ambar {
    0%, 100% { box-shadow: 0 0 0 0 rgba(245, 158, 11, 0.4); }
    50% { box-shadow: 0 0 0 5px rgba(245, 158, 11, 0); }
}

@keyframes glass-estado-giro {
    to { transform: rotate(360deg); }
}

@media (max-width: 640px) {
    .glass-card .glass-titulo-row {
        flex-wrap: wrap;
    }
}

@media (prefers-reduced-motion: reduce) {
    .glass-card .glass-estado,
    .glass-card .glass-estado svg {
        animation: none;
    }
}

/* Finalizada = rojo, Anulada = negro (cancelada) */
.glass-card .glass-estado--finalizada {
    background: #fef2f2;
    color: #b91c1c;
    border-color: #f87171;
}

.glass-card .glass-estado--anulada {
    background: #111827;
    color: #f9fafb;
    border-color: #111827;
}

/* Destello (brillo que cruza la insignia), como en las tarjetas del listado */
.glass-card .glass-estado {
    overflow: hidden;
}

.glass-card .glass-estado::after {
    content: "";
    position: absolute;
    top: 0;
    left: -150%;
    width: 50%;
    height: 100%;
    background: linear-gradient(120deg, transparent 0%, rgba(255, 255, 255, 0.6) 50%, transparent 100%);
    animation: glass-estado-shine 2.2s infinite linear;
    pointer-events: none;
}

/* En fondos oscuros (anulada) el brillo es más tenue */
.glass-card .glass-estado--anulada::after {
    background: linear-gradient(120deg, transparent 0%, rgba(255, 255, 255, 0.28) 50%, transparent 100%);
}

@keyframes glass-estado-shine {
    0% { left: -150%; }
    100% { left: 150%; }
}

@media (prefers-reduced-motion: reduce) {
    .glass-card .glass-estado::after {
        animation: none;
        display: none;
    }
}

/* Celular: el estado al costado del título le quitaba mucho ancho y el nombre quedaba en una
   columna angosta. Pasa arriba del título como una insignia pequeña y el nombre usa toda la fila. */
@media (max-width: 640px) {
    .glass-header .glass-titulo-row {
        flex-wrap: wrap;
        row-gap: 0.35rem;
    }

    .glass-header .glass-titulo {
        flex: 1 1 100%;
        /* Justificado sin guiones y con la última línea a la izquierda */
        text-align: justify;
        text-justify: inter-word;
        text-align-last: left;
        hyphens: none;
        -webkit-hyphens: none;
    }

    .glass-header .glass-estado {
        order: -1;
        gap: 0.25rem;
        margin-top: 0;
        padding: 0.15rem 0.5rem 0.15rem 0.4rem !important;
        font-size: 0.56rem !important;
        letter-spacing: 0.04em;
    }

    .glass-header .glass-estado svg {
        width: 11px;
        height: 11px;
    }
}

/* "Ver formulario": la postulación aún no abre. Discreto, para no competir con "Aplicar" */
a.btn-postularme.is-previa,
a.btn-postular-mini.is-previa {
    color: #475569 !important;
    background: transparent !important;
    border: 1px dashed #94a3b8 !important;
    box-shadow: none !important;
    font-weight: 500 !important;
}
a.btn-postularme.is-previa::after { content: none !important; }
a.btn-postularme.is-previa:hover,
a.btn-postular-mini.is-previa:hover {
    color: #1e40af !important;
    background: #eff6ff !important;
    border-color: #93c5fd !important;
}
.btn-postular-table.is-previa { opacity: .75; }
.btn-postular-table.is-previa:hover { opacity: 1; }