/* =========================================================
   VARIABLES
   ========================================================= */
:root{
  /* UI builder */
  --cvb-blue:#2196F3;
  --cvb-pink:#FA1188;
  --cvb-dark:#1b1f23;
  --cvb-muted:#6b7280;
  --cvb-line:#e5e7eb;
  --cvb-bg:#f8fafc;
  --cvb-radius:14px;

  /* Preview A4 */
  --page-w:210mm;
  --page-h:297mm;
  --pad-x:16mm;
  --pad-y:16mm;
  --hdr-h:72mm;           /* alto del header en 1ª página */
  --side-w:260px;         /* ancho columna gris */
  --gap:14px;             /* separación entre columnas */
  --footer-gap:10mm;
  --side-bg:#eef2f5;
  --head-bg:#e9edf2;

  /* Títulos de sección (ambas columnas) */
  --section-title-size:14px;
  --section-title-weight:800;
  --section-title-color:#0f172a;
  --section-title-ls:.03em;
  --section-title-underline:#e0e6ed;
  --section-title-gap:2px;        /* espacio bajo el título */
}

/* =========================================================
   UI DEL CONSTRUCTOR (builder)
   ========================================================= */
.cvb-wrap{max-width:1000px;margin:24px auto;padding:0 16px;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial;}
.cvb-title{font-size:28px;margin:0 0 8px}
.cvb-sub{margin:0 0 16px;color:var(--cvb-muted)}

