/* ==========================================================================
   QUOMYA — CALENDARIO V1
   Wave S4.7. Scoped entirely to `.qy-calendario-screen`.

   The calendar ENGINE is untouched. `doesDayCountForEstimation`,
   `getCalendarDay`, `saveCalendarDay`, `getDayMetrics`, `getMonthMetrics`,
   `saveDayPlan`, `saveDayClose`, `removeDayClose` and `getCalendarCells` all
   stay exactly as they were: `countsForEstimation`, `dayClosed` and
   `workedCount` feed estimation, Evolución and the `conversion` objective
   metric, so a semantic change here would move three other screens.

   Owner decision: DATA VISUALISATION ONLY. No scheduler, no appointments, no
   time slots, no invented due dates.
   ========================================================================== */

.qy-calendario-screen,
.qy-calendario-screen * {
  box-sizing: border-box;
}

.qy-calendario-screen {
  gap: var(--qy-space-6);
  padding-block: var(--qy-space-6) var(--qy-space-4);
  color: var(--qy-color-text-primary);
  overflow: visible;
}

.qy-calendario-layout {
  display: grid;
  gap: var(--qy-space-4);
  min-width: 0;
  align-content: start;
}

.qy-calendario-day-column {
  display: grid;
  gap: var(--qy-space-4);
  min-width: 0;
  align-content: start;
}

.qy-calendario-screen :is(button, summary):focus-visible {
  outline: 0;
  box-shadow: var(--qy-focus-ring) !important;
}

/* ---- month navigation --------------------------------------------------- */

.qy-calendario-nav {
  display: flex;
  align-items: center;
  gap: var(--qy-space-2);
}

.qy-calendario-nav__btn {
  display: inline-grid;
  place-items: center;
  width: var(--qy-touch-min);
  height: var(--qy-touch-min);
  color: var(--qy-color-text-primary);
  background: var(--qy-color-surface-2);
  border: 1px solid var(--qy-color-border-interactive);
  border-radius: var(--qy-radius-md);
  font-size: 1.35rem;
  line-height: 1;
  cursor: pointer;
}

.qy-calendario-nav__btn:hover {
  background: var(--qy-color-hover);
  border-color: var(--qy-color-brand);
}

.qy-calendario-screen .qy-calendario-nav__today {
  min-height: var(--qy-touch-min) !important;
  padding: 0 var(--qy-space-4) !important;
  color: var(--qy-color-text-primary) !important;
  background: var(--qy-color-surface-3) !important;
  border: 1px solid var(--qy-color-border-interactive) !important;
  border-radius: var(--qy-radius-md) !important;
  white-space: nowrap;
}

/* ---- month metrics ------------------------------------------------------ */

.qy-calendario-metrics {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--qy-space-3) !important;
}

.qy-calendario-screen .calendar-month-metric {
  display: grid;
  gap: var(--qy-space-1);
  min-height: 0 !important;
  padding: var(--qy-space-4) !important;
  color: var(--qy-color-text-primary) !important;
  background: var(--qy-color-surface-2) !important;
  border: 1px solid var(--qy-color-border-strong) !important;
  border-radius: var(--qy-radius-lg) !important;
  box-shadow: none !important;
}

.qy-calendario-screen .calendar-month-metric > span {
  color: var(--qy-color-text-tertiary) !important;
  font: var(--qy-text-label-md) !important;
  letter-spacing: var(--qy-tracking-label);
  text-transform: uppercase;
}

.qy-calendario-screen .calendar-month-metric > strong {
  overflow: hidden;
  color: var(--qy-color-text-primary) !important;
  font-size: clamp(1.05rem, 3.4vw, 1.35rem);
  font-weight: 650;
  font-variant-numeric: var(--qy-font-numeric);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.qy-calendario-screen .calendar-month-metric.is-pending > strong {
  color: var(--qy-color-pending-text) !important;
}

/* ---- weekday row + grid ------------------------------------------------- */

.qy-calendario-week-row {
  display: grid !important;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: var(--qy-space-1);
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.qy-calendario-week-row > span {
  padding-block: var(--qy-space-2);
  color: var(--qy-color-text-tertiary) !important;
  font: var(--qy-text-label-md) !important;
  letter-spacing: var(--qy-tracking-label);
  text-align: center;
  text-transform: uppercase;
}

.qy-calendario-grid {
  display: grid !important;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: var(--qy-space-1) !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

/* ---- day cell ----------------------------------------------------------- */

.qy-calendario-screen .qy-calendario-day {
  position: relative;
  display: grid;
  align-content: start;
  gap: 2px;
  min-height: 76px;
  min-width: 0;
  padding: var(--qy-space-2) !important;
  color: var(--qy-color-text-primary) !important;
  background: var(--qy-color-surface-2) !important;
  border: 1px solid var(--qy-color-border) !important;
  border-radius: var(--qy-radius-md) !important;
  box-shadow: none !important;
  text-align: left;
  cursor: pointer;
}

.qy-calendario-screen .qy-calendario-day:hover:not(.is-empty) {
  border-color: var(--qy-color-brand) !important;
  background: var(--qy-color-active) !important;
}

.qy-calendario-screen .qy-calendario-day.is-empty {
  background: transparent !important;
  border-color: transparent !important;
  cursor: default;
  pointer-events: none;
}

.qy-calendario-screen .calendar-cell-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
}

.qy-calendario-screen .calendar-cell-top strong {
  color: var(--qy-color-text-primary) !important;
  font: var(--qy-text-body-md) !important;
  font-weight: 650 !important;
  font-variant-numeric: var(--qy-font-numeric);
}

/*
 * Estado por punto: es un refuerzo, nunca el único portador de significado.
 * Cada celda lleva además `aria-label` con tipo de día, si cuenta para la
 * estimación, la actividad y el cierre, y una etiqueta de texto visible.
 */
.qy-calendario-screen .calendar-status-dot {
  width: 7px;
  height: 7px;
  border-radius: var(--qy-radius-pill);
  background: transparent !important;
}

.qy-calendario-screen .qy-calendario-day.is-nonwork .calendar-status-dot {
  background: var(--qy-color-text-tertiary) !important;
}

.qy-calendario-screen .qy-calendario-day.is-closed .calendar-status-dot {
  background: var(--qy-color-closure) !important;
}

.qy-calendario-screen .calendar-cell-sales-count {
  color: var(--qy-color-brand-text) !important;
  font: var(--qy-text-label-md) !important;
  font-weight: 700 !important;
}

.qy-calendario-screen .calendar-day-amount {
  overflow: hidden;
  color: var(--qy-color-collected-text) !important;
  font: var(--qy-text-label-md) !important;
  font-variant-numeric: var(--qy-font-numeric);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.qy-calendario-screen .calendar-cell-status-label {
  overflow: hidden;
  color: var(--qy-color-text-tertiary) !important;
  font: var(--qy-text-label-md) !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/*
 * `calendar-professional-v15-13.css` pinta este check como un disco sólido
 * teal (`#0f766e`). Recolorear solo el glifo lo dejaba en 1,97:1 sobre ese
 * relleno. Rellenarlo con el cobalto de cierre tampoco basta: `#3B82F6` es un
 * ancla bloqueada y la mejor tinta encima se queda en 4,47:1, por debajo de
 * AA. Se retira el relleno y el cobalto pasa a ser el propio glifo sobre la
 * superficie oscura de la celda, donde supera AA con holgura. El cierre sigue
 * enunciado en el `aria-label` y reforzado por el borde izquierdo.
 */
.qy-calendario-screen .calendar-cell-closed {
  position: absolute;
  right: 4px;
  bottom: 3px;
  width: auto !important;
  height: auto !important;
  color: var(--qy-color-closure-text) !important;
  background: transparent !important;
  border-radius: 0 !important;
  font-size: 0.68rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1;
}

/* Non-working days: muted surface + dashed border, not colour alone. */
.qy-calendario-screen .qy-calendario-day.is-nonwork {
  background: var(--qy-color-surface-1) !important;
  border-style: dashed !important;
  border-color: var(--qy-color-border-strong) !important;
}

.qy-calendario-screen .qy-calendario-day.is-closed {
  border-left: 3px solid var(--qy-color-closure) !important;
}

.qy-calendario-screen .qy-calendario-day.is-today {
  border-color: var(--qy-color-brand) !important;
}

.qy-calendario-screen .qy-calendario-day.is-selected {
  background: var(--qy-color-brand-soft) !important;
  border-color: var(--qy-color-brand) !important;
  box-shadow: inset 0 0 0 1px var(--qy-color-brand) !important;
}

/* ---- legend ------------------------------------------------------------- */

.qy-calendario-legend {
  display: flex !important;
  flex-wrap: wrap;
  gap: var(--qy-space-3) var(--qy-space-4);
}

.qy-calendario-screen .calendar-legend > span {
  display: inline-flex;
  align-items: center;
  gap: var(--qy-space-2);
  color: var(--qy-color-text-secondary) !important;
  font: var(--qy-text-body-md) !important;
}

.qy-calendario-screen .calendar-legend i {
  width: 10px;
  height: 10px;
  border-radius: var(--qy-radius-pill);
}

.qy-calendario-screen .calendar-legend .legend-sales {
  background: var(--qy-color-collected) !important;
}

.qy-calendario-screen .calendar-legend .legend-closed {
  background: var(--qy-color-closure) !important;
}

.qy-calendario-screen .calendar-legend .legend-nonwork {
  background: var(--qy-color-text-tertiary) !important;
}

/* ---- selected day detail ------------------------------------------------ */

.qy-calendario-screen .calendar-selected-day-heading {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--qy-space-3);
}

.qy-calendario-screen .calendar-selected-day-heading > div:first-child > span {
  color: var(--qy-color-text-tertiary) !important;
  font: var(--qy-text-label-md) !important;
  letter-spacing: var(--qy-tracking-label);
  text-transform: uppercase;
}

.qy-calendario-screen .calendar-selected-day-heading h3 {
  margin: var(--qy-space-1) 0 0 !important;
  color: var(--qy-color-text-primary) !important;
  font: var(--qy-text-headline-md) !important;
  letter-spacing: var(--qy-tracking-tight);
}

.qy-calendario-screen .calendar-day-status-group {
  display: flex;
  flex-wrap: wrap;
  gap: var(--qy-space-2);
}

.qy-calendario-screen .calendar-day-status-pill {
  color: var(--qy-color-text-primary) !important;
  background: var(--qy-color-surface-3) !important;
  border: 1px solid var(--qy-color-border-strong) !important;
  white-space: nowrap;
}

.qy-calendario-screen .calendar-day-closed-pill {
  color: var(--qy-color-closure-text) !important;
  background: var(--qy-color-closure-soft) !important;
  border: 1px solid var(--qy-color-closure) !important;
  border-radius: var(--qy-radius-pill) !important;
  padding: 4px 9px !important;
  font: var(--qy-text-label-md) !important;
  white-space: nowrap;
}

/*
 * Columnas guiadas por el ancho real del contenedor, no por el viewport: en
 * escritorio este panel es una columna lateral estrecha, así que un
 * `repeat(4, ...)` por media query partía las etiquetas a media palabra
 * ("REFEREN CIAS", "CONVERS IÓN"). `auto-fit` con un mínimo legible reparte
 * según el hueco disponible.
 */
.qy-calendario-screen .calendar-day-metric-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(118px, 1fr));
  gap: var(--qy-space-3) !important;
}

/* Ninguna etiqueta de métrica puede romperse a media palabra. */
.qy-calendario-screen .day-metric > span,
.qy-calendario-screen .calendar-month-metric > span {
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
}

.qy-calendario-screen .day-metric {
  display: grid;
  gap: var(--qy-space-1);
  min-height: 0 !important;
  padding: var(--qy-space-3) !important;
  color: var(--qy-color-text-primary) !important;
  background: var(--qy-color-surface-2) !important;
  border: 1px solid var(--qy-color-border-strong) !important;
  border-radius: var(--qy-radius-md) !important;
  box-shadow: none !important;
}

.qy-calendario-screen .day-metric > span {
  color: var(--qy-color-text-tertiary) !important;
  font: var(--qy-text-label-md) !important;
  letter-spacing: var(--qy-tracking-label);
  text-transform: uppercase;
}

.qy-calendario-screen .day-metric > strong {
  overflow: hidden;
  color: var(--qy-color-text-primary) !important;
  font: var(--qy-text-financial) !important;
  font-weight: 700 !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.qy-calendario-screen .day-metric.is-paid > strong {
  color: var(--qy-color-collected-text) !important;
}

.qy-calendario-screen .day-metric.is-pending > strong {
  color: var(--qy-color-pending-text) !important;
}

/* ---- disclosures: day plan + day close ---------------------------------- */

.qy-calendario-screen .qy-calendario-disclosure {
  padding: 0 !important;
  overflow: hidden;
}

.qy-calendario-screen .qy-calendario-disclosure > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--qy-space-3);
  min-height: var(--qy-touch-min) !important;
  padding: var(--qy-space-4) var(--qy-space-5) !important;
  color: var(--qy-color-text-primary) !important;
  cursor: pointer;
}

