/* Home page - layout moderno (FASE 06)
 * Dashboard a widget: KPI row, bar chart settimanale, lista bimbi,
 * quick actions, statistiche dinamiche, apparati
 */

/* ========== KPI Cards (4 in riga) ========== */
.home-kpi-card {
    display: flex;
    align-items: center;
    padding: 18px 20px;
    border-radius: 16px;
    text-decoration: none !important;
    color: white;
    box-shadow: 0 4px 16px rgba(0,0,0,0.10);
    transition: transform 0.18s ease, box-shadow 0.18s ease;
    min-height: 100px;
    height: 100%;
    gap: 14px;
}
.home-kpi-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.51);
    font-weight: 900;
    font-size: 20px;
}
.home-kpi-icon {
    flex: 0 0 auto;
    width: 54px;
    height: 54px;
    border-radius: 14px;
    background: rgba(255,255,255,0.20);
    display: flex;
    align-items: center;
    justify-content: center;
}
.home-kpi-icon .material-symbols-outlined {
    font-size: 34px !important;
    color: var(--color-brand-text);
    line-height: 1;
    display: block;
}
.home-kpi-body { flex: 1 1 auto; min-width: 0; }
.home-kpi-value {
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 1;
    font-family: TitilliumWeb-Bold, sans-serif;
}
.home-kpi-label {
    font-size: 0.82rem;
    opacity: 0.92;
    margin-top: 3px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.home-kpi-green  { background: linear-gradient(135deg, var(--color-brand) 0%, var(--color-accent) 100%); box-shadow: 0 4px 16px rgba(69,130,58,0.25); }
.home-kpi-blue   { background: transparent; border: 1px solid var(--theme-blue-d);  color: var(--color-text);}
.home-kpi-orange { background: linear-gradient(135deg, var(--theme-orange-d) 0%, var(--theme-orange-l) 100%); }
.home-kpi-yellow { background: linear-gradient(135deg, #8a6d00 0%, #e0b800 100%); }
.home-kpi-gray   { background: transparent; border: 1px solid #78909c; color: var(--color-brand-text);}
.home-kpi-green .home-kpi-icon .material-symbols-outlined,
.home-kpi-orange .home-kpi-icon .material-symbols-outlined,
.home-kpi-yellow .home-kpi-icon .material-symbols-outlined { color: rgba(255,255,255,0.85); }

/* ========== Widget generico ========== */
.home-widget {
    background: #fdfffd;
    border-radius: 18px;
    border: 1px solid #1d531300;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08);
    overflow: hidden;
    height: 100%;
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}
.home-widget:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.729);
    border-color: var(--color-brand);
}
.home-widget-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 14px 18px 10px;
    border-bottom: 1px solid #f0f2f5;
    font-family: TitilliumWeb-Bold, sans-serif;
    font-size: 0.92rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    color: #374151;
}
.home-widget-header .material-symbols-outlined {
    font-size: 1.3rem !important;
    color: var(--color-accent);
}
.home-widget-body { padding: 14px 18px; }
.home-chart-container {
    position: relative;
    padding: 8px 12px 14px;
}

/* ========== Lista bambini oggi ========== */
.home-children-list {
    max-height: 320px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--color-border) transparent;
}
.home-child-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 18px;
    border-bottom: 1px solid #f3f4f6;
    font-size: 0.90rem;
    transition: background 0.12s;
}
.home-child-row:last-child { border-bottom: none; }
.home-child-row:hover { background: #f8faf5; }
.home-child-avatar {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--color-accent) 0%, var(--color-brand) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.78rem;
    font-weight: 700;
    color: white;
    flex-shrink: 0;
    text-transform: uppercase;
}
.home-child-name {
    flex: 1 1 auto;
    min-width: 0;
    font-weight: 600;
    color: var(--color-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.home-child-link {
    text-decoration: none !important;
    color: inherit;
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1 1 auto;
    min-width: 0;
}
.home-child-link:hover .home-child-name { color: var(--color-brand-text); }
.home-presence-badge {
    flex-shrink: 0;
    font-size: 0.72rem;
    font-weight: 700;
    padding: 3px 9px;
    border-radius: 20px;
    letter-spacing: 0.3px;
    text-transform: uppercase;
}
.home-presence-badge.present {
    background: #dcfce7;
    color: #15803d;
}
.home-presence-badge.absent {
    background: #f3f4f6;
    color: #9ca3af;
}

/* ========== Quick actions panel (legacy, non più usato) ========== */
.home-quick-link {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 18px;
    border-bottom: 1px solid #f3f4f6;
    text-decoration: none !important;
    color: var(--color-text);
    font-size: 0.92rem;
    font-weight: 600;
    transition: background 0.12s, color 0.12s;
}
.home-quick-link:last-child { border-bottom: none; }
.home-quick-link:hover { background: #f8faf5; color: var(--color-brand-text); }
.home-quick-link-icon {
    width: 36px; height: 36px; border-radius: 10px;
    display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.home-quick-link-icon .material-symbols-outlined { font-size: 1.3rem !important; color: white; line-height: 1; }
.home-quick-link-text { flex: 1 1 auto; }
.home-quick-link-sub { font-size: 0.78rem; font-weight: 400; color: var(--color-text-muted); display: block; line-height: 1.2; }
.home-quick-link-arrow { color: #d1d5db; font-size: 1.1rem !important; flex-shrink: 0; }
.home-quick-link:hover .home-quick-link-arrow { color: var(--color-accent); }

/* ========== Page-level layout: sidebar + content ========== */
.home-page-layout {
    display: flex;
    gap: 20px;
    align-items: flex-start;
}
.home-sidebar-outer {
    flex: 0 0 230px;
    width: 230px;
}
.home-content-area {
    flex: 1 1 auto;
    min-width: 0;
}

/* ========== Sidebar Navigation Panel (Home) ========== */
.home-sidebar-nav {
    border: none !important;
    box-shadow: none !important;
}
.home-nav-section {
    border-bottom: 1px solid #f0f2f5;
    padding: 3px 0;
}
.home-nav-section:last-child { border-bottom: none; }
.home-nav-section-title {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 10px 16px 3px;
    font-size: 1.18rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.9px;
    color: #9ca3af;
    font-family: TitilliumWeb-Bold, sans-serif;
}
.home-nav-section-title .material-symbols-outlined {
    font-size: 0.88rem !important;
    color: var(--color-accent);
    line-height: 1;
}
.home-nav-link {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    margin: 2px 8px;
    border-radius: 10px;
    text-decoration: none !important;
    color: #374151;
    font-size: 0.96rem;
    font-weight: 500;
    transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.15s, color 0.15s;
}
.home-nav-link:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(69,130,58,0.18);
    background: #f0f9e8;
    color: var(--color-brand-text);
}
.home-nav-link.active, .home-nav-link.active:hover {
    background: #e8f5e0;
    color: var(--color-brand-text);
    font-weight: 700;
    transform: none;
    box-shadow: none;
}
.home-nav-link .material-symbols-outlined {
    font-size: 1.1rem !important;
    color: var(--color-accent);
    flex-shrink: 0;
    line-height: 1;
}
.home-nav-link:hover .material-symbols-outlined,
.home-nav-link.active .material-symbols-outlined { color: var(--color-brand-text); }
.home-nav-badge {
    margin-left: auto;
    font-size: 0.66rem;
    font-weight: 700;
    padding: 2px 7px;
    border-radius: 20px;
    background: var(--theme-orange-l);
    color: white;
    flex-shrink: 0;
}

/* ========== Onboarding progressive nav unlock ========== */
@keyframes navSectionUnlock {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: translateY(0); }
}
.home-sidebar-nav .home-nav-section {
    animation: navSectionUnlock 0.35s ease both;
}

/* ========== Today presence donut ========== */
.home-presence-donut-wrap {
    position: relative;
    height: 160px;
    margin: 8px 16px 0;
}
.home-presence-donut-center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    pointer-events: none;
    z-index: 1;
}
.home-presence-donut-num {
    font-size: 2.0rem;
    font-weight: 700;
    color: var(--color-text);
    line-height: 1;
    font-family: TitilliumWeb-Bold, sans-serif;
}
.home-presence-donut-label {
    font-size: 0.70rem;
    color: var(--color-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-top: 2px;
}
.home-presence-donut-footer {
    padding: 8px 18px 14px;
    font-size: 0.82rem;
    color: var(--color-text-muted);
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
}
.home-presence-donut-leg {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 0.80rem;
}
.home-presence-donut-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

/* ========== Chart range controls ========== */
.home-chart-range {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px 2px;
    flex-wrap: wrap;
    border-bottom: 1px solid #f0f2f5;
}
.home-chart-range-label {
    font-size: 0.78rem;
    color: var(--color-text-muted);
    white-space: nowrap;
}
.home-chart-range-input {
    border: 1px solid var(--color-border);
    border-radius: 8px;
    padding: 5px 10px;
    font-size: 0.82rem;
    color: #374151;
    background: #f9fafb;
    cursor: pointer;
    transition: border-color 0.15s;
}
.home-chart-range-input:focus {
    outline: none;
    border-color: var(--color-accent);
    box-shadow: 0 0 0 2px rgba(132,189,0,0.15);
}
.home-chart-range-preset {
    font-size: 0.74rem;
    padding: 4px 11px;
    border-radius: 20px;
    border: 1.5px solid var(--color-border);
    background: white;
    color: var(--color-text-muted);
    cursor: pointer;
    transition: all 0.15s;
    white-space: nowrap;
    line-height: 1.4;
}
.home-chart-range-preset:hover,
.home-chart-range-preset.active {
    border-color: var(--color-accent);
    background: var(--color-accent);
    color: white;
}

/* ========== Chart horizontal scroll ========== */
.home-chart-scroll-outer {
    overflow-x: auto;
    overflow-y: hidden;
    padding: 8px 14px 14px;
    scrollbar-width: thin;
    scrollbar-color: var(--color-border) transparent;
}
.home-chart-scroll-inner {
    min-width: 100%;
    position: relative;
    height: 160px;
}

/* ========== Total badge (chart header) ========== */
.home-chart-total {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    background: linear-gradient(135deg, var(--theme-blue-d) 0%, var(--theme-blue-l) 100%);
    border-radius: 10px;
    padding: 5px 14px;
    color: white;
    min-width: 72px;
    flex-shrink: 0;
}
.home-chart-total-num {
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    font-family: TitilliumWeb-Bold, sans-serif;
}
.home-chart-total-label {
    font-size: 0.62rem;
    opacity: 0.92;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-top: 2px;
}
.ql-pink   { background: linear-gradient(135deg, var(--theme-pink-d), var(--theme-pink-l)); }
.ql-teal   { background: linear-gradient(135deg, var(--theme-teal-d), var(--theme-teal-l)); }
.ql-orange { background: linear-gradient(135deg, var(--theme-orange-d), var(--theme-orange-l)); }
.ql-blue   { background: linear-gradient(135deg, var(--theme-blue-d), var(--theme-blue-l)); }
.ql-purple { background: linear-gradient(135deg, var(--theme-purple-d), var(--theme-purple-l)); }
.ql-cyan   { background: linear-gradient(135deg, var(--theme-teal-d), var(--theme-cyan-l)); }
.ql-green  { background: linear-gradient(135deg, var(--color-brand), var(--color-accent)); }
.ql-gray   { background: linear-gradient(135deg, #455a64, #78909c); }

/* ========== Statistiche dinamiche ========== */
.home-stats-panel {
    background: #f8f9fb;
    border-radius: 18px;
    border: 1px solid #1d531300;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08);
    overflow: hidden;
    height: 100%;
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}
.home-stats-panel:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.729);
    border-color: var(--color-brand);
}
.home-stats-selector {
    appearance: none;
    border: 1px solid var(--color-border);
    border-radius: 10px;
    padding: 8px 34px 8px 12px;
    font-size: 0.88rem;
    color: #374151;
    background: #f9fafb url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%239ca3af' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 12px center;
    cursor: pointer;
    min-width: 220px;
    transition: border-color 0.15s;
}
.home-stats-selector:focus {
    outline: none;
    border-color: var(--color-accent);
    box-shadow: 0 0 0 3px rgba(132,189,0,0.15);
}
.home-stats-chart-wrap {
    position: relative;
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.home-stats-empty {
    color: #9ca3af;
    font-size: 0.88rem;
    display: flex;
    align-items: center;
    gap: 6px;
}
.home-stats-empty .material-symbols-outlined { font-size: 1.2rem !important; }

/* ========== Section title ========== */
.home-section-title {
    font-family: TitilliumWeb-Bold, sans-serif;
    font-size: 1.05rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--color-text-muted);
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 18px 0 10px 4px;
}
.home-section-title .material-symbols-outlined {
    font-size: 1.4rem !important;
    color: var(--color-accent);
}

/* ========== HERO Presenti ========== */
.home-hero {
    display: flex;
    align-items: center;
    padding: 24px 28px;
    border-radius: 18px;
    text-decoration: none !important;
    color: white;
    box-shadow: 0 8px 24px rgba(69, 130, 58, 0.25);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    min-height: 140px;
    background: linear-gradient(135deg, var(--color-brand) 0%, var(--color-accent) 100%);
    position: relative;
    overflow: hidden;
}
.home-hero::after {
    content: "";
    position: absolute;
    right: -40px;
    top: -40px;
    width: 220px;
    height: 220px;
    background: radial-gradient(circle, rgba(255,255,255,0.15) 0%, transparent 70%);
    pointer-events: none;
}
.home-hero:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 32px rgba(69, 130, 58, 0.35);
    color: white;
}
.home-hero-icon {
    flex: 0 0 auto;
    margin-right: 24px;
    width: 88px;
    height: 88px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.18);
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}
.home-hero-icon .material-symbols-outlined {
    font-size: 60px !important;
    color: white;
    line-height: 1;
    display: block;
}
.home-hero-body {
    flex: 1 1 auto;
    z-index: 1;
}
.home-hero-value {
    font-size: 3.2rem;
    font-weight: 700;
    line-height: 1;
    font-family: TitilliumWeb-Bold, sans-serif;
}
.home-hero-label {
    font-size: 1.1rem;
    opacity: 0.92;
    margin-top: 4px;
}
.home-hero-cta {
    flex: 0 0 auto;
    z-index: 1;
}
.home-hero-cta .material-symbols-outlined {
    font-size: 36px !important;
    color: white;
    opacity: 0.9;
    transition: transform 0.2s ease;
}
.home-hero:hover .home-hero-cta .material-symbols-outlined {
    transform: translateX(6px);
}

/* ========== Alert banner (badge non collegati) ========== */
.home-alert-banner {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 18px;
    background: linear-gradient(90deg, #fff3cd 0%, #ffeeba 100%);
    border-left: 5px solid var(--theme-orange-l);
    border-radius: 10px;
    color: #7a4f00;
    text-decoration: none !important;
    font-weight: 600;
    transition: transform 0.15s ease;
}
.home-alert-banner:hover {
    transform: translateX(2px);
    color: #5a3a00;
}
.home-alert-banner .material-symbols-outlined {
    font-size: 1.6rem !important;
}

/* ========== Cards categoriche ========== */
.home-card {
    display: flex;
    align-items: center;
    padding: 16px 18px;
    border-radius: 14px;
    text-decoration: none !important;
    color: white;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    transition: transform 0.18s ease, box-shadow 0.18s ease;
    min-height: 96px;
    height: 100%;
}
.home-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.18);
    color: white;
}
.home-card-icon {
    flex: 0 0 auto;
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 14px;
}
.home-card-icon .material-symbols-outlined {
    font-size: 36px !important;
    line-height: 1;
    display: block;
    color: white;
}
.home-card-body {
    flex: 1 1 auto;
    min-width: 0;
}
.home-card-value {
    font-size: 1.9rem;
    font-weight: 700;
    line-height: 1;
    font-family: TitilliumWeb-Bold, sans-serif;
}
.home-card-label {
    font-size: 0.95rem;
    opacity: 0.95;
    margin-top: 2px;
}
.home-card-label-big {
    font-size: 1.15rem;
    font-weight: 700;
    line-height: 1.2;
}
.home-card-sub {
    font-size: 0.85rem;
    opacity: 0.88;
    margin-top: 2px;
}

