/*
 * v1.0 p20 · Estilos específicos de la vista `view/gestion-tareas.php` (Agenda de citas).
 * Antes vivían en un bloque `<style>` inline de la vista — extraídos a este archivo tras la
 * observación del cliente: "en las views de mis dapps no debe de haber, ni CSS, ni JS integrado".
 * Se carga desde la vista con la etiqueta [[render CSS_MODULES,,css/gestion-tareas.css]].
 */

.ag-cal-card { border: 0; box-shadow: 0 4px 12px rgba(0,0,0,.04); border-radius: 12px; }
.ag-worker-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
.ag-chip { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border-radius: 12px; font-size: 11px; font-weight: 600; }
.ag-chip-blue { background: #eaf3ff; color: #0d6efd; }
.ag-chip-pink { background: #ffe8f0; color: #d63384; }
.ag-chip-green { background: #e6f7ee; color: #198754; }
.ag-chip-grey { background: #eef0f2; color: #565e64; }

/* v1.0 p30 · Se elimina cualquier `min-height` sobre `#ag-calendar` para que crezca con el
   contenido del propio FullCalendar (que ahora usa `height: 'auto'` + `expandRows: true`) y así
   se muestren todas las franjas horarias visibles a la vez, sin scroll interno vertical. */
#ag-calendar { min-height: 0; }
/* Filas de tiempo: garantiza que cada slot tenga una altura mínima razonable para que el rango
   08:00 – 21:00 no quede excesivamente comprimido en pantallas grandes. */
#ag-calendar .fc-timegrid-slot { height: 1.6em; }
/* v1.0 p41 · Eliminado `border: 0 !important` — anulaba el color de borde que FullCalendar aplica
   a `.fc-timegrid-event` con el borderColor del evento. Ahora se usa `border-width: 0` sin
   `!important` para que el color siga presente aunque el borde no tenga grosor. */
.fc-event { cursor: pointer; border-radius: 6px !important; padding: 2px 6px !important; font-size: 11px !important; }
.fc-timegrid-event, .fc-daygrid-event { border-width: 0; }
.fc-event-title { font-weight: 600 !important; }
.fc-toolbar-title { font-size: 1.15rem !important; }

.ag-service-pill { display: inline-block; padding: 3px 10px; background: #eaf3ff; color: #0d6efd; border-radius: 12px; font-size: 11px; font-weight: 600; margin: 2px; cursor: pointer; user-select: none; }
.ag-service-pill.selected { background: #0d6efd; color: #fff; }

/* v1.0 p42 · Pills para "Recordatorio a client@" (canales) y "Recordatorio a trabajad@r" (timings) */
.ag-reminder-pill { display: inline-flex; align-items: center; padding: 4px 12px; background: #f1f3f5; color: #495057; border-radius: 999px; font-size: 12px; font-weight: 600; cursor: pointer; user-select: none; transition: background .12s, color .12s; }
.ag-reminder-pill:hover { background: #e2e6ea; }
.ag-reminder-pill.selected { background: #0d6efd; color: #fff; }
.ag-reminder-pill.ag-reminder-pill-worker.selected { background: #6f42c1; color: #fff; }   /* violeta para diferenciar del canal cliente */
.ag-category-panel { display: none; }
.ag-category-panel.active { display: block; }

/* v1.0 p29 · Contenido personalizado de cada tarjeta de evento del calendario:
   hora en la primera línea, asunto (título) en la segunda, trabajador/a en la tercera.
   v1.0 p31 · Añadido el layout compacto de una sola línea `.ag-fc-event-compact` para el modo
   mes (celdas estrechas), con clipping horizontal robusto para que las citas no invadan la celda
   contigua, y un pequeño espacio entre la hora y el asunto para que no aparezcan pegados. */

/* Layout multi-línea (vistas week/day) */
.ag-fc-event-time   { font-size: 10px; opacity: 0.85; line-height: 1.1;  margin-bottom: 1px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.ag-fc-event-title  { font-weight: 700; font-size: 11px; line-height: 1.15; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.ag-fc-event-worker { font-size: 10px; opacity: 0.9; font-style: italic; line-height: 1.15; margin-top: 1px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }

/* Layout compacto de una línea (vista mes) */
.ag-fc-event-compact { display: block; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.4; font-size: 11px; }
.ag-fc-event-compact .ag-fc-event-time   { display: inline; font-size: 11px; font-weight: 600; margin: 0 5px 0 0; padding: 0; opacity: 1; }
.ag-fc-event-compact .ag-fc-event-title  { display: inline; font-weight: 700; margin: 0 4px 0 0; }
.ag-fc-event-compact .ag-fc-event-worker { display: inline; font-style: italic; opacity: 0.85; }

/* Garantizamos que la caja del evento (harness) en la vista mes NUNCA supere el ancho de su celda —
   sin esto, un asunto largo empuja el bloque y solapa la celda contigua. */
.fc-daygrid-event-harness { max-width: 100%; overflow: hidden; }
.fc-daygrid-event         { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }