/* ============================================
   conv-calendar.css
   Estilos del módulo de Calendario
   Extraído de conv-calendar.js
============================================ */

/* ── BITÁCORA ──
   [v2026.10.13-1] conv-calendar.css
   2026-10-13 | La vista elegida de «Ver» (.ccal-seg-b.on) va en violeta Heavensy (#9961FF), no en azul oscuro
     (Alberto, 13-10), como en la Agenda.
   [v2026.10.11-1] conv-calendar.css
   2026-10-11 | EL CALENDARIO POR PROFESIONAL (vista previa aprobada por Alberto el 11-10; conv-calendar.js
     [v2026.10.11-1] y conv-calendar-vistas.js [v2026.10.11-1]): + .ccal-*, «Ver» (.ccal-seg), los profesionales
     para filtrar (.ccal-prof, solo sus caritas en la barra) y sus caritas (.ccal-av); en el Mes, el detalle
     agrupado por profesional (.ccal-grupo) y .ccal-num (cuántas citas de cada uno; solo en grande); la Semana
     (.ccal-sem, lo que no atiende rayado, qué tan lleno está .ccal-ocu, la casilla elegida y su detalle
     .ccal-lista con los huecos libres .ccal-hueco); el Día en grande (.ccal-rej: fuera de horario, colación,
     bloqueos, citas y huecos) y en la barra (.ccal-dia-listas); y en cabañas el tablero de la semana
     (.ccal-tablero, cada estadía de lado a lado; las reservadas, más claras). Los puntos del mes, un poco más
     grandes (5 px). El título del detalle del día ya no pone mayúscula a cada palabra (el texto la trae).
   [v2026.10.09-1] conv-calendar.css
   2026-10-09 | «Confirmar» de una hora reservada abre «Confirmar la hora» de la Agenda bajo la cita
     (conv-calendar.js [v2026.10.09-1]): + .cal-confirmar, donde va ese recuadro; + .cal-confirmada,
     cómo salió el aviso al cliente, bajo la cita recién confirmada. El estilo del botón .cal-confirm-btn
     pasa del HTML a este archivo, con su estado abierto y el borde al llegar con Tab.
*/

