/* ===== calendar.css ===== */
/* =========================================
   CALENDAR.CSS
   Calendario base reutilizable.
   ========================================= */

.calendar-card{
    padding:18px 20px 20px;
}

.calendar-weekdays,
.ui-calendar-weekdays{
    display:grid;
    grid-template-columns:repeat(7, minmax(0, 1fr));
    gap:5px;
    margin-bottom:8px;
}

.calendar-weekdays span,
.ui-calendar-weekday{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:36px;
    padding:0 8px;
    border-radius:8px;
    border:1px solid var(--stroke);
    background:rgba(255,255,255,.035);
    color:var(--text-muted);
    font-size:11px;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
    text-align:center;
}

.calendar-grid,
.ui-calendar{
    display:grid;
    grid-template-columns:repeat(7, minmax(0, 1fr));
    gap:5px;
}

.calendar-day,
.ui-day{
    min-width:0;
    min-height:116px;
    padding:14px;
    border-radius:8px;
    border:1px solid rgba(70,116,170,.35);
    background:linear-gradient(180deg, rgba(30,44,73,.78), rgba(25,37,63,.76));
    display:flex;
    flex-direction:column;
    gap:10px;
    transition:border-color var(--transition), background var(--transition), transform var(--transition);
}

.calendar-day:hover,
.ui-day:hover{
    transform:translateY(-1px);
    background:linear-gradient(180deg, rgba(35,52,86,.82), rgba(27,41,70,.78));
    border-color:var(--stroke-strong);
}

.calendar-day header,
.ui-day-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:8px;
    min-width:0;
    color:#fff;
    font-weight:900;
}

.calendar-day header strong,
.ui-day-number{
    font-size:17px;
    line-height:1;
}

.calendar-dow,
.ui-day-name{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    color:#8b96aa;
    font-size:10px;
    font-weight:900;
    letter-spacing:.12em;
    text-transform:uppercase;
    white-space:nowrap;
    flex-shrink:0;
}

.calendar-day.is-muted,
.ui-day.is-muted{
    opacity:1;
    border-color:color-mix(in srgb, var(--stroke) 58%, transparent);
    background:linear-gradient(180deg, rgba(22,34,58,.44), rgba(18,30,52,.38));
}
.calendar-day.is-muted .ui-day-head,
.ui-day.is-muted .ui-day-head,
.calendar-day.is-muted header,
.ui-day.is-muted header{ opacity:.54; }
.calendar-day.is-muted .ui-day-events,
.ui-day.is-muted .ui-day-events{ opacity:.82; }

