/* agenda.css — estilos del Calendario (42.7, calendario.md 3 y 6.1).
   Los colores y los tamaños son los del panel (--bg, --card, --ink, --muted, --brand… de app.css, que ya cambian solos en el tema oscuro) y las
   piezas (botón, entrada, aviso, tarjeta) son las de catalogo.css: la página cuelga de `.cat44`. Aquí solo lo propio del Calendario, todo con
   el prefijo `.ag-`. Las tarjetas de aviso (`.ag-avisos`) van fuera de `.cat44`, dentro de #app, y traen sus propios botones.
   Escritorio: cuadrícula del mes con renglones, rejilla de horas (48 px por hora) en semana y día, y «Próximos» a la derecha.
   Teléfono (≤ 880 px): puntos de color y lista del día en el mes, lista vertical por día en semana y día, hoja a pantalla completa y
   «Nuevo» como botón redondo encima de la barra de abajo. */

/* ── Siete colores de categoría, con buen contraste (≥ 4.2:1 contra el fondo y contra el tinte) en claro y en oscuro ── */
.cat44 {
  --ag-general: #566870;
  --ag-reunion: #1b6cb3;
  --ag-visita: #7448ad;
  --ag-feriado: #b3261e;
  --ag-promocion: #9a6200;
  --ag-tiendas: #0b7358;
  --ag-pendiente: #bf3f08;
  --ag-hora: 48px;       /* alto de una hora en la rejilla (el mismo de PX_POR_HORA en agenda-logica.js) */
  --ag-gutter: 56px;
}
html[data-theme="dark"] .cat44 {
  --ag-general: #a9b9be;
  --ag-reunion: #78b5ec;
  --ag-visita: #c2a4e8;
  --ag-feriado: #f19088;
  --ag-promocion: #ecb552;
  --ag-tiendas: #5fcfae;
  --ag-pendiente: #f6a074;
}
.cat44 .ag-cat--general { --ag-c: var(--ag-general); }
.cat44 .ag-cat--reunion { --ag-c: var(--ag-reunion); }
.cat44 .ag-cat--visita { --ag-c: var(--ag-visita); }
.cat44 .ag-cat--feriado { --ag-c: var(--ag-feriado); }
.cat44 .ag-cat--promocion { --ag-c: var(--ag-promocion); }
.cat44 .ag-cat--tiendas { --ag-c: var(--ag-tiendas); }
.cat44 .ag-cat--pendiente { --ag-c: var(--ag-pendiente); }

.cat44 .ag { display: grid; gap: 14px; min-width: 0; }
.cat44 .ag-raiz { min-width: 0; }

/* ── Barra de arriba ───────────────────────────────────────────────────────────────── */
.cat44 .ag-barra { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; }
.cat44 .ag-nav { display: flex; align-items: center; gap: 8px; min-width: 0; }
.cat44 .ag-periodo { margin: 0 0 0 6px; font-size: 18px; font-weight: 800; letter-spacing: -0.015em; line-height: 1.2; min-width: 0; }
.cat44 .ag-vistas { justify-self: auto; }
.cat44 .ag-herramientas { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.cat44 .ag-aviso-accion { align-items: center; }
.cat44 .ag-aviso-accion .aviso__texto { flex: 1; }
/* El mensaje de lo último que se hizo («Creado», «Borrado» con «Deshacer», un error) va en una caja de alto fijo: ni al salir, ni al cambiar de
   forma, ni al quitarse solo mueve la cuadrícula. */
.cat44 .ag-mensaje { display: grid; align-content: start; min-height: 50px; }

.cat44 .ag-cuerpo { display: grid; grid-template-columns: minmax(0, 1fr) 270px; gap: 18px; align-items: start; }
.cat44 .ag-principal { display: grid; gap: 14px; min-width: 0; }
.cat44 .ag-principal[aria-busy="true"] .ag-mes, .cat44 .ag-principal[aria-busy="true"] .ag-semana { opacity: 0.7; }

/* ── Próximos ──────────────────────────────────────────────────────────────────────── */
.cat44 .ag-lateral { background: var(--c-sup); border: 1px solid var(--c-linea); border-radius: var(--c-r-grande); box-shadow: var(--shadow); padding: 14px; display: grid; gap: 4px; align-content: start; }
.cat44 .ag-lateral .sec-titulo__h3 { margin: 0 0 6px; }
.cat44 .ag-items { display: grid; gap: 6px; }

/* Un renglón de lista (Próximos, búsqueda y listas del teléfono): hora, título y categoría en texto. */
.cat44 .ag-item {
  display: grid; gap: 1px; width: 100%; padding: 7px 10px; text-align: left; cursor: pointer;
  background: color-mix(in srgb, var(--ag-c, var(--ag-general)) 12%, var(--c-sup)); color: var(--c-tinta);
  border: 1px solid var(--c-linea); border-left: 4px solid var(--ag-c, var(--ag-general)); border-radius: 8px;
}
.cat44 .ag-item:hover { border-color: var(--ag-c, var(--ag-general)); }
.cat44 .ag-item__hora { font-size: 12px; font-weight: 700; color: var(--c-apoyo); }
.cat44 .ag-item__t { font-weight: 700; overflow-wrap: anywhere; }
.cat44 .ag-item__cat { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: var(--c-apoyo); }
.cat44 .ag-item__cat .ico { color: var(--ag-c, var(--ag-general)); width: 14px; height: 14px; }

/* ── Mes ───────────────────────────────────────────────────────────────────────────── */
.cat44 .ag-mes { width: 100%; table-layout: fixed; border-collapse: separate; border-spacing: 4px; }
.cat44 .ag-mes th { background: none; color: var(--c-apoyo); font-size: 12px; font-weight: 700; text-align: center; padding: 0 0 2px; border: 0; }
.cat44 .ag-mes td { padding: 0; vertical-align: top; border: 0; }
.cat44 .ag-vacio { background: none; }
.cat44 .ag-celda {
  position: relative; display: flex; flex-direction: column; gap: 3px; min-height: 118px; padding: 4px 5px 5px; min-width: 0;
  background: var(--c-sup); border: 1px solid var(--c-linea); border-radius: 8px; cursor: pointer;
}
.cat44 .ag-celda:hover { border-color: var(--c-borde); }
.cat44 .ag-celda--elegida { border-color: var(--brand-2); background: color-mix(in srgb, var(--brand-2) 9%, var(--c-sup)); }
.cat44 .ag-celda--hoy { box-shadow: inset 0 0 0 2px var(--c-tinta); }
.cat44 .ag-num {
  align-self: flex-start; min-width: 26px; min-height: 26px; padding: 0 6px; background: none; border: 0; border-radius: 13px;
  font-weight: 700; font-variant-numeric: tabular-nums; color: var(--c-tinta); cursor: pointer;
}
.cat44 .ag-celda--hoy .ag-num { background: var(--c-tinta); color: var(--c-sup); }
.cat44 .ag-renglones { display: grid; gap: 2px; margin: 0; padding: 0; min-width: 0; }
.cat44 .ag-renglones > li { min-width: 0; }
.cat44 .ag-reng {
  display: flex; align-items: center; gap: 4px; width: 100%; min-height: 22px; padding: 1px 5px; overflow: hidden; text-align: left; cursor: pointer;
  font-size: 12px; line-height: 1.25; color: var(--c-tinta);
  background: color-mix(in srgb, var(--ag-c, var(--ag-general)) 14%, var(--c-sup)); border: 0; border-left: 3px solid var(--ag-c, var(--ag-general)); border-radius: 4px;
}
.cat44 .ag-reng:hover { background: color-mix(in srgb, var(--ag-c, var(--ag-general)) 24%, var(--c-sup)); }
.cat44 .ag-reng .ico { width: 12px; height: 12px; color: var(--ag-c, var(--ag-general)); }
.cat44 .ag-reng__hora { flex: none; font-weight: 700; font-size: 11px; color: var(--c-apoyo); }
.cat44 .ag-reng__t { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cat44 .ag-cont { flex: none; font-size: 10.5px; color: var(--c-apoyo); }
.cat44 .ag-mas { background: none; border: 0; padding: 0 5px; min-height: 20px; font-size: 12px; font-weight: 700; color: var(--c-acc); cursor: pointer; }
.cat44 .ag-reng--precios { --ag-c: var(--brand-2); background: var(--c-acc-suave); }
.cat44 .ag-reng--precios .ico { color: var(--c-acc); }
.cat44 .ag-lapiz { display: inline-flex; align-items: center; gap: 2px; flex: none; margin-left: auto; color: var(--c-apoyo); font-weight: 700; }
.cat44 .ag-lapiz .ico { width: 11px; height: 11px; }
.cat44 .ag-borrado, .cat44 .ag-borrado .ag-reng__t, .cat44 .ag-borrado .ag-item__t, .cat44 .ag-borrado .ag-bloque__t { text-decoration: line-through; }
.cat44 .ag-borrado { opacity: 0.7; }
.cat44 .ag-puntos { display: none; }
.cat44 .ag-lista-dia, .cat44 .ag-lista-movil { display: none; }

/* ── Semana y día: la rejilla de horas ─────────────────────────────────────────────── */
.cat44 .ag-semana { --ag-cols: 7; background: var(--c-sup); border: 1px solid var(--c-linea); border-radius: var(--c-r-grande); box-shadow: var(--shadow); overflow: hidden; min-width: 0; }
.cat44 .ag-semana[data-columnas="1"] { --ag-cols: 1; }
.cat44 .ag-sem-cab, .cat44 .ag-todo { display: grid; grid-template-columns: var(--ag-gutter) repeat(var(--ag-cols), minmax(0, 1fr)); border-bottom: 1px solid var(--c-linea); }
.cat44 .ag-gutter { padding: 6px 6px 6px 0; font-size: 11px; font-weight: 700; color: var(--c-apoyo); text-align: right; align-self: center; }
.cat44 .ag-sem-dia {
  display: grid; justify-items: center; gap: 0; padding: 6px 2px; background: none; border: 0; border-left: 1px solid var(--c-linea);
  color: var(--c-apoyo); font-size: 12px; font-weight: 700; cursor: pointer; text-transform: capitalize;
}
.cat44 .ag-sem-dia b { font-size: 18px; line-height: 1.2; color: var(--c-tinta); font-variant-numeric: tabular-nums; }
.cat44 .ag-sem-dia--hoy b { display: inline-grid; place-items: center; min-width: 30px; height: 30px; border-radius: 15px; background: var(--c-tinta); color: var(--c-sup); }
.cat44 .ag-todo-col { display: grid; align-content: start; gap: 2px; min-height: 30px; padding: 3px; border-left: 1px solid var(--c-linea); min-width: 0; cursor: pointer; }
.cat44 .ag-rejilla { display: grid; grid-template-columns: var(--ag-gutter) repeat(var(--ag-cols), minmax(0, 1fr)); max-height: min(640px, 72vh); overflow-y: auto; position: relative; }
.cat44 .ag-hora { height: var(--ag-hora); position: relative; }
.cat44 .ag-hora span { position: absolute; top: -8px; right: 6px; font-size: 11px; color: var(--c-apoyo); white-space: nowrap; }
.cat44 .ag-hora:first-child span { display: none; }
.cat44 .ag-col {
  position: relative; height: calc(var(--ag-hora) * 24); min-width: 0; border-left: 1px solid var(--c-linea); cursor: pointer;
  background-image: repeating-linear-gradient(to bottom, transparent 0, transparent calc(var(--ag-hora) - 1px), var(--c-linea) calc(var(--ag-hora) - 1px), var(--c-linea) var(--ag-hora));
}
.cat44 .ag-bloque {
  position: absolute; display: grid; align-content: start; gap: 0; padding: 2px 5px; overflow: hidden; text-align: left; cursor: pointer; z-index: 1;
  font-size: 12px; line-height: 1.25; color: var(--c-tinta);
  background: color-mix(in srgb, var(--ag-c, var(--ag-general)) 18%, var(--c-sup)); border: 0; border-left: 3px solid var(--ag-c, var(--ag-general)); border-radius: 6px;
  box-shadow: 0 0 0 1px var(--c-sup);
}
.cat44 .ag-bloque:hover { background: color-mix(in srgb, var(--ag-c, var(--ag-general)) 28%, var(--c-sup)); }
.cat44 .ag-bloque__t { display: flex; align-items: center; gap: 4px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cat44 .ag-bloque__t .ico { width: 12px; height: 12px; flex: none; color: var(--ag-c, var(--ag-general)); }
.cat44 .ag-bloque__h { font-size: 11px; color: var(--c-apoyo); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cat44 .ag-ahora { position: absolute; left: 0; right: 0; height: 2px; background: var(--err); z-index: 2; pointer-events: none; }
.cat44 .ag-ahora::before { content: ""; position: absolute; left: -4px; top: -3px; width: 8px; height: 8px; border-radius: 50%; background: var(--err); }

/* ── Precios de {mes} ──────────────────────────────────────────────────────────────── */
.cat44 .ag-precios-mes { display: grid; gap: 4px; }
.cat44 .ag-precios-mes .tramos { grid-template-columns: minmax(130px, 200px) minmax(0, 1fr); }

/* ── Hojas: detalle, formulario, filtros, búsqueda y precios del día ───────────────── */
.cat44 .ag-fondo { position: fixed; inset: 0; z-index: 60; background: rgba(10, 20, 22, 0.45); }
.cat44 .ag-hoja {
  position: fixed; z-index: 61; top: 50%; left: 50%; transform: translate(-50%, -50%);
  display: flex; flex-direction: column; width: min(560px, calc(100vw - 32px)); max-height: calc(100vh - 48px); max-height: calc(100dvh - 48px); overflow-y: auto;
  background: var(--card); color: var(--ink); border: 1px solid var(--line-strong); border-radius: var(--radius-lg); box-shadow: var(--shadow-lg);
}
.cat44 .ag-hoja:focus { outline: none; }
.cat44 .ag-hoja__cab {
  position: sticky; top: 0; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 14px;
  background: var(--card); border-bottom: 1px solid var(--line);
}
.cat44 .ag-hoja__cab h2 { flex: 1; min-width: 0; margin: 0; font-size: 16px; font-weight: 800; letter-spacing: -0.01em; overflow-wrap: anywhere; }
.cat44 .ag-hoja__cab h2:not(:only-child) { text-align: left; }
.cat44 .ag-hoja__cab button:first-child + h2 { text-align: center; }
.cat44 .ag-hoja__cuerpo { display: grid; gap: 14px; padding: 16px; min-width: 0; }
.cat44 .ag-hoja__cuerpo p { margin: 0; }
.cat44 .ag-cat { display: inline-flex; align-items: center; gap: 7px; justify-self: start; color: var(--c-tinta); }
.cat44 .ag-cat .ico { width: 18px; height: 18px; color: var(--ag-c, var(--ag-general)); }
.cat44 .ag-cat-muestra {
  display: inline-grid; place-items: center; flex: none; width: 36px; height: 36px; border-radius: var(--c-r); border: 1px solid var(--c-borde);
  background: color-mix(in srgb, var(--ag-c, var(--ag-general)) 16%, var(--c-sup));
}
.cat44 .ag-cat-muestra .ico { color: var(--ag-c, var(--ag-general)); width: 18px; height: 18px; }
.cat44 .ag-categoria { display: flex; align-items: center; gap: 8px; }
.cat44 .ag-categoria select { flex: 1; }
.cat44 .ag-cuando { font-weight: 700; }
.cat44 .ag-detalle { white-space: pre-wrap; overflow-wrap: anywhere; }
/* N-CAL-TODO-DIA: la casilla arranca debajo del rótulo de Fecha (18 px de rótulo + 5 de separación) y no al final de la celda: con «Fecha fuera
   de rango» bajo el campo, `align-self: end` la dejaba 23 px más abajo que él. */
.cat44 .ag-todo-dia { align-self: start; margin-top: 23px; box-sizing: border-box; height: 36px; padding-top: 0; padding-bottom: 0; line-height: 1.2; } /* el alto de .entrada */
.cat44 .ag-horas-campos[hidden] { display: none; }
.cat44 .ag-historial { display: grid; gap: 6px; padding-top: 12px; border-top: 1px solid var(--c-linea); }
.cat44 .ag-historial__lista { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.cat44 .ag-historial__lista li { display: grid; gap: 1px; }
.cat44 .ag-historial__quien { font-weight: 700; font-size: 13px; }
.cat44 .ag-filtros fieldset { margin: 0; }
.cat44 .ag-filtros__categorias { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.cat44 .ag-filtros__categorias .confirmar span { display: inline-flex; align-items: center; gap: 6px; }
.cat44 .ag-filtros__categorias .ico { color: var(--ag-c, var(--ag-general)); }
.cat44 .ag-filtros__otros { display: grid; gap: 8px; }
.cat44 .formulario--linea input[type="search"] { min-width: 0; }

/* ── Recordatorios dentro del panel (fuera de .cat44, dentro de #app) ──────────────── */
/* Arriba a la derecha, compactas, dentro de la franja del título: no tapan la barra del Calendario. */
.ag-avisos { position: fixed; top: 6px; right: 16px; z-index: 70; display: grid; gap: 6px; width: min(400px, calc(100vw - 32px)); pointer-events: none; }
.ag-avisos:empty { display: none; }
.ag-avisos > * { pointer-events: auto; }
.ag-aviso {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px 10px; padding: 8px 10px 8px 12px; background: var(--card); color: var(--ink);
  border: 1px solid var(--line-strong); border-left: 4px solid var(--brand-2); border-radius: 10px; box-shadow: var(--shadow-lg);
}
.ag-aviso__texto { display: grid; gap: 1px; min-width: 0; }
.ag-aviso__texto b { font-size: 14px; line-height: 1.25; overflow-wrap: anywhere; }
.ag-aviso__texto span { font-size: 12.5px; color: var(--muted); }
.ag-aviso__botones { display: flex; gap: 6px; }
.ag-aviso__boton, .ag-aviso__mas {
  min-height: 32px; padding: 3px 12px; font: inherit; font-size: 13px; font-weight: 700; cursor: pointer;
  background: var(--card); color: var(--ink); border: 1px solid var(--line-strong); border-radius: 8px;
}
.ag-aviso__boton:hover, .ag-aviso__mas:hover { background: var(--brand-light); }
.ag-aviso__boton:focus-visible, .ag-aviso__mas:focus-visible { outline: 2px solid var(--brand-2); outline-offset: 2px; }
.ag-aviso__mas { justify-self: end; box-shadow: var(--shadow); }

/* ── Escritorio y anchos medios ────────────────────────────────────────────────────── */
@media (min-width: 881px) {
  /* El detalle se ancla arriba en vez de centrarse: al llegar «Historial» crece hacia abajo y «Editar» y «Borrar» no se mueven. */
  .cat44 .ag-hoja[data-hoja="detalle"] {
    top: 12vh; transform: translateX(-50%);
    max-height: calc(100vh - 12vh - 24px); max-height: calc(100dvh - 12vh - 24px);
  }
}
/* De 881 a 1180 px (una ventana angosta, un iPad en horizontal) con el menú lateral a la vista, el mes en siete columnas junto a «Próximos» deja celdas
   de 40 a 60 px donde los eventos no se leen: «Próximos» baja debajo de la cuadrícula y el mes toma todo el ancho. Como la lista «Precios de {mes}» es de
   la misma columna que el mes y mide hasta dos pantallas, «Próximos» iba después de ella: `.ag-principal` deja de ser una caja (display: contents) y sus
   hijos y «Próximos» se ordenan juntos: la cuadrícula, «Próximos» y al final la lista de precios. */
@media (min-width: 881px) and (max-width: 1180px) {
  .cat44 .ag-cuerpo { grid-template-columns: minmax(0, 1fr); }
  .cat44 .ag-cuerpo { row-gap: 14px; }
  .cat44 .ag-principal { display: contents; }
  .cat44 .ag-lateral { order: 1; }
  .cat44 .ag-precios-mes { order: 2; }
  .cat44 .ag-lateral .ag-items { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
}

/* ── Teléfono ──────────────────────────────────────────────────────────────────────── */
@media (max-width: 880px) {
  .cat44 .ag-cuerpo { grid-template-columns: minmax(0, 1fr); }
  .cat44 .ag-lateral { display: none; }
  .cat44 .ag-barra { gap: 8px; }
  .cat44 .ag-nav { flex-wrap: wrap; width: 100%; }
  .cat44 .ag-periodo { flex: 1 0 100%; order: -1; margin: 0 0 2px; font-size: 17px; }
  .cat44 .ag-vistas { flex: 1; }
  .cat44 .ag-vistas .lugar { flex: 1; }
  .cat44 .ag-herramientas { width: 100%; }
  .cat44 .ag-herramientas .boton { flex: 1; }

  /* Mes: cuadrícula compacta con puntos de color; debajo, la lista del día elegido. */
  .cat44 .ag-mes { border-spacing: 2px; }
  .cat44 .ag-celda { min-height: 50px; align-items: center; justify-content: flex-start; gap: 2px; padding: 3px 1px; }
  .cat44 .ag-renglones { display: none; }
  .cat44 .ag-num { align-self: center; min-height: 28px; }
  .cat44 .ag-puntos { display: flex; justify-content: center; gap: 3px; min-height: 8px; }
  .cat44 .ag-punto { display: block; width: 6px; height: 6px; border-radius: 50%; background: var(--ag-c, var(--ag-general)); }
  .cat44 .ag-punto--precios { border-radius: 1px; background: var(--c-acc); transform: rotate(45deg); }
  .cat44 .ag-lista-dia { display: grid; gap: 6px; }
  .cat44 .ag-lista-dia .ag-reng { min-height: 36px; font-size: 13px; padding: 4px 8px; }

  /* Semana y día: lista vertical por día, sin rejilla de horas. */
  .cat44 .ag-semana { display: none; }
  .cat44 .ag-lista-movil { display: grid; gap: 14px; }

  /* La hoja ocupa la pantalla; «Cancelar» y «Guardar» quedan fijos arriba. */
  .cat44 .ag-fondo { background: transparent; }
  .cat44 .ag-hoja { inset: 0; transform: none; width: 100%; max-height: none; height: 100%; border: 0; border-radius: 0; padding-top: env(safe-area-inset-top, 0px); }
  .cat44 .ag-hoja__cab { top: 0; padding-top: 10px; }
  .cat44 .ag-hoja__cuerpo { padding-bottom: calc(24px + env(safe-area-inset-bottom, 0px)); }

  /* «Nuevo»: botón redondo con «+», encima de la barra de abajo, que no la tapa. */
  .cat44 .ag-herramientas [data-accion="ag-nuevo"] {
    position: fixed; right: 16px; bottom: calc(var(--barra-total, 62px) + 16px); z-index: 45; flex: none;
    width: 56px; height: 56px; min-height: 56px; padding: 0; border-radius: 50%;
    box-shadow: 0 8px 18px -6px rgba(13, 79, 90, 0.6), 0 2px 6px rgba(13, 79, 90, 0.3);
  }
  .cat44 .ag-herramientas [data-accion="ag-nuevo"] .ico { width: 26px; height: 26px; }
  .cat44 .ag-nuevo-texto { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

  /* El botón redondo «Nuevo» no tapa lo último de la lista; las tarjetas de aviso (flotan encima) tampoco: agenda-avisos.js anota su alto en --alto-avisos. */
  .cat44 .ag { padding-bottom: calc(72px + var(--alto-avisos, 0px)); }
  /* Las tarjetas de aviso van encima del botón redondo «Nuevo» (de 16 a 72 px sobre la barra), no sobre él. */
  .ag-avisos { top: auto; bottom: calc(var(--barra-total, 62px) + 88px); right: 12px; left: 12px; width: auto; }
  .ag-aviso { grid-template-columns: minmax(0, 1fr); }
  .ag-aviso__botones { justify-content: flex-end; }
  /* Con la pantalla «Herramientas» abierta (z-index 40) ni las tarjetas ni el «+» se dibujan encima de su cuadrícula; vuelven al cerrarla. */
  html.herramientas-abierta .ag-avisos,
  html.herramientas-abierta .cat44 .ag-herramientas [data-accion="ag-nuevo"] { display: none; }
}
@media (max-width: 640px) {
  .cat44 .ag-precios-mes .tramos { grid-template-columns: minmax(0, 1fr); }
  .cat44 .ag-hoja__cuerpo .formulario__dos { grid-template-columns: minmax(0, 1fr); }
  .cat44 .ag-todo-dia { height: 44px; min-height: 44px; margin-top: 0; } /* los campos miden 44 px aquí (catalogo.css); Fecha y la casilla van en columna: sin hueco arriba */
  .cat44 .ag-mensaje { min-height: 58px; } /* «Deshacer» mide 36 px aquí */
}
@media (prefers-reduced-motion: reduce) {
  .cat44 .ag-bloque, .cat44 .ag-reng, .cat44 .ag-celda { transition: none; }
}
@media print {
  .ag-avisos, .cat44 .ag-fondo, .cat44 .ag-hoja { display: none !important; }
}