/* Sistema visual Sensor.camp Regants: claro, legible y orientado a tareas.
   Hoja autónoma (sin Bootstrap): tokens, reinicio, estructura, componentes
   compartidos (botones, avisos, tablas, formularios) y ajustes por módulo.
   Legibilidad: contenido >= 14 px, datos secundarios >= 13 px, controles de
   44 px y bordes/foco con contraste >= 3:1 (WCAG 1.4.11). */
:root {
  color-scheme: light;
  --sc-font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif;
  --sc-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  --sc-ink: #18181b;
  --sc-ink-soft: #3f3f46;
  --sc-muted: #66666e;
  --sc-paper: #ffffff;
  --sc-surface: #fafafa;
  --sc-surface-strong: #f4f4f5;
  --sc-line: #e4e4e7;
  --sc-line-strong: #d4d4d8;
  --sc-control-line: #8a8a93;
  --sc-control-line-hover: #66666e;
  --sc-brand: #e6812f;
  --sc-brand-dark: #d76927;
  --sc-brand-deep: #a94a13;
  --sc-brand-ink: #ad5119;
  --sc-on-brand: #2f1b0e;
  --sc-brand-soft: #fff4eb;
  --sc-brand-line: #f1c29b;
  --sc-focus: #a94a13;
  --sc-source-al-start: #f9e0cb;
  --sc-source-al: #f0b17e;
  --sc-source-al-line: #ee9550;
  --sc-source-vi-start: #d6f7f1;
  --sc-source-vi: #72d8c7;
  --sc-source-vi-line: #199b88;
  --sc-combined-start: #faf9f8;
  --sc-combined: #edeae7;
  --sc-combined-line: #c9c6c3;
  --sc-combined-ink: #353230;
  /* Muestra de cada fuente, la misma en calendario, leyenda, panel «En este
     momento», formularios y tablas: AL naranja, VI turquesa y «ambas» con las
     dos (CLC-04, CLC-05, CLC-10). Las clases .schedule-source-* las asignan
     a --source-fill (caja del turno), --source-mark (punto o muestra) y
     --source-line (trazo). */
  --sc-source-al-tint: #fff4e8;
  --sc-source-vi-tint: #eafaf7;
  --sc-source-al-fill: linear-gradient(135deg, var(--sc-source-al-start), var(--sc-source-al));
  --sc-source-vi-fill: linear-gradient(135deg, var(--sc-source-vi-start), var(--sc-source-vi));
  --sc-source-combined-fill: linear-gradient(135deg, var(--sc-source-al-start), var(--sc-source-vi-start));
  --sc-source-combined-mark: linear-gradient(180deg, var(--sc-source-al) 0 50%, var(--sc-source-vi) 50% 100%);
  /* Estado de un turno, dibujado encima del color de su fuente y sin color
     propio: disponible = trama y borde discontinuo; cedido = marco. */
  --sc-state-hatch: repeating-linear-gradient(135deg, rgb(24 24 27 / 11%) 0 .14rem, transparent .14rem .5rem);
  --sc-water: #28718a;
  --sc-accent: #e6812f;
  --sc-warning-bg: #fffbeb;
  --sc-warning-line: #f3d27d;
  --sc-warning-ink: #713f12;
  --sc-danger: #b42318;
  --sc-danger-strong: #8f1c13;
  --sc-danger-bg: #fff1f0;
  --sc-danger-line: #f1b5ae;
  --sc-success: #166534;
  --sc-success-bg: #ecfdf3;
  --sc-success-line: #a6e3bd;
  --sc-info-bg: #eff8ff;
  --sc-info-line: #b8d9df;
  --sc-info-ink: #176773;
  /* Tonos de aviso y error derivados (filete, icono y tinta) y tinte cálido de
     marca para filas al pasar, cabeceras de tarjeta y fondos suaves. */
  --sc-warning-accent: #c47f0a;
  --sc-warning-icon: #9a5b04;
  --sc-danger-ink: #6f2323;
  --sc-brand-tint: #fffaf6;
  --sc-row-hover: var(--sc-brand-tint);
  --sc-inactive-bg: #f3f2f1;
  --sc-inactive-bg-hover: #eceae8;
  /* Solo decorativos de la pantalla de acceso. */
  --sc-auth-warm: #fff1e3;
  --sc-auth-cool: #f6fffc;
  --sc-auth-status-ink: #0f6b5c;
  /* Disponible para reasignar: neutro (el naranja es la fuente s'Alqueria). */
  --sc-available-bg: #fafafa;
  --sc-available-line: #66666e;
  --sc-available-ink: #3f3f46;
  --sc-assigned-bg: #f5f3f1;
  --sc-assigned-line: #b9b4af;
  --sc-assigned-ink: #4a4541;
  --sc-shadow-sm: 0 1px 2px rgb(24 24 27 / 6%), 0 1px 3px rgb(24 24 27 / 4%);
  --sc-shadow-md: 0 12px 32px rgb(24 24 27 / 8%), 0 2px 8px rgb(24 24 27 / 4%);
  /* Tarjeta (contrato único): radio, sombra y relleno de toda superficie de primer
     nivel (tarjetas, formularios, tablas, filtros y vacíos de página); lo que va
     dentro de una tarjeta usa --sc-radius-md y los controles --sc-radius-sm. */
  --sc-card-radius: var(--sc-radius-lg);
  --sc-card-shadow: var(--sc-shadow-sm);
  --sc-card-pad: clamp(1.15rem, 3vw, 1.5rem);
  --sc-radius-sm: .5rem;
  --sc-radius-md: .75rem;
  --sc-radius-lg: .9rem;
  --sc-space-1: .25rem;
  --sc-space-2: .5rem;
  --sc-space-3: .75rem;
  --sc-space-4: 1rem;
  --sc-space-5: 1.5rem;
  --sc-space-6: 2rem;
  --sc-space-7: 3rem;
  /* Separación entre secciones de una página (h2 de sección, zona de peligro,
     historiales…): un solo valor en todos los módulos. */
  --sc-section-gap: 2.25rem;
  /* Solo para las cajas estrechas de la rejilla horaria (FullCalendar), con
     @container; el resto de la interfaz no baja de --sc-text-xs. */
  --sc-text-2xs: .75rem;
  --sc-text-xs: .8125rem;
  --sc-text-sm: .875rem;
  --sc-text-md: .9375rem;
  --sc-text-base: 1rem;
  --sc-text-lg: 1.125rem;
  --sc-text-lead: 1.0625rem;
  --sc-text-heading-card: 1.25rem;
  /* Escala de títulos por componente (no por nivel h2/h3): página, sección de
     página y tarjeta; cifras de resumen con su propio tamaño. */
  --sc-text-heading-section: clamp(1.35rem, 2vw, 1.6rem);
  --sc-text-heading-page: clamp(1.9rem, 3vw, 2.35rem);
  --sc-text-heading-auth: clamp(2.15rem, 5vw, 2.8rem);
  --sc-text-display: clamp(2.35rem, 4.1vw, 3.8rem);
  --sc-text-stat: clamp(1.15rem, 2.2vw, 1.4rem);
  --sc-weight-regular: 400;
  --sc-weight-semibold: 600;
  --sc-weight-bold: 700;
  --sc-control-h: 2.75rem;
  --sc-tap: 2.75rem;
  --sc-header-h: 4rem;
  --sc-content: 112rem;
  --sc-reading: 45rem;
  font-family: var(--sc-font);
  color: var(--sc-ink);
  background: var(--sc-surface);
}

/* Reinicio propio (sustituye al reboot de Bootstrap) */
*, *::before, *::after { box-sizing: border-box; }
html { min-width: 20rem; scroll-behavior: smooth; scroll-padding-top: calc(var(--sc-header-h) + 1rem); -webkit-text-size-adjust: 100%; text-size-adjust: 100%; -webkit-tap-highlight-color: rgb(169 74 19 / 12%); }
body {
  min-height: 100vh;
  margin: 0;
  display: flex;
  flex-direction: column;
  background:
    linear-gradient(180deg, var(--sc-paper) 0, var(--sc-paper) 12rem, var(--sc-surface) 32rem),
    var(--sc-surface);
  color: var(--sc-ink);
  font-family: var(--sc-font);
  font-size: var(--sc-text-base);
  font-weight: var(--sc-weight-regular);
  line-height: 1.5;
  overflow-wrap: break-word;
}
img, svg, video, canvas { max-width: 100%; vertical-align: middle; }
a { color: var(--sc-brand-ink); text-decoration: underline; text-decoration-thickness: .08em; text-underline-offset: .2em; }
a:hover { color: var(--sc-brand-deep); }
p, ul, ol, dl, figure, blockquote, pre, address { margin-top: 0; margin-bottom: 1rem; }
ul, ol { padding-left: 1.75rem; }
li > ul, li > ol { margin-bottom: 0; }
address { font-style: normal; }
h1, h2, h3, h4, h5, h6 { color: var(--sc-ink); text-wrap: balance; }
h1 { margin: 0; font-size: var(--sc-text-heading-page); line-height: 1.12; letter-spacing: -.035em; font-weight: var(--sc-weight-bold); }
h2 { margin: var(--sc-section-gap) 0 1rem; font-size: var(--sc-text-heading-section); line-height: 1.25; letter-spacing: -.018em; font-weight: var(--sc-weight-bold); }
h3 { margin: 1.5rem 0 .7rem; font-size: var(--sc-text-lg); line-height: 1.3; font-weight: var(--sc-weight-bold); }
h4, h5, h6 { margin: 1.25rem 0 .5rem; font-size: var(--sc-text-base); line-height: 1.35; font-weight: var(--sc-weight-bold); }
b, strong { font-weight: var(--sc-weight-semibold); }
small { color: var(--sc-muted); font-size: .875em; }
code, kbd, pre, samp { font-family: var(--sc-font-mono); }
code { white-space: pre-wrap; overflow-wrap: anywhere; font-size: .875em; }
pre { overflow: auto; font-size: .875em; }
hr { margin: 1.5rem 0; border: 0; border-top: 1px solid var(--sc-line); }
abbr[title] { text-decoration: underline dotted; cursor: help; }
table { width: 100%; border-collapse: collapse; caption-side: top; }
caption { padding: 0 0 .5rem; color: var(--sc-muted); font-size: var(--sc-text-sm); text-align: left; }
th { text-align: inherit; }
button, input, optgroup, select, textarea { margin: 0; font-family: inherit; font-size: inherit; line-height: inherit; }
button, select { text-transform: none; }
button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; }
[role="button"], summary { cursor: pointer; }
::-moz-focus-inner { padding: 0; border-style: none; }
::-webkit-search-decoration { -webkit-appearance: none; }
::file-selector-button { font: inherit; -webkit-appearance: button; }
textarea { resize: vertical; }
fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
legend { float: none; width: auto; max-width: 100%; margin: 0 0 .4rem; padding: 0; color: var(--sc-ink-soft); font-size: var(--sc-text-md); font-weight: var(--sc-weight-semibold); line-height: 1.35; white-space: normal; }
iframe { border: 0; }
progress { vertical-align: baseline; }
::placeholder { color: var(--sc-muted); opacity: 1; }

.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.skip-link {
  position: fixed;
  z-index: 1000;
  left: 1rem;
  top: -10rem;
  padding: .75rem 1rem;
  border-radius: var(--sc-radius-sm);
  background: var(--sc-paper);
  box-shadow: var(--sc-shadow-md);
  font-weight: var(--sc-weight-semibold);
}
.skip-link:focus { top: 1rem; }

/* Estructura: cabecera, navegación, comunidad, contenido y pie */
.site-header {
  position: sticky;
  top: 0;
  z-index: 40;
  border-bottom: 1px solid var(--sc-line);
  background: var(--sc-paper);
  box-shadow: 0 1px 0 rgb(24 24 27 / 2%);
}
.site-header-inner {
  width: min(var(--sc-content), calc(100% - 2rem));
  min-height: var(--sc-header-h);
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 1rem;
}
.brand { min-height: 2.75rem; display: inline-flex; align-items: center; gap: .62rem; flex: 0 0 auto; color: var(--sc-ink); text-decoration: none; }
.brand:hover { color: var(--sc-ink); }
.brand-copy { display: flex; align-items: baseline; gap: .4rem; line-height: 1; }
.brand-copy strong { font-size: var(--sc-text-lead); font-weight: var(--sc-weight-bold); letter-spacing: -.025em; }
.brand-copy strong span { color: var(--sc-brand-dark); }
.brand-copy small { padding: .2rem .4rem; border: 1px solid var(--sc-line-strong); border-radius: .35rem; background: var(--sc-surface); color: var(--sc-ink-soft); font-size: var(--sc-text-xs); font-weight: var(--sc-weight-semibold); letter-spacing: .01em; }
.brand-logo {
  width: 2.55rem;
  height: 2.55rem;
  flex: 0 0 auto;
  object-fit: contain;
}
.header-brand-lockup, .auth-mobile-brand-lockup {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: .72rem;
  flex: 0 1 auto;
}
.co-brand-divider { width: 1px; height: 2rem; flex: 0 0 auto; background: var(--sc-line-strong); }
.community-brand-logo { display: block; flex: 0 0 auto; object-fit: contain; }
.community-brand-logo-header, .community-brand-logo-mobile { width: 2.75rem; height: 2.75rem; }
.nav-toggle { display: none; margin-left: auto; gap: .55rem; }
.nav-toggle-lines, .nav-toggle-lines::before, .nav-toggle-lines::after { width: 1.1rem; height: 2px; display: block; border-radius: 999px; background: currentColor; }
.nav-toggle-lines { position: relative; }
.nav-toggle-lines::before, .nav-toggle-lines::after { content: ""; position: absolute; left: 0; }
.nav-toggle-lines::before { top: -.33rem; }
.nav-toggle-lines::after { top: .33rem; }
.nav-toggle[aria-expanded="true"] .nav-toggle-lines { background: transparent; }
.nav-toggle[aria-expanded="true"] .nav-toggle-lines::before { top: 0; transform: rotate(45deg); }
.nav-toggle[aria-expanded="true"] .nav-toggle-lines::after { top: 0; transform: rotate(-45deg); }
.main-nav { min-width: 0; flex: 1; display: flex; align-items: center; gap: .15rem; }
.main-nav a, .nav-logout {
  min-height: var(--sc-tap);
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .5rem .55rem;
  border-radius: var(--sc-radius-sm);
  color: var(--sc-ink-soft);
  font-size: var(--sc-text-md);
  font-weight: var(--sc-weight-semibold);
  text-decoration: none;
  white-space: nowrap;
}
.nav-icon { width: 1.1rem; height: 1.1rem; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.main-nav a:hover { background: var(--sc-surface-strong); color: var(--sc-ink); }
.main-nav a.is-active { background: var(--sc-brand-soft); color: var(--sc-ink); box-shadow: inset 0 -3px var(--sc-brand-deep); }
.nav-spacer { flex: 1; }
.user-menu { position: relative; flex: 0 0 auto; }
.user-menu-toggle {
  min-height: var(--sc-tap);
  max-width: 15rem;
  gap: .5rem;
  padding: .3rem .7rem .3rem .3rem;
  border: 1px solid var(--sc-control-line);
  border-radius: 999px;
  background: var(--sc-paper);
  color: var(--sc-ink);
  font-weight: var(--sc-weight-semibold);
  box-shadow: none;
}
.user-menu-toggle:hover { border-color: var(--sc-control-line-hover); background: var(--sc-surface-strong); color: var(--sc-ink); box-shadow: none; }
.user-menu.is-active .user-menu-toggle { border-color: var(--sc-brand-deep); background: var(--sc-brand-soft); box-shadow: inset 0 0 0 1px var(--sc-brand-deep); }
.user-avatar { width: 2.1rem; height: 2.1rem; flex: 0 0 auto; display: inline-grid; place-items: center; border: 1px solid var(--sc-brand-line); border-radius: 50%; background: var(--sc-brand-soft); color: var(--sc-brand-deep); font-size: var(--sc-text-xs); font-weight: var(--sc-weight-bold); letter-spacing: .02em; text-transform: uppercase; }
/* Desde 80rem el nombre crece con la pantalla: 7rem a 1280 px (caben los siete apartados) y
   hasta 10rem en pantallas anchas. */
.user-menu-name { min-width: 0; max-width: clamp(7rem, 100vw - 73rem, 10rem); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.user-menu-chevron { width: 1rem; height: 1rem; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .15s ease; }
.user-menu-toggle[aria-expanded="true"] .user-menu-chevron { transform: rotate(180deg); }
.user-menu-panel {
  position: absolute;
  z-index: 60;
  top: calc(100% + .5rem);
  right: 0;
  width: min(21rem, calc(100vw - 2rem));
  max-height: calc(100vh - var(--sc-header-h) - 1rem);
  padding: .5rem;
  display: none;
  overflow-y: auto;
  border: 1px solid var(--sc-line);
  border-radius: var(--sc-radius-md);
  background: var(--sc-paper);
  box-shadow: var(--sc-shadow-md);
}
.user-menu.is-open .user-menu-panel { display: grid; gap: .1rem; }
.user-menu-identity { margin-bottom: .35rem; padding: .5rem .7rem .75rem; display: grid; gap: .1rem; border-bottom: 1px solid var(--sc-line); }
.user-menu-identity strong { overflow-wrap: anywhere; }
.user-menu-identity small { font-size: var(--sc-text-xs); overflow-wrap: anywhere; }
.user-menu-panel a { width: 100%; justify-content: flex-start; }
.user-menu-panel a.is-active { box-shadow: inset 4px 0 var(--sc-brand-deep); }
.nav-logout-form { margin: 0; }
.nav-logout { width: 100%; justify-content: flex-start; border: 0; background: transparent; box-shadow: none; }
.nav-logout:hover { border: 0; background: var(--sc-danger-bg); color: var(--sc-danger); box-shadow: none; }
.language-switcher { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; }
.language-switcher-label { flex: 1 0 100%; color: var(--sc-muted); font-size: var(--sc-text-xs); font-weight: var(--sc-weight-semibold); }
.language-switcher-nav { margin: .35rem 0; padding: .6rem .7rem; border-block: 1px solid var(--sc-line); }
.language-switcher .language-option {
  min-width: 3.6rem;
  min-height: 2.5rem;
  gap: .4rem;
  padding: .35rem .6rem;
  border: 1px solid var(--sc-line-strong);
  border-radius: var(--sc-radius-sm);
  background: var(--sc-paper);
  color: var(--sc-ink);
  font-size: var(--sc-text-sm);
  font-weight: var(--sc-weight-semibold);
  letter-spacing: .02em;
  box-shadow: none;
}
.language-switcher .language-option img { width: 1.35rem; height: .9rem; display: block; border-radius: .14rem; object-fit: cover; box-shadow: 0 0 0 1px rgb(24 24 27 / 12%); }
.language-switcher .language-option:hover { border-color: var(--sc-control-line); background: var(--sc-surface-strong); color: var(--sc-ink); box-shadow: none; }
.language-switcher .language-option.is-active { border-color: var(--sc-brand-deep); background: var(--sc-brand-soft); color: var(--sc-brand-deep); box-shadow: inset 0 0 0 1px var(--sc-brand-deep); }
.tenant-bar {
  border-bottom: 1px solid var(--sc-line);
  background: var(--sc-paper);
  color: var(--sc-ink-soft);
}
.tenant-bar-inner {
  width: min(var(--sc-content), calc(100% - 2rem));
  min-height: 2.5rem;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: .5rem;
  overflow: hidden;
  font-size: var(--sc-text-sm);
}
.tenant-indicator { width: 1.5rem; height: 1.5rem; display: grid; place-items: center; flex: 0 0 auto; border-radius: .4rem; background: var(--sc-brand-soft); color: var(--sc-brand-ink); }
.tenant-indicator .icon { width: .9rem; height: .9rem; }
.tenant-label { flex: 0 0 auto; color: var(--sc-muted); font-weight: var(--sc-weight-regular); }
.tenant-name { min-width: 0; overflow: hidden; color: var(--sc-ink); font-weight: var(--sc-weight-semibold); text-overflow: ellipsis; white-space: nowrap; }
.setup-banner { margin: 0 0 1.5rem; }
.page-shell { width: min(var(--sc-content), calc(100% - 2rem)); margin: 0 auto; padding: clamp(2rem, 4vw, 3.25rem) 0 5rem; flex: 1 0 auto; }
.page-shell:focus { outline: 0; }
.site-footer { flex: 0 0 auto; padding: 1.25rem 1.5rem; border-top: 1px solid var(--sc-line); background: var(--sc-paper); color: var(--sc-muted); font-size: var(--sc-text-xs); }
.site-footer-inner { width: min(var(--sc-content), 100%); margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.site-footer strong { color: var(--sc-ink-soft); }

/* Iconografía */
.icon { width: 1.35rem; height: 1.35rem; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.icon-lg { width: 1.7rem; height: 1.7rem; }
.icon-sm { width: 1.1rem; height: 1.1rem; }

/* Encabezados y composición */
/* Cabecera de página (contrato único en todas las pantallas): .page-heading con
   .page-heading-copy (enlace de retorno .page-back, h1 y entradilla) y, a la derecha,
   .page-actions. El enlace de retorno lleva SIEMPRE al padre inmediato (el módulo o
   el listado en altas y fichas; el registro en sus subpantallas) y no lo llevan las
   páginas del menú principal ni del menú de usuario. Sobre el h1 no hay lemas
   («Territorio», «Economía»…) ni hay botones «Volver…» al pie. En edición, el registro
   se nombra en el enlace de retorno si es su padre o, si no tiene ficha propia, en la
   primera línea de la entradilla; el título de la pestaña empieza por su nombre. El
   título va siempre en esta cabecera, también en los formularios (fuera de la tarjeta). */
.page-heading { margin-bottom: 1.75rem; display: flex; align-items: flex-start; justify-content: space-between; gap: 2rem; }
.page-heading-copy { min-width: 0; max-width: 48rem; flex: 1 1 20rem; }
/* Las acciones no se parten en dos filas mientras quepan: la entradilla cede su ancho. */
.page-heading > .page-actions { flex: 0 1 auto; max-width: 65%; }
.page-heading h1, .list-card strong { overflow-wrap: anywhere; }
.page-actions > .button { white-space: nowrap; }
.checksum { display: block; overflow-wrap: anywhere; }
.page-heading-copy > p, .page-heading p:last-child, .page-intro { margin: .5rem 0 0; color: var(--sc-muted); }
.page-heading-copy > h1 + p { margin-top: .4rem; }
/* Acciones de página: como máximo tres (una sola .button primaria, la acción principal
   de la pantalla; el resto .button-secondary). Lo que se repite por elemento (Editar en
   tarjetas, Editar finca), lo que filtra y lo que solo navega o configura nunca es
   primario. En el móvil la primaria va arriba y a todo el ancho y las secundarias, por
   parejas. */
.page-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .65rem; }
.eyebrow { margin: 0 0 .35rem; color: var(--sc-brand-ink); font-size: var(--sc-text-xs); font-weight: var(--sc-weight-semibold); letter-spacing: .01em; }
.page-back { width: fit-content; max-width: 100%; min-height: 2rem; margin: -.4rem 0 .25rem; display: flex; align-items: center; gap: .45rem; color: var(--sc-brand-ink); font-size: var(--sc-text-sm); font-weight: var(--sc-weight-semibold); text-decoration: none; overflow-wrap: anywhere; }
.page-back::before { content: ""; width: .45rem; height: .45rem; flex: 0 0 auto; margin-left: .15rem; border-bottom: 2px solid currentColor; border-left: 2px solid currentColor; transform: rotate(45deg); }
.page-back:hover { color: var(--sc-brand-deep); text-decoration: underline; }
/* Cabecera de sección (contrato único; también la de las tarjetas del panel): el título
   (con antetítulo en todas las secciones de una página o en ninguna) y, debajo, su
   descripción en gris; a la derecha y alineada con el título, una acción: un botón
   .button.button-secondary si crea o cambia algo («Añadir turno», «Vincular persona»,
   «Nuevo derecho»), un enlace en seminegrita si solo navega («Ver todas las cuotas»,
   «Ver cuotas»). En el móvil la acción pasa debajo: el botón a todo el ancho y el enlace
   sin el hueco de su zona de 44 px. */
.section-heading, .dashboard-card-heading { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: .25rem 1rem; }
.section-heading { margin: var(--sc-section-gap) 0 1rem; }
.dashboard-card-heading { margin-bottom: 1rem; }
:is(.section-heading, .dashboard-card-heading) :is(h2, h3) { margin: 0; }
:is(.section-heading, .dashboard-card-heading) .eyebrow { margin-bottom: .2rem; }
:is(.section-heading, .dashboard-card-heading) > div > p:not(.eyebrow) { margin: .4rem 0 0; color: var(--sc-muted); }
:is(.section-heading, .dashboard-card-heading) > a:not(.button) { min-height: var(--sc-tap); margin-block: -.6rem; display: inline-flex; align-items: center; font-weight: var(--sc-weight-semibold); }
.section-supporting-copy { grid-column: 1 / -1; max-width: var(--sc-reading); margin: 0; color: var(--sc-muted); font-size: var(--sc-text-sm); }
.stack { display: grid; gap: 1rem; }
.stack > * { min-width: 0; }
.detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.detail-grid > * { min-width: 0; }
.account-meta { margin-top: 1.25rem; }
/* Tarjeta: una sola pieza para fichas, panel, formularios y Mi cuenta. */
.card, .surface-card, .summary-card, .dashboard-card, .form-card, .security-card {
  display: block;
  min-width: 0;
  padding: var(--sc-card-pad);
  border: 1px solid var(--sc-line);
  border-radius: var(--sc-card-radius);
  background: var(--sc-paper);
  box-shadow: var(--sc-card-shadow);
}
.card > :first-child, .surface-card > :first-child, .summary-card > :first-child, .form-card > :first-child, .form-section > :first-child { margin-top: 0; }
.card > :last-child, .surface-card > :last-child, .summary-card > :last-child { margin-bottom: 0; }
.card h2, .surface-card h2, .summary-card h2 { margin-top: 0; }
/* Escala de títulos por componente, no por nivel (h2/h3/h4 los impone el documento):
   1) página: h1; 2) sección de página: h2 suelto o en .section-heading fuera de una
   tarjeta (--sc-text-heading-section); 3) tarjeta: el primer título de una tarjeta o de
   su cabecera y .card-title (--sc-text-heading-card); 4) subbloque dentro de una
   tarjeta: --sc-text-lg. */
:is(.card, .surface-card, .summary-card, .security-card, .dashboard-card, .form-section, .confirmation-card, .danger-zone, .form-card) > :is(h2, h3):first-of-type,
:is(.card, .surface-card, .confirmation-card, .form-card) > div:first-child > :is(h2, h3):first-of-type,
.policy-summary > div:first-child > h2,
:is(.card, .surface-card, .summary-card, .security-card, .dashboard-card) > :is(header, .section-heading, .dashboard-card-heading) :is(h2, h3),
:is(.member-plot-card, .member-plot-editor, .member-directory-card) > header :is(h2, h3),
.form-section-heading :is(h2, h3, h4),
.card-title { font-size: var(--sc-text-heading-card); font-weight: var(--sc-weight-bold); }
/* Subbloque: una sección dentro de otra o de un desplegable («Crear finca nueva» → «Derecho
   de agua»), y una cabecera de sección que no abre su tarjeta («Ajustes por comunero» bajo
   el ejercicio): siempre --sc-text-lg, se use donde se use (OX-06, OA-04). */
:is(.form-section, .member-plot-editor, .form-disclosure) .form-section .form-section-heading :is(h2, h3, h4),
:is(.card, .surface-card, .summary-card, .security-card, .dashboard-card) > * ~ .section-heading :is(h2, h3),
.member-plot-card section > h4, .member-plot-card .compact-heading h4 { font-size: var(--sc-text-lg); }
dl { margin-bottom: 0; }
dt { color: var(--sc-muted); font-size: var(--sc-text-xs); font-weight: var(--sc-weight-semibold); letter-spacing: .01em; }
dd { margin: .15rem 0 1rem; overflow-wrap: anywhere; }
.detail-list { display: grid; grid-template-columns: minmax(8rem, 30%) minmax(0, 1fr); gap: .35rem 1rem; }
.detail-list dd { margin: 0; }

/* Botones y foco */
button, .button {
  min-height: var(--sc-control-h);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  padding: .55rem 1rem;
  border: 1px solid var(--sc-brand);
  border-radius: var(--sc-radius-sm);
  background: var(--sc-brand);
  color: var(--sc-on-brand);
  font: inherit;
  font-weight: var(--sc-weight-semibold);
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  box-shadow: 0 1px 2px rgb(154 61 11 / 10%);
  transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
button:hover, .button:hover { border-color: var(--sc-brand-dark); background: var(--sc-brand-dark); color: var(--sc-on-brand); box-shadow: 0 3px 8px rgb(215 105 39 / 20%); }
button:active, .button:active { transform: translateY(1px); }
button:disabled { opacity: .55; cursor: not-allowed; box-shadow: none; transform: none; }
form[aria-busy="true"] button:disabled { cursor: progress; }
.button-secondary { border-color: var(--sc-control-line); background: var(--sc-paper); color: var(--sc-ink); box-shadow: var(--sc-shadow-sm); }
.button-secondary:hover { border-color: var(--sc-control-line-hover); background: var(--sc-surface-strong); color: var(--sc-ink); box-shadow: var(--sc-shadow-sm); }
.button-danger { border-color: var(--sc-danger); background: var(--sc-danger); color: var(--sc-paper); }
.button-danger:hover { border-color: var(--sc-danger-strong); background: var(--sc-danger-strong); color: var(--sc-paper); box-shadow: 0 3px 8px rgb(143 28 19 / 22%); }
.button-quiet, .link-button {
  border-color: transparent;
  background: transparent;
  color: var(--sc-brand-ink);
  box-shadow: none;
}
.button-quiet:hover, .link-button:hover { border-color: transparent; background: var(--sc-brand-soft); color: var(--sc-brand-deep); box-shadow: none; }
.link-button { min-height: 2.5rem; padding: .4rem .55rem; font-weight: var(--sc-weight-semibold); text-decoration: underline; }
/* Acción destructiva de texto (eliminar, retirar, desvincular, desactivar, cancelar):
   color de peligro, sin perder su data-confirm. */
.link-button-danger { color: var(--sc-danger); }
.link-button-danger:hover { background: var(--sc-danger-bg); color: var(--sc-danger-strong); }
.button-row, .form-actions { margin-top: 1.5rem; display: flex; flex-wrap: wrap; align-items: center; gap: .7rem; }
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 3px solid var(--sc-focus);
  outline-offset: 2px;
}

/* Panel de la Junta */
.dashboard-heading { min-height: 5.5rem; align-items: center; }
.dashboard-date { width: fit-content; min-height: 2.25rem; display: inline-flex; align-items: center; gap: .5rem; padding: .35rem .8rem; border: 1px solid var(--sc-line); border-radius: 999px; background: var(--sc-paper); color: var(--sc-ink-soft); font-size: var(--sc-text-sm); font-weight: var(--sc-weight-semibold); box-shadow: var(--sc-shadow-sm); white-space: nowrap; }
.dashboard-date .icon { width: 1.05rem; height: 1.05rem; color: var(--sc-brand-ink); }
.dashboard-alerts { margin-bottom: 1.75rem; }
.dashboard-alerts > .section-heading { margin-top: 0; }
.dashboard-alert-list { margin: 0; padding: 0; display: grid; gap: .6rem; list-style: none; }
.dashboard-alert-list > .notice { margin: 0; }
/* Tarjetas vecinas del panel: misma altura, mismo relleno y el enlace «ver más» en la cabecera (CLA-17). */
.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); align-items: stretch; gap: 1.25rem; }
.dashboard-grid > * { min-width: 0; }
.dashboard-card > :last-child { margin-bottom: 0; }
.preview-summary.fee-summary { margin: 0; }
.fee-progress { margin: 1rem 0 .35rem; }
.fee-progress-track { height: .85rem; overflow: hidden; border: 1px solid var(--sc-control-line); border-radius: 999px; background: var(--sc-surface-strong); }
.fee-progress-bar { height: 100%; min-width: 0; border-radius: 999px; background: var(--sc-success); }
.fee-progress-label { margin: .45rem 0 0; color: var(--sc-ink-soft); font-size: var(--sc-text-sm); }
.dashboard-facts { margin: 1rem 0 0; padding: 0; display: grid; gap: .5rem; list-style: none; }
.dashboard-facts li { padding: .65rem .8rem; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .35rem 1rem; border: 1px solid var(--sc-line); border-radius: var(--sc-radius-sm); background: var(--sc-paper); }
.dashboard-facts li > span { min-width: 0; }
.dashboard-facts a { min-height: 2.5rem; display: inline-flex; align-items: center; font-weight: var(--sc-weight-semibold); }
.dashboard-facts strong { font-variant-numeric: tabular-nums; }
.dashboard-overdue { grid-column: 1 / -1; }
.dashboard-overdue > p:not(.empty-inline) { max-width: var(--sc-reading); }
.overdue-list { margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr)); column-gap: 2rem; list-style: none; border-top: 1px solid var(--sc-line); }
.overdue-list li { padding: .65rem 0; display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .2rem 1rem; border-bottom: 1px solid var(--sc-line); }
.overdue-list li > span { min-width: 0; overflow-wrap: anywhere; }
.overdue-list small { display: block; font-size: var(--sc-text-xs); }
.overdue-list strong { font-variant-numeric: tabular-nums; white-space: nowrap; }
.now-panel {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(13rem, .6fr) 1.4fr;
  gap: 2rem;
  padding: clamp(1.35rem, 3vw, 2rem);
  border: 1px solid var(--sc-line);
  border-radius: var(--sc-card-radius);
  background:
    radial-gradient(circle at 90% -15%, rgb(230 129 47 / 13%), transparent 32%),
    linear-gradient(135deg, var(--sc-paper), var(--sc-brand-tint));
  color: var(--sc-ink);
  box-shadow: var(--sc-card-shadow);
}
.now-panel::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .28; background-image: radial-gradient(circle, rgb(24 24 27 / 16%) .7px, transparent .8px); background-size: 16px 16px; mask-image: linear-gradient(90deg, transparent 35%, black); }
.now-panel > * { position: relative; z-index: 1; }
.now-panel h2 { margin: .15rem 0 0; color: var(--sc-ink); font-size: var(--sc-text-heading-page); }
.now-panel .eyebrow { color: var(--sc-brand-ink); }
.dashboard-now { grid-template-columns: 1fr; align-content: start; gap: 1rem; padding: var(--sc-card-pad); }
.dashboard-now > .dashboard-card-heading { margin-bottom: 0; }
.dashboard-now h2 { font-size: var(--sc-text-heading-card); }
.now-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr)); gap: .8rem; }
.now-source { position: relative; min-height: 6.7rem; padding: 1rem 1rem 1rem 1.2rem; overflow: hidden; border: 1px solid var(--sc-line); border-radius: .7rem; background: rgb(255 255 255 / 92%); box-shadow: var(--sc-shadow-sm); }
.now-source::before { content: ""; position: absolute; inset: 0 auto 0 0; width: .3rem; background: var(--source-color, var(--sc-line-strong)); }
.now-source strong, .now-source span, .now-source small { display: block; }
.now-source strong { margin-bottom: .2rem; }
.now-source span { font-weight: var(--sc-weight-semibold); overflow-wrap: anywhere; }
.now-source small { margin-top: .15rem; color: var(--sc-muted); font-size: var(--sc-text-sm); }
.now-source > .badge { margin-top: .5rem; display: inline-flex; }
.now-unconfigured { display: flex; align-items: flex-start; gap: .8rem; padding: 1rem; border: 1px solid var(--sc-line); border-radius: .7rem; background: rgb(255 255 255 / 92%); }
.now-unconfigured strong, .now-unconfigured span { display: block; }
.now-unconfigured span { color: var(--sc-muted); }
.now-refresh { margin: .25rem 0 0; display: flex; flex-wrap: wrap; align-items: center; gap: .25rem .75rem; color: var(--sc-muted); font-size: var(--sc-text-xs); }
.now-refresh .link-button { min-height: 2.25rem; }
.now-refresh a { min-height: 2.5rem; display: inline-flex; align-items: center; font-weight: var(--sc-weight-semibold); }
.card-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: .85rem; }
.action-card {
  position: relative;
  min-height: 6.25rem;
  padding: 1rem 2.2rem 1rem 1rem;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-rows: auto auto;
  align-items: start;
  align-content: start;
  gap: .12rem .8rem;
  border: 1px solid var(--sc-line);
  border-radius: var(--sc-radius-md);
  background: var(--sc-paper);
  color: var(--sc-ink);
  box-shadow: var(--sc-shadow-sm);
  text-decoration: none;
  transition: border-color .15s ease, background-color .15s ease, transform .15s ease, box-shadow .15s ease;
}
.action-card::after { content: ""; position: absolute; top: 50%; right: 1.05rem; width: .5rem; height: .5rem; border-top: 2px solid var(--sc-control-line); border-right: 2px solid var(--sc-control-line); transform: translateY(-50%) rotate(45deg); transition: border-color .15s ease, transform .15s ease; }
.action-card:hover { border-color: var(--sc-brand-line); background: var(--sc-brand-tint); color: var(--sc-ink); box-shadow: 0 4px 14px rgb(24 24 27 / 6%); transform: translateY(-1px); }
.action-card:hover::after { border-color: var(--sc-brand-dark); transform: translate(.15rem, -50%) rotate(45deg); }
.action-card strong, .action-card small { grid-column: 2; }
.action-card strong { font-weight: var(--sc-weight-semibold); }
.action-card small { align-self: start; font-size: var(--sc-text-sm); line-height: 1.35; }
.action-icon { grid-row: 1 / 3; align-self: center; width: 2.65rem; height: 2.65rem; display: grid; place-items: center; border: 1px solid var(--sc-brand-line); border-radius: .68rem; background: var(--sc-brand-soft); color: var(--sc-brand-ink); }

/* Avisos, estados y vacíos */
.messages { margin: 0 0 1.5rem; display: grid; gap: .6rem; }
.message {
  padding: .8rem .6rem .8rem 1rem;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: start;
  gap: .7rem;
  overflow: hidden;
  border: 1px solid var(--sc-line);
  border-left: 4px solid var(--sc-water);
  border-radius: var(--sc-radius-md);
  background: var(--sc-paper);
  color: var(--sc-ink);
  box-shadow: var(--sc-shadow-sm);
}
.message > .icon { margin-top: .05rem; color: var(--sc-water); }
.message-text { margin: 0; align-self: center; font-weight: var(--sc-weight-regular); overflow-wrap: anywhere; }
.message-close { width: 2.5rem; min-height: 2.5rem; margin: -.4rem 0 -.4rem; padding: 0; border-color: transparent; background: transparent; color: var(--sc-ink-soft); box-shadow: none; font-size: var(--sc-text-heading-card); font-weight: var(--sc-weight-regular); line-height: 1; }
.message-close:hover { border-color: transparent; background: var(--sc-surface-strong); color: var(--sc-ink); box-shadow: none; }
.message-success { border-color: var(--sc-success-line); border-left-color: var(--sc-success); background: var(--sc-success-bg); }
.message-success > .icon { color: var(--sc-success); }
.message-error { border-color: var(--sc-danger-line); border-left-color: var(--sc-danger); background: var(--sc-danger-bg); }
.message-error > .icon { color: var(--sc-danger); }
.message-warning { border-color: var(--sc-warning-line); border-left-color: var(--sc-warning-accent); background: var(--sc-warning-bg); }
.message-warning > .icon { color: var(--sc-warning-icon); }
.message.is-leaving { opacity: 0; transform: translateY(-.35rem); transition: opacity .3s ease, transform .3s ease, height .3s ease, margin .3s ease, padding .3s ease; }
/* Avisos (contrato único). .notice es informativo (azul agua): explica sin pedir nada.
   El tono cambia solo con un modificador: .notice-warning (amarillo: revisar o actuar
   antes de seguir), .notice-danger (rojo: error o consecuencia irreversible) y
   .notice-success (verde: hecho). Mismo radio, relleno y filete en todos. Con un icono
   como primer hijo (svg.icon) se maqueta como los mensajes: icono · texto · acción; así
   son también el aviso «Configuración pendiente» de las páginas y los avisos del panel. */
.notice { --notice-line: var(--sc-info-line); --notice-accent: var(--sc-water); --notice-icon: var(--sc-water); --notice-bg: var(--sc-info-bg); --notice-ink: var(--sc-ink); margin: 1rem 0; padding: .85rem 1rem; border: 1px solid var(--notice-line); border-left: 4px solid var(--notice-accent); border-radius: var(--sc-radius-md); background: var(--notice-bg); color: var(--notice-ink); }
.notice-warning { --notice-line: var(--sc-warning-line); --notice-accent: var(--sc-warning-accent); --notice-icon: var(--sc-warning-icon); --notice-bg: var(--sc-warning-bg); --notice-ink: var(--sc-warning-ink); }
.notice-danger { --notice-line: var(--sc-danger-line); --notice-accent: var(--sc-danger); --notice-icon: var(--sc-danger); --notice-bg: var(--sc-danger-bg); --notice-ink: var(--sc-danger-ink); }
.notice-success { --notice-line: var(--sc-success-line); --notice-accent: var(--sc-success); --notice-icon: var(--sc-success); --notice-bg: var(--sc-success-bg); --notice-ink: var(--sc-ink); }
.notice > :last-child { margin-bottom: 0; }
.notice-compact { padding: .7rem .85rem; font-size: var(--sc-text-sm); }
.notice:has(> .icon) { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .5rem .9rem; }
.notice > .icon { align-self: start; color: var(--notice-icon); }
.notice:has(> .icon) > div > strong { display: block; color: var(--sc-ink); }
.notice:has(> .icon) > div > p { margin: .1rem 0 0; font-size: var(--sc-text-sm); }
.notice:has(> .icon) > .button { justify-self: end; }
.replacement-confirmation { display: grid; gap: var(--sc-space-2); }
.replacement-confirmation p { margin: 0; }
.replacement-confirmation .check-row { color: var(--sc-ink); }
.current-assignments { margin: 0 0 var(--sc-space-4); padding: var(--sc-space-3) var(--sc-space-4); border: 1px solid var(--sc-line); border-radius: var(--sc-radius-md); background: var(--sc-surface); }
.current-assignments h3 { margin: 0 0 var(--sc-space-2); font-size: var(--sc-text-lg); font-weight: var(--sc-weight-bold); }
.current-assignments p { margin: 0; color: var(--sc-muted); }
.current-assignments ul { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--sc-space-1); }
.current-assignments li > span { color: var(--sc-muted); }
/* Vacíos (dos componentes y nada más): .empty-state es el vacío de una página o de su
   bloque principal (icono del módulo, título, frase y acción); .empty-inline, el de una
   sección (una frase, con su título en <strong> si hace falta, y un botón si procede). */
.empty-state { padding: clamp(1.5rem, 4vw, 2.5rem); display: grid; justify-items: start; gap: .65rem; border: 1px dashed var(--sc-line-strong); border-radius: var(--sc-card-radius); background: var(--sc-paper); }
.empty-state .icon { width: 2rem; height: 2rem; color: var(--sc-brand-ink); }
.empty-state h2, .empty-state h3, .empty-state p { margin: 0; }
.empty-state p { max-width: 40rem; color: var(--sc-muted); }
/* Estados (insignias). Una palabra, un color en toda la aplicación, y siempre con
   texto: el color nunca va solo. El tono lo decide core/status.py (Tone):
   - .badge sola (gris): sin nada pendiente, histórico o sin efecto (Anterior,
     Caducada, Retirada, Archivado, No enviado, Sin efecto, Sustituida sin aprobar).
   - .badge-pending (amarillo): en curso o a la espera de un paso previsto
     (Pendiente, En cola, Borrador, Borrador en curso, Programada).
     .badge-warning es el mismo tono para avisos que piden revisar algo.
   - .badge-success (verde): en vigor o completado (Vigente, Pagado, Enviado, Bloqueada).
   - .badge-error (rojo): un fallo que hay que resolver (Error de envío).
   Los tonos de cesión (.badge-available, .badge-assigned, .badge-received) son propios
   del horario. */
.badge { display: inline-flex; align-items: center; min-height: 1.6rem; padding: .12rem .6rem; border: 1px solid var(--sc-line-strong); border-radius: 999px; background: var(--sc-surface); color: var(--sc-ink-soft); font-size: var(--sc-text-xs); font-weight: var(--sc-weight-semibold); line-height: 1.3; white-space: nowrap; vertical-align: middle; }
.badge-success { border-color: var(--sc-success-line); background: var(--sc-success-bg); color: var(--sc-success); }
.badge-pending, .badge-warning { border-color: var(--sc-warning-line); background: var(--sc-warning-bg); color: var(--sc-warning-ink); }
.badge-error { border-color: var(--sc-danger-line); background: var(--sc-danger-bg); color: var(--sc-danger); }
.assignment-history { margin-top: var(--sc-space-3); }
.assignment-history > .field-help { margin: 0 0 var(--sc-space-2); }
.issue { margin-bottom: .4rem; padding: .45rem .6rem; border-radius: .35rem; font-size: var(--sc-text-sm); }
.issue-error { background: var(--sc-danger-bg); color: var(--sc-danger-ink); }
.issue-warning { background: var(--sc-warning-bg); color: var(--sc-warning-ink); }
.issue-info { background: var(--sc-info-bg); color: var(--sc-ink-soft); }

/* Listas y tablas (contrato compartido: .table-wrap + <table class="table-stack"> con data-label) */
.list-grid { display: grid; gap: .6rem; }
.list-card { min-height: 4.4rem; padding: .9rem 1rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; border: 1px solid var(--sc-line); border-radius: var(--sc-card-radius); background: var(--sc-paper); color: var(--sc-ink); text-decoration: none; box-shadow: var(--sc-card-shadow); transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease; }
.list-card:hover { border-color: var(--sc-brand-line); background: var(--sc-brand-tint); color: var(--sc-ink); box-shadow: 0 4px 14px rgb(24 24 27 / 5%); }
.list-card > div:first-child { min-width: 0; display: grid; }
.list-card small { color: var(--sc-muted); }
.table-hint { display: none; margin: 0 0 .45rem; color: var(--sc-muted); font-size: var(--sc-text-sm); }
.table-hint.is-visible { display: block; }
.table-count { margin: 0 0 .45rem; color: var(--sc-ink-soft); font-size: var(--sc-text-sm); font-weight: var(--sc-weight-regular); }
.table-wrap, .table-responsive { position: relative; overflow: auto; overscroll-behavior-x: contain; border: 1px solid var(--sc-line); border-radius: var(--sc-card-radius); background: var(--sc-paper); box-shadow: var(--sc-card-shadow); scrollbar-color: var(--sc-control-line) transparent; }
.table-wrap:focus-visible, .table-responsive:focus-visible { outline-offset: 2px; }
.pagination-bar { margin-top: 1rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; color: var(--sc-muted); font-size: var(--sc-text-sm); }
.pagination-bar .button-row { margin-top: 0; }
th, td { padding: .75rem .9rem; border-bottom: 1px solid var(--sc-line); text-align: left; vertical-align: middle; }
th { background: var(--sc-surface); color: var(--sc-ink-soft); font-size: var(--sc-text-xs); font-weight: var(--sc-weight-semibold); letter-spacing: .01em; }
.table-wrap thead th, .table-responsive thead th { position: sticky; z-index: 2; top: 0; border-bottom: 0; box-shadow: inset 0 -1px var(--sc-line-strong); }
tfoot th, tfoot td { border-top: 1px solid var(--sc-line-strong); border-bottom: 0; background: var(--sc-surface); color: var(--sc-ink); font-size: var(--sc-text-sm); }
tbody tr:last-child td, tbody tr:last-child th { border-bottom: 0; }
/* Tablas de datos: el contenido va a un solo tamaño y en peso normal, también el que
   la plantilla marque con <strong>. Solo destacan las cabeceras, los totales y, en móvil,
   el título de cada tarjeta; lo secundario (small, .table-meta) va más pequeño.
   FullCalendar conserva su escala propia. */
main table:not(.fc table) > tbody > tr > :is(td, th) { font-size: var(--sc-text-md); font-weight: var(--sc-weight-regular); }
main table:not(.fc table) > tbody > tr > :is(td, th) :is(strong, b) { font-weight: inherit; }
main table:not(.fc table) > tbody > tr > :is(td, th) :is(small, .table-meta) { font-size: var(--sc-text-xs); }
main table:not(.fc table) > tfoot > tr > :is(td, th),
main table:not(.fc table) > tbody > tr.table-total-row > :is(td, th) { font-weight: var(--sc-weight-semibold); }
/* Fila al pasar: solo en las tablas de datos; la rejilla del calendario (FullCalendar) es
   también una tabla y se teñía entera. :where() mantiene la especificidad de siempre. */
:where(main table:not(.fc table)) > tbody > tr:hover:not(:has(.empty)) { background: var(--sc-row-hover); }
.clickable-row { cursor: pointer; }
.clickable-row:focus-visible { outline: 3px solid var(--sc-focus); outline-offset: -3px; }
.number { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
/* Identificadores que no se parten por su guion: n.º de comunero (DEMO-004),
   de recibo y referencias AAAA-NNNN. En frases, el filtro |nowrap solo envuelve el valor. */
.nowrap { white-space: nowrap; }
/* Abrir una ficha desde un listado (contrato único): la celda título de la fila
   (data-stack="title"; en Comuneros también Apellidos y Nombre) lleva SIEMPRE un enlace a
   la ficha, con el aspecto de enlace común; la fila pulsable (data-row-href) es solo un
   atajo y no recibe el foco. La columna de acciones (data-label="") se titula «Acciones»
   solo para lectores de pantalla y no repite «Ver»: lleva lo que no es abrir. En la tabla
   ancha el enlace va en línea, sin alargar la fila; con puntero táctil conserva 44 px de
   zona de pulsación sin cambiar su altura. */
:is(td[data-stack="title"], .member-last-name-cell, .member-name-cell) > a { min-height: 0; display: inline; }
/* Acciones de fila (contrato único en todas las tablas): <div class="table-actions"> con
   enlaces y, para lo que envía un formulario, <button class="link-button">; ambos con el
   mismo peso y tamaño que el contenido. Lo destructivo añade .link-button-danger. */
.table-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .6rem; }
/* El formulario ocupa la altura del enlace vecino y su botón se centra igual que él. */
.table-actions form { margin: 0; display: flex; align-self: stretch; }
.table-actions .link-button { padding-inline: 0; font-weight: var(--sc-weight-regular); text-decoration-thickness: .08em; text-underline-offset: .2em; }
.table-actions button, td > form button { min-height: 2.5rem; }
.table-actions > a, td > a, .file-list a { min-height: 2.75rem; display: inline-flex; align-items: center; }
.table-actions > a { min-width: 1.75rem; justify-content: center; }
.empty { color: var(--sc-muted); }

/* Filtros (contrato único en todos los listados). El primer campo es «Buscar» y dice qué
   busca: en el texto de ejemplo si cabe entero también en el móvil («Título», «Nombre o
   email»); si no, en una ayuda .filter-bar-help enlazada con aria-describedby, que se ve
   siempre (Comuneros, Cuotas). Ocupa lo que sobre; los selectores y casillas,
   su ancho natural; al final «Filtrar» (botón secundario: la acción principal de la
   página es otra) y, solo con filtros puestos, «Limpiar filtros» (.button-quiet). Las
   exportaciones van en .page-actions, no aquí. Una sola maqueta flexible que parte filas
   sola en cualquier ancho e idioma, sin variantes por pantalla. */
.filter-bar {
  margin-bottom: 1rem;
  padding: .85rem;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: .7rem;
  border: 1px solid var(--sc-line);
  border-radius: var(--sc-card-radius);
  background: var(--sc-paper);
  box-shadow: var(--sc-card-shadow);
}
.filter-bar > * { min-width: 0; }
.filter-field { flex: 1 1 9rem; max-width: 16rem; }
.filter-field:has(input[type="search"], input[type="text"]) { flex: 6 1 21rem; max-width: none; }
.filter-field label { margin-bottom: .25rem; font-size: var(--sc-text-sm); }
.filter-check { min-height: var(--sc-tap); display: inline-flex; flex: 0 1 auto; align-items: center; gap: .55rem; margin: 0; padding: .5rem .2rem; }
.filter-actions { display: flex; flex: 0 0 auto; align-items: center; flex-wrap: wrap; gap: .55rem; }
.filter-bar > :is(.filter-bar-help, .form-errors) { flex: 1 0 100%; margin: -.3rem 0 0; }
.filter-bar > .form-errors { margin: 0; }

/* Formularios (contrato compartido: [aria-invalid], .errorlist, .required-mark,
   .helptext/.field-help y .form-error-summary con enlaces a los campos) */
/* Anchos de formulario según el contenido (no por pantalla): .form-card (40rem) con un
   campo por fila; .form-card-wide (56rem) con .form-grid a dos columnas o un mensaje
   largo; .form-card-sections (72rem) para fichas por secciones (comunero,
   configuración). Siempre alineado a la izquierda, en la columna de su cabecera; una
   página de formulario con más bloques debajo los mete en .page-column (72rem). */
.form-card { width: min(100%, 40rem); margin: 0; }
.form-card.form-card-wide { width: min(100%, 56rem); }
.form-card.form-card-sections { width: min(100%, 72rem); }
.page-column { max-width: 72rem; }
.form-card > h1, .form-card > .page-heading h1 { margin-bottom: .75rem; }
.form-card > p:not(.eyebrow, .form-required-note) { color: var(--sc-muted); }
.form-card form > div, form > .field { margin-bottom: 1rem; }
.form-required-note { margin: 0 0 1rem; color: var(--sc-ink-soft); font-size: var(--sc-text-sm); }
.form-required-note span, .required-mark { color: var(--sc-danger); font-weight: var(--sc-weight-bold); }
.required-mark::before { content: " "; }
:is(.field, .auth-field, form > div, .form-grid > div, .form-section > div):has(> :is(input, select, textarea):is([required], [aria-required="true"]):not([type="checkbox"], [type="radio"], [type="hidden"])) > label:not(:has(.required-mark), .auth-card label)::after,
fieldset.field:has(input[type="radio"][required]) > legend:not(:has(.required-mark))::after {
  content: " *";
  content: " *" / "";
  color: var(--sc-danger);
  font-weight: var(--sc-weight-bold);
}
label { display: block; margin-bottom: .35rem; color: var(--sc-ink-soft); font-size: var(--sc-text-md); font-weight: var(--sc-weight-semibold); }
:where(input:not([type="checkbox"], [type="radio"], [type="range"], [type="color"], [type="hidden"]), select, textarea) {
  width: 100%;
  max-width: 100%;
  min-height: var(--sc-control-h);
  padding: .55rem .75rem;
  border: 1px solid var(--sc-control-line);
  border-radius: var(--sc-radius-sm);
  background-color: var(--sc-paper);
  color: var(--sc-ink);
  font: inherit;
  box-shadow: inset 0 1px 1px rgb(24 24 27 / 3%);
  transition: border-color .15s ease, box-shadow .15s ease;
}
:where(input:not([type="checkbox"], [type="radio"], [type="range"], [type="color"], [type="hidden"]), select, textarea):hover { border-color: var(--sc-control-line-hover); }
:where(input:not([type="checkbox"], [type="radio"], [type="range"], [type="color"], [type="hidden"]), select, textarea):focus { border-color: var(--sc-brand-deep); }
:where(input:not([type="checkbox"], [type="radio"]), select, textarea):focus-visible { outline-offset: 1px; }
/* La fecha nativa medía 46 px junto a desplegables de 44: misma altura de control (GKU-04). */
:where(input[type="date"], input[type="time"]) { height: var(--sc-control-h); }
:where(select:not([multiple], [size])) {
  padding-right: 2.5rem;
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%233f3f46' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='m3.5 6 4.5 4.5L12.5 6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right .75rem center;
  background-size: 1rem 1rem;
  text-overflow: ellipsis;
  cursor: pointer;
}
:where(textarea) { min-height: 6.5rem; resize: vertical; }
:where(select[multiple]) { min-height: 8rem; }
:where(input[type="checkbox"], input[type="radio"]) { width: 1.25rem; height: 1.25rem; flex: 0 0 auto; margin: 0; accent-color: var(--sc-brand-dark); vertical-align: middle; cursor: pointer; }
:where(input[type="file"]) { padding: .45rem; }
:where(input, select, textarea):disabled { background-color: var(--sc-surface-strong); color: var(--sc-muted); cursor: not-allowed; }
:where(input, select, textarea)[aria-invalid="true"] { border-color: var(--sc-danger); background-color: var(--sc-danger-bg); box-shadow: inset 0 0 0 1px var(--sc-danger); }
:where(input, select, textarea)[aria-invalid="true"]:focus-visible { outline-color: var(--sc-danger); }
.helptext, .field-help { display: block; margin: .3rem 0 .35rem; color: var(--sc-muted); font-size: var(--sc-text-sm); }
.form-errors, .field-error, .errorlist.nonfield {
  margin: 0 0 1rem;
  padding: .75rem 1rem;
  border: 1px solid var(--sc-danger-line);
  border-left: 4px solid var(--sc-danger);
  border-radius: var(--sc-radius-md);
  background: var(--sc-danger-bg);
  color: var(--sc-danger-ink);
}
.form-errors .errorlist, .field-error .errorlist { margin: 0; padding: 0; border: 0; background: none; color: inherit; }
.errorlist { margin: .4rem 0 0; padding: 0; list-style: none; color: var(--sc-danger); font-size: var(--sc-text-sm); font-weight: var(--sc-weight-semibold); }
.errorlist li { display: flex; align-items: flex-start; gap: .45rem; }
.errorlist li + li { margin-top: .2rem; }
.errorlist li::before { content: "!"; content: "!" / ""; width: 1.15rem; height: 1.15rem; flex: 0 0 auto; margin-top: .1rem; display: inline-grid; place-items: center; border-radius: 50%; background: var(--sc-danger); color: var(--sc-paper); font-size: var(--sc-text-xs); font-weight: var(--sc-weight-bold); line-height: 1; }
.form-error-summary { margin: 0 0 1.25rem; padding: 1rem 1.15rem; border: 2px solid var(--sc-danger); border-radius: var(--sc-radius-md); background: var(--sc-paper); color: var(--sc-ink); box-shadow: var(--sc-shadow-sm); }
.form-error-summary:focus { outline: 3px solid var(--sc-focus); outline-offset: 2px; }
.form-error-summary h2 { margin: 0 0 .5rem; color: var(--sc-danger); font-size: var(--sc-text-lg); }
.form-error-summary ul { margin: 0; padding-left: 1.2rem; }
.form-error-summary li + li { margin-top: .25rem; }
.form-error-summary a { color: var(--sc-danger); font-weight: var(--sc-weight-semibold); }
.form-error-summary a:hover { color: var(--sc-danger-strong); }
/* Un dato ya corregido se tacha en el resumen; corregidos todos, el resumen pasa a
   confirmación (app.js, OF-12). */
.form-error-summary li.is-resolved { color: var(--sc-muted); text-decoration: line-through; }
.form-error-summary li.is-resolved a { color: inherit; }
.form-error-summary.is-resolved { border-color: var(--sc-success); background: var(--sc-success-bg); color: var(--sc-ink); }
.form-error-summary.is-resolved h2 { color: var(--sc-ink); }
form > div:has(> input[type="checkbox"]):has(> label) { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .6rem; }
form > div:has(> input[type="checkbox"]):has(> label) > input[type="checkbox"] { order: -1; }
form > div:has(> input[type="checkbox"]):has(> label) > label { margin: 0; }
form > div:has(> input[type="checkbox"]):has(> label) > :is(.helptext, .errorlist) { flex: 1 0 100%; order: 2; }
.form-section, .settings-layout { display: grid; gap: 1.25rem; }
.form-section { padding: var(--sc-card-pad); border: 1px solid var(--sc-line); border-radius: var(--sc-radius-md); background: var(--sc-surface); box-shadow: none; }
/* Una sección dentro de otra (la finca dentro del alta, las secciones del editor de una
   finca) no vuelve a ser tarjeta: una raya superior la separa y sus campos ocupan todo el
   ancho de la sección que la contiene. */
:is(.form-section, .member-plot-editor) .form-section { padding: 1.25rem 0 0; border: 0; border-top: 1px solid var(--sc-line); border-radius: 0; background: transparent; }
.form-section-heading p:last-child { margin: .4rem 0 0; color: var(--sc-muted); }
/* Rejilla de formulario a dos columnas: cada campo es un subgrid de filas compartidas
   (etiqueta, control y, debajo, cada pieza en su propia fila: buscador, ayuda, vista previa
   «= 1 h», enlace secundario, errores) para que los controles de una misma fila empiecen a
   la misma altura aunque una etiqueta ocupe dos líneas (p. ej. en inglés). Un subgrid no
   crea filas: una pieza de más se montaba sobre la anterior («Crear una persona nueva»
   sobre la ayuda, el error sobre la ayuda), así que hay ocho filas, de sobra para el campo
   más largo (siete piezas); las vacías miden cero. Todos los hijos ocupan las mismas
   ocho, o la colocación automática desalinearía las columnas. */
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 1rem; }
.form-grid > * { grid-row: span 8; margin-bottom: 1rem; }
.form-grid > .field:not(fieldset, .field-check) { display: grid; grid-template-rows: subgrid; align-content: start; row-gap: 0; }
.form-grid > .field:not(fieldset, .field-check) > label { align-self: end; }
.field { min-width: 0; }
.field-wide { grid-column: 1 / -1; }
/* Empieza fila en la primera columna aunque falte un campo antes (p. ej. «Finca» oculta en
   un turno sin finca): «Día» junto a «Desde» y «Día de fin» junto a «Hasta». */
.field-row-start { grid-column: 1; }
/* La unidad tiene un ancho mínimo común: importes equivalentes («€», «€/h») con cajas iguales. */
.amount-field-control { display: grid; grid-template-columns: minmax(0, 1fr) minmax(2.25rem, max-content); align-items: center; gap: .6rem; }
.amount-field-control > span { color: var(--sc-muted); font-size: var(--sc-text-md); font-weight: var(--sc-weight-semibold); white-space: nowrap; }
.field-checkbox { display: flex; align-items: center; gap: .6rem; }
.field-checkbox label { margin: 0; }
.check-row, .checkbox-row { min-height: var(--sc-tap); display: flex; align-items: flex-start; gap: .75rem; margin: 0; cursor: pointer; }
.check-row > input, .checkbox-row > input { margin-top: .2rem; }
.check-row span, .checkbox-row span { display: grid; }
/* La ayuda bajo la casilla es contenido: peso normal aunque la etiqueta vaya en seminegrita. */
.check-row small, .checkbox-row small { font-weight: var(--sc-weight-regular); }
/* Confirmación con consecuencias (finalizar un acta, confirmar la identidad de facturación):
   la misma forma que .notice-warning, con su filete de 4 px (OX-07). */
.confirmation-card { padding: 1rem; border: 1px solid var(--sc-warning-line); border-left: 4px solid var(--sc-warning-accent); border-radius: var(--sc-radius-md); background: var(--sc-warning-bg); }
.form-actions { justify-content: flex-end; }
/* Guardar en formularios largos (un solo patrón): tras el primer cambio, la fila
   .form-actions del propio formulario (Cancelar + guardar) se queda fija al pie de la
   pantalla dentro del ancho del formulario (app.js pone .is-sticky); el campo con foco
   se desplaza por encima de ella. */
.form-actions.is-sticky { position: sticky; z-index: 5; bottom: max(.75rem, env(safe-area-inset-bottom)); padding: .75rem; border: 1px solid var(--sc-line); border-radius: var(--sc-card-radius); background: color-mix(in srgb, var(--sc-paper) 94%, transparent); box-shadow: var(--sc-shadow-md); backdrop-filter: blur(12px); }
html.has-sticky-form-actions { scroll-padding-bottom: 6rem; }
.clock-select { display: inline-grid; grid-template-columns: minmax(5rem, 1fr) auto minmax(5rem, 1fr); align-items: center; gap: .35rem; max-width: 100%; }
.clock-select .clock-part { min-width: 5rem; padding-right: 2.1rem; background-position: right .6rem center; }
.clock-separator { color: var(--sc-muted); font-weight: var(--sc-weight-bold); }
/* Zona de peligro (contrato único, platform/danger_zone.html): al pie de la ficha o de
   su tarjeta, tras una raya y lejos de la acción principal: título, frase con la
   consecuencia y un solo botón de peligro. Reactivar no es peligro: va fuera. */
.danger-zone { margin-top: var(--sc-section-gap); padding-top: 1.25rem; border-top: 1px solid var(--sc-line); }
.danger-zone > :is(h2, h3) { margin: 0 0 .35rem; }
.danger-zone > p { max-width: var(--sc-reading); margin: 0 0 .85rem; color: var(--sc-muted); }
.danger-zone > form { margin: 0; }
:is(.card, .surface-card) .danger-zone { margin-top: 1.5rem; }
:is(.card, .surface-card) .danger-zone > :is(h2, h3) { font-size: var(--sc-text-lg); }
.is-contextual { display: none; }
[hidden] { display: none !important; }
.help-tip { width: 2.25rem; min-height: 2.25rem; padding: 0; border: 1px solid var(--sc-control-line); border-radius: 50%; background: var(--sc-paper); color: var(--sc-ink-soft); box-shadow: none; font-size: var(--sc-text-sm); font-weight: var(--sc-weight-bold); }
.help-tip:hover { border-color: var(--sc-control-line-hover); background: var(--sc-surface-strong); color: var(--sc-ink); box-shadow: none; }
.help-tip-text { position: absolute; z-index: 20; top: calc(100% + .4rem); right: 0; width: min(18rem, calc(100vw - 2rem)); padding: .7rem .85rem; border: 1px solid var(--sc-line); border-radius: var(--sc-radius-sm); background: var(--sc-ink); color: var(--sc-paper); font-size: var(--sc-text-sm); box-shadow: var(--sc-shadow-md); }
.help-tip-wrap { position: relative; display: inline-flex; }
/* Ficha agregada de comuneros */
.contextual-fields { margin-top: 1rem; padding-top: 1rem; border-top: 1px dashed var(--sc-line-strong); }
.member-first-plot > [data-context-fields="first-plot"] { margin-top: 1.25rem; display: grid; gap: 1rem; }
.derived-fields-note { padding: .85rem 1rem; display: grid; gap: .25rem; border: 1px solid var(--sc-info-line); border-left: 4px solid var(--sc-water); border-radius: var(--sc-radius-md); background: var(--sc-info-bg); color: var(--sc-ink-soft); }
.derived-fields-note strong { color: var(--sc-ink); }
.member-plot-list, .member-plots-section { display: grid; gap: 1rem; }
.member-plot-editor, .member-plot-card { overflow: hidden; border: 1px solid var(--sc-line); border-radius: var(--sc-card-radius); background: var(--sc-paper); box-shadow: var(--sc-card-shadow); }
.member-plot-editor > header, .member-plot-card > header { padding: 1.15rem 1.25rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; border-bottom: 1px solid var(--sc-line); background: linear-gradient(135deg, var(--sc-paper), var(--sc-brand-tint)); }
.member-plot-editor > header h3, .member-plot-card > header h3 { margin: 0; }
.member-plot-editor > form { padding: 1.25rem; display: grid; gap: 1rem; }
/* Secciones de un formulario en tarjeta: separadas entre sí (sin bordes pegados). */
.form-card > .form-section:not(:last-child), .form-card form > .form-section:not(:last-child) { margin-bottom: 1rem; }
/* Estructura de formularios (fase 3b). El título de una tarjeta no suma su margen al
   relleno (aunque le precedan los campos ocultos del CSRF); una tarjeta incluida dentro
   de una sección ocupa su ancho en vez del de página; los títulos de las secciones
   anidadas (h3/h4) se ven por debajo del título que las contiene; y un alta plegable
   (<details class="form-disclosure">) se abre con un control con aspecto de botón. */
.form-card > :is(h1, h2, h3):first-child, .form-card > input[type="hidden"] + :is(h2, h3) { margin-top: 0; }
.form-card.form-card-embedded { width: 100%; margin: 0; box-shadow: var(--sc-shadow-sm); }
.form-section-heading :is(h2, h3, h4) { margin: 0; }
.form-disclosure > summary { width: fit-content; max-width: 100%; min-height: var(--sc-tap); padding: .55rem 1rem; display: flex; align-items: center; gap: .6rem; border: 1px solid var(--sc-control-line); border-radius: var(--sc-radius-sm); background: var(--sc-paper); color: var(--sc-ink); font-weight: var(--sc-weight-semibold); line-height: 1.2; list-style: none; box-shadow: var(--sc-shadow-sm); }
.form-disclosure > summary::-webkit-details-marker { display: none; }
.form-disclosure > summary:hover { border-color: var(--sc-control-line-hover); background: var(--sc-surface-strong); }
.form-disclosure[open] > summary { margin-bottom: 1.25rem; }
/* Flecha de los desplegables (<summary>): un solo dibujo en toda la aplicación. */
:is(.form-disclosure, .help-index-panel, .bulk-selection-detail, .member-column-picker) > summary::after { content: ""; width: .5rem; height: .5rem; flex: 0 0 auto; margin: -.2rem .25rem 0 .15rem; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform .15s ease; }
:is(.form-disclosure, .help-index-panel, .bulk-selection-detail, .member-column-picker)[open] > summary::after { margin-top: .25rem; transform: rotate(-135deg); }
.bulk-selection-detail > summary::after { margin-left: auto; }
/* Control segmentado de navegación (la opción actual con aria-current y el trazo de
   selección común), con el aspecto de la subnavegación de Horario: para elegir una
   vista o un modo sin que parezca una acción principal (envío colectivo de Cuotas). */
