/* ===== CPM Fichas — Frontend (base estructural + modal) =====
   Las clases estructurales por defecto son: .ficha, .ficha-cabecera,
   .ficha-lista, .ficha-item, .ficha-popup (y -titulo/-texto/-close).
   Los colores, bordes, radios, etc. se generan desde el panel (wp_options). */

/* ---- Tarjeta ---- */
.cpm-ficha{line-height:1.45;}
.cpm-ficha .ficha{display:flex; flex-direction:column; overflow:hidden;}
.cpm-ficha .ficha > .ficha-lista{flex:1;}
.cpm-ficha .ficha-lista{list-style:none; margin:0; padding:0;}
.cpm-ficha .ficha-item{display:flex; gap:8px; align-items:flex-start; transition:background .15s ease; position:relative;}
.cpm-ficha .ficha-item > span{flex:1; min-width:0;}
.cpm-ficha .ficha-item + .ficha-item{border-top:1px solid #eef2f7;}
.cpm-ficha li.ficha-item[data-pop]{cursor:pointer;}
.cpm-ficha li.ficha-item[data-pop]:hover{background:#f1f5f9;}

/* ---- Popup (modal) ---- */
.ficha-popup-overlay{position:fixed; inset:0; background:rgba(12,16,24,var(--cpm-osc,.55));
  backdrop-filter:blur(var(--cpm-blur,5px)); -webkit-backdrop-filter:blur(var(--cpm-blur,5px));
  display:flex; align-items:center; justify-content:center; z-index:999999;
  opacity:0; pointer-events:none; transition:opacity .16s ease;}
.ficha-popup-overlay.open{opacity:1; pointer-events:auto;}
.cpm-ficha-modal{width:100%; display:flex; justify-content:center; padding:0 16px;}
.ficha-popup{position:relative; max-width:var(--cpm-ancho,560px); width:100%; margin:0;
  transform:scale(.93) translateY(8px); opacity:0;
  transition:transform .18s ease-out, opacity .16s ease-out;}
.ficha-popup.abrir{transform:scale(1) translateY(0); opacity:1;}
.ficha-popup.cerrando{transform:scale(.95); opacity:0;}
.ficha-popup-close{position:absolute; top:var(--cpm-cruz-top,8px); right:var(--cpm-cruz-right,10px);
  border:none; background:transparent; font-size:var(--cpm-cruz-tam,16px); line-height:1;
  cursor:pointer; color:var(--cpm-cruz-color,inherit); opacity:.55; padding:4px; border-radius:3px;
  transition:color .12s, opacity .12s;}
.ficha-popup-close:hover{opacity:1; color:var(--cpm-cruz-hover,rgba(0,0,0,.85)); background:rgba(0,0,0,.06);}

/* ===== Botón / CTA al final de la ficha ===== */
.cpm-ficha a.ficha-boton{display:flex;align-items:center;justify-content:center;gap:9px;
  text-decoration:none;line-height:1.2;transition:filter .15s ease;}
.cpm-ficha a.ficha-boton:hover{filter:brightness(1.08);}
.cpm-ficha a.ficha-boton svg{width:19px;height:19px;flex-shrink:0;}