/* public/css/resultados_publicos.css - Registro público de resultados (index, show, verificar) */

[hidden] { display: none !important; }

.rp,
.rp * {
    font-family: 'Oswald', sans-serif;
    box-sizing: border-box;
}

.rp {
    max-width: 1040px;
    margin: 0 auto;
    padding: 1.25rem .9rem 3rem;
    font-size: 12.5px;
    font-weight: 400;
    color: #334155;
    letter-spacing: .01em;
}

.rp .ico { flex: none; }
.rp-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; }

/* ===== CABECERA ===== */
.rp-hero {
    display: flex;
    align-items: center;
    gap: .9rem;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    color: #fff;
    background: linear-gradient(135deg, #1e3a8a, #2563eb);
    border-radius: 14px;
    box-shadow: 0 6px 18px rgba(37, 99, 235, .2);
}

.rp-hero-ico { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: rgba(255, 255, 255, .16); flex: none; }
.rp-hero-txt { flex: 1; min-width: 0; }
.rp-hero small { display: block; font-size: .62rem; text-transform: uppercase; letter-spacing: .14em; opacity: .8; }
.rp-hero h1 { margin: .1rem 0; font-size: 1.2rem; font-weight: 600; line-height: 1.2; letter-spacing: .02em; }
.rp-hero p { margin: 0; font-size: .76rem; font-weight: 300; opacity: .9; }

/* ===== BOTONES Y CHIPS ===== */
.rp-acciones { display: flex; gap: .45rem; flex-wrap: wrap; margin-bottom: .9rem; }

.rp-btn {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .42rem .9rem;
    border: 1px solid #dbe3ec;
    border-radius: 8px;
    background: #fff;
    color: #475569;
    font-size: .7rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: .06em;
    text-decoration: none;
    cursor: pointer;
    transition: background-color .15s, border-color .15s, color .15s;
}
.rp-btn:hover { background: #f1f5f9; color: #1e293b; }
.rp-btn-azul { background: #2563eb; border-color: #2563eb; color: #fff; }
.rp-btn-azul:hover { background: #1d4ed8; color: #fff; }

.rp-chips { display: flex; gap: .35rem; flex-wrap: wrap; align-items: center; }
.rp-chip { display: inline-flex; align-items: center; gap: .3rem; padding: .08rem .6rem; border-radius: 999px; background: #f1f5f9; color: #64748b; font-size: .66rem; }
.rp-chip-desierto { background: #fef3c7; color: #92400e; font-weight: 500; }
.rp-hero .rp-chip { background: rgba(255, 255, 255, .18); color: #fff; }

/* ===== FILTROS ===== */
.rp-filtros { display: flex; gap: .5rem; flex-wrap: wrap; align-items: center; margin-bottom: .9rem; padding: .6rem .75rem; background: #fff; border: 1px solid #e8edf3; border-radius: 12px; }
.rp-buscar { position: relative; flex: 1 1 200px; }
.rp-buscar .ico { position: absolute; left: .6rem; top: 50%; transform: translateY(-50%); color: #94a3b8; }
.rp-buscar input { width: 100%; padding: .4rem .6rem .4rem 2rem; border: 1px solid #dbe3ec; border-radius: 8px; font-size: .78rem; background: #fff; }
.rp-filtros select { padding: .4rem .6rem; border: 1px solid #dbe3ec; border-radius: 8px; font-size: .78rem; background: #fff; max-width: 240px; }
.rp input:focus, .rp select:focus { outline: none; border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37, 99, 235, .12); }
.rp-pills { display: flex; gap: .3rem; flex-wrap: wrap; flex: 1 1 100%; }
.rp-pill { padding: .2rem .7rem; border: 1px solid #dbe3ec; border-radius: 999px; background: #fff; font-size: .68rem; color: #64748b; cursor: pointer; transition: all .15s; }
.rp-pill:hover { border-color: #93c5fd; }
.rp-pill.on { background: #2563eb; border-color: #2563eb; color: #fff; }

/* ===== TARJETAS ===== */
.rp-card { background: #fff; border: 1px solid #e8edf3; border-radius: 14px; padding: .9rem 1rem; margin-bottom: .9rem; box-shadow: 0 2px 8px rgba(15, 23, 42, .03); }
.rp-card-h { display: flex; justify-content: space-between; align-items: flex-start; gap: .75rem; flex-wrap: wrap; margin-bottom: .55rem; }
.rp-card h2 { margin: 0 0 .3rem; font-size: .9rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: #0f172a; }
.rp-desierto { display: flex; gap: .5rem; align-items: flex-start; padding: .45rem .7rem; margin: .4rem 0; background: #fffbeb; border: 1px solid #fde68a; border-radius: 10px; color: #92400e; font-size: .74rem; font-weight: 300; }

/* ===== LISTA DE CONVOCATORIAS ===== */
.rp-item { display: flex; align-items: center; gap: .85rem; padding: .8rem 1rem; margin-bottom: .55rem; background: #fff; border: 1px solid #e8edf3; border-radius: 12px; text-decoration: none; color: inherit; transition: border-color .15s, box-shadow .15s; }
.rp-item:hover { border-color: #93c5fd; box-shadow: 0 4px 14px rgba(37, 99, 235, .08); }
.rp-item-ico { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; background: #eff6ff; color: #2563eb; flex: none; }
.rp-item-txt { flex: 1; min-width: 0; }
.rp-item h2 { margin: 0; font-size: .86rem; font-weight: 500; color: #0f172a; text-transform: none; letter-spacing: .01em; line-height: 1.3; }
.rp-item small { display: block; margin-top: .15rem; font-size: .68rem; color: #94a3b8; font-weight: 300; }
.rp-item .rp-chips { margin-top: .3rem; }
.rp-item-go { color: #94a3b8; flex: none; }
.rp-item:hover .rp-item-go { color: #2563eb; }

.rp-vacio { padding: 2rem 1rem; text-align: center; color: #94a3b8; font-size: .8rem; font-weight: 300; }
.rp-vacio .ico { display: block; margin: 0 auto .5rem; color: #cbd5e1; }

.rp-pager { display: flex; justify-content: space-between; align-items: center; gap: .5rem; margin-top: .9rem; font-size: .72rem; color: #94a3b8; }
.rp-pager .rp-btn[aria-disabled="true"] { opacity: .4; pointer-events: none; }

/* ===== TABLA ===== */
.rp-scroll { overflow-x: auto; }
table.rp-t { width: 100%; border-collapse: collapse; min-width: 520px; }
.rp-t th { text-align: left; font-size: .62rem; text-transform: uppercase; letter-spacing: .07em; color: #94a3b8; font-weight: 500; padding: .45rem .5rem; border-bottom: 2px solid #eef2f6; white-space: nowrap; }
.rp-t td { padding: .5rem; border-bottom: 1px solid #f3f4f6; vertical-align: middle; }
.rp-n { text-align: right !important; font-variant-numeric: tabular-nums; white-space: nowrap; }
.rp-pos { width: 48px; font-size: 1rem; font-weight: 600; color: #0f172a; }
.rp-nom { font-weight: 500; color: #1e293b; }
.rp-doc-m { display: none; font-size: .68rem; color: #94a3b8; font-weight: 300; }
.rp-nota { display: block; margin-top: .1rem; font-size: .64rem; color: #b45309; font-weight: 300; }
.rp-tot { font-weight: 600; color: #0f172a; }
.rp-t tbody tr.rp-fila:hover td { background: #fafcff; }

.rp-b { display: inline-block; padding: .1rem .6rem; border-radius: 999px; font-size: .6rem; font-weight: 500; text-transform: uppercase; letter-spacing: .06em; white-space: nowrap; }
.rp-b.GANADOR { background: #d1fae5; color: #065f46; }
.rp-b.ACCESITARIO { background: #dbeafe; color: #1e40af; }
.rp-b.APTO { background: #f1f5f9; color: #475569; }
.rp-b.NO-APTO { background: #fee2e2; color: #991b1b; }
.rp-b.NO-EVALUADO { background: #fef3c7; color: #92400e; }
.rp-b.DESCALIFICADO { background: #e5e7eb; color: #374151; }

.rp-toggle { display: none; place-items: center; width: 26px; height: 26px; padding: 0; background: #fff; border: 1px solid #dbe3ec; border-radius: 7px; color: #64748b; cursor: pointer; }
.rp-toggle svg { transition: transform .2s; }
.rp-toggle.abierto svg { transform: rotate(180deg); }

.rp-detalle td { background: #f8fafc; padding: .55rem .6rem; }
.rp-detalle ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .25rem; }
.rp-detalle li { display: flex; justify-content: space-between; gap: .5rem; font-size: .74rem; }
.rp-detalle b { font-weight: 600; }

/* ===== CÓDIGO DE VERIFICACIÓN ===== */
.rp-verif { display: flex; align-items: center; gap: .7rem; flex-wrap: wrap; padding: .7rem .9rem; margin-bottom: .9rem; background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: 12px; }
.rp-verif-ico { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: #d1fae5; color: #047857; flex: none; }
.rp-verif-txt { flex: 1; min-width: 200px; font-size: .74rem; color: #166534; font-weight: 300; }
.rp-verif-txt strong { display: block; font-size: .8rem; font-weight: 600; letter-spacing: .05em; color: #14532d; }
.rp-aviso { display: flex; gap: .5rem; align-items: flex-start; font-size: .68rem; color: #94a3b8; font-weight: 300; text-align: justify; margin-top: .6rem; }

/* ===== VERIFICACIÓN DE LA CONSTANCIA ===== */
.rp-ver { max-width: 520px; }
.rp-ver.rp-ver--dos { max-width: 1180px; }

/* Con constancia válida: estado a la izquierda y visor a la derecha */
.rp-ver-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; align-items: start; }
.rp-ver--dos .rp-ver-grid { grid-template-columns: 320px minmax(0, 1fr); }

.rp-ver-lado { position: sticky; top: .75rem; }
.rp-ver:not(.rp-ver--dos) .rp-ver-lado { position: static; }

.rp-ver-card { padding: 1.2rem 1.1rem; text-align: center; background: #fff; border: 1px solid #e8edf3; border-radius: 16px; box-shadow: 0 4px 16px rgba(15, 23, 42, .06); }
.rp-ver-ico { display: grid; place-items: center; width: 52px; height: 52px; margin: 0 auto .7rem; border-radius: 50%; }
.rp-ver-ico.ok { background: #d1fae5; color: #047857; }
.rp-ver-ico.no { background: #fee2e2; color: #b91c1c; }
.rp-ver h1 { margin: 0 0 .3rem; font-size: 1.1rem; font-weight: 600; color: #0f172a; letter-spacing: .02em; }
.rp-ver-card > p { margin: 0; font-size: .78rem; font-weight: 300; color: #64748b; line-height: 1.5; }
.rp-ver dl { margin: 1rem 0 0; text-align: left; display: grid; gap: .5rem; }
.rp-ver dl > div { padding: .45rem .7rem; background: #f8fafc; border-radius: 8px; min-width: 0; }
.rp-ver dt { font-size: .58rem; text-transform: uppercase; letter-spacing: .1em; color: #94a3b8; }
.rp-ver dd { margin: .05rem 0 0; font-size: .8rem; word-break: break-word; }
.rp-ver-acciones { display: grid; gap: .45rem; margin-top: 1rem; }
.rp-ver-acciones .rp-btn { justify-content: center; }

/* Visor */
.rp-visor { min-width: 0; padding: .9rem 1rem 1rem; background: #fff; border: 1px solid #e8edf3; border-radius: 16px; box-shadow: 0 2px 8px rgba(15, 23, 42, .03); }
.rp-visor-h { display: flex; justify-content: space-between; align-items: flex-start; gap: .75rem; flex-wrap: wrap; margin-bottom: .7rem; }
.rp-visor-h > div:first-child { flex: 1 1 260px; min-width: 0; }
.rp-visor h2 { margin: 0 0 .25rem; font-size: .9rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: #0f172a; }
.rp-visor-h p { margin: 0; font-size: .74rem; font-weight: 300; color: #64748b; line-height: 1.5; }
.rp-visor-acc { display: flex; gap: .4rem; flex-wrap: wrap; }
.rp-visor-marco { display: block; width: 100%; height: calc(100vh - 190px); min-height: 560px; border: 1px solid #cbd5e1; border-radius: 8px; background: #f1f5f9; }

/* Ayuda bajo el visor en pantallas pequeñas: algunos teléfonos no muestran el PDF incrustado */
.rp-visor-movil { display: none; align-items: center; justify-content: space-between; gap: .6rem; flex-wrap: wrap; margin-top: .6rem; padding: .5rem .7rem; background: #f8fafc; border: 1px solid #e8edf3; border-radius: 10px; }
.rp-visor-movil p { margin: 0; flex: 1 1 200px; font-size: .68rem; font-weight: 300; color: #64748b; }

/* Tableta: una columna, el estado en dos columnas para no quedar largo y estrecho */
@media (max-width: 960px) {
    .rp-ver--dos .rp-ver-grid { grid-template-columns: minmax(0, 1fr); }
    .rp-ver-lado { position: static; }
    .rp-ver--dos .rp-ver-card { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 1rem; text-align: left; align-items: start; }
    .rp-ver--dos .rp-ver-card > .rp-ver-ico { grid-column: 1; margin: 0 0 .5rem; }
    .rp-ver--dos .rp-ver-card > h1, .rp-ver--dos .rp-ver-card > p { grid-column: 1; }
    .rp-ver--dos .rp-ver-card > dl { grid-column: 2; grid-row: 1 / span 3; margin-top: 0; }
    .rp-ver--dos .rp-ver-card > .rp-ver-acciones { grid-column: 1 / -1; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }
    .rp-visor-marco { height: 70vh; min-height: 460px; }
    .rp-visor-movil { display: flex; }
}

/* Teléfono */
@media (max-width: 560px) {
    .rp-ver--dos .rp-ver-card { display: block; text-align: center; }
    .rp-ver--dos .rp-ver-card > dl { margin-top: 1rem; }
    .rp-ver-card { padding: 1rem .85rem; }
    .rp-visor { padding: .75rem .65rem .85rem; border-radius: 14px; }
    .rp-visor-acc { width: 100%; }
    .rp-visor-acc .rp-btn { flex: 1 1 100%; justify-content: center; }
    .rp-visor-marco { height: 68vh; min-height: 420px; }
    .rp-visor-movil .rp-btn { flex: 1 1 100%; justify-content: center; }
}


/* ===== PANTALLAS PEQUEÑAS ===== */
@media (max-width: 720px) {
    .rp { padding: .75rem .5rem 2.5rem; font-size: 12px; }
    .rp-hero { padding: .8rem .9rem; gap: .7rem; border-radius: 12px; }
    .rp-hero-ico { width: 36px; height: 36px; }
    .rp-hero h1 { font-size: 1.05rem; }

    .rp-acciones .rp-btn { flex: 1 1 auto; justify-content: center; }
    .rp-filtros { padding: .5rem; }
    .rp-filtros select { max-width: none; flex: 1; }
    .rp-pills { flex-wrap: nowrap; overflow-x: auto; margin: 0 -.5rem; padding: 0 .5rem; scrollbar-width: none; }
    .rp-pills::-webkit-scrollbar { display: none; }
    .rp-pill { flex: 0 0 auto; }

    .rp-card { padding: .7rem .75rem; border-radius: 12px; }

    /* Tabla compacta: puesto, postulante, total y condición; el resto en el detalle */
    table.rp-t { min-width: 0; }
    .rp-c-doc, .rp-c-fase { display: none; }
    .rp-doc-m { display: block; }
    .rp-pos { width: 30px; font-size: .9rem; }
    .rp-t th, .rp-t td { padding: .4rem .3rem; }
    .rp-toggle { display: inline-grid; }
    .rp-c-tog { width: 30px; text-align: right; }

    .rp-item { padding: .7rem .75rem; }
}

@media (min-width: 721px) {
    .rp-detalle { display: none !important; }
}

@media (pointer: coarse) and (max-width: 720px) {
    .rp-buscar input, .rp-filtros select { font-size: 16px; }
}