.segmented-nav { width: fit-content; max-width: 100%; margin: 0 0 1.25rem; padding: .2rem; display: flex; flex-wrap: wrap; gap: .2rem; border: 1px solid var(--sc-line); border-radius: var(--sc-radius-md); background: var(--sc-surface); }
.segmented-nav :is(a, button) { min-height: var(--sc-tap); padding: .45rem .95rem; display: inline-flex; align-items: center; justify-content: center; border: 1px solid transparent; border-radius: var(--sc-radius-sm); background: transparent; color: var(--sc-ink-soft); font-size: var(--sc-text-md); font-weight: var(--sc-weight-regular); line-height: 1.2; text-align: center; text-decoration: none; box-shadow: none; }
.segmented-nav :is(a, button):hover { border-color: var(--sc-line-strong); background: var(--sc-paper); color: var(--sc-ink); box-shadow: none; }
.segmented-nav :is(a[aria-current="page"], button[aria-pressed="true"]), .weekly-calendar .fc-button-primary:not(:disabled).fc-button-active { border-color: var(--sc-brand-deep); background: var(--sc-brand-soft); color: var(--sc-brand-deep); box-shadow: inset 0 0 0 1px var(--sc-brand-deep); font-weight: var(--sc-weight-semibold); }
/* Ejercicios y tarifas: el estado («Emitido y bloqueado») va junto al año (CLD-22). */
.policy-summary > :first-child .badge { margin-top: .35rem; }
/* Resumen de turnos de una finca en la ficha: el mismo aire que en «Editar comunero». */
.member-schedule-summary { display: grid; gap: .75rem; }
.member-schedule-summary > .button, .derived-domain-section > .button { justify-self: start; }
.profile-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.profile-data-grid { padding: 1.25rem; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
.profile-data-grid > section { min-width: 0; padding-right: 1.25rem; border-right: 1px solid var(--sc-line); }
.profile-data-grid > section:last-child { padding-right: 0; border-right: 0; }
.profile-data-grid h4, .member-schedule-summary h4 { margin: 0 0 1rem; font-size: var(--sc-text-base); }
.member-schedule-summary { padding: 0 1.25rem 1.25rem; }
.member-schedule-summary .compact-heading { margin-top: 0; }
.empty-inline { margin: 0; padding: .85rem 1rem; border: 1px dashed var(--sc-line-strong); border-radius: var(--sc-radius-md); background: var(--sc-surface); color: var(--sc-muted); }
.empty-inline > strong { display: block; color: var(--sc-ink); }
/* La acción va en su propia línea, separada del texto (OB-16: «…autorización.Adjuntar archivo»). */
.empty-inline > .button { width: fit-content; margin-top: .75rem; display: flex; }

/* Directorio de comuneros, fincas y turnos */
/* Una sola pista que no crece con el contenido: ni la tabla ni sus fichas apiladas
   pueden ensanchar la barra ni el documento. */
.member-directory-view { display: grid; grid-template-columns: minmax(0, 1fr); gap: .75rem; }
.member-directory-toolbar { position: relative; z-index: 3; display: flex; align-items: center; justify-content: flex-end; gap: .55rem; }
.member-directory-toolbar .table-count { margin: 0 auto 0 0; }
.member-directory-toolbar .segmented-nav { margin: 0; }
.member-column-picker { position: relative; }
.member-column-picker > summary { min-height: var(--sc-control-h); list-style: none; }
.member-column-picker > summary::-webkit-details-marker { display: none; }
.member-column-picker fieldset { position: absolute; z-index: 5; top: calc(100% + .45rem); right: 0; left: auto; width: min(19rem, calc(100vw - 2rem)); max-height: min(70vh, 34rem); padding: .8rem; display: grid; gap: .2rem; overflow-y: auto; overscroll-behavior: contain; border: 1px solid var(--sc-line); border-radius: var(--sc-radius-md); background: var(--sc-paper); box-shadow: var(--sc-shadow-md); }
.member-column-picker legend { margin: 0 0 .35rem; color: var(--sc-ink-soft); font-size: var(--sc-text-sm); font-weight: var(--sc-weight-semibold); }
.member-column-option { display: flex; align-items: center; gap: .35rem; border-radius: .35rem; }
.member-column-option:hover { background: var(--sc-surface); }
.member-column-picker label { min-width: 0; min-height: 2.5rem; margin: 0; padding: .35rem .4rem; display: flex; flex: 1 1 auto; align-items: center; gap: .55rem; color: var(--sc-ink-soft); font-size: var(--sc-text-sm); font-weight: var(--sc-weight-regular); cursor: pointer; }
.member-column-order { padding-right: .25rem; display: inline-flex; gap: .15rem; }
.member-column-order button { width: 2.25rem; min-height: 2.25rem; padding: 0; border-color: transparent; background: transparent; color: var(--sc-ink-soft); box-shadow: none; font-size: var(--sc-text-base); }
.member-column-order button:hover { border-color: var(--sc-line); background: var(--sc-paper); color: var(--sc-ink); box-shadow: var(--sc-shadow-sm); }
.member-column-order button:disabled { opacity: .28; cursor: default; }
.member-directory-table-wrap { overflow: auto; }
.member-directory-table { width: max-content; min-width: 100%; }
/* Nombre completo como título de cada ficha en la vista apilada (< 48rem); en
   la tabla ancha ya están las columnas «Apellidos» y «Nombre». */
.member-directory-table .member-stack-title { display: none; }
.member-directory-table th { white-space: nowrap; }
.member-directory-table td { padding-block: .55rem; vertical-align: middle; white-space: nowrap; }
.member-directory-table tbody tr { transition: background-color .15s ease; }
table tbody tr.is-inactive { background: var(--sc-inactive-bg); color: var(--sc-muted); }
table tbody tr.is-inactive:hover { background: var(--sc-inactive-bg-hover); }
.member-directory-card.is-inactive { background: var(--sc-inactive-bg); filter: grayscale(.55); opacity: .82; }
.management-list { margin: 0; padding: 0; display: grid; list-style: none; }
.management-list li { padding: .7rem 0; display: flex; align-items: center; justify-content: space-between; gap: 1rem; border-bottom: 1px solid var(--sc-line); }
.management-list li:last-child { border-bottom: 0; }
.table-sort-link { min-height: 1.75rem; display: inline-flex; align-items: center; gap: .3rem; color: inherit; text-decoration: none; }
.table-sort-link:hover { color: var(--sc-brand-deep); text-decoration: underline; }
.table-sort-link::after { content: "↕"; content: "↕" / ""; color: var(--sc-control-line); font-size: var(--sc-text-xs); }
th[aria-sort="ascending"] .table-sort-link::after { content: "↑"; content: "↑" / ""; color: var(--sc-brand-ink); }
th[aria-sort="descending"] .table-sort-link::after { content: "↓"; content: "↓" / ""; color: var(--sc-brand-ink); }
.member-number-cell { font-variant-numeric: tabular-nums; }
.member-name-cell .badge { margin-left: .4rem; }
.member-phone-cell { font-variant-numeric: tabular-nums; }
/* Un correo largo parte línea en vez de ensanchar la tabla (la columna es opcional). */
.member-directory-table td.member-email-cell { white-space: normal; }
.member-email-value { max-width: 16rem; display: inline-block; overflow-wrap: anywhere; }
/* El 100 % de los enlaces es la caja de contenido de la celda: un nombre largo se
   recorta con elipsis sin invadir el relleno ni la columna siguiente. */
.member-plots-cell { max-width: 12rem; white-space: normal; }
.member-plots-cell > * { width: fit-content; max-width: 100%; min-height: 1.5rem; display: block; overflow: hidden; line-height: 1.5rem; text-overflow: ellipsis; white-space: nowrap; }
.member-plots-cell > * + * { margin-top: .18rem; }
.member-duration-cell { white-space: nowrap; font-variant-numeric: tabular-nums; }
.member-schedule-cell { min-width: 8rem; }
.member-schedule-total { font-variant-numeric: tabular-nums; }
.member-payment-overdue { margin-top: .28rem; display: block; color: var(--sc-danger); font-size: var(--sc-text-xs); font-weight: var(--sc-weight-regular); }
.member-payment-detail { margin-top: .15rem; display: block; color: var(--sc-muted); font-size: var(--sc-text-xs); }
.member-receipts-section > .surface-card { margin-bottom: 1rem; }
.filterable-select-search { margin-bottom: .5rem; }
.member-sources-cell > * { display: inline-block; }
/* Turnos de la columna opcional «Turno»: tantos por línea como quepan en 26rem,
   sin un ancho mínimo que ensanche la tabla cuando el comunero tiene pocos. */
.member-turn-list { max-width: 26rem; display: flex; flex-wrap: wrap; align-items: center; gap: .22rem; }
.member-table-turn { padding: .25rem .45rem; border-left: 3px solid var(--sc-control-line); border-radius: 0 .35rem .35rem 0; background: var(--sc-surface); color: var(--sc-ink-soft); font-size: var(--sc-text-xs); line-height: 1.35; }
.member-table-turn.is-available { border-left-color: var(--sc-available-line); background: var(--sc-available-bg); }
.member-table-turn.is-assigned { border-left-color: var(--sc-assigned-line); background: var(--sc-assigned-bg); }
.member-table-turn.is-received { border-left-color: var(--sc-water); background: var(--sc-info-bg); }
.member-table-turn small { color: var(--sc-muted); font-size: var(--sc-text-xs); }
.member-table-source { margin-right: .22rem; padding: .25rem .45rem; border-radius: .35rem; background: var(--sc-surface-strong); color: var(--sc-ink-soft); font-size: var(--sc-text-xs); }
/* Dato vacío en el módulo de comuneros (filtro or_empty y etiqueta empty_value de
   people_format): un solo «—» atenuado, al tamaño del texto que lo rodea. */
.empty-value { color: var(--sc-muted); }
.member-available-cell { width: 6rem; text-align: center; }
.member-table-actions { white-space: nowrap; }
.member-availability-overview { margin-bottom: 1rem; padding: 1.15rem; border: 1px dashed var(--sc-available-line); border-radius: var(--sc-card-radius); background: linear-gradient(135deg, var(--sc-brand-tint) 0%, var(--sc-available-bg) 100%); box-shadow: var(--sc-card-shadow); }
.member-availability-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.member-availability-heading h2 { margin: 0; font-size: var(--sc-text-heading-card); }
.member-availability-heading p:last-child { margin: .3rem 0 0; color: var(--sc-muted); }
.member-available-grid { margin-top: 1rem; display: grid; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); gap: .7rem; }
.member-available-turn { min-width: 0; padding: .85rem; display: grid; gap: .55rem; border: 1px solid var(--sc-line-strong); border-radius: var(--sc-radius-md); background: rgb(255 255 255 / 88%); }
.member-available-turn > div { min-width: 0; display: grid; }
.member-available-turn span, .member-available-turn p { color: var(--sc-muted); font-size: var(--sc-text-sm); }
.member-available-turn p { margin: 0; padding-top: .45rem; border-top: 1px solid var(--sc-line); }
.member-available-turn > a { width: fit-content; min-height: var(--sc-tap); display: inline-flex; align-items: center; }
.member-directory-list { display: grid; gap: 1rem; }
.member-directory-card { overflow: hidden; border: 1px solid var(--sc-line); border-radius: var(--sc-card-radius); background: var(--sc-paper); box-shadow: var(--sc-card-shadow); }
.member-directory-card-heading { padding: 1rem 1.15rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; border-bottom: 1px solid var(--sc-line); background: linear-gradient(135deg, var(--sc-paper) 0%, var(--sc-brand-tint) 100%); }
.member-directory-person { min-width: 0; }
.member-directory-title-row { display: flex; align-items: center; flex-wrap: wrap; gap: .6rem; }
.member-directory-title-row h2 { margin: 0; overflow-wrap: anywhere; }
.member-directory-person > p { margin: .25rem 0 0; color: var(--sc-muted); font-size: var(--sc-text-sm); overflow-wrap: anywhere; }
.member-directory-actions { display: flex; flex: 0 0 auto; gap: .5rem; }
.member-directory-stats { padding: .75rem 1.15rem; display: grid; grid-template-columns: repeat(auto-fit, minmax(7rem, 1fr)); gap: .55rem; border-bottom: 1px solid var(--sc-line); background: var(--sc-surface); }
.member-directory-stats > div { min-width: 0; padding: .5rem .65rem; display: grid; border-radius: var(--sc-radius-sm); background: var(--sc-paper); }
.member-directory-stats > div.is-available { border: 1px dashed var(--sc-available-line); background: var(--sc-available-bg); }
.member-directory-stats > div.is-overdue { border: 1px solid var(--sc-danger-line); background: var(--sc-danger-bg); }
.member-directory-stats > div > span:first-child { color: var(--sc-muted); font-size: var(--sc-text-xs); font-weight: var(--sc-weight-semibold); }
/* La cuota del año es la misma insignia que en la Lista. */
.member-directory-stats > div > .badge { margin-top: .15rem; justify-self: start; }
.member-directory-stats strong { margin-top: .08rem; font-size: var(--sc-text-md); font-variant-numeric: tabular-nums; }
.member-directory-stats small { margin-top: .15rem; color: var(--sc-danger); font-size: var(--sc-text-xs); font-weight: var(--sc-weight-semibold); }
.member-directory-plots { display: grid; }
.member-directory-plot { min-width: 0; padding: .9rem 1.15rem; display: grid; grid-template-columns: minmax(12rem, .72fr) minmax(22rem, 2fr); align-items: start; gap: 1rem; border-bottom: 1px solid var(--sc-line); }
.member-directory-plot:last-child { border-bottom: 0; }
.member-directory-plot-heading { min-width: 0; display: grid; gap: .55rem; }
.member-directory-plot-heading h3 { margin: 0; overflow-wrap: anywhere; font-size: var(--sc-text-base); }
.member-directory-plot-totals { display: flex; flex-wrap: wrap; gap: .35rem .7rem; color: var(--sc-muted); font-size: var(--sc-text-xs); }
.member-directory-plot-totals strong { color: var(--sc-ink-soft); font-variant-numeric: tabular-nums; }
.member-directory-turns { min-width: 0; display: grid; gap: .4rem; }
.member-directory-turn { min-width: 0; padding: .55rem .65rem; display: grid; grid-template-columns: minmax(9.5rem, 1fr) minmax(8rem, .8fr) minmax(10rem, 1fr); align-items: center; gap: .65rem; border: 1px solid var(--sc-line); border-radius: var(--sc-radius-sm); background: var(--sc-surface); }
.member-directory-turn.is-available { border-color: var(--sc-available-line); border-style: dashed; background: var(--sc-available-bg); }
.member-directory-turn.is-assigned { border-color: var(--sc-assigned-line); background: var(--sc-assigned-bg); }
.member-directory-turn.is-received { border-color: var(--sc-info-line); background: var(--sc-info-bg); }
.member-turn-time, .member-turn-state { min-width: 0; display: grid; }
.member-turn-time strong { font-size: var(--sc-text-sm); font-variant-numeric: tabular-nums; }
.member-turn-time span, .member-turn-state small { color: var(--sc-muted); font-size: var(--sc-text-xs); }
.member-turn-source { min-width: 0; overflow-wrap: anywhere; color: var(--sc-ink-soft); font-size: var(--sc-text-sm); }
.member-turn-state { justify-items: start; gap: .15rem; }
.member-turn-state small { overflow-wrap: anywhere; }
/* Estados de turno: una sola definición en toda la aplicación, sin los colores de
   las fuentes (disponible = discontinuo con trama, como en el calendario; cedido =
   neutro; recibido = azul agua). */
.badge-available { border-color: var(--sc-available-line); border-style: dashed; background: var(--sc-state-hatch), var(--sc-available-bg); color: var(--sc-available-ink); }
.badge-assigned { border-color: var(--sc-assigned-line); background: var(--sc-assigned-bg); color: var(--sc-assigned-ink); }
.badge-received { border-color: var(--sc-info-line); background: var(--sc-info-bg); color: var(--sc-info-ink); }
.member-turn-note { grid-column: 1 / -1; margin: 0; padding-top: .45rem; border-top: 1px dashed var(--sc-line-strong); color: var(--sc-muted); font-size: var(--sc-text-xs); }
.member-directory-plot > .empty-inline { grid-column: 2; }

/* Estados, métricas y acciones de dominio */
.stat-card {
  min-width: 0;
  padding: .9rem 1rem;
  display: grid;
  align-content: start;
  border: 1px solid var(--sc-line);
  border-radius: var(--sc-radius-sm);
  background: var(--sc-surface);
}
.stat-card span { color: var(--sc-muted); font-size: var(--sc-text-xs); font-weight: var(--sc-weight-semibold); }
.stat-card strong { margin-top: .1rem; font-size: var(--sc-text-lg); font-weight: var(--sc-weight-bold); font-variant-numeric: tabular-nums; }
/* Cifras de resumen (un solo componente: Panel, Cuotas, confirmaciones, emisión,
   importación): .stat-card dentro de .preview-summary con la cifra a --sc-text-stat y,
   si procede, el tono del estado (.is-paid cobrado, .is-pending pendiente). */
.preview-summary .stat-card strong { font-size: var(--sc-text-stat); letter-spacing: -.01em; overflow-wrap: anywhere; }
.stat-card small { margin-top: .1rem; color: var(--sc-muted); font-size: var(--sc-text-xs); }
.stat-card.is-paid { border-color: var(--sc-success-line); background: var(--sc-success-bg); }
.stat-card.is-paid strong { color: var(--sc-success); }
.stat-card.is-pending { border-color: var(--sc-warning-line); background: var(--sc-warning-bg); }
.stat-card.is-pending strong { color: var(--sc-warning-ink); }
.preview-summary, .source-usage-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); gap: .75rem; margin: 1rem 0 1.5rem; }
.policy-card h2 { margin: 0; }
.policy-summary { display: grid; grid-template-columns: minmax(7rem, .6fr) repeat(3, minmax(8rem, 1fr)); gap: .75rem; }
.compact-heading { margin-top: 1.5rem; }
.compact-heading h3 { margin: 0; }
/* La primera columna cabe «Emitido y bloqueado» sin cortar (también a 1024 px). */
.policy-summary-fees { grid-template-columns: minmax(9rem, .55fr) repeat(4, minmax(7.5rem, 1fr)); }
:is(.policy-note, .receipt-note) p { margin: .35rem 0 0; }
.billing-concepts { margin-top: 1.5rem; }
.billing-account-preview { margin-top: var(--sc-section-gap); }
.billing-concepts .section-heading { margin-top: 0; }
.billing-concept-list {
  overflow: hidden;
  border: 1px solid var(--sc-line);
  border-radius: var(--sc-radius-md);
  background: var(--sc-paper);
  box-shadow: var(--sc-shadow-sm);
}
.billing-concept-list > div {
  min-height: 3rem;
  padding: .7rem 1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  border-bottom: 1px solid var(--sc-line);
}
.billing-concept-list > div:last-child { border-bottom: 0; }
.billing-concept-list dt { color: var(--sc-ink-soft); font-size: var(--sc-text-sm); letter-spacing: 0; }
.billing-concept-list dd { margin: 0; font-weight: var(--sc-weight-regular); font-variant-numeric: tabular-nums; white-space: nowrap; }
.billing-concept-list .billing-concept-total { background: linear-gradient(135deg, var(--sc-brand-tint), var(--sc-brand-soft)); }
.billing-concept-total dt, .billing-concept-total dd { color: var(--sc-ink); font-size: var(--sc-text-base); font-weight: var(--sc-weight-bold); }
.billing-status-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.delivery-history, .member-receipts-section { margin-top: var(--sc-section-gap); }
.member-payment-history .member-payment-row-overdue { background: var(--sc-danger-bg); }
/* Como .member-directory-view: la pista no crece con la barra ni con las fichas apiladas. */
.billing-bulk-form { display: grid; grid-template-columns: minmax(0, 1fr); gap: .65rem; }
/* Barra de acciones masivas: tres bloques que no se parten (selección, registrar pagos
   con su fecha y forma de pago, enviar recibos); los campos con la etiqueta encima, como
   en los filtros. Cuando no caben en una fila, el bloque entero baja a la siguiente. */
.billing-bulk-toolbar { padding: .8rem 1rem; display: flex; flex-wrap: wrap; align-items: flex-end; gap: .75rem 1.5rem; border: 1px solid var(--sc-line); border-radius: var(--sc-radius-md); background: var(--sc-paper); box-shadow: var(--sc-shadow-sm); }
.billing-bulk-selection { flex: 1 1 auto; min-height: 2.75rem; display: flex; flex-wrap: wrap; align-items: center; gap: .25rem 1rem; }
.billing-bulk-selection > strong { font-size: var(--sc-text-sm); white-space: nowrap; }
.billing-bulk-scope { flex-basis: 100%; color: var(--sc-ink-soft); font-size: var(--sc-text-sm); }
.billing-bulk-group { display: flex; flex-wrap: nowrap; align-items: flex-end; gap: .6rem; }
.billing-bulk-field label { margin-bottom: .25rem; font-size: var(--sc-text-sm); white-space: nowrap; }
.billing-bulk-field input { width: 11rem; }
.billing-bulk-help { flex-basis: 100%; color: var(--sc-muted); }
/* La fecha confirmada en el idioma de la aplicación (F1) cuelga bajo su campo sin mover
   la fila: fecha, forma de pago y botones siguen alineados por abajo y la barra deja
   sitio entre filas. En el móvil (bloques apilados) vuelve a ocupar su línea. */
.billing-bulk-field:has(> .date-echo) { position: relative; }
.billing-bulk-field > .date-echo { position: absolute; top: calc(100% + .2rem); left: 0; margin: 0; white-space: nowrap; }
.billing-bulk-toolbar:has(.date-echo:not(:empty)) { row-gap: 2rem; }
.billing-selection-cell { width: 3rem; text-align: center; }
.billing-selection-cell input { margin: 0 auto; display: block; }
.billing-account-table th { white-space: nowrap; }
/* Recibo: referencia y estado en una línea; la fecha del envío y lo que pasó después, debajo. */
.billing-receipt-cell { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .4rem; }
.billing-receipt-detail { flex-basis: 100%; display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .4rem; }
/* Acciones de la fila: ancho justo para «PDF» y el envío en una línea; el pago, debajo. */
.billing-quick-actions { min-width: 10rem; }
.billing-bulk-toolbar [data-requires-selection]:disabled { cursor: not-allowed; }
/* F4 · Cuotas, actas y Ayuda (revisión cruzada 07/11/2026). Solo clases de estas
   pantallas; los componentes comunes no se redefinen aquí. */
/* Confirmación del envío colectivo: el mensaje que se enviará, en solo lectura. */
.bulk-review-change { margin: .75rem 0 0; }
.bulk-review-change .link-button { padding-inline: 0; }
.bulk-message-preview { max-height: 20rem; margin: 0; padding: .75rem 1rem; overflow-y: auto; font-size: var(--sc-text-sm); }
/* Previsualización de cargos: los conceptos con su nombre completo («Cuota
   extraordinaria general») parten la cabecera en dos líneas; los importes, no. */
.billing-account-preview thead th.number { white-space: normal; }
.publication-panel, .document-finalize {
  margin: 1.25rem 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem;
}
.publication-panel h2, .document-finalize h2 { margin: 0 0 .25rem; }
.publication-panel p, .document-finalize p { margin: 0; color: var(--sc-muted); }
.publication-panel form, .document-finalize form { flex: 0 0 auto; margin: 0; }
.source-swatch { width: .8rem; height: .8rem; display: inline-block; margin-right: .4rem; border: 1px solid rgb(0 0 0 / 18%); border-radius: 50%; background: var(--source-color, var(--sc-water)); vertical-align: .02rem; }

/* Documentos y seguridad */
.document-sheet { min-width: 0; padding: clamp(1.2rem, 4vw, 3rem); overflow-wrap: anywhere; border: 1px solid var(--sc-line); border-radius: var(--sc-card-radius); background: var(--sc-paper); box-shadow: var(--sc-card-shadow); }
.document-sheet-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.document-sheet-heading h2 { margin-top: 0; }
.revision-meta { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; margin: 1rem 0 1.5rem; }
.preserve-lines { white-space: pre-line; overflow-wrap: anywhere; }
.import-preview-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); }
.import-issues-cell .issue:last-child { margin-bottom: 0; }
.file-list { margin: 0; padding: 0; list-style: none; }
.file-list li > * { min-width: 0; overflow-wrap: anywhere; }
.file-list a { overflow-wrap: anywhere; word-break: break-word; }
.file-list li { min-height: 3rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .7rem 0; border-bottom: 1px solid var(--sc-line); }
.security-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.security-card h2 { margin-top: 0; }

/* Auditoría operativa */
.audit-heading { align-items: center; }
.audit-button-count { min-width: 1.5rem; min-height: 1.5rem; display: inline-grid; place-items: center; padding: 0 .3rem; border-radius: 999px; background: var(--sc-danger-bg); color: var(--sc-danger); font-size: var(--sc-text-xs); }
.audit-metrics { margin-bottom: 1rem; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .7rem; }
.audit-metrics article { min-height: 6rem; padding: 1rem; display: flex; flex-direction: column; justify-content: space-between; border: 1px solid var(--sc-line); border-radius: var(--sc-radius-md); background: linear-gradient(145deg, var(--sc-paper), var(--sc-surface)); box-shadow: var(--sc-shadow-sm); }
.audit-metrics article.is-alert { border-color: var(--sc-danger-line); background: linear-gradient(145deg, var(--sc-paper), var(--sc-danger-bg)); }
.audit-metrics span { color: var(--sc-muted); font-size: var(--sc-text-xs); font-weight: var(--sc-weight-semibold); }
.audit-metrics strong { font-size: var(--sc-text-stat); line-height: 1; letter-spacing: -.035em; }
.audit-table { min-width: 76rem; }
.audit-table td { vertical-align: top; }
.audit-row-link { color: var(--sc-ink); font-weight: var(--sc-weight-semibold); white-space: nowrap; }
.audit-action-link { color: var(--sc-ink); text-decoration-color: rgb(169 74 19 / 45%); text-underline-offset: .18em; }
.audit-changes-cell { min-width: 16rem; }
.audit-change-summary { margin: 0; display: grid; gap: .45rem; }
.audit-change-summary > div { display: grid; grid-template-columns: minmax(5.5rem, .6fr) minmax(0, 1.4fr); gap: .65rem; align-items: baseline; }
.audit-change-summary dt { color: var(--sc-muted); font-size: var(--sc-text-xs); font-weight: var(--sc-weight-semibold); }
.audit-change-summary dd { min-width: 0; margin: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: .4rem; align-items: baseline; font-size: var(--sc-text-xs); }
.audit-change-summary dd > span:not(.audit-change-arrow) { min-width: 0; overflow-wrap: anywhere; white-space: pre-wrap; }
.audit-change-arrow { color: var(--sc-brand-ink); font-weight: var(--sc-weight-bold); }
.audit-detail-link { display: inline-block; margin-top: .55rem; font-size: var(--sc-text-xs); font-weight: var(--sc-weight-semibold); }
.audit-system-user, .audit-no-change { color: var(--sc-muted); }
.audit-object-context { margin-top: .3rem; display: grid; gap: .08rem; }
.audit-object-primary { font-size: var(--sc-text-sm); }
.audit-object-context small { color: var(--sc-muted); }
.audit-object-id { max-width: 13rem; display: inline-block; overflow: hidden; text-overflow: ellipsis; vertical-align: bottom; white-space: nowrap; }
.audit-detail-hero { padding: 1.25rem; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 1.1rem; border: 1px solid var(--sc-line); border-radius: var(--sc-card-radius); background: linear-gradient(145deg, var(--sc-paper), var(--sc-brand-tint)); box-shadow: var(--sc-card-shadow); }
.audit-detail-icon { width: 3rem; height: 3rem; display: grid; place-items: center; border: 1px solid var(--sc-brand-line); border-radius: .75rem; background: var(--sc-brand-soft); color: var(--sc-brand-ink); }
.audit-detail-hero dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .85rem 1.25rem; }
.audit-detail-hero dd { margin-bottom: 0; }
.audit-change-table table { min-width: 42rem; }
.audit-change-table th:first-child { width: 22%; }
.audit-change-table td { width: 39%; white-space: pre-wrap; }
.audit-protected-value { color: var(--sc-muted); font-style: italic; }
.audit-metadata-card { padding: 1rem 1.15rem; display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); gap: .85rem 1.25rem; border: 1px solid var(--sc-line); border-radius: var(--sc-card-radius); background: var(--sc-paper); box-shadow: var(--sc-card-shadow); }
.audit-metadata-card dd { margin-bottom: 0; }
.blocked-ip-table table { min-width: 52rem; }
.blocked-ip-table form { margin: 0; }
.blocked-ip-table button { min-height: 2.25rem; padding-block: .42rem; }
.secret-value { padding: .75rem; border-radius: var(--sc-radius-sm); background: var(--sc-surface-strong); overflow-wrap: anywhere; user-select: all; }