.calendar-day.is-today,
.ui-day.is-today{
    border-color:color-mix(in srgb, var(--ui-blue) 72%, var(--stroke));
    background:linear-gradient(180deg, color-mix(in srgb, var(--ui-blue) 18%, rgba(30,44,73,.78)), rgba(25,37,63,.78));
    box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--ui-blue) 24%, transparent), 0 0 0 1px color-mix(in srgb, var(--ui-blue) 10%, transparent);
}
.calendar-day.is-today .ui-day-number,
.ui-day.is-today .ui-day-number{ color:#fff; }

.calendar-day-tasks,
.ui-day-events{
    display:flex;
    flex-direction:column;
    gap:8px;
    min-width:0;
}

.calendar-task,
.ui-event{
    --event:var(--ui-cyan);
    appearance:none;
    -webkit-appearance:none;
    width:100%;
    max-width:140px;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    text-align:left;
    gap:3px;
    padding:10px 10px;
    border-radius:12px;
    border:1px solid color-mix(in srgb, var(--event) 50%, transparent);
    background:linear-gradient(135deg, color-mix(in srgb, var(--event) 18%, rgba(18,31,55,.92)), rgba(255,255,255,.045));
    color:var(--text);
    font-size:12px;
    font-weight:900;
    line-height:1.2;
    position:relative;
    overflow:hidden;
    min-width:0;
    text-decoration:none;
    cursor:pointer;
    transition:background var(--transition), border-color var(--transition), transform var(--transition), box-shadow var(--transition);
}

.calendar-task:hover,
.ui-event:hover{
    transform:translateY(-1px);
    filter:brightness(1.03);
    box-shadow:0 10px 18px rgba(0,0,0,.18);
}

.calendar-task:focus,
.ui-event:focus{
    outline:none;
    box-shadow:0 0 0 4px color-mix(in srgb, var(--event) 20%, transparent);
}

.calendar-task b,
.ui-event b{
    font-size:12px;
    line-height:1.25;
    word-break:break-word;
    font-weight:900;
}

.calendar-task span,
.calendar-task-meta,
.ui-event small{
    display:inline-flex;
    align-items:center;
    gap:4px;
    margin-top:4px;
    padding:3px 6px;
    border-radius:999px;
    background:color-mix(in srgb, var(--event) 16%, rgba(255,255,255,.08));
    color:var(--text);
    font-size:11px;
    font-weight:900;
    line-height:1;
}

.calendar-more{
    font-size:12px;
    font-weight:800;
    color:var(--text-muted);
    padding-left:2px;
}

.calendar-task.is-blue,.ui-event.is-blue{ --event:var(--ui-blue); }
.calendar-task.is-green,.ui-event.is-green{ --event:var(--ui-green); }
.calendar-task.is-orange,.ui-event.is-orange{ --event:var(--ui-orange); }
.calendar-task.is-red,.ui-event.is-red{ --event:var(--ui-red); }
.calendar-task.is-purple,.ui-event.is-purple{ --event:var(--ui-purple); }
.calendar-task.is-pink,.ui-event.is-pink{ --event:var(--ui-pink); }
.calendar-task.is-teal,.ui-event.is-teal{ --event:var(--ui-teal); }
.calendar-task.is-muted,.ui-event.is-muted{ --event:#64748b; }
.calendar-task[class*="is-society-"],.ui-event[class*="is-society-"]{ --event:var(--event-color); }
.calendar-task[class*="is-dept-"],.ui-event[class*="is-dept-"]{ --event:var(--event-color); }

.calendar-toolbar,
.ui-calendar-toolbar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
}

.ui-calendar-nav{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:4px;
    border-radius:14px;
    border:1px solid var(--ui-line, var(--stroke));
    background:rgba(255,255,255,.04);
}

.ui-calendar-nav button,
.ui-calendar-nav a{
    min-height:34px;
    padding:0 12px;
    border-radius:10px;
    border:1px solid transparent;
    background:transparent;
    color:var(--text-soft);
    font-weight:900;
    text-decoration:none;
}

.ui-calendar-nav .is-current{
    color:#fff;
    background:rgba(91,170,224,.16);
    border-color:rgba(91,170,224,.35);
}


/* Variante reutilizable: calendarios con sabado doble ancho.
   Por defecto todos los dias usan 1fr; agregar .is-saturday-wide cuando sabado requiera 2fr. */
.calendar-weekdays.is-saturday-wide,
.ui-calendar-weekdays.is-saturday-wide{
    grid-template-columns:repeat(6, minmax(0, 1fr)) minmax(0, 2fr);
}
.calendar-grid.is-saturday-wide,
.ui-calendar.is-saturday-wide{
    grid-template-columns:repeat(6, minmax(0, 1fr)) minmax(0, 2fr);
}
@media (max-width: 900px){
    .calendar-weekdays.is-saturday-wide,
    .ui-calendar-weekdays.is-saturday-wide{ grid-template-columns:repeat(6, 124px) 248px; }
    .calendar-grid.is-saturday-wide,
    .ui-calendar.is-saturday-wide{ grid-template-columns:repeat(6, 124px) 248px; }
}

/* =========================================================
   Ajuste: calendario con tarjetas redondeadas y eventos suaves
   ========================================================= */
.calendar-card,
.ui-card:has(.ui-calendar),
.ui-section:has(.ui-calendar){
    border-radius:22px;
    overflow:hidden;
}

.calendar-grid,
.ui-calendar{
    border-radius:16px;
}

.calendar-day,
.ui-day{
    border-radius:10px;
    overflow:hidden;
}

.calendar-task,
.ui-event{
    background:linear-gradient(135deg, color-mix(in srgb, var(--event, var(--event-color, var(--ui-cyan))) 24%, rgba(255,255,255,.05)), rgba(255,255,255,.035));
    color:var(--text);
    border-color:color-mix(in srgb, var(--event, var(--event-color, var(--ui-cyan))) 62%, transparent);
    box-shadow:0 8px 18px color-mix(in srgb, var(--event, var(--event-color, var(--ui-cyan))) 10%, transparent);
}

.calendar-task span,
.calendar-task-meta,
.ui-event small{
    background:color-mix(in srgb, var(--event, var(--event-color, var(--ui-cyan))) 18%, rgba(255,255,255,.08));
    color:var(--text);
}

/* Ajuste global de calendario: los días fuera del mes no apagan sus eventos. */
.calendar-day.is-muted,
.ui-day.is-muted{opacity:1;}
.calendar-day.is-muted header,
.ui-day.is-muted .ui-day-head{opacity:.46;}
.calendar-day.is-muted .calendar-day-tasks,
.calendar-day.is-muted .ui-day-events,
.ui-day.is-muted .calendar-day-tasks,
.ui-day.is-muted .ui-day-events{opacity:1;}

/* Ajuste global v7: lectura clara de días fuera de mes y hoy azul. */
body.light .calendar-day.is-muted,
body.light .ui-day.is-muted{
    border-color:rgba(13,72,130,.10);
    background:linear-gradient(180deg, rgba(239,246,255,.58), rgba(248,251,255,.50));
}
body.light .calendar-day.is-today,
body.light .ui-day.is-today{
    border-color:color-mix(in srgb, var(--ui-blue) 52%, rgba(13,72,130,.18));
    background:linear-gradient(180deg, color-mix(in srgb, var(--ui-blue) 12%, #fff), #f4fbff);
}
body.light .calendar-task,
body.light .ui-event{
    color:#10243d;
    background:linear-gradient(135deg, color-mix(in srgb, var(--event) 13%, #fff), #f7fbff);
}
body.light .calendar-task span,
body.light .calendar-task-meta,
body.light .ui-event small{
    color:#24364f;
    background:color-mix(in srgb, var(--event) 10%, #fff);
}

/* =========================================================
   Calendario compacto generico basado en Programas.
   Usar .app-calendar-* en nuevos modulos.
   Se mantienen alias .programas-* para compatibilidad.
   ========================================================= */
.app-calendar-shell,
.programas-month-shell{
    display:block;
    width:100%;
}

.app-calendar-nav,
.programas-month-nav{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin:0 0 14px;
}

.app-calendar-nav strong,
.programas-month-nav strong{
    color:var(--text);
    font-size:16px;
    font-weight:900;
    text-transform:capitalize;
    letter-spacing:-.01em;
    text-align:center;
}

.app-calendar-arrow,
.programas-month-arrow{
    width:36px;
    height:36px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:12px;
    border:1px solid var(--ui-line,var(--stroke));
    background:rgba(255,255,255,.05);
    color:var(--text);
    text-decoration:none;
    font-size:24px;
    font-weight:900;
    line-height:1;
    transition:background var(--transition),border-color var(--transition),transform var(--transition);
}

.app-calendar-arrow:hover,
.programas-month-arrow:hover{
    transform:translateY(-1px);
    background:rgba(91,170,224,.14);
    border-color:rgba(91,170,224,.35);
}

.app-calendar-month,
.programas-month-single{
    border:0;
    border-radius:0;
    background:transparent;
    padding:0;
}

.app-calendar-weekdays,
.app-calendar-days,
.programas-weekdays,
.programas-days{
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:6px;
}

.app-calendar-weekdays,
.programas-weekdays{
    margin-bottom:8px;
}

.app-calendar-weekdays span,
.programas-weekdays span{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:26px;
    color:var(--text-muted);
    font-size:11px;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
    text-align:center;
}

.app-calendar-day,
.programas-day{
    position:relative;
    width:100%;
    min-width:0;
    min-height:42px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid var(--ui-line,var(--stroke));
    border-radius:13px;
    background:rgba(255,255,255,.045);
    color:var(--text);
    font-size:15px;
    font-weight:800;
    cursor:pointer;
    transition:background var(--transition),border-color var(--transition),box-shadow var(--transition),transform var(--transition);
}

.app-calendar-day:hover,
.programas-day:hover{
    transform:translateY(-1px);
    background:rgba(255,255,255,.07);
    border-color:var(--stroke-strong);
}

.app-calendar-day.is-empty,
.programas-day.is-empty{
    visibility:hidden;
    pointer-events:none;
}

.app-calendar-day.has-cultos,
.programas-day.has-cultos{
    border-color:rgba(91,170,224,.58);
    background:linear-gradient(135deg,rgba(91,170,224,.20),rgba(255,255,255,.045));
    color:#fff;
    box-shadow:inset 0 0 0 1px rgba(91,170,224,.10);
}

.app-calendar-day.is-active,
.app-calendar-day.is-selected,
.programas-day.is-active,
.programas-day.is-selected{
    border-color:rgba(91,170,224,.86);
    background:linear-gradient(135deg,rgba(91,170,224,.30),rgba(91,170,224,.12));
    box-shadow:0 0 0 3px rgba(91,170,224,.14);
}

.app-calendar-day small,
.programas-day small{
    position:absolute;
    right:7px;
    top:7px;
    width:7px;
    height:7px;
    min-width:0;
    border-radius:999px;
    background:var(--ui-cyan,var(--programas-blue,#0ea5e9));
    box-shadow:0 0 0 3px rgba(91,170,224,.14);
    font-size:0;
    line-height:0;
}

body.light .app-calendar-day,
body.light .programas-day{
    background:#fff;
    border-color:rgba(20,30,60,.10);
    color:var(--text);
}
body.light .app-calendar-day.has-cultos,
body.light .programas-day.has-cultos{
    background:linear-gradient(135deg,color-mix(in srgb,var(--ui-cyan) 12%,#fff),#fff);
    border-color:color-mix(in srgb,var(--ui-cyan) 38%,rgba(20,30,60,.12));
    color:#10243d;
}

@media(max-width:640px){
    .app-calendar-weekdays{gap:5px}
    .app-calendar-days{gap:6px}
    .app-calendar-day{min-height:40px;font-size:15px;border-radius:12px}
}


/* Programas calendar reusable compact month */
.programas-month-shell{
    width:100%;
    max-width:100%;
    margin:0;
}

.programas-month-nav.ui-calendar-toolbar{
    justify-content:center;
    gap:8px;
    margin:0 0 18px;
    font-size:inherit;
}

.programas-month-nav .ui-calendar-nav.is-current{
    min-width:170px;
    text-align:center;
    text-transform:capitalize;
}

.programas-month-nav .programas-month-arrow{
    width:auto;
    height:auto;
    font-size:inherit;
    line-height:1;
}

.programas-month-single{
    width:100%;
    max-width:100%;
    margin:0 auto;
    border:0;
    border-radius:0;
    background:transparent;
    padding:0;
}

.programas-weekdays,
.programas-days{
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:8px;
}

.programas-weekdays{
    margin-bottom:8px;
}

.programas-weekdays span{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:26px;
    color:var(--text-muted,#9ca3af);
    font-size:13px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
    text-align:center;
}

.programas-day{
    position:relative;
    width:100%;
    min-width:0;
    min-height:42px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid var(--ui-line,var(--stroke));
    border-radius:13px;
    background:rgba(255,255,255,.055);
    color:var(--text);
    font-size:20px;
    font-weight:800;
    cursor:pointer;
    transition:background var(--transition),border-color var(--transition),box-shadow var(--transition),transform var(--transition);
}

.programas-day:hover{
    transform:translateY(-1px);
    background:rgba(255,255,255,.075);
    border-color:var(--stroke-strong);
}

.programas-day.is-empty{
    visibility:hidden;
    pointer-events:none;
}

.programas-day.has-cultos{
    border-color:rgba(91,170,224,.88);
    background:rgba(255,255,255,.055);
    color:var(--text);
    box-shadow:inset 0 0 0 1px rgba(91,170,224,.18);
}

.programas-day.has-cultos small{
    display:none!important;
}

.programas-day.is-active,
.programas-day.is-selected,
.programas-day.is-selected.has-cultos{
    background:linear-gradient(135deg,var(--blue-2,#2563eb),var(--cyan-1,#06b6d4));
    color:#fff;
    border-color:rgba(91,170,224,.72);
    box-shadow:0 0 0 2px rgba(32,196,244,.72);
    outline:none;
}

body.light .programas-day{
    background:#fff;
    border-color:rgba(20,30,60,.10);
    color:var(--text);
}

body.light .programas-day.has-cultos{
    background:#fff;
    border-color:color-mix(in srgb,var(--ui-cyan) 55%,rgba(20,30,60,.12));
    color:#10243d;
}

/* Responsive base: se coloca al final de las variantes para evitar que otros estilos del calendario reabran los labels. */
@media (max-width: 1100px){
    .calendar-weekdays,
    .ui-calendar-weekdays,
    .actividades-calendar-weekdays,
    .app-calendar-weekdays{
        display:none;
    }

    .calendar-grid,
    .ui-calendar,
    .actividades-calendar-grid,
    .app-calendar-days,
    .calendar-grid.is-saturday-wide,
    .ui-calendar.is-saturday-wide,
    .actividades-calendar-grid.is-saturday-wide{
        grid-template-columns:repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 760px){
    .calendar-card{
        padding:16px;
    }

    .calendar-grid,
    .ui-calendar,
    .actividades-calendar-grid,
    .app-calendar-days,
    .calendar-grid.is-saturday-wide,
    .ui-calendar.is-saturday-wide,
    .actividades-calendar-grid.is-saturday-wide{
        grid-template-columns:repeat(2, minmax(0, 1fr));
        gap:10px;
    }

    .calendar-day,
    .ui-day{
        min-height:108px;
        padding:10px;
        gap:8px;
    }

    .calendar-task,
    .ui-event{
        max-width:none;
        padding:9px 9px 9px 11px;
    }
}

@media (max-width: 520px){
    .calendar-grid,
    .ui-calendar,
    .actividades-calendar-grid,
    .app-calendar-days,
    .calendar-grid.is-saturday-wide,
    .ui-calendar.is-saturday-wide,
    .actividades-calendar-grid.is-saturday-wide{
        grid-template-columns:1fr;
    }

    .calendar-day,
    .ui-day{
        min-height:auto;
    }

    .calendar-day.is-muted,
    .ui-day.is-muted{
        display:none;
    }

    .calendar-day header,
    .ui-day-head{
        justify-content:flex-start;
        gap:8px;
    }
}


/* Responsive por contenedor: el calendario puede quedar angosto aunque el viewport sea grande. */
.actividades-panel[data-panel="calendario"]{
    container-type:inline-size;
}

@container (max-width: 1100px){
    .actividades-panel[data-panel="calendario"] .calendar-weekdays,
    .actividades-panel[data-panel="calendario"] .ui-calendar-weekdays,
    .actividades-panel[data-panel="calendario"] .actividades-calendar-weekdays{
        display:none !important;
    }

    .actividades-panel[data-panel="calendario"] .calendar-grid,
    .actividades-panel[data-panel="calendario"] .ui-calendar,
    .actividades-panel[data-panel="calendario"] .actividades-calendar-grid,
    .actividades-panel[data-panel="calendario"] .calendar-grid.is-saturday-wide,
    .actividades-panel[data-panel="calendario"] .ui-calendar.is-saturday-wide,
    .actividades-panel[data-panel="calendario"] .actividades-calendar-grid.is-saturday-wide{
        grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
    }
}

@container (max-width: 760px){
    .actividades-panel[data-panel="calendario"] .calendar-grid,
    .actividades-panel[data-panel="calendario"] .ui-calendar,
    .actividades-panel[data-panel="calendario"] .actividades-calendar-grid,
    .actividades-panel[data-panel="calendario"] .calendar-grid.is-saturday-wide,
    .actividades-panel[data-panel="calendario"] .ui-calendar.is-saturday-wide,
    .actividades-panel[data-panel="calendario"] .actividades-calendar-grid.is-saturday-wide{
        grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
        gap:10px;
    }
}

@container (max-width: 520px){
    .actividades-panel[data-panel="calendario"] .calendar-grid,
    .actividades-panel[data-panel="calendario"] .ui-calendar,
    .actividades-panel[data-panel="calendario"] .actividades-calendar-grid,
    .actividades-panel[data-panel="calendario"] .calendar-grid.is-saturday-wide,
    .actividades-panel[data-panel="calendario"] .ui-calendar.is-saturday-wide,
    .actividades-panel[data-panel="calendario"] .actividades-calendar-grid.is-saturday-wide{
        grid-template-columns:1fr !important;
    }
}

/* =========================================================
   Configuracion por iglesia: orden de semana y dia con mayor carga
   ========================================================= */
.calendar-weekdays.is-week-start-sunday.is-heavy-saturday,
.ui-calendar-weekdays.is-week-start-sunday.is-heavy-saturday,
.actividades-calendar-weekdays.is-week-start-sunday.is-heavy-saturday,
.calendar-grid.is-week-start-sunday.is-heavy-saturday,
.ui-calendar.is-week-start-sunday.is-heavy-saturday,
.actividades-calendar-grid.is-week-start-sunday.is-heavy-saturday{
    grid-template-columns:repeat(6,minmax(0,1fr)) minmax(0,2fr);
}
.calendar-weekdays.is-week-start-monday.is-heavy-saturday,
.ui-calendar-weekdays.is-week-start-monday.is-heavy-saturday,
.actividades-calendar-weekdays.is-week-start-monday.is-heavy-saturday,
.calendar-grid.is-week-start-monday.is-heavy-saturday,
.ui-calendar.is-week-start-monday.is-heavy-saturday,
.actividades-calendar-grid.is-week-start-monday.is-heavy-saturday{
    grid-template-columns:repeat(5,minmax(0,1fr)) minmax(0,2fr) minmax(0,1fr);
}
.calendar-weekdays.is-week-start-sunday.is-heavy-sunday,
.ui-calendar-weekdays.is-week-start-sunday.is-heavy-sunday,
.actividades-calendar-weekdays.is-week-start-sunday.is-heavy-sunday,
.calendar-grid.is-week-start-sunday.is-heavy-sunday,
.ui-calendar.is-week-start-sunday.is-heavy-sunday,
.actividades-calendar-grid.is-week-start-sunday.is-heavy-sunday{
    grid-template-columns:minmax(0,2fr) repeat(6,minmax(0,1fr));
}
.calendar-weekdays.is-week-start-monday.is-heavy-sunday,
.ui-calendar-weekdays.is-week-start-monday.is-heavy-sunday,
.actividades-calendar-weekdays.is-week-start-monday.is-heavy-sunday,
.calendar-grid.is-week-start-monday.is-heavy-sunday,
.ui-calendar.is-week-start-monday.is-heavy-sunday,
.actividades-calendar-grid.is-week-start-monday.is-heavy-sunday{
    grid-template-columns:repeat(6,minmax(0,1fr)) minmax(0,2fr);
}
.actividades-calendar-grid .actividades-day.is-heavy-day .ui-day-events,
.actividades-calendar-grid .actividades-day.is-heavy-day .calendar-day-tasks{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    align-items:start;
}
.actividades-calendar-grid .actividades-day.is-heavy-day .ui-event,
.actividades-calendar-grid .actividades-day.is-heavy-day .calendar-task{
    max-width:none;
}
@media(max-width:900px){
    .calendar-weekdays.is-week-start-sunday.is-heavy-saturday,
    .ui-calendar-weekdays.is-week-start-sunday.is-heavy-saturday,
    .actividades-calendar-weekdays.is-week-start-sunday.is-heavy-saturday,
    .calendar-grid.is-week-start-sunday.is-heavy-saturday,
    .ui-calendar.is-week-start-sunday.is-heavy-saturday,
    .actividades-calendar-grid.is-week-start-sunday.is-heavy-saturday{grid-template-columns:repeat(6,124px) 248px;}
    .calendar-weekdays.is-week-start-monday.is-heavy-saturday,
    .ui-calendar-weekdays.is-week-start-monday.is-heavy-saturday,
    .actividades-calendar-weekdays.is-week-start-monday.is-heavy-saturday,
    .calendar-grid.is-week-start-monday.is-heavy-saturday,
    .ui-calendar.is-week-start-monday.is-heavy-saturday,
    .actividades-calendar-grid.is-week-start-monday.is-heavy-saturday{grid-template-columns:repeat(5,124px) 248px 124px;}
    .calendar-weekdays.is-week-start-sunday.is-heavy-sunday,
    .ui-calendar-weekdays.is-week-start-sunday.is-heavy-sunday,
    .actividades-calendar-weekdays.is-week-start-sunday.is-heavy-sunday,
    .calendar-grid.is-week-start-sunday.is-heavy-sunday,
    .ui-calendar.is-week-start-sunday.is-heavy-sunday,
    .actividades-calendar-grid.is-week-start-sunday.is-heavy-sunday{grid-template-columns:248px repeat(6,124px);}
    .calendar-weekdays.is-week-start-monday.is-heavy-sunday,
    .ui-calendar-weekdays.is-week-start-monday.is-heavy-sunday,
    .actividades-calendar-weekdays.is-week-start-monday.is-heavy-sunday,
    .calendar-grid.is-week-start-monday.is-heavy-sunday,
    .ui-calendar.is-week-start-monday.is-heavy-sunday,
    .actividades-calendar-grid.is-week-start-monday.is-heavy-sunday{grid-template-columns:repeat(6,124px) 248px;}
    .actividades-calendar-grid .actividades-day.is-heavy-day .ui-day-events,
    .actividades-calendar-grid .actividades-day.is-heavy-day .calendar-day-tasks{grid-template-columns:minmax(0,1fr);}
}

/* Navegador mensual estandarizado */
.ui-month-nav,
.ui-calendar-toolbar[class*="month-nav"],
.ui-module-actions[class*="month-nav"]{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    flex-wrap:nowrap;
    margin:0;
}
.ui-month-nav .ui-calendar-nav,
.ui-calendar-toolbar[class*="month-nav"] .ui-calendar-nav,
.ui-module-actions[class*="month-nav"] .ui-calendar-nav{
    min-width:42px;
    min-height:36px;
    height:36px;
    padding:0 13px;
    border-radius:12px;
    line-height:1;
}
.ui-month-nav .ui-calendar-nav.is-current,
.ui-calendar-toolbar[class*="month-nav"] .ui-calendar-nav.is-current,
.ui-module-actions[class*="month-nav"] .ui-calendar-nav.is-current{
    min-width:170px;
    text-align:center;
    text-transform:capitalize;
}
@media(max-width:640px){
    .ui-month-nav,
    .ui-calendar-toolbar[class*="month-nav"],
    .ui-module-actions[class*="month-nav"]{width:100%;}
    .ui-month-nav .ui-calendar-nav.is-current,
    .ui-calendar-toolbar[class*="month-nav"] .ui-calendar-nav.is-current,
    .ui-module-actions[class*="month-nav"] .ui-calendar-nav.is-current{flex:1; min-width:0;}
}

/* =========================================================
   Layout global: vista de calendario mini
   Usado por Asistencia, Programas y Bosquejos.
   No depende del CSS de ningun modulo.
   ========================================================= */
.ui-calendar-layout,
.programas-body-grid{
    display:grid;
    grid-template-columns:minmax(320px,430px) minmax(0,1fr);
    gap:22px;
    padding:22px 24px;
    align-items:start;
}

.ui-calendar-col,
.programas-calendar-col{
    min-width:0;
}

.ui-calendar-frame,
.programas-calendar-frame{
    position:sticky;
    top:16px;
    min-width:0;
    border:1px solid var(--border-color,rgba(148,163,184,.22));
    border-radius:22px;
    background:rgba(10,14,22,.20);
    padding:16px;
}

.ui-calendar-workspace,
.programas-workspace{
    min-width:0;
    padding:0;
}

/* =========================================================
   Calendario mini global
   Alias legacy .programas-* se conservan porque Asistencia,
   Programas y Bosquejos ya usan ese markup compartido.
   ========================================================= */
.app-calendar-shell,
.programas-month-shell{
    display:block;
    width:100%;
    max-width:100%;
    margin:0;
}

.app-calendar-nav,
.programas-month-nav,
.programas-month-nav.ui-calendar-toolbar{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    margin:0 0 18px;
    font-size:inherit;
}

.app-calendar-nav strong,
.programas-month-nav strong,
.programas-month-nav .ui-calendar-nav.is-current{
    min-width:170px;
    min-height:36px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:0 14px;
    border-radius:12px;
    text-align:center;
    text-transform:capitalize;
    color:#fff;
    font-size:16px;
    font-weight:900;
    line-height:1;
    letter-spacing:-.01em;
    background:linear-gradient(135deg,var(--blue-2,#2563eb),var(--cyan-1,#06b6d4));
    border:1px solid rgba(91,170,224,.55);
}

.app-calendar-arrow,
.programas-month-arrow,
.programas-month-nav .programas-month-arrow{
    width:38px;
    height:38px;
    min-width:38px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:12px;
    border:1px solid var(--ui-line,var(--stroke));
    background:rgba(255,255,255,.065);
    color:var(--text);
    text-decoration:none;
    font-size:22px;
    font-weight:900;
    line-height:1;
    transition:background var(--transition),border-color var(--transition),transform var(--transition);
}

.app-calendar-arrow:hover,
.programas-month-arrow:hover{
    transform:translateY(-1px);
    background:rgba(91,170,224,.14);
    border-color:rgba(91,170,224,.42);
}

.app-calendar-month,
.programas-month,
.programas-month-single{
    width:100%;
    max-width:100%;
    display:block;
    margin:0 auto;
    border:0;
    border-radius:0;
    background:transparent;
    padding:0;
    color:var(--text);
    font-weight:900;
}

.app-calendar-weekdays,
.app-calendar-days,
.programas-weekdays,
.programas-days{
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:8px;
}

.app-calendar-weekdays,
.programas-weekdays{
    margin-bottom:8px;
}

.app-calendar-weekdays span,
.programas-weekdays span{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:26px;
    color:var(--text-muted,#9ca3af);
    font-size:13px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
    text-align:center;
}

.app-calendar-day,
.programas-day{
    position:relative;
    width:100%;
    min-width:0;
    min-height:42px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid var(--ui-line,var(--stroke));
    border-radius:13px;
    background:rgba(255,255,255,.055);
    color:var(--text);
    font-size:20px;
    font-weight:800;
    cursor:pointer;
    transition:background var(--transition),border-color var(--transition),box-shadow var(--transition),transform var(--transition),color var(--transition),opacity var(--transition);
}

.app-calendar-day span,
.programas-day span{
    font-size:inherit;
    line-height:1;
}

.app-calendar-day:hover,
.programas-day:hover{
    transform:translateY(-1px);
    background:rgba(255,255,255,.075);
    border-color:var(--stroke-strong);
}

.app-calendar-day.is-empty,
.programas-day.is-empty{
    visibility:hidden;
    pointer-events:none;
}

.app-calendar-day.has-cultos,
.programas-day.has-cultos{
    border-color:rgba(91,170,224,.88);
    background:rgba(255,255,255,.055);
    color:var(--text);
    box-shadow:inset 0 0 0 1px rgba(91,170,224,.18);
}

.app-calendar-day.has-cultos small,
.programas-day.has-cultos small{
    display:none!important;
}

.app-calendar-day.has-cultos.is-past-culto:not(.is-active):not(.is-selected),
.programas-day.has-cultos.is-past-culto:not(.is-active):not(.is-selected){
    background:rgba(14,165,233,.12);
    border-color:rgba(56,189,248,.32);
    color:color-mix(in srgb,var(--text) 78%,var(--text-muted));
    box-shadow:inset 0 0 0 1px rgba(91,170,224,.08);
}

.app-calendar-day.has-cultos.is-past-culto:not(.is-active):not(.is-selected) span,
.programas-day.has-cultos.is-past-culto:not(.is-active):not(.is-selected) span{
    opacity:.86;
}

.app-calendar-day.has-cultos.is-past-culto:not(.is-active):not(.is-selected):hover,
.programas-day.has-cultos.is-past-culto:not(.is-active):not(.is-selected):hover,
.app-calendar-day.has-cultos.is-past-culto:not(.is-active):not(.is-selected):focus-visible,
.programas-day.has-cultos.is-past-culto:not(.is-active):not(.is-selected):focus-visible{
    background:rgba(14,165,233,.18);
    border-color:rgba(56,189,248,.46);
    color:var(--text);
}

.app-calendar-day.is-active,
.app-calendar-day.is-selected,
.app-calendar-day.is-selected.has-cultos,
.programas-day.is-active,
.programas-day.is-selected,
.programas-day.is-selected.has-cultos{
    background:linear-gradient(135deg,var(--blue-2,#2563eb),var(--cyan-1,#06b6d4));
    color:#fff;
    border-color:rgba(91,170,224,.72);
    box-shadow:0 0 0 2px rgba(32,196,244,.72);
    outline:none;
}

body.light .ui-calendar-frame,
body.light .programas-calendar-frame{
    background:rgba(255,255,255,.72);
    border-color:rgba(20,30,60,.10);
}

body.light .app-calendar-day,
body.light .programas-day{
    background:#fff;
    border-color:rgba(20,30,60,.10);
    color:#10243d;
}

body.light .app-calendar-day.has-cultos,
body.light .programas-day.has-cultos{
    background:#fff;
    border-color:color-mix(in srgb,var(--ui-cyan) 55%,rgba(20,30,60,.12));
    color:#10243d;
}

body.light .app-calendar-day.has-cultos.is-past-culto:not(.is-active):not(.is-selected),
body.light .programas-day.has-cultos.is-past-culto:not(.is-active):not(.is-selected){
    background:color-mix(in srgb,var(--ui-cyan) 5%,#fff);
    border-color:color-mix(in srgb,var(--ui-cyan) 30%,rgba(20,30,60,.12));
    color:color-mix(in srgb,#10243d 72%,#7891ae);
}

@media(max-width:1100px){
    .ui-calendar-layout,
    .programas-body-grid{
        grid-template-columns:1fr;
        padding:18px;
    }
    .ui-calendar-frame,
    .programas-calendar-frame{
        position:relative;
        top:auto;
    }
}

@media(max-width:640px){
    .ui-calendar-layout,
    .programas-body-grid{
        padding:16px;
        gap:16px;
    }
    .ui-calendar-frame,
    .programas-calendar-frame{
        padding:14px;
        border-radius:20px;
    }
    .app-calendar-weekdays,
    .app-calendar-days,
    .programas-weekdays,
    .programas-days{
        gap:6px;
    }
    .app-calendar-day,
    .programas-day{
        min-height:40px;
        font-size:15px;
        border-radius:12px;
    }
}

/* =========================================================
   Mini calendario y layout compartido
   Usado por Asistencia, Programas y Bosquejos.
   No colocar estilos de este patrón dentro de módulos.
   ========================================================= */
.ui-mini-calendar-layout,
.programas-body-grid,
.bosquejos-body-grid,
.asistencia-body-grid{
    display:grid;
    grid-template-columns:minmax(300px,430px) minmax(0,1fr);
    gap:22px;
    align-items:start;
    width:100%;
    min-width:0;
}

.ui-mini-calendar-col,
.programas-calendar-col,
.asistencia-calendar-col{
    min-width:0;
}

.ui-mini-calendar-card,
.ui-mini-calendar-frame,
.programas-calendar-frame{
    position:sticky;
    top:16px;
    width:100%;
    min-width:0;
    border:1px solid var(--border-color,var(--stroke));
    border-radius:22px;
    background:rgba(10,14,22,.20);
    padding:16px;
    overflow:hidden;
}

.ui-mini-calendar-main,
.ui-mini-calendar-workspace,
.programas-workspace,
.bosquejos-workspace,
.asistencia-workspace{
    min-width:0;
}

.ui-mini-calendar-main,
.programas-workspace{
    padding:0;
}

.ui-mini-calendar-workspace,
.bosquejos-workspace{
    min-height:360px;
}

.ui-mini-calendar-empty,
.programas-welcome,
.programas-empty,
.programas-loading{
    border:1px dashed var(--border-color,var(--stroke));
    border-radius:18px;
    padding:22px;
    background:rgba(255,255,255,.03);
    color:var(--text-soft,var(--text-muted));
}

.ui-mini-calendar-empty h3,
.programas-welcome h3,
.programas-empty strong{
    margin:0 0 6px;
    color:var(--text);
    font-size:20px;
    line-height:1.15;
}

.ui-mini-calendar-empty p,
.programas-welcome p,
.programas-empty p{
    margin:0;
    color:var(--text-soft,var(--text-muted));
}

.programas-empty.compact{
    padding:18px;
}

.ui-mini-calendar-shell,
.programas-month-shell,
.asistencia-month-shell,
.bosquejos-month-shell{
    display:block;
    width:100%;
    max-width:100%;
    margin:0;
}

.ui-mini-calendar-nav,
.programas-month-nav,
.programas-month-nav.ui-calendar-toolbar{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    margin:0 0 18px;
    padding:0;
    border:0;
    background:transparent;
}

.ui-mini-calendar-arrow,
.programas-month-arrow,
.ui-mini-calendar-nav .ui-calendar-nav:not(.is-current){
    width:38px;
    height:38px;
    min-width:38px;
    min-height:38px;
    padding:0;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:12px;
    border:1px solid var(--ui-line,var(--stroke));
    background:rgba(255,255,255,.07);
    color:var(--text);
    font-size:20px;
    font-weight:900;
    line-height:1;
    text-decoration:none;
    transition:background var(--transition),border-color var(--transition),transform var(--transition);
}

.ui-mini-calendar-arrow:hover,
.programas-month-arrow:hover,
.ui-mini-calendar-nav .ui-calendar-nav:not(.is-current):hover{
    transform:translateY(-1px);
    background:rgba(91,170,224,.16);
    border-color:rgba(91,170,224,.42);
}

.ui-mini-calendar-current,
.programas-month-current,
.ui-mini-calendar-nav .ui-calendar-nav.is-current{
    min-width:170px;
    min-height:38px;
    padding:0 18px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:12px;
    border:1px solid rgba(91,170,224,.48);
    background:linear-gradient(135deg,rgba(37,99,235,.90),rgba(6,182,212,.82));
    color:#fff;
    font-size:16px;
    font-weight:900;
    line-height:1;
    text-align:center;
    text-transform:capitalize;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);
}

.ui-mini-calendar-month,
.programas-month-single,
.programas-month,
.asistencia-month,
.bosquejos-month{
    width:100%;
    max-width:100%;
    margin:0 auto;
    border:0;
    border-radius:0;
    background:transparent;
    padding:0;
}

.ui-mini-calendar-weekdays,
.programas-weekdays,
.ui-mini-calendar-days,
.programas-days{
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:8px;
}

.ui-mini-calendar-weekdays,
.programas-weekdays{
    margin-bottom:8px;
}

.ui-mini-calendar-weekdays span,
.programas-weekdays span{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:26px;
    padding:0;
    border:0;
    background:transparent;
    color:var(--text-muted,#9ca3af);
    font-size:13px;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
    text-align:center;
}

.ui-mini-calendar-day,
.programas-day{
    position:relative;
    width:100%;
    min-width:0;
    min-height:50px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid var(--ui-line,var(--stroke));
    border-radius:13px;
    background:rgba(255,255,255,.035);
    color:var(--text-muted,#9ca3af);
    font-size:20px;
    font-weight:900;
    line-height:1;
    cursor:pointer;
    opacity:.46;
    transition:background var(--transition),border-color var(--transition),box-shadow var(--transition),transform var(--transition),opacity var(--transition),color var(--transition);
}

.ui-mini-calendar-day:hover,
.programas-day:hover{
    transform:translateY(-1px);
    opacity:.76;
    background:rgba(255,255,255,.055);
    border-color:var(--stroke-strong);
}

.ui-mini-calendar-day.is-empty,
.programas-day.is-empty{
    visibility:hidden;
    pointer-events:none;
}

.ui-mini-calendar-day.has-cultos,
.ui-mini-calendar-day.has-reuniones,
.programas-day.has-cultos,
.programas-day.has-reuniones{
    opacity:1;
    border-color:rgba(91,170,224,.88);
    background:rgba(91,170,224,.14);
    color:#fff;
    box-shadow:inset 0 0 0 1px rgba(91,170,224,.18);
}

.ui-mini-calendar-day.is-past-culto,
.ui-mini-calendar-day.is-past-reunion,
.programas-day.is-past-culto,
.programas-day.is-past-reunion{
    opacity:.68;
    border-color:rgba(91,170,224,.58);
    background:rgba(91,170,224,.08);
    color:#fff;
    box-shadow:inset 0 0 0 1px rgba(91,170,224,.10);
}

.ui-mini-calendar-day.is-active,
.ui-mini-calendar-day.is-selected,
.ui-mini-calendar-day.is-active.has-cultos,
.ui-mini-calendar-day.is-selected.has-cultos,
.programas-day.is-active,
.programas-day.is-selected,
.programas-day.is-active.has-cultos,
.programas-day.is-selected.has-cultos{
    opacity:1;
    background:linear-gradient(135deg,var(--blue-2,#2563eb),var(--cyan-1,#06b6d4));
    color:#fff;
    border-color:rgba(91,170,224,.72);
    box-shadow:0 0 0 2px rgba(32,196,244,.72);
    outline:none;
}

.ui-mini-calendar-day small,
.programas-day small{
    display:none!important;
}

body.light .ui-mini-calendar-card,
body.light .ui-mini-calendar-frame,
body.light .programas-calendar-frame{
    background:rgba(255,255,255,.72);
}

body.light .ui-mini-calendar-day,
body.light .programas-day{
    background:#fff;
    border-color:rgba(20,30,60,.10);
    color:#64748b;
    opacity:.50;
}

body.light .ui-mini-calendar-day.has-cultos,
body.light .ui-mini-calendar-day.has-reuniones,
body.light .programas-day.has-cultos,
body.light .programas-day.has-reuniones{
    opacity:1;
    background:color-mix(in srgb,var(--ui-cyan) 10%,#fff);
    border-color:color-mix(in srgb,var(--ui-cyan) 58%,rgba(20,30,60,.12));
    color:#10243d;
}

body.light .ui-mini-calendar-day.is-past-culto,
body.light .ui-mini-calendar-day.is-past-reunion,
body.light .programas-day.is-past-culto,
body.light .programas-day.is-past-reunion{
    opacity:.70;
    background:color-mix(in srgb,var(--ui-cyan) 7%,#fff);
    border-color:color-mix(in srgb,var(--ui-cyan) 42%,rgba(20,30,60,.12));
    color:#10243d;
}

body.light .ui-mini-calendar-day.is-active,
body.light .ui-mini-calendar-day.is-selected,
body.light .programas-day.is-active,
body.light .programas-day.is-selected{
    opacity:1;
    background:linear-gradient(135deg,var(--blue-2,#2563eb),var(--cyan-1,#06b6d4));
    color:#fff;
}

@media(max-width:1050px){
    .ui-mini-calendar-layout,
    .programas-body-grid,
    .bosquejos-body-grid,
    .asistencia-body-grid{
        grid-template-columns:1fr;
        gap:18px;
    }
    .ui-mini-calendar-card,
    .ui-mini-calendar-frame,
    .programas-calendar-frame{
        position:relative;
        top:auto;
    }
}

@media(max-width:640px){
    .ui-mini-calendar-layout,
    .programas-body-grid,
    .bosquejos-body-grid,
    .asistencia-body-grid{
        gap:14px;
    }
    .ui-mini-calendar-card,
    .ui-mini-calendar-frame,
    .programas-calendar-frame{
        padding:14px;
        border-radius:20px;
    }
    .ui-mini-calendar-nav,
    .programas-month-nav,
    .programas-month-nav.ui-calendar-toolbar{
        gap:6px;
    }
    .ui-mini-calendar-current,
    .programas-month-current,
    .ui-mini-calendar-nav .ui-calendar-nav.is-current{
        min-width:0;
        flex:1;
        padding-inline:12px;
        font-size:15px;
    }
    .ui-mini-calendar-weekdays,
    .programas-weekdays,
    .ui-mini-calendar-days,
    .programas-days{
        gap:6px;
    }
    .ui-mini-calendar-day,
    .programas-day{
        min-height:42px;
        border-radius:12px;
        font-size:16px;
    }
}