.cvb-accordion{border-radius:var(--cvb-radius);overflow:hidden;margin-bottom:12px;background:var(--cvb-bg);border:1px solid var(--cvb-line)}
.cvb-acc-toggle{width:100%;display:flex;align-items:center;justify-content:space-between;padding:14px 16px;background:var(--cvb-blue);color:#fff;border:none;font-size:16px;font-weight:700;cursor:pointer}
.cvb-acc-icon{font-weight:800;line-height:1}
.cvb-acc-panel{display:none;padding:16px;background:#fff}
.cvb-accordion.open .cvb-acc-panel{display:block}

/* una columna en el builder */
.cvb-grid,.cvb-grid.tight{display:block !important}
.cvb-col{margin-bottom:12px}
.cvb-col:last-child{margin-bottom:0}

/* inputs */
label{display:block;font-size:13px;color:#111;margin-bottom:6px}
input[type="text"],input[type="email"],input[type="tel"],input[type="url"],input[type="date"],input[type="month"],select,textarea{
  width:100%;padding:10px 12px;border:1px solid var(--cvb-line);border-radius:12px;background:#fff;font-size:14px;outline:none;box-sizing:border-box
}
textarea{resize:vertical}
.cvb-help{display:block;color:var(--cvb-muted);font-size:12px;margin-top:6px}
.cvb-check{font-size:14px;color:#333;display:flex;align-items:center;gap:6px}

.cvb-card{border:1px solid var(--cvb-line);border-radius:12px;padding:12px;background:#fff;margin-bottom:10px}
.cvb-row-end{display:flex;justify-content:flex-end;margin-top:8px}

.cvb-btn{appearance:none;border-radius:12px;border:1px solid var(--cvb-line);padding:10px 14px;background:#fff;cursor:pointer;font-weight:700}
.cvb-btn:hover{filter:brightness(0.98)}
.cvb-btn.primary{background:var(--cvb-blue);border-color:var(--cvb-blue);color:#fff}
.cvb-btn.ghost{background:#fff;border-color:var(--cvb-blue);color:var(--cvb-blue)}
.cvb-btn.danger{background:#fff;border-color:#ef4444;color:#ef4444}
.cvb-actions-row,.cvb-footer-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.cvb-actions-row{margin-top:6px}
.cvb-footer-actions{margin-top:16px}
.cvb-note{color:var(--cvb-muted)}

/* =========================================================
   PREVIEW MULTIPÁGINA A4
   ========================================================= */

/* contenedor de páginas */
.cv-pages{}

/* página */
.cv-page{
  position:relative;
  width:var(--page-w);
  height:var(--page-h);
  margin:0 auto 12mm;
  background:#fff;
  box-shadow:0 8px 24px rgba(0,0,0,.08);
  page-break-after:always;
  overflow:hidden;
}
.cv-page:last-child{page-break-after:auto}

/* fondos */
.cv-bg-header{
  position:absolute;left:0;right:0;top:0;height:var(--hdr-h);
  background:var(--head-bg);
}
.cv-bg-side{
  position:absolute;left:0;top:var(--hdr-h);bottom:0;width:var(--side-w);
  background:var(--side-bg);
}
/* páginas 2+: sin cabecera, franja gris desde arriba */
.cv-page--continued .cv-bg-header{display:none}
.cv-page--continued .cv-bg-side{top:0}

/* interior */
.cv-inner{position:relative;height:100%;padding:var(--pad-y) var(--pad-x)}

/* cabecera (solo pág. 1) */
.cv-header{display:flex;align-items:center;gap:14mm;margin-bottom:10mm}
.cv-photo img{width:150px;height:150px;border-radius:50%;object-fit:cover;box-shadow:0 6px 18px rgba(0,0,0,.12)}
.cv-title h1{margin:0 0 4mm}
.cv-title p{margin:0;color:#5b6571}
.cv-page--continued .cv-header{display:none}

/* cuerpo a dos columnas */
.cv-body{
  display:grid;
  grid-template-columns: var(--side-w) 1fr;
  column-gap: var(--gap);
  align-items:start;
}

/* altura útil del main para paginar */
.cv-page.is-first  .cv-main{height:calc(var(--page-h) - var(--pad-y)*2 - var(--hdr-h) - var(--footer-gap))}
.cv-page--continued .cv-main{height:calc(var(--page-h) - var(--pad-y)*2 - var(--footer-gap))}

/* ===== LATERAL (gris) – compacto ===== */
.cv-side{padding:8px 10px 0 0}
.cv-side .block{margin:6px 0}
.cv-side .block:first-child{margin-top:2px}
.cv-side .block:last-child{margin-bottom:0}
.cv-side .block h3{
  margin:0 0 var(--section-title-gap);
  font-size:var(--section-title-size);
  font-weight:var(--section-title-weight);
  letter-spacing:var(--section-title-ls);
  text-transform:uppercase;
  color:var(--section-title-color);
}
.cv-side .kv{font-size:13px;max-width:calc(var(--side-w) - 18px)}
.cv-side .kv > div{margin:1px 0;line-height:1.25}
.cv-side .kv,.cv-side .kv *{hyphens:none !important;word-break:normal !important;overflow-wrap:anywhere}

/* ===== PRINCIPAL (blanca) – armonizada con la gris ===== */
.cv-main{
  font-size:13.5px;line-height:1.35;
  padding-top:0;                       /* arranque idéntico al lateral */
}
.cv-main .section{
  margin-top:16px;
  break-inside:avoid;
}
.cv-main .section:first-child{margin-top:0}
.cv-main .section > h3{
  /* MISMO tamaño/estilo que la columna gris */
  margin:0 0 var(--section-title-gap);
  padding-bottom:3px;
  border-bottom:1px solid var(--section-title-underline);
  font-size:var(--section-title-size);
  font-weight:var(--section-title-weight);
  letter-spacing:var(--section-title-ls);
  text-transform:uppercase;
  color:var(--section-title-color);
}
.cv-main .entry{
  margin:6px 0 8px;
  break-inside:avoid-page;
}
.cv-main .entry .head{
  display:flex;justify-content:space-between;gap:8px;margin-bottom:4px;align-items:baseline
}
.cv-main .entry h4{
  margin:0;font-size:15px;line-height:1.25;font-weight:700;color:#0f172a
}
.cv-main .entry .meta{
  margin:0;font-size:12.5px;color:#5b6977;white-space:nowrap
}
.cv-main ul{
  margin:4px 0 6px 16px;padding:0
}
.cv-main li{
  margin:1px 0;line-height:1.32
}

/* seguridad extra para no cortar bloques */
.avoid-break{break-inside:avoid-page}

/* footer (numeración) */
.cv-footer{
  position:absolute;right:var(--pad-x);bottom:var(--footer-gap);
  font-size:12px;color:#667085
}

/* =========================================================
   IMPRESIÓN
   ========================================================= */
@media print{
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  body{background:#fff}
  .cv-page{box-shadow:none;margin:0}
}