.qy-calendario-screen .qy-calendario-disclosure > summary strong {
  color: var(--qy-color-text-primary) !important;
  font: var(--qy-text-body-lg) !important;
  font-weight: 650 !important;
}

.qy-calendario-screen .qy-calendario-disclosure > summary small {
  display: block;
  margin-top: 2px;
  color: var(--qy-color-text-secondary) !important;
  font: var(--qy-text-body-md) !important;
}

.qy-calendario-screen .calendar-close-summary-status {
  display: inline-flex;
  align-items: center;
  gap: var(--qy-space-2);
  color: var(--qy-color-text-secondary) !important;
  font: var(--qy-text-label-md) !important;
  white-space: nowrap;
}

.qy-calendario-screen .calendar-disclosure-content {
  display: grid;
  gap: var(--qy-space-4) !important;
  padding: 0 var(--qy-space-5) var(--qy-space-5) !important;
}

/* Form controls inside both disclosures. */
.qy-calendario-screen .form-field label,
.qy-calendario-screen .calendar-exception-check > span {
  color: var(--qy-color-text-secondary) !important;
}

.qy-calendario-screen .form-field input,
.qy-calendario-screen .form-field select,
.qy-calendario-screen .form-field textarea {
  color: var(--qy-color-text-primary) !important;
  background: var(--qy-color-surface-1) !important;
  border: 1px solid var(--qy-color-border-interactive) !important;
}

