/* ============================================================
   AGENDA · calendario, diario, contactos y panel de avisos
   ============================================================ */

.ct-busc{display:flex;align-items:center;gap:10px;padding:12px 15px;margin-bottom:14px;}
.ct-busc i{font-size:var(--t-lg);color:rgba(13,42,65,0.5);}
.ct-busc input{border:none;outline:none;font-family:inherit;font-size:var(--t-md);color:var(--navy);width:100%;background:transparent;}
.ct-pills{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px;}
.ct-pill{display:inline-flex;align-items:center;gap:6px;font-size:var(--t-sm);color:var(--navy);border:1px solid var(--borde);border-radius:var(--r-sm);padding:6px 13px;cursor:pointer;background:var(--ficha);}
.ct-pill .c{font-size:var(--t-xs);color:var(--sec);background:var(--fondo);border-radius:var(--r-lg);padding:0 7px;}
/* SELECCIONADO = NAVY. ACTUAR = VERDE.
     Convivían tres formas de decir "estás aquí": píldora verde rellena en
     Contactos, Diario y Cuentas; píldora navy en Presupuesto; y pestaña
     con filo verde en Suscripciones. Y el verde hacía además de "entra
     dinero" y de botón de guardar, así que en una pantalla había cuatro
     cosas verdes y había que mirarlas todas para saber cuál hacía algo.
     Estar en una pestaña no es hacer nada: es dónde estás, y eso lo dice
     el navy. El verde queda para el dinero que entra y para el botón que
     dispara. El hover en verde SÍ se queda: es promesa de acción. */
  .ct-pill.on{background:var(--navy);border-color:var(--navy);color:var(--ficha);font-weight:var(--p-fuerte);}
.ct-pill.on .c{background:rgba(255,255,255,0.25);color:var(--ficha);}
.ct-pill .borrar-cat{margin-left:2px;opacity:0.6;}
.ct-pill .borrar-cat:hover{opacity:1;}
.ct-pill-add{border-style:dashed;color:var(--sec);}
.ct-lista{overflow:hidden;}
.ct-letra{padding:8px 18px;font-size:var(--t-sm);font-weight:var(--p-fuerte);color:var(--verde);background:var(--gris-1);border-bottom:1px solid var(--lin);}
.ct-row{display:flex;align-items:center;gap:13px;padding:11px 18px;border-bottom:1px solid var(--lin);cursor:pointer;}
.ct-row:hover{background:var(--gris-1);}
.ct-ava{width:40px;height:40px;border-radius:50%;background:var(--verde-suave);color:var(--verde);display:flex;align-items:center;justify-content:center;font-size:var(--t-sm);font-weight:var(--p-fuerte);flex:none;}
.ct-txt{flex:1;}
.ct-nm{font-size:var(--t-md);}
.ct-nm b{font-weight:var(--p-fuerte);}
.ct-sb{font-size:var(--t-xs);color:var(--sec);}
.ct-cat-tag{font-size:var(--t-xs);color:var(--verde-hondo);background:var(--verde-suave);border:1px solid rgba(16,167,116,0.3);border-radius:var(--r-lg);padding:2px 9px;}
/* ficha (resumen/editar) */
  .ct-card{padding:24px 20px;}
.ct-head{text-align:center;margin-bottom:20px;}
.ct-ava-g{width:80px;height:80px;border-radius:50%;background:var(--verde-suave);color:var(--verde);display:flex;align-items:center;justify-content:center;font-size:var(--t-xl);font-weight:var(--p-fuerte);margin:0 auto 12px;}
.ct-nombre-g{font-size:var(--t-lg);font-weight:var(--p-max);}
.ct-switch{display:flex;background:var(--fondo);border-radius:var(--r-md);padding:3px;margin:18px 0 20px;}
.ct-switch button{flex:1;border:none;background:transparent;font-family:inherit;font-size:var(--t-sm);color:var(--sec);padding:8px;border-radius:var(--r-sm);cursor:pointer;}
.ct-switch button.on{background:var(--ficha);color:var(--navy);font-weight:var(--p-fuerte);}
.ct-sec{padding:14px 0;border-bottom:1px solid var(--lin);}
.ct-sec:last-of-type{border-bottom:none;}
.ct-slbl{font-size:var(--t-xs);letter-spacing:0.5px;color:rgba(13,42,65,0.55);text-transform:uppercase;font-weight:var(--p-fuerte);margin-bottom:8px;}
.ct-r{display:flex;align-items:center;gap:12px;padding:6px 0;}
.ct-r .tag{font-size:var(--t-xs);color:var(--sec);width:70px;flex:none;}
.ct-r .val{font-size:var(--t-md);}
.ct-acc{display:flex;gap:10px;margin-top:18px;}
.ct-acc button{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:var(--t-sm);padding:11px;border:1px solid var(--borde);background:var(--ficha);color:var(--navy);}
.ct-acc button:hover{border-color:var(--verde);}
.ct-acc button.pri{background:var(--verde);border-color:var(--verde);color:var(--ficha);font-weight:var(--p-medio);}
.ct-acc button.del{color:var(--alerta);border-color:rgba(163,45,45,0.25);}
/* formulario */
  .ct-campo{margin-bottom:14px;}