/* Varianti colore (gradient) */
.home-card-blue,
.home-card-catering_1,
.home-card-catering_2,
.home-card-catering {
    background: linear-gradient(135deg, var(--theme-blue-d) 0%, var(--theme-blue-l) 100%);
}
.home-card-pink {
    background: linear-gradient(135deg, var(--theme-pink-d) 0%, var(--theme-pink-l) 100%);
}
.home-card-teal {
    background: linear-gradient(135deg, var(--theme-teal-d) 0%, var(--theme-teal-l) 100%);
}
.home-card-purple {
    background: linear-gradient(135deg, var(--theme-purple-d) 0%, var(--theme-purple-l) 100%);
}
.home-card-cyan {
    background: linear-gradient(135deg, var(--theme-teal-d) 0%, var(--theme-cyan-l) 100%);
}
.home-card-orange,
.home-card-transport_1,
.home-card-transport {
    background: linear-gradient(135deg, var(--theme-orange-d) 0%, var(--theme-orange-l) 100%);
}
.home-card-gray {
    background: linear-gradient(135deg, #455a64 0%, #78909c 100%);
}

/* ========== Tabella apparati ========== */
.home-devices-card {
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid var(--color-border);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}
.home-devices-header {
    background: #f3f4f6;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #4b5563;
    padding: 10px 16px;
    margin: 0;
    border-bottom: 1px solid var(--color-border);
}
.home-devices-row {
    padding: 10px 16px;
    margin: 0;
    border-bottom: 1px solid #f3f4f6;
    align-items: center;
}
.home-devices-row:last-child {
    border-bottom: none;
}
.home-devices-row.r1 {
    background-color: #ffffff;
}
.home-devices-row.r2 {
    background-color: #fafbfc;
}
.home-device-status {
    color: var(--color-accent);
    font-size: 1.2rem !important;
    margin-right: 6px;
    vertical-align: middle;
}
.home-devices-row code {
    font-size: 0.85rem;
    color: #4b5563;
    background: #f3f4f6;
    padding: 2px 6px;
    border-radius: 4px;
}

/* ========== Home Genitore ========== */
.home-card-parent-presence {
    background: linear-gradient(135deg, #0277bd 0%, #29b6f6 100%);
}
.home-card-parent-allergy {
    background: linear-gradient(135deg, #b71c1c 0%, #ef5350 100%);
}
.home-card-parent-invoice {
    background: linear-gradient(135deg, var(--theme-orange-d) 0%, var(--theme-orange-l) 100%);
}
.home-parent-presence-row {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.92rem;
    color: rgba(255, 255, 255, 0.95);
}
.home-parent-badge-in {
    font-size: 1.1rem !important;
    color: #a5d6a7;
}
.home-parent-badge-out {
    font-size: 1.1rem !important;
    color: #ef9a9a;
}
.home-parent-allergy-row {
    font-size: 0.88rem;
    margin-top: 4px;
    display: flex;
    align-items: center;
    gap: 5px;
    color: rgba(255, 255, 255, 0.92);
}
.home-parent-allergy-severe {
    font-weight: 700;
    color: #fff;
}
.home-parent-badge-severe {
    font-size: 1rem !important;
    color: #ffcdd2;
}
.home-parent-animal-badge {
    font-size: 0.75rem;
    font-weight: 600;
    background: rgba(132, 189, 0, 0.15);
    color: var(--color-brand-text);
    border: 1px solid var(--color-accent);
    border-radius: 20px;
    padding: 1px 10px;
    margin-left: 4px;
    text-transform: none;
    letter-spacing: 0;
}

/* Diary */
.home-parent-diary {
    border-radius: 14px;
    border: 1px solid var(--color-border);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
    overflow: hidden;
}
.home-parent-diary-header {
    background: #f3f4f6;
    font-weight: 600;
    font-size: 0.88rem;
    color: #374151;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    border-bottom: 1px solid var(--color-border);
}
.home-parent-diary-header .material-symbols-outlined {
    font-size: 1.2rem !important;
    color: var(--color-accent);
}
.home-parent-diary-row {
    padding: 8px 16px;
    margin: 0;
    border-bottom: 1px solid #f3f4f6;
    font-size: 0.88rem;
}
.home-parent-diary-row:last-child {
    border-bottom: none;
}
.home-parent-diary-row.r1 { background: #ffffff; }
.home-parent-diary-row.r2 { background: #fafbfc; }
.home-parent-event-icon {
    color: var(--color-accent);
    font-size: 1rem !important;
    margin-right: 4px;
    vertical-align: middle;
}
.home-parent-event-score {
    color: #f59e0b;
    font-size: 0.85rem;
    letter-spacing: 1px;
}
.home-parent-diary-empty {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #9ca3af;
    font-size: 0.88rem;
    padding: 10px 4px;
}
.home-parent-diary-empty .material-symbols-outlined {
    font-size: 1.2rem !important;
}

/* ========== Home Genitore v2 (allineata alle dashboard) ========== */
/* Avatar iniziali nel header della scheda figlio */
.home-parent-child-avatar {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--color-accent) 0%, var(--color-brand) 100%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.74rem;
    font-weight: 700;
    color: #fff;
    flex-shrink: 0;
    text-transform: uppercase;
    letter-spacing: 0;
}
.home-parent-child-name {
    font-family: TitilliumWeb-Bold, sans-serif;
    text-transform: none;
    letter-spacing: 0.2px;
    color: #1f2937;
}

/* Griglia stat (entrata / uscita / retta) dentro la scheda figlio */
.home-parent-stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}
.home-parent-stat {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    background: #f8faf5;
    border: 1px solid #eef1f4;
    border-radius: 12px;
}
.home-parent-stat-icon {
    font-size: 1.4rem !important;
    line-height: 1;
    flex-shrink: 0;
}
.home-parent-stat-icon.in    { color: #45823a; }
.home-parent-stat-icon.out   { color: #ef5350; }
.home-parent-stat-icon.money { color: var(--theme-orange-d); }
.home-parent-stat-label {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--color-text-muted);
    line-height: 1.2;
}
.home-parent-stat-value {
    font-size: 1.05rem;
    font-weight: 700;
    color: #1f2937;
    font-family: TitilliumWeb-Bold, sans-serif;
    line-height: 1.2;
}

/* Box allergie */
.home-parent-allergy-box {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 12px;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 12px;
    margin-bottom: 14px;
}
.home-parent-allergy-box > .material-symbols-outlined {
    color: #b91c1c;
    font-size: 1.3rem !important;
    flex-shrink: 0;
    margin-top: 2px;
}
.home-parent-allergy-list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
}
.home-parent-allergy-caption {
    font-size: 0.8rem;
    font-weight: 600;
    color: #991b1b;
    margin-right: 2px;
}
.home-parent-allergy-chip {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    font-size: 0.8rem;
    font-weight: 600;
    background: #fff;
    color: #7f1d1d;
    border: 1px solid #fca5a5;
    border-radius: 20px;
    padding: 2px 10px;
}
.home-parent-allergy-chip.severe {
    background: #dc2626;
    color: #fff;
    border-color: #dc2626;
}
.home-parent-allergy-chip .material-symbols-outlined {
    font-size: 0.9rem !important;
}

/* Titolo sezione diario dentro la scheda */
.home-parent-diary-title {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    color: #6b7280;
    margin-bottom: 8px;
}
.home-parent-diary-title .material-symbols-outlined {
    font-size: 1.1rem !important;
    color: var(--color-accent);
}
.home-parent-diary-time {
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--color-brand-text);
    background: #eef7e6;
    border-radius: 6px;
    padding: 1px 7px;
    flex-shrink: 0;
}
.home-parent-diary-event {
    font-weight: 600;
    color: #374151;
}
.home-parent-diary-note {
    flex-basis: 100%;
    font-size: 0.82rem;
    color: var(--color-text-muted);
    padding-left: 4px;
}

/* Diario: contenitore leggero (non più card con bordo pesante) */
.home-parent-diary {
    border: 1px solid #f0f2f5;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: none;
}
.home-parent-diary-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    padding: 8px 12px;
    margin: 0;
    border-bottom: 1px solid #f3f4f6;
    font-size: 0.88rem;
}

/* Stato vuoto (nessun figlio) */
.home-parent-empty {
    text-align: center;
    padding: 36px 20px;
}
.home-parent-empty > .material-symbols-outlined {
    font-size: 3rem !important;
    color: #cbd5e1;
    display: block;
    margin-bottom: 10px;
}
.home-parent-empty-title {
    font-family: TitilliumWeb-Bold, sans-serif;
    font-size: 1.15rem;
    font-weight: 700;
    color: #374151;
    margin-bottom: 4px;
}
.home-parent-empty-sub {
    font-size: 0.9rem;
    color: var(--color-text-muted);
    margin-bottom: 18px;
}

/* ── Widget AI: domande frequenti ─────────────────────────────── */
.home-ai-questions-list {
    list-style: none;
    margin: 0;
    padding: 0 16px;
    counter-reset: ai-q;
}
.home-ai-question-item {
    counter-increment: ai-q;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 8px 0;
    border-bottom: 1px solid #f3f4f6;
    font-size: 0.85rem;
}
.home-ai-question-item:last-child { border-bottom: none; }
.home-ai-question-item::before {
    content: counter(ai-q);
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--color-accent);
    color: #fff;
    font-size: 0.72rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 1px;
}
.home-ai-question-text {
    flex: 1 1 auto;
    color: #374151;
    line-height: 1.35;
}
.home-ai-question-badge {
    flex-shrink: 0;
    background: #f3f4f6;
    color: var(--color-text-muted);
    font-size: 0.75rem;
    font-weight: 600;
    border-radius: 12px;
    padding: 2px 8px;
    white-space: nowrap;
    align-self: center;
}
.home-ai-questions-footer {
    padding: 10px 16px 4px;
    border-top: 1px solid #f3f4f6;
    margin-top: 4px;
}

