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

body {
    font-family: 'Inter', sans-serif;
}

/* Regla de impresión estricta A4 */
@page {
    size: A4 portrait;
    margin: 0; /* Elimina márgenes físicos y cabeceras/pies de página del navegador */
}

@media print {
    .no-print {
        display: none !important;
    }
    body {
        background-color: white !important;
        color: black !important;
        padding: 0 !important;
        margin: 0 !important;
        width: 210mm !important;
        height: 297mm !important;
    }
    /* Forzar contenedor para que encaje al 100% en una sola página A4 */
    .cv-container {
        box-shadow: none !important;
        margin: 0 !important;
        padding: 0 !important;
        width: 210mm !important;
        height: 297mm !important;
        min-height: 297mm !important;
        max-height: 297mm !important;
        border: none !important;
        overflow: hidden !important;
        display: flex !important;
        flex-direction: row !important;
    }
    /* Forzar impresión de fondos de color en Chrome/Safari/Firefox */
    * {
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }
}

/* Simulación de retrato de estudio para el fondo de la foto */
.photo-studio-frame {
    position: relative;
    overflow: hidden;
    border-radius: 50%;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
}

/* Transición suave para los cambios de estilo */
.transition-profile {
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Indicadores visuales para campos editables (solo en pantalla) */
@media screen {
    [contenteditable="true"] {
        position: relative;
        transition: background-color 0.2s, outline 0.2s;
    }
    [contenteditable="true"]:hover {
        outline: 1px dashed rgba(99, 102, 241, 0.45);
        background-color: rgba(99, 102, 241, 0.05);
        cursor: text;
        border-radius: 2px;
    }
    [contenteditable="true"]:focus {
        outline: 2px solid rgba(99, 102, 241, 0.85);
        background-color: rgba(99, 102, 241, 0.08);
        border-radius: 2px;
    }
}