.qy-calendario-screen .form-field input::placeholder,
.qy-calendario-screen .form-field textarea::placeholder {
  color: var(--qy-color-text-tertiary) !important;
}

.qy-calendario-screen .form-field input:focus,
.qy-calendario-screen .form-field select:focus,
.qy-calendario-screen .form-field textarea:focus {
  border-color: var(--qy-color-brand) !important;
  outline: none !important;
  box-shadow: var(--qy-focus-ring) !important;
}

.qy-calendario-screen .calendar-exception-check {
  display: flex;
  align-items: center;
  gap: var(--qy-space-3);
  min-height: var(--qy-touch-min);
  color: var(--qy-color-text-secondary) !important;
}

.qy-calendario-screen .calendar-help-copy {
  margin: 0;
  color: var(--qy-color-text-secondary) !important;
  font: var(--qy-text-body-md) !important;
}

/*
 * `calendar-estimation-preview` trae borde/fondo turquesa claro con
 * !important desde `compact-visual-v15-14-2.css`, pensado para superficie
 * clara. Aquí se reescribe con la misma prioridad para evitar la isla clara.
 */
.qy-calendario-screen .calendar-estimation-preview {
  padding: var(--qy-space-4) !important;
  color: var(--qy-color-text-primary) !important;
  background: var(--qy-color-brand-soft) !important;
  border: 1px solid var(--qy-color-border-strong) !important;
  border-left: 3px solid var(--qy-color-brand) !important;
  border-radius: var(--qy-radius-md) !important;
  box-shadow: none !important;
}

.qy-calendario-screen .calendar-estimation-preview :is(span, small, p) {
  color: var(--qy-color-text-secondary) !important;
}

.qy-calendario-screen .calendar-estimation-preview strong {
  color: var(--qy-color-text-primary) !important;
}

.qy-calendario-screen .primary-btn,
.qy-calendario-screen .personal-wide-action {
  min-height: var(--qy-touch-min) !important;
  color: var(--qy-color-text-on-brand) !important;
  background: var(--qy-color-brand) !important;
  border: 1px solid var(--qy-color-brand) !important;
}

.qy-calendario-screen .secondary-btn:not(.qy-calendario-nav__today) {
  min-height: var(--qy-touch-min) !important;
  color: var(--qy-color-text-primary) !important;
  background: var(--qy-color-surface-3) !important;
  border: 1px solid var(--qy-color-border-interactive) !important;
}

.qy-calendario-screen .calendar-close-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--qy-space-3);
}

/* ---- day sales ---------------------------------------------------------- */

.qy-calendario-screen .calendar-day-sales-list {
  display: grid;
  gap: var(--qy-space-3);
}

.qy-calendario-screen .calendar-editable-sale-card {
  min-height: var(--qy-touch-min) !important;
  padding: var(--qy-space-4) !important;
  color: var(--qy-color-text-primary) !important;
  background: var(--qy-color-surface-2) !important;
  border: 1px solid var(--qy-color-border-strong) !important;
  border-radius: var(--qy-radius-lg) !important;
  box-shadow: none !important;
  text-align: left;
}

