.app-container {
    padding-right: 110px !important; /* spazio per la barra dati a destra */
}

@media (max-width: 900px) {
    #data-actions-bar {
        position: static;
        width: 100%;
        flex-direction: row;
        border-radius: 0 0 18px 18px;
        box-shadow: 0 2px 16px rgba(6,78,59,0.10);
        justify-content: center;
        padding: 0.5rem 0.5rem;
        margin-bottom: 1.2rem;
    }
    .app-container {
        padding-right: 1.2rem !important;
    }
}
/* --- Barra laterale azioni dati a destra --- */
#data-actions-bar {
    position: fixed;
    top: 80px;
    right: 0;
    width: 82px;
    background: rgba(255,255,255,0.92);
    box-shadow: -2px 0 18px rgba(6,78,59,0.10);
    border-radius: 18px 0 0 18px;
    z-index: 2000;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.1rem;
    padding: 1.2rem 0.5rem 1.2rem 0.5rem;
    transition: box-shadow .18s, background .18s;
}
#data-actions-bar .btn, #data-actions-bar .btn-secondary, #data-actions-bar .btn-outline, #data-actions-bar .nav-icon-btn {
    min-width: 0 !important;
    width: 48px !important;
    height: 48px !important;
    padding: 0 !important;
    border-radius: 14px !important;
    justify-content: center !important;
    font-size: 1.18rem !important;
}
#data-actions-bar span {
    display: none !important;
}
#data-actions-bar .btn i, #data-actions-bar .nav-icon-btn i {
    font-size: 1.35em !important;
}
#data-actions-bar .btn:hover, #data-actions-bar .btn-secondary:hover, #data-actions-bar .btn-outline:hover, #data-actions-bar .nav-icon-btn:hover {
    background: var(--accent) !important;
    color: #fff !important;
}
/* --- NAVBAR UNICA ORIZZONTALE --- */
.top-navbar {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    height: 72px !important;
    background: linear-gradient(90deg, var(--accent), var(--accent-900)) !important;
    color: #fff !important;
    padding: 0 2.2rem !important;
    box-shadow: 0 2px 16px rgba(6,78,59,0.10);
    position: relative;
    z-index: 1100;
}
.navbar-brand {
    display: flex !important;
    align-items: center !important;
    gap: 1.2rem !important;
    min-width: 0;
}
.navbar-logo {
    font-size: 1.25rem !important;
    font-weight: 700 !important;
    color: #fff !important;
    margin: 0 !important;
    letter-spacing: 0.01em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.navbar-main {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 0.5rem !important;
    flex: 1 1 auto !important;
    min-width: 0;
    overflow-x: auto !important;
    overflow-y: visible !important;
    background: none !important;
    padding: 0 !important;
    margin: 0 1.5rem 0 2rem !important;
    height: 72px !important;
    white-space: nowrap;
}
.navbar-main .nav-btn, .navbar-main .dropdown-toggle {
    color: #fff !important;
    background: none !important;
    border: none !important;
    font-size: 0.78rem !important;
    font-weight: 600 !important;
    border-radius: 7px !important;
    padding: 0.16rem 0.38rem !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.14rem !important;
    transition: background .18s, color .18s, box-shadow .18s;
    min-width: 0;
    opacity: 1 !important;
}
.navbar-main .nav-btn:hover, .navbar-main .dropdown-toggle:hover {
    background: rgba(255,255,255,0.10) !important;
    color: #fff !important;
    box-shadow: 0 2px 12px rgba(6,78,59,0.10);
}
.navbar-main .nav-dropdown {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
}
.navbar-main .dropdown-menu {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: 0 !important;
    min-width: 210px !important;
    background: #fff !important;
    color: var(--accent) !important;
    border-radius: 14px !important;
    box-shadow: 0 8px 32px rgba(6,78,59,0.13) !important;
    padding: 0.4rem 0 !important;
    z-index: 1200 !important;
    display: none;
}
.navbar-main .dropdown-menu a {
    color: var(--accent) !important;
    background: none !important;
    padding: 0.7rem 1.2rem !important;
    border-radius: 10px !important;
    font-weight: 500 !important;
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    transition: background .15s, color .15s;
}
.navbar-main .dropdown-menu a:hover {
    background: var(--muted-2) !important;
    color: var(--accent-900) !important;
}
.navbar-actions {
    display: flex !important;
    align-items: center !important;
    gap: 0.7rem !important;
    flex: 0 0 auto !important;
    margin-left: auto !important;
}
.navbar-main {
    display: flex !important;
    flex-wrap: wrap;
    overflow: visible !important;
    background: none !important;
}
.navbar-main .nav-btn, .navbar-main .dropdown-toggle {
    color: #fff !important;
    opacity: 1 !important;
    display: inline-flex !important;
    visibility: visible !important;
}
.navbar-main .dropdown-menu {
    background: #fff !important;
    color: var(--accent) !important;
}
/* --- Ottimizzazione Dashboard Bento 2026 --- */
.dashboard-header-bento {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 2.5rem !important;
}

.bento-dashboard-grid {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 2.5rem;
    margin-bottom: 2.5rem !important;
}
.bento-dashboard-charts {
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
    gap: 2.5rem;
}

.bento-card.card-stat {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 1.5rem;
    min-height: 110px;
    padding: 2.2rem 1.5rem 2rem 1.5rem !important;
}
.bento-icon {
    width: 64px;
    height: 64px;
    border-radius: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.2rem;
    box-shadow: 0 2px 12px rgba(6,78,59,0.10);
    background: var(--muted-2);
    color: var(--accent);
    transition: box-shadow .18s, background .18s, color .18s;
}
.bento-card.card-stat:hover .bento-icon {
    background: var(--accent);
    color: #fff;
    box-shadow: 0 6px 24px rgba(6,78,59,0.18);
}
.bento-content h3 {
    font-size: 2.1rem;
    margin: 0 0 0.2rem 0;
    font-weight: 700;
    letter-spacing: 0.01em;
}
.bento-content p {
    margin: 0;
    color: var(--muted);
    font-size: 1.08rem;
    font-weight: 500;
}
.bento-header {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    margin-bottom: 1.2rem;
    font-size: 1.18rem;
    font-weight: 600;
    color: var(--accent);
}
.bento-header i {
    font-size: 1.3em;
    opacity: 0.82;
}
.bento-card {
    background: var(--card) !important;
    border-radius: 22px !important;
    box-shadow: 0 8px 32px rgba(6,78,59,0.13) !important;
    padding: 2.2rem 1.5rem 1.5rem 1.5rem !important;
    margin-bottom: 1.5rem;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1.5px solid var(--muted-2) !important;
    transition: box-shadow .22s, transform .18s, background .18s;
}
.bento-card:hover {
    box-shadow: 0 16px 48px rgba(6,78,59,0.18) !important;
    transform: translateY(-3px) scale(1.018);
    background: rgba(255,255,255,0.82) !important;
}
.bento-card .list-container {
    margin-top: 0.5rem;
}
/* --- UI/UX 2026: Palette, Bento, Glassmorphism, Pulsanti Moderni --- */
:root{
        --bg: #f9fafb; /* white space */
        --card: rgba(255,255,255,0.72); /* glassmorphism card */
        --card-blur: blur(12px);
        --accent: #064e3b; /* verde salvia scuro */
        --accent-light: #b7c7bd; /* salvia chiaro */
        --accent-900: #064e3b;
        --muted: #6d7471; /* grigio caldo */
        --muted-2: #e5e7eb; /* grigio molto chiaro */
        --success: #10b981;
        --danger: #ef4444;
        --glass: rgba(6,78,59,0.10); /* glass verde scuro */
        --shadow: 0 8px 32px rgba(6,78,59,0.10);
}

body{
    background:var(--bg) !important;
    color:var(--accent) !important;
    font-family:Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial;
    letter-spacing:0.01em;
}

.app-container{
    max-width:1400px;
    margin:2.5rem auto 2rem auto;
    padding:2.5rem 2.5rem 2rem 2.5rem;
    background:var(--card);
    border-radius:22px;
    box-shadow:var(--shadow);
    min-height:calc(100vh - 160px);
    backdrop-filter:var(--card-blur);
    -webkit-backdrop-filter:var(--card-blur);
    border:1.5px solid var(--muted-2);
}

.dashboard-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
        gap: 2.2rem;
        margin-bottom: 2.5rem;
        width: 100%;
        padding: 0.5rem 0;
}

/* Bento Card Style */
.bento-card, .dashboard-card, .card, .list-item, .section-card {
    background: var(--card) !important;
    border-radius: 22px !important;
    box-shadow: var(--shadow) !important;
    padding: 2rem 1.5rem 1.5rem 1.5rem !important;
    margin-bottom: 1.5rem;
    backdrop-filter: var(--card-blur);
    -webkit-backdrop-filter: var(--card-blur);
    border: 1.5px solid var(--muted-2) !important;
    transition: box-shadow .22s, transform .18s;
}
.bento-card:hover, .dashboard-card:hover, .card:hover, .list-item:hover, .section-card:hover {
    box-shadow: 0 12px 36px rgba(6,78,59,0.16) !important;
    transform: translateY(-2px) scale(1.012);
}

/* Pulsanti 2026 */
.btn, button, input[type="button"], input[type="submit"] {
    border: none !important;
    border-radius: 16px !important;
    padding: 0.7rem 1.6rem !important;
    font-size: 1.08rem !important;
    font-weight: 600 !important;
    background: var(--accent) !important;
    color: #fff !important;
    box-shadow: 0 2px 12px rgba(6,78,59,0.10) !important;
    cursor: pointer;
    transition: background .22s, box-shadow .18s, transform .16s;
    outline: none;
    letter-spacing: 0.01em;
    margin: 0.2rem 0.3rem;
    min-width: 120px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}
.btn:hover, button:hover, input[type="button"]:hover, input[type="submit"]:hover {
    background: var(--accent-900) !important;
    box-shadow: 0 4px 24px rgba(6,78,59,0.16) !important;
    transform: translateY(-1px) scale(1.03);
}
/* Pulsante secondario */
.btn-secondary {
    background: var(--muted-2) !important;
    color: var(--accent) !important;
    box-shadow: 0 2px 10px rgba(6,78,59,0.06) !important;
}
.btn-secondary:hover {
    background: #fff !important;
    color: var(--accent-900) !important;
    box-shadow: 0 4px 18px rgba(6,78,59,0.10) !important;
}
/* Pulsante pericolo */
.btn-danger {
    background: var(--danger) !important;
    color: #fff !important;
    box-shadow: 0 2px 12px rgba(239,68,68,0.10) !important;
}
.btn-danger:hover {
    background: #b91c1c !important;
    box-shadow: 0 4px 24px rgba(239,68,68,0.16) !important;
}
/* Micro-interazioni focus */
.btn:focus, button:focus {
    outline: 2.5px solid var(--accent-light) !important;
    outline-offset: 2px;
}

/* Spaziatura e white space */
.section-header, .toolbar, .dashboard-grid, .app-container {
    margin-bottom: 2.2rem !important;
}
.section-header {
    padding-bottom: 0.5rem !important;
}
.toolbar {
    padding-bottom: 1.2rem !important;
}
/* Nascondi la bottom-nav e la modale fissa */
/* Nascondi la bottom-nav */
.bottom-nav { display: none; }
/* Modal: di default nascosta, visibile con .open */
.modal { display: none; }
.modal.open { display: flex; }
/* Mostra solo la sezione attiva */
.app-section { display: none; }
.app-section.active { display: block; }
/* Dashboard grid responsive */
.dashboard-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1.2rem;
    margin-bottom: 1.5rem;
    width: 100%;
}
/* mission.css - Enterprise Clean redesign */
:root{
    --bg:#f8faf8; /* soft white */
    --card:#ffffff;
    --accent:#34d399; /* verde chiaro */
    --accent-900:#10b981; /* verde chiaro intenso */
    --muted:#6b7280;
    --muted-2:#9ca3af;
    --success:#10b981;
    --danger:#ef4444;
    --glass: rgba(52,211,153,0.06);
}
*{box-sizing:border-box;font-family:Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial}
body{margin:0;background:var(--bg);color:#0b1220}
/* Top navbar */
.top-navbar{height:72px;background:linear-gradient(90deg,var(--accent),var(--accent-900));color:#fff;display:grid;grid-template-columns:auto 1fr auto;align-items:center;column-gap:1rem;padding:0 1.25rem}
.navbar-brand{display:flex;align-items:center;gap:0.75rem;flex:0 0 auto;min-width:0}
.navbar-logo{margin:0;font-size:1.05rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:220px;display:block}
.navbar-brand .nav-btn{padding:0;background:transparent}
.navbar-main{justify-self:stretch;flex:1 1 auto;display:flex;gap:0.6rem;align-items:center;justify-content:flex-start;min-width:0;overflow-x:auto;overflow-y:visible;padding:0 0.5rem;max-width:100vw;scroll-behavior:smooth}
/* show subtle scrollbar for hidden overflow */
.navbar-main::-webkit-scrollbar{height:6px}
.navbar-main::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.12);border-radius:6px}
.navbar-brand{z-index:1200;margin-right:0.6rem}
.navbar-brand{z-index:1200} 
.navbar-main .nav-dropdown{overflow:visible}
.navbar-main::-webkit-scrollbar{display:none}
.nav-btn{background:none;border:none;color:#fff;padding:0.5rem 0.75rem;display:flex;align-items:center;gap:0.5rem;cursor:pointer;border-radius:8px;transition:background .18s,transform .12s;white-space:nowrap;flex:0 0 auto} 
.nav-btn#dashboard-btn{position:relative;z-index:1300;background:rgba(255,255,255,0.12);box-shadow:0 6px 18px rgba(11,107,79,0.08);padding:0.45rem 0.9rem;border-radius:10px}
.nav-btn#dashboard-btn:hover{background:rgba(255,255,255,0.16)}
@media (max-width:1000px){.nav-btn#dashboard-btn{padding:0.45rem}}
@media (max-width:1000px){
    .nav-btn#dashboard-btn{padding:0.45rem}
    .navbar-main{max-width:100vw;overflow-x:auto;}
    .navbar-main .nav-btn span{display:inline-block}
    .navbar-main::-webkit-scrollbar{height:6px}
    .navbar-main::-webkit-scrollbar-thumb{background:rgba(0,0,0,0.08);border-radius:6px}
}
.nav-btn span{display:inline-block}
.nav-btn:hover{background:rgba(255,255,255,0.06);transform:translateY(-1px)}

.nav-dropdown{position:relative}
.dropdown-icon{opacity:0.8}
.dropdown-menu{position:absolute;top:calc(100% + 6px);left:0;background:#fff;color:#111;border-radius:8px;box-shadow:0 6px 18px rgba(0,0,0,0.12);min-width:200px;padding:0.25rem 0;display:none;z-index:2200;pointer-events:auto}
.nav-dropdown.open .dropdown-menu{display:block}
.dropdown-menu a{display:flex;align-items:center;gap:0.5rem;padding:0.5rem 0.75rem;color:#111;text-decoration:none}
.dropdown-menu a:hover{background:#f3f4f6}
.nav-dropdown:last-child .dropdown-menu{right:0;left:auto}

.navbar-actions{display:flex;gap:0.5rem;align-items:center;flex:0 0 auto;justify-self:end}
/* language selector removed - fixed Italian UI */
/* Save all primary */
#save-all-btn{display:flex;align-items:center;gap:0.5rem}


@media (max-width:1000px){
    .navbar-main .nav-btn span{display:none}
    .navbar-actions .btn span{display:none}
    .navbar-main{max-width:520px; display:flex !important;}
}

@media (max-width:900px){
    .navbar-main{max-width:100vw;overflow-x:auto;display:flex !important;}
    .mobile-menu-toggle{display:inline-flex}
    .navbar-logo{max-width:160px}
}


/* Sidebar */
.sidebar{position:fixed;left:0;top:72px;height:calc(100% - 72px);width:260px;background:#fff;border-right:1px solid #eef2f3;box-shadow:none;transition:width .25s ease,transform .2s;z-index:1000;padding:1rem 0}
.sidebar.collapsed{width:72px}
.sidebar .sidebar-header{padding:0 1rem;display:flex;justify-content:space-between;align-items:center}
.sidebar .sidebar-nav{display:flex;flex-direction:column;gap:6px;padding:0.5rem}
.sidebar .sidebar-link{display:flex;align-items:center;gap:0.75rem;padding:0.6rem 1rem;color:#0b1220;text-decoration:none;border-radius:8px}
.sidebar .sidebar-link:hover{background:var(--glass)}
.sidebar .sidebar-link i{opacity:0.9}
.sidebar .sidebar-toggle-btn{background:none;border:none;padding:0.4rem;margin-right:0.5rem;cursor:pointer}

/* App container */
.app-container{max-width:1400px;margin:1rem auto;padding:20px;background:var(--card);border-radius:12px;box-shadow:0 4px 20px rgba(0,0,0,0.08);min-height:calc(100vh - 160px)}
.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}

/* Global toolbar to match analytic page */
.toolbar{display:flex;gap:10px;margin-bottom:20px;padding-bottom:15px;border-bottom:2px solid #eee;flex-wrap:wrap;align-items:center}
.toolbar .btn-label, .toolbar button{padding:10px 18px;border-radius:6px;font-weight:600;color:#fff;display:inline-flex;align-items:center;gap:8px;border:none;cursor:pointer;transition:opacity .15s}
.btn-pdf{background:#e74c3c}
.btn-excel{background:#27ae60}
.btn-save{background:#2ecc71}
.btn-load{background:#3498db}
.btn-print{background:#f39c12}
.btn-clear{background:#95a5a6}
.toolbar select{padding:10px;border-radius:6px;background:#ecf0f1;border:1px solid #bdc3c7}
#status{font-weight:bold;color:var(--danger);margin-left:auto}

/* Sticky table headers and ordering hint */
.table th, table th{position:sticky;top:0;background:var(--accent-900);color:#fff;padding:12px;text-align:left;z-index:10}
.table th::after, table th::after{content:' ↕';font-size:10px;margin-left:6px;opacity:0.9}

/* Row highlight classes */
.row-yellow{background:#fff9c4 !important}
.row-green{background:#c8e6c9 !important}
.row-red{background:#ffcdd2 !important}

/* Picker floating tool (used in prevision page) */
#picker{display:none;position:absolute;background:#fff;border:1px solid #ccc;padding:8px;border-radius:8px;box-shadow:0 4px 12px rgba(0,0,0,0.2);z-index:1000}
.dot{width:25px;height:25px;border-radius:50%;display:inline-block;margin:4px;cursor:pointer;border:1px solid #ddd}

/* small tweak for table cells emphasis */
.table td strong, table td strong{font-weight:700}

/* Cards */
.card{background:var(--card);border-radius:12px;padding:1rem;box-shadow:0 8px 20px rgba(8,70,58,0.06);transition:transform .12s,box-shadow .12s}
.card:hover{transform:translateY(-4px);box-shadow:0 12px 30px rgba(8,70,58,0.08)}
.card-stat{display:flex;gap:1rem;align-items:center}
.card-icon{height:56px;width:56px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff}
.bg-blue{background:#1e90a9}.bg-green{background:var(--accent)}.bg-success{background:var(--success)}.bg-orange{background:#f97316}

/* Lists and tables */
.list-container{padding:0.5rem;display:flex;flex-direction:column;gap:0.5rem}
.list-item{padding:0.75rem;border-radius:10px;border:1px solid #eef2f3;background:#fff;display:flex;justify-content:space-between;align-items:center}
.table{width:100%;border-collapse:collapse;background:var(--card);border-radius:8px;overflow:hidden}
.table th, .table td{padding:0.75rem 1rem;text-align:left;border-bottom:1px solid #f3f4f6}
.table tr:nth-child(even){background:#fbfdfb}
.badge{display:inline-flex;align-items:center;padding:0.25rem 0.6rem;border-radius:999px;font-size:0.8rem;font-weight:600}
.badge.success{background:rgba(16,185,129,0.12);color:var(--success)}
.badge.info{background:rgba(30,144,169,0.12);color:#1e90a9}
.badge.warning{background:rgba(249,115,22,0.08);color:#f97316}
.badge.danger{background:rgba(239,68,68,0.08);color:var(--danger)}

/* Bottom nav */
.bottom-nav{display:none}

/* Modal */
.modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,0.42);z-index:2500;padding:1rem}
.modal.open{display:flex}
.modal-content{border-radius:12px;box-shadow:0 10px 40px rgba(8,70,58,0.08);background:var(--card);max-width:820px;width:100%;overflow:hidden}
.modal-body{padding:1rem}
.modal-header{display:flex;align-items:center;justify-content:space-between;padding:0.75rem 1rem;border-bottom:1px solid #f1f5f4}
.modal-close{background:transparent;border:none;padding:0.4rem;border-radius:6px;cursor:pointer}
.modal-close i{opacity:0.9}
.modal-subtitle{color:var(--muted);font-size:0.95rem;margin-top:0.25rem}
.form-grid{display:grid;grid-template-columns:1fr;gap:0.75rem;padding-top:0.5rem}
@media(min-width:640px){.form-grid{grid-template-columns:1fr 1fr}.form-grid .full{grid-column:1/-1}}
.form-field label{display:block;font-size:0.85rem;color:var(--muted);margin-bottom:6px}
.form-field input,.form-field textarea,.form-field select{width:100%;padding:0.6rem;border:1px solid #e6e6e6;border-radius:8px;background:transparent}
.form-actions{display:flex;justify-content:flex-end;gap:0.5rem;padding:0.75rem 1rem;border-top:1px solid #f1f5f4;background:transparent}
@media (max-width:640px){.modal{padding:0.5rem}.modal-content{border-radius:8px}}

/* Sections visibility: keep content hidden until section active */
/* Mostra solo la sezione attiva */
.app-section { display: none !important; }
.app-section.active { display: block !important; }
/* inside sections, hide lists/controls until the section is active */
.app-section .list-container,.app-section .filters-bar,.app-section .section-header + .list-container{display:none}
.app-section.active .list-container,.app-section.active .filters-bar{display:flex}

/* Sacraments: nicer layout */
#sacraments-section .section-sub{display:flex;flex-direction:column;gap:1rem}
#sacraments-section .section-header{background:linear-gradient(90deg,rgba(11,107,79,0.04),rgba(11,107,79,0.02));padding:0.6rem;border-radius:10px}
#sacraments-section .section-sub .list-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:0.75rem}
#sacraments-section .list-item{display:flex;flex-direction:column;gap:0.6rem;padding:0.8rem;border-radius:10px;border:1px solid #eef2f3;background:linear-gradient(180deg,#fff,#fbfffb);box-shadow:0 6px 18px rgba(8,70,58,0.03)}
#sacraments-section .list-item strong{font-size:1rem;color:var(--accent-900)}
#sacraments-section .list-item p{margin:0;color:var(--muted)}
#sacraments-section .filters-bar{gap:0.5rem;align-items:center}
#sacraments-section .form-actions{justify-content:flex-end}
#sacraments-section .section-header h3{margin:0}
@media (max-width:700px){ #sacraments-section .list-container{grid-template-columns:1fr} }
.filters-bar input[type="date"], .filters-bar input[type="text"], .filters-bar select{padding:0.45rem;border-radius:8px;border:1px solid #e6e6e6;background:#fff}
.filters-bar button{padding:0.4rem 0.6rem}

/* Utilities */
.btn{padding:0.5rem 0.75rem;border-radius:10px;border:none;cursor:pointer}
.btn-primary{background:var(--accent);color:#fff}
.btn-secondary{background:#f3f4f6;color:#111}
.btn-outline{background:transparent;border:1px solid #e6e6e6}

/* Responsive */
@media (max-width:900px){
    .sidebar{transform:translateX(-100%)}
    .sidebar.open{transform:translateX(0)}
    .navbar-main{display:none}
    .mobile-menu-toggle{display:inline-flex}
    .app-container{padding:0.75rem}
}

/* Sidebar overlay to capture clicks when open (non-blocking topbar) */
.sidebar-overlay{display:none;position:fixed;top:72px;left:0;right:0;bottom:0;background:rgba(0,0,0,0.28);z-index:900}
.sidebar-overlay.open{display:block}

/* ensure top-navbar stays on top */
.top-navbar{position:relative;z-index:1100}