/* ── Widget AI: riepilogo costi ────────────────────────────────── */
.home-ai-cost-grid {
    display: flex;
    align-items: stretch;
    padding: 16px 8px 8px;
    gap: 0;
}
.home-ai-cost-block {
    flex: 1 1 0;
    text-align: center;
    padding: 0 10px;
}
.home-ai-cost-period {
    font-size: 0.75rem;
    font-weight: 600;
    color: #9ca3af;
    text-transform: uppercase;
    letter-spacing: .04em;
    margin-bottom: 4px;
}
.home-ai-cost-value {
    font-size: 1.45rem;
    font-weight: 700;
    color: var(--color-text);
    line-height: 1.1;
    margin-bottom: 4px;
}
.home-ai-cost-meta {
    font-size: 0.75rem;
    color: #9ca3af;
    line-height: 1.3;
}
.home-ai-cost-divider {
    width: 1px;
    background: #f3f4f6;
    align-self: stretch;
    flex-shrink: 0;
}

/* ========== Onboarding lock: KPI cards ========== */
.home-kpi-locked {
    opacity: 0.65;
    cursor: default !important;
    position: relative;
}
.home-kpi-locked:hover {
    transform: none !important;
    box-shadow: 0 4px 16px rgba(0,0,0,0.10) !important;
    font-weight: inherit !important;
    font-size: inherit !important;
}
.home-kpi-locked::after {
    content: 'lock';
    font-family: 'Material Symbols Outlined';
    font-variation-settings: 'FILL' 1;
    position: absolute;
    top: 8px;
    right: 10px;
    font-size: 0.88rem;
    line-height: 1;
    color: rgba(80,80,80,0.45);
}
/* tint specifico per varianti colorate */
.home-kpi-locked.home-kpi-green::after,
.home-kpi-locked.home-kpi-orange::after,
.home-kpi-locked.home-kpi-yellow::after { color: rgba(255,255,255,0.55); }

