@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap');

* { box-sizing: border-box; margin: 0; padding: 0; }

body {
    font-family: 'Roboto', sans-serif;
    background-color: #f4f7f6;
    color: #333;
    line-height: 1.6;
}

/* --- BOTONES --- */
.controls-container {
    position: fixed; top: 20px; right: 20px;
    display: flex; flex-direction: column; gap: 10px; z-index: 1000;
}
.btn-action {
    padding: 10px 15px; border-radius: 8px; cursor: pointer;
    font-weight: 700; font-size: 13px; border: none;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1); transition: 0.3s;
    text-decoration: none; text-align: center;
}
.lang-toggle-btn { background: #0c1622; color: #3498db; border: 2px solid #3498db; }
.download-btn { background: #e74c3c; color: white; }

.mobile-menu-btn {
    display: none; background: #3498db; color: white;
    position: fixed; top: 20px; left: 20px; z-index: 1100;
    width: 45px; height: 45px; border-radius: 5px; font-size: 20px;
}

/* --- ESTRUCTURA (FIX PARA EL ESPACIO) --- */
.cv-version {
    display: none; /* Esto asegura que no tome espacio si no es activa */
    opacity: 0;
    transition: opacity 0.4s ease;
    max-width: 900px;
    margin: 40px auto;
    background: #fff;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    min-height: 1100px;
}

.cv-version.active { 
    display: flex !important; /* Solo la activa toma espacio */
}
.cv-version.show { opacity: 1; }

.sidebar {
    width: 32%; background: #0c1622; color: #ecf0f1;
    padding: 40px 25px; display: flex; flex-direction: column; align-items: center;
}
.profile-photo { width: 140px; height: 140px; border-radius: 50%; border: 4px solid #fff; object-fit: cover; }

.main-content { width: 68%; padding: 40px; }

/* --- TEXTO JUSTIFICADO --- */
.profile-summary, .job-tasks { text-align: justify; font-size: 13.5px; margin-bottom: 20px; }

/* --- FECHAS EN GRIS --- */
.job-date { font-size: 12px; color: #888; font-weight: 600; white-space: nowrap; }
.job-header { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 5px; }
.job-title { font-weight: 700; font-size: 15px; color: #2c3e50; }
.company { color: #7f8c8d; font-size: 14px; margin-left: 5px; }

/* --- LINKS VISIBLES --- */
.highlight-link { color: #3498db; font-weight: 700; text-decoration: underline; }

.sidebar h2 {
    font-size: 14px; color: #3498db; text-transform: uppercase;
    border-bottom: 1px solid #34495e; width: 100%; margin-top: 25px; padding-bottom: 5px;
}

.contact-info, .skills-list { width: 100%; font-size: 13px; list-style: none; }
.contact-info p, .skills-list li { margin-bottom: 12px; }
.contact-info a { color: #ecf0f1; text-decoration: none; }

.section-title { font-size: 18px; font-weight: 700; color: #2c3e50; border-bottom: 2px solid #e2e8f0; margin: 30px 0 20px; text-transform: uppercase; }
.job-tasks { list-style: disc; margin-left: 20px; font-size: 13px; color: #555; }

/* --- MÓVIL --- */
@media (max-width: 768px) {
    .mobile-menu-btn { display: flex; align-items: center; justify-content: center; }
    .cv-version.active { flex-direction: column; margin: 0; width: 100%; }
    .sidebar { position: fixed; left: -100%; top: 0; width: 80%; height: 100vh; z-index: 1050; transition: 0.3s; overflow-y: auto; }
    .sidebar.open { left: 0; }
    .main-content { width: 100%; padding: 110px 20px 20px; }
    .controls-container { top: 15px; right: 10px; }
}

@media print {
    .controls-container, .mobile-menu-btn { display: none; }
    .cv-version { margin: 0; display: flex !important; opacity: 1 !important; box-shadow: none; width: 100%; }
}
/* --- AJUSTE PARA DESCARGA DE PDF --- */
@media print, .cv-version {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}

/* Evita que los bloques de trabajo se corten feo entre páginas */
.job-entry {
    page-break-inside: avoid;
    break-inside: avoid;
}