.cal-loading { text-align:center; padding:16px; font-size:11px; color:#9ca3af; }
    .cal-filters-wrapper { background:#fff;border-radius:12px;box-shadow:0 1px 6px rgba(0,0,0,.07);overflow:hidden;margin-bottom:8px;padding:7px 10px; }
    .cal-filter-section { margin-bottom:2px; }
    .cal-filter-scroll { display:flex;flex-direction:column;gap:2px;max-height:80px;overflow-y:auto;margin-bottom:2px;padding-right:3px;scrollbar-width:thin;scrollbar-color:#e0e7ff transparent; }
    .cal-filter-scroll::-webkit-scrollbar { width:3px; }
    .cal-filter-scroll::-webkit-scrollbar-thumb { background:#e0e7ff;border-radius:999px; }
    .cal-filter-row-btn { display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:8px;font-size:10.5px;font-weight:600;border:0.5px solid #C9D9FF;background:#EFF6FF;color:#7D84C1;cursor:pointer;white-space:nowrap;width:100%;text-align:left;transition:all .15s; }
    .cal-filter-row-btn:hover:not(.active) { background:#E5EDFB;border-color:#C0CEF0; }
    .cal-filter-row-btn--svc { border-color:#C9D9FF;background:#EFF6FF;color:#7D84C1; }
    .cal-filter-row-dot { width:6px;height:6px;border-radius:50%;display:inline-block;flex-shrink:0; }

    .cal-empty   { text-align:center; padding:12px; font-size:11px; color:#d1d5db; font-style:italic; }

    /* Chips resumen */
    .cal-summary { display:flex; flex-wrap:wrap; gap:4px; margin-bottom:8px; }
    .cal-chip { display:inline-flex; align-items:center; gap:4px; padding:3px 8px; border-radius:20px; font-size:10px; font-weight:600; }
    .cal-chip-dot { width:5px; height:5px; border-radius:50%; flex-shrink:0; }

    /* Caja calendario */
    .cal-box { background:#fff; border-radius:12px; box-shadow:0 1px 6px rgba(0,0,0,.07); overflow:hidden; margin-bottom:8px; }

    /* Nav */
    .cal-nav { display:flex; align-items:center; gap:4px; padding:5px 12px 5px; background:#EFF6FF; border-radius:10px 10px 0 0; border-bottom:1px solid #C9D9FF; }
    .cal-nav-title { font-size:13px; font-weight:700; color:#7D84C1; flex:1; text-align:center; }
    .cal-toggle-btn {
        margin-left: auto;
        font-size: 11px;
        color: #9ca3af;
        transition: color 0.15s, transform 0.2s;
        padding: 2px 6px;
        border-radius: 6px;
    }
    .cal-toggle-btn:hover { color: #374151; background: #f3f4f6; }
    .cal-nav-btn { background:none; border:none; cursor:pointer; color:#9961FF; padding:2px 5px; border-radius:4px; font-size:11px; transition:background .15s; display:flex; align-items:center; justify-content:center; }
    .cal-nav-btn:hover { background:#E1DEFF; }
    .cal-toggle-btn { margin-left:2px; color:#9961FF; }
    .cal-toggle-btn:hover { color:#7D84C1; background:#E1DEFF; }

    /* Grid */
    .cal-grid { display:grid; grid-template-columns:repeat(7,1fr); padding:4px 4px 2px; }
    .cal-days-grid { padding:0 4px 4px; gap:2px; }
    .cal-day-header { text-align:center; font-size:10px; font-weight:600; color:#9ca3af; padding:2px 0; }

    /* Días */
    .cal-day { position:relative; text-align:center; padding:2px 1px; border-radius:5px; border:1.5px solid transparent; transition:all .12s; aspect-ratio:1; display:flex; flex-direction:column; align-items:center; justify-content:center; }
    .cal-day:not(.cal-day--past):hover {
    background: #f5f3ff;
    border: 1px solid #c4b5fd;
    cursor: pointer; }
    .cal-day--has-citas { cursor:pointer; }
    .cal-day--has-citas:hover { background:#f5f3ff; border: 1px solid #c4b5fd; }
    .cal-day--today { border-color:#9961FF;  }
    .cal-day--selected {
    background: #f5f3ff;      /* mismo bg que Agenda */
    border: 1px solid #c4b5fd;
    color: #7c3aed;
}
    .cal-day-num { font-size:11px; line-height:1.2; }
    .cal-day--has-citas .cal-day-num { font-weight:700; color:#1f2937; }
    .cal-day--today .cal-day-num    { color:#9961FF; font-weight:700; }
    .cal-day--selected .cal-day-num {  color: #9961FF; }
    .cal-day:not(.cal-day--has-citas):not(.cal-day--past) .cal-day-num { color:#6b7280; }
    .cal-day--past .cal-day-num { color:#d1d5db; cursor:default; }

    /* Dots */
    .cal-dots { display:flex; gap:2px; margin-top:2px; justify-content:center; }
    .cal-dot   { width:4px; height:4px; border-radius:50%; display:inline-block; }
    .cal-day--selected .cal-dot { outline: 1.5px solid rgba(255,255,255,0.6); outline-offset: 0.5px; }

    /* Panel día */
    .cal-day-panel { background:#fff; border-radius:12px; box-shadow:0 1px 6px rgba(0,0,0,.07); overflow:hidden; margin-bottom:8px; }
    .cal-day-panel-header { display:flex; align-items:center; justify-content:space-between; padding:9px 12px 7px; border-bottom:1px solid #f3f4f6; }
    .cal-day-panel-title  { font-size:11.5px; font-weight:700; color:#1f2937; text-transform:capitalize; }
    .cal-day-panel-count  { font-size:10px; background:#ede9fe; color:#7c3aed; padding:2px 8px; border-radius:20px; font-weight:600; }

    /* Lista citas */
    .cal-appt-list { padding:6px 8px; display:flex; flex-direction:column; gap:5px; max-height:280px; overflow-y:auto; scrollbar-width:thin; scrollbar-color:#e5e7eb transparent; }
    .cal-appt-item { display:flex; align-items:center; gap:8px; padding:7px 9px; border-radius:8px; }
    .cal-appt-time { text-align:center; min-width:34px; }
    .cal-appt-start { display:block; font-size:11px; font-weight:800; color:#1f2937; }
    .cal-appt-end   { display:block; font-size:9px; color:#9ca3af; }
    .cal-appt-info  { flex:1; min-width:0; }
    .cal-appt-service { font-size:11px; font-weight:600; color:#1f2937; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    .cal-appt-contact { font-size:10px; color:#6b7280; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    .cal-appt-badge   { font-size:9.5px; font-weight:600; padding:2px 7px; border-radius:20px; border:1px solid; background:#fff; white-space:nowrap; }
        .cal-appt-item    { transition: background 0.3s ease; }
        .cal-appt-badge   { transition: color 0.3s, border-color 0.3s, background 0.3s; }
        .cal-confirm-btn  { transition: opacity 0.25s, transform 0.25s; }
        /* [09-10-2026] Confirmar: el botón, el recuadro bajo la cita y cómo salió el aviso */
        .cal-confirm-btn  { font-size:9.5px; font-weight:600; padding:2px 7px; border-radius:20px; background:#10b981; color:#fff;
                            border:none; cursor:pointer; white-space:nowrap; font-family:inherit; }
        .cal-confirm-btn:hover, .cal-confirm-btn[aria-expanded="true"] { background:#059669; }
        .cal-confirm-btn:focus-visible { outline:2px solid #9961FF; outline-offset:2px; }
        .cal-confirmar    { animation: calFadeIn 0.25s ease; }
        .cal-confirmar .agconf { margin-top:0; }
        .cal-confirmada   { animation: calFadeIn 0.3s ease; }
        .cal-confirmada .agenda-abono-estado { margin-top:0; }
        .cal-confirm-btn.fading { opacity: 0; transform: scale(0.8); }
        .cal-inline-msg   { animation: calFadeIn 0.3s ease; }
        .cal-appt-item    { animation: calFadeIn 0.25s ease; }
        @keyframes calFadeIn { from { opacity:0; transform:translateY(-4px); } to { opacity:1; transform:translateY(0); } }
        .cal-inline-confirm { animation: calFadeIn 0.25s ease; }
        .agenda-pending-banner { transition: opacity 0.3s, max-height 0.4s, margin 0.3s; overflow:hidden; }
        .agenda-pending-banner.hiding { opacity:0; max-height:0; margin-bottom:0; }

    /* Leyenda */
    .cal-summary { display:flex; flex-wrap:wrap; gap:5px; margin-bottom:8px; }
    .cal-legend { display:flex; flex-wrap:wrap; gap:6px; justify-content:center; padding:6px 0 2px; }
    .cal-legend-item { display:inline-flex; align-items:center; gap:3px; font-size:9px; color:#9ca3af; }
    .cal-filter-btn {
        display: inline-flex; align-items: center; gap: 4px;
        font-size: 10px; font-weight: 600; padding: 4px 10px;
        border-radius: 20px; cursor: pointer; transition: all .15s;
        border: 1.5px solid var(--filter-color, #d1d5db);
        background: #fff;
        color: var(--filter-color, #6b7280);
        opacity: 0.5;
    }
    .cal-filter-btn:hover { opacity: 0.8; }
    .cal-filter-btn--active {
        background: var(--filter-bg, #f3f4f6);
        opacity: 1;
        box-shadow: 0 1px 3px 0 rgba(0,0,0,.08);
    }
/* ══ [v2026.10.11-1] EL CALENDARIO POR PROFESIONAL (conv-calendar.js y conv-calendar-vistas.js) ══
   En la barra por defecto; en grande, lo de .conv-ampliado--contactCalendarSection (conversaciones.css). */
.ccal-barra { display:flex; flex-direction:column; gap:6px; margin-bottom:8px; }
.ccal-ver { display:flex; align-items:center; gap:7px; min-width:0; }
.ccal-ver-t { display:none; font:700 10px 'DM Sans',sans-serif; text-transform:uppercase; letter-spacing:.07em; color:#9ca3af; }
.ccal-seg { display:flex; flex:1; min-width:0; border:1px solid #e0e7ff; border-radius:999px; overflow:hidden; background:#fff; }
.ccal-seg-b { flex:1; border:0; background:#fff; color:#7D84C1; padding:5px 4px; font:600 10.5px 'DM Sans',sans-serif; cursor:pointer;
    display:inline-flex; gap:5px; align-items:center; justify-content:center; white-space:nowrap; }
.ccal-seg-b i { font-size:9.5px; }
.ccal-seg-b:hover { background:#f5f3ff; color:#9961FF; }
.ccal-seg-b.on { background:#9961FF; color:#fff; }   /* [13-10-2026] violeta Heavensy, no azul oscuro */
.ccal-seg-b:focus-visible { outline:2px solid #c4b5fd; outline-offset:-2px; }
.ccal-profs { display:flex; gap:5px; align-items:center; overflow-x:auto; scrollbar-width:none; padding:1px 1px 3px; }
.ccal-profs::-webkit-scrollbar { display:none; }
.ccal-prof { display:inline-flex; align-items:center; gap:6px; flex-shrink:0; border:1px solid #C9D9FF; background:#EFF6FF; color:#7D84C1;
    border-radius:999px; padding:2px; font:600 11px 'DM Sans',sans-serif; cursor:pointer; white-space:nowrap; }
.ccal-prof--todos { padding:3px 10px; }
.ccal-prof:hover { border-color:#9961FF; }
.ccal-prof.on { background:#fff; color:var(--ccal-c,#1E2A5E); border-color:var(--ccal-c,#c4b5fd); box-shadow:0 0 0 2px rgba(153,97,255,.16); }
.ccal-prof--todos.on { color:#7c3aed; border-color:#c4b5fd; }
.ccal-prof-n { display:none; }
.ccal-av { width:20px; height:20px; border-radius:50%; color:#fff; display:inline-grid; place-items:center; flex-shrink:0;
    font:700 8px 'Poppins','DM Sans',sans-serif; letter-spacing:.02em; }
.ccal-av--g { width:26px; height:26px; font-size:9.5px; }
.ccal-link { border:0; background:none; padding:0; color:#7c3aed; font:600 10.5px 'DM Sans',sans-serif; cursor:pointer; text-decoration:underline; text-underline-offset:2px; }

/* Mes: los puntos de cada profesional (en grande, con cuántas citas) y el detalle agrupado */
.ccal-num { display:none; }
.cal-dot { width:5px; height:5px; }
.ccal-grupo { padding:6px 8px 2px; }
.ccal-grupo + .ccal-grupo { border-top:1px solid #f3f4f6; }
.ccal-grupo-cab { display:flex; align-items:center; gap:7px; font-size:11px; font-weight:700; color:#1E2A5E; padding:2px 2px 5px; min-width:0; }
.ccal-grupo-cab > span:nth-child(2) { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ccal-cuenta { margin-left:auto; font-size:10px; background:#f3f4f6; color:#6b7280; padding:1px 8px; border-radius:20px; font-weight:600; flex-shrink:0; }
.ccal-grupo .cal-appt-list { padding:0 0 4px; max-height:none; }

/* Semana y Día */
.ccal-vista { margin-bottom:8px; }
.ccal-nav { display:flex; align-items:center; gap:8px; margin-bottom:8px; }
.ccal-nav b { flex:1; text-align:center; font:600 12px 'Poppins','DM Sans',sans-serif; color:#1E2A5E; }
.ccal-nav button { border:1px solid #C9D9FF; background:#fff; color:#9961FF; width:26px; height:26px; border-radius:8px; cursor:pointer; flex-shrink:0; }
.ccal-nav button:hover { background:#f5f0ff; }
.ccal-cargando, .ccal-vacio { padding:14px 8px; text-align:center; font-size:11px; color:#9ca3af; }
.ccal-error { padding:12px 8px; display:flex; gap:6px; flex-wrap:wrap; justify-content:center; align-items:center; font-size:11px; color:#c2410c; }
.ccal-sem { width:100%; border-collapse:separate; border-spacing:3px; table-layout:fixed; margin-bottom:6px; }
.ccal-sem-quien { width:30px; }
.ccal-sem th { font-size:9px; color:#9ca3af; font-weight:600; text-align:center; padding:2px 0; text-transform:capitalize; }
.ccal-sem th b { display:block; font:700 11.5px 'Poppins','DM Sans',sans-serif; color:#374151; }
.ccal-sem th.hoy b { color:#9961FF; }
.ccal-sem td { height:36px; border-radius:8px; background:#fff; border:1px solid #eef0f8; text-align:center; vertical-align:middle; cursor:pointer; position:relative; padding:0; }
.ccal-sem td:hover { border-color:#c4b5fd; }
.ccal-sem td:focus-visible { outline:2px solid #c4b5fd; outline-offset:1px; }
.ccal-sem td.ccal-quien { background:none; border:0; cursor:default; text-align:left; }
.ccal-quien { display:flex; align-items:center; gap:8px; min-width:0; }
.ccal-quien-n { display:none; font-size:11.5px; font-weight:700; color:#1E2A5E; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ccal-sem td.ccal-cerr { background:repeating-linear-gradient(-45deg,#f6f7fb 0 5px,#eef0f6 5px 10px); cursor:default; color:#cbd5e1; font-size:9px; }
.ccal-sem td.ccal-cerr:hover { border-color:#eef0f8; }
.ccal-sem td.sel { box-shadow:0 0 0 2px #9961FF; border-color:transparent; }
.ccal-n { font:700 12px 'Poppins','DM Sans',sans-serif; color:#1f2937; display:block; line-height:1.1; }
.ccal-lb { display:none; font-size:8.5px; color:#9ca3af; }
.ccal-ocu { position:absolute; left:4px; right:4px; bottom:3px; height:3px; border-radius:3px; background:#eef0f6; overflow:hidden; }
.ccal-ocu i { display:block; height:100%; border-radius:3px; }
.ccal-detalle-t { display:flex; align-items:center; gap:7px; }
.cal-day-panel-title { text-transform:none; }   /* el texto ya viene con su mayúscula (_ccalFechaLarga) */
.ccal-lista { padding:6px 8px; display:flex; flex-direction:column; gap:5px; }
.ccal-hueco { display:flex; align-items:center; gap:7px; width:100%; padding:5px 8px; border-radius:8px; border:1px dashed #bbf7d0; background:#f6fef9;
    font:500 10.5px 'DM Sans',sans-serif; color:#047857; text-align:left; }
button.ccal-hueco { cursor:pointer; }
button.ccal-hueco:hover { background:#ecfdf5; border-color:#6ee7b7; }
.ccal-hueco b { font-size:10.5px; }
.ccal-hueco span { margin-left:auto; font-weight:700; color:#7c3aed; font-size:10px; }
.ccal-no-atiende { border-radius:8px; padding:9px; text-align:center; font-size:10.5px; color:#6b7280;
    background:repeating-linear-gradient(-45deg,#f6f7fb 0 6px,#eef0f6 6px 12px); }
.ccal-dia-listas .ccal-grupo { padding:6px 4px 2px; }
.ccal-dia-listas .ccal-grupo + .ccal-grupo { border-top:0; }
.ccal-dia-listas .ccal-lista { padding:0 4px 6px; }

/* Día en grande: una columna por profesional, hora a hora (en la barra no se ve) */
.ccal-rej { display:none; border:1px solid #eef0f8; border-radius:12px; overflow:hidden; background:#fff; }
.ccal-rej-esq { border-bottom:1px solid #eef0f8; }
.ccal-rej-cab { display:flex; align-items:center; gap:7px; padding:8px; border-bottom:1px solid #eef0f8; border-left:1px solid #eef0f8; background:#fcfcff; min-width:0; }
.ccal-rej-t { min-width:0; }
.ccal-rej-t b { display:block; font-size:11.5px; color:#1E2A5E; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ccal-rej-t small { display:block; font-size:10px; color:#6b7280; }
.ccal-rej-h { position:relative; border-right:1px solid #eef0f8; }
.ccal-rej-h div { position:absolute; right:6px; font-size:9.5px; color:#9ca3af; transform:translateY(-6px); }
.ccal-rej-c { position:relative; border-left:1px solid #eef0f8; background-image:linear-gradient(#f1f2f8 1px, transparent 1px); }
.ccal-rej-fuera { position:absolute; left:0; right:0; background:repeating-linear-gradient(-45deg,#f8f9fc 0 6px,#f0f2f7 6px 12px); }
.ccal-rej-fuera--todo { display:grid; place-items:center; font-size:11px; color:#9ca3af; }
.ccal-rej-bloq span { display:block; font-size:9px; color:#9ca3af; padding:2px 6px; }
.ccal-rej-alm { position:absolute; left:0; right:0; background:repeating-linear-gradient(-45deg,#fff7e6 0 6px,#fdeccc 6px 12px); font-size:9px; color:#b45309; padding:2px 6px; }
.ccal-rej-cita { position:absolute; left:4px; right:4px; border-radius:7px; padding:3px 6px; font-size:10px; line-height:1.25; overflow:hidden; border-left:3px solid; z-index:2; }
.ccal-rej-cita b { display:block; font-size:10px; color:#1f2937; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ccal-rej-cita small { color:#6b7280; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:block; }
.ccal-rej-cita--fuera { opacity:.55; }
.ccal-rej-libre { position:absolute; left:4px; right:4px; border-radius:7px; border:1px dashed #a7f3d0; background:rgba(236,253,245,.6);
    font:500 9.5px 'DM Sans',sans-serif; color:#047857; padding:2px 6px; z-index:1; text-align:left; overflow:hidden; }
button.ccal-rej-libre { cursor:pointer; }
button.ccal-rej-libre:hover { background:#d1fae5; }

/* Cabañas: el tablero de la semana */
.ccal-tablero { margin-bottom:6px; }
.ccal-tab-fila { display:grid; grid-template-columns:30px repeat(7,1fr); gap:3px; margin-bottom:4px; align-items:center; position:relative; }
.ccal-tab-fila > .ccal-quien { grid-column:1; grid-row:1; }
.ccal-tab-cab > div { text-align:center; font-size:9px; color:#9ca3af; font-weight:600; text-transform:capitalize; }
.ccal-tab-cab b { display:block; font:700 11.5px 'Poppins','DM Sans',sans-serif; color:#374151; }
.ccal-tab-cab .hoy b { color:#9961FF; }
.ccal-tab-celda { grid-row:1; height:36px; border:1px solid #eef0f8; border-radius:8px; background:#fff; }
.ccal-estadia { grid-row:1; height:26px; margin:0 2px; border-radius:6px; font:600 9.5px 'DM Sans',sans-serif; color:#fff; padding:0 6px;
    display:flex; align-items:center; overflow:hidden; white-space:nowrap; z-index:2; }
.ccal-estadia--reservada { opacity:.7; }
.ccal-estadia-l { display:none; overflow:hidden; text-overflow:ellipsis; }
.ccal-leyenda { display:flex; flex-wrap:wrap; gap:6px 10px; justify-content:center; padding:4px 0 2px; }
.ccal-leyenda span { display:inline-flex; align-items:center; gap:4px; font-size:9.5px; color:#6b7280; }
.ccal-leyenda i { width:10px; height:10px; border-radius:3px; display:inline-block; background:#9961FF; }
.ccal-leyenda .ccal-ley-clara { opacity:.7; }