.ct-campo label{display:block;font-size:var(--t-xs);letter-spacing:0.4px;text-transform:uppercase;color:var(--sec);font-weight:var(--p-fuerte);margin-bottom:5px;}
.ct-campo input,.ct-campo select,.ct-campo textarea{width:100%;border:1px solid var(--borde);border-radius:var(--r-sm);padding:10px 12px;font-family:inherit;font-size:var(--t-sm);color:var(--navy);background:var(--ficha);box-sizing:border-box;}
.ct-campo input:focus,.ct-campo select:focus,.ct-campo textarea:focus{outline:none;border-color:var(--verde);}
.ct-fila{display:grid;gap:10px;}
.ct-fila.dos{grid-template-columns:1fr 1fr;}
.ct-fila.tres{grid-template-columns:1fr 1fr 1fr;}
.ct-multi-row{display:flex;gap:8px;margin-bottom:8px;align-items:center;}
.ct-multi-row select{flex:0 0 110px;}
.ct-multi-row input{flex:1;}
.ct-multi-row .quitar{color:var(--sec);cursor:pointer;flex:none;}
.ct-multi-row .quitar:hover{color:var(--alerta);}
.ct-add-multi{display:inline-flex;align-items:center;gap:6px;font-size:var(--t-sm);color:var(--verde);cursor:pointer;background:none;border:none;font-family:inherit;padding:4px 0;}
.apanel-hoy{margin-bottom:18px;}
.apanel-hoy .g{font-size:var(--t-xl);font-weight:var(--p-fuerte);}
.apanel-hoy .s{font-size:var(--t-sm);color:var(--sec);margin-top:2px;}
.apanel-cols{display:grid;grid-template-columns:1.4fr 1fr;gap:16px;}
.apanel-box{padding:16px;}
.apanel-box h5{margin:0 0 12px;font-size:var(--t-sm);letter-spacing:0.5px;color:rgba(13,42,65,0.85);text-transform:uppercase;font-weight:var(--p-fuerte);display:flex;align-items:center;gap:6px;}
.apanel-cita{display:flex;gap:12px;padding:9px 0;border-bottom:1px solid var(--lin);cursor:pointer;}
.apanel-cita:last-child{border-bottom:none;}
.apanel-cita:hover{opacity:0.75;}
.apanel-cita .h{font-size:var(--t-sm);color:var(--sec);width:92px;flex:none;}
.apanel-cita .cont{flex:1;padding-left:12px;border-left:3px solid var(--verde);}
.apanel-cita .t{font-size:var(--t-sm);font-weight:var(--p-medio);}
.apanel-cita .l{font-size:var(--t-xs);color:var(--sec);}
.apanel-manana{margin-top:12px;padding-top:12px;border-top:1px dashed var(--borde);font-size:var(--t-sm);color:var(--sec);}
.apanel-manana b{color:var(--navy);font-weight:var(--p-medio);}
.apanel-mini{display:flex;flex-direction:column;gap:16px;}
/* --- Tareas pendientes y Próximos pagos (v5.8) --- */
  .pav-li{display:flex;align-items:center;gap:8px;font-size:var(--t-sm);padding:7px 0;border-bottom:1px solid var(--lin);}
.pav-li:last-child{border-bottom:none;}
.pav-chk{accent-color:var(--verde);cursor:pointer;flex-shrink:0;width:15px;height:15px;margin:0;}
.pav-txt{flex:1;color:var(--navy);line-height:1.35;min-width:0;}
.pav-ico{font-size:var(--t-sm);color:var(--sec);margin-right:5px;vertical-align:-1px;}
.pav-rep{font-size:var(--t-xs);color:var(--sec);margin-left:5px;vertical-align:-1px;}
.pav-imp{display:block;font-size:var(--t-xs);color:var(--sec);margin-top:1px;}
.pav-fch{flex-shrink:0;font-size:var(--t-xs);color:var(--sec);white-space:nowrap;}
/* Vencido: el aviso que de verdad importa no es lo que viene, es lo
     que se te pasó. Se queda visible hasta que lo marques. */
  .pav-li.vencida .pav-fch{color:var(--alerta);font-weight:var(--p-fuerte);}
.pav-li.vencida .pav-txt{color:var(--alerta);}
/* En cola: marcado pero todavía sin confirmar por el servidor. */
  .pav-li.en-cola{opacity:0.5;}
.pav-li.en-cola .pav-txt{text-decoration:line-through;}
/* Falló: se desmarca solo y parpadea para que veas CUÁL fue. */
  .pav-li.fallo{background:rgba(163,45,45,0.07);border-radius:var(--r-sm);}
/* Recibo devuelto (v7.5). Va arriba de la lista y se distingue del
     simple vencido: "esto ha fallado" no es "no lo he hecho todavía". */
  .pav-li.devuelta{background:rgba(163,45,45,0.05);border-radius:var(--r-sm);padding:9px 10px;margin-bottom:6px;border:1px solid rgba(163,45,45,0.25);border-bottom:1px solid rgba(163,45,45,0.25);align-items:flex-start;}
.pav-li.devuelta.agotada{background:rgba(163,45,45,0.11);border-color:var(--alerta);}
.pav-li.devuelta .pav-txt{color:var(--navy);}
.pav-etq{display:inline-block;background:var(--alerta);color:var(--ficha);font-size:var(--t-xs);font-weight:var(--p-max);
           letter-spacing:.4px;text-transform:uppercase;padding:1px 6px;border-radius:var(--r-sm);margin-right:6px;vertical-align:1px;}
.pav-plazo{display:block;font-size:var(--t-xs);color:var(--ambar);margin-top:2px;}
.pav-plazo.agotado{color:var(--alerta);font-weight:var(--p-fuerte);}
.pav-dev,.pav-quitar{flex-shrink:0;background:none;border:0;padding:2px 4px;cursor:pointer;
           color:var(--sec);font-size:var(--t-sm);line-height:1;border-radius:var(--r-sm);}
.pav-dev:hover{color:var(--alerta);background:rgba(163,45,45,0.08);}
.pav-quitar:hover{color:var(--navy);background:rgba(13,42,65,0.07);}
.pav-editable{background:none;border:0;padding:0;margin:0;font:inherit;color:inherit;text-align:left;cursor:pointer;width:100%;}
.pav-editable:hover{color:var(--verde);}
.pav-li.vencida .pav-editable:hover{color:var(--alerta);}
.pav-sel{width:100%;border:1px solid var(--borde);border-radius:var(--r-sm);padding:11px 13px;font-family:inherit;font-size:var(--t-md);color:var(--navy);background:var(--ficha);box-sizing:border-box;}
.pav-sel:focus{outline:none;border-color:var(--verde);}
.pav-nueva{display:flex;gap:6px;margin-top:9px;}
.pav-nueva input{flex:1;min-width:0;padding:6px 9px;border:1px solid var(--borde);border-radius:var(--r-sm);font-size:var(--t-sm);font-family:inherit;outline:none;}
.pav-nueva input:focus{border-color:var(--verde);}
.pav-mas{flex-shrink:0;width:30px;border:0;background:var(--verde);color:var(--ficha);font-size:var(--t-md);}
.apanel-li{display:flex;align-items:center;gap:9px;font-size:var(--t-sm);padding:6px 0;border-bottom:1px solid var(--lin);}
.apanel-li:last-child{border-bottom:none;}
.apanel-puertas{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:16px;}
.apanel-pu{padding:14px;text-align:center;cursor:pointer;transition:border-color .15s,box-shadow .15s,transform .15s;}
.apanel-pu:hover{border:1.5px solid var(--verde);box-shadow:0 0 0 4px rgba(16,167,116,0.1);transform:translateY(-2px);}
.apanel-pu .ic{font-size:var(--t-lg);color:var(--navy);transition:color .15s;}
.apanel-pu:hover .ic{color:var(--verde);}
.apanel-pu .nm{font-size:var(--t-sm);font-weight:var(--p-medio);margin-top:8px;}
@media(max-width:640px){.apanel-cols{grid-template-columns:1fr;}}
.dia-barra{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;flex-wrap:wrap;}
.dia-buscar{display:flex;align-items:center;gap:8px;background:var(--ficha);border:1px solid var(--borde);border-radius:var(--r-sm);padding:6px 13px;min-width:230px;}
.dia-buscar i{font-size:var(--t-md);color:var(--sec);}
.dia-buscar input{border:none;outline:none;background:transparent;font-size:var(--t-sm);color:var(--navy);width:100%;}
.dia-q-limpiar{cursor:pointer;visibility:hidden;}
.dia-buscar.tiene .dia-q-limpiar{visibility:visible;}
.dia-buscar.tiene i.ti-search{color:var(--verde);}
.dia-res-cab{font-size:var(--t-sm);color:var(--sec);padding:8px 12px 6px;}
.dia-res{display:flex;flex-direction:column;gap:3px;padding:10px 12px;border-top:1px solid var(--lin);cursor:pointer;border-radius:var(--r-sm);}
.dia-res:first-of-type{border-top:none;}
.dia-res:hover{background:var(--gris-3);}
.dia-res .rf{font-size:var(--t-xs);color:var(--verde);font-weight:var(--p-medio);display:flex;align-items:center;gap:6px;}
.dia-res .rt{font-size:var(--t-sm);color:var(--navy);line-height:1.4;}
.dia-res .rt mark{background:var(--amarillo-suave);color:inherit;border-radius:var(--r-sm);padding:0 1px;}
.dia-marcs{display:flex;gap:8px;flex-wrap:wrap;}
.dia-mrc{display:inline-flex;align-items:center;gap:5px;font-size:var(--t-sm);color:var(--navy);border:1px solid var(--borde);border-radius:var(--r-sm);padding:6px 13px;cursor:pointer;background:var(--ficha);}
.dia-mrc.on{background:var(--navy);border-color:var(--navy);color:var(--ficha);font-weight:var(--p-fuerte);}
.dia-mrc:not(.on):hover{border-color:var(--verde);}
.dia-layout{display:grid;grid-template-columns:280px 1fr;gap:16px;align-items:start;}
.dia-panel{display:flex;flex-direction:column;gap:14px;}
.dia-pbox{padding:14px;}
.dia-pbox h5{margin:0 0 10px;font-size:var(--t-sm);letter-spacing:0.5px;color:rgba(13,42,65,0.85);text-transform:uppercase;font-weight:var(--p-fuerte);}
.dia-mc{margin-bottom:14px;}
.dia-mc:last-child{margin-bottom:0;}
.dia-mc .mtit{font-size:var(--t-xs);font-weight:var(--p-medio);text-align:center;margin-bottom:6px;color:var(--verde);text-transform:capitalize;}
.dia-mc table{width:100%;border-collapse:collapse;}
.dia-mc th{font-size:var(--t-xs);color:var(--sec);font-weight:var(--p-normal);padding:1px 0;}
.dia-mc td{font-size:var(--t-xs);text-align:center;padding:2px 0;color:var(--navy);position:relative;cursor:pointer;}
.dia-mc td.otro{color:rgba(13,42,65,0.22);cursor:default;}
.dia-mc td.hoy span{background:var(--navy);color:var(--ficha);border-radius:50%;width:16px;height:16px;line-height:16px;display:inline-block;}
.dia-mc td.sel span{background:var(--navy);color:var(--ficha);border-radius:50%;width:16px;height:16px;line-height:16px;display:inline-block;}
.dia-mc td.evt::after{content:"";position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:3px;height:3px;border-radius:50%;background:var(--punto,var(--verde));}
.dia-rec{display:flex;flex-direction:column;gap:2px;padding:8px 0;border-bottom:1px solid var(--lin);cursor:pointer;}
.dia-rec:last-child{border-bottom:none;}
.dia-rec .rf{font-size:var(--t-xs);color:var(--sec);}
.dia-rec .rt{font-size:var(--t-sm);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.dia-nav{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;margin-bottom:14px;}
/* font-size explicito en las flechas: son <button>, y un botón sin
     font-size no hereda el de la página sino el del NAVEGADOR (13,3333 px).
     Salía un tamaño con decimales que no está en ninguna escala y que
     nadie había escrito. Lo mismo en .cal-navc .fl. */
  .dia-nav .fl{width:32px;height:32px;border-radius:var(--r-sm);border:1px solid var(--borde);background:var(--ficha);cursor:pointer;color:var(--navy);font-family:inherit;font-size:var(--t-sm);}
.dia-nav .fl:hover{border-color:var(--verde);color:var(--verde);}
.dia-nav .dtit{font-size:var(--t-md);font-weight:var(--p-medio);}
.dia-nav .dtit .h{color:var(--verde);margin-right:6px;}
.dia-hoja-box{padding:26px 34px;min-height:300px;
    background-image:repeating-linear-gradient(to bottom,transparent,transparent 33px,rgba(13,42,65,0.06) 33px,rgba(13,42,65,0.06) 34px);}
.dia-hoja-box p{line-height:34px;font-size:var(--t-md);margin:0 0 8px;}
.dia-tag{display:inline-flex;align-items:center;gap:5px;font-size:var(--t-xs);border-radius:var(--r-lg);padding:2px 10px;margin-bottom:10px;background:var(--verde-suave);color:var(--verde-hondo);border:1px solid rgba(16,167,116,0.3);}
.dia-ilegible{border:1px solid var(--ambar);background:rgba(186,117,23,0.06);border-radius:var(--r-md);padding:18px 20px;display:flex;flex-direction:column;gap:8px;align-items:flex-start;}
.dia-ilegible i{font-size:var(--t-lg);color:var(--ambar);}
.dia-ilegible strong{font-size:var(--t-md);color:var(--navy);}
.dia-ilegible span{font-size:var(--t-sm);line-height:1.55;color:var(--sec);}
.dia-ilegible code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:var(--t-sm);background:rgba(13,42,65,0.06);padding:1px 5px;border-radius:var(--r-sm);}
.dia-rec.ilegible .rt,.dia-res.ilegible .rt{color:var(--ambar);font-style:italic;}
.dia-escribir-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:14px;background:var(--verde);color:var(--ficha);border:none;padding:14px;font-size:var(--t-md);}
.dia-escribir-btn:hover{background:var(--verde-hondo);}
.dia-pluma{display:flex;align-items:center;gap:16px;padding:11px 16px;margin-bottom:12px;flex-wrap:wrap;}
.dia-pluma .lbl{font-size:var(--t-xs);letter-spacing:0.5px;color:rgba(13,42,65,0.7);text-transform:uppercase;font-weight:var(--p-medio);}
.dia-tintas{display:flex;gap:14px;}
.dia-tinta{width:28px;height:28px;border-radius:50%;border:2px solid transparent;cursor:pointer;position:relative;}
.dia-tinta.on{box-shadow:0 0 0 3px rgba(13,42,65,0.15);}
.dia-marc-barra{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap;}
.dia-marc-barra span{display:inline-flex;align-items:center;gap:5px;font-size:var(--t-xs);color:var(--sec);border:1px solid var(--borde);border-radius:var(--r-sm);padding:5px 11px;cursor:pointer;background:var(--ficha);}
.dia-marc-barra span.on{background:var(--navy);border-color:var(--navy);color:var(--ficha);font-weight:var(--p-fuerte);}
.dia-hoja-editable{padding:30px 38px;min-height:400px;line-height:34px;font-size:var(--t-md);outline:none;
    background-image:repeating-linear-gradient(to bottom,transparent,transparent 33px,rgba(13,42,65,0.07) 33px,rgba(13,42,65,0.07) 34px);}
