/* =====================================================================
   Estadísticas por año, tarifas y bonos, y equipo (0044–0046).
   Mismo vidrio que el resto; nada de colores nuevos: la marca para la
   intensidad de las tablas y el color de cada profesional solo en su punto.
   ===================================================================== */

/* ---------------------------------------------------------------- comunes */
.es-pro { display: inline-flex; align-items: center; gap: 8px; min-width: 0; }
.es-pro > i { flex: 0 0 auto; width: 10px; height: 10px; border-radius: 50%;
              box-shadow: 0 0 0 2px color-mix(in oklab, var(--card-bg) 80%, transparent); }
.eq-sub, .es-sub { color: var(--text-muted); font-size: 12.5px; font-weight: 400; }
.es-sub { display: block; margin-top: 2px; }
.mt-pestanas { flex-wrap: wrap; }
.sv-pestanas { margin: 6px 0 4px; }

/* ---------------------------------------------------------------- estadísticas */
.es-barra { display: flex; justify-content: flex-end; margin: 6px 0 2px; }
.es-anio { display: inline-flex; align-items: center; gap: 6px; padding: 3px; border-radius: 12px; background: var(--dash-bg); }
.es-anio strong { min-width: 52px; text-align: center; font-variant-numeric: tabular-nums; }
.es-anio .icono-btn { width: 32px; height: 32px; border: 0; border-radius: 9px; background: transparent; color: var(--text-dark);
                      font-size: 20px; line-height: 1; cursor: pointer; }
.es-anio .icono-btn:hover:not(:disabled) { background: var(--card-bg); }
.es-anio .icono-btn:disabled { opacity: .3; cursor: default; }
.es-cuerpo { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; min-width: 0; transition: opacity .15s ease; }
.es-cuerpo > * { min-width: 0; }
.es-cuerpo.es-cargando { opacity: .55; }

.es-bloque { padding: 6px 0 !important; overflow: hidden; min-width: 0; max-width: 100%; }
.es-scroll { overflow-x: auto; overscroll-behavior-x: contain; max-width: 100%; }
.es-matriz { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 13.5px; font-variant-numeric: tabular-nums; }
.es-matriz th, .es-matriz td { padding: 9px 8px; border-bottom: 1px solid var(--divider); white-space: nowrap; }
.es-matriz thead th { font-size: 12px; font-weight: 600; color: var(--text-muted); text-align: center; }
.es-matriz thead th:first-child, .es-matriz tbody th, .es-matriz tfoot th { text-align: left; }
.es-matriz tbody th, .es-matriz tfoot th, .es-matriz thead th:first-child {
  position: sticky; left: 0; z-index: 1; min-width: 190px; max-width: 260px; white-space: normal;
  background: color-mix(in oklab, var(--card-bg) 96%, transparent); padding-left: 16px; font-weight: 600;
}
.es-matriz td { text-align: center; min-width: 44px;
                background: color-mix(in oklab, var(--marca) var(--es-t, 0%), transparent); }
.es-matriz td:has(.es-cero) { background: transparent; }
.es-cero { color: var(--divider); color: color-mix(in oklab, var(--text-muted) 40%, transparent); }
.es-matriz .es-total { font-weight: 700; background: var(--dash-bg); padding-right: 16px; }
.es-matriz tfoot th, .es-matriz tfoot td { font-weight: 700; border-bottom: 0; background: var(--dash-bg); }
.es-matriz tbody tr:hover td, .es-matriz tbody tr:hover th { box-shadow: inset 0 1px 0 var(--divider), inset 0 -1px 0 var(--divider); }
.es-matriz small { font-weight: 400; }
/* 0144 · Citas por profesional: la psicóloga y cada mes se pulsan para ver sus citas. */
.es-det { border: 0; background: none; padding: 0; font: inherit; color: inherit; cursor: pointer; text-align: left; }
.es-det:hover { color: var(--accion); }
.es-det:focus-visible, .es-det-celda:focus-visible { outline: none; box-shadow: var(--focus); border-radius: 6px; }
.es-det-flecha { color: var(--text-muted); font-weight: 700; margin-left: 2px; }
.es-det-celda { border: 0; background: none; padding: 2px 6px; font: inherit; color: inherit; cursor: pointer; border-radius: 6px; }
.es-det-celda:hover { background: color-mix(in oklab, var(--accion) 14%, transparent); }
.es-det-resumen { margin: 4px 0 12px; }
.es-det-resumen .es-est { cursor: default; }
.es-det-tabla td { font-size: 13px; padding-top: 7px; padding-bottom: 7px; }
/* 0150 · Generado: el importe de cada sesión, a la derecha. */
.es-det-tabla .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.es-det-tabla tfoot th, .es-det-tabla tfoot td { font-size: 13px; border-top: 1px solid var(--divider); }
@media (max-width: 860px) {
  .es-det-tabla tfoot { display: block; margin-top: 10px; }
  .es-det-tabla tfoot tr { display: flex; justify-content: space-between; align-items: baseline; padding: 12px 15px; }
  .es-det-tabla tfoot th, .es-det-tabla tfoot td { display: block; padding: 0; border: 0; font-size: 15px; }
  .es-det-tabla tfoot td::before { content: none; }
}

.es-filtros { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.es-filtros select.campo { max-width: 280px; }
.es-estados { display: flex; flex-wrap: wrap; gap: 6px; }
.es-est { border: 1px solid var(--divider); background: var(--card-bg); color: var(--text-dark); font: inherit; font-size: 13px;
          padding: 6px 12px; border-radius: 999px; cursor: pointer; }
.es-est b { margin-left: 4px; font-variant-numeric: tabular-nums; color: var(--text-muted); }
.es-est.activo { background: var(--text-dark); color: var(--fondo); border-color: var(--text-dark); }
.es-est.activo b { color: inherit; opacity: .75; }
.es-est:focus-visible { outline: none; box-shadow: var(--focus); }
.es-cont td { min-width: 34px; padding: 9px 4px; }
.es-cont tbody th { min-width: 230px; }
.es-ultima { text-align: left !important; font-size: 12.5px; }
.es-ultima small { display: block; color: var(--text-muted); }

/* ---------------------------------------------------------------- tarifas y bonos */
.tf-cab { display: flex; gap: 14px; align-items: center; justify-content: space-between; margin: 10px 2px 12px; }
.tf-cab p { margin: 0; color: var(--text-muted); font-size: 14px; max-width: 760px; }
.tf-tabla td { font-variant-numeric: tabular-nums; }
.tabla tr.inactivo td { color: var(--text-muted); }

.tf-bonos { display: grid; gap: 8px; }
.tf-bono { display: grid; gap: 6px; padding: 10px 12px; border-radius: 12px; background: var(--dash-bg); list-style: none; }
.tf-bono.gastado { opacity: .7; }
.tf-bono-cab { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.tf-bono small { color: var(--text-muted); }
.tf-bono .btn-mini { justify-self: start; }
.tf-barra { display: flex; gap: 3px; }
.tf-barra i { flex: 1; height: 8px; border-radius: 4px; background: color-mix(in oklab, var(--marca) 16%, transparent); }
.tf-barra i.usada { background: var(--marca); }
.tf-barra i.reservada { background: color-mix(in oklab, var(--marca) 55%, transparent);
  background-image: repeating-linear-gradient(135deg, rgba(255,255,255,.45) 0 3px, transparent 3px 6px); }
.tf-cambiar { margin-left: 8px; vertical-align: middle; }
.tf-precio-form { margin: 4px 0 10px; }

/* ---------------------------------------------------------------- equipo */
.eq-grupo { border: 1px solid var(--divider); border-radius: 14px; padding: 10px 14px 12px; margin: 10px 0; display: grid; gap: 8px; }
.eq-grupo legend { padding: 0 6px; font-weight: 600; }
.eq-grupo [hidden] { display: none !important; }
.eq-colores { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.eq-color { width: 26px; height: 26px; border-radius: 50%; border: 0; cursor: pointer; padding: 0;
            box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .12); }
.eq-color.activo { box-shadow: 0 0 0 2px var(--card-bg), 0 0 0 4px var(--text-dark); }
.eq-color:focus-visible { outline: none; box-shadow: var(--focus); }
.eq-colores input[type=color] { width: 34px; height: 30px; padding: 0; border: 0; background: transparent; cursor: pointer; }
.eq-roles { display: grid; gap: 6px; }
.eq-rol { display: grid; grid-template-columns: auto 1fr; gap: 10px; align-items: start; padding: 8px 10px; border-radius: 12px;
          border: 1px solid var(--divider); cursor: pointer; }
.eq-rol:has(input:checked) { border-color: var(--accion); background: var(--accion-clara); }
.eq-rol input { margin-top: 3px; }
.eq-rol span { display: grid; gap: 1px; }
.eq-rol small { color: var(--text-muted); font-size: 12.5px; }
.eq-tabla td { vertical-align: top; }

@media (max-width: 860px) {
  /* Cinco pestañas no caben: se desplazan de lado sin ensanchar la pantalla. */
  .mt-cab, .mt-cab > div, .pl-cabecera-vista > div { min-width: 0; max-width: 100%; }
  .mt-pestanas { display: flex; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; max-width: 100%; }
  .mt-pestanas::-webkit-scrollbar { display: none; }
  .mt-pestana { flex: 0 0 auto; white-space: nowrap; }
  .es-barra { justify-content: stretch; }
  .es-anio { width: 100%; justify-content: space-between; }
  .es-matriz tbody th, .es-matriz tfoot th, .es-matriz thead th:first-child { min-width: 138px; max-width: 160px; padding-left: 12px; }
  .es-cont tbody th { min-width: 150px; }
  .es-filtros select.campo { max-width: none; width: 100%; }
  .es-estados { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; width: 100%; }
  .es-est { flex: 0 0 auto; }
  .tf-cab { flex-direction: column; align-items: stretch; }
  .eq-colores .eq-color { width: 32px; height: 32px; }
}

/* ---------------------------------------------------------------- información para el asistente (0047) */
.ia-ficha { display: grid; gap: 10px; max-width: 1000px; margin: 0 auto 20px; width: calc(100% - 40px); box-sizing: border-box; }
.ia-ficha textarea.campo { width: 100%; min-height: 360px; resize: vertical; line-height: 1.5;
                           font-size: 14px; padding: 14px 16px; }
.ia-ficha textarea.campo::placeholder { color: color-mix(in oklab, var(--text-muted) 70%, transparent); }
.ia-ficha-pie { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; color: var(--text-muted); }
.ia-ficha-pie small { font-size: 12.5px; font-variant-numeric: tabular-nums; }
@media (max-width: 860px) { .ia-ficha { margin: 0 14px 16px; } .ia-ficha textarea.campo { min-height: 300px; } }

/* ---------------------------------------------------------------- mi cuenta · apariencia (0048) */
#nav-avatar-btn { cursor: pointer; }
.ap-bloque { display: grid; gap: 10px; }
.ap-bloque h3 { margin: 0; font-size: 14px; font-weight: 600; }
.ap-colores { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.ap-color { position: relative; width: 34px; height: 34px; border-radius: 50%; border: 0; padding: 0; cursor: pointer;
            background: var(--c); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .12); }
.ap-color[aria-checked="true"], .ap-color.activo { box-shadow: 0 0 0 2px var(--card-bg, #fff), 0 0 0 4px var(--text-dark); }
.ap-color:focus-visible { outline: none; box-shadow: var(--focus); }
.ap-color-consulta { width: auto; min-width: 34px; padding: 0 12px; border-radius: 999px; color: #fff; font-size: 12.5px; font-weight: 600; }
.ap-color-consulta span { text-shadow: 0 1px 2px rgba(0, 0, 0, .25); }
.ap-color-libre { display: inline-grid; place-items: center; overflow: hidden;
                  background: conic-gradient(#f44, #fb3, #4c6, #3bd, #57f, #c5f, #f44); }
.ap-color-libre input { opacity: 0; position: absolute; inset: 0; width: 100%; height: 100%; cursor: pointer; }
.ap-banners { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 120px), 1fr)); gap: 10px; }
.ap-banner { display: grid; gap: 6px; padding: 6px; border-radius: 14px; border: 1px solid var(--divider);
             background: var(--card-bg, transparent); cursor: pointer; text-align: left; font: inherit; color: inherit; }
.ap-banner img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 9px; display: block; background: var(--dash-bg); }
.ap-banner span { font-size: 12.5px; color: var(--text-muted); padding: 0 2px 2px; }
.ap-banner[aria-checked="true"] { border-color: var(--marca); box-shadow: 0 0 0 2px color-mix(in oklab, var(--marca) 35%, transparent); }
.ap-banner[aria-checked="true"] span { color: var(--text-dark); font-weight: 600; }
.ap-banner:focus-visible { outline: none; box-shadow: var(--focus); }
.ap-bloque [data-subir] { justify-self: start; }
/* Panel 172 · Avisos del equipo: el interruptor con un texto largo, que se lee en dos líneas. */
.ap-aviso { display: flex; align-items: flex-start; gap: 12px; font-size: 14px; line-height: 1.45; color: var(--text-dark); cursor: pointer; }
.ap-aviso input { margin-top: 1px; }
.ap-aviso-pie { margin: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 12px; }
.ap-aviso-pie .btn-enlace { padding: 0; }
.ap-salir { padding-top: 12px; border-top: 1px solid var(--divider); }
.ap-salir .btn { justify-self: start; }
.confianza a { color: inherit; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: color-mix(in oklab, currentColor 45%, transparent); }
.confianza a:hover { text-decoration-color: currentColor; }
/* José Carlos (24/10): «Astra Automations» con su logo a la izquierda, que lleva a la web. */
.confianza { flex-wrap: wrap; column-gap: 18px; row-gap: 8px; padding: 0 16px; }
.confianza a.confianza-astra { display: inline-flex; align-items: center; gap: 7px; text-decoration: none; font-weight: 600; color: var(--text-dark); opacity: .78; }
.confianza a.confianza-astra img { height: 14px; width: auto; display: block; }
.confianza a.confianza-astra:hover, .confianza a.confianza-astra:focus-visible { opacity: 1; }
.confianza a.confianza-astra:focus-visible { outline: none; box-shadow: var(--focus); border-radius: 8px; }
html[data-theme="dark"] .confianza a.confianza-astra img { filter: brightness(1.25) saturate(1.1); }

/* ---------------------------------------------------------------- foto de la cuenta (panel 84) */
.avatar.con-foto { padding: 0; overflow: hidden; background: transparent; }
.avatar .avatar-foto { width: 100%; height: 100%; object-fit: cover; border-radius: inherit; display: block; }

/* 0052 · Reservas del asistente */
.ra-reglas { padding: 0 20px 20px; display: grid; gap: 16px; max-width: 860px; }
.ra-dias { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-weight: 600; }
.ra-dias input { width: 84px; text-align: center; }
.ra-pros { border: 1px solid var(--divider); border-radius: 14px; padding: 12px 14px 14px; margin: 0; display: flex; flex-wrap: wrap; gap: 8px 18px; }
.ra-pros legend { padding: 0 6px; font-weight: 600; }
.ra-pros legend small { font-weight: 400; color: var(--text-muted); }
.ra-pro, .ra-suyo { display: inline-flex; align-items: center; gap: 7px; cursor: pointer; }

/* 0055 · Precios del asistente y áreas de cada profesional */
.pa-lista { padding: 0 20px 20px; display: grid; gap: 10px; max-width: 1040px; }
.pa-lista h3 { margin: 6px 0 0; font-size: 14px; }
.pa-fila { display: grid; grid-template-columns: minmax(200px, 1fr) 130px 120px 150px 88px; gap: 8px; align-items: center; }
.pa-fila[data-descuento] { grid-template-columns: minmax(160px, .8fr) 110px 190px minmax(160px, 1fr) 88px; }
.pa-importe, .pa-sesiones { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.pa-importe input { width: 90px; text-align: right; font-variant-numeric: tabular-nums; }
.pa-sesiones input { width: 64px; text-align: center; }
/* La casilla de sesiones guarda su sitio aunque no sea un bono: así las filas se alinean. */
.pa-sesiones.pa-oculto { visibility: hidden; }
.pa-fila > button { justify-self: start; }
.pa-area { display: grid; grid-template-columns: 200px 1fr auto; gap: 10px; align-items: center; }
@media (max-width: 860px) {
  .pa-lista { padding: 0 14px 16px; }
  .pa-fila, .pa-fila[data-descuento] { grid-template-columns: 1fr 1fr; padding-bottom: 12px;
    border-bottom: 1px solid var(--divider); }
  .pa-fila > input[data-concepto], .pa-fila > input[data-nota] { grid-column: 1 / -1; }
  .pa-sesiones.pa-oculto { display: none; }
  .pa-area { grid-template-columns: 1fr auto; }
  .pa-area > label { grid-column: 1 / -1; }
}

/* Panel 113 · Mejora del asistente */
.ma-cuerpo { display: grid; gap: 18px; padding: 18px 2px 40px; max-width: 1320px; }
.ma-cab p { max-width: 70ch; }
.ma-pestana { display: grid; gap: 14px; align-content: start; }
.ma-pestana[hidden] { display: none; }
.ma-sabe { gap: 18px; }
.ma-filtros { display: flex; flex-wrap: wrap; gap: 6px; }
.ma-filtro {
  border: 1px solid var(--divider); background: transparent; color: var(--text-muted);
  border-radius: 999px; padding: 6px 12px; font: inherit; font-size: .86rem; cursor: pointer;
}
.ma-filtro b { font-weight: 700; margin-left: 2px; font-variant-numeric: tabular-nums; }
.ma-filtro.activo { background: var(--marca); border-color: var(--marca); color: #fff; }
.ma-filtro:focus-visible { outline: none; box-shadow: var(--focus); }
.ma-grupo { border-radius: var(--r-lg, 18px); padding: 16px 18px 6px; }
.ma-grupo h3 { margin: 0; font-size: 1rem; }
.ma-grupo h3 small { font-weight: 500; color: var(--text-muted); font-size: .8rem; margin-left: 6px; }
.ma-grupo header p { margin: 4px 0 0; color: var(--text-muted); font-size: .86rem; max-width: 80ch; }
.ma-temas { list-style: none; margin: 10px 0 0; padding: 0; }
.ma-tema {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 16px; align-items: center;
  padding: 12px 2px; border-top: 1px solid var(--divider);
}
.ma-tema-texto { display: grid; gap: 2px; min-width: 0; }
.ma-tema-texto strong { font-size: .98rem; color: var(--text-dark); overflow-wrap: anywhere; }
.ma-tema-texto span { font-size: .82rem; color: var(--text-muted); }
.ma-tema-texto small { font-size: .78rem; color: var(--text-muted); }
.ma-tema.revisado .ma-tema-texto strong { color: var(--text-muted); }
.ma-volvio { font-style: normal; color: #C0763B; font-weight: 600; margin-left: 6px; }
.ma-tema-botones { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
.ma-vacio { border-radius: var(--r-lg, 18px); padding: 22px 20px; }
.ma-vacio p { margin: 4px 0 0; color: var(--text-muted); font-size: .9rem; }
.ma-leyenda { display: flex; gap: 14px; margin: 6px 0 0; font-size: .8rem; color: var(--text-muted); }
.ma-leyenda i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 5px; vertical-align: -1px; background: var(--marca); }
.ma-leyenda i.eq { background: color-mix(in oklab, var(--text-dark) 78%, transparent); }
.ma-barras { display: flex; align-items: flex-end; gap: 4px; height: 170px; margin-top: 14px; padding-bottom: 18px; }
.ma-barras.densas { gap: 1px; padding-bottom: 0; }
.ma-barra { flex: 1 1 0; min-width: 0; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; position: relative; }
.ma-barra i {
  display: flex; flex-direction: column; justify-content: flex-end; width: 100%; max-width: 26px; min-height: 2px;
  background: color-mix(in oklab, var(--marca) 75%, transparent); border-radius: 5px 5px 2px 2px; overflow: hidden;
}
.ma-barra b { display: block; width: 100%; flex: none; background: color-mix(in oklab, var(--text-dark) 78%, transparent); }
.ma-barra span { position: absolute; bottom: -18px; font-size: .68rem; color: var(--text-muted); font-variant-numeric: tabular-nums; }
@media (max-width: 720px) {
  .ma-tema { grid-template-columns: 1fr; }
  .ma-tema-botones { justify-content: flex-start; }
  .ma-barra span { display: none; }
  .ma-barras { padding-bottom: 0; gap: 2px; }
}

/* Panel 114 · Consumo del asistente */
.ma-consumo-mes h3 { margin: 0; }
.ma-consumo-cifra { display: flex; align-items: baseline; gap: 10px; margin: 8px 0 10px; }
.ma-consumo-cifra strong { font-size: 2.4rem; line-height: 1; font-weight: 700; color: var(--text-dark); font-variant-numeric: tabular-nums; }
.ma-consumo-cifra span { color: var(--text-muted); font-size: .95rem; }
.ma-consumo-barra { position: relative; height: 12px; border-radius: 999px; background: var(--dash-bg, rgba(0,0,0,.06)); margin-bottom: 10px; }
.ma-consumo-barra i { display: block; height: 100%; border-radius: inherit; background: var(--marca); transition: width .4s ease; }
.ma-consumo-barra b { position: absolute; top: -4px; bottom: -4px; width: 2px; margin-left: -1px; background: var(--text-dark); opacity: .55; border-radius: 2px; }
.ma-consumo-mes.aviso { border-left: 3px solid #C0763B; }
.ma-consumo-mes.aviso .ma-consumo-barra i { background: #C0763B; }
.ma-consumo-mes.limite { border-left: 3px solid var(--peligro); }
.ma-consumo-mes.limite .ma-consumo-barra i { background: var(--peligro); }
.ma-consumo-mes.limite .ma-consumo-cifra strong { color: var(--peligro); }
.ma-barras-consumo .ma-barra i { background: color-mix(in oklab, var(--marca) 75%, transparent); }
/* 0065 · WhatsApp encima de la IA, en la misma barra (verde WhatsApp) */
.ma-barras-consumo .ma-barra i { position: relative; overflow: hidden; }
.ma-barras-consumo .ma-barra i em { position: absolute; left: 0; right: 0; top: 0; display: block; background: #25A35A; opacity: .85; }
.ma-consumo-reparto { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 0 0 8px; font-size: .9rem; color: var(--text-muted); }
.ma-consumo-reparto span { display: inline-flex; align-items: center; gap: 6px; }
.ma-consumo-reparto strong { color: var(--text-dark); font-variant-numeric: tabular-nums; }
.ma-consumo-reparto i { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }
.ma-consumo-reparto i.ia { background: color-mix(in oklab, var(--marca) 75%, transparent); }
.ma-consumo-reparto i.wa { background: #25A35A; }
.ma-detalle { margin-top: 10px; }
.ma-detalle summary { cursor: pointer; font-size: .86rem; color: var(--text-muted); }

/* Panel 120 · Presentaciones de los servicios */
.pr-lista { padding: 0 20px 20px; display: grid; gap: 14px; max-width: 1040px; }
/* Panel 347 · En pantallas grandes, el texto y las presentaciones centrados (antes, pegados a la izquierda). */
.pr-lista { margin-inline: auto; width: 100%; box-sizing: border-box; }
/* Panel 347 · José Carlos (19/10): «centra todos los contenidos de cada módulo adaptándolos a cada pantalla». Desde
   el Panel 320 las secciones ocupan todo el ancho; lo que quedaba pegado a la izquierda eran los bloques de dentro con
   ancho máximo (textos de ayuda, cuadros de texto, listas de reglas). Ahora van centrados en su sección y, en pantallas
   estrechas, ocupan todo el ancho con su margen. */
.pr-intro, .bloque-centrado { margin: 0 auto 14px; width: calc(100% - 40px); max-width: 1000px; box-sizing: border-box; }
.bloque-centrado-arriba { margin: 14px auto 0; }
.pr-lista, .ra-reglas, .pa-lista, .qe, .rg-lista { margin-inline: auto; width: 100%; box-sizing: border-box; }
.rg-lista { width: calc(100% - 40px); }
.pr-lista, .pa-lista, .ia-ficha { max-width: 1040px; }
.ra-reglas, .qe, .rg-lista { max-width: 1000px; }
@media (max-width: 860px) {
  .pr-intro, .bloque-centrado, .ia-ficha, .rg-lista { width: calc(100% - 28px); }
}
.pr-campo { display: grid; gap: 6px; }
.pr-campo textarea.campo { width: 100%; min-height: 320px; font-size: .92rem; line-height: 1.5; resize: vertical; padding: 12px 14px; }
@media (max-width: 860px) { .pr-lista { padding: 0 14px 16px; } .pr-campo textarea.campo { min-height: 280px; } }
.pr-campo small { color: var(--text-muted); font-size: .78rem; }
.pr-campo small.pr-aviso-mal { color: #C0763B; font-weight: 600; }

/* ------------------------------------------------------------------ cobros (0062) */
.cb-form { display: grid; gap: 8px; margin: -2px 0 10px; }
.cb-formas { display: flex; flex-wrap: wrap; gap: 6px; }
.cb-formas .chip-filtro { cursor: pointer; font: inherit; font-size: 13px; }
.cb-formas .chip-filtro:disabled { opacity: .5; cursor: default; }
.cb-importe { display: grid; gap: 4px; max-width: 260px; }
.cb-importe label { font-size: 13px; color: var(--text-muted); }
.cb-pie { display: flex; gap: 14px; }
.cb-pie button { border: 0; background: none; padding: 0; font: inherit; font-size: 13px; color: var(--accion-oscura, var(--marca-oscura)); cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.cb-pie button.peligro { color: var(--peligro); }
.cb-meses { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 14px; }
.cb-meses .es-est:disabled { opacity: .35; cursor: default; }
.cb-barra { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between; margin: 16px 0 10px; }
.cb-reparto { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 13px; color: var(--text-muted); margin-top: 4px; }
.cb-reparto b { color: var(--text-dark); font-variant-numeric: tabular-nums; }
.mt-tarjeta.cb-aviso .mt-t-valor { color: var(--aviso); }
.cb-tabla td { vertical-align: top; }
.cb-tabla td[data-col="Precio"] { font-variant-numeric: tabular-nums; white-space: nowrap; }
select.cb-sel { height: 34px; padding: 0 30px 0 10px; font-size: 13px; min-width: 150px; }
select.cb-sel.falta { border-color: var(--aviso); background-color: var(--aviso-claro); }
select.cb-sel.hecho { border-color: var(--marca); }
.tf-bono-pago { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: space-between; }
.tf-bono-pago label { display: flex; gap: 8px; align-items: center; font-size: 13px; color: var(--text-muted); }
/* 0075 · Condiciones del bono */
.tf-bono-cond { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: space-between; margin-top: 6px; }
.tf-bono-cond:empty { display: none; }
.tf-cond-falta { color: var(--aviso); font-weight: 600; }
.tf-condiciones { display: flex; gap: 8px; align-items: flex-start; font-size: 13.5px; margin: 4px 0 10px; line-height: 1.4; }
.tf-condiciones input { margin-top: 3px; flex: none; }
.tf-condiciones small { display: block; color: var(--text-muted); font-size: 12.5px; margin-top: 2px; }
@media (max-width: 860px) {
  .cb-barra { flex-direction: column; align-items: stretch; }
  .cb-barra .btn { width: 100%; }
  select.cb-sel { width: 100%; }
}
.cb-bloque { display: block; }

/* Panel 214 (0097) · Cobros de un paciente: en su ficha y en Estadísticas → Por paciente. */
.cp-resumen { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 6px 0 12px; }
.cp-dato { display: grid; gap: 2px; align-content: start; padding: 12px 14px; border-radius: 14px; background: var(--dash-bg); min-width: 0; }
.cp-dato span { font-size: 11.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--text-muted); }
.cp-dato strong { font-size: 16px; font-weight: 650; font-variant-numeric: tabular-nums; }
.cp-dato small { font-size: 12.5px; color: var(--text-muted); }
.cp-dato.cp-aviso { background: var(--aviso-claro); }
.cp-dato.cp-aviso strong { color: var(--aviso); }
.cp-titulo { margin: 14px 0 6px; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--text-muted); }
.cp-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.cp-lista li { display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: baseline;
               padding: 8px 12px; border-radius: 12px; background: var(--aviso-claro); font-size: 13.5px; }
.cp-lista li span:first-child { color: var(--text-muted); white-space: nowrap; }
.cp-lista li b { font-variant-numeric: tabular-nums; white-space: nowrap; }
.cp-tabla td { font-size: 13.5px; padding-top: 8px; padding-bottom: 8px; vertical-align: top; }
.cp-tabla td[data-col="Importe"] { font-variant-numeric: tabular-nums; white-space: nowrap; }
.cp-nota { margin: 10px 0 0; font-size: 12.5px; color: var(--text-muted); }
.cp-intro { margin: 0 0 10px; color: var(--text-muted); }
.cp-buscar .sp { max-width: 520px; }
.mt-bloque.es-bloque.cp-buscar, .mt-bloque.es-bloque.cp-resultado { padding: 18px 20px !important; }
/* Panel 259 · Sofía (14/10): la lista de pacientes del buscador quedaba cortada por el bloque (overflow: hidden). */
.mt-bloque.es-bloque.cp-buscar { overflow: visible; position: relative; z-index: 6; }
.cp-resultado { margin-top: 12px; }
.cp-cab { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.cp-cab h2 { margin: 0; font-size: 20px; }
.cp-formas { display: flex; flex-wrap: wrap; gap: 4px; }
/* 0097 · Pago repartido, en el detalle de la cita. */
.cb-reparto-form { display: grid; gap: 8px; margin-top: 8px; padding: 12px; border-radius: 14px; background: var(--dash-bg); }
.cb-reparto-tit { margin: 0; font-size: 13px; font-weight: 650; }
.cb-parte { display: grid; grid-template-columns: minmax(0, 1fr) 120px 40px; gap: 6px; align-items: center; }
.cb-parte .campo { height: 38px; }
.cb-parte .icono-btn { width: 38px; height: 38px; }
.cb-parte .icono-btn:disabled { opacity: .35; cursor: default; }
.cb-reparto-suma { margin: 0; font-size: 13px; color: var(--text-muted); font-variant-numeric: tabular-nums; }
.cb-reparto-suma.cb-descuadre { color: var(--aviso); font-weight: 600; }
.cb-reparto-form .enlace-btn { justify-self: start; border: 0; background: none; padding: 0; font: inherit; font-size: 13px;
  color: var(--accion-oscura, var(--marca-oscura)); cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.cb-reparto-form .enlace-btn[hidden] { display: none; }
@media (max-width: 600px) {
  .mt-bloque.es-bloque.cp-buscar, .mt-bloque.es-bloque.cp-resultado { padding: 14px !important; }
  .cp-resumen { grid-template-columns: 1fr; gap: 6px; }
  .cp-lista li { grid-template-columns: 1fr auto; }
  .cp-lista li span:first-child { grid-column: 1 / -1; }
}

/* ------------------------------------------------------------------ elegir o dar de alta paciente (0063) */
.sp-busca { position: relative; display: grid; gap: 6px; }
.sp-lista { position: absolute; top: 46px; left: 0; right: 0; z-index: 30; margin: 0; padding: 4px; list-style: none;
  max-height: 280px; overflow-y: auto; border-radius: 14px; border: 1px solid var(--divider);
  background: var(--fondo); box-shadow: var(--sombra-flota); }
.sp-lista li { display: grid; gap: 1px; padding: 8px 10px; border-radius: 10px; cursor: pointer; }
.sp-lista li:hover, .sp-lista li:focus { background: var(--dash-bg); outline: none; }
.sp-lista li small { color: var(--text-muted); font-size: 12.5px; }
.sp-lista li.inactiva strong { color: var(--text-muted); }
.sp-lista li.sp-nada { cursor: default; color: var(--text-muted); font-size: 13px; }
.sp-lista li.sp-nada:hover { background: none; }
.enlace-sp { justify-self: start; border: 0; background: none; padding: 0; font: inherit; font-size: 13px; font-weight: 600;
  color: var(--accion-oscura, var(--marca-oscura)); cursor: pointer; }
.enlace-sp:hover { text-decoration: underline; text-underline-offset: 2px; }
.sp-chip { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; padding: 9px 12px; border-radius: 12px;
  background: var(--marca-clara); border: 1px solid var(--marca); }
.sp-chip small { color: var(--text-muted); font-size: 12.5px; }
.sp-chip .sp-inactiva { color: var(--aviso); }
.sp-quitar { margin-left: auto; width: 26px; height: 26px; border: 0; border-radius: 8px; background: transparent;
  font-size: 18px; line-height: 1; color: var(--text-muted); cursor: pointer; }
.sp-quitar:hover { background: rgba(0, 0, 0, .06); color: var(--text-dark); }
.sp-alta { display: grid; gap: 10px; padding: 12px; border-radius: 14px; background: var(--dash-bg); }
.sp-dos { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.pa-nueva { margin-left: auto; }
@media (max-width: 860px) {
  .sp-dos { grid-template-columns: 1fr; }
  .pa-nueva { margin-left: 0; width: 100%; }
}
.eq-invitar { display: block; margin-top: 6px; }
.eq-error { display: block; margin-top: 4px; color: var(--peligro); max-width: 260px; }

/* 0073 · Ajustes → Quién escribe */
.qe { padding: 0 20px 20px; display: grid; gap: 16px; max-width: 980px; }
.qe-interruptor { display: inline-flex; align-items: center; gap: 9px; font-weight: 600; cursor: pointer; width: fit-content; }
.qe-interruptor input { width: 18px; height: 18px; accent-color: var(--marca); }
.qe-ejemplo { display: grid; gap: 8px; padding: 14px; border-radius: 16px; background: color-mix(in oklab, var(--marca) 7%, var(--card-bg)); border: 1px solid var(--divider); }
.qe-burbuja { justify-self: start; max-width: min(460px, 100%); padding: 8px 12px; border-radius: 10px 10px 10px 3px; background: var(--card-bg);
  box-shadow: 0 1px 1px rgba(0,0,0,.06); display: grid; gap: 2px; font-size: .9rem; }
.qe-burbuja b { font-weight: 700; }
.qe-burbuja.ia { background: color-mix(in oklab, #25D366 12%, var(--card-bg)); }
.qe-campos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 18px; }
.qe-campos label { display: grid; gap: 5px; font-weight: 600; font-size: .9rem; }
.qe-campos small, .qe-sale { font-weight: 400; color: var(--text-muted); font-size: .78rem; }
.qe-tabla td { vertical-align: top; }
.qe-tabla .campo { width: 100%; max-width: 320px; }
.qe-sale { display: block; margin-top: 4px; }
@media (max-width: 760px) { .qe { padding: 0 14px 16px; } .qe-campos { grid-template-columns: minmax(0, 1fr); } }

/* 0075 · El texto de cada aviso, en Ajustes → Avisos automáticos */
.av-texto { margin-top: 6px; }
.av-texto summary { cursor: pointer; font-size: 13px; color: var(--accion); }
.av-texto small { display: block; color: var(--text-muted); margin: 6px 0; }
.av-texto textarea { width: 100%; min-width: 260px; min-height: 200px; font-size: 13.5px; line-height: 1.45; resize: vertical; }

/* 0076 · Fotos del equipo: en Equipo y en el avatar del menú */
.avatar .avatar-foto { object-position: 50% 22%; }
.eq-foto { width: 34px; height: 34px; box-shadow: 0 0 0 2px var(--card-bg); }
.es-pro .eq-foto + i { display: none; }

/* 0077 · Cambiar la foto: el bloque, el recorte y el visor */
.fe-bloque { display: flex; gap: 16px; align-items: center; padding: 14px; margin-bottom: 14px;
  border: 1px solid var(--divider); border-radius: 16px; background: var(--dash-bg); }
.fe-avatar { flex: none; width: 76px; height: 76px; border-radius: 50%; border: 0; padding: 0; overflow: hidden; cursor: zoom-in;
  background: var(--c); color: #fff; font: 600 24px/1 var(--font-ui); display: grid; place-items: center;
  box-shadow: 0 0 0 3px var(--card-bg), 0 0 0 5px var(--c); }
.fe-avatar:disabled { cursor: default; opacity: 1; }
.fe-avatar img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 22%; display: block; }
.fe-texto { display: grid; gap: 4px; min-width: 0; }
.fe-texto small { color: var(--text-muted); font-size: 12.5px; }
.fe-acciones { display: flex; gap: 12px; align-items: center; margin-top: 4px; flex-wrap: wrap; }
img.pro-foto { cursor: zoom-in; }
.ag-menu img.pro-foto { cursor: inherit; }

.rc-fondo, .vz-fondo { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center; padding: 16px;
  background: rgba(8, 20, 22, .62); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.rc-caja { width: min(420px, 100%); background: var(--card-bg); color: var(--text-dark); border-radius: 22px; padding: 20px;
  box-shadow: var(--sombra-flota); display: grid; gap: 12px; }
:root[data-theme="dark"] .rc-caja { background: #16262a; color: #e8f0f0; }
.rc-caja h3 { margin: 0; font-size: 18px; }
.rc-ayuda { margin: 0; font-size: 13px; color: var(--text-muted); }
.rc-escena { position: relative; width: 100%; aspect-ratio: 1; border-radius: 14px; overflow: hidden; background: #111;
  touch-action: none; cursor: grab; user-select: none; }
.rc-escena:active { cursor: grabbing; }
.rc-escena canvas { width: 100%; height: 100%; display: block; }
.rc-mascara { position: absolute; inset: 0; border-radius: 50%; pointer-events: none;
  box-shadow: 0 0 0 999px rgba(0, 0, 0, .55); outline: 2px solid rgba(255, 255, 255, .85); outline-offset: -1px; }
.rc-zoom { display: flex; align-items: center; gap: 10px; font-size: 18px; color: var(--text-muted); }
.rc-zoom input { flex: 1; accent-color: var(--marca); }
.rc-acciones { display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }

.vz-fondo { cursor: zoom-out; }
.vz-caja { margin: 0; display: grid; gap: 12px; justify-items: center; }
.vz-caja img { width: min(440px, 86vw); max-height: 78vh; object-fit: contain; border-radius: 22px;
  box-shadow: 0 30px 80px -20px rgba(0, 0, 0, .6), 0 0 0 4px rgba(255, 255, 255, .9); background: #fff; }
.vz-caja figcaption { color: #fff; font: 600 18px/1.3 var(--font-ui); text-shadow: 0 1px 8px rgba(0, 0, 0, .5); }
.vz-cerrar { position: fixed; top: 14px; right: 16px; width: 44px; height: 44px; border-radius: 50%; border: 0;
  background: rgba(255, 255, 255, .16); color: #fff; font-size: 28px; line-height: 1; cursor: pointer; }

/* Panel 162 · Lo que falta por hacer (Inicio) */
.pendientes { border-radius: 22px; padding: 16px 18px; margin: 0 0 18px; display: grid; gap: 8px; }
.pd-cab { display: flex; align-items: center; gap: 10px; }
.pd-cab h2 { margin: 0; font-size: 17px; }
.pd-total { min-width: 26px; height: 26px; padding: 0 8px; border-radius: 999px; display: grid; place-items: center;
  background: var(--aviso); color: #fff; font-weight: 700; font-size: 13px; }
.pd-grupo { border-top: 1px solid var(--divider); padding: 6px 0; }
.pd-grupo summary { cursor: pointer; display: grid; grid-template-columns: auto auto 1fr; gap: 4px 10px; align-items: center; padding: 6px 0; list-style: none; }
.pd-grupo summary::-webkit-details-marker { display: none; }
.pd-grupo summary::before { content: "›"; font-size: 18px; color: var(--text-muted); transition: transform .15s; grid-row: 1; }
.pd-grupo[open] summary::before { transform: rotate(90deg); }
.pd-titulo { font-weight: 600; grid-row: 1; }
.pd-n { grid-row: 1; justify-self: start; min-width: 22px; height: 22px; padding: 0 7px; border-radius: 999px; display: grid; place-items: center;
  background: var(--aviso-claro); color: var(--aviso); font-weight: 700; font-size: 12.5px; }
.pd-grupo summary small { grid-column: 2 / -1; color: var(--text-muted); font-size: 12.5px; }
.pd-grupo ul { list-style: none; margin: 4px 0 6px; padding: 0; display: grid; gap: 6px; }
.pd-grupo li { display: flex; gap: 10px; align-items: center; justify-content: space-between; flex-wrap: wrap;
  padding: 8px 10px; border-radius: 12px; background: var(--dash-bg); transition: opacity .4s, transform .4s; }
.pd-grupo li.pd-hecho { opacity: 0; transform: translateX(16px); }
/* Panel 221 · Lo que aparece solo al refrescarse la lista se ilumina un momento (y, si su grupo está cerrado, su número). */
.pd-grupo li.pd-nueva { animation: pd-nueva 2.6s ease-out; }
.pd-con-nuevas:not([open]) .pd-n { animation: pd-nueva-n 2.6s ease-out; }
@keyframes pd-nueva { 0%, 40% { background: color-mix(in oklab, var(--aviso) 16%, var(--dash-bg));
  box-shadow: inset 0 0 0 1.5px color-mix(in oklab, var(--aviso) 45%, transparent); } 100% { background: var(--dash-bg); box-shadow: inset 0 0 0 1.5px transparent; } }
@keyframes pd-nueva-n { 0%, 40% { box-shadow: 0 0 0 4px color-mix(in oklab, var(--aviso) 30%, transparent); } 100% { box-shadow: 0 0 0 4px transparent; } }
@media (prefers-reduced-motion: reduce) { .pd-grupo li.pd-nueva, .pd-con-nuevas .pd-n { animation: none; } }
.pd-que { display: grid; min-width: 0; }
.pd-que small { color: var(--text-muted); font-size: 12.5px; }
.pd-acc { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.pd-acc .cb-sel { min-width: 150px; }
.pd-mas { margin: 0; font-size: 13px; color: var(--text-muted); }
.pd-al-dia { margin: 0; color: var(--text-muted); font-size: 14px; }
.pd-al-dia span { color: #1f8a4c; font-weight: 700; margin-right: 4px; }
.pendientes:has(.pd-al-dia) { padding: 12px 18px; }
.pd-ver { margin: 0 0 6px 2px; font-size: 13px; }

/* Panel 162 · Despachos y alquileres */
.dp-cab { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; flex-wrap: wrap; }
.dp-barra { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; flex-wrap: wrap; }
.dp-fecha { margin-left: 6px; font-size: 16px; }
.dp-fecha::first-letter { text-transform: uppercase; }
.dp-scroll { overflow-x: auto; border-radius: 20px; padding: 0 0 10px; }
.dp-rejilla { display: grid; min-width: max-content; }
.dp-esquina, .dp-cab-col { position: sticky; top: 0; z-index: 2; background: var(--card-bg); border-bottom: 1px solid var(--divider); }
.dp-cab-col { padding: 10px 12px; display: grid; border-left: 1px solid var(--divider); }
.dp-cab-col small { color: var(--text-muted); font-size: 12px; }
.dp-horas { position: relative; }
.dp-horas span { position: absolute; right: 8px; transform: translateY(-50%); font-size: 11.5px; color: var(--text-muted); font-variant-numeric: tabular-nums; }
.dp-col { position: relative; border-left: 1px solid var(--divider); cursor: copy; }
.dp-linea { position: absolute; left: 0; right: 0; border-top: 1px solid var(--divider); }
.dp-bloque { position: absolute; left: 4px; right: 4px; border-radius: 10px; padding: 4px 8px; overflow: hidden; display: grid; align-content: start;
  font-size: 12px; line-height: 1.3; text-align: left; cursor: default; }
.dp-bloque strong { font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.dp-bloque span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--text-muted); }
.dp-cita { background: color-mix(in oklab, var(--c) 16%, var(--card-bg)); box-shadow: inset 3px 0 0 var(--c); }
/* Panel 369 · La cita se pulsa para abrirla (y cambiarla de despacho). */
button.dp-cita { border: 0; font-family: inherit; color: var(--text-dark); cursor: pointer; }
button.dp-cita:hover, button.dp-cita:focus-visible { background: color-mix(in oklab, var(--c) 26%, var(--card-bg)); }
button.dp-cita:focus-visible { outline: none; box-shadow: inset 3px 0 0 var(--c), var(--focus); }
.dp-alquiler { z-index: 1; border: 1px dashed color-mix(in oklab, var(--aviso) 70%, transparent); cursor: pointer; font: inherit; color: var(--text-dark);
  background: repeating-linear-gradient(135deg, var(--aviso-claro) 0 6px, color-mix(in oklab, var(--aviso-claro) 40%, transparent) 6px 12px); }
.dp-alquiler strong { color: var(--aviso); }
.dp-leyenda { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin-top: 10px; }
.dp-leyenda i { display: inline-block; width: 18px; height: 10px; border-radius: 3px; margin-left: 6px; }
.dp-ley-cita { background: color-mix(in oklab, var(--marca) 20%, transparent); box-shadow: inset 3px 0 0 var(--marca); }
/* Panel 225 · Online desde la consulta: a rayas finas, no ocupa el despacho. */
.dp-online { background: repeating-linear-gradient(135deg, color-mix(in oklab, var(--c) 10%, var(--card-bg)) 0 5px, var(--card-bg) 5px 10px);
  box-shadow: inset 3px 0 0 var(--c); outline: 1px dashed color-mix(in oklab, var(--c) 55%, transparent); outline-offset: -1px; }
.dp-ley-online { background: repeating-linear-gradient(135deg, color-mix(in oklab, var(--marca) 25%, transparent) 0 3px, transparent 3px 6px);
  border: 1px dashed var(--marca); }
.dp-ley-alq { background: repeating-linear-gradient(135deg, var(--aviso-claro) 0 3px, transparent 3px 6px); border: 1px dashed var(--aviso); }
.dp-lista { margin-top: 18px; border-radius: 20px; padding: 16px 18px; }
.dp-lista h2 { font-size: 16px; margin: 6px 0 8px; }
.dp-lista ul { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 6px; }
.dp-lista li { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 12px; background: var(--dash-bg); }
.dp-lista li span { display: grid; min-width: 0; }
.dp-lista li small { color: var(--text-muted); font-size: 12.5px; }
/* 0084 · tarifas y el resumen del mes */
.dp-cab-botones { display: flex; gap: 8px; flex-wrap: wrap; }
.dp-mes-cab { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 8px; }
.dp-mes-cab h2 { margin: 0; }
.dp-mes-nav { display: flex; align-items: center; gap: 8px; }
.dp-mes-nav strong { min-width: 150px; text-align: center; }
.dp-tarifas td small, .dp-tarifas th small { color: var(--text-muted); font-weight: 500; }
.dp-total { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 10px 2px 0; padding-top: 10px; border-top: 1px solid var(--divider); }
.dp-total span { color: var(--text-muted); }
/* 0223 · Pagos de alquiler apuntados a mano */
.dp-total-pagos { border-top: 0; padding-top: 0; margin-top: 4px; }
.dp-col-pago { white-space: nowrap; }
.dp-pagar { display: inline-flex; gap: 4px; flex-wrap: wrap; }
.dp-pagar .btn-mini { padding: 3px 8px; font-size: 12px; }
.dp-pagado { display: inline-flex; align-items: baseline; gap: 6px; color: var(--success, #15803d); font-weight: 600; }
.dp-pagado small { color: var(--text-muted); font-weight: 400; }
.dp-pago-quitar { border: 0; background: none; color: var(--text-muted); cursor: pointer; font-size: 16px; line-height: 1; padding: 2px 6px; border-radius: 6px; }
.dp-pago-quitar:hover { background: var(--divider); color: var(--text); }
@media (max-width: 640px) { .dp-col-pago { white-space: normal; } }
.dp-tarifas td:nth-child(n+2), .dp-tarifas th:nth-child(n+2) { white-space: nowrap; }
.dp-tipo { display: flex; }
.dp-tipo button { flex: 1; padding: 0 8px; white-space: nowrap; }
.dp-solo-dia, .dp-saltos { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; padding: 10px 12px; border-radius: 12px;
  background: var(--aviso-claro); margin-bottom: 12px; font-size: 13px; }
.dp-solo-dia strong::first-letter { text-transform: uppercase; }
.dp-solo-dia strong { display: inline-block; }
.dp-choques { padding: 10px 12px; border-radius: 12px; background: var(--peligro-claro); color: var(--peligro); font-size: 13.5px; display: grid; gap: 6px; }
.dp-choques ul { margin: 0; padding-left: 18px; color: var(--text-dark); }
:root[data-theme="dark"] .dp-alquiler { color: #e8f0f0; }

/* 0081 · Respuestas guardadas (Ajustes) */
.rg-lista { list-style: none; margin: 0 auto 18px; padding: 0; display: grid; gap: 8px; max-width: 1000px; }
.rg-fila { display: grid; grid-template-columns: 190px 1fr auto; gap: 10px; align-items: start; padding: 10px; border-radius: 14px; background: var(--dash-bg); }
.rg-atajo { display: flex; align-items: center; gap: 4px; }
.rg-atajo span { font-weight: 700; color: var(--accion); font-size: 18px; }
.rg-fila textarea { resize: vertical; min-height: 44px; height: auto; padding: 8px 12px; line-height: 1.4; }
.rg-acc { display: flex; gap: 10px; align-items: center; padding-top: 4px; }
@media (max-width: 860px) { .rg-fila { grid-template-columns: 1fr; } }
.sp-parecidas { margin: 6px 0; padding: 0; list-style: none; display: grid; gap: 6px; color: var(--text-dark); }
.sp-parecidas li { display: flex; justify-content: space-between; gap: 8px; align-items: center; padding: 6px 8px; border-radius: 10px; background: var(--card-bg); }

/* ---- Panel 170 · Caja del día ---- */
.cj-dia { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.cj-dia .campo { width: auto; }
.cj-fecha { margin-left: 6px; font-size: 15px; }
.mt-bloque.es-bloque.cj-cierre { padding: 18px 20px !important; }
.cj-cierre .mt-titulo { margin-top: 0; }
.cj-cuadre { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; align-items: end; }
.cj-cuadre label { display: grid; gap: 6px; font-size: 13px; color: var(--text-muted); }
.cj-cuadre strong { font-size: 22px; color: var(--text-dark); font-variant-numeric: tabular-nums; }
.cj-cuadre strong.cj-ok { color: #1E8A4C; }
.cj-cuadre strong.cj-mal { color: var(--peligro); }
.cj-acciones { display: flex; gap: 10px; flex-wrap: wrap; justify-content: flex-end; margin-top: 16px; }
@media (max-width: 720px) { .cj-cuadre { grid-template-columns: 1fr; } .cj-acciones .btn { flex: 1; } }
/* 0124 · Caja como en Organízate: retiradas e ingresos, cierre guardado, cierres y morosidad. */
.cj-cuadre small.eq-sub { font-size: 12px; }
.cj-notas { display: grid; gap: 6px; margin-top: 12px; font-size: 13px; color: var(--text-muted); }
.cj-cerrada { margin: 12px 0 0; }
td.cj-ok { color: #1E8A4C; font-weight: 700; } td.cj-mal { color: var(--peligro); font-weight: 700; }
.mt-bloque.es-bloque.cj-movs { padding: 14px 18px !important; }
.cj-mov-lista { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 8px; }
.cj-mov-lista li { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.cj-mov-que { flex: 1; min-width: 140px; }
.cj-mov-lista b { font-variant-numeric: tabular-nums; }
.cj-mov-form { display: grid; grid-template-columns: 130px minmax(0, 1fr) 110px auto; gap: 8px; align-items: center; }
.cj-fila { cursor: pointer; }
.cj-fila:hover td, .cj-fila:focus-visible td { background: var(--dash-bg); }
.cb-rango { display: flex; flex-wrap: wrap; gap: 10px; align-items: end; margin-bottom: 14px; }
.cb-rango label { display: grid; gap: 4px; font-size: 13px; color: var(--text-muted); }
.cb-rango .campo { width: auto; }
.cb-rango .cb-busca { flex: 1; min-width: 160px; }
.cb-rango .cb-busca .campo { width: 100%; }
.cb-rango .cb-prof { min-width: 180px; }
.cb-rango .cb-prof .campo { width: 100%; }   /* Panel 418 */
.cb-rango .btn { margin-left: auto; }
.cb-cuando { white-space: nowrap; }
@media (max-width: 720px) {
  .cj-mov-form { grid-template-columns: 1fr 1fr; }
  .cj-mov-form [data-mov-concepto] { grid-column: 1 / -1; order: -1; }
  .cb-rango label, .cb-rango .btn { flex: 1 1 140px; margin-left: 0; }
  .cb-rango .campo { width: 100%; }
}

/* ---------------------------------------------------------------- cobros y TPV (panel 173; aspecto del 175, en desarrollo)
   Una maqueta desenfocada al fondo (solo formas) y, delante, cristal claro con
   esquinas muy curvas. Las tarjetas son .brillo: la luz sigue al ratón y
   al entrar pasa un destello (ver style.css). */
.tpv-cab h1 { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.tpv-estado { font-size: 12px; vertical-align: middle; }

.tpv-escena { position: relative; margin: 14px 4px 18px; border-radius: 34px; overflow: hidden; isolation: isolate;
  border: 1px solid var(--vidrio-borde); box-shadow: var(--sombra-vidrio); min-height: 560px; }
.tpv-capa { position: relative; z-index: 2; padding: 26px; display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
.tpv-capa > *, .tpv-cards > * { min-width: 0; }

/* La maqueta del fondo */
.tpv-fondo { position: absolute; inset: -30px; z-index: 0; padding: 56px; display: grid; gap: 22px; align-content: space-between; grid-template-rows: auto 1fr auto;
  filter: blur(6px) saturate(1.25); opacity: 1; pointer-events: none; user-select: none; }
.tpv-malla { position: absolute; inset: 0; z-index: -1;
  background:
    radial-gradient(520px 340px at 12% 8%, color-mix(in oklab, var(--marca) 38%, transparent), transparent 70%),
    radial-gradient(560px 380px at 92% 20%, color-mix(in oklab, var(--accion) 30%, transparent), transparent 70%),
    radial-gradient(520px 360px at 60% 100%, color-mix(in oklab, var(--marca) 26%, transparent), transparent 70%); }
.tpv-fondo b, .tpv-fondo s, .tpv-fondo u, .tpv-fondo em { display: block; border-radius: 999px; text-decoration: none; }
.tpv-fondo b { height: 16px; width: 62%; background: var(--text-dark); opacity: .3; }
.tpv-fondo s { height: 10px; width: 40%; background: var(--text-muted); opacity: .3; }
.tpv-fondo s.w40 { width: 40%; } .tpv-fondo s.w30 { width: 30%; }
.tpv-m-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.tpv-m-kpi, .tpv-m-tarjeta { background: rgba(255, 255, 255, .9); border: 1px solid rgba(255, 255, 255, .8); border-radius: 26px; padding: 18px; }
.tpv-m-kpi { display: grid; gap: 12px; }
.tpv-m-icono { width: 34px; height: 34px; border-radius: 12px; display: block; }
.tpv-m-icono, .tpv-m-avatar { opacity: .7; }
.tpv-m-icono.c0, .tpv-m-avatar.c0 { background: var(--marca); } .tpv-m-icono.c1, .tpv-m-avatar.c1 { background: var(--accion); }
.tpv-m-icono.c2, .tpv-m-avatar.c2 { background: #1E8A4C; } .tpv-m-icono.c3, .tpv-m-avatar.c3 { background: #E0902B; }
.tpv-m-cuerpo { display: grid; grid-template-columns: 1.4fr 1fr; gap: 14px; align-items: stretch; }
.tpv-m-grafica { display: grid; gap: 14px; grid-template-rows: auto 1fr; }
.tpv-m-barras { display: flex; align-items: flex-end; gap: 12px; min-height: 200px; }
.tpv-m-barras i { flex: 1; border-radius: 10px 10px 4px 4px; background: linear-gradient(180deg, color-mix(in oklab, var(--marca) 55%, transparent), color-mix(in oklab, var(--marca) 14%, transparent)); }
.tpv-m-lista { display: grid; gap: 18px; align-content: space-around; }
.tpv-m-fila { display: grid; grid-template-columns: 34px 1fr 54px; gap: 12px; align-items: center; }
.tpv-m-avatar { width: 34px; height: 34px; border-radius: 50%; display: block; }
.tpv-m-fila span { display: grid; gap: 7px; } .tpv-m-fila em { height: 22px; width: 54px; background: color-mix(in oklab, var(--accion) 45%, transparent); }
.tpv-m-enlace { display: grid; grid-template-columns: 34px 1fr 120px; gap: 14px; align-items: center; }
.tpv-m-enlace span { display: grid; gap: 7px; } .tpv-m-enlace u { height: 38px; background: var(--accion); opacity: .8; }

/* Cristal claro, esquinas curvas */
.tpv-hero, .tpv-card, .tpv-mientras {
  background: linear-gradient(150deg, rgba(255, 255, 255, .58), rgba(255, 255, 255, .3) 55%, rgba(255, 255, 255, .42));
  -webkit-backdrop-filter: blur(14px) saturate(190%); backdrop-filter: blur(14px) saturate(190%);
  border: 1px solid rgba(255, 255, 255, .7); border-radius: 28px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9), inset 0 0 0 1px rgba(255, 255, 255, .22),
              0 18px 40px -22px rgba(12, 52, 54, .45), 0 2px 8px -3px rgba(12, 52, 54, .10);
  transition: transform .25s cubic-bezier(.2, .7, .2, 1), box-shadow .25s ease, border-color .25s ease;
}
.tpv-hero:hover, .tpv-card:hover, .tpv-mientras:hover {
  transform: translateY(-3px); border-color: rgba(255, 255, 255, .95);
  box-shadow: inset 0 1px 0 #fff, inset 0 0 0 1px rgba(255, 255, 255, .35),
              0 26px 50px -22px rgba(12, 52, 54, .5), 0 4px 12px -4px rgba(12, 52, 54, .14);
}
.tpv-hero { display: flex; gap: 18px; align-items: center; padding: 24px 26px; }
.tpv-hero h2 { margin: 0 0 6px; font-family: var(--font-marca); font-weight: 500; font-size: 24px; line-height: 1.15; color: var(--text-dark); }
.tpv-hero p { margin: 0; font-size: 15px; line-height: 1.5; color: var(--text-muted); max-width: 62ch; }
.tpv-hero-ico, .tpv-card-ico { flex: none; display: grid; place-items: center; color: var(--marca-oscura, var(--marca));
  background: rgba(255, 255, 255, .6); border: 1px solid rgba(255, 255, 255, .85); box-shadow: inset 0 1px 0 #fff; }
.tpv-hero-ico { width: 60px; height: 60px; border-radius: 20px; }
.tpv-hero-ico svg { width: 30px; height: 30px; }
.tpv-card-ico { width: 44px; height: 44px; border-radius: 15px; }
.tpv-card-ico svg { width: 22px; height: 22px; }
.tpv-sub { margin: 10px 4px 0; font-size: 13px; letter-spacing: .06em; text-transform: uppercase; color: var(--text-dark); }
.tpv-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: 14px; }
.tpv-cards-2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); }
.tpv-card { padding: 20px; display: grid; gap: 8px; align-content: start; }
.tpv-card h3 { margin: 6px 0 0; font-size: 16px; color: var(--text-dark); }
.tpv-card p { margin: 0; font-size: 14px; line-height: 1.5; color: var(--text-muted); }
.tpv-mientras { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding: 18px 22px; }
.tpv-mientras p { margin: 0; font-size: 14px; line-height: 1.5; color: var(--text-muted); max-width: 70ch; }

html[data-theme="dark"] .tpv-m-kpi, html[data-theme="dark"] .tpv-m-tarjeta { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .14); }
html[data-theme="dark"] .tpv-hero, html[data-theme="dark"] .tpv-card, html[data-theme="dark"] .tpv-mientras {
  background: linear-gradient(150deg, rgba(255, 255, 255, .14), rgba(255, 255, 255, .05) 55%, rgba(255, 255, 255, .09));
  border-color: rgba(255, 255, 255, .2); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 18px 40px -22px rgba(0, 0, 0, .7); }
html[data-theme="dark"] .tpv-hero-ico, html[data-theme="dark"] .tpv-card-ico { background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .2); box-shadow: none; }
@media (max-width: 860px) {
  .tpv-escena { margin: 12px 12px 16px; border-radius: 28px; }
  .tpv-capa { padding: 12px; gap: 12px; }
  .tpv-hero { flex-direction: column; align-items: flex-start; padding: 18px; gap: 12px; }
  .tpv-hero h2 { font-size: 21px; overflow-wrap: anywhere; }
  .tpv-card, .tpv-mientras { padding: 16px; }
  .tpv-mientras .btn { width: 100%; }
  .tpv-m-kpis { grid-template-columns: repeat(2, 1fr); } .tpv-m-cuerpo { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) { .tpv-hero, .tpv-card, .tpv-mientras { transition: none; } .tpv-hero:hover, .tpv-card:hover, .tpv-mientras:hover { transform: none; } }

/* Panel 184 · Notificaciones dentro de «Mi cuenta» (quien no ve Ajustes las activa aquí). */
#ap-notif-root h2 { margin: 0 0 6px; font-size: 14px; font-weight: 600; }
#ap-notif-root .nota-privada { margin: 0 0 10px !important; }
#ap-notif-root > div { padding: 0 !important; }
/* Panel 184 · Pantalla que no ha podido cargar. */
.vista-error { max-width: 520px; margin: 40px auto; padding: 22px 24px; }
.vista-error h2 { margin: 0 0 8px; padding: 0; }
.vista-error p { margin: 0; }
.vista-error .vacio { padding: 0 0 14px; }

/* 0091 · Descargar Excel en cada sección (panel 200). */
.exp-boton { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.exp-boton svg { flex: none; }
.cajon header .exp-cajon { margin-left: auto; padding: 6px 12px; font-size: 13px; align-self: center; }
.exp-pop { position: fixed; z-index: 400; display: grid; gap: 10px; padding: 14px; border-radius: 14px;
  background: var(--card-bg); border: 1px solid var(--vidrio-borde); box-shadow: var(--sombra-flota);
  -webkit-backdrop-filter: var(--desenfoque); backdrop-filter: var(--desenfoque); }
.exp-pop-tit { margin: 0; font-weight: 600; }
.exp-pop-atajos { display: flex; gap: 6px; flex-wrap: wrap; }
.exp-pop label { display: grid; gap: 4px; font-size: 13px; color: var(--text-muted); }
.exp-seccion h2 { margin: 0 0 4px; }
.exp-lista { display: grid; gap: 2px; margin-top: 10px; }
.exp-fila { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 20px; border-top: 1px solid var(--divider); }
.exp-seccion > .nota-privada { margin: 0 20px; }
@media (max-width: 860px) { .exp-fila { padding: 10px 14px; } .exp-seccion > .nota-privada { margin: 0 14px; } }
.exp-fila small { display: block; color: var(--text-muted); font-size: 13px; }
@media (max-width: 600px) {
  .exp-boton span { display: none; }                       /* en el móvil, solo el icono */
  .exp-fila .exp-boton span, .exp-cajon span { display: inline; }
}

/* 0092 · Historial de citas en la ficha. */
.pa-historial { margin: 10px 0 14px; }
.pa-historial summary { cursor: pointer; font-weight: 650; padding: 8px 0; }
.pa-historial summary small { color: var(--text-muted); font-weight: 500; }
.pa-hc td { font-size: 13px; padding-top: 7px; padding-bottom: 7px; }
.pa-hc tr.pasada td:first-child { text-decoration: line-through; text-decoration-color: var(--text-muted); }
.pa-hc tr.cancelada td { color: var(--peligro); }
.pa-hc tr.cancelada td:first-child { text-decoration: line-through double; }

/* Panel 202 · La foto de cada profesional junto a su nombre en las tablas de Estadísticas. */
.es-quien { display: flex; align-items: center; gap: 10px; min-width: 0; }
.es-quien > div { min-width: 0; }
.es-foto { width: 38px; height: 38px; }
.es-quien .es-foto + div .es-pro > i { display: none; }        /* con foto, sin el punto de color */
.es-quien .es-foto { box-shadow: 0 0 0 2px var(--card-bg); }
@media (max-width: 600px) { .es-foto { width: 30px; height: 30px; } }

/* Panel 207 · Ajustes → Estilo del panel: una tarjeta por estilo, con una miniatura. */
.est-lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; margin-top: 12px; }
.est-opcion { display: grid; gap: 10px; text-align: left; padding: 12px; border-radius: 16px; cursor: pointer;
  background: var(--vidrio-fuerte); border: 1.5px solid var(--divider); color: var(--text-dark);
  transition: border-color .2s ease, box-shadow .2s ease, transform .15s ease; }
.est-opcion:hover:not(:disabled) { transform: translateY(-1px); border-color: color-mix(in oklab, var(--marca) 45%, transparent); }
.est-opcion.activo { border-color: var(--marca); box-shadow: 0 0 0 3px color-mix(in oklab, var(--marca) 18%, transparent); }
.est-opcion:disabled { cursor: default; opacity: .85; }
.est-texto { display: grid; gap: 2px; }
.est-texto small { color: var(--text-muted); font-size: 12.5px; line-height: 1.35; }
/* La miniatura: cuatro tarjetas y un botón, en cada estilo. */
.est-previa { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; padding: 10px; border-radius: 12px; height: 74px; position: relative; overflow: hidden; }
.est-previa i { border-radius: 7px; }
.est-previa b { position: absolute; right: 10px; bottom: 8px; width: 44px; height: 12px; border-radius: 6px; background: var(--marca); }
.est-previa-color { background: radial-gradient(70% 90% at 100% 0%, color-mix(in oklab, var(--marca) 45%, transparent), transparent 70%),
                                radial-gradient(60% 80% at 0% 100%, color-mix(in oklab, var(--acento) 60%, transparent), transparent 70%), #F3EEEA; }
.est-previa-color i { margin-bottom: 18px; border: 1px solid rgba(255, 255, 255, .8); }
.est-previa-color i:nth-child(1) { background: linear-gradient(135deg, color-mix(in oklab, var(--marca) 45%, #fff), rgba(255, 255, 255, .6)); }
.est-previa-color i:nth-child(2) { background: linear-gradient(135deg, #9FD8D4, rgba(255, 255, 255, .6)); }
.est-previa-color i:nth-child(3) { background: linear-gradient(135deg, #A9DDBB, rgba(255, 255, 255, .6)); }
.est-previa-color i:nth-child(4) { background: linear-gradient(135deg, #F2B5AC, rgba(255, 255, 255, .6)); }
.est-previa-claro { background: radial-gradient(70% 90% at 100% 0%, color-mix(in oklab, var(--marca) 14%, transparent), transparent 70%), #F2F2F5; }
.est-previa-claro i { margin-bottom: 18px; background: #fff; box-shadow: 0 0 0 1px rgba(0, 0, 0, .05), 0 3px 8px -4px rgba(0, 0, 0, .2);
  border-top: 2px solid color-mix(in oklab, var(--marca) 60%, transparent); }
.est-previa-cuaderno { background: repeating-linear-gradient(180deg, transparent 0 11px, rgba(70, 52, 30, .09) 11px 12px), #F6F1E8;
  box-shadow: inset 14px 0 0 -13px color-mix(in oklab, var(--marca) 60%, transparent); }
.est-previa-cuaderno i { margin-bottom: 18px; background: #FFFDF8; border: 1px solid rgba(70, 52, 30, .18); border-top: 3px solid #22201C; border-radius: 2px 2px 6px 6px; }
.est-previa-cuaderno b { background: color-mix(in oklab, var(--marca) 82%, #000); border-radius: 4px; box-shadow: 0 2px 0 color-mix(in oklab, var(--marca) 60%, #000); }
/* Panel 209 · miniaturas de Medianoche, Calma y Recepción. */
.est-previa-medianoche { background: radial-gradient(70% 90% at 20% 0%, color-mix(in oklab, var(--marca) 60%, transparent), transparent 70%),
                                     radial-gradient(60% 80% at 100% 100%, rgba(107, 75, 216, .5), transparent 70%), #06080E; }
.est-previa-medianoche i { margin-bottom: 18px; background: rgba(16, 20, 32, .6); border: 1px solid rgba(255, 255, 255, .12);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18); }
.est-previa-medianoche b { box-shadow: 0 0 12px color-mix(in oklab, var(--marca) 80%, transparent); }
.est-previa-calma { background: radial-gradient(70% 90% at 90% 0%, rgba(126, 156, 134, .45), transparent 70%),
                                radial-gradient(60% 80% at 0% 100%, #E9E2D3, transparent 70%), #EEF0EA; }
.est-previa-calma i { margin-bottom: 18px; background: rgba(252, 251, 247, .85); border-radius: 12px; box-shadow: 0 4px 10px -6px rgba(38, 60, 45, .4); }
.est-previa-calma b { background: color-mix(in oklab, var(--marca) 45%, #7E9C86); border-radius: 999px; }
.est-previa-recepcion { background: radial-gradient(70% 90% at 100% 0%, color-mix(in oklab, var(--marca) 35%, transparent), transparent 70%), #F3EEEA;
  grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(2, 1fr); row-gap: 4px; }
.est-previa-recepcion i { background: rgba(255, 255, 255, .8); border-radius: 4px; margin-bottom: 0; }
.est-previa-recepcion i:nth-child(n+1) { height: 100%; }
.est-previa-recepcion b { width: 34px; height: 9px; bottom: 6px; border-radius: 4px; }

/* Panel 215 (0098) · Despachos → Alquiladores. */
.dp-alq-tit { margin: 18px 0 8px; font-size: 15px; }
.dp-alq-tit small, .dp-alq-antiguos summary small { color: var(--text-muted); font-weight: 500; }
.dp-alq-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.dp-alq { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px;
          border-radius: 14px; background: var(--dash-bg); }
.dp-alq > div { display: grid; gap: 2px; min-width: 0; }
.dp-alq small { font-size: 12.5px; color: var(--text-muted); overflow-wrap: anywhere; }
.dp-alq.inactivo strong { color: var(--text-muted); }
.dp-alq .dp-alq-wa { color: var(--marca-oscura); font-weight: 600; }
.dp-alq-antiguos { margin-top: 16px; }
.dp-alq-antiguos summary { cursor: pointer; font-weight: 650; padding: 6px 0; }
.dp-alq-form { display: grid; gap: 8px; margin: 10px 0; padding: 12px; border-radius: 14px; background: var(--dash-bg); }
.dp-alq-activo { display: flex; align-items: center; gap: 8px; font-size: 14px; }


/* ---------------------------------------------------------------- Panel 227 · Disponibilidad */
#disponibilidad-root { padding: 2px 2px 28px; max-width: 1100px; }
.dsp-barra { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin: 4px 0 8px; }
.dsp-fecha { font-size: 17px; }
.dsp-filtros { display: flex; flex-wrap: wrap; gap: 8px; margin-left: auto; }
.dsp-grupo { display: inline-flex; padding: 3px; border-radius: 999px; background: var(--dash-bg); border: 1px solid var(--divider); }
.dsp-opcion { border: 0; background: transparent; font: inherit; font-size: 13px; font-weight: 650; padding: 6px 12px; border-radius: 999px; cursor: pointer; color: var(--text-muted); }
.dsp-opcion[aria-pressed="true"] { background: var(--card-bg, #fff); color: var(--text-dark); box-shadow: 0 1px 4px rgba(12, 52, 54, .15); }
.dsp-resumen { margin: 0 0 12px; color: var(--text-muted); font-size: 14px; }
.dsp-lista { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 12px; }
.dsp-tarjeta { border-radius: 18px; padding: 14px 16px; display: grid; gap: 10px; box-shadow: inset 4px 0 0 var(--ag-color); }
.dsp-tarjeta.sin { opacity: .72; }
.dsp-tarjeta header { display: flex; align-items: center; gap: 10px; min-width: 0; }
.dsp-tarjeta header strong { font-size: 15.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dsp-punto { width: 12px; height: 12px; border-radius: 50%; flex: none; background: var(--ag-color); }
.dsp-foto { width: 32px; height: 32px; border-radius: 50%; flex: none; object-fit: cover; }
.dsp-estado { margin-left: auto; font-size: 12px; font-weight: 650; color: var(--text-muted); white-space: nowrap; }
.dsp-ocupacion { display: grid; gap: 5px; font-size: 12.5px; color: var(--text-muted); }
.dsp-ocupacion b { color: var(--text-dark); }
.dsp-barra-ocup { height: 8px; border-radius: 999px; background: color-mix(in oklab, #3fae6a 22%, var(--dash-bg)); overflow: hidden; }
.dsp-barra-ocup i { display: block; height: 100%; border-radius: 999px; background: var(--ag-color); }
.dsp-huecos { display: flex; flex-wrap: wrap; gap: 7px; }
.dsp-hueco {
  border: 1px solid color-mix(in oklab, #3fae6a 45%, transparent); background: color-mix(in oklab, #3fae6a 14%, #fff);
  color: #1f6b3d; font: inherit; font-size: 13.5px; font-weight: 700; font-variant-numeric: tabular-nums;
  padding: 7px 11px; border-radius: 10px; cursor: pointer;
}
.dsp-hueco small { font-weight: 650; color: var(--accion-oscura); }
.dsp-hueco.online { border-color: color-mix(in oklab, var(--accion) 40%, transparent); background: var(--accion-clara); color: var(--accion-oscura); }
html[data-theme="dark"] .dsp-hueco { background: color-mix(in oklab, #3fae6a 22%, transparent); color: #a8e6bf; }
@media (max-width: 860px) {
  .dsp-filtros { margin-left: 0; width: 100%; }
  .dsp-lista { grid-template-columns: minmax(0, 1fr); }
  .dsp-hueco { font-size: 14.5px; padding: 9px 12px; }
}

/* Panel 232 · bonos: las sesiones que lo van gastando y el día del pago */
.tf-sesiones { margin: 6px 0 2px; }
.tf-sesiones summary { cursor: pointer; font-size: 13px; font-weight: 600; color: var(--marca); width: fit-content; padding: 2px 0; }
.tf-sesiones summary:focus-visible { outline: 2px solid var(--marca); outline-offset: 2px; border-radius: 4px; }
.tf-sesiones ol { margin: 6px 0 0; padding-left: 20px; display: grid; gap: 4px; font-size: 13px; }
.tf-sesiones li { display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.tf-ses-estado { color: var(--text-muted); white-space: nowrap; }
.tf-ses-estado.usada { color: var(--text); font-weight: 600; }
.tf-pago-dia { color: var(--text-muted); font-size: 13px; white-space: nowrap; }
.tf-sin-sesiones { display: block; margin-top: 4px; }

/* Panel 235 · ofrecer un hueco libre a sus pacientes */
.dsp-ofrecer { margin-top: 8px; font-size: 13px; }
.dsp-of { display: grid; gap: 12px; }
.dsp-of-lista { display: grid; gap: 6px; }
.dsp-of-fila { display: flex; gap: 10px; align-items: flex-start; padding: 8px 10px; border: 1px solid var(--divider); border-radius: 12px; cursor: pointer; }
.dsp-of-fila input { margin-top: 3px; flex: none; }
.dsp-of-fila span { display: grid; gap: 2px; min-width: 0; }
.dsp-of-fila small { color: var(--text-muted); }
.dsp-of-fila:has(input:disabled) { opacity: .6; cursor: default; }

/* 0119 · Datos para facturas, en la ficha. */
.pa-pareja-form { display: grid; gap: 8px; margin-top: 8px; max-width: 420px; }
.pa-pareja-form label { display: grid; gap: 3px; font-size: .78rem; color: var(--text-muted); }
.pa-pareja-acc { display: flex; gap: 8px; }
.pa-factura { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 10px; padding: 4px 0 6px; }
.pa-factura label { display: grid; gap: 3px; font-size: .78rem; color: var(--text-muted); min-width: 0; }
.pa-factura .campo { width: 100%; min-width: 0; }
.pa-factura .pa-f-direccion, .pa-factura .pa-f-email, .pa-factura .pa-f-acc { grid-column: 1 / -1; }
.pa-factura .pa-f-acc { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.pa-factura .pa-f-acc small { color: var(--text-muted); }
@media (max-width: 420px) { .pa-factura { grid-template-columns: minmax(0, 1fr); } }
.pa-factura .pa-f-primera { grid-column: 1 / -1; display: flex; align-items: center; gap: 8px; font-size: .88rem; color: var(--text-dark); }

/* 0120 · Contador de «Lo que falta por hacer»: naranja con muchas, rojo con demasiadas; y el aviso al entrar. */
.pd-total.pd-naranja { background: #e0741a; }
.pd-total.pd-rojo { background: var(--peligro, #d93636); animation: pd-late 1.6s ease-in-out 3; }
@keyframes pd-late { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.12); } }
.pd-aviso { position: fixed; inset: 0; z-index: 60; display: grid; place-items: center; padding: 16px; background: rgba(10, 14, 30, .45); }
.pd-aviso-caja { width: min(440px, 100%); padding: 20px 22px; border-radius: 18px; background: var(--card-bg); box-shadow: 0 18px 50px rgba(0,0,0,.3); }
.pd-aviso-caja h2 { margin: 0 0 8px; font-size: 18px; }
.pd-aviso-caja p { margin: 0 0 14px; color: var(--text-muted); line-height: 1.45; }
.pd-aviso-no { display: flex; align-items: center; gap: 8px; font-size: .9rem; margin-bottom: 14px; }
.pd-aviso-acc { display: flex; justify-content: flex-end; }

/* Panel 318 · Cobros y TPV: cómo va y vista previa de la página de pago */
.tpv-pasos { list-style: none; margin: 0; padding: 18px 20px; display: grid; gap: 14px; border-radius: 22px;
  background: color-mix(in oklab, var(--surface, #fff) 82%, transparent); border: 1px solid var(--border, rgba(0,0,0,.08)); }
.tpv-pasos li { display: flex; gap: 12px; align-items: flex-start; }
.tpv-pasos li > div { min-width: 0; }
.tpv-pasos b { font-weight: 650; }
.tpv-pasos p { margin: 2px 0 0; color: var(--text-muted); font-size: 14px; }
.tpv-pasos .chip { margin-left: 6px; font-size: 11px; vertical-align: 1px; }
.tpv-paso-ico { flex: none; width: 24px; height: 24px; color: var(--text-muted); }
.tpv-paso-ico svg { width: 24px; height: 24px; }
.tpv-pasos li.hecho .tpv-paso-ico { color: var(--accion, var(--marca)); }
.tpv-previa { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; padding: 18px 20px; border-radius: 22px;
  background: color-mix(in oklab, var(--surface, #fff) 82%, transparent); border: 1px solid var(--border, rgba(0,0,0,.08)); }
.tpv-previa > div { flex: 1 1 220px; min-width: 0; }
.tpv-previa h3 { margin: 0 0 4px; font-size: 16px; }
.tpv-previa p { margin: 0; color: var(--text-muted); font-size: 14px; }
/* 0152 · Enlace de pago */
.ep-boton { white-space: nowrap; }
.ep-tarjeta { display: grid; gap: 10px; padding: 16px; border: 1px solid var(--borde, rgba(0,0,0,.1)); border-radius: 14px; }
.ep-importe { font-size: 28px; font-weight: 750; letter-spacing: -.01em; }
.ep-url { font-size: 13px; }
.ep-acciones { display: flex; flex-wrap: wrap; gap: 8px; }
.ep-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.ep-lista li { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.ep-tarjeta .enlace-btn { justify-self: start; border: 0; background: none; padding: 4px 0; font: inherit; font-size: 14px;
  color: var(--peligro, #b3261e); text-decoration: underline; cursor: pointer; }
.ep-prueba { margin: 0 0 12px; padding: 10px 12px; border-radius: 12px; font-size: 13px;
  background: color-mix(in oklab, var(--aviso, #b26a00) 14%, transparent); border: 1px solid color-mix(in oklab, var(--aviso, #b26a00) 35%, transparent); }
.tpv-modo { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin: 0 4px 12px; padding: 12px 16px; border-radius: 16px; font-size: 14px;
  background: color-mix(in oklab, var(--aviso, #b26a00) 14%, transparent); border: 1px solid color-mix(in oklab, var(--aviso, #b26a00) 35%, transparent); }
.tpv-modo p { margin: 0; flex: 1 1 260px; }
.tpv-modo-mini { display: flex; justify-content: flex-end; margin: 0 4px 6px; }

/* 0153 · Cobros y TPV encendido y «Cobrar ahora» (el móvil como TPV) */
.tpv-cobrar { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin: 0 4px 14px; padding: 18px 20px; border-radius: 22px;
  background: color-mix(in oklab, var(--surface, #fff) 82%, transparent); border: 1px solid var(--border, rgba(0,0,0,.08)); }
.tpv-cobrar > div { flex: 1 1 240px; min-width: 0; }
.tpv-cobrar h2 { margin: 0 0 4px; font-size: 18px; }
.tpv-cobrar p { margin: 0; color: var(--text-muted); font-size: 14px; }
.tpv-cobrar .btn { min-height: 46px; padding-inline: 22px; font-size: 15px; }
.tpv-kpis { margin: 0 4px 14px; }
.tpv-lista-tit { margin: 0 0 10px; font-size: 15px; }
.ca-importe { text-align: center; font-size: 40px; font-weight: 750; letter-spacing: -.02em; margin: 6px 0 12px; font-variant-numeric: tabular-nums; }
.ca-teclado { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 0 0 14px; }
.ca-tecla { min-height: 56px; border-radius: 14px; border: 1px solid var(--border, rgba(0,0,0,.1)); font: inherit; font-size: 22px; font-weight: 600;
  background: var(--surface, #fff); color: var(--text, inherit); cursor: pointer; touch-action: manipulation; }
.ca-tecla:active { transform: scale(.97); }
.ca-centro { text-align: center; margin: 0 0 10px; }
.ca-qr { width: min(260px, 70vw); aspect-ratio: 1; margin: 6px auto 12px; padding: 10px; border-radius: 18px; background: #fff;
  display: grid; place-items: center; box-shadow: 0 1px 2px rgba(0,0,0,.06), 0 10px 30px rgba(0,0,0,.08); }
.ca-qr svg { width: 100%; height: 100%; }
.ca-qr.ca-hecho { color: var(--ok, #1b8f5b); background: color-mix(in oklab, var(--ok, #1b8f5b) 10%, #fff); }
.ca-qr.ca-hecho svg { width: 60%; height: 60%; }
.ca-aqui { display: flex; flex-direction: column; align-items: center; margin: 0 auto 10px; max-width: 320px; }
.ca-aqui > p { margin: 0 0 8px; }
.ca-tarjeta { width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.ca-tarjeta svg { width: 18px; height: 18px; }
/* Panel 365 · Bizum aparte, con su logo y su color (#13AFBC). */
.ca-bizum { --bizum: #13AFBC; width: 100%; margin-top: 12px; display: flex; align-items: center; gap: 12px;
  padding: 12px 14px; border-radius: 18px; text-decoration: none; color: inherit;
  background: color-mix(in oklab, var(--bizum) 12%, transparent);
  border: 1.5px solid color-mix(in oklab, var(--bizum) 55%, transparent);
  transition: transform .15s ease, background .15s ease; }
.ca-bizum:hover, .ca-bizum:focus-visible { background: color-mix(in oklab, var(--bizum) 20%, transparent); transform: translateY(-1px); }
.ca-bizum img { width: 44px; height: 44px; flex: none; border-radius: 50%; }
.ca-bizum-txt { flex: 1; display: flex; flex-direction: column; gap: 2px; text-align: left; }
.ca-bizum-txt b { font-size: 1rem; }
.ca-bizum-txt small { font-size: .8rem; opacity: .75; line-height: 1.3; }
.ca-bizum-flecha { flex: none; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center;
  background: var(--bizum); color: #fff; }
.ca-bizum-flecha svg { width: 18px; height: 18px; }
.ca-aqui[hidden] { display: none; }
.ca-estado { text-align: center; margin: 4px 0 0; font-size: 15px; }

/* Panel 327 · «Cobrar ahora» bien a la vista (el móvil como TPV) y cada enlace de pago en su tarjeta */
.tpv-cta { --cta-a: #1f3bff; --cta-b: #7a1cff; --cta-c: #e0279b;
  position: relative; isolation: isolate; overflow: hidden; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 22px;
  width: calc(100% - 8px); margin: 14px 4px 18px; padding: 28px 30px; min-height: 168px; border: 0; border-radius: 30px; cursor: pointer; text-align: left;
  font: inherit; color: #fff; -webkit-tap-highlight-color: transparent;
  background: linear-gradient(120deg, var(--cta-a), var(--cta-b) 48%, var(--cta-c) 100%);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .18) inset, 0 1px 0 rgba(255, 255, 255, .35) inset,
              0 22px 50px -18px color-mix(in oklab, var(--cta-b) 75%, transparent), 0 8px 22px -10px color-mix(in oklab, var(--cta-a) 70%, transparent);
  transition: transform .25s cubic-bezier(.2, .7, .2, 1), box-shadow .25s ease; isolation: isolate; }
.tpv-cta::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(90% 80% at 0% 0%, rgba(255, 255, 255, .2), transparent 55%), radial-gradient(70% 90% at 100% 100%, rgba(255, 160, 60, .35), transparent 60%); }
.tpv-cta:hover { transform: translateY(-3px) scale(1.005);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .25) inset, 0 1px 0 rgba(255, 255, 255, .4) inset,
              0 30px 60px -18px color-mix(in oklab, var(--cta-b) 85%, transparent), 0 10px 26px -10px color-mix(in oklab, var(--cta-a) 80%, transparent); }
.tpv-cta:active { transform: scale(.985); }
.tpv-cta:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.tpv-cta-brillo { position: absolute; inset: -40% auto -40% -30%; width: 34%; z-index: 0; pointer-events: none; transform: skewX(-18deg);
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .32), transparent); animation: tpv-cta-brillo 4.2s ease-in-out infinite; will-change: transform; }
.tpv-cta-ico { position: relative; z-index: 1; width: 78px; height: 78px; border-radius: 26px; display: grid; place-items: center;
  background: rgba(255, 255, 255, .2); border: 1px solid rgba(255, 255, 255, .45); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5), 0 10px 24px -10px rgba(0, 0, 0, .35); }
.tpv-cta-ico svg { width: 40px; height: 40px; stroke-width: 2; }
.tpv-cta-ico i { position: absolute; inset: -1px; border-radius: inherit; border: 2px solid rgba(255, 255, 255, .55); animation: tpv-cta-onda 2.4s ease-out infinite; }
.tpv-cta-ico i + i { animation-delay: 1.2s; }
.tpv-cta-txt { position: relative; z-index: 1; display: grid; gap: 6px; min-width: 0; }
.tpv-cta-txt small { font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; opacity: .85; }
.tpv-cta-txt strong { font-family: var(--font-marca); font-weight: 600; font-size: clamp(30px, 4.2vw, 44px); line-height: 1.02; letter-spacing: -.02em;
  text-shadow: 0 2px 18px rgba(0, 0, 0, .18); }
.tpv-cta-sub { font-size: 15px; line-height: 1.45; opacity: .92; max-width: 46ch; }
.tpv-cta-medios { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.tpv-cta-medios em { display: inline-flex; align-items: center; gap: 6px; font-style: normal; font-size: 13px; font-weight: 650; padding: 6px 12px 6px 9px;
  border-radius: 999px; background: rgba(255, 255, 255, .18); border: 1px solid rgba(255, 255, 255, .35); }
.tpv-cta-medios svg { width: 16px; height: 16px; stroke-width: 2; }
.tpv-cta-ir { position: relative; z-index: 2; width: 64px; height: 64px; border-radius: 50%; display: grid; place-items: center; flex: none;
  background: #fff; color: var(--cta-b); box-shadow: 0 12px 28px -10px rgba(0, 0, 0, .45); transition: transform .25s cubic-bezier(.2, .7, .2, 1); }
.tpv-cta-ir svg { width: 28px; height: 28px; stroke-width: 2.4; }
.tpv-cta:hover .tpv-cta-ir { transform: translateX(4px); }
/* La tarjeta que flota detrás (solo dibujo): holográfica, sin textos ni marcas (Panel 328) */
.tpv-cta-tarjeta { position: absolute; z-index: 0; right: 96px; top: 50%; width: 200px; aspect-ratio: 1.586; border-radius: 18px; pointer-events: none; overflow: hidden;
  transform: translateY(-50%) rotate(-12deg);
  background:
    linear-gradient(115deg, rgba(255, 255, 255, .55) 0%, rgba(255, 255, 255, 0) 28%, rgba(255, 255, 255, .38) 46%, rgba(255, 255, 255, 0) 62%),
    conic-gradient(from 210deg at 32% 62%, #ffc6ec, #9fe9ff, #c4b2ff, #fff1a8, #ffb3dc, #8fe3ff, #d5c2ff, #ffc6ec);
  border: 1px solid rgba(255, 255, 255, .8);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9), 0 22px 44px -16px rgba(30, 0, 80, .55), 0 0 30px -6px rgba(255, 180, 230, .45);
  animation: tpv-cta-flota 6s ease-in-out infinite; will-change: transform; backface-visibility: hidden; }
.tpv-cta-tarjeta::after { content: ""; position: absolute; inset: -50%; pointer-events: none; opacity: .55;
  background: linear-gradient(100deg, transparent 38%, rgba(255, 255, 255, .85) 50%, transparent 62%); animation: tpv-holo 5s ease-in-out infinite; will-change: transform; }
.tpv-cta-tarjeta.atras { right: 150px; width: 176px; opacity: .85; filter: hue-rotate(70deg) saturate(1.15);
  transform: translateY(-62%) rotate(6deg); animation: tpv-cta-flota2 7s ease-in-out infinite; }
.tpv-cta-tarjeta b { position: absolute; left: 20px; top: 40px; width: 36px; height: 28px; border-radius: 7px;
  background:
    linear-gradient(90deg, transparent 46%, rgba(60, 60, 80, .28) 46% 54%, transparent 54%),
    linear-gradient(0deg, transparent 30%, rgba(60, 60, 80, .22) 30% 36%, transparent 36% 64%, rgba(60, 60, 80, .22) 64% 70%, transparent 70%),
    linear-gradient(135deg, #ffffff, #c9ccd6 60%, #eef0f5);
  box-shadow: inset 0 0 0 1px rgba(60, 60, 80, .18), 0 1px 2px rgba(0, 0, 0, .12); }
.tpv-cta-tarjeta i { position: absolute; right: 14px; top: 14px; width: 30px; height: 30px; padding: 6px; border-radius: 10px;
  color: #6b21e8; background: rgba(255, 255, 255, .85); box-shadow: 0 2px 6px rgba(60, 0, 120, .18); }
.tpv-cta-tarjeta i svg { width: 100%; height: 100%; stroke-width: 2.2; }
.tpv-cta-tarjeta u, .tpv-cta-tarjeta s { position: absolute; left: 20px; height: 8px; border-radius: 4px; background: rgba(255, 255, 255, .8); }
.tpv-cta-tarjeta u { bottom: 36px; width: 60%; } .tpv-cta-tarjeta s { bottom: 20px; width: 32%; opacity: .75; }
@keyframes tpv-holo { 0%, 100% { transform: translateX(-30%); } 50% { transform: translateX(30%); } }
@keyframes tpv-cta-flota2 { 0%, 100% { transform: translateY(-62%) rotate(6deg); } 50% { transform: translateY(calc(-62% + 6px)) rotate(4deg); } }
/* Panel 352 · José Carlos (19/10): «se buggea un poco la cinemática». Antes el fondo se movía con background-position, el
   halo con outline y el brillo con left: repintar toda la tarjeta en cada fotograma, y a tirones. Ahora solo transform y
   opacity (los hace la tarjeta gráfica): el degradado en movimiento va en una capa propia que se desliza, y el halo es una
   sombra fija (el contorno que latía, fuera: repintaba la página entera). */
.tpv-cta::after { content: ""; position: absolute; inset: 0; width: 200%; z-index: -2; pointer-events: none; border-radius: inherit;
  background: linear-gradient(120deg, var(--cta-a), var(--cta-b) 24%, var(--cta-c) 50%, var(--cta-b) 76%, var(--cta-a));
  animation: tpv-cta-mueve 18s linear infinite; will-change: transform; }
@keyframes tpv-cta-mueve { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }
@keyframes tpv-cta-brillo { 0%, 55% { transform: translateX(0) skewX(-18deg); } 85%, 100% { transform: translateX(470%) skewX(-18deg); } }
@media (prefers-reduced-motion: reduce) {
  .tpv-cta::after, .tpv-cta-brillo, .tpv-cta-tarjeta, .tpv-cta-tarjeta::after, .tpv-cta-ico i { animation: none !important; }
}
@keyframes tpv-cta-onda { 0% { transform: scale(1); opacity: .8; } 100% { transform: scale(1.55); opacity: 0; } }
@keyframes tpv-cta-flota { 0%, 100% { transform: translateY(-50%) rotate(-12deg); } 50% { transform: translateY(calc(-50% - 8px)) rotate(-9deg); } }

/* Cifras */
.tpv-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 0 4px 22px; }
.tpv-kpi { --k: var(--accion, #2563eb); position: relative; overflow: hidden; display: grid; gap: 4px; align-content: start; padding: 18px 20px 20px; border-radius: 24px;
  background: var(--card-bg); border: 1px solid color-mix(in oklab, var(--text-dark) 9%, transparent);
  box-shadow: 0 14px 34px -24px rgba(0, 0, 0, .45); }
.tpv-kpi::after { content: ""; position: absolute; right: -40px; top: -40px; width: 140px; height: 140px; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, color-mix(in oklab, var(--k) 26%, transparent), transparent 70%); }
.tpv-kpi.ok { --k: #16a34a; } .tpv-kpi.pend { --k: #e08a12; } .tpv-kpi.biz { --k: #0ea5b7; }
.tpv-kpi-ico { width: 40px; height: 40px; border-radius: 14px; display: grid; place-items: center; margin-bottom: 8px; color: var(--k);
  background: color-mix(in oklab, var(--k) 15%, transparent); border: 1px solid color-mix(in oklab, var(--k) 30%, transparent); }
.tpv-kpi-ico svg { width: 21px; height: 21px; stroke-width: 2; }
.tpv-kpi-tit { font-size: 13px; font-weight: 650; color: var(--text-muted); }
.tpv-kpi strong { font-size: clamp(26px, 3vw, 34px); font-weight: 750; letter-spacing: -.02em; line-height: 1.1; color: var(--text-dark); font-variant-numeric: tabular-nums; }
.tpv-kpi-pie { font-size: 13px; color: var(--text-muted); }
.tpv-kpi.ok strong { color: color-mix(in oklab, var(--k) 75%, var(--text-dark)); }

/* Enlaces de pago */
.tpv-bloque { margin: 0 4px 14px; }
.tpv-lista-tit { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; padding: 0 2px; font-size: 17px; color: var(--text-dark); }
.tpv-cuenta { font-size: 12px; font-weight: 700; min-width: 24px; height: 24px; padding: 0 8px; border-radius: 999px; display: inline-grid; place-items: center;
  background: color-mix(in oklab, var(--accion) 16%, transparent); color: var(--accion-oscura, var(--accion)); }
.tpv-enlaces { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 330px), 1fr)); gap: 14px; }
.tpv-enl { --e: var(--text-muted); position: relative; overflow: hidden; display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 14px; align-items: start;
  padding: 18px 18px 16px 20px; border-radius: 22px; background: var(--card-bg); border: 1px solid color-mix(in oklab, var(--text-dark) 9%, transparent);
  box-shadow: 0 14px 30px -24px rgba(0, 0, 0, .5); transition: transform .2s ease, box-shadow .2s ease; }
.tpv-enl::before { content: ""; position: absolute; left: 0; top: 14px; bottom: 14px; width: 4px; border-radius: 0 4px 4px 0; background: var(--e); }
.tpv-enl:hover { transform: translateY(-2px); box-shadow: 0 20px 36px -24px rgba(0, 0, 0, .6); }
.tpv-enl.est-pagado { --e: #16a34a; } .tpv-enl.est-pendiente { --e: #e08a12; } .tpv-enl.est-anulado, .tpv-enl.est-caducado { --e: #8b979b; }
.tpv-enl.est-anulado, .tpv-enl.est-caducado { opacity: .78; }
.tpv-enl-av { width: 48px; height: 48px; border-radius: 16px; display: grid; place-items: center; font-weight: 750; font-size: 16px; letter-spacing: .02em;
  color: #fff; background: linear-gradient(135deg, var(--accion, #2563eb), color-mix(in oklab, var(--accion, #2563eb) 45%, #8b2cf5)); }
.tpv-enl-av.sin { color: var(--accion-oscura, var(--accion)); background: color-mix(in oklab, var(--accion) 14%, transparent); border: 1px solid color-mix(in oklab, var(--accion) 26%, transparent); }
.tpv-enl-av svg { width: 22px; height: 22px; stroke-width: 2; }
.tpv-enl-cuerpo { display: grid; gap: 6px; min-width: 0; }
.tpv-enl-cab { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.tpv-enl-quien { font-size: 16px; font-weight: 700; color: var(--text-dark); line-height: 1.3; overflow-wrap: anywhere; }
.tpv-enl-imp { flex: none; font-size: 22px; font-weight: 800; letter-spacing: -.02em; color: var(--text-dark); font-variant-numeric: tabular-nums; }
.tpv-enl.est-pagado .tpv-enl-imp { color: color-mix(in oklab, #16a34a 75%, var(--text-dark)); }
.tpv-enl-que { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; font-size: 14px; color: var(--text-muted); line-height: 1.4; }
.tpv-enl-tipo { font-size: 12px; font-weight: 700; padding: 2px 9px; border-radius: 999px; color: var(--text-dark);
  background: color-mix(in oklab, var(--text-dark) 8%, transparent); }
.tpv-enl-pie { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 4px; }
.tpv-pill { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 11px; border-radius: 999px; font-size: 12.5px; font-weight: 700; white-space: nowrap;
  color: color-mix(in oklab, var(--p, #8b979b) 80%, var(--text-dark)); background: color-mix(in oklab, var(--p, #8b979b) 15%, transparent);
  border: 1px solid color-mix(in oklab, var(--p, #8b979b) 32%, transparent); }
.tpv-pill i { width: 7px; height: 7px; border-radius: 50%; background: var(--p, #8b979b); }
.tpv-pill.est-pagado { --p: #16a34a; } .tpv-pill.est-pendiente { --p: #e08a12; }
.tpv-pill.est-pendiente i { animation: tpv-latido 1.6s ease-in-out infinite; }
.tpv-pill.prueba { --p: #b26a00; border-style: dashed; }
.tpv-enl-meta { font-size: 13px; color: var(--text-muted); white-space: nowrap; }
.tpv-enl-creado { margin: 2px 0 0; font-size: 12.5px; color: var(--text-muted); opacity: .85; }
.tpv-enl-acc { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.tpv-enl-btn { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 0 14px; border-radius: 12px; font: inherit; font-size: 13.5px; font-weight: 650;
  cursor: pointer; color: var(--accion-oscura, var(--accion)); background: color-mix(in oklab, var(--accion) 12%, transparent);
  border: 1px solid color-mix(in oklab, var(--accion) 28%, transparent); }
.tpv-enl-btn svg { width: 16px; height: 16px; }
.tpv-enl-btn.peligro { color: var(--peligro); background: color-mix(in oklab, var(--peligro) 10%, transparent); border-color: color-mix(in oklab, var(--peligro) 28%, transparent); }
/* Panel 377 · En tema oscuro, «Copiar enlace» y el contador se leían mal (azul oscuro sobre fondo oscuro). */
html[data-theme="dark"] .tpv-enl-btn:not(.peligro):not(.devolver) { color: #c7d6ff; background: rgba(120, 150, 255, .16); border-color: rgba(150, 175, 255, .38); }
html[data-theme="dark"] .tpv-cuenta { color: #dbe4ff; background: rgba(120, 150, 255, .28); }
/* Panel 376 · «Devolver» a la vista; anulados y caducados aparte, plegados. */
.tpv-enl-btn.devolver { color: #fff; background: linear-gradient(135deg, #6d28d9, #2563eb); border-color: transparent; box-shadow: 0 8px 18px -10px rgba(76, 29, 149, .7); }
.tpv-enl-btn.devolver:hover { filter: brightness(1.08); }
.tpv-anulados { margin-top: 18px; }
.tpv-anulados > summary { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; font-weight: 700; font-size: 15px; color: var(--text-muted);
  padding: 8px 14px; border-radius: 12px; background: color-mix(in oklab, var(--text-dark) 6%, transparent); list-style: none; }
.tpv-anulados > summary::-webkit-details-marker { display: none; }
.tpv-anulados > summary::after { content: "▾"; transition: transform .2s ease; }
.tpv-anulados[open] > summary::after { transform: rotate(180deg); }
.tpv-anulados > .tpv-enlaces { margin-top: 12px; }
.tpv-pill.devuelto { --p: #7c3aed; }
.tpv-dev-intro { margin: 0 0 12px; line-height: 1.5; }
.tpv-dev-portal { margin-top: 14px; } .tpv-dev-portal > summary { cursor: pointer; font-weight: 650; color: var(--text-muted); }
.tpv-dev-portal .tpv-dev-pasos { margin-top: 10px; }
.tpv-permisos > summary { cursor: pointer; list-style: none; } .tpv-permisos > summary::-webkit-details-marker { display: none; }
.tpv-permisos > summary::after { content: "▾"; margin-left: 4px; }
.tpv-perm-cargos, .tpv-perm-personas { display: flex; flex-wrap: wrap; gap: 8px 16px; margin: 8px 0 12px; }
.tpv-perm { display: inline-flex; align-items: center; gap: 8px; min-height: 36px; font-weight: 600; }
.tpv-perm small { color: var(--text-muted); font-weight: 500; }
.tpv-dev-pasos { margin: 0 0 14px; padding-left: 22px; display: grid; gap: 12px; line-height: 1.5; }
.tpv-dev-pasos .btn { margin-top: 6px; display: inline-flex; }
.tpv-dev-pedido { display: inline-flex; align-items: center; gap: 8px; margin-top: 4px; }
.tpv-dev-pedido code { font-size: 15px; font-weight: 700; padding: 2px 8px; border-radius: 8px; background: color-mix(in oklab, var(--text-dark) 8%, transparent); }
@keyframes tpv-latido { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: .35; transform: scale(.7); } }

/* El cajón de «Cobrar ahora», como la pantalla de un TPV */
.ca-pantalla { position: relative; overflow: hidden; margin: 4px 0 14px; padding: 16px 18px 12px; border-radius: 22px; text-align: center; color: #fff;
  background: linear-gradient(120deg, #1f3bff, #7a1cff 55%, #e0279b);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), 0 16px 34px -18px color-mix(in oklab, var(--accion, #2563eb) 80%, transparent); }
.ca-pantalla small { display: block; font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; opacity: .85; }
.ca-pantalla .ca-importe { margin: 2px 0 0; font-size: 46px; color: #fff; text-shadow: 0 2px 14px rgba(0, 0, 0, .18); }
.ca-pantalla.ca-cobrado { background: linear-gradient(120deg, #16a34a, #0ea5b7); animation: ca-pop .5s cubic-bezier(.2, 1.4, .4, 1); }
.ca-tecla { border-radius: 16px; font-size: 24px; transition: background .15s ease, transform .1s ease; }
.ca-tecla:hover { background: color-mix(in oklab, var(--accion) 8%, var(--surface, #fff)); }
.ca-tecla:active { transform: scale(.94); background: color-mix(in oklab, var(--accion) 16%, var(--surface, #fff)); }
.ca-qr.ca-hecho { animation: ca-pop .5s cubic-bezier(.2, 1.4, .4, 1); box-shadow: 0 0 0 8px color-mix(in oklab, var(--ok, #1b8f5b) 14%, transparent), 0 10px 30px rgba(0,0,0,.08); }
.ca-cobrar { min-height: 50px; padding-inline: 26px; font-size: 16px; font-weight: 700; border: 0;
  background: linear-gradient(120deg, #1f3bff, #7a1cff); color: #fff;
  box-shadow: 0 12px 26px -12px rgba(122, 28, 255, .7); }
@keyframes ca-pop { 0% { transform: scale(.92); } 60% { transform: scale(1.04); } 100% { transform: scale(1); } }
html[data-theme="dark"] .ca-tecla { background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .12); color: var(--text-dark); }
html[data-theme="dark"] .ca-tecla:hover { background: rgba(255, 255, 255, .1); }
html[data-theme="dark"] .tpv-kpi, html[data-theme="dark"] .tpv-enl { background: rgba(255, 255, 255, .05); border-color: rgba(255, 255, 255, .1); }

@media (max-width: 760px) {
  .tpv-cta { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "ico ir" "txt txt"; gap: 16px; padding: 22px 20px 22px; border-radius: 26px; }
  .tpv-cta-ico { grid-area: ico; width: 64px; height: 64px; border-radius: 22px; } .tpv-cta-ico svg { width: 34px; height: 34px; }
  .tpv-cta-txt { grid-area: txt; } .tpv-cta-ir { grid-area: ir; width: 54px; height: 54px; }
  .tpv-cta-tarjeta { right: 84px; top: 58px; width: 132px; border-radius: 13px; } .tpv-cta-tarjeta.atras { display: none; }
  .tpv-cta-tarjeta b { left: 12px; top: 26px; width: 24px; height: 19px; border-radius: 5px; } .tpv-cta-tarjeta i { right: 9px; top: 9px; width: 22px; height: 22px; padding: 4px; border-radius: 7px; }
  .tpv-cta-tarjeta u { left: 12px; bottom: 22px; height: 6px; } .tpv-cta-tarjeta s { left: 12px; bottom: 12px; height: 6px; }
  .tpv-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .tpv-kpis .tpv-kpi:first-child { grid-column: 1 / -1; }
  .tpv-kpi { padding: 16px; border-radius: 20px; }
  .tpv-enl { grid-template-columns: 42px minmax(0, 1fr); gap: 12px; padding: 16px 14px 14px 16px; }
  .tpv-enl-av { width: 42px; height: 42px; border-radius: 14px; font-size: 14px; }
  .tpv-enl-imp { font-size: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .tpv-cta, .tpv-cta-brillo, .tpv-cta-ico i, .tpv-cta-tarjeta, .tpv-cta-tarjeta::after, .tpv-pill.est-pendiente i, .ca-pantalla.ca-cobrado, .ca-qr.ca-hecho { animation: none; }
  .tpv-cta-brillo, .tpv-cta-ico i { display: none; }
  .tpv-cta:hover, .tpv-enl:hover { transform: none; }
}

/* 0156 · Qué sesión del bono es («2/4») en el historial de la ficha */
.pa-bono-n { font-size: 11.5px; font-weight: 750; padding: 1px 8px; margin-left: 2px; vertical-align: 1px; font-variant-numeric: tabular-nums;
  color: var(--accion-oscura, var(--accion)); background: color-mix(in oklab, var(--accion) 14%, transparent); border: 1px solid color-mix(in oklab, var(--accion) 30%, transparent); }

/* 0157 · Otros cobros de la cita (informe, material…) */
.cb-otros { margin-top: 6px; }
.cb-otros-lista { list-style: none; margin: 0 0 8px; padding: 0; display: grid; gap: 6px; }
.cb-otros-lista li { display: grid; gap: 6px; padding: 8px 10px; border-radius: 12px; background: color-mix(in oklab, var(--text-dark) 4%, transparent); }
.cb-otros-lista .cb-otro-acc { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; }
.cb-otro-que { flex: 1 1 180px; min-width: 0; overflow-wrap: anywhere; }
.cb-otros-lista .cb-sel { max-width: 180px; }
.cb-otro-seguro { width: auto; padding: 0 10px; color: var(--peligro); font-size: 13px; font-weight: 650; }
.cb-otro-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 160px), 1fr)); gap: 10px; align-items: end;
  margin: 4px 0 10px; padding: 12px 14px; border-radius: 16px; background: color-mix(in oklab, var(--accion) 6%, transparent);
  border: 1px solid color-mix(in oklab, var(--accion) 20%, transparent); }
.cb-otro-form[hidden] { display: none; }
.cb-otro-form label { display: grid; gap: 4px; font-size: 13px; color: var(--text-muted); }
.cb-otro-form label[hidden] { display: none; }
.cb-otro-acc { display: flex; gap: 8px; flex-wrap: wrap; }

/* Panel 334 · Reclamar un pago pendiente por WhatsApp (Morosidad). */
.cb-reclamar {
  display: inline-flex; align-items: center; gap: 4px; margin: 6px 0 0 0; padding: 4px 12px;
  font: inherit; font-size: .76rem; font-weight: 600; line-height: 1.3; cursor: pointer;
  border-radius: 999px; border: 1px solid color-mix(in oklab, #25d366 55%, transparent);
  background: color-mix(in oklab, #25d366 10%, transparent); color: #128c4a; white-space: nowrap;
}
.cb-reclamar::before { content: "💬"; font-size: .85em; }
.cb-reclamar:hover { background: color-mix(in oklab, #25d366 18%, transparent); }
.cb-reclamar:disabled { cursor: default; opacity: .8; }
.cb-reclamar.hecho { border-color: var(--divider); background: transparent; color: var(--text-muted); }
.cb-reclamar.hecho::before { content: none; }
html[data-theme="dark"] .cb-reclamar { color: #6ee7a0; }
/* Panel 383 · Enlace de pago y Reclamar juntos, debajo de la forma de pago, y que bajen de línea si no caben
   (en el móvil se salían de la ficha y quedaban cortados). */
.cb-acc { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin-top: 6px; min-width: 0; }
.cb-acc:empty { display: none; }
/* 0182 · «Reclamado el 22/10»: lo enviado de verdad, lo vea quien lo vea. */
.cb-reclamado { display: inline-flex; align-items: center; gap: 4px; font-size: .74rem; font-weight: 600; color: #128c4a; white-space: nowrap; }
.cb-reclamado::before { content: "✓"; }
html[data-theme="dark"] .cb-reclamado { color: #6ee7a0; }
.cb-acc .cb-reclamar { margin: 0; }
.cb-acc .ep-boton { padding-left: 0; padding-right: 0; }
@media (max-width: 860px) {
  .tabla td[data-col="Cobrar"] { flex-wrap: wrap; align-items: center; row-gap: 8px; }
  .tabla td[data-col="Cobrar"] > select.cb-sel { flex: 1 1 0; width: auto; min-width: 0; }
  .tabla td[data-col="Cobrar"] > .cb-acc { flex: 0 0 100%; margin: 0; padding-left: calc(8.5em + 10px); }
}
@media (max-width: 400px) {
  .tabla td[data-col="Cobrar"] > .cb-acc { padding-left: 0; }
}

/* Panel 338 · Sala de vídeo del equipo (Videollamadas). */
.vc-equipo-cab { display: flex; gap: 12px; align-items: flex-start; }
.vc-equipo-cab h2 { margin: 0 0 4px; }
.vc-equipo-cab p { margin: 0; color: var(--text-muted); font-size: .86rem; line-height: 1.45; }
.vc-equipo-ico { font-size: 1.5rem; line-height: 1; padding-top: 2px; }
.vc-equipo-form { margin-top: 14px; }
/* Panel 344 · Con quién: fichas de personas que se pulsan (antes, un desplegable de lado a lado). */
.vc-equipo-gente { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 8px; }
.vc-equipo-cargando { color: var(--text-muted); font-size: .86rem; }
.vc-persona { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 7px 12px 7px 7px; border-radius: 999px;
              border: 1px solid var(--divider); background: color-mix(in oklab, var(--surface, transparent) 70%, transparent);
              color: inherit; font: inherit; font-size: .88rem; text-align: left; cursor: pointer;
              transition: border-color .15s, background .15s, box-shadow .15s; }
.vc-persona i { position: relative; flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%;
                overflow: hidden; background: var(--c, var(--marca)); color: #fff; font-style: normal; font-weight: 700; font-size: .75rem; }
/* Panel 349 · La foto de la profesional encima de las iniciales (si no carga, se quita y quedan las iniciales). */
.vc-persona i .vc-persona-foto { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.vc-persona span { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vc-persona:hover { border-color: var(--marca); }
.vc-persona:focus-visible { outline: 2px solid var(--marca); outline-offset: 2px; }
.vc-persona[aria-checked="true"] { border-color: var(--marca); background: var(--marca-clara); box-shadow: inset 0 0 0 1px var(--marca); font-weight: 650; }
.vc-persona[aria-checked="true"] i { box-shadow: 0 0 0 2px var(--marca); }
.vc-equipo-pie { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--divider); }
.vc-equipo-elegida { flex: 1 1 auto; font-weight: 600; font-size: .92rem; }
.vc-equipo-avisar { display: inline-flex; gap: 6px; align-items: center; font-size: .86rem; color: var(--text-muted); }
@media (max-width: 600px) {
  .vc-equipo-gente { grid-template-columns: 1fr 1fr; }
  .vc-equipo-pie .btn { width: 100%; }
}

/* Panel 348 · Morosidad de la semana pasada (lista + «Reclamar a todos»). */
.cb-semana { padding: 16px 18px; margin-bottom: 14px; }
.cb-semana-cab { display: flex; gap: 14px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.cb-semana-cab h3 { margin: 0 0 4px; font-size: 1rem; }
.cb-semana-cab p { margin: 0; max-width: 640px; }
.cb-semana-espera { font-size: .85rem; }
.cb-semana-lista { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 6px;
                   grid-template-columns: repeat(auto-fill, minmax(min(280px, 100%), 1fr)); }
.cb-semana-lista li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px 8px; align-items: baseline; padding: 8px 12px; min-width: 0;
                      border-radius: 10px; background: var(--dash-bg); font-size: .9rem; }
.cb-semana-lista li span { min-width: 0; overflow-wrap: anywhere; }
.cb-semana-lista li small { flex: none; text-align: right; margin-left: auto; } /* Panel 369 · en móvil estrecho baja a otra línea */
.cb-semana-lista li.hecho { opacity: .6; }
@media (max-width: 600px) { .cb-semana-cab .btn { width: 100%; } }

/* 0165 · Supervisiones programadas (Videollamadas → Supervisión o reunión del equipo). */
.vc-equipo-programar { display: flex; flex-wrap: wrap; gap: 10px 12px; align-items: flex-end; margin-top: 12px; }
.vc-equipo-prog-tit { flex: 1 1 100%; font-weight: 600; font-size: .9rem; }
.vc-equipo-prog-tit small { font-weight: 400; color: var(--text-muted); }
.vc-equipo-programar label { display: grid; gap: 4px; font-size: .8rem; color: var(--text-muted); }
.vc-equipo-programar .campo { height: 38px; }
.vc-reuniones h3 { margin: 16px 0 8px; font-size: .95rem; }
.vc-reuniones ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.vc-reuniones li { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; justify-content: space-between;
                   padding: 10px 14px; border-radius: 12px; background: var(--dash-bg); }
.vc-reuniones li div:first-child { display: grid; gap: 2px; font-size: .9rem; }
.vc-reuniones li span { color: var(--text-muted); font-size: .85rem; }
.vc-reunion-acc { display: flex; gap: 8px; }
/* 0194 · El enlace de invitados de una supervisión. */
.vc-invitados { flex-basis: 100%; margin-top: 8px; padding: 10px 12px; border-radius: 12px; background: var(--dash-bg); font-size: 13px; }
.vc-invitados[hidden] { display: none; }
.vc-cuenta { flex-basis: 100%; display: flex; align-items: center; gap: 6px; margin-top: 6px; font-size: 13px; color: var(--text-muted); cursor: pointer; }
.vc-editor label { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--text-muted); }
.vc-editor .campo { height: 34px; font-size: 13px; width: auto; }
.vc-invitados p { margin: 0 0 8px; color: var(--text-muted); }
.vc-invitados-fila { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.vc-invitados-fila .campo { flex: 1 1 220px; min-width: 0; height: 34px; font-size: 13px; }
.ag-ausencia.ag-reunion, .agl-ausencia.ag-reunion { background: color-mix(in oklab, var(--marca) 16%, transparent); color: var(--marca-oscura, var(--marca));
                       border: 1px dashed color-mix(in oklab, var(--marca) 55%, transparent); cursor: pointer; }
@media (max-width: 600px) { .vc-equipo-programar label { flex: 1 1 calc(50% - 6px); } .vc-equipo-programar .btn { width: 100%; } }

/* Panel 351 · miniatura del estilo «Consulta». */
.est-previa-consulta { background: radial-gradient(70% 90% at 100% 0%, color-mix(in oklab, var(--marca) 12%, transparent), transparent 70%), #FBF8F5; }
.est-previa-consulta i { margin-bottom: 18px; background: #fff; border-radius: 6px; box-shadow: 0 0 0 1px rgba(0, 7, 219, .08);
  border-top: 3px solid var(--marca); }
.est-previa-consulta b { background: var(--marca); border-radius: 4px; box-shadow: -14px 0 0 -4px var(--acento); }

/* Panel 354 · La tarifa de cada próxima cita en la ficha. */
.pc-cita .pc-tarifa { color: var(--text-muted); font-weight: 400; }
.pa-pareja-ya { margin: .4rem 0; padding: .6rem .75rem; border-radius: 10px; background: var(--surface-2, rgba(127,127,127,.08));
  display: grid; gap: .45rem; font-size: .92rem; }
.pa-pareja-ya .pa-pareja-acc { display: flex; flex-wrap: wrap; gap: .4rem; }
/* Panel 355 · Bonos: caducidad y sesiones con bono de Organízate. */
.tf-caducado { color: var(--peligro); }
.tf-bonos-org { margin: .3rem 0 .6rem; }
.tf-bonos-org > small { display: block; margin-top: .3rem; }

/* Panel 367 · Primeras citas por mes (Estadísticas → Citas). Una sola serie: el color de la consulta; el mes en curso,
   más intenso; los meses que aún no han llegado, apagados. La cifra va en tinta de texto, no en el color de la barra. */
.es-pc { padding: 14px 12px 6px; }
.es-pc-svg { display: block; width: 100%; height: auto; overflow: visible; }
.es-pc-base { stroke: color-mix(in oklab, var(--text-muted, #5A6D72) 35%, transparent); stroke-width: 1; }
.es-pc-zona { fill: transparent; }
.es-pc-barra { fill: color-mix(in oklab, var(--marca) 62%, transparent); transition: fill .15s ease; }
.es-pc-mes.actual .es-pc-barra { fill: var(--marca); }
.es-pc-mes.futuro .es-pc-barra { fill: color-mix(in oklab, var(--marca) 25%, transparent); }
.es-pc-mes:hover .es-pc-barra, .es-pc-mes:focus-visible .es-pc-barra { fill: color-mix(in oklab, var(--marca) 85%, #000); }
.es-pc-mes:focus-visible { outline: none; }
.es-pc-mes:focus-visible .es-pc-zona { fill: color-mix(in oklab, var(--marca) 8%, transparent); }
.es-pc-valor { font-size: 13px; font-weight: 700; text-anchor: middle; fill: var(--text-dark, currentColor); font-variant-numeric: tabular-nums; }
.es-pc-eje { font-size: 12px; text-anchor: middle; fill: var(--text-muted, currentColor); }
.es-pc-mes.actual .es-pc-eje { font-weight: 700; fill: var(--text-dark, currentColor); }
@media (max-width: 640px) { .es-pc-valor { font-size: 25px; } .es-pc-eje { font-size: 21px; } }

/* Panel 368 · En Continuidad, el nombre abre el envío de una plantilla (seguimiento o pausa). */
.es-cont-nombre { all: unset; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; border-radius: 6px; }
.es-cont-nombre:hover strong, .es-cont-nombre:focus-visible strong { text-decoration: underline; text-underline-offset: 3px; }
.es-cont-nombre:focus-visible { box-shadow: var(--focus); }
.es-cont-env { font-size: .85em; opacity: .55; }
.es-cont-nombre:hover .es-cont-env { opacity: 1; }

/* Panel 374 · Historial de la ficha: corregir tarifa, bono o precio de una sesión, en línea. */
.pa-hc-lapiz { width: 28px; height: 28px; font-size: 14px; margin-left: 4px; vertical-align: middle; }
.pa-hc-edit td { background: color-mix(in oklab, var(--marca) 6%, transparent); }
.pa-hc-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(170px, 100%), 1fr)); gap: 10px 12px; align-items: end; padding: 6px 2px; }
.pa-hc-form label { display: grid; gap: 4px; font-size: .82rem; color: var(--text-muted); }
.pa-hc-form .campo { width: 100%; min-width: 0; }
.pa-hc-botones { display: flex; gap: 8px; flex-wrap: wrap; }
.pa-hc-nota, .pa-hc-form .error-form { grid-column: 1 / -1; margin: 0; }

/* 0178 · Aviso de sesiones de Organízate que aún no cuentan en el bono */
.tf-org-aviso { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 8px; padding: 8px 10px;
  border-radius: 10px; background: color-mix(in srgb, var(--acento, #2f6bff) 10%, transparent); }

/* ---------------------------------------------------------------- 0203 · Semáforo de Meta (vidrio líquido)
   José Carlos (23/10): en Inicio, a dirección y administración, cómo está el WhatsApp de la consulta en Meta. */
.meta-host { padding: 0 4px; }
[data-sem="verde"]    { --sem: #1fb25a; }
[data-sem="amarillo"] { --sem: #f2b111; }
[data-sem="rojo"]     { --sem: #e5484d; }
[data-sem="gris"]     { --sem: #98a6ab; }

.meta-semaforo {
  position: relative; isolation: isolate; overflow: hidden;
  display: flex; align-items: center; gap: 16px; width: 100%;
  padding: 14px 18px; border-radius: 24px; text-align: left; cursor: pointer;
  color: inherit; font: inherit;
  background:
    radial-gradient(120% 160% at 0% 0%, color-mix(in oklab, var(--sem) 24%, transparent) 0%, transparent 58%),
    radial-gradient(80% 120% at 100% 100%, color-mix(in oklab, var(--sem) 10%, transparent) 0%, transparent 60%),
    var(--vidrio-reflejo), var(--vidrio);
  -webkit-backdrop-filter: blur(28px) saturate(185%);
  backdrop-filter: blur(28px) saturate(185%);
  border: 1px solid var(--vidrio-borde);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .75), inset 0 -1px 0 rgba(255, 255, 255, .18),
    0 18px 40px -26px color-mix(in oklab, var(--sem) 70%, transparent), var(--sombra-vidrio);
  transition: transform .25s ease, box-shadow .25s ease;
}
/* El brillo que recorre el cristal. */
.meta-semaforo::before {
  content: ""; position: absolute; inset: -40% -20%; z-index: -1; pointer-events: none;
  background: linear-gradient(105deg, transparent 38%, rgba(255, 255, 255, .32) 50%, transparent 62%);
  transform: translateX(-60%); animation: meta-brillo 7s ease-in-out infinite;
}
@keyframes meta-brillo { 0%, 55% { transform: translateX(-60%); } 85%, 100% { transform: translateX(60%); } }
.meta-semaforo:hover { transform: translateY(-1px); }
.meta-semaforo:focus-visible { outline: none; box-shadow: var(--focus), var(--sombra-vidrio); }

/* El semáforo: una cápsula de cristal oscuro con tres luces; la que toca, encendida. */
.meta-luces {
  flex: none; display: inline-flex; flex-direction: column; gap: 5px; padding: 7px 6px; border-radius: 999px;
  background: linear-gradient(180deg, rgba(255, 255, 255, .16), rgba(255, 255, 255, 0) 45%), rgba(12, 24, 26, .78);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), inset 0 0 0 1px rgba(255, 255, 255, .06), 0 6px 14px -6px rgba(0, 0, 0, .45);
}
.meta-luces i {
  --c: #888; width: 12px; height: 12px; border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, rgba(255, 255, 255, .35), transparent 45%), color-mix(in oklab, var(--c) 22%, #10191b);
}
.meta-luces .l-rojo { --c: #e5484d; } .meta-luces .l-amarillo { --c: #f2b111; } .meta-luces .l-verde { --c: #1fb25a; }
.meta-luces[data-sem="rojo"] .l-rojo, .meta-luces[data-sem="amarillo"] .l-amarillo, .meta-luces[data-sem="verde"] .l-verde {
  background: radial-gradient(circle at 35% 30%, rgba(255, 255, 255, .9), transparent 42%), var(--c);
  box-shadow: 0 0 8px var(--c), 0 0 20px color-mix(in oklab, var(--c) 60%, transparent);
  animation: meta-latido 2.8s ease-in-out infinite;
}
@keyframes meta-latido { 50% { box-shadow: 0 0 5px var(--c), 0 0 12px color-mix(in oklab, var(--c) 40%, transparent); } }
.meta-luces.grande { gap: 7px; padding: 9px 8px; }
.meta-luces.grande i { width: 18px; height: 18px; }

.meta-texto { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.meta-titulo { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--text-muted); }
.meta-marca { display: inline-flex; align-items: center; gap: 5px; font-weight: 650; color: var(--text-dark); }
.meta-marca img { height: 14px; width: auto; }
.meta-sep { opacity: .5; }
.meta-estado { font-size: 17px; font-weight: 650; color: color-mix(in oklab, var(--sem) 55%, var(--text-dark)); }
.meta-detalle { font-size: 13px; color: var(--text-muted); overflow-wrap: anywhere; }
.meta-ver { margin-left: auto; flex: none; font-size: 13px; font-weight: 600; color: var(--marca-media); white-space: nowrap; }
@media (max-width: 560px) {
  .meta-semaforo { gap: 12px; padding: 12px 14px; }
  .meta-ver { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .meta-semaforo::before, .meta-luces i { animation: none !important; }
  .meta-semaforo:hover { transform: none; }
}

/* El detalle, en el cajón. */
.meta-cabeza {
  display: flex; align-items: center; gap: 16px; padding: 14px 16px; margin-bottom: 12px; border-radius: 20px;
  background: radial-gradient(120% 160% at 0% 0%, color-mix(in oklab, var(--sem) 22%, transparent), transparent 60%), var(--dash-bg);
  border: 1px solid var(--vidrio-borde);
}
.meta-cabeza .meta-estado { font-size: 20px; }
.meta-motivos { margin: 0 0 8px; padding: 10px 14px 10px 30px; border-radius: 14px; font-size: 14px;
  background: color-mix(in oklab, var(--sem, #f2b111) 12%, transparent); }
.meta-motivos li + li { margin-top: 4px; }
.meta-ok { margin: 0 0 8px; font-size: 14px; color: var(--text-muted); }
.meta-h3 { margin: 18px 0 6px; font-size: 12px; font-weight: 650; letter-spacing: .04em; text-transform: uppercase; color: var(--text-muted); }
.meta-punto { display: inline-block; width: 9px; height: 9px; margin-right: 7px; border-radius: 50%; vertical-align: 1px;
  background: var(--sem); box-shadow: 0 0 6px color-mix(in oklab, var(--sem) 70%, transparent); }
.meta-info { margin: 6px 0; padding: 9px 12px; border-radius: 12px; font-size: 13px; color: var(--text-muted); background: var(--dash-bg); }
.meta-plantillas, .meta-historial, .meta-consejos { margin: 6px 0; padding-left: 18px; font-size: 14px; }
.meta-historial { list-style: none; padding-left: 0; }
.meta-historial li { display: flex; gap: 4px; align-items: baseline; padding: 4px 0; }
.meta-consejos li + li, .meta-plantillas li + li { margin-top: 4px; }
.meta-app { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 8px; font-size: 14px; }
.meta-nota { margin: 6px 0 0; font-size: 12px; }

/* 0207 · Citas con tarifa rara: el motivo, a la vista. */
.pd-que small.pd-motivo { color: var(--peligro); font-weight: 600; }

/* Panel 420 · Cobros y TPV: «Pagados por día» (Silvia, 26/10). */
.tpv-vistas { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 10px; margin: 0 0 12px; }
.tpv-desde { display: grid; gap: 4px; font-size: 13px; color: var(--text-muted); }
.tpv-desde .campo { width: auto; }
.tpv-dia { margin: 0 0 12px; padding: 14px 16px; border-radius: 18px; }
.tpv-dia-cab { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 6px 12px; margin-bottom: 8px; }
.tpv-dia-cab h4 { margin: 0; font-size: 16px; color: var(--text-dark); }
.tpv-dia-cab span { font-size: 14px; color: var(--text-muted); }
.tpv-dia-cab b { color: var(--text-dark); }
.tpv-dia-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.tpv-dia-lista li { display: grid; grid-template-columns: 52px 1fr auto; gap: 10px; align-items: center; padding: 8px 0;
  border-top: 1px solid color-mix(in oklab, var(--text-muted) 18%, transparent); }
.tpv-dia-lista li:first-child { border-top: 0; }
.tpv-dia-h { font-variant-numeric: tabular-nums; color: var(--text-muted); font-size: 14px; }
.tpv-dia-q { display: grid; min-width: 0; }
.tpv-dia-q strong { font-size: 15px; overflow-wrap: anywhere; }
.tpv-dia-q small { font-size: 12.5px; color: var(--text-muted); overflow-wrap: anywhere; }
.tpv-dia-i { font-variant-numeric: tabular-nums; font-size: 15px; }
.cb-novino { margin: -4px 2px 12px; font-size: 13.5px; color: var(--text-muted); }   /* Panel 420 */
/* Panel 420 · QR del enlace de pago, para enseñarlo en la consulta. */
.ep-qr { display: grid; justify-items: center; gap: 8px; margin: 12px 0 4px; text-align: center; }
.ep-qr svg { width: min(260px, 70vw); height: auto; padding: 10px; border-radius: 16px; background: #fff; box-shadow: 0 6px 18px rgba(10,30,70,.12); }
/* 0221 · Pagados por día: los marcados a mano, resaltados como con un rotulador; los del enlace, en blanco. */
.tpv-dia-reparto { flex-basis: 100%; font-size: 12.5px; color: var(--text-muted); }
.tpv-dia-lista li.mano { position: relative; isolation: isolate; border-top-color: transparent; margin: 3px -8px; padding: 8px; }
.tpv-dia-lista li.mano + li { border-top-color: transparent; }
.tpv-dia-lista li.mano::before {
  content: ""; position: absolute; inset: 1px 0; z-index: -1; pointer-events: none;
  border-radius: 14px 9px 16px 8px / 10px 14px 9px 15px; transform: rotate(-.35deg) skewX(-3deg);
  background: linear-gradient(100deg, color-mix(in oklab, #ffd83d 30%, transparent), color-mix(in oklab, #ffd83d 44%, transparent) 55%, color-mix(in oklab, #ffd83d 32%, transparent));
}
.tpv-mano { display: inline-flex; align-items: center; gap: 4px; margin-top: 3px; width: fit-content; font-size: 12px; font-weight: 600;
  color: color-mix(in oklab, #8a5a00 85%, var(--text-dark)); }
.tpv-mano svg { width: 14px; height: 14px; }
.tpv-uso { margin: 0 0 12px; padding: 14px 16px; border-radius: 18px; display: grid; gap: 8px; }
.tpv-uso-cab { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.tpv-uso-cab strong { font-size: 15px; color: var(--text-dark); }
.tpv-uso-cab span { font-size: 13.5px; color: var(--text-muted); }
.tpv-uso-cab b { font-size: 18px; color: var(--text-dark); }
.tpv-uso-barra { height: 10px; border-radius: 99px; overflow: hidden; background: color-mix(in oklab, #ffd83d 45%, transparent); }
.tpv-uso-barra i { display: block; height: 100%; border-radius: 99px; background: var(--marca, #2563eb); }
.tpv-uso-ley { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 13px; color: var(--text-dark); }
.tpv-uso-ley span { display: inline-flex; align-items: center; gap: 6px; }
.tpv-uso-ley i { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }
.tpv-uso-ley i.en { background: var(--marca, #2563eb); }
.tpv-uso-ley i.ma { background: color-mix(in oklab, #ffd83d 70%, transparent); }
.tpv-uso-ley svg { width: 14px; height: 14px; color: #8a5a00; }
.tpv-uso small { font-size: 12px; color: var(--text-muted); line-height: 1.45; }

/* 0231 · Bonos de horas de los alquiladores (Despachos → Alquiladores → Bonos). */
.dp-alq-botones { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; flex: none; }
.dp-alq-bonos { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 4px; }
.dp-alq-bonos .chip { font-size: 12px; }
.dp-bonos { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 10px; }
.dp-bono { display: grid; gap: 6px; padding: 12px 14px; border: 1px solid var(--divider); border-radius: 12px; background: var(--surface, #fff); }
.dp-bono.cerrado { opacity: .7; }
.dp-bono-cab { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.dp-bono-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.dp-bono small { font-size: 12.5px; color: var(--text-muted); overflow-wrap: anywhere; }
.dp-bono small strong { color: var(--text-dark); }
.dp-bono-barra { height: 6px; border-radius: 99px; background: var(--dash-bg); overflow: hidden; }
.dp-bono-barra span { display: block; height: 100%; background: var(--marca); border-radius: inherit; }
.dp-bono-usos summary { cursor: pointer; font-size: 13px; font-weight: 600; color: var(--marca-oscura); }
.dp-bono-usos ul { margin: 6px 0 0; padding-left: 18px; display: grid; gap: 2px; font-size: 13px; }
.dp-bono-usos li.pasada { color: var(--text-muted); }
.dp-bono .ct-acciones { margin-top: 2px; }
.dp-bono-form { display: grid; gap: 4px; padding: 12px 14px; margin: 12px 0; border: 1px dashed var(--divider); border-radius: 12px; }
.dp-sin-bono { margin-bottom: 12px; }
.dp-sin-bono ul { margin: 6px 0; padding-left: 18px; font-size: 13px; }
@media (max-width: 560px) {
  .dp-alq { align-items: flex-start; }
  .dp-bono-form .paneles { grid-template-columns: 1fr !important; }
}

/* 0233 · Silvia (28/10): cada mes del gráfico de primeras citas se pulsa y abre quiénes son, con quién y si siguen. */
.es-pc-mes.con { cursor: pointer; }
.es-pc-ver { display: block; margin: 8px auto 6px; }
.es-det-resumen .es-est-ir { cursor: pointer; }
.es-det-resumen .es-est-ir:hover { border-color: var(--text-dark); }
.es-pc-pros { margin: 0 0 10px; }
.es-punto { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 6px; vertical-align: middle; }
.es-pc-resumen { margin: 4px 0 8px; font-size: 14px; line-height: 1.45; }

/* 0233 · Silvia (28/10): Cobros con calendario. Cada día, cuántas sesiones y lo cobrado; el día elegido, marcado. */
.cb-barra-btns { display: flex; flex-wrap: wrap; gap: 8px; }
@media (max-width: 640px) { .cb-barra-btns { flex-direction: column; } }
.cb-cal { padding: 12px; margin-bottom: 12px; }
.cb-cal-cab, .cb-cal-rejilla { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.cb-cal-cab span { text-align: center; font-size: 12px; font-weight: 700; color: var(--text-muted); padding-bottom: 4px; }
.cb-cal-dia { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 1px; min-height: 54px; min-width: 0;
              padding: 6px 2px; border: 1px solid var(--divider); border-radius: 10px; background: var(--card-bg); color: var(--text-dark);
              font: inherit; cursor: pointer; font-variant-numeric: tabular-nums; }
.cb-cal-dia b { font-size: 14px; }
.cb-cal-dia small { font-size: 11px; color: var(--text-muted); line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.cb-cal-dia .cb-cal-eur { color: var(--text-dark); font-weight: 600; }
.cb-cal-dia.con { background: color-mix(in oklab, var(--marca) 10%, var(--card-bg)); }
.cb-cal-dia.hoy b { text-decoration: underline; text-underline-offset: 3px; }
.cb-cal-dia:disabled { cursor: default; background: transparent; color: var(--text-muted); border-color: transparent; }
.cb-cal-dia.activo { background: var(--text-dark); color: var(--fondo); border-color: var(--text-dark); }
.cb-cal-dia.activo small { color: inherit; opacity: .85; }
.cb-cal-dia:focus-visible { outline: none; box-shadow: var(--focus); }
.cb-cal-dia:not(:disabled):hover { border-color: var(--text-dark); }
.cb-cal-pie { margin: 10px 2px 0; font-size: 13px; color: var(--text-muted); }
@media (max-width: 640px) { .cb-cal { padding: 10px 8px; } .cb-cal-dia { min-height: 50px; } .cb-cal-dia .cb-cal-eur { font-size: 10px; } }

/* 0234 · Pagado online con el enlace (Por paciente) y «Quién paga» (ficha y enlace de pago). */
.cp-online { color: var(--exito, #1f7a4d); font-size: 12px; font-weight: 600; }
.qp-lista { list-style: none; margin: 0 0 6px; padding: 0; display: grid; gap: 6px; }
.qp-lista li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 10px; }
.qp-form { display: grid; gap: 8px; margin-top: 8px; padding: 12px; border: 1px solid var(--divider); border-radius: 12px; }
.qp-form .pa-check { align-items: flex-start; }
.ep-quien { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.qp-form .acciones-fila { display: flex; flex-wrap: wrap; gap: 8px; }
.qp-lista .btn-enlace.peligro { color: var(--peligro, #b3261e); }

/* 0235 · Sofía (28/10): al cambiar la profesional, qué es (derivar, corregir o que la llevan las dos). */
.pa-tipo-cambio { display: grid; gap: 6px; margin: 6px 0 8px; font-size: 13px; }
.pa-tipo-cambio label { display: flex; gap: 8px; align-items: baseline; cursor: pointer; }
.pa-dos { display: flex; flex-wrap: wrap; gap: 8px; margin: 6px 0; }
.pa-dos .campo { flex: 1 1 160px; min-width: 0; }
.pa-co { white-space: nowrap; }

/* 0239 · Pago a cuenta de un bono (ficha). */
.tf-acuenta { display: grid; gap: 4px; margin-top: 6px; font-size: 13px; }
.tf-ac-linea { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: baseline; }
.tf-ac-falta { color: var(--text-dark); }
.tf-ac-form { display: flex; flex-wrap: wrap; gap: 8px; align-items: end; margin-top: 4px; }
.tf-ac-form label { display: grid; gap: 3px; font-size: 12px; color: var(--text-muted); }
.tf-ac-form .campo { width: 130px; }
.tf-ac-form small { flex-basis: 100%; }

/* 0240 · «A cuenta…» en la Caja del día y en Cobros: importe, forma y botón, en la celda del cobro. */
.cb-ac-mini { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.cb-ac-mini .campo { width: auto; min-width: 0; flex: 1 1 80px; }
.cb-ac-mini [data-ac-imp] { max-width: 100px; }
.cb-ac-mini small { flex-basis: 100%; }

/* Sofía (29/10): online desde la consulta sin ningún despacho libre a esa hora. */
.dp-online-choca { outline: 2px solid #c0392b; outline-offset: -2px; }

/* 0249 · Facturas */
.fa-aviso { margin: 0 0 12px; padding: 10px 14px; border-radius: 12px; background: color-mix(in srgb, #f5b041 18%, transparent);
  border: 1px solid color-mix(in srgb, #f5b041 45%, transparent); }
.fa-nuevas { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 6px; }
.fa-siguen { margin: 4px 0 12px; }
.fa-tabla .chip { font-size: 11px; }
.fa-rectificada td { opacity: .65; }
.fa-sesiones { border: 1px solid var(--borde, rgba(127,127,127,.25)); border-radius: 12px; padding: 8px 12px; margin: 10px 0; }
.fa-sesiones legend { font-weight: 600; padding: 0 6px; }
.fa-sesion { display: grid; grid-template-columns: auto minmax(0, 9em) minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 7px 0;
  border-bottom: 1px solid var(--borde, rgba(127,127,127,.15)); cursor: pointer; }
.fa-sesion:last-child { border-bottom: 0; }
.fa-sesion span:nth-of-type(2) { color: var(--text-muted); font-size: .92em; overflow-wrap: anywhere; }
.fa-todas { margin-bottom: 4px; }
.fa-total { margin-right: auto; }
.fa-emisor { border: 1px solid var(--borde, rgba(127,127,127,.25)); border-radius: 12px; padding: 10px 12px; margin: 0 0 14px; }
.fa-emisor legend { font-weight: 600; padding: 0 6px; }
.fa-vista { background: #fff; color: #111; border-radius: 10px; padding: 16px; overflow-x: auto; }
.fa-vista .fa-doc-cab { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 14px; }
.fa-vista .fa-doc-num { text-align: right; }
.fa-vista .fa-doc-num span { display: block; font-size: 11px; letter-spacing: .08em; color: #555; }
.fa-vista .fa-doc-num strong { display: block; font-size: 18px; }
.fa-vista .fa-doc-cli { border: 1px solid #ddd; border-radius: 6px; padding: 8px 10px; margin-bottom: 12px; }
.fa-vista table { width: 100%; border-collapse: collapse; }
.fa-vista .n { text-align: right; white-space: nowrap; }
.fa-vista .fa-doc-lin th { font-size: 11px; text-align: left; border-bottom: 2px solid #222; padding: 5px 4px; }
.fa-vista .fa-doc-lin td { border-bottom: 1px solid #e5e5e5; padding: 5px 4px; vertical-align: top; }
.fa-vista .fa-doc-tot { width: auto; min-width: 220px; margin: 10px 0 0 auto; }
.fa-vista .fa-doc-total td { font-weight: 700; border-top: 2px solid #222; }
.fa-vista .fa-doc-nota { margin: 10px 0 0; } .fa-vista .fa-doc-pie { margin-top: 16px; font-size: 11px; color: #555; }
.fa-rectificar { margin-top: 12px; }
@media (max-width: 600px) {
  .fa-sesion { grid-template-columns: auto 1fr auto; }
  .fa-sesion span:nth-of-type(2) { grid-column: 2 / 3; }
  .fa-nuevas .btn { flex: 1 1 45%; }
}

/* 0250 · Festivos */
.hz-festivos-lista { list-style: none; margin: 8px 0 12px; padding: 0; max-height: 320px; overflow-y: auto; }
.hz-festivos-lista li { display: grid; grid-template-columns: minmax(0, 11em) minmax(0, 1fr) auto; gap: 10px; align-items: center;
  padding: 6px 0; border-bottom: 1px solid var(--borde, rgba(127,127,127,.15)); }
.hz-festivos-lista small { color: var(--text-muted); }
.hz-festivo-nuevo { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-end; }
.hz-festivo-nuevo label { display: flex; flex-direction: column; gap: 4px; }
.hz-festivo-nuevo .hz-ancho { flex: 1 1 200px; }
@media (max-width: 600px) { .hz-festivos-lista li { grid-template-columns: 1fr auto; } .hz-festivos-lista li span:nth-child(2) { grid-column: 1; } }

/* 0251 · Office y carriles en Despachos */
.dp-bloque.dp-lane { left: calc(4px + (100% - 8px) * var(--lane) / var(--lanes)) !important; right: auto !important;
  width: calc((100% - 8px) / var(--lanes) - 3px); }
.dp-col-office { background: repeating-linear-gradient(45deg, transparent 0 8px, color-mix(in oklab, var(--marca) 4%, transparent) 8px 16px); cursor: default; }
.dp-cab-office strong { font-style: italic; }
.dp-conflictos { margin: 0 0 10px; padding: 10px 14px; border-radius: 12px; border: 1px solid #c0392b; background: color-mix(in srgb, #c0392b 10%, transparent); }
.dp-conflictos ul { margin: 6px 0; padding-left: 18px; }
button.dp-online { cursor: pointer; text-align: left; font: inherit; color: inherit; border: 0; }
.dp-mover { display: grid; gap: 8px; margin-bottom: 12px; }
.dp-mover-op { display: grid; text-align: left; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--borde, rgba(127,127,127,.25));
  background: var(--card-bg, transparent); color: inherit; font: inherit; cursor: pointer; }
.dp-mover-op.on { border-color: var(--marca); box-shadow: 0 0 0 2px color-mix(in oklab, var(--marca) 30%, transparent); }
.dp-mover-op small { color: var(--text-muted); }

/* Panel 472 · 0254 · Carpeta de bonos: una carpeta por paciente y, dentro, sus bonos como entradas con QR. */
.cbo-barra { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; justify-content: space-between; margin-bottom: 16px; }
.cbo-barra .cb-busca { flex: 1 1 240px; max-width: 360px; }
.cbo-filtro { display: flex; gap: 6px; flex-wrap: wrap; }
.cbo-carpetas { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 14px; }
.cbo-carpeta { position: relative; display: flex; flex-direction: column; align-items: center; gap: 4px; text-align: center;
  padding: 14px 10px 12px; border-radius: 16px; border: 1px solid transparent; background: transparent; color: inherit;
  font: inherit; cursor: pointer; transition: background .15s ease, border-color .15s ease, transform .12s ease; min-width: 0; }
.cbo-carpeta:hover { background: color-mix(in oklab, var(--marca) 7%, transparent); border-color: color-mix(in oklab, var(--marca) 18%, transparent); }
.cbo-carpeta:active { transform: scale(.98); }
.cbo-carpeta:focus-visible { outline: 3px solid color-mix(in oklab, var(--marca) 45%, transparent); outline-offset: 2px; }
.cbo-icono { width: 74px; height: 60px; margin-bottom: 2px; }
.cbo-trasera { fill: color-mix(in oklab, var(--marca) 62%, #000 8%); }
.cbo-hoja { fill: #fff; opacity: .95; }
.cbo-delante { fill: var(--marca); }
.cbo-carpeta:hover .cbo-hoja { transform: translateY(-3px); transition: transform .15s ease; }
.cbo-cuenta { position: absolute; top: 10px; right: calc(50% - 46px); min-width: 22px; height: 22px; padding: 0 6px; border-radius: 999px;
  background: var(--acento, #ee7f6a); color: #fff; font-size: 12px; font-weight: 700; line-height: 22px; }
.cbo-nombre { font-size: 14px; line-height: 1.25; max-width: 100%; overflow: hidden; text-overflow: ellipsis; display: -webkit-box;
  -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.cbo-carpeta small { color: var(--text-muted); font-size: 12px; line-height: 1.3; }
.cbo-carpeta .cbo-falta { color: #b26a00; font-weight: 600; }
@media (prefers-reduced-motion: reduce) { .cbo-carpeta, .cbo-carpeta:hover .cbo-hoja { transition: none; transform: none; } }

.cbo-cajon .cajon-cuerpo { background: color-mix(in oklab, var(--marca) 5%, transparent); }
.cbo-entradas { display: grid; gap: 16px; }
.cbo-entrada { background: #fff; color: #13262a; border-radius: 18px; overflow: hidden; box-shadow: 0 1px 2px rgba(19,38,42,.06), 0 10px 26px rgba(19,38,42,.1); }
.cbo-cab { display: flex; align-items: center; gap: 12px; padding: 14px 16px 12px; }
.cbo-cab img { height: 34px; max-width: 110px; object-fit: contain; flex: none; }
.cbo-cab > div { flex: 1; min-width: 0; }
.cbo-et { display: block; font-size: 11px; font-weight: 750; letter-spacing: .14em; text-transform: uppercase; color: var(--marca); }
.cbo-cab h3 { margin: 2px 0 0; font-size: 17px; line-height: 1.2; color: #13262a; overflow-wrap: anywhere; }
.cbo-estado { flex: none; padding: 3px 9px; border-radius: 999px; font-size: 12px; font-weight: 700; }
.cbo-activo { background: #e5f4e8; color: #2e7d32; }
.cbo-aviso { background: #fbeedb; color: #9a5a00; }
.cbo-gris { background: #eceff0; color: #5b6b6e; }
.cbo-franja { height: 4px; background: linear-gradient(90deg, var(--marca), var(--acento, var(--marca))); }
.cbo-cuerpo { padding: 14px 16px 10px; }
.cbo-grande { display: flex; align-items: center; gap: 10px; }
.cbo-grande b { font-size: 46px; line-height: 1; font-weight: 800; color: var(--marca); font-variant-numeric: tabular-nums; }
.cbo-grande span { font-weight: 650; font-size: 15px; }
.cbo-grande small { display: block; font-weight: 500; color: #5b6b6e; font-size: 13px; }
.cbo-puntos { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.cbo-puntos i { width: 16px; height: 16px; border-radius: 50%; border: 2px solid color-mix(in oklab, var(--marca) 55%, #fff); }
.cbo-puntos i.usada { background: #c9cfd0; border-color: transparent; }
.cbo-puntos i.reservada { background: color-mix(in oklab, var(--acento, var(--marca)) 30%, #fff); border-color: var(--acento, var(--marca)); }
.cbo-corte { border-top: 2px dashed rgba(19,38,42,.13); margin: 4px 14px 0; }
.cbo-pie { display: flex; gap: 14px; align-items: center; padding: 14px 16px; }
.cbo-qr { flex: none; display: block; width: 104px; height: 104px; border-radius: 8px; }
.cbo-qr svg { display: block; width: 100%; height: 100%; }
.cbo-qr:focus-visible { outline: 3px solid color-mix(in oklab, var(--marca) 45%, transparent); outline-offset: 2px; }
.cbo-datos { display: grid; gap: 3px; font-size: 13.5px; color: #5b6b6e; min-width: 0; }
.cbo-datos b { color: #13262a; }
.cbo-pagado { justify-self: start; margin-top: 4px; padding: 2px 9px; border-radius: 999px; font-size: 12px; font-weight: 700; background: #e5f4e8; color: #2e7d32; }
.cbo-pagado.no { background: #fbeedb; color: #9a5a00; }
.cbo-acciones { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 16px 16px; }
@media (max-width: 480px) {
  .cbo-carpetas { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .cbo-qr { width: 92px; height: 92px; }
  .cbo-grande b { font-size: 40px; }
}

/* Panel 472 · Archivos: carpetas arriba; al abrir una, el camino de vuelta. */
.ar-cabeza { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.ar-cabeza .eq-sub { margin: 0; max-width: 60ch; }
.ar-migas { display: flex; align-items: center; gap: 8px; margin: 0 0 14px; font-size: 15px; }
.ar-migas .btn-enlace { font-size: 15px; }
.ar-carpetas .cbo-carpeta small { max-width: 18ch; }

/* Panel 491 · «Conectar WhatsApp» (registro insertado de Meta). */
.cw-seccion { margin: 4px 0 8px; }
.cw-texto { margin: 6px 0; font-size: 14px; }
.cw-pasos { margin: 6px 0 8px; padding-left: 20px; font-size: 14px; color: var(--text-muted); }
.cw-pasos li { margin: 2px 0; }
.cw-nota { margin: 0 0 10px; font-size: 13px; }
.cw-boton { background: #1f9d57; border-color: #1f9d57; color: #fff; }
.cw-boton:hover:not(:disabled) { background: #188048; border-color: #188048; }
.cw-boton:disabled { opacity: .7; cursor: progress; }
.cw-tarjeta { display: flex; align-items: center; gap: 14px; cursor: default; flex-wrap: wrap; }
.cw-tarjeta .meta-texto { flex: 1 1 220px; }
.cw-icono { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: #e7f6ee; color: #1f9d57; flex: none; }
@media (max-width: 560px) { .cw-tarjeta .cw-boton { width: 100%; } }
.cw-tarjeta:hover { transform: none; }

/* Panel 497 · Aviso en WhatsApp cuando la consulta aún no ha conectado su número. */
.cw-aviso { display: flex; flex-direction: column; align-items: stretch; gap: 10px; flex: none; margin: 10px 16px 12px; padding: 16px; border-radius: 18px;
  background: linear-gradient(135deg, #eaf7ef, #fff7f1); border: 1px solid rgba(31, 157, 87, .25); box-shadow: 0 10px 28px -20px rgba(20, 60, 40, .5); }
.cw-aviso-txt { min-width: 0; }
.cw-aviso .cw-boton { width: 100%; }
.cw-aviso h2 { margin: 0 0 4px; font-size: 1.15rem; }
.cw-aviso p { margin: 0 0 6px; color: var(--text-muted); font-size: 14.5px; }
.cw-aviso-lista { margin: 4px 0 0; padding-left: 18px; font-size: 13.5px; color: var(--text-muted); }
.cw-icono.grande { width: 46px; height: 46px; }
.cw-icono.grande svg { width: 32px; height: 32px; }
@media (max-width: 600px) { .cw-aviso .cw-boton { width: 100%; } }

/* 0264 · Reservas del alquilador (con bono o no), anulaciones tardías y la «B» del calendario. */
.dp-reservas { margin-top: 16px; border: 1px solid var(--vidrio-borde); border-radius: 14px; padding: 10px 12px; }
.dp-reservas > summary { cursor: pointer; font-weight: 700; display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; }
.dp-reservas > summary small { font-weight: 500; color: var(--text-muted); }
.dp-reservas .eq-sub { margin: 6px 0 8px; display: block; }
/* 0268 · lo que contestó el alquilador al recordatorio */
.dp-marca-conf { display: inline-grid; place-items: center; width: 15px; height: 15px; border-radius: 50%; font-size: 10px; font-weight: 800; vertical-align: 1px; }
.dp-marca-conf.ok { background: #2e7d32; color: #fff; }
.dp-marca-conf.no { background: #c62828; color: #fff; }
/* Panel 507 · historial del alquilador */
.dp-hist-resumen { display: flex; flex-wrap: wrap; gap: 8px; margin: 2px 0 10px; }
.dp-hist-resumen span { padding: 6px 10px; border-radius: 10px; background: var(--superficie-2, rgba(0,0,0,.04)); font-size: .86rem; }
.dp-reservas-lista { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 2px; }
.dp-reservas-lista li { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 7px 2px;
  border-top: 1px solid var(--vidrio-borde); font-size: 13px; }
.dp-reservas-lista li:first-child { border-top: 0; }
.dp-reservas-lista li.pasada { opacity: .6; }
.dp-reservas-lista li > span { min-width: 0; }
.dp-reservas-lista .pl-interruptor { flex: none; padding: 0; }
.dp-marca-bono { display: inline-grid; place-items: center; min-width: 16px; height: 16px; padding: 0 3px; margin-left: 4px; border-radius: 5px;
  background: var(--marca); color: #fff; font-size: 10px; font-weight: 800; line-height: 1; vertical-align: 1px; }
.dp-penal { color: var(--peligro); }

/* Panel 504/505 · Incoherencias: ventana antes de reservar y aviso en la cita. Triángulo amarillo en relieve con aura. */
.inc-capa { position: fixed; inset: 0; z-index: 4000; display: grid; place-items: center; padding: 16px;
  background: rgba(12, 16, 18, .5); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); animation: inc-entra-capa .18s ease-out; }
.inc-caja { position: relative; width: min(520px, 100%); max-height: calc(100vh - 32px); overflow: auto; color: var(--text);
  background: linear-gradient(180deg, rgba(255, 214, 64, .16), rgba(255, 214, 64, 0) 120px), var(--fondo, #fff);
  border: 1.5px solid rgba(242, 154, 0, .55); border-radius: 22px; padding: 22px 22px 18px;
  box-shadow: 0 0 0 6px rgba(255, 194, 26, .12), 0 28px 70px rgba(0, 0, 0, .32); animation: inc-entra .26s cubic-bezier(.2, .9, .3, 1.25); }
.inc-cab { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; }
.inc-cab h2 { margin: 0; font-size: 19px; letter-spacing: -.01em; }
.inc-cab small { display: block; font-weight: 500; font-size: 13px; color: var(--text-muted); margin-top: 2px; }
.inc-ico3d { position: relative; flex: none; display: inline-grid; place-items: center; width: 58px; height: 54px; }
.inc-ico3d svg { position: relative; z-index: 1; filter: drop-shadow(0 3px 0 rgba(0, 0, 0, .28)) drop-shadow(0 8px 10px rgba(242, 154, 0, .45));
  animation: inc-flota 2.6s ease-in-out infinite; }
.inc-aura { position: absolute; inset: 2px 4px 0; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(255, 210, 40, .75), rgba(255, 194, 26, .28) 55%, rgba(255, 194, 26, 0) 75%);
  animation: inc-late 1.8s ease-out infinite; }
.inc-aura.dos { animation-delay: .9s; }
@keyframes inc-late { 0% { transform: scale(.7); opacity: .95; } 100% { transform: scale(1.65); opacity: 0; } }
@keyframes inc-flota { 0%, 100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(-2px) rotate(-2deg); } }
@keyframes inc-entra { from { transform: translateY(14px) scale(.96); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes inc-entra-capa { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .inc-aura, .inc-ico3d svg, .inc-caja, .inc-capa { animation: none; } .inc-aura { opacity: .5; transform: scale(1.1); } }
.inc-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.inc-item { display: grid; gap: 10px; padding: 12px 14px; border-radius: 14px; background: rgba(255, 194, 26, .12);
  border: 1px solid rgba(242, 154, 0, .28); }
.inc-txt { font-size: 14px; line-height: 1.45; }
.inc-porque { margin: 6px 0 0; font-size: 13px; color: var(--text-muted); }
.inc-ayuda { display: inline-grid; place-items: center; width: 22px; height: 22px; margin-left: 4px; border-radius: 50%; cursor: pointer;
  border: 1.5px solid #141414; background: #FFC21A; color: #141414; font-weight: 900; font-size: 13px; line-height: 1; vertical-align: 1px;
  box-shadow: 0 2px 0 rgba(0, 0, 0, .25); }
.inc-ayuda:active { transform: translateY(1px); box-shadow: none; }
.inc-acc { display: flex; flex-wrap: wrap; gap: 6px; }
.inc-acc .btn { white-space: normal; text-align: center; max-width: 100%; box-shadow: none; }
.inc-pie { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; margin-top: 16px; }
.inc-pie .btn { flex: 1 1 auto; }
@media (max-width: 520px) { .inc-caja { padding: 18px 16px 16px; border-radius: 20px; } .inc-cab h2 { font-size: 17px; } .inc-pie { flex-direction: column-reverse; } }
.inc-aviso { display: flex; gap: 12px; align-items: flex-start; margin: 0 0 10px; padding: 12px; border-radius: 16px;
  border: 1.5px solid rgba(242, 154, 0, .55); background: rgba(255, 194, 26, .12); }
.inc-aviso .inc-ico3d { width: 46px; height: 42px; }
.inc-aviso .inc-ico3d svg { width: 34px; height: 31px; }
.inc-aviso .inc-lista { flex: 1; min-width: 0; }
.inc-aviso .inc-item { background: transparent; border: 0; padding: 0; }