/* Consulta de logopedia: estilos de la aplicación.
   Gris cálido de fondo, marrón cacao como color de marca y rosa pastel para lo seleccionado y los fondos suaves;
   el resto del color se reserva para estados y áreas.
   Tipografía Atkinson Hyperlegible Next. Bordes finos, poco redondeo y sin sombras salvo en lo flotante.
   Paneles con borde y sin sombras. Objetivos táctiles de 44 px como mínimo. */

@font-face {
  font-family: "Atkinson Hyperlegible Next";
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url("../fonts/atkinson-next-latin-ext.290c109915a4.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Atkinson Hyperlegible Next";
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url("../fonts/atkinson-next-latin.825fabef695f.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --papel: #f6f4f3;
  --superficie: #ffffff;
  --hundido: #eeeae8;
  --tinta: #2b2220;
  --tinta-2: #66574f;
  --tinta-3: #7a6b64;
  --linea: #e3dcd9;
  --linea-suave: #eee8e6;
  --control: #cfc4c0;

  --marca: #5b3a32;
  --marca-osc: #432a24;
  --marca-tinte: #f8e4e3;
  --marca-borde: #ecc6c4;
  --marca-anillo: #f1d2d0;
  --foco: #e2a3ab;

  --salvia: #1e6e52;
  --salvia-tinte: #e2f0e7;
  --salvia-borde: #bfdccd;
  --ambar: #8a5205;
  --ambar-tinte: #fbefdc;
  --ambar-borde: #ebd3a6;
  --rojo: #b3261e;
  --rojo-tinte: #fcebea;
  --rojo-borde: #f0c4c0;
  --ia: #0f6b70;
  --ia-tinte: #eef7f7;
  --ia-borde: #8cc3c5;

  --radio-panel: 8px;
  --radio-control: 6px;
  --menu-ancho: 248px;
  --barra-inferior: 68px;
  --fuente: "Atkinson Hyperlegible Next", "Segoe UI", system-ui, -apple-system, Roboto, sans-serif;
  color-scheme: light;
}

/* Base */
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; font-family: var(--fuente); font-size: 16px; line-height: 1.5; color: var(--tinta); background: var(--papel); }
h1, h2, h3, h4 { margin: 0 0 .5rem; line-height: 1.2; font-weight: 700; }
h1 { font-size: 30px; letter-spacing: -.01em; }
h2 { font-size: 19px; }
h3 { font-size: 17px; font-weight: 600; }
h4 { font-size: 15px; font-weight: 600; }
p { margin: 0 0 .6rem; }
a { color: var(--marca); text-decoration: none; }
a:hover { color: var(--marca-osc); text-decoration: underline; }
code { font-size: .9em; background: var(--hundido); padding: 0 .3em; border-radius: 4px; }
.muted { color: var(--tinta-2); }
.derecha { text-align: right; margin-left: auto; }
.crecer { flex: 1; }
.cifras-tabulares, .codigo { font-variant-numeric: tabular-nums; }
[hidden] { display: none !important; }
.solo-lector { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
:focus-visible { outline: 3px solid var(--foco); outline-offset: 2px; }

/* Estructura */
.marco { min-height: 100vh; display: flex; flex-direction: column; }
.franja-pruebas { background: var(--ambar-tinte); color: #6b3f04; border-bottom: 1px solid #f0ddb8; font-size: 14px; padding: 6px 24px; }
.pagina-entrada > .franja-pruebas { text-align: center; }

/* Barra superior: marca, secciones, buscador y cuenta en una sola fila (como Cliniko tras su rediseño). */
.barra { position: sticky; top: 0; z-index: 40; display: flex; align-items: center; gap: 8px 24px; min-height: 60px; padding: 0 24px; background: var(--superficie); border-bottom: 1px solid var(--linea); }
.marca { display: flex; align-items: center; gap: 10px; color: var(--tinta); flex: none; }
.marca:hover { text-decoration: none; color: var(--tinta); }
.marca svg { flex: none; }
.marca strong { display: block; font-size: 17px; line-height: 1.2; }
.marca-texto { display: flex; flex-direction: column; }
.marca-texto > span { font-size: 13px; color: var(--tinta-2); line-height: 1.2; }
.menu { display: flex; align-items: stretch; gap: 2px; align-self: stretch; }
.menu a { display: flex; align-items: center; gap: 8px; padding: 0 12px; color: var(--tinta-2); font-weight: 500; white-space: nowrap; }
.menu a:hover { color: var(--tinta); text-decoration: none; background: var(--hundido); }
.menu a svg { display: none; width: 20px; height: 20px; flex: none; fill: none; stroke: var(--tinta-2); stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.menu a.activo { color: var(--marca-osc); font-weight: 700; background: var(--marca-tinte); box-shadow: inset 0 -3px 0 var(--marca); }
.menu .mas { display: none; }
.buscador-global { flex: 0 1 300px; margin-left: auto; position: relative; }
.buscador-global svg { position: absolute; left: 12px; top: 13px; width: 18px; height: 18px; fill: none; stroke: var(--tinta-2); stroke-width: 2; stroke-linecap: round; pointer-events: none; }
.buscador-global input { width: 100%; padding-left: 38px; background: var(--papel); }
.menu-usuario { position: relative; flex: none; }
.menu-usuario summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 8px 0 4px; border-radius: var(--radio-control); font-weight: 500; }
.menu-usuario summary::-webkit-details-marker { display: none; }
.menu-usuario summary:hover { background: var(--hundido); }
.avatar { width: 32px; height: 32px; border-radius: 50%; background: var(--marca-tinte); color: var(--marca-osc); border: 1px solid var(--marca-borde); display: grid; place-items: center; font-size: 13px; font-weight: 700; flex: none; text-transform: uppercase; }
.desplegable { position: absolute; right: 0; top: calc(100% + 6px); z-index: 60; background: var(--superficie); border: 1px solid var(--linea); border-radius: 8px; padding: 6px; min-width: 240px; display: flex; flex-direction: column; box-shadow: 0 10px 30px rgba(43, 34, 32, .12); }
.desplegable a, .desplegable .enlace, .desplegable .rol { display: flex; align-items: center; min-height: 44px; padding: 0 12px; border-radius: 6px; color: var(--tinta); text-align: left; width: 100%; }
.desplegable .rol { min-height: 36px; color: var(--tinta-2); font-size: 14px; }
.desplegable .titulo-grupo { padding: 8px 12px 2px; font-size: 13px; color: var(--tinta-2); }
.desplegable a:hover, .desplegable .enlace:hover { background: var(--hundido); text-decoration: none; }
.desplegable form { margin: 0; }
.desplegable hr { border: 0; border-top: 1px solid var(--linea-suave); margin: 6px 0; width: 100%; }
.solo-estrecho { display: none !important; }

.contenido { padding: 24px 24px 56px; max-width: 1280px; width: 100%; min-width: 0; margin: 0 auto; }
.rejilla-2 > *, .rejilla-ayuda > *, .rejilla-plan > *, .rejilla-graficas > *, .rejilla-hoy > * { min-width: 0; }

/* Cabeceras de página */
.cabecera-pagina { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px 20px; flex-wrap: wrap; margin-bottom: 24px; }
.cabecera-pagina h1, .cabecera-pagina h2 { margin: 0; }
.cabecera-pagina p { margin: 6px 0 0; }
.miga { margin: 0 0 4px; font-size: 15px; }
.miga a { display: inline-flex; align-items: center; gap: 4px; min-height: 32px; }
.miga a::before { content: ""; width: 16px; height: 16px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 5l-7 7 7 7'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 5l-7 7 7 7'/%3E%3C/svg%3E") center / contain no-repeat; }

/* Paneles y rejillas */
.tarjeta { background: var(--superficie); border: 1px solid var(--linea); border-radius: var(--radio-panel); padding: 20px 22px; margin-bottom: 20px; }
.tarjeta > h2:first-child, .tarjeta > h3:first-child { margin-bottom: 10px; }
.tarjeta.sin-relleno { padding: 0; overflow: hidden; }
.tarjeta.aviso { background: var(--ambar-tinte); border-color: var(--ambar-borde); }
.vacio { color: var(--tinta-2); }
.tarjeta.vacio { text-align: center; padding: 36px 20px; }
.tarjeta-enlace { display: block; color: inherit; }
.tarjeta-enlace:hover { border-color: var(--marca-borde); text-decoration: none; color: inherit; }
.cabecera-tarjeta { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px 16px; margin-bottom: 8px; }
.cabecera-tarjeta h2, .cabecera-tarjeta h3 { margin-bottom: 2px; }
.rejilla-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; align-items: start; }
.rejilla-ayuda { display: grid; grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr); gap: 24px; align-items: start; }
.rejilla-plan { display: grid; grid-template-columns: minmax(0, 3fr) minmax(300px, 2fr); gap: 24px; align-items: start; }
.rejilla-tarjetas, .rejilla-actividades { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 16px; margin-bottom: 20px; }
.rejilla-tarjetas .tarjeta, .rejilla-actividades .tarjeta, .rejilla-graficas .tarjeta { margin: 0; }
.rejilla-graficas { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 16px; margin-bottom: 20px; }
.rejilla-cifras { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 16px; margin-bottom: 20px; }
.cifra { background: var(--superficie); border: 1px solid var(--linea); border-radius: var(--radio-panel); padding: 14px 18px; color: var(--tinta-2); font-size: 15px; }
.cifra span { display: block; font-size: 30px; font-weight: 700; color: var(--tinta); line-height: 1.1; font-variant-numeric: tabular-nums; }

/* Botones */
.boton { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 18px; border-radius: var(--radio-control); border: 1px solid var(--marca); background: var(--marca); color: #fff; font: inherit; font-weight: 600; line-height: 1.2; cursor: pointer; text-decoration: none; white-space: nowrap; }
.boton:hover { background: var(--marca-osc); border-color: var(--marca-osc); color: #fff; text-decoration: none; }
.boton:disabled { opacity: .5; cursor: not-allowed; }
.boton-secundario { background: var(--superficie); color: var(--tinta); border-color: var(--control); }
.boton-secundario:hover { background: var(--hundido); border-color: var(--control); color: var(--tinta); }
.boton-suave { background: transparent; color: var(--tinta-2); border-color: transparent; padding: 0 14px; }
.boton-suave:hover { background: var(--hundido); border-color: transparent; color: var(--tinta); }
.boton-peligro { background: var(--superficie); color: var(--rojo); border-color: var(--rojo-borde); }
.boton-peligro:hover { background: var(--rojo-tinte); border-color: var(--rojo-borde); color: var(--rojo); }
.boton-icono { min-width: 44px; padding: 0 10px; background: var(--superficie); color: var(--tinta); border-color: var(--control); }
.boton-icono:hover { background: var(--hundido); color: var(--tinta); border-color: var(--control); }
.boton.favorita { color: var(--ambar); border-color: var(--ambar-borde); background: var(--ambar-tinte); }
.boton-grande { min-height: 48px; padding: 0 22px; }
.enlace { background: none; border: 0; padding: 0; color: var(--marca); font: inherit; cursor: pointer; text-align: left; }
.enlace:hover { text-decoration: underline; }
.peligro { color: var(--rojo); }
.acciones { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.acciones form { margin: 0; }
.barra-acciones { position: sticky; bottom: 0; z-index: 5; background: linear-gradient(rgba(246, 244, 243, 0), var(--papel) 35%); padding: 18px 0 10px; }
form.en-linea { display: inline-flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: 0; }

/* Formularios */
input, select, textarea { font: inherit; color: inherit; background: var(--superficie); border: 1px solid var(--control); border-radius: var(--radio-control); padding: 0 12px; min-height: 44px; max-width: 100%; }
textarea { width: 100%; resize: vertical; min-height: 5rem; padding: 10px 12px; line-height: 1.5; }
select { padding-right: 32px; }
input:focus, select:focus, textarea:focus, [contenteditable]:focus { outline: 3px solid var(--foco); outline-offset: 0; border-color: var(--marca); }
input[type=checkbox], input[type=radio] { min-height: auto; width: 22px; height: 22px; padding: 0; accent-color: var(--marca); }
input[type=color] { padding: 4px; width: 4.5rem; }
input[type=file] { padding: 8px; }
.formulario .campo { margin-bottom: 16px; display: flex; flex-direction: column; gap: 6px; }
.formulario .campo > input:not([type=checkbox]):not([type=radio]), .formulario .campo > select, .formulario .campo > textarea { width: 100%; }
.formulario label, legend { font-weight: 600; font-size: 15px; }
.campo.obligatorio > label::after { content: " *"; color: var(--rojo); }
fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.ayuda { color: var(--tinta-2); font-size: 14px; font-weight: 400; }
.error, .errorlist { color: var(--rojo); font-size: 14px; font-weight: 600; }
.errorlist { list-style: none; padding: 0; margin: 0; }
.error-formulario { background: var(--rojo-tinte); border: 1px solid var(--rojo-borde); color: #8c1d17; padding: 12px 16px; border-radius: var(--radio-control); margin-bottom: 16px; }
.con-error input, .con-error select, .con-error textarea { border-color: var(--rojo); }
.casilla { display: inline-flex !important; align-items: center; gap: 10px; font-weight: 500 !important; cursor: pointer; min-height: 44px; }
.formulario.estrecho { max-width: 660px; }
.fila-campos { display: flex; gap: 16px; flex-wrap: wrap; }
.fila-campos > .campo { flex: 1; min-width: 150px; }
.campo-checkboxselectmultiple fieldset > div, .campo-radioselect fieldset > div { display: flex; flex-direction: column; gap: 2px; margin-top: 4px; }
.campo-checkboxselectmultiple label, .campo-radioselect label { display: flex; align-items: center; gap: 10px; font-weight: 400; min-height: 44px; cursor: pointer; }
.rejilla-casillas, .campo-checkboxselectmultiple .rejilla-casillas { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.botones-radio, .campo-radioselect .botones-radio { flex-direction: row !important; flex-wrap: wrap; gap: 6px !important; }
.botones-radio > div { display: contents; }
.botones-radio label { min-height: 44px; padding: 0 16px; border: 1px solid var(--control); border-radius: 6px; background: var(--superficie); position: relative; }
.botones-radio label:hover { border-color: var(--marca-borde); }
.botones-radio label:has(input:checked) { border: 2px solid var(--marca); padding: 0 15px; background: var(--marca-tinte); color: var(--marca-osc); font-weight: 700; }
.botones-radio label:has(input:focus-visible) { outline: 3px solid var(--foco); outline-offset: 2px; }
.botones-radio input { position: absolute; opacity: 0; pointer-events: none; }
.filtros { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 20px; }
.filtros input[type=search] { min-width: 240px; }
.filtros label:not(.casilla) { display: flex; align-items: center; gap: 8px; color: var(--tinta-2); }
.filtros-columna { display: flex; flex-direction: column; gap: 10px; margin-bottom: 16px; }

/* Tablas */
.tabla { width: 100%; border-collapse: collapse; }
.tabla th, .tabla td { padding: 12px 18px; text-align: left; vertical-align: top; }
.tabla th { font-size: 14px; color: var(--tinta-2); font-weight: 600; border-bottom: 1px solid var(--linea); background: var(--superficie); }
.tabla td { border-bottom: 1px solid var(--linea-suave); }
.tabla tr:last-child td { border-bottom: 0; }
.tabla-enlaces tbody tr:hover td { background: #fcf7f6; }
.tabla-compacta th, .tabla-compacta td { padding: 8px 12px; font-size: 15px; }
.tabla tr.inactiva td, .tabla tr.no-realizada td { color: var(--tinta-2); }
.desplazable { overflow-x: auto; }
.tabla-comparacion td, .tabla-comparacion th { min-width: 220px; }

/* Etiquetas, chips y colores */
.etiqueta { display: inline-flex; align-items: center; padding: 2px 8px; border-radius: 6px; font-size: 13px; font-weight: 600; line-height: 1.4; white-space: nowrap; background: color-mix(in srgb, var(--color, #8a949c) 14%, white); color: color-mix(in srgb, var(--color, #56626c) 72%, black); }
.etiqueta-programada { background: var(--marca-tinte); color: var(--marca-osc); }
.etiqueta-asistida, .etiqueta-revisado { background: var(--salvia-tinte); color: #155440; }
.etiqueta-ausencia, .etiqueta-borrador { background: var(--ambar-tinte); color: #7a4705; }
.etiqueta-cancelada, .etiqueta-alta { background: var(--hundido); color: var(--tinta-2); }
.etiqueta-ia { display: inline-flex; align-items: center; padding: 2px 8px; border-radius: 6px; font-size: 13px; font-weight: 600; background: var(--ia-tinte); color: var(--ia); border: 1px dashed var(--ia-borde); }
.chips { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; padding: 0; margin: 0 0 10px; }
.chip { display: inline-flex; align-items: center; min-height: 32px; padding: 0 12px; border-radius: 6px; background: var(--superficie); border: 1px solid var(--linea); font-size: 14px; color: var(--tinta); }
a.chip:hover { border-color: var(--marca-borde); background: var(--marca-tinte); text-decoration: none; }
.chip-principal { font-weight: 700; }
.chip-pendiente { border-style: dashed; }
.muestra-color { display: inline-block; width: 12px; height: 12px; border-radius: 3px; vertical-align: middle; background: var(--color, #8a949c); }
.marca-area { display: inline-block; width: 10px; height: 10px; border-radius: 3px; background: var(--color, #8a949c); flex: none; }

/* Mensajes y avisos */
.mensajes { margin-bottom: 20px; }
.mensaje { padding: 12px 16px; border-radius: var(--radio-control); background: var(--marca-tinte); border: 1px solid var(--marca-borde); margin: 0 0 8px; }
.mensaje-success { background: var(--salvia-tinte); border-color: var(--salvia-borde); color: #124a37; }
.mensaje-warning { background: var(--ambar-tinte); border-color: var(--ambar-borde); color: #6b3f04; }
.mensaje-error { background: var(--rojo-tinte); border-color: var(--rojo-borde); color: #8c1d17; }
.nota { background: var(--hundido); padding: 12px 16px; border-radius: var(--radio-control); }
.aviso-datos { background: var(--hundido); padding: 10px 14px; border-radius: var(--radio-control); font-size: 15px; color: var(--tinta-2); }
.aviso-ia { background: var(--ia-tinte); border: 1px dashed var(--ia-borde); border-radius: var(--radio-panel); padding: 16px 20px; margin-bottom: 20px; }
.aviso-repeticion { color: var(--ambar); font-size: 14px; font-weight: 600; }

/* Hoy: la línea del día */
.cabecera-hoy h1 { font-size: 34px; }
.cabecera-hoy p { font-size: 17px; color: var(--tinta-2); }
.rejilla-hoy { display: grid; grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr); gap: 28px; align-items: start; }
.lateral-hoy { display: flex; flex-direction: column; gap: 20px; }
.lateral-hoy .tarjeta { margin: 0; }
.linea-dia { list-style: none; margin: 0; padding: 0; }
.cita-linea { display: grid; grid-template-columns: 76px 28px minmax(0, 1fr); column-gap: 8px; }
.cita-hora { padding-top: 14px; text-align: right; font-variant-numeric: tabular-nums; }
.cita-hora strong { display: block; font-size: 22px; font-weight: 600; line-height: 1; }
.cita-hora span { display: block; font-size: 13px; margin-top: 4px; color: var(--tinta-2); }
.cita-eje { position: relative; display: flex; justify-content: center; }
.cita-eje::before { content: ""; position: absolute; top: 0; bottom: 0; width: 2px; background: var(--linea); }
.cita-linea:first-child .cita-eje::before { top: 18px; }
.cita-linea:last-child .cita-eje::before { bottom: auto; height: 26px; }
.cita-linea:only-child .cita-eje::before { display: none; }
.cita-eje::after { content: ""; position: relative; margin-top: 18px; width: 14px; height: 14px; border-radius: 50%; background: var(--superficie); border: 2px solid var(--marca); box-shadow: 0 0 0 4px var(--papel); }
.cita-cuerpo { padding: 12px 0 22px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; min-width: 0; }
.cita-datos { flex: 1 1 240px; min-width: 0; }
.cita-nombre { font-size: 18px; font-weight: 600; color: var(--tinta); }
.cita-meta { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 14px; color: var(--tinta-2); margin-top: 2px; }
.cita-meta .ok { color: var(--salvia); font-weight: 600; }
.cita-meta .aviso { color: var(--ambar); font-weight: 600; }
.cita-acciones { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.cita-acciones form { margin: 0; }
.cita-linea.pasada .cita-hora, .cita-linea.pasada .cita-nombre { color: var(--tinta-3); }
.cita-linea.estado-asistida .cita-eje::after, .cita-linea.registrada .cita-eje::after { background: var(--salvia); border-color: var(--salvia); }
.cita-linea.estado-ausencia .cita-eje::after, .cita-linea.estado-cancelada .cita-eje::after { border-color: #b9c2c1; }
.cita-linea.estado-cancelada .cita-nombre { text-decoration: line-through; }
.cita-linea.siguiente .cita-hora { padding-top: 22px; }
.cita-linea.siguiente .cita-hora strong { font-weight: 700; }
.cita-linea.siguiente .cita-eje::after { margin-top: 24px; width: 20px; height: 20px; background: var(--marca); box-shadow: 0 0 0 5px var(--marca-anillo); }
.cita-linea.siguiente .cita-cuerpo { display: block; padding-top: 0; }
.cita-destacada { background: #fdf5f4; border: 1px solid var(--marca-borde); border-radius: var(--radio-panel); padding: 20px 22px; }
.cita-destacada .cita-cabecera { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; }
.cita-destacada .cita-nombre { font-size: 22px; font-weight: 700; }
.cita-destacada .cuando { margin-left: auto; color: var(--marca); font-weight: 600; }
.cita-destacada .subtitulo { margin: 14px 0 8px; font-size: 14px; color: var(--tinta-2); }
.objetivos-cita { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.objetivos-cita li { display: flex; gap: 10px; align-items: baseline; }
.objetivos-cita .marca-area { transform: translateY(-1px); }
.cita-destacada .cita-acciones { margin-top: 20px; }
.cita-destacada .boton { min-height: 48px; }
.lista-simple { list-style: none; padding: 0; margin: 0; }
.lista-simple li { padding: 10px 0; border-top: 1px solid var(--linea-suave); }
.lista-simple li:first-child { border-top: 0; padding-top: 4px; }
.fila-pendiente { display: flex; justify-content: space-between; gap: 12px; }

/* Ficha */
.ficha-cabecera { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px 20px; flex-wrap: wrap; margin-bottom: 22px; }
.ficha-cabecera h1 { font-size: 32px; margin: 0; }
.hechos { display: flex; flex-wrap: wrap; gap: 6px 28px; margin: 12px 0 0; }
.hechos dt { font-size: 13px; color: var(--tinta-2); }
.hechos dd { margin: 0; font-weight: 600; }
.pestanas { display: flex; gap: 2px; border-bottom: 1px solid var(--linea); margin-bottom: 26px; overflow-x: auto; scrollbar-width: thin; }
.pestanas a { display: flex; align-items: center; min-height: 46px; padding: 0 14px; color: var(--tinta-2); white-space: nowrap; }
.pestanas a:hover { color: var(--tinta); text-decoration: none; background: var(--hundido); border-radius: 6px 6px 0 0; }
.pestanas a.activa { color: var(--tinta); font-weight: 700; box-shadow: inset 0 -3px 0 var(--marca); }
.pestanas a.pestana-ia { color: var(--ia); }
.pestanas a.pestana-ia.activa { box-shadow: inset 0 -3px 0 var(--ia); }
.datos { display: grid; grid-template-columns: max-content 1fr; gap: 6px 20px; margin: 0 0 10px; }
.datos dt { color: var(--tinta-2); font-size: 15px; }
.datos dd { margin: 0; }
.datos-largos { grid-template-columns: 1fr; }
.datos-largos dt { font-weight: 700; color: var(--tinta); margin-top: 10px; }
.grupo-objetivos { margin-bottom: 28px; }
.grupo-objetivos > h3 { display: flex; align-items: center; gap: 10px; font-size: 19px; font-weight: 700; margin-bottom: 10px; }
.objetivo { margin-bottom: 12px; }
.objetivo-titulo { font-weight: 600; font-size: 17px; margin-bottom: 2px; }
.objetivo-area { display: inline-flex; align-items: center; gap: 8px; }
.objetivo-linea { display: flex; gap: 10px; align-items: baseline; }
.objetivo-linea::before { content: ""; width: 10px; height: 10px; border-radius: 3px; background: var(--color, #8a949c); flex: none; transform: translateY(-1px); }
.resultados-linea { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.version-anterior { border-top: 1px solid var(--linea-suave); padding-top: 12px; margin-top: 12px; }

/* Biblioteca */
.actividad { display: flex; flex-direction: column; gap: 4px; }
.actividad-nombre { font-weight: 700; font-size: 17px; color: var(--tinta); }
/* En la rejilla de la biblioteca toda la tarjeta lleva a la actividad: el enlace del título se estira
   sobre la tarjeta, así sigue habiendo un solo enlace para el teclado y los lectores de pantalla. */
.rejilla-actividades .actividad { position: relative; cursor: pointer; transition: border-color .15s, background-color .15s; }
.rejilla-actividades .actividad-nombre::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.rejilla-actividades .actividad-nombre:focus-visible { outline: none; }
.rejilla-actividades .actividad:has(.actividad-nombre:focus-visible) { outline: 3px solid var(--marca); outline-offset: 2px; }
.rejilla-actividades .actividad:hover { border-color: var(--marca-borde); background: var(--marca-tinte); }
.rejilla-actividades .actividad-nombre:hover { text-decoration: none; }
/* Con JavaScript los filtros buscan solos: el botón solo hace falta sin él. */
.con-js .solo-sin-js { display: none; }
.actividad-area { display: inline-flex; align-items: center; gap: 8px; color: var(--tinta-2); font-size: 14px; font-weight: 600; }
.actividad-area::before { content: ""; width: 10px; height: 10px; border-radius: 3px; background: var(--color, #8a949c); flex: none; }
.meta { display: flex; flex-wrap: wrap; gap: 4px 14px; color: var(--tinta-2); font-size: 14px; margin-top: auto; padding-top: 6px; }
.estrella { color: #b7791f; font-size: 1.2rem; }
/* Estrella de favorita en la tarjeta: queda por encima del enlace estirado para poder pulsarla sin abrir la ficha. */
.estrella-form { position: relative; z-index: 1; flex: none; margin: -10px -10px 0 0; }
.estrella-boton { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: var(--radio-control); background: transparent; color: var(--tinta-2); font-size: 24px; line-height: 1; cursor: pointer; }
.estrella-boton:hover { background: var(--ambar-tinte); color: var(--ambar); }
.estrella-boton.activa { color: #b7791f; }
.estrella-boton:focus-visible { outline: 3px solid var(--marca); outline-offset: 0; }
.actividad-detalle .actividad-area { margin-bottom: 6px; }
.pasos { padding-left: 1.4rem; }
.pasos li { margin-bottom: 6px; }
.archivo-linea { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; padding: 6px 0; }

/* Sesiones */
.sesion-planificada { border-style: dashed; }
.lista-actividades { margin: 0 0 10px; padding-left: 1.3rem; }
.lista-actividades li.no-realizada { color: var(--tinta-2); text-decoration: line-through; }
.barra-tiempo { position: relative; height: 36px; background: var(--hundido); border-radius: var(--radio-control); overflow: hidden; margin-bottom: 16px; }
.barra-relleno { position: absolute; inset: 0 auto 0 0; width: 0; background: var(--marca-borde); transition: width .2s; }
.barra-tiempo.pasada .barra-relleno { background: #f1c98b; }
.barra-texto { position: relative; display: block; text-align: center; line-height: 36px; font-weight: 600; font-size: 15px; font-variant-numeric: tabular-nums; }
.lineas-plan { list-style: none; padding: 0; margin: 0; counter-reset: linea; }
.linea-plan { background: var(--superficie); border: 1px solid var(--linea); border-radius: 8px; padding: 14px 16px; margin-bottom: 10px; counter-increment: linea; }
.linea-plan.repetida, .resultado.repetida, .linea-registro.repetida { border-color: var(--ambar-borde); background: #fffaf1; }
.linea-cabecera { display: flex; align-items: baseline; gap: 10px; }
.linea-cabecera::before { content: counter(linea); flex: none; width: 26px; height: 26px; border-radius: 50%; background: var(--marca-tinte); color: var(--marca-osc); display: inline-grid; place-items: center; font-size: 13px; font-weight: 700; transform: translateY(-2px); }
.linea-campos { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-top: 10px; }
.linea-campos label { display: flex; align-items: center; gap: 8px; font-size: 15px; }
.linea-campos select { max-width: 340px; }
input.minutos { width: 5.5rem; text-align: center; }
.buscador-sesion { position: sticky; top: 76px; max-height: calc(100vh - 92px); overflow-y: auto; }
.resultados-busqueda .resultado { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; border-top: 1px solid var(--linea-suave); padding: 12px 4px; }
.resultado p { margin: 0; font-size: 14px; }
.registro { counter-reset: registro; }
.registro .linea-registro { counter-increment: registro; }
.registro .linea-registro h3 { display: flex; align-items: baseline; gap: 10px; margin-bottom: 2px; font-size: 18px; font-weight: 700; }
.registro .linea-registro h3::before { content: counter(registro); flex: none; width: 28px; height: 28px; border-radius: 50%; background: var(--marca-tinte); color: var(--marca-osc); display: inline-grid; place-items: center; font-size: 14px; font-weight: 700; transform: translateY(-2px); }
.registro .linea-registro:has(input[name$="realizada"]:not(:checked)) { color: var(--tinta-2); }
.interruptor { font-weight: 600 !important; }
.campos-registro { margin-top: 10px; }
.campos-registro .campo { margin-bottom: 12px; }
.mas-campos summary { cursor: pointer; color: var(--marca); font-weight: 600; min-height: 44px; display: flex; align-items: center; }
.fila-resultado { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; padding: 10px 0; border-top: 1px solid var(--linea-suave); }
.fila-resultado input[type=number] { width: 7rem; font-size: 18px; text-align: center; }
.fila-resultado input[type=text] { width: 12rem; }

/* Agenda */
.calendario-tarjeta { padding: 14px; }
#calendario { min-height: 640px; }
.leyenda { display: inline-flex; flex-wrap: wrap; gap: 6px; margin-left: auto; }
.fc { --fc-border-color: var(--linea-suave); --fc-page-bg-color: var(--superficie); --fc-today-bg-color: #fdf5f4; --fc-now-indicator-color: var(--rojo); --fc-neutral-bg-color: var(--hundido); --fc-non-business-color: rgba(102, 87, 79, .05); --fc-button-bg-color: var(--superficie); --fc-button-text-color: var(--tinta); --fc-button-border-color: var(--control); --fc-button-hover-bg-color: var(--hundido); --fc-button-hover-border-color: var(--control); --fc-button-active-bg-color: var(--marca-tinte); --fc-button-active-border-color: var(--marca); font-size: 14px; }
.fc .fc-toolbar { flex-wrap: wrap; gap: 10px; }
.fc .fc-toolbar-title { font-size: 20px; font-weight: 700; }
.fc .fc-button { min-height: 44px; padding: 0 14px; border-radius: var(--radio-control); font-weight: 600; box-shadow: none !important; }
.fc .fc-button-primary:not(:disabled).fc-button-active, .fc .fc-button-primary:not(:disabled):active { color: var(--marca-osc); }
.fc .fc-col-header-cell-cushion { padding: 10px 6px; color: var(--tinta); font-weight: 600; }
.fc .fc-timegrid-slot-label-cushion { color: var(--tinta-2); font-variant-numeric: tabular-nums; }
.fc .fc-day-today .fc-col-header-cell-cushion { color: var(--marca); }
.fc-event { cursor: pointer; border-radius: 8px !important; border: 0 !important; background: color-mix(in srgb, var(--color, #b5677a) 13%, white) !important; box-shadow: none !important; }
.fc-event .fc-event-main { color: color-mix(in srgb, var(--color, #b5677a) 78%, black) !important; padding: 2px 6px; }
.fc-event .fc-event-time { font-weight: 700; }
.fc-event.cita-cancelada { background: var(--superficie) !important; outline: 1px dashed #b9c2c1; }
.fc-event.cita-cancelada .fc-event-main { color: var(--tinta-2) !important; }
.fc-daygrid-event-dot { border-color: var(--color, #b5677a) !important; }

/* Informes */
.editor-informe .titulo-informe { font-size: 22px; font-weight: 700; flex: 1; min-width: 260px; }
.barra-editor { display: flex; gap: 4px; flex-wrap: wrap; background: var(--superficie); border: 1px solid var(--linea); border-bottom: 0; border-radius: var(--radio-panel) var(--radio-panel) 0 0; padding: 6px; position: sticky; top: 60px; z-index: 5; }
.barra-editor button { min-height: 40px; min-width: 44px; border: 1px solid transparent; background: transparent; border-radius: 8px; cursor: pointer; font: inherit; padding: 0 10px; color: var(--tinta); }
.barra-editor button:hover { background: var(--hundido); }
.hoja { background: #fff; border: 1px solid var(--linea); border-radius: 0 0 var(--radio-panel) var(--radio-panel); padding: 40px 48px; min-height: 60vh; font-family: Georgia, "Times New Roman", serif; font-size: 17px; line-height: 1.65; margin-bottom: 10px; }
.hoja h1 { font-size: 26px; color: var(--marca-osc); }
.hoja h2 { font-size: 19px; color: var(--marca-osc); border-bottom: 1px solid var(--linea); padding-bottom: 4px; margin-top: 24px; }
.hoja table { border-collapse: collapse; width: 100%; }
.hoja th, .hoja td { border: 1px solid var(--linea); padding: 6px 10px; text-align: left; }

/* Asistente: lo propuesto se distingue por el azul y el borde discontinuo */
.propuesta-ia { background: var(--ia-tinte); border: 1px dashed var(--ia-borde); }
.propuesta-ia.estado-descartada { opacity: .6; }
.propuesta-ia.estado-aceptada, .propuesta-ia.estado-modificada { background: var(--superficie); border-style: solid; border-color: var(--linea); }
.cambio-pedido { font-size: 15px; color: var(--ia); margin: 4px 0 0; }

/* Mientras el asistente responde: círculo de carga y el texto según llega */
@keyframes girar { to { transform: rotate(360deg); } }
.girando { display: inline-block; width: 18px; height: 18px; border: 2.5px solid var(--ia-borde); border-top-color: var(--ia); border-radius: 50%; animation: girar .8s linear infinite; flex: none; }
.estado-flujo { display: flex; align-items: center; gap: 10px; margin: 6px 0 0; color: var(--ia); font-weight: 600; }
/* Campos que aún no han llegado: una barra gris que brilla; el que se está escribiendo lleva cursor. */
.cuerpo-en-vivo:empty { display: none; }
.hueco { display: inline-block; height: .9em; min-width: 3em; max-width: 100%; vertical-align: middle; border-radius: 4px;
  background: linear-gradient(90deg, rgba(15, 107, 112, .10) 25%, rgba(15, 107, 112, .22) 50%, rgba(15, 107, 112, .10) 75%);
  background-size: 200% 100%; animation: brillo 1.4s ease-in-out infinite; }
h4 .hueco { height: 1.1em; }
@keyframes brillo { from { background-position: 100% 0; } to { background-position: -100% 0; } }
.escribiendo::after { content: "▍"; color: var(--ia); margin-left: 1px; animation: parpadeo 1s steps(2) infinite; }
@keyframes parpadeo { 50% { opacity: 0; } }
.propuesta-fallida .estado-flujo { color: var(--rojo); }
.boton.cargando { position: relative; color: transparent !important; }
.boton.cargando::after { content: ""; position: absolute; inset: 0; margin: auto; width: 18px; height: 18px; border: 2.5px solid rgba(255, 255, 255, .45); border-top-color: #fff; border-radius: 50%; animation: girar .8s linear infinite; }
.boton-secundario.cargando::after, .boton-suave.cargando::after { border-color: var(--ia-borde); border-top-color: var(--ia); }
@media (prefers-reduced-motion: reduce) {
  .girando, .boton.cargando::after { animation-duration: 2.4s; }
  .escribiendo::after, .hueco { animation: none; }
}

/* Editar a mano y pedir un cambio */
.acciones-propuesta { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: flex-start; margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--ia-borde); }
.pedir-cambio { flex: 1 1 320px; }
.pedir-cambio > summary { list-style: none; display: inline-flex; }
.pedir-cambio > summary::-webkit-details-marker { display: none; }
.pedir-cambio[open] > summary { color: var(--ia); }
.pedir-cambio form { margin-top: 8px; }
.editor-propuesta .bloque-edicion { border: 1px solid var(--ia-borde); border-radius: var(--radio-control); padding: 12px 14px; margin: 0 0 12px; background: var(--superficie); }
.editor-propuesta legend { font-weight: 700; padding: 0 6px; }
.editor-propuesta .bloque-edicion > label:not(.casilla) { display: block; margin: 10px 0 4px; font-weight: 600; }
.editor-propuesta .bloque-edicion > label:first-of-type { margin-top: 0; }
.editor-propuesta .bloque-edicion > input:not([type=checkbox]), .editor-propuesta .bloque-edicion > textarea { display: block; width: 100%; box-sizing: border-box; }
.editor-propuesta .bloque-edicion > input[type=number] { max-width: 9em; }
.editor-propuesta .bloque-edicion > .casilla { margin-top: 10px; }
.sugerencia { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; padding: 12px 0; border-top: 1px solid var(--linea-suave); }
.sugerencia p { margin: 2px 0; }
@media (max-width: 600px) { .sugerencia { flex-direction: column; gap: 8px; } }
.datos-registrados { font-size: 15px; background: var(--hundido); padding: 6px 10px; border-radius: 8px; }
.avisos { background: var(--ambar-tinte); border-radius: var(--radio-control); padding: 10px 12px 10px 32px; font-size: 15px; margin-top: 10px; }
.desactivada { opacity: .65; }
.formulario.tarjeta select, .formulario.tarjeta textarea { width: 100%; margin-bottom: 10px; }

/* Entrada y páginas de cuenta (allauth) */
.pagina-entrada { background: var(--papel); min-height: 100vh; display: flex; flex-direction: column; }
.entrada { flex: 1; display: grid; place-items: center; padding: 40px 16px; }
.columna-entrada { width: 100%; max-width: 440px; }
.columna-entrada > .marca { padding: 0 4px 24px; }
.columna-entrada > .marca strong { font-size: 20px; }
.columna-entrada > .marca .marca-texto > span { font-size: 15px; }
.tarjeta.auth { width: 100%; padding: 28px; margin: 0; border-radius: 6px; }
.tarjeta.auth h1 { font-size: 26px; margin-bottom: 18px; }
.nota-entrada { margin: 18px 4px 0; font-size: 14px; color: var(--tinta-2); }
.auth form p, .auth form > div { margin-bottom: 16px; display: flex; flex-direction: column; gap: 6px; }
.auth input:not([type=checkbox]) { width: 100%; min-height: 48px; }
.auth button[type=submit], .auth button:not(.enlace) { display: inline-flex; align-items: center; justify-content: center; min-height: 50px; padding: 0 22px; border-radius: var(--radio-control); border: 0; background: var(--marca); color: #fff; font: inherit; font-size: 17px; font-weight: 700; cursor: pointer; }
.auth form > button[type=submit]:last-child, .auth .formulario > button[type=submit] { width: 100%; }
.auth button[type=submit]:hover { background: var(--marca-osc); }
.auth img { display: block; max-width: 220px; margin: 8px auto 16px; background: #fff; padding: 8px; border-radius: 10px; border: 1px solid var(--linea); }
.enlaces-auth { display: flex; gap: 16px; flex-wrap: wrap; align-items: center; border-top: 1px solid var(--linea-suave); margin-top: 22px; padding-top: 16px; font-size: 15px; }
.enlaces-auth form { margin: 0; }
.enlaces-auth button.enlace { background: none !important; color: var(--marca) !important; border: 0 !important; padding: 0 !important; min-height: 0 !important; font-weight: 400 !important; font-size: 15px !important; width: auto !important; }

.paginacion { display: flex; gap: 16px; align-items: center; justify-content: center; margin: 20px 0; }

/* Ordenador estrecho */
@media (max-width: 1180px) {
  .rejilla-plan { grid-template-columns: 1fr; }
  .buscador-sesion { position: static; max-height: none; }
  .rejilla-hoy { grid-template-columns: 1fr; }
}

/* Tablet vertical y móvil: el menú pasa a una barra de pestañas abajo */
@media (max-width: 900px) {
  body:has(.marco) { padding-bottom: calc(var(--barra-inferior) + env(safe-area-inset-bottom)); }
  .barra { padding: 0 16px; min-height: 56px; }
  .menu { position: fixed; z-index: 50; left: 0; right: 0; bottom: 0; align-self: auto; padding: 6px 8px calc(8px + env(safe-area-inset-bottom)); background: var(--superficie); border-top: 1px solid var(--linea); justify-content: space-around; gap: 0; }
  .menu a:not(.principal) { display: none; }
  .menu a.principal, .menu .mas { display: flex; flex: 1 1 0; max-width: 120px; flex-direction: column; justify-content: center; gap: 2px; min-height: 54px; padding: 0; font-size: 13px; color: var(--tinta-2); background: transparent !important; box-shadow: none !important; border: 0; font-family: inherit; cursor: pointer; align-items: center; }
  .menu a.principal svg, .menu .mas svg { display: block; width: 56px; height: 30px; padding: 5px 18px; border-radius: 6px; stroke: var(--tinta-2); fill: none; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
  .menu a.principal.activo { color: var(--marca-osc); font-weight: 700; }
  .menu a.principal.activo svg { background: var(--marca-tinte); stroke: var(--marca); }
  .barra .marca-texto > span { display: none; }
  .barra .buscador-global { display: none; }
  .menu-usuario { margin-left: auto; }
  .solo-estrecho { display: flex !important; }
  .menu-usuario summary .nombre-usuario { display: none; }
  .franja-pruebas { padding: 6px 16px; }
  .contenido { padding: 20px 16px 32px; }
  .rejilla-2, .rejilla-ayuda { grid-template-columns: 1fr; }
  .hoja { padding: 22px; }
  .barra-acciones { bottom: calc(var(--barra-inferior) + env(safe-area-inset-bottom)); }
}
@media (max-width: 560px) {
  h1, .cabecera-hoy h1, .ficha-cabecera h1 { font-size: 26px; }
  .cita-linea { grid-template-columns: 54px 22px minmax(0, 1fr); column-gap: 6px; }
  .cita-hora strong { font-size: 18px; }
  .cita-destacada { padding: 16px; }
  .rejilla-graficas { grid-template-columns: 1fr; }
  .tabla th, .tabla td { padding: 10px 12px; }
  .filtros input[type=search] { min-width: 0; flex: 1 1 100%; }
}

@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; animation: none !important; }
}

@media print {
  .menu, .barra, .franja-pruebas, .acciones, .pestanas, .barra-editor, .barra-acciones { display: none !important; }
  body { background: #fff; padding: 0 !important; }
  .marco { display: block; }
  .contenido { padding: 0; max-width: none; }
  .tarjeta, .hoja { border: 0; padding: 0; }
}
.ayuda-final { margin: 16px 0 0; }

/* Dentro de la ficha, la acción principal es la de la cabecera: las de cada pestaña van en secundario. */
.pestanas ~ .cabecera-pagina .boton:not(.boton-suave):not(.boton-peligro) { background: var(--superficie); color: var(--tinta); border-color: var(--control); }
.pestanas ~ .cabecera-pagina .boton:not(.boton-suave):not(.boton-peligro):hover { background: var(--hundido); }

/* Selección al arrastrar para crear una cita */
.fc .fc-highlight { background: var(--marca-tinte); outline: 2px dashed var(--marca); outline-offset: -2px; border-radius: 8px; }
.fc .fc-event-mirror { opacity: .9; }

/* Agenda: tarjeta al pasar el cursor, línea de la hora y aviso al mover */
.calendario-tarjeta { position: relative; }
.tarjeta-cita { position: fixed; z-index: 80; width: 300px; max-width: calc(100vw - 16px); background: var(--superficie); border: 1px solid var(--linea); border-radius: 8px; padding: 14px 16px; box-shadow: 0 12px 32px rgba(43, 34, 32, .16); pointer-events: none; font-size: 15px; }
.tarjeta-cita-cabecera { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; font-size: 17px; }
.tarjeta-cita > p { margin: 4px 0 8px; }
.tarjeta-cita dl { margin: 0; display: grid; gap: 4px; }
.tarjeta-cita dl > div { display: grid; grid-template-columns: 92px 1fr; gap: 8px; }
.tarjeta-cita dt { color: var(--tinta-2); font-size: 14px; }
.tarjeta-cita dd { margin: 0; }
.tarjeta-cita .ayuda { margin: 10px 0 0; padding-top: 8px; border-top: 1px solid var(--linea-suave); }
.linea-cursor { position: absolute; z-index: 4; height: 0; border-top: 2px solid var(--marca); pointer-events: none; }
.linea-cursor::before { content: ""; position: absolute; left: -5px; top: -6px; width: 10px; height: 10px; border-radius: 50%; background: var(--marca); }
.linea-cursor-hora { position: absolute; left: 8px; top: -12px; background: var(--marca); color: #fff; font-size: 12px; font-weight: 700; line-height: 1; padding: 5px 7px; border-radius: 6px; font-variant-numeric: tabular-nums; }
.aviso-flotante { position: fixed; z-index: 90; left: 50%; bottom: 24px; transform: translateX(-50%); display: flex; align-items: center; gap: 18px; max-width: calc(100vw - 32px); background: var(--tinta); color: #fff; padding: 12px 18px; border-radius: 8px; box-shadow: 0 12px 32px rgba(43, 34, 32, .25); font-size: 15px; }
.aviso-flotante .enlace { color: #f3c9cf; font-weight: 700; min-height: 36px; }
@media (max-width: 900px) { .aviso-flotante { bottom: calc(var(--barra-inferior) + 16px + env(safe-area-inset-bottom)); } }
.fc-event.fc-event-draggable { cursor: grab; }
.fc-event.fc-event-dragging, .fc-event.fc-event-dragging * { cursor: grabbing; }
.fc-event.cita-fija { cursor: pointer; }
.franja-pruebas .version-app { margin-left: 10px; font-variant-numeric: tabular-nums; opacity: .8; }

/* Iconos de estado en las citas (como Cliniko o Jane): sesión registrada o planificada, ausencia, serie */
.fc-event .fc-event-title { display: inline-flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.fc-event .fc-event-title::before, .fc-event .fc-event-title::after { content: none; }
.fc-event.sesion-registrada .fc-event-title::before, .fc-event.sesion-planificada .fc-event-title::before, .fc-event.cita-ausencia .fc-event-title::before { content: ""; width: 12px; height: 12px; flex: none; background: currentColor; }
.fc-event.cita-serie .fc-event-title::after { content: ""; width: 11px; height: 11px; flex: none; background: currentColor; opacity: .75; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 9a8 8 0 0 1 14-3l2 2M20 15a8 8 0 0 1-14 3l-2-2'/%3E%3Cpath d='M20 4v4h-4M4 20v-4h4'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 9a8 8 0 0 1 14-3l2 2M20 15a8 8 0 0 1-14 3l-2-2'/%3E%3Cpath d='M20 4v4h-4M4 20v-4h4'/%3E%3C/svg%3E") center / contain no-repeat; }
.fc-event.sesion-registrada .fc-event-title::before { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat; }
.fc-event.sesion-planificada .fc-event-title::before { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='4' width='14' height='17' rx='2'/%3E%3Cpath d='M9 9h6M9 13h6M9 17h3'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='4' width='14' height='17' rx='2'/%3E%3Cpath d='M9 9h6M9 13h6M9 17h3'/%3E%3C/svg%3E") center / contain no-repeat; }
.fc-event.cita-ausencia .fc-event-title::before { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M6 18L18 6'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M6 18L18 6'/%3E%3C/svg%3E") center / contain no-repeat; }
.icono-leyenda { display: inline-block; width: 13px; height: 13px; background: currentColor; vertical-align: -2px; margin-right: 4px; }
.icono-leyenda.registrada { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat; }
.icono-leyenda.planificada { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='4' width='14' height='17' rx='2'/%3E%3Cpath d='M9 9h6M9 13h6M9 17h3'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='4' width='14' height='17' rx='2'/%3E%3Cpath d='M9 9h6M9 13h6M9 17h3'/%3E%3C/svg%3E") center / contain no-repeat; }
.icono-leyenda.ausencia { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M6 18L18 6'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M6 18L18 6'/%3E%3C/svg%3E") center / contain no-repeat; }
.icono-leyenda.serie { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 9a8 8 0 0 1 14-3l2 2M20 15a8 8 0 0 1-14 3l-2-2'/%3E%3Cpath d='M20 4v4h-4M4 20v-4h4'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 9a8 8 0 0 1 14-3l2 2M20 15a8 8 0 0 1-14 3l-2-2'/%3E%3Cpath d='M20 4v4h-4M4 20v-4h4'/%3E%3C/svg%3E") center / contain no-repeat; }
.leyenda-agenda { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 12px 2px 0; font-size: 14px; color: var(--tinta-2); }
.leyenda-agenda + p { margin-top: 10px; }
.aviso-demo { margin: 10px 0 0; padding: 8px 12px; border-radius: 6px; background: var(--ambar-tinte); color: #6b3f04; font-weight: 600; font-size: 15px; }