/* Autenticación */
.auth-body { min-height: 100vh; display: block; overflow-x: hidden; background: var(--sc-paper); }
.auth-shell { --auth-glow-x: 50%; --auth-glow-y: 38%; --auth-shift-x: 0px; --auth-shift-y: 0px; min-height: 100vh; display: grid; grid-template-columns: minmax(34rem, 1.15fr) minmax(28rem, .85fr); background: var(--sc-paper); }
.auth-brand-panel { position: relative; min-height: 100vh; padding: clamp(1.8rem, 4vw, 4rem); display: flex; flex-direction: column; overflow: hidden; border-right: 1px solid rgb(230 129 47 / 14%); isolation: isolate; background: linear-gradient(145deg, var(--sc-paper) 0%, var(--sc-brand-tint) 60%, var(--sc-auth-warm) 100%); }
.auth-brand-panel::before { content: ""; position: absolute; inset: 0; opacity: .25; pointer-events: none; background-image: radial-gradient(circle, rgb(24 24 27 / 18%) .7px, transparent .8px); background-size: 20px 20px; mask-image: linear-gradient(145deg, black, transparent 72%); }
.auth-brand-panel::after { content: ""; position: absolute; width: 32rem; height: 32rem; right: -15rem; bottom: -17rem; border: 1px solid rgb(230 129 47 / 18%); border-radius: 50%; box-shadow: 0 0 0 5rem rgb(230 129 47 / 3%), 0 0 0 10rem rgb(25 155 136 / 2%); }
.auth-brand-panel > * { position: relative; z-index: 1; }
.auth-brand-ambient { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.auth-brand-ambient span { position: absolute; border-radius: 50%; filter: blur(1px); animation: auth-orbit-drift 14s ease-in-out infinite alternate; }
.auth-brand-ambient span:nth-child(1) { width: 14rem; height: 14rem; top: 20%; left: -8rem; border: 1px solid rgb(230 129 47 / 18%); }
.auth-brand-ambient span:nth-child(2) { width: 9rem; height: 9rem; top: 56%; right: 6%; border: 1px solid rgb(25 155 136 / 13%); animation-delay: -5s; }
.auth-brand-ambient span:nth-child(3) { width: .55rem; height: .55rem; top: 18%; right: 16%; background: var(--sc-source-vi); box-shadow: 0 0 0 .55rem rgb(114 216 199 / 12%), 0 0 2.5rem rgb(25 155 136 / 28%); animation-delay: -9s; }
.auth-brand-lockup { width: min(18rem, 100%); min-height: 4.75rem; display: flex; align-items: center; }
.auth-wordmark-frame { width: min(18rem, 100%); height: 4.75rem; min-width: 0; display: block; overflow: hidden; background: transparent; text-decoration: none; }
.auth-wordmark-frame img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center; }
.auth-community-identity { position: relative; width: min(36rem, 100%); min-height: clamp(17rem, 31vh, 20rem); margin: clamp(.8rem, 2vh, 1.5rem) auto 0; }
.auth-water-map { position: absolute; inset: 2.6rem 0 0; width: 100%; height: calc(100% - 2.6rem); overflow: visible; }
.auth-water-route { fill: none; stroke-width: 1.5; stroke-linecap: round; stroke-dasharray: 2 5; vector-effect: non-scaling-stroke; animation: auth-water-flow 5s linear infinite; }
.auth-water-route-al { stroke: var(--sc-source-al-line); }
.auth-water-route-vi { stroke: var(--sc-source-vi-line); animation-duration: 6s; }
.auth-water-route-out { stroke: rgb(113 113 122 / 28%); stroke-dasharray: 1 6; animation-duration: 7s; }
.auth-water-node { stroke: var(--sc-paper); stroke-width: 2; vector-effect: non-scaling-stroke; }
.auth-water-node-al { fill: var(--sc-source-al-line); }
.auth-water-node-vi { fill: var(--sc-source-vi-line); }
.auth-water-node-center { fill: var(--sc-paper); stroke: var(--sc-brand); animation: auth-beacon 2.8s ease-out infinite; }
.auth-community-logo-frame { position: absolute; left: 50%; top: 54%; width: clamp(8.8rem, 12vw, 10.75rem); aspect-ratio: 1; padding: .7rem; border: 1px solid rgb(230 129 47 / 28%); border-radius: 50%; background: rgb(255 255 255 / 94%); box-shadow: 0 28px 65px rgb(230 129 47 / 17%), 0 8px 24px rgb(24 24 27 / 8%), inset 0 1px 0 var(--sc-paper); display: grid; place-items: center; transform: translate3d(calc(-50% + var(--auth-shift-x)), calc(-50% + var(--auth-shift-y)), 0); transition: transform .35s cubic-bezier(.2,.8,.2,1); }
.auth-community-logo-frame::before, .auth-community-logo-frame::after { content: ""; position: absolute; border-radius: 50%; pointer-events: none; }
.auth-community-logo-frame::before { inset: -1rem; border: 1px solid rgb(230 129 47 / 24%); animation: auth-ring-pulse 4s ease-out infinite; }
.auth-community-logo-frame::after { inset: -2.15rem; border: 1px solid rgb(25 155 136 / 14%); animation: auth-ring-pulse 4s 1.4s ease-out infinite; }
.community-brand-logo-auth { width: 100%; height: 100%; }
.auth-community-icon { width: 46%; height: 46%; color: var(--sc-brand-ink); stroke-width: 1.5; }
.auth-community-identity-copy { position: absolute; inset: 0 0 auto; z-index: 3; min-width: 0; text-align: center; }
.auth-community-identity-copy .eyebrow { margin-bottom: .2rem; }
.auth-community-identity-copy > p:last-child { margin: 0; color: var(--sc-ink-soft); font-size: var(--sc-text-sm); font-weight: var(--sc-weight-semibold); letter-spacing: .01em; }
.auth-brand-message { max-width: 36rem; margin: clamp(.5rem, 1vh, 1rem) auto 1.5rem; text-align: center; }
.auth-brand-message h2 { margin: 0 0 .85rem; font-size: var(--sc-text-display); line-height: 1.01; letter-spacing: -.055em; }
.auth-brand-message > p:last-child { max-width: 30rem; margin: 0; color: var(--sc-muted); font-size: var(--sc-text-lead); }
.auth-brand-message > p:last-child { margin-inline: auto; }
.auth-trust-list { max-width: 38rem; margin: 0 auto auto; padding: 0; display: flex; justify-content: center; flex-wrap: wrap; gap: .45rem 1rem; list-style: none; }
.auth-trust-list li { display: flex; align-items: center; gap: .45rem; color: var(--sc-ink-soft); font-size: var(--sc-text-xs); }
.auth-trust-list .icon { width: 1rem; height: 1rem; padding: .1rem; border-radius: 50%; background: var(--sc-brand-soft); color: var(--sc-brand-ink); }
.auth-brand-footnote { margin: 1.5rem 0 0; color: var(--sc-muted); font-size: var(--sc-text-xs); text-align: center; }
.auth-access-panel { position: relative; min-width: 0; min-height: 100vh; display: grid; grid-template-rows: auto auto 1fr auto; overflow: hidden; isolation: isolate; background: linear-gradient(150deg, var(--sc-paper) 0%, var(--sc-paper) 62%, var(--sc-auth-cool) 100%); }
.auth-access-panel::before { content: ""; position: absolute; inset: 0; z-index: -2; pointer-events: none; background: radial-gradient(circle at var(--auth-glow-x) var(--auth-glow-y), rgb(230 129 47 / 11%), transparent 17rem); }
.auth-access-panel::after { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .24; pointer-events: none; background-image: linear-gradient(rgb(24 24 27 / 5%) 1px, transparent 1px), linear-gradient(90deg, rgb(24 24 27 / 5%) 1px, transparent 1px); background-size: 42px 42px; mask-image: radial-gradient(circle at 70% 34%, black, transparent 66%); }
.auth-access-ambient { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.auth-access-orbit { position: absolute; display: block; border-radius: 50%; animation: auth-orbit-drift 12s ease-in-out infinite alternate; }
.auth-access-orbit-one { width: 22rem; height: 22rem; top: 12%; right: -14rem; border: 1px solid rgb(25 155 136 / 14%); box-shadow: 0 0 0 4rem rgb(25 155 136 / 2%); }
.auth-access-orbit-two { width: 13rem; height: 13rem; left: -7rem; bottom: 10%; border: 1px solid rgb(230 129 47 / 13%); animation-delay: -4s; }
.auth-access-beacon { position: absolute; width: .55rem; height: .55rem; right: 13%; bottom: 20%; border-radius: 50%; background: var(--sc-source-vi-line); box-shadow: 0 0 0 .65rem rgb(25 155 136 / 9%), 0 0 2rem rgb(25 155 136 / 22%); animation: auth-beacon 3s ease-out infinite; }
.auth-language-switcher { position: relative; z-index: 2; justify-self: end; margin: 1rem 1.25rem 0; }
.auth-mobile-brand { display: none; }
.auth-mobile-community { position: relative; min-height: 9.5rem; margin-top: .25rem; padding: .75rem 1rem; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 1.2rem; overflow: hidden; }
.auth-mobile-community::before { content: ""; position: absolute; width: 10rem; height: 10rem; left: -3rem; top: -.5rem; border: 1px solid rgb(230 129 47 / 18%); border-radius: 50%; box-shadow: 0 0 0 2rem rgb(230 129 47 / 3%); }
/* La raya decorativa del móvil cruzaba el nombre de la comunidad cuando ocupa dos líneas (OF-11). */
.auth-mobile-water-line { display: none; }
.auth-mobile-community-logo-frame { position: relative; width: clamp(6rem, 20vw, 7.5rem); aspect-ratio: 1; padding: .4rem; border: 1px solid rgb(230 129 47 / 24%); border-radius: 50%; background: rgb(255 255 255 / 92%); box-shadow: 0 18px 38px rgb(230 129 47 / 13%); display: grid; place-items: center; }
.auth-mobile-community-logo-frame::after { content: ""; position: absolute; inset: -.65rem; border: 1px solid rgb(25 155 136 / 15%); border-radius: 50%; animation: auth-ring-pulse 4s ease-out infinite; }
.community-brand-logo-mobile { width: 100%; height: 100%; }
.auth-mobile-community-copy { position: relative; min-width: 0; }
.auth-mobile-community-copy p { margin: 0 0 .35rem; color: var(--sc-ink); font-size: var(--sc-text-base); font-weight: var(--sc-weight-bold); line-height: 1.16; letter-spacing: -.025em; }
.auth-mobile-community-copy span { color: var(--sc-ink-soft); font-size: var(--sc-text-sm); font-weight: var(--sc-weight-semibold); line-height: 1.3; }
.auth-main { position: relative; z-index: 1; width: min(100%, 33rem); margin: auto; padding: 3rem 2rem; }
.auth-card { position: relative; padding: clamp(2rem, 5vw, 3rem); border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.auth-card::before, .auth-card::after { content: ""; position: absolute; width: 5rem; height: 5rem; pointer-events: none; }
.auth-card::before { left: 0; top: 0; border-top: 1px solid rgb(230 129 47 / 48%); border-left: 1px solid rgb(230 129 47 / 48%); }
.auth-card::after { right: 0; bottom: 0; border-right: 1px solid rgb(25 155 136 / 34%); border-bottom: 1px solid rgb(25 155 136 / 34%); }
.auth-panel-status { width: fit-content; min-height: 1.8rem; display: inline-flex; align-items: center; gap: .5rem; margin-bottom: 1.4rem; padding: .25rem .62rem; border: 1px solid rgb(25 155 136 / 18%); border-radius: 999px; background: rgb(241 252 249 / 72%); color: var(--sc-auth-status-ink); font-size: var(--sc-text-xs); font-weight: var(--sc-weight-semibold); letter-spacing: .01em; }
.auth-panel-status span { width: .45rem; height: .45rem; border-radius: 50%; background: var(--sc-source-vi-line); box-shadow: 0 0 0 .25rem rgb(25 155 136 / 11%); animation: auth-status-pulse 2.4s ease-in-out infinite; }
.auth-card h1 { margin: 0; font-size: var(--sc-text-heading-auth); letter-spacing: -.045em; }
.auth-community { max-width: 27rem; margin: .8rem 0 2rem; color: var(--sc-muted); line-height: 1.45; }
.auth-card form > div, .auth-field { margin-bottom: 1rem; }
.auth-card .auth-field label { margin-bottom: .42rem; color: var(--sc-ink); font-size: var(--sc-text-md); }
.auth-card .auth-field input { min-height: 3.25rem; padding: .75rem .9rem; border: 1px solid var(--sc-control-line); border-radius: var(--sc-radius-sm); background: var(--sc-paper); box-shadow: inset 0 1px 1px rgb(24 24 27 / 3%); font-size: var(--sc-text-lead); }
.auth-card .auth-field input:hover { border-color: var(--sc-control-line-hover); }
.auth-card .auth-field input:focus { border-color: var(--sc-brand-deep); background: var(--sc-paper); }
/* Acción principal de las pantallas de acceso («Entrar», «Ir al acceso», «Volver al
   acceso»…): el primario común de la aplicación (plano, sin degradado ni brillo), a todo el
   ancho y algo más alto (OF-11). */
.auth-card :is(button[type="submit"], .button:not(.button-secondary, .button-quiet, .button-danger)) { width: 100%; min-height: 3.35rem; margin-top: .35rem; justify-content: center; font-size: var(--sc-text-lead); }
.auth-help { margin: 1.15rem 0 0; color: var(--sc-ink-soft); font-size: var(--sc-text-sm); text-align: left; }
.auth-help a { min-height: 2.75rem; display: inline-flex; align-items: center; }
.auth-footer { position: relative; z-index: 1; padding: 1.25rem 1.5rem; display: flex; justify-content: center; gap: .45rem; color: var(--sc-muted); font-size: var(--sc-text-xs); text-align: center; }

@keyframes auth-water-flow { to { stroke-dashoffset: -100; } }
@keyframes auth-ring-pulse { 0%, 35% { opacity: .65; transform: scale(.96); } 80%, 100% { opacity: 0; transform: scale(1.12); } }
@keyframes auth-status-pulse { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: .55; transform: scale(.82); } }
@keyframes auth-beacon { 0% { opacity: .9; filter: drop-shadow(0 0 0 rgb(25 155 136 / 30%)); } 70%, 100% { opacity: .35; filter: drop-shadow(0 0 1rem rgb(25 155 136 / 0%)); } }
@keyframes auth-orbit-drift { from { transform: translate3d(-.5rem, -.4rem, 0) scale(.98); } to { transform: translate3d(.65rem, .8rem, 0) scale(1.03); } }

.community-logo-preview { width: 10rem; height: 10rem; margin: .15rem 0 .75rem; display: grid; place-items: center; border: 1px solid var(--sc-line); border-radius: var(--sc-radius-md); background: linear-gradient(145deg, var(--sc-paper), var(--sc-brand-soft)); box-shadow: var(--sc-shadow-sm); }
.community-logo-preview img { width: 8.5rem; height: 8.5rem; display: block; object-fit: contain; }

/* Calendario */
.schedule-page-heading { margin-bottom: 1.25rem; }
.schedule-now-panel { padding: .72rem .85rem; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: .85rem; }
.schedule-now-heading h2 { margin: 0; font-size: var(--sc-text-base); white-space: nowrap; }
.schedule-now-source::before { content: ""; position: absolute; inset: 0 auto 0 0; width: .28rem; background: var(--source-color, var(--sc-water)); }
.schedule-now-source.schedule-source-al { border-color: color-mix(in srgb, var(--sc-source-al-line) 34%, var(--sc-line)); background: linear-gradient(135deg, var(--sc-paper), var(--sc-source-al-tint)); }
.schedule-now-source.schedule-source-vi { border-color: color-mix(in srgb, var(--sc-source-vi-line) 34%, var(--sc-line)); background: linear-gradient(135deg, var(--sc-paper), var(--sc-source-vi-tint)); }
.schedule-now-source:is(.schedule-source-al, .schedule-source-vi, .schedule-source-combined)::before, .schedule-now-source:is(.schedule-source-al, .schedule-source-vi, .schedule-source-combined) .schedule-source-dot { background: var(--source-mark); }
.schedule-source-heading { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: .5rem; }
.schedule-source-heading strong { min-width: 0; margin: 0; overflow-wrap: break-word; word-break: normal; hyphens: manual; font-size: var(--sc-text-md); }
.schedule-source-dot { width: .72rem; height: .72rem; border: 2px solid rgb(41 37 36 / 12%); border-radius: 50%; background: var(--source-color, var(--sc-water)); }

.schedule-calendar-shell { margin-top: 1.25rem; padding: clamp(1rem, 2.5vw, 1.5rem); border: 1px solid var(--sc-line); border-radius: var(--sc-card-radius); background: var(--sc-paper); box-shadow: var(--sc-card-shadow); }
.schedule-section-heading { margin-bottom: 1rem; display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; }
.schedule-section-heading h2 { margin: .15rem 0 .25rem; }
.schedule-section-heading p:last-child { margin: 0; color: var(--sc-muted); }
.schedule-legend { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .45rem; }
.schedule-legend span { min-height: 1.85rem; display: inline-flex; align-items: center; gap: .4rem; padding: .24rem .58rem; border: 1px solid var(--sc-line); border-radius: 999px; background: var(--sc-surface); color: var(--sc-ink-soft); font-size: var(--sc-text-xs); font-weight: var(--sc-weight-semibold); white-space: nowrap; }
.schedule-legend i { width: .68rem; height: .68rem; border-radius: 50%; background: var(--source-mark, var(--source-color, var(--sc-water))); }
.schedule-legend .schedule-source-al { border-color: color-mix(in srgb, var(--sc-source-al-line) 32%, var(--sc-line)); background: linear-gradient(135deg, var(--sc-paper), var(--sc-source-al-tint)); }
.schedule-legend .schedule-source-vi { border-color: color-mix(in srgb, var(--sc-source-vi-line) 32%, var(--sc-line)); background: linear-gradient(135deg, var(--sc-paper), var(--sc-source-vi-tint)); }
.schedule-legend .is-combined { border-color: var(--sc-combined-line); background: linear-gradient(135deg, var(--sc-source-al-tint), var(--sc-source-vi-tint)); }
.weekly-calendar { min-height: 34rem; padding-top: .5rem; border-top: 1px solid var(--sc-line); background: var(--sc-paper); }
.weekly-calendar.fc { --fc-border-color: var(--sc-line); --fc-page-bg-color: var(--sc-paper); --fc-neutral-bg-color: var(--sc-surface); --fc-today-bg-color: color-mix(in srgb, var(--sc-brand-soft) 52%, transparent); --fc-now-indicator-color: var(--sc-accent); }
.weekly-calendar .fc-toolbar { margin: .9rem 0 1.1rem; gap: .75rem; }
.weekly-calendar .fc-toolbar-title { color: var(--sc-ink); font-size: var(--sc-text-heading-card); font-weight: var(--sc-weight-bold); }
/* Controles del calendario: secundarios por defecto; la vista elegida con el trazo
   del control segmentado (.segmented-nav) y lo deshabilitado como cualquier botón. */
.weekly-calendar .fc-button-primary { border-color: var(--sc-control-line); background: var(--sc-paper); color: var(--sc-ink); box-shadow: var(--sc-shadow-sm); text-transform: none; }
.weekly-calendar .fc-button-primary:hover { border-color: var(--sc-control-line-hover); background: var(--sc-surface-strong); color: var(--sc-ink); }
.weekly-calendar .fc-button-primary:focus { box-shadow: none; }
.weekly-calendar .fc-button-primary:focus-visible { outline: 3px solid var(--sc-focus); outline-offset: 2px; }
.weekly-calendar .fc-button-primary:disabled { border-color: var(--sc-control-line); background: var(--sc-paper); color: var(--sc-ink); opacity: .55; cursor: default; box-shadow: none; }
.weekly-calendar .fc-button { min-height: 2.6rem; padding: .5rem .75rem; font-weight: var(--sc-weight-semibold); }
/* Selector de vista (Semana · Día · Lista) con el aspecto del control segmentado común:
   riel gris, opciones sin borde ni sombra y la elegida con el trazo de marca, como la
   subnavegación de Horario justo encima (OB-13, OX-16). Las flechas y «Hoy» siguen
   siendo botones secundarios. */
.weekly-calendar .fc-toolbar-chunk:last-child .fc-button-group { padding: .2rem; gap: .2rem; border: 1px solid var(--sc-line); border-radius: var(--sc-radius-md); background: var(--sc-surface); }
.weekly-calendar .fc-toolbar-chunk:last-child .fc-button-group > .fc-button:not(.fc-button-active) { min-height: var(--sc-tap); margin: 0; border-color: transparent; border-radius: var(--sc-radius-sm); background: transparent; color: var(--sc-ink-soft); box-shadow: none; font-weight: var(--sc-weight-regular); }
.weekly-calendar .fc-toolbar-chunk:last-child .fc-button-group > .fc-button:not(.fc-button-active):hover { border-color: var(--sc-line-strong); background: var(--sc-paper); color: var(--sc-ink); }
.weekly-calendar .fc-toolbar-chunk:last-child .fc-button-group > .fc-button.fc-button-active { min-height: var(--sc-tap); margin: 0; border-radius: var(--sc-radius-sm); }
.weekly-calendar .fc-timegrid-now-indicator-line { z-index: 6; border-top-width: 3px; filter: drop-shadow(0 1px 2px rgb(201 107 44 / 30%)); }
.weekly-calendar .fc-timegrid-now-indicator-arrow { z-index: 7; margin-top: -8px; border-top-width: 8px; border-bottom-width: 8px; border-left-width: 14px; filter: drop-shadow(0 2px 2px rgb(201 107 44 / 36%)); }
.weekly-calendar .fc-scrollgrid { overflow: hidden; border-radius: .65rem; }
.weekly-calendar .fc-timegrid-event-harness, .weekly-calendar .fc-timegrid-event, .weekly-calendar .fc-event-main, .schedule-event-content { min-width: 0; overflow: hidden; }
/* Solo las cajas de las rejillas horarias: las filas de las vistas de lista
   conservan su tabla (punto de color, hora y título). Los turnos se pueden pulsar. */
.weekly-calendar .fc-timegrid-event { padding: 0; border: 0; border-left: 3px solid color-mix(in srgb, currentColor 28%, transparent); border-radius: .35rem; box-shadow: 0 2px 5px rgb(41 37 36 / 13%); cursor: pointer; }
.weekly-calendar .fc-timegrid-event:is(.schedule-source-al, .schedule-source-vi, .schedule-source-combined) { background-image: var(--source-fill); }
/* «Ambas fuentes»: las dos muestras en el filete izquierdo, como en el panel
   «En este momento» y en la leyenda (CLC-10); el fondo mezcla los dos tonos. */
.weekly-calendar .fc-timegrid-event.schedule-source-combined { border-left-width: 0; }
.weekly-calendar .fc-timegrid-event.schedule-source-combined:not(.schedule-event-micro) .fc-event-main { padding-left: .5rem; }
.weekly-calendar .fc-timegrid-event.schedule-source-combined:not(.schedule-event-micro) .fc-event-main::before { content: ""; position: absolute; inset: 0 auto 0 0; width: .3rem; background: var(--sc-source-combined-mark); }
/* Estado encima de la fuente (CLC-04): disponible conserva el color de su
   fuente con borde discontinuo y trama; cedido, un marco. Los dos lo rotulan. */
.weekly-calendar .fc-timegrid-event.schedule-event-available { border: 2px dashed var(--source-line, var(--sc-available-line)); background-image: var(--sc-state-hatch), var(--source-fill, none); background-size: auto; box-shadow: none; }
.weekly-calendar .fc-timegrid-event.schedule-event-assigned { box-shadow: inset 0 0 0 2px var(--sc-paper), inset 0 0 0 3px var(--sc-assigned-ink), 0 2px 6px rgb(41 37 36 / 12%); }
/* Foco de teclado (OB-01): el anillo común de la aplicación, por dentro de la
   caja porque el contenedor de FullCalendar la recorta por fuera, y sin el velo
   oscuro de FullCalendar, que cambiaba el color de la fuente. Los turnos
   cortos no recortan su contenedor y lo llevan por fuera. */
.weekly-calendar .fc-timegrid-event:focus { outline: none; }
.weekly-calendar .fc-timegrid-event:focus-visible { outline: 3px solid var(--sc-focus); outline-offset: -3px; }
.weekly-calendar .fc-timegrid-event:is(.schedule-event-micro, .schedule-event-tiny):focus-visible { outline-offset: 1px; }
.weekly-calendar .fc-event:focus::after { content: none; }
.weekly-calendar .fc-event-main { padding: .18rem .28rem; font-weight: var(--sc-weight-semibold); }
.schedule-event-content { display: flex; flex-direction: column; gap: .08rem; line-height: 1.12; }
.schedule-event-time, .schedule-event-title { min-width: 0; overflow: hidden; }
/* Hora y finca de cada caja con el tamaño mínimo de la interfaz; solo una caja estrecha
   (dos fuentes a la vez) baja a --sc-text-2xs, con @container más abajo. */
.schedule-event-time { flex: 0 0 auto; font-size: var(--sc-text-xs); font-weight: var(--sc-weight-bold); font-variant-numeric: tabular-nums; letter-spacing: -.01em; text-overflow: ellipsis; white-space: nowrap; }
.schedule-event-title { display: -webkit-box; font-size: var(--sc-text-xs); font-weight: var(--sc-weight-semibold); overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.weekly-calendar .schedule-event-compact .schedule-event-title { -webkit-line-clamp: 1; }
.weekly-calendar .schedule-event-tiny .fc-event-main { padding: 0 .18rem; }
/* Turno de 8 a 15 minutos: una sola línea con la hora de inicio y la finca
   («09:00 Finca Sa Cova»), sin la hora de fin, que junto a la etiqueta del turno
   siguiente se leería como dos horas seguidas (OB-02). */
.weekly-calendar .schedule-event-tiny .schedule-event-content { flex-direction: row; align-items: baseline; gap: .3rem; line-height: 1; white-space: nowrap; }
.weekly-calendar .schedule-event-tiny .schedule-event-time { font-size: var(--sc-text-2xs); line-height: .95; }
.weekly-calendar .schedule-event-tiny .schedule-event-end { display: none; }
.weekly-calendar .schedule-event-tiny .schedule-event-title { display: block; flex: 1 1 auto; font-size: var(--sc-text-2xs); line-height: .95; text-overflow: ellipsis; white-space: nowrap; }
.weekly-calendar .schedule-event-micro .fc-event-main { padding: 0; }
.weekly-calendar .schedule-event-micro .schedule-event-content { display: none; }
.weekly-calendar .fc-timegrid-slot { height: 2.4rem; }
.weekly-calendar .fc-timegrid-axis-cushion, .weekly-calendar .fc-timegrid-slot-label-cushion { color: var(--sc-ink-soft); font-size: var(--sc-text-xs); }
.weekly-calendar .fc-col-header-cell { background: var(--sc-surface); }
.weekly-calendar .fc-col-header-cell-cushion { min-height: 2.7rem; display: inline-flex; align-items: center; padding: .55rem .25rem; color: var(--sc-ink); font-size: var(--sc-text-sm); font-weight: var(--sc-weight-semibold); text-decoration: none; text-transform: capitalize; }

.schedule-agenda { margin-top: var(--sc-section-gap); }
.schedule-day-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: .8rem; }
.schedule-day-card { min-width: 0; overflow: hidden; border: 1px solid var(--sc-line); border-radius: var(--sc-radius-md); background: var(--sc-paper); box-shadow: var(--sc-shadow-sm); }
.schedule-day-card > header { padding: .75rem .9rem; display: flex; align-items: center; justify-content: space-between; gap: .75rem; border-bottom: 1px solid var(--sc-line); background: var(--sc-surface); }
.schedule-day-card h3 { margin: 0; font-size: var(--sc-text-base); }
.schedule-day-card header > span { color: var(--sc-muted); font-size: var(--sc-text-xs); font-weight: var(--sc-weight-semibold); }
.schedule-day-slots { display: grid; }
.schedule-day-slots > .schedule-day-slot { min-height: 3.8rem; padding: .65rem .8rem; display: grid; grid-template-columns: 3.5rem minmax(0, 1fr); align-items: start; gap: .6rem; border-bottom: 1px solid var(--sc-line); color: var(--sc-ink); }
.schedule-day-slots > .schedule-day-slot:last-child { border-bottom: 0; }
.schedule-day-slots time { padding-top: .08rem; color: var(--sc-brand-ink); font-size: var(--sc-text-sm); font-weight: var(--sc-weight-semibold); font-variant-numeric: tabular-nums; }
.schedule-day-slots .schedule-day-slot > span, .schedule-day-slots strong, .schedule-day-slots small { min-width: 0; display: block; }
.schedule-day-slots strong { overflow-wrap: anywhere; font-size: var(--sc-text-md); }
.schedule-day-slots small { margin-top: .08rem; }
.schedule-day-slots > p { margin: 0; padding: .8rem; color: var(--sc-muted); font-size: var(--sc-text-sm); }
.schedule-empty-state { min-height: 18rem; align-content: center; }
.plot-schedule-workspace { margin-bottom: 1.5rem; padding: 1rem 1.15rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.plot-schedule-workspace h2 { margin: 0 0 .3rem; font-size: var(--sc-text-heading-card); }
.plot-schedule-workspace p { max-width: 52rem; margin: 0; color: var(--sc-muted); }
.plot-schedule-workspace form { flex: 0 0 auto; }
.schedule-effective-note p { margin: 0; }
.simple-schedule-editor { display: grid; gap: 1rem; }
.schedule-editor-heading { display: flex; align-items: end; justify-content: space-between; gap: 1rem; }
.schedule-editor-heading h2 { margin: 0; }
.simple-schedule-rows { display: grid; gap: .85rem; }
.simple-schedule-row { overflow: hidden; border: 1px solid var(--sc-line); border-radius: var(--sc-card-radius); background: var(--sc-paper); box-shadow: var(--sc-card-shadow); transition: opacity .2s ease, border-color .2s ease; }
.simple-schedule-row > header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .8rem 1rem; border-bottom: 1px solid var(--sc-line); background: linear-gradient(115deg, var(--sc-brand-tint), var(--sc-paper)); }
.simple-schedule-row > header > div { display: flex; align-items: baseline; gap: .75rem; }
.simple-schedule-row > header strong { color: var(--sc-brand-ink); font-size: var(--sc-text-md); }
/* Turno nuevo, aún sin guardar: borde discontinuo y, sin horas, aviso gris (CLC-07). */
.simple-schedule-row.is-new { border-style: dashed; border-color: var(--sc-line-strong); }
.simple-schedule-row.is-new > header { background: var(--sc-surface); }
.simple-schedule-row > header strong.is-incomplete { color: var(--sc-muted); font-weight: var(--sc-weight-regular); }
.schedule-row-number { font-weight: var(--sc-weight-semibold); }
/* Sus avisos (derecho y asignado, conflictos) ya tienen el hueco de la rejilla. */
.simple-schedule-editor > .notice { margin-block: 0; }
.schedule-row-grid { display: grid; grid-template-columns: minmax(9rem, 1fr) minmax(11rem, auto) minmax(11rem, auto) minmax(15rem, 1.5fr); gap: .85rem 1rem; padding: 1rem; align-items: start; }
.schedule-source-field { min-width: 0; margin: 0; padding: 0; border: 0; }
.schedule-source-field legend { float: none; margin-bottom: .42rem; color: var(--sc-ink-soft); font-size: var(--sc-text-md); font-weight: var(--sc-weight-semibold); }
.schedule-source-options { display: flex; flex-wrap: wrap; gap: .45rem; }
.schedule-source-option { position: relative; display: inline-flex; margin: 0; cursor: pointer; }
.schedule-source-option input { position: absolute; opacity: 0; pointer-events: none; }
.schedule-source-option span { display: inline-flex; min-height: 2.65rem; align-items: center; padding: .5rem .75rem; border: 1px solid var(--sc-control-line); border-radius: 999px; background: var(--sc-paper); color: var(--sc-ink-soft); font-size: var(--sc-text-md); font-weight: var(--sc-weight-semibold); transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease; }
/* Fuente marcada: estilo neutro (el color lo pone su muestra, igual que en el
   calendario), para no pintar de naranja la fuente Sant Vicenç (CLC-05). */
.schedule-source-option input:checked + span { border-color: var(--sc-ink); background: var(--sc-surface-strong); color: var(--sc-ink); box-shadow: inset 0 0 0 1px var(--sc-ink); }
.schedule-source-option .source-swatch { flex: 0 0 auto; }
.schedule-source-option input:checked + span::before { content: "✓"; content: "✓" / ""; margin-right: .35rem; font-weight: var(--sc-weight-bold); }
.schedule-source-option input:focus-visible + span { outline: 3px solid var(--sc-focus); outline-offset: 2px; }
.schedule-note-field { grid-column: 1 / -1; }
.schedule-note-field textarea { min-height: 4rem; }
/* Turno nocturno de más de 12 horas: posible «Desde» y «Hasta» invertidos (CLC-08). */
.schedule-row-grid > .schedule-row-warning { grid-column: 1 / -1; margin: 0; }
.schedule-delete-toggle { min-height: 2.5rem; display: inline-flex; align-items: center; gap: .45rem; margin: 0; color: var(--sc-ink-soft); font-size: var(--sc-text-md); cursor: pointer; }
.schedule-delete-toggle input { width: 1.25rem; height: 1.25rem; accent-color: var(--sc-danger); }
.simple-schedule-row.is-removed { border-color: var(--sc-danger-line); opacity: .5; }
.simple-schedule-row.is-removed .schedule-row-grid { text-decoration: line-through; }
.schedule-conflict { border-left: 4px solid var(--sc-danger); }
.schedule-conflict p { margin: .35rem 0 0; }
.slot-dispositions { margin-top: var(--sc-section-gap); padding-top: 1.5rem; border-top: 1px solid var(--sc-line); }
.slot-dispositions .schedule-editor-heading { align-items: center; margin-bottom: 1rem; }
.slot-dispositions .schedule-editor-heading p:last-child { max-width: 46rem; margin: .3rem 0 0; color: var(--sc-muted); }
.slot-year-filter { display: flex; align-items: end; gap: .45rem; }
.slot-year-filter label { align-self: center; margin: 0; font-weight: var(--sc-weight-semibold); }
.slot-year-filter input { width: 7.5rem; }
.slot-disposition-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 24rem), 1fr)); gap: .85rem; }
.slot-disposition-card { padding: 1rem; border: 1px solid var(--sc-line); border-radius: var(--sc-card-radius); background: var(--sc-paper); box-shadow: var(--sc-card-shadow); }
.slot-disposition-card > header { display: flex; flex-wrap: wrap; align-items: start; justify-content: space-between; gap: 1rem; padding-bottom: .75rem; border-bottom: 1px solid var(--sc-line); }
.slot-disposition-card > header > div { display: grid; justify-items: start; gap: .35rem; }
.slot-disposition-card > header small { color: var(--sc-muted); }
.slot-disposition-card > header > .badge { flex: 0 0 auto; }
.slot-disposition-card > p { color: var(--sc-muted); }
.slot-disposition-card .slot-disposition-note { padding: .65rem .75rem; border-radius: var(--sc-radius-sm); background: var(--sc-surface); color: var(--sc-ink-soft); }
.slot-disposition-actions { display: flex; flex-wrap: wrap; align-items: start; gap: .6rem; }
.slot-disposition-card details { flex: 1 1 13rem; }
.slot-disposition-card summary { width: fit-content; list-style: none; cursor: pointer; }
.slot-disposition-card summary::-webkit-details-marker { display: none; }
.slot-disposition-form { margin-top: .65rem; padding: .8rem; display: grid; gap: .7rem; border: 1px solid var(--sc-line); border-radius: var(--sc-radius-md); background: var(--sc-surface); }

