/* Estilos base do editor */
body { background-color: #f8fafc; overflow: hidden; font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; }

/* Scrollbar customizada para o painel esquerdo */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #f1f1f1; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

/* Controles de Foto */
.range-sm { width: 100%; height: 4px; background: #e2e8f0; border-radius: 999px; -webkit-appearance: none; appearance: none; outline: none; }
.range-sm::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 12px; height: 12px; border-radius: 50%; background: #3b82f6; cursor: pointer; }

/* Estilos do Preview do Currículo (Garante que fique isolado) */
#preview-wrapper { transform-origin: center center; transition: transform 0.2s ease-out; box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25); background: white; }
#page-a4 { width: 794px; height: 1123px; position: relative; overflow: hidden; background: white; }
#resume-render-container { transform-origin: top left; }

/* Utilitários dinâmicos que o JS vai usar para colorir os templates */
.var-bg-primary { background-color: var(--primary); color: var(--text-on-primary); }
.var-text-primary { color: var(--primary); }
.var-border-primary { border-color: var(--primary); }
.var-bg-gradient { background: linear-gradient(135deg, var(--primary), var(--secondary)); color: var(--text-on-primary); }
.var-text-gradient { background: linear-gradient(135deg, var(--primary), var(--secondary)); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }