/* Calendario de contenido (D-268). La base (marino, coral de acento con texto marino, radio de 6 px,
   sin sombras ni degradados, Poppins autoalojada) es la de todas las soluciones por suscripción. */
@import url('/es/compartido/app-base.css');

.nav--cinco { grid-template-columns: repeat(5, 1fr); }
.nav--cinco a { font-size: 11px; padding-inline: 2px; }
@media (min-width: 720px) { .nav--cinco a { font-size: 15px; } }

.cifras { display: grid; grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); gap: 12px; }
.cifra { display: grid; gap: 2px; }
.cifra strong { font-size: 22px; line-height: 1.2; }
.resumen .sub, .tarjeta--marino .sub { color: var(--linea); }
.aviso--plan { border-color: var(--marino-2); background: var(--superficie); }
.campo--crece { flex: 1; min-width: 160px; }
.grupo-radios { border: 0; padding: 0; margin: 0; min-width: 0; }
.diagnostico { min-height: 220px; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12.5px; line-height: 1.45; white-space: pre; overflow: auto; }
h1[tabindex='-1']:focus { outline: none; }
.texto-pub { min-height: 160px; }
.logo-vista { max-width: 100%; height: auto; border: 1px solid var(--linea); border-radius: var(--radio); }

/* Calendario del mes: siete columnas que caben en 320 px. */
.mes { display: grid; gap: 2px; }
.mes__cabecera, .mes__semana { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 2px; }
.mes__cabecera span { text-align: center; font-size: 11.5px; font-weight: 600; color: var(--gris); padding: 4px 0; text-transform: uppercase; }
.dia {
  position: relative; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 2px;
  min-height: 52px; padding: 4px 2px; border: 1px solid var(--linea); border-radius: var(--radio);
  background: var(--papel); color: var(--marino); font: inherit; cursor: pointer;
}
.dia:hover { background: var(--superficie); }
.dia__n { font-size: 14px; font-weight: 600; }
.dia--fuera { color: var(--gris); background: var(--superficie); }
.dia--hoy .dia__n { background: var(--coral); border-radius: 999px; min-width: 24px; line-height: 24px; text-align: center; }
.dia[aria-pressed='true'] { border: 2px solid var(--marino); padding: 3px 1px; }
.dia__puntos { display: flex; gap: 2px; flex-wrap: wrap; justify-content: center; min-height: 8px; }
.dia__cuenta { font-size: 11px; color: var(--gris); }
.punto { display: inline-block; width: 8px; height: 8px; border-radius: 999px; border: 2px solid var(--gris); box-sizing: border-box; background: var(--papel); }
.punto--preparacion { border-color: var(--amarillo-texto); background: var(--amarillo); }
.punto--lista { border-color: var(--marino); background: var(--marino); }
.punto--publicada { border-color: var(--verde-texto); background: var(--verde); }
.leyenda { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 12.5px; color: var(--gris); }
.leyenda span { display: inline-flex; align-items: center; gap: 5px; }

.item--pub { display: grid; grid-template-columns: 1fr auto; gap: 2px 10px; }
.item--pub .item__texto { grid-column: 1 / -1; }
.etiqueta--preparacion { background: var(--amarillo-suave); border-color: var(--amarillo); color: var(--amarillo-texto); }
.etiqueta--lista { background: var(--superficie); border-color: var(--marino); }
.etiqueta--publicada { background: var(--verde-suave); color: var(--verde-texto); border-color: var(--verde); }

.idea { display: grid; grid-template-columns: 5.6rem 1fr auto; gap: 4px 10px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--linea); }
.idea__texto { min-width: 0; }
.idea--bloqueada { display: block; opacity: 0.7; }
.renueva { display: grid; grid-template-columns: 1fr auto; gap: 2px 12px; padding: 10px 0; border-bottom: 1px solid var(--linea); align-items: center; }
.renueva strong { text-align: right; }
.renueva .sub { grid-column: 1 / -1; }
#mes-nombre { display: inline-block; }
#mes-nombre::first-letter { text-transform: uppercase; }
.barra__marca { min-width: 0; }

/* WebKit da a los campos de fecha y hora un ancho mínimo propio: se dejan encoger dentro de su columna. */
.dos > *, .tres > *, .fila > .campo { min-width: 0; }
input[type='date'], input[type='time'], input[type='color'] { min-width: 0; max-width: 100%; box-sizing: border-box; }
select, textarea { min-width: 0; max-width: 100%; width: 100%; box-sizing: border-box; }
.pila, .pila--chica { grid-template-columns: minmax(0, 1fr); }