/* ========================================
   CALENDAR BASE - Variabili e Utility
   ======================================== */

:root {
    /* Colori calendario */
    --cal-primary: var(--color-primary);
    --cal-primary-light: var(--color-primary);
    --cal-primary-dark: var(--color-accent);
    --cal-primary-bg: var(--color-primary-light);
    
    --cal-success: var(--color-success);
    --cal-warning: var(--color-warning);
    --cal-danger: var(--color-danger);
    
    --cal-bg-white: var(--color-bg-card);
    --cal-bg-gray-50: var(--color-bg-secondary);
    --cal-bg-gray-100: var(--color-border-light);
    
    --cal-border-gray: var(--color-border);
    --cal-text-dark: var(--color-text);
    --cal-text-gray: var(--color-text-muted);
    --cal-text-light: var(--color-text-light);
    
    /* Spaziature */
    --cal-spacing-xs: 4px;
    --cal-spacing-sm: 8px;
    --cal-spacing-md: 12px;
    --cal-spacing-lg: 20px;
    --cal-spacing-xl: 30px;
    
    /* Border radius */
    --cal-radius-sm: 4px;
    --cal-radius-md: 4px;
    --cal-radius-lg: 4px;
    --cal-radius-xl: 6px;
    
    /* Shadows */
    --cal-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.06);
    --cal-shadow-md: 0 4px 20px rgba(0, 0, 0, 0.08);
    --cal-shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.12);
    --cal-shadow-primary: 0 4px 12px rgba(194, 65, 12, 0.3);
    
    /* Transizioni */
    --cal-transition-fast: 0.2s ease;
    --cal-transition-normal: 0.3s ease;
    --cal-transition-slow: 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Utility classes */
.cal-hidden {
    display: none !important;
}

.cal-visible {
    display: block !important;
}

/* Loading state */
.cal-loading {
    opacity: 0.6;
    pointer-events: none;
    position: relative;
}

.cal-loading::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 40px;
    height: 40px;
    margin: -20px 0 0 -20px;
    border: 4px solid var(--cal-border-gray);
    border-top-color: var(--cal-primary);
    border-radius: 50%;
    animation: cal-spin 0.8s linear infinite;
}

@keyframes cal-spin {
    to { transform: rotate(360deg); }
}

/* Badges comuni */
.badge {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
}

.badge-success {
    background: var(--color-success-bg);
    color: var(--color-success-text);
}

.badge-warning {
    background: var(--color-warning-bg);
    color: var(--color-warning-text);
}

.badge-danger {
    background: var(--color-danger-bg);
    color: var(--color-danger-text);
}

/* Buttons comuni */
.cal-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 20px;
    border: none;
    border-radius: var(--cal-radius-md);
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all var(--cal-transition-fast);
    text-decoration: none;
}

.cal-btn:hover {
    transform: translateY(-2px);
}

.cal-btn:active {
    transform: translateY(0);
}

.cal-btn-primary {
    background: linear-gradient(135deg, var(--cal-primary), var(--cal-primary-light));
    color: white;
    box-shadow: var(--cal-shadow-primary);
}

.cal-btn-primary:hover {
    box-shadow: 0 6px 20px rgba(194, 65, 12, 0.4);
}

.cal-btn-outline {
    background: transparent;
    border: 2px solid var(--cal-primary);
    color: var(--cal-primary);
}

.cal-btn-outline:hover {
    background: var(--cal-primary-bg);
}

/* Responsive helpers */
.mobile-only {
    display: none;
}

.desktop-only {
    display: block;
}

@media (max-width: 768px) {
    .mobile-only {
        display: block;
    }
    
    .desktop-only {
        display: none;
    }
}


/* ========================================
   VIEW TOGGLE + LIST VIEW (v12.0)
   ======================================== */

/* --- Toggle --- */
.calendar-view-toggle {
    display: flex;
    gap: 4px;
    margin-left: auto;
    background: var(--cal-bg-gray-50);
    border: 1px solid var(--cal-border-gray);
    border-radius: var(--cal-radius-sm);
    padding: 3px;
}

.toggle-btn {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 6px 10px;
    border: none;
    border-radius: 6px;
    background: transparent;
    color: var(--cal-text-gray);
    cursor: pointer;
    transition: var(--cal-transition-fast);
    font-size: 0.78rem;
    font-weight: 500;
}

.toggle-btn:hover {
    color: var(--cal-text-dark);
    background: var(--cal-bg-gray-100);
}

.toggle-btn.active {
    background: var(--cal-primary-bg);
    color: var(--cal-primary);
}

.toggle-btn svg {
    flex-shrink: 0;
}

/* --- List View --- */
.calendar-list-view {
    padding: 8px 0;
}

.list-day-section {
    margin-bottom: 20px;
}

.list-day-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 16px;
    border-radius: var(--cal-radius-sm);
    margin-bottom: 8px;
    background: var(--cal-bg-gray-50);
    border: 1px solid var(--cal-border-gray);
}

.list-day-header.today {
    background: var(--cal-primary-bg);
    border-color: var(--cal-primary);
}

.list-day-name {
    font-size: 0.92rem;
    font-weight: 700;
    color: var(--cal-text-dark);
    text-transform: capitalize;
}

.list-day-date {
    font-size: 0.82rem;
    color: var(--cal-text-gray);
}

.list-today-badge {
    padding: 2px 10px;
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: 4px;
    background: var(--cal-primary);
    color: var(--color-bg-card);
}

.list-day-count {
    margin-left: auto;
    font-size: 0.75rem;
    color: var(--cal-text-light);
}

.list-courses {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.list-course-card {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    background: var(--cal-bg-gray-50);
    border: 1px solid var(--cal-border-gray);
    border-left: 4px solid var(--cal-primary);
    border-radius: var(--cal-radius-md);
    transition: var(--cal-transition-fast);
}

.list-course-card:hover {
    box-shadow: var(--cal-shadow-sm);
    transform: translateX(2px);
}

.list-course-icon {
    font-size: 1.6rem;
    flex-shrink: 0;
    width: 40px;
    text-align: center;
}

.list-course-info {
    flex: 1;
    min-width: 0;
}

.list-course-name {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--cal-text-dark);
    margin-bottom: 4px;
}

.list-course-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    font-size: 0.78rem;
    color: var(--cal-text-gray);
}

.list-course-capacity {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

.list-capacity-bar-wrap {
    width: 60px;
    height: 6px;
    background: var(--cal-bg-gray-100);
    border-radius: 3px;
    overflow: hidden;
}

.list-capacity-bar {
    height: 100%;
    border-radius: 3px;
    transition: width 0.3s;
}

.list-capacity-text {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--cal-text-gray);
    min-width: 40px;
}

.list-status-badge {
    padding: 3px 10px;
    font-size: 0.65rem;
    font-weight: 700;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.list-status-badge.available { background: var(--color-success-bg); color: var(--color-success-text); }
.list-status-badge.almost { background: var(--color-warning-bg); color: var(--color-warning-text); }
.list-status-badge.full { background: var(--color-danger-bg); color: var(--color-danger-text); }

.list-empty {
    text-align: center;
    padding: 48px 20px;
    color: var(--cal-text-light);
}

.list-empty-icon {
    font-size: 2.5rem;
    margin-bottom: 12px;
}

/* --- Mobile: ALWAYS list, hide toggle & grid --- */
@media (max-width: 768px) {
    .calendar-view-toggle {
        display: none !important;
    }
    .calendar-grid-wrapper {
        display: none !important;
    }
    .calendar-expand-bar {
        display: none !important;
    }
    .calendar-list-view {
        display: block !important;
    }
    .list-course-card {
        flex-wrap: wrap;
        gap: 8px;
        padding: 12px;
    }
    .list-course-capacity {
        width: 100%;
        justify-content: flex-end;
    }
    .list-course-meta {
        gap: 6px;
    }
    .calendar-header {
        flex-wrap: wrap;
    }
}

/* ═══ Multi-sede calendar classes ═══ */
.sede-filter-tabs{display:flex;gap:6px;margin-bottom:16px;flex-wrap:wrap}
.sede-tab{padding:6px 14px;border-radius:4px;border:1px solid var(--color-border,#e5e7eb);background:transparent;color:var(--color-text-muted,#6b7280);font-size:13px;cursor:pointer;transition:all .2s;white-space:nowrap}
.sede-tab:hover{border-color:var(--color-primary);color:var(--color-primary)}
.sede-tab.active{background:var(--color-primary);color:white;border-color:var(--color-primary)}
.badge-sede-small{display:inline-block;font-size:11px;padding:2px 8px;border-radius: 4px;background:var(--color-primary-bg,rgba(var(--color-primary-rgb,147,51,234),.08));color:var(--color-primary);margin:2px}
.teacher-sedi-badges{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.contact-sede-select{width:100%;padding:10px 12px;border:1px solid var(--color-border,#e5e7eb);border-radius:var(--radius-md,8px);font-size:14px;margin-bottom:12px;background:var(--color-bg,#fff);color:var(--color-text)}
.mobile-sede-filter{display:none;margin-bottom:12px}
.mobile-sede-select{width:100%;padding:8px 12px;border:1px solid var(--color-border,#e5e7eb);border-radius:var(--radius-md,8px);font-size:13px}
@media(max-width:768px){.sede-filter-tabs{display:none}.mobile-sede-filter{display:block}}
.badge-sede{display:inline-block;padding:3px 10px;border-radius: 4px;font-size:12px;font-weight:500;background:var(--color-primary-bg,rgba(var(--color-primary-rgb,147,51,234),.08));color:var(--color-primary)}
.badge-sede-global{background:var(--color-bg-tertiary,#f3f4f6);color:var(--color-text-muted)}
.membership-sede-info{margin-top:4px}.membership-sede-label{font-size:12px;color:var(--color-text-muted)}
.list-meta-sede{font-size:12px;color:var(--color-text-muted);margin-left:8px}