.qy-calendario-screen .calendar-editable-sale-card:hover {
  border-color: var(--qy-color-brand) !important;
  background: var(--qy-color-active) !important;
}

.qy-calendario-screen .calendar-editable-sale-card strong,
.qy-calendario-screen .calendar-editable-sale-card b {
  color: var(--qy-color-text-primary) !important;
}

.qy-calendario-screen .calendar-editable-sale-card :is(span, small, em) {
  color: var(--qy-color-text-secondary) !important;
}

.qy-calendario-screen .calendar-sale-payment.is-paid,
.qy-calendario-screen .calendar-sale-payment.status-paid {
  color: var(--qy-color-collected-text) !important;
  background: var(--qy-color-collected-soft) !important;
}

.qy-calendario-screen .calendar-sale-payment.is-pending,
.qy-calendario-screen .calendar-sale-payment.is-partial {
  color: var(--qy-color-pending-text) !important;
  background: var(--qy-color-pending-soft) !important;
}

.qy-calendario-screen .personal-search-empty {
  color: var(--qy-color-text-secondary) !important;
  background: var(--qy-color-surface-2) !important;
  border: 1px dashed var(--qy-color-border-interactive) !important;
  border-radius: var(--qy-radius-lg) !important;
  box-shadow: none !important;
}

.qy-calendario-screen .personal-search-empty strong {
  color: var(--qy-color-text-primary) !important;
}

/* ---- responsive ---------------------------------------------------------- */

@media (max-width: 559px) {
  .qy-calendario-screen {
    gap: var(--qy-space-5);
    padding-top: var(--qy-space-5);
  }

  .qy-calendario-screen .qy-dashboard-panel {
    padding: var(--qy-space-4);
  }

  .qy-calendario-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  /* 7 columnas siguen cabiendo en 390px sin scroll horizontal; se recorta la
     altura y el texto secundario en vez de estrechar la rejilla. */
  .qy-calendario-screen .qy-calendario-day {
    min-height: 58px;
    padding: 5px 4px !important;
  }

  .qy-calendario-screen .calendar-cell-status-label {
    display: none;
  }

  .qy-calendario-screen .calendar-day-amount {
    font-size: 0.6rem !important;
  }

  .qy-calendario-screen .calendar-cell-top strong {
    font-size: 0.82rem !important;
  }
}


@media (min-width: 1180px) {
  .qy-calendario-screen {
    gap: var(--qy-space-8);
    padding-block: var(--qy-space-8);
  }

  /* Dos columnas: mes a la izquierda, detalle del día a la derecha. Es la
     composición de la referencia Stitch de escritorio. */
  .qy-calendario-layout {
    grid-template-columns: minmax(0, 1.45fr) minmax(340px, 1fr);
    gap: var(--qy-space-6);
    align-items: start;
  }

  .qy-calendario-screen .qy-calendario-day {
    min-height: 92px;
  }
}

/* ==========================================================================
   S4.11D — CELDAS DE DÍA: SIN SOLAPES POR CONSTRUCCIÓN

   Petición explícita del propietario: "mucho ojo a no sobreponer nada
   sobretodo en las celdas de los días".

   Había DOS causas reales, ninguna de calibración:

   1. La marca de cierre era `position: absolute` sobre `bottom/right`. Vivía
      fuera del flujo, así que se dibujaba encima de la última fila -- el
      importe -- que ocupa el ancho completo de la celda. En S4.11D esa marca
      pasa a la cabecera de la celda, en flujo. Aquí solo se retira el
      posicionamiento absoluto que ya no aplica.

   2. `calendar-professional-v15-13.css` declara sobre el importe
      `overflow: visible !important` y `text-overflow: clip !important`, y por
      debajo de 370px lo encoge hasta `font-size: 0.4rem !important`. Es decir:
      el texto se salía de la celda Y se hacía ilegible a la vez. Las reglas
      equivalentes de esta hoja no llevaban `!important` y perdían el reparto.
      Se igualan la prioridad y se recupera el recorte limpio con elipsis, sin
      reducir tipografía -- el propietario rechazó expresamente esa vía.
   ========================================================================== */

.qy-calendario-screen .calendar-cell-closed {
  position: static;
  right: auto;
  bottom: auto;
  flex: none;
  margin-left: auto;
  font-size: 0.72rem;
}