/* Centro de ayuda */
.help-heading .page-actions .icon { width: 1rem; height: 1rem; }
.help-search-panel { margin-bottom: 1.5rem; padding: clamp(1.2rem, 3vw, 1.8rem); display: grid; grid-template-columns: minmax(18rem, .8fr) minmax(22rem, 1.2fr); align-items: center; gap: 1rem 2rem; border: 1px solid var(--sc-brand-line); border-radius: var(--sc-card-radius); background: linear-gradient(120deg, var(--sc-brand-tint), var(--sc-paper)); box-shadow: var(--sc-card-shadow); }
.help-search-panel h2 { margin: 0 0 .35rem; }
/* El antetítulo conserva su color: la regla de los párrafos no lo pisa. */
.help-search-panel p:not(.eyebrow) { margin-bottom: 0; color: var(--sc-muted); }
.help-search-field { position: relative; margin: 0; }
.help-search-field .icon { position: absolute; z-index: 1; left: .9rem; top: 50%; width: 1.15rem; height: 1.15rem; color: var(--sc-brand-ink); transform: translateY(-50%); }
/* El campo está dentro de su <label>: no hereda su peso de interfaz. */
.help-search-field input { min-height: 3.4rem; padding-left: 2.85rem; border-color: var(--sc-control-line); border-radius: var(--sc-radius-md); background-color: var(--sc-paper); font-size: var(--sc-text-lead); font-weight: var(--sc-weight-regular); box-shadow: var(--sc-shadow-sm); }
/* El recuento de resultados va justo debajo del buscador. */
.help-search-box { display: grid; gap: .45rem; }
.help-results-status { margin: 0; font-size: var(--sc-text-sm); }
.help-layout { display: grid; grid-template-columns: minmax(14rem, 18rem) minmax(0, 1fr); align-items: start; gap: 1.5rem; }
.help-index { position: sticky; top: calc(var(--sc-header-h) + 1rem); max-height: calc(100vh - var(--sc-header-h) - 2rem); overflow: auto; padding: 1rem; border: 1px solid var(--sc-line); border-radius: var(--sc-card-radius); background: var(--sc-paper); box-shadow: var(--sc-card-shadow); }
/* Índice: plegable en «Temas» en pantallas estrechas (help-center.js); abierto en escritorio. */
.help-index-panel > summary { min-height: 2.5rem; margin-bottom: .45rem; display: flex; align-items: center; justify-content: space-between; gap: .5rem; color: var(--sc-ink); font-size: var(--sc-text-sm); font-weight: var(--sc-weight-semibold); letter-spacing: .01em; list-style: none; }
.help-index-panel > summary::-webkit-details-marker { display: none; }
.help-index-panel:not([open]) > summary { margin-bottom: 0; }
.help-index nav { display: grid; gap: .12rem; }
.help-index nav a { min-height: 2.5rem; padding: .5rem .6rem; display: flex; align-items: center; border-radius: var(--sc-radius-sm); color: var(--sc-ink-soft); font-size: var(--sc-text-sm); font-weight: var(--sc-weight-regular); line-height: 1.3; text-decoration: none; }
.help-index nav a:hover, .help-index nav a:focus-visible { background: var(--sc-brand-soft); color: var(--sc-brand-deep); }
.help-content { min-width: 0; display: grid; gap: 1.25rem; }
.help-section { scroll-margin-top: .75rem; overflow: hidden; border: 1px solid var(--sc-line); border-radius: var(--sc-card-radius); background: var(--sc-paper); box-shadow: var(--sc-card-shadow); }
/* El h2 de cada tema; dentro, el botón que lo pliega (o, sin JavaScript, un span). */
.help-section-heading { margin: 0; background: linear-gradient(120deg, var(--sc-brand-tint), var(--sc-paper)); }
.help-section:not(.is-collapsed) > .help-section-heading { border-bottom: 1px solid var(--sc-line); }
.help-section-label { width: 100%; min-height: 0; padding: 1.15rem 1.25rem; display: flex; align-items: center; justify-content: flex-start; gap: 1rem; border: 0; border-radius: 0; background: transparent; color: var(--sc-ink); font: inherit; font-weight: inherit; line-height: inherit; letter-spacing: inherit; text-align: left; box-shadow: none; }
button.help-section-label:hover { border: 0; background: rgb(255 255 255 / 55%); color: var(--sc-ink); box-shadow: none; }
button.help-section-label:active { transform: none; }
button.help-section-label:focus-visible { outline-offset: -3px; }
.help-section-number { width: 2.75rem; height: 2.75rem; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; background: var(--sc-brand); color: var(--sc-on-brand); font-size: var(--sc-text-xs); font-weight: var(--sc-weight-bold); letter-spacing: 0; }
/* «Novedades prácticas» usa el mismo círculo, con un icono: todos los títulos empiezan a la misma altura. */
.help-section-number .icon { width: 1.3rem; height: 1.3rem; }
.help-section-name { min-width: 0; display: grid; }
.help-section-name .eyebrow { display: block; letter-spacing: .01em; }
.help-section-toggle { position: relative; width: 1.75rem; height: 1.75rem; flex: 0 0 auto; margin-left: auto; border: 1px solid var(--sc-control-line); border-radius: 50%; background: var(--sc-paper); color: var(--sc-brand-deep); }
.help-section-toggle::before, .help-section-toggle::after { content: ""; position: absolute; left: 50%; top: 50%; width: .7rem; height: 1.5px; border-radius: 1rem; background: currentColor; transform: translate(-50%, -50%); }
.help-section-toggle::after { transform: translate(-50%, -50%) rotate(90deg); transition: transform .15s ease; }
.help-section:not(.is-collapsed) .help-section-toggle::after { transform: translate(-50%, -50%) rotate(0); }
.help-topic-list { display: grid; }
.help-topic { scroll-margin-top: .75rem; border-bottom: 1px solid var(--sc-line); }
.help-topic:last-child { border-bottom: 0; }
.help-topic > summary { min-height: 3.5rem; padding: .85rem 1.25rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; color: var(--sc-ink); font-weight: var(--sc-weight-semibold); cursor: pointer; list-style: none; }
.help-topic > summary::-webkit-details-marker { display: none; }
.help-topic > summary:hover { background: var(--sc-surface); }
.help-topic[open] > summary { color: var(--sc-brand-deep); background: var(--sc-brand-tint); }
.help-topic-toggle { position: relative; width: 1.5rem; height: 1.5rem; flex: 0 0 auto; border: 1px solid var(--sc-control-line); border-radius: 50%; background: var(--sc-paper); }
.help-topic-toggle::before, .help-topic-toggle::after { content: ""; position: absolute; left: 50%; top: 50%; width: .65rem; height: 1.5px; border-radius: 1rem; background: currentColor; transform: translate(-50%, -50%); }
.help-topic-toggle::after { transform: translate(-50%, -50%) rotate(90deg); transition: transform .15s ease; }
.help-topic[open] .help-topic-toggle::after { transform: translate(-50%, -50%) rotate(0); }
.help-topic-body { padding: .25rem clamp(1.15rem, 3vw, 2rem) 1.5rem; color: var(--sc-ink-soft); }
.help-topic-body > p, .help-topic-body > ul, .help-topic-body > ol { max-width: 54rem; }
.help-topic-body h3 { margin-top: 1.4rem; }
.help-topic-body li { margin-bottom: .42rem; }
.help-topic-body code { padding: .08rem .28rem; border-radius: .25rem; background: var(--sc-surface-strong); }
.help-notice { max-width: 54rem; margin: 1rem 0; }
.help-steps { padding-left: 2.3rem; counter-reset: help-step; list-style: none; }
.help-steps li { position: relative; min-height: 1.75rem; counter-increment: help-step; }
.help-steps li::before { content: counter(help-step); position: absolute; left: -2.3rem; top: -.05rem; width: 1.55rem; height: 1.55rem; display: grid; place-items: center; border-radius: 50%; background: var(--sc-brand-soft); color: var(--sc-brand-deep); font-size: var(--sc-text-xs); font-weight: var(--sc-weight-bold); }
.help-figure { max-width: 58rem; margin: 1.25rem 0; }
.help-figure button { width: 100%; padding: 0; overflow: hidden; border: 1px solid var(--sc-line); border-radius: var(--sc-radius-md); background: var(--sc-paper); cursor: zoom-in; box-shadow: var(--sc-shadow-sm); }
.help-figure button:hover, .help-figure button:focus-visible { border-color: var(--sc-brand); box-shadow: var(--sc-shadow-md); }
.help-figure img { width: 100%; max-height: 42rem; display: block; object-fit: contain; background: var(--sc-surface); }
.help-figure figcaption { margin-top: .5rem; color: var(--sc-muted); font-size: var(--sc-text-sm); }
.help-empty { margin: 0; }
.help-image-dialog { width: min(76rem, calc(100vw - 2rem)); max-height: calc(100vh - 2rem); padding: 1rem; border: 0; border-radius: var(--sc-radius-lg); background: var(--sc-paper); box-shadow: 0 24px 80px rgb(0 0 0 / 30%); }
.help-image-dialog::backdrop { background: rgb(24 24 27 / 72%); backdrop-filter: blur(3px); }
.help-image-dialog img { width: 100%; max-height: calc(100vh - 8rem); object-fit: contain; }
.help-image-dialog p { margin: .7rem 0 0; color: var(--sc-muted); }
.help-dialog-close { position: sticky; z-index: 2; top: 0; margin: 0 0 .6rem auto; display: flex; }
.policy-concept-summary { margin: 1rem 0; padding: 1rem; border: 1px solid var(--sc-line); border-radius: var(--sc-radius-md); background: var(--sc-surface); }
.policy-concept-summary .section-heading { margin-top: 0; margin-bottom: .75rem; }
.policy-concept-summary .section-heading h3 { margin: 0; }
.policy-concept-list { margin-bottom: 0; }


@media (max-width: 68rem) {
  .auth-shell { grid-template-columns: 1fr; }
  .auth-brand-panel { display: none; }
  .auth-access-panel { min-height: 100vh; background: linear-gradient(165deg, var(--sc-paper) 0, var(--sc-brand-tint) 62%, var(--sc-auth-cool) 100%); }
  .auth-mobile-brand { width: min(100% - 2rem, 34rem); margin: 0 auto; padding: .65rem 0 .75rem; display: block; }
  /* El punto de luz decorativo caía sobre la esquina de «Entrar» (OF-11). */
  .auth-access-beacon { display: none; }
  .auth-main { padding-top: .75rem; }
  /* F4 · Ayuda: con JavaScript el índice es la barra «Temas», fija bajo la cabecera: se
     vuelve a él desde cualquier punto de una respuesta larga. Sin JavaScript queda en su sitio. */
  .help-layout.is-enhanced .help-index { position: sticky; z-index: 5; top: calc(var(--sc-header-h) + .5rem); max-height: calc(100vh - var(--sc-header-h) - 1rem); max-height: calc(100dvh - var(--sc-header-h) - 1rem); padding: .35rem .85rem; overflow: auto; }
  .help-layout.is-enhanced .help-index-panel:not([open]) > summary { margin-bottom: 0; }
  .help-layout.is-enhanced :is(.help-section, .help-topic) { scroll-margin-top: 4.5rem; }
}

/* Navegación completa desde 64rem (1024 px); entre 64 y 80rem se ocultan los iconos y el
   menú de usuario muestra solo las iniciales: así caben los siete apartados (con «Libro de
   cuentas») en castellano y en catalán. El nombre sigue en el nombre accesible del botón y
   en el panel. */
@media (min-width: 64rem) and (max-width: 79.99rem) {
  .main-nav > a .nav-icon { display: none; }
  .user-menu-name { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .member-directory-table :is(th, td) { padding-inline: .6rem; }
}

@media (max-width: 82rem) {
  .help-layout { grid-template-columns: 1fr; }
  .help-index { position: static; max-height: none; }
  .help-index nav { grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); }
}












/* Segunda pasada visual B: Cuotas, Usuarios y acceso, Configuración, Ayuda y
   Actividad. Utilidades de las tablas apilables, campos con unidad, selección
   con zona de pulsación suficiente y avisos o detalles con formulario dentro. */
/* Tablas: contenido solo para la vista de tarjetas (< 48rem) o solo para la tabla
   ancha, p. ej. «Apellidos, Nombre» como título de la tarjeta sin repetir la columna. */
.table-stack .table-stack-only { display: none; }
.help-table { margin: 1rem 0 1.25rem; }
/* Campos: asterisco también en los controles con unidad (€/h), ayudas con lista y
   casillas con su etiqueta como zona de pulsación. */
.field:has(> .amount-field-control > :is(input, select, textarea)[required]) > label:not(:has(.required-mark))::after { content: " *"; content: " *" / ""; color: var(--sc-danger); font-weight: var(--sc-weight-bold); }
.field-help ul { margin: .3rem 0 0; padding-left: 1.25rem; }
.field-help li + li { margin-top: .15rem; }
.field-check > .check-row { min-height: 2.5rem; align-items: center; }
.field-check > .check-row > input { margin-top: 0; }
.field-check > .field-help, .field-check > .errorlist { margin-left: 2rem; }
.confirmation-card .field-check > .check-row { color: var(--sc-ink); font-weight: var(--sc-weight-semibold); }
.settings-logo-field .field-check { margin-top: .75rem; }
/* Avisos y detalles con formulario dentro. */
.notice form { margin: .75rem 0 0; }
.notice form button { min-height: 2.5rem; }
.form-card > .summary-card + form { margin-top: 1.25rem; }
.bulk-selection-detail { margin: 1.25rem 0 0; border: 1px solid var(--sc-line); border-radius: var(--sc-radius-md); background: var(--sc-surface); }
.bulk-selection-detail > summary { min-height: var(--sc-tap); padding: .55rem 1rem; display: flex; align-items: center; color: var(--sc-brand-ink); font-weight: var(--sc-weight-semibold); }
.bulk-selection-detail > summary::-webkit-details-marker { display: none; }
.bulk-selection-detail[open] > summary { border-bottom: 1px solid var(--sc-line); }
.bulk-selection-list { max-height: 20rem; margin: 0; padding: .75rem 1rem .75rem 2.25rem; overflow-y: auto; font-size: var(--sc-text-sm); }
.bulk-selection-list li + li { margin-top: .3rem; }
/* Cuotas: casillas de selección de 24 px dentro de una etiqueta de al menos 32 px
   (44 px con puntero táctil) y «Seleccionar todas» visible en todos los anchos. */
.selection-target { min-width: 2rem; min-height: 2rem; margin: 0; display: inline-flex; align-items: center; justify-content: center; gap: .6rem; color: var(--sc-ink-soft); font-size: var(--sc-text-sm); font-weight: var(--sc-weight-semibold); cursor: pointer; }
.billing-selection-cell .selection-target input, .billing-select-all input { width: 1.5rem; height: 1.5rem; margin: 0; }
.billing-bulk-selection > .billing-select-all { min-height: 2.5rem; margin: 0; align-items: center; color: var(--sc-ink); font-size: var(--sc-text-sm); }
.billing-bulk-selection > .billing-select-all > input { margin-top: 0; }
/* Conceptos del recibo: la nota del importe (motivo, «Pagado el…») en su propia línea. */
.billing-concept-list dd { text-align: right; }
.billing-concept-list dd small { display: block; margin-top: .15rem; color: var(--sc-muted); font-size: var(--sc-text-xs); font-weight: var(--sc-weight-regular); white-space: pre-line; }
/* Usuarios: nombre y email en una sola columna (el email, debajo y sin cortar la tabla). */
.role-person small { color: var(--sc-muted); font-size: var(--sc-text-xs); overflow-wrap: anywhere; }
.role-access-link { margin-top: var(--sc-section-gap); padding-top: 1.25rem; border-top: 1px solid var(--sc-line); }
.role-access-link h2 { margin: 0 0 .5rem; font-size: var(--sc-text-heading-card); }
.security-grid { align-items: start; }
/* Acceso: aire bajo el título cuando no sigue la entradilla y el icono del bloqueo. */
.auth-card h1 + :not(.auth-community) { margin-top: 1rem; }
.auth-card-icon { width: 3rem; height: 3rem; margin-bottom: 1rem; display: grid; place-items: center; border: 1px solid var(--sc-brand-line); border-radius: 50%; background: var(--sc-brand-soft); color: var(--sc-brand-deep); }
/* Actividad: identificador completo en la ficha del evento. */
.audit-object-id-full { max-width: 100%; overflow: visible; white-space: normal; overflow-wrap: anywhere; }
/* F4 · Ayuda: resultados de búsqueda y «Temas» a mano en pantallas estrechas
   (la barra «Temas» fija bajo la cabecera va en el bloque único de 68rem). */
.help-topic-title { min-width: 0; display: grid; gap: .25rem; }
.help-topic-snippet { color: var(--sc-muted); font-size: var(--sc-text-sm); font-weight: var(--sc-weight-regular); line-height: 1.45; }
.help-topic mark { padding: 0 .1em; border-radius: .2rem; background: var(--sc-warning-bg); box-shadow: inset 0 -1px var(--sc-warning-line); color: inherit; }

/* Impresión: A4 apaisado, sin controles ni navegación y con tablas completas. */
@page { size: A4 landscape; margin: 12mm 10mm; }
@page portrait { size: A4 portrait; margin: 15mm; }

/* Segunda pasada visual C: horario de riego y «Quién tiene el agua» del panel.
   Subnavegación de Horario, tarjeta de fuente compartida (calendario y panel),
   detalle de turno, vistas del calendario, formularios y tablas del horario. */


/* Tarjeta de fuente («En este momento» del calendario y «Quién tiene el agua» del
   panel): nombre y estado en la misma fila si caben (si no, el estado pasa a la
   segunda) y debajo quién riega, hasta cuándo y el turno siguiente. */