.dia-hoja-editable:empty::before{content:"Escribe aquí la hoja de hoy…";color:rgba(13,42,65,0.35);}
.dia-acc{display:flex;justify-content:flex-end;gap:8px;margin-top:14px;}
.dia-acc button{display:inline-flex;align-items:center;gap:6px;background:var(--ficha);border:1px solid var(--borde);font-size:var(--t-sm);color:var(--navy);padding:10px 18px;}
.dia-acc button:hover{border-color:var(--verde);}
.dia-acc button.pri{background:var(--verde);border-color:var(--verde);color:var(--ficha);font-weight:var(--p-medio);}
@media(max-width:900px){.dia-layout{grid-template-columns:1fr;}}
/* ---- Calendario ---- */
  .cal-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;flex-wrap:wrap;}
.cal-seg{display:inline-flex;overflow:hidden;}
.cal-seg button{border:none;background:transparent;font-family:inherit;font-size:var(--t-sm);color:var(--navy);padding:8px 18px;cursor:pointer;}
.cal-seg button.on{background:var(--navy);color:var(--ficha);font-weight:var(--p-fuerte);}
.cal-toolr{display:flex;align-items:center;gap:8px;}
.cal-icobtn{width:36px;height:36px;border:1px solid var(--borde);background:var(--ficha);color:var(--navy);font-size:var(--t-md);}
.cal-icobtn:hover{border-color:var(--verde);color:var(--verde);}
.cal-navbar{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;margin-bottom:14px;}
.cal-navc{display:flex;align-items:center;gap:10px;margin:0 auto;}
.cal-navc .hoy{border:1px solid var(--borde);background:var(--ficha);border-radius:var(--r-sm);padding:6px 14px;font-family:inherit;font-size:var(--t-sm);color:var(--navy);cursor:pointer;}
.cal-navc .hoy:hover{border-color:var(--verde);color:var(--verde);}
.cal-navc .fl{width:32px;height:32px;border-radius:var(--r-sm);border:1px solid var(--borde);background:var(--ficha);cursor:pointer;color:var(--navy);font-family:inherit;font-size:var(--t-sm);}
.cal-navc .rng{font-size:var(--t-md);font-weight:var(--p-medio);min-width:170px;text-align:center;text-transform:capitalize;}
.cal-layout{display:grid;grid-template-columns:1fr 300px;gap:16px;align-items:start;}
/* La rejilla cubre el dia entero (v18.6), asi que se desplaza en
   vertical. La cabecera de dias y la fila de "todo el dia" se quedan
   pegadas arriba para no perder de vista de que dia es cada columna. */
/* El tope de 620px no es decorativo: con las 24 horas a 40px la rejilla
   mide 1038px, asi que este alto deja siempre recorrido suficiente para
   que HORA_INICIO quede arriba del todo. Sin el, en una pantalla alta el
   dia entero cabria y se veria las 00:00 arriba, con las horas de
   trabajo apretadas al fondo. */
.cal-grid{overflow-y:auto;overflow-x:hidden;height:min(calc(100vh - 230px),620px);min-height:430px;}
.cal-hbody{position:relative;}
.cal-esquina,.cal-dhead{position:sticky;top:0;z-index:4;background:var(--ficha);}
.cal-alldia-lbl,.cal-allday{position:sticky;top:52px;z-index:3;background:var(--ficha);}
.cal-dhead{border-left:1px solid var(--lin);padding:9px 4px;text-align:center;height:52px;box-sizing:border-box;}
.cal-dhead .dn{font-size:var(--t-xs);color:var(--sec);}
.cal-dhead.dom .dn{color:var(--alerta);}
.cal-dhead .dd{font-size:var(--t-md);font-weight:var(--p-medio);margin-top:3px;display:inline-block;width:30px;height:30px;line-height:30px;}
.cal-dhead.dom .dd{color:var(--alerta);}
.cal-dhead.hoy .dd{background:var(--navy);color:var(--ficha);border-radius:50%;}
.cal-esquina{height:52px;}
.cal-alldia-lbl{border-top:1px solid rgba(13,42,65,0.12);font-size:var(--t-xs);color:var(--sec);padding:6px 4px 0;text-align:right;height:26px;box-sizing:border-box;}
.cal-allday{border-top:1px solid rgba(13,42,65,0.12);border-left:1px solid var(--lin);min-height:26px;padding:3px;box-sizing:border-box;display:flex;flex-wrap:wrap;gap:3px;align-content:flex-start;}
.cal-ev-allday{border-radius:var(--r-sm);padding:2px 7px;font-size:var(--t-xs);border-left:3px solid;cursor:pointer;white-space:nowrap;}
.cal-cumple{background:var(--rosa-suave);color:var(--cumple);border-radius:var(--r-sm);padding:2px 6px;font-size:var(--t-xs);display:inline-block;}
.cal-hgut{font-size:var(--t-xs);color:var(--sec);text-align:right;padding:2px 8px 0 0;border-top:1px solid rgba(13,42,65,0.07);height:40px;box-sizing:border-box;}
.cal-hcell{border-top:1px solid rgba(13,42,65,0.07);border-left:1px solid var(--lin);height:40px;position:relative;box-sizing:border-box;}
/* z-index: desde la v18.7 el evento se posiciona por minutos y puede
   sobresalir de su casilla hacia abajo. Sin esto, la linea superior de
   las horas siguientes le pasaria por encima. */
.cal-ev{position:absolute;left:3px;right:3px;border-radius:var(--r-sm);padding:3px 7px;font-size:var(--t-xs);line-height:1.25;overflow:hidden;border-left:3px solid;cursor:pointer;z-index:2;}
/* Segunda linea del evento (v18.10): el rango horario debajo del titulo,
   solo cuando la cita es lo bastante alta. Va en bloque y algo mas
   apagada para que el titulo siga mandando. */