/*
   La fila superior reparte: número a la izquierda, cierre y punto de estado a
   la derecha. `margin-left: auto` sobre el cierre empuja al par derecho sin
   depender de cuántos hijos haya, así que un día sin cierre no descoloca el
   punto.
*/
.qy-calendario-screen .calendar-cell-top {
  gap: var(--qy-space-1);
  min-width: 0;
}

.qy-calendario-screen .calendar-cell-top strong {
  min-width: 0;
  line-height: 1.1 !important;
}

.qy-calendario-screen .calendar-status-dot {
  flex: none;
}

/*
   La actividad del día se APILA en móvil y solo se reparte en una fila cuando
   la celda tiene ancho para ello.

   Se probó la fila única en todos los anchos y era peor: a 390px el interior
   de una celda mide ~24px, así que recuento e importe compitiendo por esa
   línea dejaban al importe con espacio para una elipsis y nada más. Apilados,
   el importe dispone del ancho completo de la celda.

   La altura ya no es el problema que era: al salir la marca de cierre del
   posicionamiento absoluto, las tres filas en flujo caben de sobra en los
   76px de la celda.
*/
.qy-calendario-screen .calendar-cell-activity {
  display: grid;
  gap: 2px;
  min-width: 0;
}

@media (min-width: 560px) {
  .qy-calendario-screen .calendar-cell-activity {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--qy-space-1);
  }

  .qy-calendario-screen .calendar-cell-activity .calendar-day-amount {
    flex: 1 1 auto;
    text-align: right !important;
  }
}

.qy-calendario-screen .calendar-cell-sales-count {
  width: auto !important;
  text-align: left !important;
}

.qy-calendario-screen .calendar-cell-activity .calendar-day-amount {
  min-width: 0;
  width: auto !important;
  overflow: hidden !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  line-height: 1.2 !important;
  text-align: left !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.qy-calendario-screen .calendar-cell-status-label {
  width: 100%;
  font-size: 11px !important;
  line-height: 1.2 !important;
  text-align: left !important;
}

.qy-calendario-screen .calendar-cell-sales-count {
  font-size: 11px !important;
  line-height: 1.2 !important;
}

/*
   El relleno lateral de la celda se recupera como ancho útil.

   A 320px la celda mide ~32px; con 8px de relleno a cada lado quedaban 14px
   interiores, donde no cabe ningún importe. Bajarlo a 4px devuelve 8px reales
   de texto -- más que cualquier reducción de tipografía razonable -- sin tocar
   el tamaño de letra, que es lo que el propietario pidió expresamente evitar.
*/
@media (max-width: 559px) {
  .qy-calendario-screen .qy-calendario-day {
    padding: var(--qy-space-2) var(--qy-space-1) !important;
  }
}

/*
   Por debajo de 360px ni con el relleno recuperado caben cuatro caracteres de
   importe. La celda deja de pintarlo y MANTIENE el recuento de ventas, que es
   el dato que dice si el día tuvo actividad. El importe exacto sigue estando
   en el `title`, en el `aria-label` de la celda y en el detalle del día que
   se abre al tocarla: no se pierde información de negocio, se deja de pintar
   en un espacio que no la admite.
*/
@media (max-width: 359px) {
  .qy-calendario-screen .calendar-cell-activity .calendar-day-amount {
    display: none !important;
  }

  .qy-calendario-screen .calendar-cell-status-label,
  .qy-calendario-screen .calendar-cell-sales-count {
    font-size: 10px !important;
  }
}

/* La celda nunca deja escapar contenido, pase lo que pase por encima. */
.qy-calendario-screen .qy-calendario-day {
  overflow: hidden;
  row-gap: var(--qy-space-1);
}

/* ==========================================================================
   S4.11D — CELDAS DE MÉTRICA COMPARABLES (puntos 10 y H)

   Mismo criterio que en las tarjetas comparativas de Evolución: "IMPORTE
   VENDIDO" ocupa dos líneas mientras "VENTAS" ocupa una, y como las celdas
   comparten rejilla la diferencia se lee como un fallo de maquetación.

   La etiqueta reserva dos líneas del propio token tipográfico en TODAS las
   celdas. Ninguna etiqueta se acorta ni se reduce de tamaño: se igualan las
   cajas, no el texto.
   ========================================================================== */

.qy-calendario-screen .day-metric > span,
.qy-calendario-screen .calendar-month-metric > span {
  min-height: calc(2 * 16px);
  text-wrap: balance;
}

.qy-calendario-screen .day-metric,
.qy-calendario-screen .calendar-month-metric {
  align-content: start;
}