.schedule-now-panel .now-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); gap: .75rem; }
.dashboard-now .now-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr)); gap: .75rem; }
.now-source.schedule-now-source { min-height: 0; padding: .75rem .85rem .8rem 1.05rem; display: flex; flex-wrap: wrap; align-items: center; align-content: flex-start; gap: .45rem .75rem; background: rgb(255 255 255 / 88%); }
.schedule-now-source .schedule-source-heading { flex: 1 1 auto; min-width: min(100%, 9rem); }
.now-source.schedule-now-source > .badge { flex: 0 0 auto; margin: 0; display: inline-flex; overflow-wrap: normal; }
.schedule-now-detail { flex: 1 0 100%; min-width: 0; display: grid; gap: .2rem; }
.schedule-now-detail > p { margin: 0; overflow-wrap: break-word; }
.schedule-now-holder { color: var(--sc-ink); font-weight: var(--sc-weight-semibold); }
.schedule-now-until { color: var(--sc-ink-soft); font-size: var(--sc-text-sm); font-weight: var(--sc-weight-regular); font-variant-numeric: tabular-nums; }
.schedule-now-next { color: var(--sc-muted); font-size: var(--sc-text-sm); }
.schedule-now-detail > .schedule-now-next:not(.schedule-now-next + .schedule-now-next) { margin-top: .15rem; padding-top: .35rem; border-top: 1px dashed var(--sc-line-strong); }
.now-source .schedule-now-next-source { display: inline; color: var(--sc-ink-soft); font-weight: var(--sc-weight-semibold); overflow-wrap: normal; }
.schedule-now-source.schedule-source-combined { border-color: var(--sc-combined-line); background: linear-gradient(135deg, var(--sc-source-al-tint), var(--sc-source-vi-tint)); }
.schedule-now-source.schedule-source-other { border-color: color-mix(in srgb, var(--source-color, var(--sc-water)) 34%, var(--sc-line)); background: linear-gradient(135deg, var(--sc-paper), color-mix(in srgb, var(--source-color, var(--sc-water)) 9%, var(--sc-paper))); }
.schedule-legend .schedule-source-other { border-color: color-mix(in srgb, var(--source-color, var(--sc-water)) 32%, var(--sc-line)); background: color-mix(in srgb, var(--source-color, var(--sc-water)) 9%, var(--sc-paper)); }
.dashboard-now-heading h2 { margin-top: .15rem; }
.now-updated { margin: .3rem 0 0; color: var(--sc-muted); font-size: var(--sc-text-xs); font-variant-numeric: tabular-nums; }

/* Detalle de un turno del calendario (diálogo modal propio). */
.schedule-turn-dialog { width: min(36rem, calc(100vw - 2rem)); max-height: calc(100dvh - 2rem); padding: 0; overflow: auto; border: 0; border-radius: var(--sc-radius-lg); background: var(--sc-paper); color: var(--sc-ink); box-shadow: 0 24px 80px rgb(0 0 0 / 30%); }
.schedule-turn-dialog::backdrop { background: rgb(24 24 27 / 60%); backdrop-filter: blur(2px); }
.schedule-turn-dialog-header { padding: 1rem 1rem .9rem 1.25rem; display: flex; align-items: flex-start; justify-content: space-between; gap: .75rem 1rem; border-bottom: 1px solid var(--sc-line); background: linear-gradient(135deg, var(--sc-paper), var(--sc-brand-tint)); }
.schedule-turn-dialog-header > div { min-width: 0; }
.schedule-turn-dialog-header .eyebrow { margin-bottom: .2rem; }
.schedule-turn-dialog-header h2 { margin: 0; font-size: var(--sc-text-heading-card); overflow-wrap: anywhere; }
.schedule-turn-dialog-header .button { flex: 0 0 auto; }
.schedule-turn-details { margin: 0; padding: 1rem 1.25rem 1.15rem; align-items: baseline; row-gap: .55rem; }
.schedule-turn-details dd { overflow-wrap: anywhere; }
.schedule-turn-dialog .notice { margin: 0 1.25rem 1.25rem; }

/* Vistas del calendario: en una caja estrecha (dos fuentes a la vez en tablet)
   se ve la hora de inicio en lugar de una elipsis; los turnos afectados por un
   cambio de hora llevan una esquina de aviso y, en las listas, su nota. */
.weekly-calendar .fc-timegrid-event .fc-event-main { container-type: inline-size; }
@container (max-width: 6.5rem) {
  .schedule-event-time, .schedule-event-title { font-size: var(--sc-text-2xs); }
}
.weekly-calendar .fc-timegrid-event.schedule-event-dst .fc-event-main::after { content: ""; position: absolute; top: 0; right: 0; border-style: solid; border-width: 0 .7rem .7rem 0; border-color: transparent var(--sc-warning-ink) transparent transparent; }
.weekly-calendar [data-empty-focus]:focus-visible { outline-offset: -3px; }
.weekly-calendar .fc-list-event { cursor: pointer; }
/* La capa de selección de FullCalendar (::before al enfocar o seleccionar) es una caja más
   dentro de la fila de la tabla: desplazaba sus celdas y estrechaba la lista (OB-11). */
.weekly-calendar .fc-list-event:is(:focus, .fc-event-selected)::before { content: none; }
.weekly-calendar .fc-list-event:hover td { background: var(--sc-brand-tint); }
.weekly-calendar .fc-list-event.schedule-event-available td { background: var(--sc-available-bg); }
/* Punto de la fuente en las listas: la misma muestra que la leyenda. */
.weekly-calendar .fc-list-event:is(.schedule-source-al, .schedule-source-vi, .schedule-source-combined) .fc-list-event-dot { width: var(--fc-list-event-dot-width, .625rem); height: var(--fc-list-event-dot-width, .625rem); border: 0; background: var(--source-mark); }
.weekly-calendar .fc-list-event.schedule-event-available .fc-list-event-dot { outline: 1px dashed var(--sc-available-line); outline-offset: 2px; }
.schedule-event-note { display: block; margin-top: .15rem; color: var(--sc-muted); font-size: var(--sc-text-xs); font-weight: var(--sc-weight-regular); }
.schedule-event-note.is-dst { color: var(--sc-warning-ink); }

/* Horario utilizable y sin ambigüedad (fase 2c).
   Un turno que cruza la medianoche se dibuja como una caja por día: el corte
   queda recto y discontinuo para leerse como el mismo turno, que además rotula
   su día de inicio y de fin (CLC-03). */
.weekly-calendar .fc-timegrid-event:not(.fc-event-end) { border-bottom: 2px dashed color-mix(in srgb, currentColor 45%, transparent); border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
.weekly-calendar .fc-timegrid-event:not(.fc-event-start) { border-top: 2px dashed color-mix(in srgb, currentColor 45%, transparent); border-top-left-radius: 0; border-top-right-radius: 0; }
/* Turnos de 5 a 15 minutos (CLC-01): la caja conserva su altura real para no
   aparentar un solape con el turno contiguo. Se separa del vecino con el color
   de trazo de su fuente y un filete blanco; una etiqueta lateral muestra la
   hora y, al pasar el ratón o llegar con el teclado, el turno completo. La
   etiqueta crece hacia arriba, sobre el final del turno anterior, para no tapar
   la hora del siguiente, que se rotula arriba. La zona sensible crece unos
   píxeles sin tapar el cuerpo del turno vecino. */
.weekly-calendar .fc-timegrid-event-harness:has(> .schedule-event-micro), .weekly-calendar .fc-timegrid-event-harness:has(> .schedule-event-tiny) { z-index: 4 !important; overflow: visible; }
.weekly-calendar .fc-timegrid-event:is(.schedule-event-micro, .schedule-event-tiny), .weekly-calendar :is(.schedule-event-micro, .schedule-event-tiny) .fc-event-main { overflow: visible; }
.weekly-calendar .fc-timegrid-event:is(.schedule-event-micro, .schedule-event-tiny) { box-shadow: 0 0 0 1px var(--sc-paper); }
.weekly-calendar .fc-timegrid-event:is(.schedule-event-micro, .schedule-event-tiny)::before { content: ""; position: absolute; inset: -.25rem 0; }
.weekly-calendar .fc-timegrid-event.schedule-event-micro:is(.schedule-source-al, .schedule-source-vi) { background-image: none; background-color: var(--source-line); }
.weekly-calendar .fc-timegrid-event.schedule-event-micro.schedule-source-combined { background-image: var(--sc-source-combined-mark); background-size: auto; }
.weekly-calendar .schedule-event-flag { display: none; }
/* La etiqueta de un turno de 5 a 7 minutos dice siempre su hora y su finca
   («09:15 · Finca Sa Cova», con elipsis si no cabe), también en táctil, y lleva
   a la izquierda el filete de su fuente para leerse como la franja de debajo y
   no como el turno de encima (OB-02). Al pasar el ratón o con el teclado añade
   la hora de fin y se ensancha. */
.weekly-calendar .schedule-event-micro .schedule-event-flag, .weekly-calendar .schedule-event-tiny:is(:hover, :focus-visible) .schedule-event-flag { position: absolute; left: 0; bottom: 0; z-index: 2; max-width: 100%; display: inline-flex; align-items: baseline; padding: 0 .4rem 0 .5rem; overflow: hidden; border: 1px solid var(--sc-line-strong); border-radius: 0 var(--sc-radius-sm) var(--sc-radius-sm) 0; background: var(--sc-paper); color: var(--sc-ink); box-shadow: var(--sc-shadow-sm); font-size: var(--sc-text-xs); font-weight: var(--sc-weight-semibold); font-variant-numeric: tabular-nums; line-height: 1.15; white-space: nowrap; }
.weekly-calendar .schedule-event-flag::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--source-mark, var(--source-line, var(--sc-line-strong))); }
.weekly-calendar .schedule-event-flag-end { display: none; }
.weekly-calendar .schedule-event-flag-title { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.weekly-calendar .fc-timegrid-event:is(:hover, :focus-visible) .schedule-event-flag { max-width: 16rem; border-color: var(--sc-control-line); }
.weekly-calendar .fc-timegrid-event:is(:hover, :focus-visible) .schedule-event-flag-end { display: inline; }
.weekly-calendar .fc-timegrid-event:focus-visible .schedule-event-flag { outline: 3px solid var(--sc-focus); outline-offset: 1px; }
/* Columna estrecha (dos fuentes a la vez en la semana de una tableta): la
   etiqueta conserva la hora de inicio con la letra de las cajas y sin márgenes;
   solo por debajo de 2rem, donde no cabe, se queda en la zona sensible y el
   detalle (fase 3d, CLC-01). La caja mantiene su altura real. */
@container (max-width: 4.75rem) {
  .weekly-calendar .schedule-event-micro:not(:hover, :focus-visible) .schedule-event-flag { right: 0; max-width: 100%; padding: 0 .12rem; font-size: var(--sc-text-2xs); letter-spacing: -.01em; }
  .schedule-event-end { display: none; }
  /* F3 · Turnos cortos: solo la hora de inicio, como antes; la finca sigue en la etiqueta
     al pasar el ratón o con el teclado, en el detalle y en las listas (OB-02). */
  .weekly-calendar .schedule-event-micro:not(:hover, :focus-visible) .schedule-event-flag { padding-left: .3rem; }
  .weekly-calendar .schedule-event-micro:not(:hover, :focus-visible) .schedule-event-flag-title { display: none; }
  .weekly-calendar .schedule-event-tiny .schedule-event-title { display: none; }
}
@container (max-width: 2rem) {
  .weekly-calendar .schedule-event-micro:not(:hover, :focus-visible) .schedule-event-flag { display: none; }
}
/* Turnos fuera de la zona visible de la rejilla horaria (CLC-02). Los avisos
   van en una franja propia, encima de la cabecera de los días y debajo de la
   rejilla, y nunca tapan un turno (OB-12). La franja se reserva siempre en las
   rejillas, para que la página no salte al aparecer o desaparecer un aviso. */
.schedule-grid-frame { --schedule-jump-strip: calc(var(--sc-tap) + var(--sc-space-3)); position: relative; }
.schedule-grid-frame.is-time-grid { padding-bottom: var(--schedule-jump-strip); }
.schedule-grid-frame.is-time-grid .fc-view-harness { margin-top: var(--schedule-jump-strip); }
.schedule-grid-frame.is-time-grid .weekly-calendar .fc-toolbar { margin-bottom: 0; }
.schedule-grid-jump { position: absolute; left: 0; right: 0; z-index: 8; width: fit-content; max-width: 100%; margin-inline: auto; }
.schedule-grid-jump.is-earlier { top: calc(var(--view-top, 0px) - var(--schedule-jump-strip) + var(--sc-space-3) / 2); }
.schedule-grid-jump.is-later { bottom: calc(var(--sc-space-3) / 2); }

/* Fase 3d: fuente y estado de un turno, carga de la rejilla y «Día a día».
   La fuente es el color (los tokens --sc-source-*), el estado se dibuja encima
   sin color propio y también se rotula; leyenda, panel, listas, formularios y
   cajas del calendario usan las mismas muestras (CLC-04, CLC-05, CLC-10). */
.schedule-source-al { --source-fill: var(--sc-source-al-fill); --source-mark: var(--sc-source-al-fill); --source-line: var(--sc-source-al-line); }
.schedule-source-vi { --source-fill: var(--sc-source-vi-fill); --source-mark: var(--sc-source-vi-fill); --source-line: var(--sc-source-vi-line); }
.schedule-source-combined { --source-fill: var(--sc-source-combined-fill); --source-mark: var(--sc-source-combined-mark); --source-line: var(--sc-combined-line); }
.schedule-source-other { --source-mark: var(--source-color, var(--sc-water)); }
.source-swatch:is(.schedule-source-al, .schedule-source-vi, .schedule-source-combined) { background: var(--source-mark); }
.schedule-legend .schedule-legend-state i { border: 1px solid var(--sc-control-line); border-radius: .22rem; background: var(--sc-paper); }
.schedule-legend .schedule-legend-state.is-available i { border-style: dashed; border-color: var(--sc-available-line); background: var(--sc-state-hatch), var(--sc-paper); }
.schedule-legend .schedule-legend-state.is-assigned i { border-color: var(--sc-assigned-ink); box-shadow: inset 0 0 0 1px var(--sc-paper), inset 0 0 0 2px var(--sc-assigned-ink); }
.schedule-legend .schedule-legend-state.is-dst i { border-color: var(--sc-line-strong); background: linear-gradient(225deg, var(--sc-warning-ink) 0 .3rem, var(--sc-paper) .3rem); }
.weekly-calendar .schedule-event-state { display: block; min-width: 0; overflow: hidden; font-size: var(--sc-text-2xs); font-weight: var(--sc-weight-bold); text-overflow: ellipsis; white-space: nowrap; }
.weekly-calendar :is(.schedule-event-compact, .schedule-event-tiny, .schedule-event-micro) .schedule-event-state { display: none; }
/* Turnos que llegan (CLC-21): aviso sobre la rejilla si la respuesta tarda y,
   si falla, el motivo y «Reintentar»; la rejilla se atenúa mientras tanto. */
.schedule-grid-status { position: absolute; z-index: 9; top: calc(var(--view-top, 0px) + var(--sc-space-7)); left: 0; right: 0; width: fit-content; max-width: calc(100% - var(--sc-space-4)); margin: 0 auto; box-shadow: var(--sc-shadow-md); }
.schedule-grid-status:not(.is-error) { padding: .55rem 1rem; border: 1px solid var(--sc-line-strong); border-radius: 999px; background: var(--sc-paper); color: var(--sc-ink); font-size: var(--sc-text-sm); font-weight: var(--sc-weight-semibold); }
.schedule-grid-status.is-error { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .75rem; }
.weekly-calendar[data-feed-state="loading"] .fc-view-harness, .weekly-calendar[data-feed-state="failed"] .fc-view-harness { opacity: .45; transition: opacity .2s ease; }
.weekly-calendar:is([data-feed-state="loading"], [data-feed-state="failed"], [data-feed-state="pending"]) .fc-list-empty { visibility: hidden; }
/* «Día a día»: la semana en 4 + 3 columnas o en 7 si cabe; en negrita solo la
   finca y el titular debajo, en peso normal (CLC-17). */
@media screen and (min-width: 60rem) {
  .schedule-day-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media screen and (min-width: 100rem) {
  .schedule-day-grid { grid-template-columns: repeat(7, minmax(0, 1fr)); }
}
.schedule-day-slots .schedule-day-slot-detail { display: block; color: var(--sc-ink-soft); font-size: var(--sc-text-sm); overflow-wrap: anywhere; }

/* Fechas y archivos: los controles nativos siguen el idioma del navegador, no el de la
   aplicación. La fecha elegida se confirma debajo con el mes en letra (core.forms.
   ISODateInput) y el selector de archivo usa su propio botón y rótulo
   (core.forms.LocalizedFileInput); sin JavaScript se ve el control nativo. */
.date-echo { display: block; margin-top: .3rem; color: var(--sc-ink-soft); font-size: var(--sc-text-sm); }
.date-echo:empty { display: none; }
.file-picker { position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .75rem; }
.file-picker-button { margin: 0; }
.file-picker-name { min-width: 0; color: var(--sc-ink-soft); font-size: var(--sc-text-sm); overflow-wrap: anywhere; }
html:not(.js) :is(.file-picker-button, .file-picker-name) { display: none; }
.js .file-picker > input[type="file"] { position: absolute; width: 1px; height: 1px; min-height: 0; padding: 0; overflow: hidden; border: 0; clip-path: inset(50%); opacity: 0; }
.js .file-picker > input[type="file"]:focus-visible + .file-picker-button { outline: 3px solid var(--sc-focus); outline-offset: 2px; }
.file-picker > input[aria-invalid="true"] + .file-picker-button { border-color: var(--sc-danger); box-shadow: inset 0 0 0 1px var(--sc-danger); }
.field:has(> .file-picker > input[required]) > label:not(:has(.required-mark))::after { content: " *"; content: " *" / ""; color: var(--sc-danger); font-weight: var(--sc-weight-bold); }

/* Formularios del horario: fuentes como botones conmutables y hora final. */
.form-grid > .schedule-source-field { grid-column: 1 / -1; }
.schedule-source-field .errorlist { margin-top: .5rem; }
.slot-end-time { margin: .45rem 0 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: .15rem .45rem; color: var(--sc-ink-soft); font-size: var(--sc-text-sm); }
.slot-end-time output { color: var(--sc-ink); font-weight: var(--sc-weight-semibold); font-variant-numeric: tabular-nums; }
.source-color-field input[type="color"] { width: 5.5rem; height: var(--sc-control-h); padding: .3rem; border: 1px solid var(--sc-control-line); border-radius: var(--sc-radius-sm); background: var(--sc-paper); cursor: pointer; }
.source-color-field input[type="color"]:hover { border-color: var(--sc-control-line-hover); }

/* Tablas del horario: color de la fuente junto a su nombre y nota secundaria
   (los valores de varias líneas usan el .table-stack-value común). */
.schedule-table .source-swatch { vertical-align: -.05rem; }
.schedule-table-note { display: block; margin-top: .15rem; color: var(--sc-muted); font-size: var(--sc-text-xs); }

/* Ficha de versión y conciliación (fase 3d): una insignia por fuente con su
   color, unidas con « + » como en el calendario, y la diferencia con el
   derecho («Faltan 45 min») en color de aviso además del texto. La lista es un
   flex de bloque: en la tarjeta apilada se queda junto a su etiqueta y parte
   las insignias en su propia columna, como .table-stack-value. */
.slot-source-badges { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sc-space-1) var(--sc-space-2); }
.reconciliation-gap { color: var(--sc-warning-ink); }

/* Pulido de Fincas y Horario (equipo F3, revisión cruzada 07/11/2026).
   Reglas propias del horario y de las fichas de finca; los componentes
   globales (.badge, .source-swatch, .form-disclosure…) no se redefinen aquí. */

/* Vista Lista del calendario (OB-11): la cabecera de cada día se lee como en
   «Día a día» («Lunes 02/11») y la de hoy lo dice; la hora es la del turno
   entero, también cuando pasa la medianoche. */
.weekly-calendar .fc-list-day-cushion { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sc-space-1) var(--sc-space-2); }
.weekly-calendar .fc-list-day-cushion::after { content: none; }
.weekly-calendar .schedule-list-day { color: var(--sc-ink); font-weight: var(--sc-weight-semibold); }
.weekly-calendar .fc-list-day.fc-day-today .fc-list-day-cushion { background: color-mix(in srgb, var(--sc-brand-soft) 70%, var(--sc-paper)); }
.weekly-calendar .schedule-list-line { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 var(--sc-space-3); }
.weekly-calendar .schedule-list-time { flex: 0 0 9.5rem; color: var(--sc-ink); font-variant-numeric: tabular-nums; font-weight: var(--sc-weight-semibold); }
.weekly-calendar .schedule-list-line > :last-child { flex: 1 1 12rem; min-width: 0; }
/* «Hoy»: el mismo tinte que la columna de hoy en la rejilla, no un estado. */
.schedule-today-badge { border-color: var(--sc-brand-line); background: var(--sc-brand-soft); color: var(--sc-brand-deep); }

/* Fuentes de un turno (OB-04, OB-05, CXU-004): una sola representación en toda
   la aplicación, la muestra de la leyenda y el nombre público
   (scheduling/_source_badges.html). En tablas, tarjetas y detalle va como
   insignia; en una línea de texto («Día a día», cifras por fuente), sin marco,
   y cada nombre se mantiene entero. */
.source-label { white-space: nowrap; }

/* Estados de un turno (OB-07, apps/scheduling/turn_states.py): una palabra y un
   color en el panel, el calendario, «Día a día», el editor y la ficha de la
   finca, siempre con las insignias comunes y nunca con el naranja de la marca.
   En una cesión, debajo de la insignia, la finca de la otra parte. */
.turn-state-detail { display: block; margin-top: .2rem; color: var(--sc-muted); font-size: var(--sc-text-sm); font-weight: var(--sc-weight-regular); }

/* «Día a día» (OB-10): cada turno lleva a la izquierda el color de su fuente
   (el mismo --source-mark que la leyenda y la vista Lista), su estado con la
   insignia común y, si está disponible, el fondo de la vista Lista. El día de
   hoy se marca como su columna en la rejilla. Las tarjetas no se pueden pulsar:
   no reaccionan al ratón. */
.schedule-day-slots > .schedule-day-slot { position: relative; }
.schedule-day-slots > .schedule-day-slot::before { content: ""; position: absolute; inset: .6rem auto .6rem 0; width: 4px; border-radius: 0 2px 2px 0; background: var(--source-mark, var(--source-color, var(--sc-line-strong))); }
.schedule-day-slots > .schedule-day-slot.is-available { background: var(--sc-available-bg); }
.schedule-day-slot-state { display: block; margin-top: .3rem; }
.schedule-day-card h3 { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sc-space-1) var(--sc-space-2); }
.schedule-day-card.is-today { border-color: var(--sc-brand-line); }
.schedule-day-card.is-today > header { background: color-mix(in srgb, var(--sc-brand-soft) 70%, var(--sc-paper)); }

/* Turno de una versión con «Desde» y «Hasta» (OB-09): el aviso de horas
   invertidas ocupa toda la fila, como en el editor de cada finca. */
.form-grid > .schedule-row-warning { grid-column: 1 / -1; margin: 0; }

/* Puntos de corte: un solo bloque por condición, al final de la hoja para que manden sobre
   las reglas base. Escala común: 30rem (móvil estrecho), 48rem (móvil: tablas apiladas,
   cabeceras en columna), 64rem (navegación plegable, rejillas a una columna) y 80rem (el
   menú sin iconos entre 64 y 80rem). Propios de un componente, en su sección: 68rem
   (pantalla de acceso), 82rem (índice de la Ayuda) y 60/100rem («Día a día»). El bloque
   más estrecho va después: en el móvil manda sobre el de tableta. Las reglas de cada
   bloque conservan el orden que tenían. */
@media (min-width: 48rem) {
  /* Tablas largas: la cabecera queda fija dentro de su región desplazable. */
  .table-wrap, .table-responsive { max-height: calc(100vh - var(--sc-header-h) - 3rem); max-height: calc(100dvh - var(--sc-header-h) - 3rem); }
  /* Tablas que se desplazan en horizontal (app.js marca .is-overflowing): la columna de
     acciones de fila (data-label="", la última) queda fija al borde derecho, siempre a
     mano sin deslizar; las demás columnas pasan por debajo. Sin JavaScript, la tabla se
     desplaza como siempre. */
  :is(.table-wrap, .table-responsive).is-overflowing > table > tbody > tr > td[data-label=""]:last-child { position: sticky; z-index: 1; right: 0; background-color: var(--sc-paper); box-shadow: -.5rem 0 .75rem -.5rem rgb(24 24 27 / 18%), inset 1px 0 var(--sc-line); }
  :is(.table-wrap, .table-responsive).is-overflowing > table > tbody > tr:is(:hover:not(:has(.empty)), .is-inactive, .member-payment-row-overdue) > td[data-label=""]:last-child { background-color: inherit; }
  :is(.table-wrap, .table-responsive).is-overflowing > table:has(> tbody > tr > td[data-label=""]:last-child) > thead > tr > th:last-child { right: 0; box-shadow: -.5rem 0 .75rem -.5rem rgb(24 24 27 / 18%), inset 1px 0 var(--sc-line), inset 0 -1px var(--sc-line-strong); }
  .audit-ip-cell code { white-space: nowrap; }
  /* Con antetítulo, la acción de una cabecera de sección o de tarjeta se alinea con el
     título, no con el antetítulo (OA-08): baja lo que mide el antetítulo. */
  :is(.section-heading, .dashboard-card-heading):has(> div > .eyebrow:first-child) > :is(.button, .page-actions, form) { margin-top: calc(var(--sc-text-xs) * 1.5 + .2rem); }
  :is(.section-heading, .dashboard-card-heading):has(> div > .eyebrow:first-child) > a:not(.button) { margin-top: calc(var(--sc-text-xs) * 1.5 + .2rem - .6rem); }
  /* Si la barra de acciones masivas de Cuotas parte en dos filas (catalán, inglés), el envío
     se queda a la derecha y no huérfano a la izquierda (GKU-04). */
  .billing-bulk-toolbar > div.billing-bulk-group { margin-left: auto; }
}

/* Directorio de Comuneros desde 64rem (tableta en horizontal y escritorio): la tabla se
   ajusta al ancho y las ocho columnas iniciales caben sin desplazar; apellidos y nombre
   parten línea si hace falta (OA-01, GKU-01). Más estrecho, la tabla se desplaza con la
   columna de acciones fija. */
@media (min-width: 64rem) {
  .member-directory-table { width: 100%; }
  .member-directory-table td:is(.member-last-name-cell, .member-name-cell) { white-space: normal; }
}

@media (max-width: 63.99rem) {
  .nav-toggle { display: inline-flex; }
  .main-nav {
    position: absolute;
    z-index: 45;
    top: 100%;
    left: 0;
    right: 0;
    max-height: calc(100vh - var(--sc-header-h));
    max-height: calc(100dvh - var(--sc-header-h));
    padding: .5rem max(1rem, calc((100% - var(--sc-content)) / 2)) 1rem;
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: .1rem;
    overflow-y: auto;
    overscroll-behavior: contain;
    border-bottom: 1px solid var(--sc-line);
    background: var(--sc-paper);
    box-shadow: 0 18px 32px rgb(24 24 27 / 14%);
  }
  .main-nav.is-open { display: flex; }
  .main-nav > a { width: 100%; justify-content: flex-start; }
  .main-nav > a.is-active { box-shadow: inset 4px 0 var(--sc-brand-deep); }
  .nav-spacer { display: none; }
  .user-menu { margin-top: .4rem; padding-top: .4rem; border-top: 1px solid var(--sc-line); }
  .user-menu-toggle { display: none; }
  .user-menu-panel { position: static; width: auto; max-height: none; padding: 0; display: grid; gap: .1rem; overflow: visible; border: 0; background: transparent; box-shadow: none; }
  .user-menu-identity { padding-inline: .7rem; }
  .schedule-row-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .schedule-note-field { grid-column: 1 / -1; }
  .dashboard-grid { grid-template-columns: 1fr; }
  /* Hasta 64rem el buscador ocupa su fila y su ayuda va justo debajo (no tras «Filtrar»). */
  .filter-bar:has(> .filter-bar-help) > .filter-field:first-of-type { order: -2; }
  .filter-bar > .filter-bar-help { order: -1; margin-top: -.45rem; }
  .schedule-now-panel { grid-template-columns: minmax(0, 1fr); gap: .65rem; }
  .schedule-now-heading { display: flex; flex-wrap: wrap; align-items: baseline; gap: .15rem .75rem; }
}

@media (max-width: 47.99rem) {
  .form-disclosure > summary { width: 100%; justify-content: center; }
  /* Tablas apilables (contrato .table-stack): por debajo de 48rem cada fila es una
     tarjeta; cada celda muestra su data-label y la celda de acciones (data-label="")
     va al pie de la tarjeta. */
  .table-wrap:has(> table.table-stack), .table-responsive:has(> table.table-stack) { max-height: none; overflow: visible; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
  .table-wrap table.table-stack, .table-responsive table.table-stack, table.table-stack { min-width: 0; width: 100%; }
  .table-stack, .table-stack tbody, .table-stack tfoot { display: block; }
  .table-stack thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
  /* Cada ficha es un contenedor: la columna de etiquetas mide el 40 % de su ancho (cqi). */
  .table-stack tr { container-type: inline-size; margin: 0 0 .75rem; padding: .25rem 1rem; display: flex; flex-direction: column; border: 1px solid var(--sc-line); border-radius: var(--sc-radius-md); background: var(--sc-paper); box-shadow: var(--sc-shadow-sm); }
  .table-stack tbody tr:hover:not(:has(.empty)) { background: var(--sc-row-hover); }
  .table-stack tr.is-inactive { background: var(--sc-inactive-bg); }
  .table-stack tfoot tr { background: var(--sc-surface); }
  .table-stack td, .table-stack th { width: auto; min-width: 0; padding: .6rem 0; display: flow-root; border: 0; background: transparent; text-align: left; white-space: normal; overflow-wrap: anywhere; box-shadow: none; }
  .table-stack td + td, .table-stack td + th, .table-stack th + td { border-top: 1px solid var(--sc-line); }
  /* La etiqueta ocupa la columna común (40 %, entre 9 y 12rem: «Correo electrónico» o
     «Fecha de pago» caben en una línea a 390 px, GKU-07) y solo se ensancha si una
     palabra no cabe: no se parte a mitad de palabra («Extraordinari/a»). */
  .table-stack td::before, .table-stack tbody th::before, .table-stack tfoot th::before { content: attr(data-label); color: var(--sc-ink-soft); font-size: var(--sc-text-sm); font-weight: var(--sc-weight-semibold); line-height: 1.6; overflow-wrap: break-word; }
  /* Etiqueta y valor en dos columnas reales: la celda es una tabla de una fila cuya
     primera celda es la etiqueta (::before, 40 % entre 9 y 12rem; solo crece si una
     palabra no cabe) y la segunda, anónima, todo el contenido. Un valor de varias
     líneas (fuentes, direcciones, conceptos) se queda en su columna sin envoltorio en
     la plantilla; .table-stack-value ya no hace falta. */
  .table-stack tr:not(.table-total-row) > :is(td, th)[data-label]:not([data-label=""], [data-stack], .import-issues-cell, .table-wide-only, :empty) { display: table; width: 100%; table-layout: auto; border-collapse: separate; border-spacing: 0; }
  .table-stack tr:not(.table-total-row) > :is(td, th)[data-label]:not([data-label=""], [data-stack], .import-issues-cell, .table-wide-only, :empty)::before { display: table-cell; width: clamp(9rem, 40cqi, 12rem); padding-right: .85rem; vertical-align: top; }
  .table-stack td:not([data-label])::before, .table-stack td[data-label=""]::before, .table-stack th:not([data-label])::before { display: none; }
  .table-stack td[data-label=""] { order: 99; padding: .75rem 0 .6rem; border-top: 1px solid var(--sc-line); }
  .table-stack td[data-label=""]:first-child + td { border-top: 0; }
  .table-stack td[data-label=""] .table-actions > *, .table-stack td[data-label=""] > .button, .table-stack td[data-label=""] > a { min-height: var(--sc-tap); }
  .table-stack .table-stack-title, .table-stack [data-stack="title"] { order: -1; font-size: var(--sc-text-base); font-weight: var(--sc-weight-semibold); }
  .table-stack .table-stack-title::before, .table-stack [data-stack="title"]::before { display: none; }
  .table-stack td.number, .table-stack th.number { text-align: left; white-space: normal; }
  .table-stack td:empty { display: none; }
  /* Enlaces en un valor: 44 px de zona de pulsación (relleno con margen negativo) sin
     alargar la fila ni separar el texto de su etiqueta. */
  .table-stack td[data-label]:not([data-label=""]) > a { min-height: 0; display: inline-block; padding-block: .6875rem; margin-block: -.6875rem; }
  .page-shell { width: min(100% - 2rem, var(--sc-content)); padding-top: 1.5rem; }
  .site-header-inner, .tenant-bar-inner { width: min(100% - 2rem, var(--sc-content)); }
  .auth-language-switcher { margin: .8rem 1rem 0; }
  .page-heading { flex-direction: column; align-items: stretch; gap: 1rem; }
  .page-heading > .badge { align-self: flex-start; }
  .help-search-panel { grid-template-columns: 1fr; }
  .help-index nav { grid-template-columns: 1fr 1fr; }
  .help-section-label { align-items: flex-start; }
  .dashboard-heading { min-height: 0; }
  .page-actions, .page-heading > .button { width: 100%; }
  .page-heading-copy { flex: none; }
  .page-heading > .page-actions { max-width: none; }
  /* Acciones de cabecera: la principal arriba y a todo el ancho; las secundarias por
     parejas de la misma altura y, si son impares, la última a todo el ancho (la principal
     no cuenta para la pareja, OX-03). */
  .page-heading .page-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; }
  .page-heading .page-actions > :is(.button, form, details) { min-width: 0; white-space: normal; }
  .page-heading .page-actions > .button:not(.button-secondary, .button-quiet, .button-danger), .page-heading .page-actions > :only-child, .page-heading .page-actions > :nth-last-child(1 of :not(.button:not(.button-secondary, .button-quiet, .button-danger))):nth-child(odd of :not(.button:not(.button-secondary, .button-quiet, .button-danger))) { grid-column: 1 / -1; }
  .page-heading .page-actions > .button:not(.button-secondary, .button-quiet, .button-danger) { order: -1; }
  .page-actions .button { flex: 1 1 auto; }
  .now-panel { grid-template-columns: 1fr; }
  .now-panel:not(.schedule-now-panel) { gap: 1rem; }
  .card-grid, .detail-grid, .security-grid, .form-grid, .revision-meta { grid-template-columns: 1fr; }
  .card-grid { gap: .6rem; }
  .action-card { min-height: 4.75rem; }
  .schedule-source-field { grid-column: 1 / -1; }
  .notice:has(> .icon) { grid-template-columns: auto minmax(0, 1fr); }
  .notice:has(> .icon) > .button { grid-column: 1 / -1; width: 100%; }
  .audit-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .audit-detail-hero { grid-template-columns: 1fr; }
  .audit-detail-hero dl { grid-template-columns: 1fr; }
  .profile-data-grid, .profile-stats { grid-template-columns: 1fr; }
  .profile-data-grid > section { padding-right: 0; border-right: 0; border-bottom: 1px solid var(--sc-line); }
  .profile-data-grid > section:last-child { border-bottom: 0; }
  .member-plot-editor > header, .member-plot-card > header { align-items: flex-start; flex-direction: column; }
  .member-plot-editor > form, .profile-data-grid, .member-schedule-summary { padding: 1rem; }
  .field-wide { grid-column: auto; }
  .filter-bar > * { flex: 1 1 100%; max-width: none; }
  .member-directory-toolbar { justify-content: flex-start; flex-wrap: wrap; }
  .member-directory-toolbar .table-count { flex: 1 0 100%; }
  .member-directory-table td.member-stack-title { display: flow-root; }
  .member-directory-table .member-plots-cell, .member-directory-table .member-plots-cell > * { max-width: none; }
  /* Heredado: la columna de la etiqueta ya es estructural; no añadir usos nuevos. */
  .table-stack-value { display: flow-root; }
  .table-stack td .badge { max-width: 100%; white-space: normal; }
  /* En la ficha, los nombres de finca y la lista de turnos parten línea (como en la
     hoja de impresión): nada ensancha la tarjeta ni el documento. */
  .member-directory-table td.member-plots-cell > * { overflow: visible; white-space: normal; overflow-wrap: anywhere; }
  /* 44 px de zona de pulsación con el mismo ritmo aunque un nombre ocupe dos líneas;
     el primer enlace sube para quedar a la altura de su etiqueta. */
  .member-directory-table td.member-plots-cell > a { display: block; line-height: 1.5; }
  .member-directory-table .member-turn-list { max-width: none; }
  .table-stack tr.table-total-row { flex-flow: row wrap; align-items: baseline; justify-content: space-between; gap: 0 1rem; }
  .table-stack tr.table-total-row > :is(th, td) { border-top: 0; }
  .table-stack [data-stack="title"] .field-help { font-weight: var(--sc-weight-regular); }
  /* Filas del lote: el título (referencia) no es la primera celda y las incidencias
     ocupan todo el ancho, con su etiqueta encima. */
  .import-rows-table [data-stack="title"] { border-top: 0; }
  .import-rows-table tr:has(> [data-stack="title"]) > td:first-child { border-top: 1px solid var(--sc-line); }
  .table-stack .import-issues-cell::before { display: block; padding: 0 0 .35rem; }
  .member-view-switcher { flex: 1 1 auto; margin: 0; }
  .member-view-switcher button { flex: 1 1 50%; }
  .member-column-picker { flex: 1 1 auto; }
  .member-column-picker > summary { width: 100%; }
  .member-column-picker fieldset { right: 0; left: auto; width: min(19rem, calc(100vw - 2rem)); }
  .filter-actions { align-items: stretch; }
  .filter-actions > * { flex: 1 1 auto; }
  .table-wrap table, .table-responsive table { min-width: 42rem; }
  .table-wrap.table-compact table { min-width: 32rem; }
  th, td { padding: .72rem; }
  .list-card { align-items: flex-start; }
  .form-card { padding: 1.15rem 1rem; }
  .form-section { padding-inline: .9rem; }
  :is(.form-section, .member-plot-editor) .form-section { padding-inline: 0; }
  .form-actions > * { flex: 1 1 auto; }
  /* Filas de botones de pie de página: mismo reparto que .form-actions y .page-actions. */
  .button-row > :is(.button, button, form) { flex: 1 1 auto; }
  .button-row > form > :is(.button, button) { width: 100%; }
  .weekly-calendar { padding: .35rem; font-size: var(--sc-text-sm); }
  .weekly-calendar .fc-toolbar { align-items: stretch; gap: .45rem; flex-direction: column; }
  .weekly-calendar .fc-toolbar-chunk { display: flex; justify-content: center; }
  .schedule-section-heading { align-items: flex-start; flex-direction: column; }
  .schedule-legend { justify-content: flex-start; }
  .schedule-calendar-shell { padding: .75rem; }
  .weekly-calendar { min-height: 31rem; padding: 0; }
  .weekly-calendar .fc-toolbar { margin-top: .75rem; }
  .weekly-calendar .fc-toolbar-chunk { width: 100%; }
  .weekly-calendar .fc-toolbar-chunk > * { flex: 1 1 auto; }
  .schedule-day-grid { grid-template-columns: 1fr; }
  .file-list li { align-items: flex-start; flex-direction: column; gap: .2rem; }
  .policy-summary { grid-template-columns: 1fr 1fr; }
  .billing-status-grid { grid-template-columns: 1fr; }
  .pagination-bar { align-items: flex-start; flex-direction: column; }
  .billing-concept-list > div { align-items: flex-start; }
  /* Cabeceras de sección y de tarjeta del panel: el enlace o la acción pasan debajo y el
     título usa todo el ancho (OF-9). */
  :is(.section-heading, .dashboard-card-heading) { grid-template-columns: minmax(0, 1fr); }
  .section-heading > :is(.button, .page-actions, form) { width: 100%; }
  :is(.section-heading, .dashboard-card-heading) > a:not(.button) { justify-self: start; margin-block: -.4rem -.6rem; }
  .member-availability-heading, .member-directory-card-heading { align-items: stretch; flex-direction: column; }
  .member-availability-heading .button, .member-directory-actions { width: 100%; }
  .member-directory-actions .button { flex: 1 1 auto; }
  .member-directory-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .member-directory-plot { grid-template-columns: 1fr; gap: .7rem; }
  .member-directory-turn { grid-template-columns: minmax(0, 1fr) auto; }
  .member-turn-state, .member-turn-note { grid-column: 1 / -1; }
  .member-directory-plot > .empty-inline { grid-column: auto; }
  .plot-schedule-workspace { align-items: stretch; flex-direction: column; }
  .plot-schedule-workspace form, .plot-schedule-workspace button { width: 100%; }
  .schedule-editor-heading { align-items: stretch; flex-direction: column; }
  .schedule-editor-heading .button { width: 100%; }
  .simple-schedule-row > header { align-items: flex-start; }
  .simple-schedule-row > header > div { align-items: flex-start; flex-direction: column; gap: .15rem; }
  .slot-year-filter { width: 100%; align-items: stretch; }
  .slot-year-filter label { align-self: center; }
  .slot-year-filter input { min-width: 0; width: 100%; }
  .slot-disposition-actions, .slot-disposition-actions > *, .slot-disposition-card details, .slot-disposition-card summary { width: 100%; }
  .site-footer-inner { align-items: flex-start; flex-direction: column; gap: .2rem; }
  .auth-main { padding: .5rem 1rem 2.5rem; }
  .auth-card { padding: 1.6rem 1.35rem; }
  .auth-card::before, .auth-card::after { width: 3.5rem; height: 3.5rem; }
  .auth-panel-status { margin-bottom: 1.1rem; }
  .publication-panel, .document-finalize { align-items: stretch; flex-direction: column; }
  .publication-panel form, .publication-panel button, .document-finalize form, .document-finalize button { width: 100%; }
  .table-stack .table-stack-only { display: inline; }
  .table-stack .table-wide-only { display: none; }
  /* F3 · Listado de fincas (OB-20): la ficha apilada lleva el titular en una sola fila con
     su nombre completo, como Comuneros; apellidos y nombre por separado solo en la tabla ancha. */
  .plot-list-table td.table-stack-only { display: flow-root; }
  /* El título sube con order: -1; la raya separa ahora el primer campo, no el título. */
  .table-stack [data-stack="title"] { border-top: 0; }
  .table-stack tr:has(> [data-stack="title"]) > :first-child:not([data-stack="title"], [data-label=""]) { border-top: 1px solid var(--sc-line); }
  .table-stack [data-stack="title"] :is(small, code) { font-weight: var(--sc-weight-regular); }
  /* data-stack="block": la etiqueta encima y el contenido a todo el ancho. */
  .table-stack td[data-stack="block"]::before { display: block; padding: 0 0 .35rem; }
  .table-wrap.table-compact table.table-stack { min-width: 0; }
  .table-stack .billing-selection-cell { width: auto; text-align: left; }
  .table-stack .billing-selection-cell .selection-target { width: 100%; min-height: var(--sc-tap); justify-content: flex-start; }
  .billing-bulk-toolbar { display: grid; grid-template-columns: minmax(0, 1fr); }
  .billing-bulk-group { flex-direction: column; align-items: stretch; }
  .billing-bulk-field :is(input, select), .billing-bulk-group > button { width: 100%; }
  .billing-bulk-field > .date-echo { position: static; margin-top: .3rem; white-space: normal; }
  .billing-bulk-toolbar:has(.date-echo:not(:empty)) { row-gap: .75rem; }
  /* Cifras de resumen en móvil: una por fila, la etiqueta a la izquierda y la cifra a la
     derecha (totales de Cuotas, resúmenes de confirmación, emisión e importación). */
  .preview-summary { grid-template-columns: 1fr; gap: .5rem; }
  .preview-summary .stat-card { grid-template-columns: minmax(0, 1fr) auto; column-gap: 1rem; padding-block: .7rem; }
  .preview-summary .stat-card > strong { grid-column: 2; grid-row: 1 / span 2; align-self: center; margin: 0; text-align: right; }
  .table-stack .audit-change-summary > div { grid-template-columns: minmax(0, 1fr); gap: .15rem; }
  .table-stack .audit-object-id { max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
  /* Pausas y cesiones: las dos acciones de un turno disponible, del mismo ancho. */
  .slot-disposition-actions form .button { width: 100%; }
}

@media (max-width: 29.99rem) {
  .segmented-nav { width: 100%; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .schedule-row-grid { grid-template-columns: minmax(0, 1fr); }
  .clock-select { width: 100%; }
  .site-header .brand-copy { display: none; }
  .auth-mobile-brand .brand-copy { display: flex; }
  .tenant-label { display: none; }
  .help-index nav { grid-template-columns: 1fr; }
  .schedule-now-heading h2 { white-space: normal; }
  .policy-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .policy-summary > :first-child { grid-column: 1 / -1; }
  .audit-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .audit-metrics article { min-height: 4.75rem; padding: .8rem .9rem; }
}

@media (pointer: fine) {
  /* El directorio de comuneros es una tabla compacta (filas de una línea): con ratón
     sus acciones no necesitan la zona de 44 px, que sí conservan en pantallas táctiles. */
  .member-table-actions .table-actions > a { min-height: 0; }
}

@media (pointer: coarse) {
  :is(td[data-stack="title"], .member-last-name-cell, .member-name-cell) > a { display: inline-block; padding-block: .6875rem; margin-block: -.6875rem; }
  /* Pantallas táctiles: zona de pulsación de 44 px para todo enlace independiente (hijo
     directo de un bloque de maquetación, no dentro de una frase, un aviso o una ayuda), sin
     lista de clases: un enlace nuevo ya la tiene. Especificidad cero: los componentes que
     fijan su propia caja (.list-card, botones) mandan. Las clases de abajo cubren enlaces
     dentro de listas, párrafos o títulos que también actúan como controles. */
  :where(main :is(div, section, header, footer, nav, article, aside, form, fieldset):not(.notice, .field-help, .message, .help-tip-text) > a:not(.button)) { min-height: var(--sc-tap); display: inline-flex; align-items: center; }
  .page-back { min-height: var(--sc-tap); margin-block: -.75rem -.15rem; }
  .language-switcher .language-option, .link-button, .member-column-order button, .help-index nav a, .help-tip, .table-actions button, td > form button { min-height: var(--sc-tap); }
  .member-column-order button, .help-tip { width: var(--sc-tap); }
  .member-table-actions a, .member-plots-cell > a, .table-sort-link, .filter-check, .schedule-delete-toggle, .member-column-picker label { min-height: var(--sc-tap); }
  .member-directory-plot-heading h3 a, .member-directory-title-row h2 > a, .management-list li > a { min-height: var(--sc-tap); display: inline-flex; align-items: center; }
  .member-plots-cell > a { line-height: var(--sc-tap); }
  .brand, .table-actions > a, .member-table-actions a, .table-sort-link { min-width: var(--sc-tap); justify-content: center; }
  .dashboard-facts a, .now-refresh a, .overdue-list a, .help-pdf-link, .dashboard-card-heading > a, .weekly-calendar .fc-button { min-height: var(--sc-tap); }
  .overdue-list a, .help-pdf-link { display: inline-flex; align-items: center; }
  :where(input[type="checkbox"], input[type="radio"]) { width: 1.5rem; height: 1.5rem; }
  .selection-target, .billing-bulk-selection > .billing-select-all, .field-check > .check-row { min-height: var(--sc-tap); }
  .selection-target { min-width: var(--sc-tap); }
  .blocked-ip-table button { min-height: var(--sc-tap); }
  .field-check > .field-help, .field-check > .errorlist { margin-left: 2.25rem; }
  .weekly-calendar .fc-timegrid-event:is(.schedule-event-micro, .schedule-event-tiny)::before { inset: -.6rem 0; }
}

@media (forced-colors: active) {
  .segmented-nav :is(a[aria-current="page"], button[aria-pressed="true"]) { outline: 2px solid CanvasText; }
  :where(select:not([multiple], [size])) { padding-right: .75rem; appearance: auto; -webkit-appearance: menulist; background-image: none; }
  .main-nav a.is-active, .language-switcher .language-option.is-active, .user-menu.is-active .user-menu-toggle { outline: 2px solid CanvasText; }
  .fee-progress-bar { background: Highlight; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

@media print {
  .segmented-nav { display: none !important; }
  .billing-selection-cell { display: none !important; }
  html { font-size: 11pt; scroll-padding-top: 0; }
  body { display: block; min-height: 0; padding: 0 !important; background: #fff; color: #000; }
  .skip-link, .site-header, .tenant-bar, .setup-banner, .site-footer, .messages, .nav-toggle, .page-actions, .button-row, .form-actions, .table-hint, .filter-bar, .billing-bulk-toolbar, .member-directory-toolbar, .member-column-picker, .pagination-bar .button-row, .help-search-panel, .help-index, .now-refresh, .schedule-calendar-shell, .danger-zone, .form-error-summary, button, .button, [data-print-hide] { display: none !important; }
  .page-shell { width: 100%; margin: 0; padding: 0; }
  a { color: inherit; text-decoration: none; }
  h1 { font-size: 18pt; }
  h2 { margin-top: 12pt; font-size: 14pt; break-after: avoid; }
  h3 { font-size: 12pt; break-after: avoid; }
  .card, .surface-card, .summary-card, .dashboard-card, .now-panel, .form-card, .form-section, .list-card, .schedule-day-card, .member-directory-card, .policy-card, .document-sheet { border-color: #bbb; box-shadow: none; break-inside: avoid; }
  .document-sheet { page: portrait; border: 0; padding: 0; }
  .table-wrap, .table-responsive { max-height: none !important; overflow: visible !important; border: 0; border-radius: 0; box-shadow: none; }
  .table-wrap table, .table-responsive table, table, .member-directory-table { width: 100% !important; min-width: 0 !important; }
  table, table * { font-size: 8.5pt !important; }
  .member-table-actions { display: none !important; }
  thead { display: table-header-group; }
  .table-wrap thead th, .table-responsive thead th { position: static; }
  tr, img { break-inside: avoid; }
  th, td { padding: 3pt 5pt !important; border-bottom: .5pt solid #999; white-space: normal !important; overflow-wrap: anywhere; }
  th { background: #eee !important; color: #000; }
  td[class*="member-"], th[data-column], .member-turn-cell, .member-name-cell, .member-email-cell, .member-phone-cell, .member-plots-cell, .member-payment-cell, .member-sources-cell, .member-schedule-cell { width: auto !important; min-width: 0 !important; max-width: none !important; }
  .member-plots-cell > * { max-width: none; white-space: normal; }
  .member-turn-list { max-width: none; }
  .schedule-agenda { margin-top: 0; }
  .schedule-day-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .badge { border-color: #999; background: none !important; color: #000; }
  .clickable-row { cursor: default; }
  .schedule-turn-dialog { display: none !important; }
}