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

.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; }
        .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);
    }