/* ========== Onboarding lock: widget header ========== */
.home-widget-header-locked { cursor: pointer; }
.home-widget-header-lock-icon {
    font-size: 0.9rem !important;
    color: #f59e0b !important;
    flex-shrink: 0;
    opacity: 0.85;
    margin-left: 4px;
}

/* ========== Onboarding progress banner (sotto KPI) ========== */
.onb-progress-banner {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 14px 20px;
    box-shadow: 0 2px 8px rgba(0,0,0,.06);
}
.onb-progress-banner-header {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: .9rem;
    color: #374151;
    margin-bottom: 10px;
}
.onb-progress-banner-header .material-symbols-outlined {
    font-size: 1.2rem;
    color: #6366f1;
}
.onb-progress-banner-header strong {
    font-size: 1rem;
    color: #22c55e;
}
.onb-progress-bar-track {
    height: 10px;
    border-radius: 6px;
    background: var(--color-border);
}
.onb-progress-bar-fill {
    border-radius: 6px;
    transition: width .5s ease;
}

/* ========== Onboarding toast (lock banner) ========== */
#onbLockToast {
    position: fixed;
    bottom: 28px;
    left: 50%;
    transform: translateX(-50%) translateY(18px);
    z-index: 9999;
    background: var(--color-text);
    color: #f9fafb;
    border-radius: 14px;
    padding: 13px 20px 13px 14px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.26);
    display: flex;
    align-items: center;
    gap: 10px;
    max-width: 420px;
    min-width: 240px;
    font-size: 0.875rem;
    line-height: 1.4;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.22s ease, transform 0.22s ease;
    white-space: normal;
}
#onbLockToast.onb-toast-show {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}
.onb-toast-lock-icon {
    font-size: 1.2rem !important;
    color: #f59e0b;
    flex-shrink: 0;
    line-height: 1;
}

