:root {
    --primary: #0056b3;
    --success: #28a745;
    --gray: #f4f7f6;
    --border-color: #ddd;
}

body { 
    font-family: 'Segoe UI', sans-serif; 
    background: #cbd3da; 
    padding: 20px; 
}

.container { 
    max-width: 850px; 
    background: white; 
    margin: auto; 
    padding: 30px; 
    border-radius: 12px; 
    box-shadow: 0 5px 15px rgba(0,0,0,0.2); 
}

header { 
    border-bottom: 4px solid var(--primary); 
    margin-bottom: 25px; 
    text-align: center; 
}

/* Estructura de Datos de Usuario */
.data-section { 
    background: var(--gray); 
    padding: 20px; 
    border-radius: 8px; 
    margin-bottom: 20px; 
    border: 1px solid var(--border-color);
}

.input-row { 
    display: flex; 
    gap: 20px; 
    margin-bottom: 15px; 
}

.input-group { 
    flex: 1; 
    display: flex; 
    flex-direction: column; 
}

label { 
    font-size: 0.9rem; 
    font-weight: bold; 
    margin-bottom: 5px; 
    color: #555; 
}

input[type="text"] { 
    padding: 10px; 
    border: 1px solid #ccc; 
    border-radius: 5px; 
}

/* Botones Principales */
.btn-start {
    background: var(--primary);
    color: white;
    padding: 12px;
    border: none;
    width: 100%;
    border-radius: 5px;
    font-size: 1.1rem;
    cursor: pointer;
    font-weight: bold;
}

.btn-start:hover { 
    opacity: 0.9; 
}

.btn-primary { 
    background: var(--success); 
    color: white; 
    width: 100%; 
    padding: 15px; 
    border: none; 
    margin-top: 20px; 
    border-radius: 5px; 
    cursor: pointer; 
    font-size: 1rem; 
}

/* Diseño de Preguntas y Opciones (Vertical) */
fieldset { 
    border: 1px solid #eee; 
    margin-top: 20px; 
    padding: 20px; 
    border-radius: 8px; 
}

.question {
    margin-bottom: 25px;
    padding-bottom: 15px;
    border-bottom: 1px dashed #eee;
}

.question p {
    font-weight: 600;
    margin-bottom: 12px;
    color: #333;
}

/* Estilo para que las opciones salgan una debajo de otra */
.question label {
    display: block; 
    padding: 10px 15px;
    margin-bottom: 8px;
    background-color: #f9f9f9;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s ease;
    font-weight: normal; 
}

.question label:hover {
    background-color: #f0f4f8;
    border-color: var(--primary);
}

.question input[type="radio"] {
    margin-right: 10px;
    cursor: pointer;
}

/* Secciones de Correspondencia */
.match-item { 
    display: flex; 
    justify-content: space-between; 
    padding: 8px; 
    background: #fff; 
    margin-bottom: 5px; 
    border-radius: 4px; 
    border: 1px solid #eee;
}

.match-group label {
    display: flex;
    justify-content: baseline;
    align-items: center;
    gap: 10px;
    background: none;
    border: none;
    padding: 5px 0;
}

/* Resultados y PDF */
.hidden { 
    display: none; 
}

.btn-download-container {
    text-align: center; 
    margin-top: 30px;
    padding-bottom: 20px;
}

.btn-pdf {
    background-color: #d32f2f; 
    color: white;
    padding: 15px 40px; 
    font-size: 1.2rem;
    font-weight: bold;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    transition: transform 0.2s, background 0.3s;
    box-shadow: 0 4px 10px rgba(0,0,0,0.2);
}

.btn-pdf:hover {
    background-color: #b71c1c;
    transform: scale(1.05); 
}


/* --- NUEVA OPTIMIZACIÓN PDF --- */
/* --- OPTIMIZACIÓN PARA UNA SOLA PÁGINA PDF --- */
#pdf-container {
    width: 700px !important; /* Ancho ideal para A4 */
    background: white !important;
    margin: 0 auto !important;
    padding: 5px 15px !important;
    color: #000 !important;
}

#pdf-container h2 { margin: 0; font-size: 18px; text-align: center; }
#pdf-container p { margin: 2px 0; font-size: 12px; }

/*#pdf-container table {
    width: 100% !important;
    border-collapse: collapse !important;
    margin-top: 8px !important;
    table-layout: fixed !important;
}

#pdf-container th, 
#pdf-container td {
    border: 1px solid #333 !important;
    padding: 1px !important;
    font-size: 10.5px !important; /* Tamaño reducido para ahorrar espacio */
    word-wrap: break-word !important;
    line-height: 1.1;
}

/* Proporciones de columnas para evitar estiramientos */
/*#pdf-container th:nth-child(1) { width: 45%; }
#pdf-container th:nth-child(2) { width: 20%; }
#pdf-container th:nth-child(3) { width: 15%; }
#pdf-container th:nth-child(4) { width: 20%; }*/
/* --- OPTIMIZACIÓN FINAL PARA UNA SOLA PÁGINA PDF --- */
#pdf-container {
    width: 750px !important; 
    background: white !important;
    margin: 0 auto !important;
    padding: 10px !important;
    color: #000 !important;
}

/* Reducimos el tamaño de los bloques de respuestas para que quepan 20 en una hoja */
#resultado-bloques div {
    display: flex;
    border-bottom: 1px solid #eee;
    padding: 3px 0 !important; /* Padding mínimo */
    font-size: 11px !important; /* Fuente ligeramente más pequeña */
    align-items: center;
    page-break-inside: avoid !important;
}

#pdf-container h2 { margin: 0; font-size: 16px; }
#pdf-container p { margin: 2px 0; font-size: 11px; }

/* Ocultar el botón durante la generación del PDF */
.no-pdf {
    display: block;
}
.btn-download-container { text-align: center; margin-top: 10px; }