.cal-ev-hora{display:block;opacity:.75;font-size:calc(var(--t-xs) - 1px);white-space:nowrap;}
.cal-ahora{position:absolute;left:52px;right:0;height:0;border-top:2px solid var(--alerta);z-index:5;}
.cal-ahora::before{content:"";position:absolute;left:0;top:-5px;width:9px;height:9px;border-radius:50%;background:var(--alerta);}
.cal-mes{overflow:hidden;}
.cal-mes .wd{display:grid;grid-template-columns:repeat(7,1fr);}
.cal-mes .wd div{padding:8px 6px;font-size:var(--t-xs);color:var(--sec);text-align:center;border-bottom:1px solid var(--lin);}
.cal-mes .wd div.dom{color:var(--alerta);}
.cal-mes .dias{display:grid;grid-template-columns:repeat(7,1fr);}
.cal-mcell{height:110px;border-top:1px solid var(--lin);border-left:1px solid var(--lin);padding:6px;cursor:pointer;box-sizing:border-box;overflow-y:auto;}
.cal-mcell .num{font-size:var(--t-sm);font-weight:var(--p-medio);display:inline-block;width:26px;height:26px;line-height:26px;text-align:center;}
.cal-mcell.dom .num{color:var(--alerta);}
.cal-mcell.otro{background:var(--gris-2);}
.cal-mcell.otro .num{color:rgba(13,42,65,0.32);}
.cal-mcell.hoy .num{background:var(--navy);color:var(--ficha);border-radius:50%;}
.cal-pill{margin-top:4px;border-radius:var(--r-sm);padding:2px 6px;font-size:var(--t-xs);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;border-left:3px solid;cursor:pointer;}
.cal-anio{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.cal-mini-m{padding:12px 14px;}
.cal-mini-m h4{margin:0 0 8px;font-size:var(--t-sm);font-weight:var(--p-medio);text-transform:capitalize;text-align:center;}
.cal-mini-m table{width:100%;border-collapse:collapse;}
.cal-mini-m th{font-size:var(--t-xs);color:var(--sec);font-weight:var(--p-normal);padding:2px 0;}
.cal-mini-m th.dom{color:var(--alerta);}
.cal-mini-m td{font-size:var(--t-xs);text-align:center;padding:1px 0;line-height:22px;color:var(--navy);}
.cal-mini-m td.dom{color:var(--alerta);}
.cal-mini-m td.otro{color:rgba(13,42,65,0.25);}
.cal-mini-m td.hoy span{background:var(--navy);color:var(--ficha);border-radius:50%;width:22px;height:22px;line-height:22px;display:inline-block;}
.cal-mini-m td.evt{position:relative;}
.cal-mini-m td.evt::after{content:"";position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:4px;height:4px;border-radius:50%;background:var(--punto,var(--verde));}
.cal-panel{display:flex;flex-direction:column;gap:14px;}
.cal-pbox{padding:14px;}
.cal-pbox h5{margin:0 0 10px;font-size:var(--t-sm);letter-spacing:0.5px;color:rgba(13,42,65,0.85);text-transform:uppercase;font-weight:var(--p-fuerte);display:flex;align-items:center;gap:6px;}
.cal-mc{margin-bottom:14px;}
.cal-mc:last-child{margin-bottom:0;}
.cal-mc .mtit{font-size:var(--t-xs);font-weight:var(--p-medio);text-align:center;margin-bottom:6px;color:var(--verde);text-transform:capitalize;}
.cal-mc table{width:100%;border-collapse:collapse;}
.cal-mc th{font-size:var(--t-xs);color:var(--sec);font-weight:var(--p-normal);padding:1px 0;}
.cal-mc th.dom{color:var(--alerta);}
.cal-mc td{font-size:var(--t-xs);text-align:center;padding:2px 0;color:var(--navy);position:relative;cursor:pointer;}
.cal-mc td.dom{color:var(--alerta);}
.cal-mc td.otro{color:rgba(13,42,65,0.22);cursor:default;}
.cal-mc td.hoy span{background:var(--navy);color:var(--ficha);border-radius:50%;width:16px;height:16px;line-height:16px;display:inline-block;}
.cal-mc td.evt::after{content:"";position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:3px;height:3px;border-radius:50%;background:var(--punto,var(--verde));}
.cal-li{display:flex;align-items:center;gap:8px;font-size:var(--t-sm);padding:5px 0;}
.cal-li .cake{color:var(--cumple);}
.cal-notas{padding:14px;margin-top:16px;}
.cal-notas h5{margin:0 0 10px;font-size:var(--t-xs);letter-spacing:0.5px;color:var(--sec);text-transform:uppercase;font-weight:var(--p-medio);}
.cal-notas textarea{width:100%;min-height:70px;border:1px solid var(--borde);border-radius:var(--r-sm);padding:10px;font-family:inherit;font-size:var(--t-sm);color:var(--navy);resize:vertical;box-sizing:border-box;}
.cal-notas textarea:focus{outline:none;border-color:var(--verde);}
.cal-view{display:none;}
.cal-view.on{display:block;}
@media(max-width:900px){.cal-layout{grid-template-columns:1fr;}.cal-panel{flex-direction:row;flex-wrap:wrap;}.cal-pbox{flex:1;min-width:220px;}.cal-anio{grid-template-columns:repeat(2,1fr);}}
/* modal de evento */
  .cal-modal-ev{padding:24px 22px;width:400px;max-height:86vh;overflow-y:auto;}
.cal-modal-ev h3{font-size:var(--t-md);font-weight:var(--p-fuerte);margin:0 0 16px;}
.cal-check{display:flex;align-items:center;gap:8px;font-size:var(--t-sm);margin-bottom:12px;cursor:pointer;user-select:none;}
.cal-check input{width:18px;height:18px;cursor:pointer;flex:0 0 auto;}
.cal-dias-semana{display:flex;gap:6px;margin-bottom:12px;}
.cal-dias-semana span{width:34px;height:34px;border-radius:50%;border:1px solid var(--borde);display:flex;align-items:center;justify-content:center;font-size:var(--t-xs);cursor:pointer;user-select:none;}
.cal-dias-semana span.on{background:var(--navy);border-color:var(--navy);color:var(--ficha);font-weight:var(--p-fuerte);}
/* ---- Impresión: solo el contenido, sin botones ni topbar ---- */
  

/* ---- SÁBADO Y DOMINGO --------------------------------------
   El domingo va en rojo (.dom, arriba). El sábado NO: se
   distingue con un fondo apenas más gris, que dice "fin de
   semana" sin decir "festivo". Antes los dos iban en rojo y un
   sábado era indistinguible de un 1 de mayo. */
.cal-mcell.wknd:not(.dom){background:var(--gris-2);}
.cal-mc td.wknd:not(.dom), .dia-mc td.wknd:not(.dom){color:var(--sec);}

/* ============================================================
   v15.4 · CELDA PINTADA, CAPSULA Y EDITOR
   ============================================================ */

/* VISTA AÑO: LA CELDA PINTADA.
   El color de fondo lo pone el JavaScript, que es quien sabe si el dia es
   nacional, de Galicia, de Ferrol o escolar. Aqui solo va la forma. Los
   tres festivos van macizos y por eso el numero se fuerza en claro; el
   escolar va en pastel y lleva su propio color de texto, mas oscuro, asi
   que ese NO se toca. */
/* RADIO PEQUEÑO Y CELDA LLENA.
   Con --r-sm (8px) sobre una celda de 22px de alto, cada dia pintado salia
   como una pildora suelta y una franja larga como Nadal quedaba hecha una
   cadena de lentejas con muescas entre dia y dia. En el calendario impreso
   cada dia es un cuadro lleno y los dias seguidos forman una banda limpia,
   que es justo de lo que sirve la vista Año. De ahi --r-xs. */
.cal-mini-m td.cal-fest{color:var(--ficha);border-radius:var(--r-xs);font-weight:var(--p-medio);}
.cal-mini-m td.cal-esc{border-radius:var(--r-xs);}
/* El domingo pierde su rojo cuando la celda va pintada: si no, un domingo
   festivo tendria el texto rojo sobre fondo rojo. */
.cal-mini-m td.cal-fest.dom,
.cal-mini-m td.cal-esc.dom{color:inherit;}
.cal-mini-m td.cal-fest.dom{color:var(--ficha);}

/* HOY, CUANDO LA CELDA YA VA PINTADA, SE MARCA CON ARO.
   El relleno de "hoy" y el del festivo peleaban por el mismo sitio y
   ganaba uno de los dos al azar. Con el aro conviven: ves que es festivo
   por el fondo y que es hoy por el borde. */
.cal-mini-m td.hoy-aro{box-shadow:inset 0 0 0 2px var(--navy);border-radius:var(--r-xs);}

/* LEYENDA DEL AÑO. Obligatoria desde que la celda va pintada: cuatro
   colores sin explicar son cuatro adivinanzas. */
/* Lista de fechas destacadas del año (v18.16). Va debajo de los doce
   meses: la rejilla dice que hay algo y esta dice que es. */
.cal-dest-lista{margin-top:16px;padding:16px 18px;}
.cal-dest-lista h4{margin:0 0 10px;font-size:var(--t-sm);text-transform:uppercase;letter-spacing:.04em;color:var(--txt-sec);}
.cal-dest-lista h4 .cnt{background:var(--fondo);border-radius:999px;padding:1px 8px;margin-left:6px;font-size:var(--t-xs);}
.cal-dest-lista ul{list-style:none;margin:0;padding:0;}
.cal-dest-f{cursor:pointer;display:grid;grid-template-columns:10px 74px 1fr auto;align-items:center;gap:10px;padding:7px 0;border-top:1px solid var(--lin);font-size:var(--t-sm);}
.cal-dest-f:first-child{border-top:0;}
.cal-dest-f .pt{width:8px;height:8px;border-radius:50%;}
.cal-dest-f .cd{color:var(--txt-sec);white-space:nowrap;}
.cal-dest-f .tt{font-weight:var(--p-medio);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.cal-dest-f .hr{color:var(--txt-sec);font-size:var(--t-xs);white-space:nowrap;}
/* Las ya pasadas no se esconden: se apagan. Siguen siendo del año y sirven
   para mirar atras, pero no compiten con las que estan por venir. */
.cal-dest-f.pasada{opacity:.45;}
.cal-dest-vacio{margin:0;color:var(--txt-sec);font-size:var(--t-sm);line-height:1.45;}

/* DIA DESTACADO EN LA VISTA AÑO (v18.16). Se marca con un recuadro del
   color de su proyecto, no con relleno: asi un dia que es a la vez
   festivo y tiene una reunion marcada enseña las dos cosas, el relleno
   del festivo y el borde de lo tuyo, en vez de que gane uno de los dos.
   outline y no box-shadow: la tabla va con border-collapse:collapse y ahi
   el navegador NO dibuja sombras sobre las celdas. */
.cal-mini-m td.cal-dest{outline:2px solid var(--dest);outline-offset:-2px;border-radius:var(--r-xs);font-weight:var(--p-fuerte);cursor:help;}
.cal-leyenda{display:flex;flex-wrap:wrap;gap:16px;margin-top:14px;padding-top:12px;border-top:1px solid var(--borde);}
.cal-leg-i{display:inline-flex;align-items:center;gap:7px;font-size:var(--t-xs);color:var(--sec);}
.cal-leg-c{width:13px;height:13px;border-radius:var(--r-xs);display:inline-block;}

/* VISTA MES Y VISTA DIA: LA CAPSULA DEL NUMERO.
   En el mes la celda es de TUS eventos, asi que el color del festivo viaja
   en el numero y no en el fondo. Antes el festivo se pintaba como una
   pastilla mas y te robaba una linea de las que caben en el dia. */
.cal-cap{display:inline-block;min-width:20px;padding:0 6px;border-radius:var(--r-full);color:var(--ficha);text-align:center;font-weight:var(--p-medio);}
.cal-mcell.hoy .num .cal-cap{box-shadow:0 0 0 2px var(--ficha),0 0 0 4px var(--navy);}
.cal-dfest{font-size:var(--t-xs);color:var(--sec);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/* BARRA DE TINTAS Y HOJA EDITABLE (compartidas con el Diario). */
.tintas-barra{display:flex;align-items:center;gap:8px;margin-bottom:6px;}
.tintas-lbl{font-size:var(--t-xs);color:var(--sec);text-transform:uppercase;letter-spacing:0.4px;}
.tinta-p{width:18px;height:18px;border-radius:50%;cursor:pointer;border:2px solid transparent;}
.tinta-p.on{border-color:var(--navy);}
.tinta-b{width:26px;height:22px;border:1px solid var(--borde);background:var(--ficha);border-radius:var(--r-sm);cursor:pointer;color:var(--navy);font-size:var(--t-xs);line-height:1;padding:0;}
.tinta-b.on{background:var(--navy);color:var(--ficha);border-color:var(--navy);}
.hoja-rica{min-height:84px;border:1px solid var(--borde);border-radius:var(--r-sm);padding:8px 10px;background:var(--ficha);font-size:var(--t-sm);line-height:1.6;color:var(--navy);overflow-y:auto;}
.hoja-rica:focus{outline:none;border-color:var(--verde);}
/* El marcador de vacio se hace con ::before y no con placeholder porque una
   caja editable no tiene placeholder. :empty falla en cuanto el navegador
   mete un <br> solo, de ahi el :has(br:only-child). */
.hoja-rica:empty::before,
.hoja-rica:has(br:only-child)::before{content:attr(data-vacio);color:var(--sec);pointer-events:none;}

/* La celda pintada llena su hueco. Sin esto el color es una tira estrecha
   con aire arriba y abajo, y los dias seguidos no llegan a tocarse.
   Y el radio se pone SOLO en las esquinas exteriores del bloque de seis
   semanas: con las cuatro redondeadas, dos filas consecutivas de una misma
   franja dejaban rombitos blancos en el encuentro de las esquinas. */
.cal-mini-m td.cal-fest,
.cal-mini-m td.cal-esc{padding:0;line-height:24px;border-radius:0;}
.cal-mini-m tr:first-child td.cal-fest,
.cal-mini-m tr:first-child td.cal-esc{border-top-left-radius:var(--r-xs);border-top-right-radius:var(--r-xs);}
.cal-mini-m tr:last-child td.cal-fest,
.cal-mini-m tr:last-child td.cal-esc{border-bottom-left-radius:var(--r-xs);border-bottom-right-radius:var(--r-xs);}
.cal-mini-m td.cal-fest:first-child,
.cal-mini-m td.cal-esc:first-child{border-top-left-radius:var(--r-xs);border-bottom-left-radius:var(--r-xs);}
.cal-mini-m td.cal-fest:last-child,
.cal-mini-m td.cal-esc:last-child{border-top-right-radius:var(--r-xs);border-bottom-right-radius:var(--r-xs);}

/* Direcciones repetibles en la ficha de contacto (v15.5). Cada una va en
   su propia caja para que se vea dónde acaba una y empieza la siguiente:
   con tres filas de campos por dirección, sin separación no se distingue
   la de casa de la del trabajo. */
.ct-dir-fila{border:1px solid var(--borde);border-radius:var(--r-sm);padding:10px 12px;margin-bottom:10px;background:var(--gris-4);}
.ct-quitar-multi{display:inline-flex;align-items:center;gap:6px;font-size:var(--t-xs);color:var(--alerta);cursor:pointer;background:none;border:none;font-family:inherit;padding:2px 0;}

/* ============================================================
   CONTACTOS · DOS CUADERNOS (v17.0)
   Recibidor con dos secciones (personas y sitios), pestañas de
   abecedario y ficha de sitio. Sin un solo hexadecimal: todo sale
   de los tokens de estilo.css, que es lo que comprueba
   pruebas/estaticas.php.
   ============================================================ */

/* ---------- Recibidor ---------- */
.ctr-cargando{padding:40px;text-align:center;color:var(--sec);font-size:var(--t-sm);}
.ctr-puertas{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:16px;}
.ctr-puerta{text-align:left;font-family:inherit;cursor:pointer;padding:20px 22px;color:var(--navy);}
.ctr-puerta .ic{font-size:var(--t-xl);color:var(--navy);display:block;}
.ctr-puerta .nm{font-size:var(--t-lg);font-weight:var(--p-medio);margin-top:11px;}
.ctr-puerta .sub{font-size:var(--t-sm);color:var(--sec);margin-top:3px;}
.ctr-puerta .dato{border-top:1px solid var(--lin);margin-top:14px;padding-top:11px;
  font-size:var(--t-sm);color:var(--sec);display:flex;align-items:center;gap:7px;}
.ctr-puerta:hover{border-color:var(--verde);}

.ctr-recientes{padding:14px 18px;margin-bottom:14px;}
.ctr-slbl{font-size:var(--t-xs);letter-spacing:.06em;color:var(--sec);
  display:flex;align-items:center;gap:6px;margin-bottom:11px;}
.ctr-rec-lista{display:flex;gap:9px;flex-wrap:wrap;}
.ctr-rec{display:inline-flex;align-items:center;gap:6px;font-family:inherit;
  font-size:var(--t-sm);color:var(--navy);background:var(--fondo);border:none;
  border-radius:var(--r-lg);padding:6px 13px;cursor:pointer;}
.ctr-rec i{color:var(--sec);font-size:var(--t-sm);}
.ctr-rec:hover{background:var(--verde-claro);color:var(--verde-hondo);}
.ctr-rec-vacio{font-size:var(--t-sm);color:var(--sec);}

/* Aviso de los que faltan por clasificar. Ámbar, no rojo: es una tarea
   pendiente, no una alerta — el rojo está reservado para los avisos de
   verdad y los domingos. */
.ctr-aviso{display:flex;align-items:center;gap:10px;padding:12px 15px;
  background:var(--ambar-suave);border-left:3px solid var(--ambar);
  font-size:var(--t-sm);color:var(--navy);}
.ctr-aviso i{font-size:var(--t-md);color:var(--ambar-hondo);}
.ctr-aviso button{margin-left:auto;font-family:inherit;font-size:var(--t-xs);
  color:var(--navy);background:var(--ficha);border:1px solid var(--borde);
  border-radius:var(--r-lg);padding:5px 12px;cursor:pointer;}

/* ---------- Pestañas del abecedario ---------- */
.ct-tabs{display:flex;gap:3px;flex-wrap:wrap;margin-bottom:12px;}
.ct-tab{font-family:inherit;font-size:var(--t-sm);color:var(--navy);
  background:var(--gris-4);border:1px solid var(--borde);border-radius:var(--r-sm);
  padding:6px 11px;cursor:pointer;display:inline-flex;align-items:center;gap:5px;}
.ct-tab .n{font-size:var(--t-xs);color:var(--sec);}
.ct-tab:hover:not(.vacia){border-color:var(--verde);color:var(--verde);}
/* Navy = seleccionado, verde = acción. La misma regla que en el resto
   de la aplicación; aquí la pestaña abierta va en navy. */
.ct-tab.on{background:var(--navy);border-color:var(--navy);color:var(--ficha);font-weight:var(--p-medio);}
.ct-tab.on .n{color:var(--verde-sobre-navy);}
.ct-tab.vacia{color:var(--sec);opacity:.45;cursor:default;}

.ct-filtros{display:flex;align-items:center;gap:10px;margin-bottom:12px;}
.ct-filtros-lbl{font-size:var(--t-xs);color:var(--sec);}
.ct-filtros .ct-pills{margin-bottom:0;}
.ct-busc-tot{margin-left:auto;font-size:var(--t-xs);color:var(--sec);white-space:nowrap;}

/* Cabecera de la página abierta (letra, o resultados de búsqueda) */
.ct-cab-pagina{display:flex;align-items:baseline;gap:10px;padding:4px 2px 11px;
  border-bottom:1px solid var(--lin);margin-bottom:2px;}
.ct-cab-pagina .letra{font-size:var(--t-xl);font-weight:var(--p-medio);color:var(--navy);line-height:1;}
.ct-cab-pagina .t{font-size:var(--t-md);color:var(--navy);}
.ct-cab-pagina .s{font-size:var(--t-sm);color:var(--sec);}
.ct-cab-pagina i{font-size:var(--t-md);color:var(--sec);align-self:center;}

/* ---------- Clasificar en bloque ---------- */
#ct-vista-clasificar{display:none;}
#ct-vista-clasificar.on{display:block;}
.ct-clas-barra{display:flex;align-items:center;gap:10px;margin-bottom:14px;flex-wrap:wrap;}
.ct-clas-barra span{font-size:var(--t-sm);color:var(--sec);}
.ct-clas-barra select,.ct-clas-barra button{font-family:inherit;font-size:var(--t-sm);
  color:var(--navy);background:var(--ficha);border:1px solid var(--borde);
  border-radius:var(--r-sm);padding:7px 13px;cursor:pointer;}
#ct-clas-aplicar{background:var(--verde);color:var(--ficha);border-color:var(--verde);font-weight:var(--p-medio);}
.ct-clas-fila{display:flex;align-items:center;gap:12px;padding:9px 4px;
  border-bottom:1px solid var(--lin);cursor:pointer;}
.ct-clas-fila:last-child{border-bottom:none;}
.ct-clas-fila:hover{background:var(--gris-3);}
.ct-clas-fila input{width:17px;height:17px;accent-color:var(--verde);cursor:pointer;}
.ct-clas-fila .ct-txt{display:flex;flex-direction:column;}

/* ---------- Cuaderno de sitios ---------- */
.st-fila{display:flex;align-items:center;gap:12px;padding:11px 4px;
  border-bottom:1px solid var(--lin);cursor:pointer;}
.st-fila:last-child{border-bottom:none;}
.st-fila:hover{background:var(--gris-3);}
.st-ico{width:32px;height:32px;border-radius:var(--r-sm);background:var(--gris-4);
  color:var(--sec);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.ct-fila-txt{flex:1;min-width:0;}
.ct-fila-txt .nm{font-size:var(--t-md);color:var(--navy);}
.ct-fila-txt .sub{font-size:var(--t-sm);color:var(--sec);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ct-tag{font-size:var(--t-xs);color:var(--sec);background:var(--fondo);
  border-radius:var(--r-lg);padding:3px 10px;white-space:nowrap;}
.st-ir{font-size:var(--t-md);color:var(--verde);cursor:pointer;padding:4px;}

.ct-vacio{padding:44px 20px;text-align:center;}
.ct-vacio .ic{font-size:var(--t-xl);color:var(--sec);}
.ct-vacio .tit{font-size:var(--t-md);font-weight:var(--p-medio);color:var(--navy);margin-top:10px;}
.ct-vacio .sub{font-size:var(--t-sm);color:var(--sec);margin-top:6px;max-width:420px;
  margin-left:auto;margin-right:auto;line-height:1.6;}

/* ---------- Ficha de sitio ---------- */
.st-head{display:flex;align-items:center;gap:14px;padding-bottom:16px;border-bottom:1px solid var(--lin);}
.st-ico-g{width:52px;height:52px;border-radius:var(--r-md);background:var(--gris-4);
  color:var(--sec);display:flex;align-items:center;justify-content:center;font-size:var(--t-xl);}
.st-head-txt{flex:1;}
.st-head-txt .nm{font-size:var(--t-lg);color:var(--navy);}
.st-head-txt .url{font-size:var(--t-sm);color:var(--verde);margin-top:2px;}
.st-acciones{display:flex;gap:9px;padding:14px 0 16px;border-bottom:1px solid var(--lin);}
.st-acciones button{font-family:inherit;font-size:var(--t-sm);color:var(--navy);
  background:var(--ficha);border:1px solid var(--borde);border-radius:var(--r-sm);
  padding:8px 15px;cursor:pointer;display:inline-flex;align-items:center;gap:6px;}
.st-acciones button.pri{background:var(--verde-claro);color:var(--verde-hondo);border-color:var(--verde-claro);}
.st-sus{display:flex;align-items:center;gap:11px;padding:12px 15px;
  border:1px solid var(--verde-claro);background:var(--verde-suave);border-radius:var(--r-md);}
.st-sus > i{font-size:var(--t-md);color:var(--verde-hondo);}
.st-sus-txt{flex:1;}
.st-sus-txt .nm{font-size:var(--t-md);color:var(--navy);}
.st-sus-txt .sub{font-size:var(--t-sm);color:var(--sec);margin-top:1px;}
.st-ver-sus{font-family:inherit;font-size:var(--t-sm);color:var(--verde-hondo);
  background:none;border:none;cursor:pointer;}
.st-hist-fila{display:flex;gap:14px;padding:7px 0;align-items:baseline;}
.st-hist-fila .f{font-size:var(--t-xs);color:var(--sec);width:74px;flex-shrink:0;}
.st-hist-fila .t{font-size:var(--t-sm);color:var(--navy);line-height:1.6;flex:1;}
.st-hist-x{font-size:var(--t-sm);color:var(--sec);cursor:pointer;}
.st-hist-x:hover{color:var(--alerta);}
.st-hist-vacio{font-size:var(--t-sm);color:var(--sec);padding:4px 0;}
.ct-notas{font-size:var(--t-md);color:var(--navy);line-height:1.7;}
.ct-botonera{display:flex;gap:11px;padding-top:16px;border-top:1px solid var(--lin);}
.ct-botonera button{flex:1;font-family:inherit;font-size:var(--t-md);color:var(--navy);
  background:var(--ficha);border:1px solid var(--borde);border-radius:var(--r-sm);
  padding:11px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:7px;}
.ct-botonera button.pri{flex:2;background:var(--verde);color:var(--ficha);border-color:var(--verde);}

/* ---------- Formulario dentro de modal ---------- */
.modal-form{width:440px;text-align:left;max-height:80vh;overflow-y:auto;}
.modal-form h3{text-align:left;}
.modal-form-desc{font-size:var(--t-sm);color:var(--sec);margin:0 0 12px;}
.st-form{display:flex;flex-direction:column;gap:11px;}
.st-form label{display:flex;flex-direction:column;gap:4px;font-size:var(--t-xs);
  letter-spacing:.04em;color:var(--sec);}
.st-form input,.st-form select,.st-form textarea,.modal-form-cuerpo textarea{
  font-family:inherit;font-size:var(--t-md);color:var(--navy);background:var(--ficha);
  border:1px solid var(--borde);border-radius:var(--r-sm);padding:8px 11px;width:100%;}
.st-form input:focus,.st-form textarea:focus,.modal-form-cuerpo textarea:focus{
  outline:none;border-color:var(--verde);}
.st-form-aviso{display:flex;align-items:flex-start;gap:8px;font-size:var(--t-xs);
  color:var(--sec);background:var(--gris-4);border-radius:var(--r-sm);padding:9px 11px;line-height:1.5;}
.ct-r .val.apagado{color:var(--sec);font-style:italic;}