/* ========== Mobile: pannelli KPI molto ridotti (solo visuale) ========== */
/* Su smartphone (< md) le card "Totale bambini", "In attesa", "Invito"… sono
   compatte: meno padding, icona e numeri piccoli, così occupano molto meno
   spazio verticale. Nessuna modifica al layout desktop. */
@media (max-width: 767.98px) {
    .home-kpi-card {
        padding: 8px 10px;
        border-radius: 10px;
        min-height: 0;
        gap: 8px;
    }
    .home-kpi-icon {
        width: 32px;
        height: 32px;
        border-radius: 8px;
    }
    .home-kpi-icon .material-symbols-outlined {
        font-size: 20px !important;
    }
    .home-kpi-value {
        font-size: 1.3rem;
    }
    /* le card "Fatture"/"Invito" usano un value testuale con font inline */
    .home-kpi-value[style] {
        font-size: 0.95rem !important;
    }
    .home-kpi-label {
        font-size: 0.62rem;
        margin-top: 1px;
        letter-spacing: 0.3px;
    }
    .home-kpi-locked::after {
        font-size: 0.7rem;
        top: 5px;
        right: 6px;
    }
    /* riga KPI: meno gap verticale tra le card su mobile */
    .home-content-area .row.g-3.mb-4:first-of-type {
        --bs-gutter-y: 0.5rem;
        --bs-gutter-x: 0.5rem;
    }
}
