/* ============================================================
   FVDI Federados — Formulario público (admin.fvdi.eus/federarse)
   ============================================================ */

:root {
    --fvdi-navy:        #1B3A6B;
    --fvdi-navy-dark:   #122952;
    --fvdi-blue:        #3B7DBF;
    --fvdi-orange:      #F5A623;
    --fvdi-orange-dark: #d98e0f;
    --pub-fondo:        #f1f4f8;
    --pub-texto:        #2d3748;
}

body {
    font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
    background: var(--pub-fondo);
    color: var(--pub-texto);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

a { color: var(--fvdi-blue); }

/* ── Cabecera ─────────────────────────────────────────────── */

.pub-header {
    background: var(--fvdi-navy);
    color: #fff;
}
.pub-header-inner {
    display: flex;
    align-items: center;
    min-height: 72px;
}
.pub-brand {
    display: flex;
    align-items: center;
    gap: .75rem;
    color: #fff;
    text-decoration: none;
}
.pub-brand img {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #fff;
    object-fit: cover;
}
.pub-brand strong { display: block; font-size: 1rem; line-height: 1.2; }
.pub-brand small  { display: block; font-size: .78rem; opacity: .75; }
.pub-brand:hover  { color: #fff; }
.pub-header-inner { justify-content: space-between; gap: 1rem; }

/* Selector de idioma */
.pub-idiomas {
    display: flex;
    flex: none;
    border: 1px solid rgba(255, 255, 255, .35);
    border-radius: 999px;
    overflow: hidden;
    font-size: .85rem;
}
.pub-idiomas a,
.pub-idiomas span {
    padding: .3rem .8rem;
    color: #fff;
    text-decoration: none;
}
.pub-idiomas a:hover,
.pub-idiomas a:focus { background: rgba(255, 255, 255, .15); }
.pub-idiomas .activo { background: #fff; color: var(--fvdi-navy); font-weight: 600; }

/* ── Contenido ────────────────────────────────────────────── */

.pub-main {
    flex: 1;
    padding: 2rem 0 3rem;
}
.pub-main > .container { max-width: 860px; }

.pub-hero {
    background: linear-gradient(135deg, var(--fvdi-navy) 0%, var(--fvdi-blue) 100%);
    color: #fff;
    border-radius: 12px;
    padding: 2.5rem 2rem;
    margin-bottom: 1.5rem;
}
.pub-hero h1 { font-size: 1.9rem; font-weight: 700; margin-bottom: .5rem; }
.pub-hero p  { font-size: 1.1rem; opacity: .9; margin-bottom: 1.5rem; }

.pub-card {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .06);
    padding: 1.75rem;
    margin-bottom: 1.5rem;
}
.pub-h2 {
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--fvdi-navy);
    margin-bottom: 1.25rem;
}
.pub-icono-grande { font-size: 3rem; color: var(--fvdi-blue); }

.btn-pub-accion {
    background: var(--fvdi-orange);
    border-color: var(--fvdi-orange);
    color: #1a1a1a;
    font-weight: 600;
}
.btn-pub-accion:hover,
.btn-pub-accion:focus {
    background: var(--fvdi-orange-dark);
    border-color: var(--fvdi-orange-dark);
    color: #1a1a1a;
}

/* Pasos de «Cómo funciona» */
.pub-pasos {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 1.25rem;
}
.pub-pasos li { display: flex; gap: .75rem; }
.pub-pasos p  { margin: .2rem 0 0; font-size: .9rem; color: #5a6778; }
.pub-paso-num {
    flex: none;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--fvdi-blue);
    color: #fff;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pub-tabla th {
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .03em;
    color: #718096;
    font-weight: 600;
}
.pub-badge {
    background: #e8f0fa;
    color: var(--fvdi-navy);
    font-weight: 500;
    margin-top: .25rem;
    margin-right: .25rem;
}

/* ── Alta: indicador de pasos ─────────────────────────────── */

.pub-stepper {
    list-style: none;
    padding: 0;
    margin: 0 0 1.5rem;
    display: flex;
    gap: .5rem;
}
.pub-stepper li {
    flex: 1;
    display: flex;
    align-items: center;
    gap: .5rem;
    padding-bottom: .6rem;
    border-bottom: 3px solid #d5dde8;
    color: #8a96a8;
    font-size: .9rem;
    font-weight: 600;
}
.pub-stepper-num {
    flex: none;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #d5dde8;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .85rem;
}
.pub-stepper li.actual { color: var(--fvdi-navy); border-color: var(--fvdi-orange); }
.pub-stepper li.actual .pub-stepper-num { background: var(--fvdi-orange); color: #1a1a1a; }
.pub-stepper li.hecho { color: var(--fvdi-blue); border-color: var(--fvdi-blue); }
.pub-stepper li.hecho .pub-stepper-num { background: var(--fvdi-blue); }

/* ── Alta: formularios ────────────────────────────────────── */

.pub-fieldset {
    border-top: 1px solid #e2e8f0;
    padding-top: 1.25rem;
    margin-top: 1.5rem;
}
.pub-fieldset legend {
    font-size: 1rem;
    font-weight: 700;
    color: var(--fvdi-navy);
    margin-bottom: .75rem;
}
.pub-opcional { font-weight: 400; color: #8a96a8; font-size: .85em; }
.pub-subtitulo { font-weight: 600; color: var(--fvdi-navy); margin-top: .5rem; }
.form-control:focus,
.form-select:focus,
.form-check-input:focus {
    border-color: var(--fvdi-blue);
    box-shadow: 0 0 0 .2rem rgba(59, 125, 191, .2);
}
.form-check-input:checked { background-color: var(--fvdi-blue); border-color: var(--fvdi-blue); }

/* Opciones grandes tipo tarjeta (radio) */
.pub-opciones {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: .75rem;
}
.pub-opcion {
    display: flex;
    gap: .75rem;
    align-items: flex-start;
    border: 2px solid #d5dde8;
    border-radius: 10px;
    padding: .9rem 1rem;
    cursor: pointer;
    transition: border-color .15s, background .15s;
}
.pub-opcion input { margin-top: .3rem; accent-color: var(--fvdi-blue); }
.pub-opcion strong { display: block; }
.pub-opcion small  { display: block; color: #5a6778; }
.pub-opcion:hover  { border-color: var(--fvdi-blue); }
.pub-opcion:has(input:checked) { border-color: var(--fvdi-blue); background: #f0f6fc; }
.pub-opciones.is-invalid .pub-opcion { border-color: #dc3545; }

.pub-acciones {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    border-top: 1px solid #e2e8f0;
    margin-top: 2rem;
    padding-top: 1.5rem;
}

/* Botón por defecto del formulario (Intro), invisible */
.pub-oculto {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.pub-btn-secundario {
    color: var(--fvdi-blue);
    border-color: var(--fvdi-blue);
}
.pub-btn-secundario:hover,
.pub-btn-secundario:focus {
    background: var(--fvdi-blue);
    border-color: var(--fvdi-blue);
    color: #fff;
}

/* ── Alta: lista de personas que se federan ───────────────── */

.pub-lista {
    list-style: none;
    padding: 0;
    margin: 0;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
}
.pub-persona {
    display: grid;
    grid-template-columns: 1fr minmax(220px, 300px) auto;
    gap: .75rem 1rem;
    align-items: center;
    padding: .9rem 1rem;
}
.pub-persona + .pub-persona { border-top: 1px solid #e2e8f0; }
.pub-persona.con-error { background: #fff5f5; }
.pub-persona .pub-badge { margin-left: .35rem; }
.pub-persona-accion { text-align: right; min-width: 38px; }

.pub-total {
    display: flex;
    justify-content: flex-end;
    align-items: baseline;
    gap: 1rem;
    padding: 1rem 1rem 0;
    font-size: 1.1rem;
}
.pub-total strong { font-size: 1.35rem; color: var(--fvdi-navy); }

.pub-vacio {
    text-align: center;
    padding: 1.5rem 1rem;
    border: 2px dashed #d5dde8;
    border-radius: 10px;
    color: #5a6778;
}
.pub-vacio i { font-size: 2rem; color: var(--fvdi-blue); }

.pub-anadir {
    margin-top: 1.5rem;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #fafbfd;
}
.pub-anadir summary {
    padding: .9rem 1rem;
    font-weight: 600;
    color: var(--fvdi-blue);
    cursor: pointer;
}
.pub-anadir[open] summary { border-bottom: 1px solid #e2e8f0; }
.pub-anadir-cuerpo { padding: 1rem; }

/* ── Alta: resumen y alta registrada ──────────────────────── */

.pub-resumen-bloque {
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 1rem 1.1rem;
    margin-bottom: 1rem;
}
.pub-resumen-cabecera {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: .6rem;
}
.pub-resumen-cabecera h2 {
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .03em;
    color: #718096;
    font-weight: 600;
    margin: 0;
}
.pub-resumen-total td { font-weight: 700; font-size: 1.05rem; color: var(--fvdi-navy); border-bottom: 0; }

.pub-icono-ok { font-size: 3rem; color: #2f855a; }
.pub-icono-ko { font-size: 3rem; color: #c53030; }
.pub-opcion-accion { cursor: default; margin: 0; }
.pub-opcion-accion:hover { border-color: #d5dde8; }

.pub-datos-pago {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: .5rem 1.5rem;
    background: #f7fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 1rem 1.25rem;
}
.pub-datos-pago dt { font-weight: 400; color: #5a6778; }
.pub-datos-pago dd { margin: 0; font-weight: 700; word-break: break-word; }

/* ── Pie ──────────────────────────────────────────────────── */

.pub-footer {
    background: var(--fvdi-navy);
    color: rgba(255, 255, 255, .85);
    padding: 1.25rem 0;
    font-size: .88rem;
}
.pub-footer-inner {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: .5rem 1.5rem;
}
.pub-footer-enlaces { display: flex; flex-wrap: wrap; gap: .25rem 1.5rem; }
.pub-footer a { color: #fff; text-decoration: none; }
.pub-footer a:hover,
.pub-footer a:focus { text-decoration: underline; }

@media (max-width: 576px) {
    .pub-hero { padding: 1.75rem 1.25rem; }
    .pub-hero h1 { font-size: 1.5rem; }
    .pub-card { padding: 1.25rem; }
    .pub-brand small { display: none; }
    .pub-stepper-txt { display: none; }
    .pub-stepper li.actual .pub-stepper-txt { display: inline; }
    .pub-footer-inner { flex-direction: column; text-align: center; }
    .pub-footer-enlaces { justify-content: center; }
    .pub-persona { grid-template-columns: 1fr auto; }
    .pub-persona-tarjeta { grid-column: 1 / -1; grid-row: 2; }
}

/* Aviso «revisa la carpeta de spam» en las pantallas finales */
.pub-aviso-spam {
    background: #fff8e6;
    border-left: 3px solid var(--fvdi-orange);
    border-radius: 6px;
    padding: .6rem .9rem;
    font-size: .9rem;
}
.pub-aviso-spam i { color: var(--fvdi-orange-dark); margin-right: .25rem; }

/* Datos de la madre, padre, tutora o tutor legal (menor que no vive con quien hace el trámite) */
.pub-tutor {
    background: #f0f6fc;
    border: 1px solid #cfe0f3;
    border-radius: 10px;
    padding: 1rem;
}