/* ═══════════════════════════════════════════════════════════════════════════
   Zest Nest – →zest  Future. Faster.
   Brand: blu elettrico + navy scuro
   ═══════════════════════════════════════════════════════════════════════════ */

:root {
    --zest-blue: #2B3AFF;
    --zest-blue-light: #4D5AFF;
    --zest-blue-glow: rgba(43, 58, 255, 0.12);
    --zest-navy: #0D1137;
    --zest-navy-mid: #161B45;
    --zest-dark: #080B24;

    --white: #ffffff;
    --off-white: #F7F8FC;
    --gray-100: #EEF0F6;
    --gray-200: #DDE0EB;
    --gray-500: #8A8FA8;
    --gray-700: #4A4E69;
    --text-dark: #0D1137;
    --text-muted: #7A7F9A;

    --radius: 14px;
    --radius-sm: 8px;
    --shadow-soft: 0 2px 10px rgba(13, 17, 55, 0.05);
    --shadow-md: 0 4px 24px rgba(13, 17, 55, 0.08);
    --shadow-lg: 0 12px 40px rgba(13, 17, 55, 0.12);
    --transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    color: var(--text-dark);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    margin: 0;
}

/* ── Container max-width globale (default per tutti i servizi) ────────── */
.container {
    max-width: 1340px;
}

/* ═══════════════════════════════════════════════════════════════════════════
   LOGO
   ═══════════════════════════════════════════════════════════════════════════ */

.logo-img {
    height: 36px;
    width: auto;
}

.logo-img-lg {
    height: 48px;
    width: auto;
}

/* ═══════════════════════════════════════════════════════════════════════════
   LOGIN – Split screen
   ═══════════════════════════════════════════════════════════════════════════ */

.login-split {
    display: flex;
    min-height: 100vh;
}

/* ── Pannello brand (sinistra) ── */
.login-brand {
    flex: 0 0 45%;
    background: var(--zest-dark);
    background: radial-gradient(ellipse at 70% 30%, #1a2370 0%, #0d1137 40%, var(--zest-dark) 100%);
    position: relative;
    overflow: hidden;
    flex-direction: column;
    justify-content: center;
    padding: 3rem;
}

.login-brand::before {
    content: '';
    position: absolute;
    top: -10%;
    right: -15%;
    width: 500px;
    height: 500px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(43,58,255,0.18) 0%, transparent 65%);
    pointer-events: none;
}

.login-brand::after {
    content: '';
    position: absolute;
    bottom: -5%;
    left: -10%;
    width: 350px;
    height: 350px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(43,58,255,0.1) 0%, transparent 65%);
    pointer-events: none;
}

.lb-inner {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
    max-width: 440px;
}

.lb-logo {
    display: flex;
    align-items: center;
}

.lb-logo-img {
    height: 40px;
    width: auto;
}

.lb-logo-fallback {
    display: flex;
    align-items: center;
    gap: .75rem;
}

.lb-logo-mark {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    background: var(--zest-blue);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    font-weight: 800;
    color: #fff;
}

.lb-logo-name {
    font-size: 1.4rem;
    font-weight: 700;
    color: #fff;
    letter-spacing: -.3px;
}

.lb-tag {
    display: inline-block;
    font-size: .72rem;
    font-weight: 600;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--zest-blue-light);
    background: rgba(43,58,255,.15);
    padding: .35rem .85rem;
    border-radius: 100px;
    margin-bottom: 1rem;
    border: 1px solid rgba(43,58,255,.25);
}

.lb-title {
    font-size: 3.5rem;
    font-weight: 800;
    color: #fff;
    line-height: 1.05;
    letter-spacing: -2px;
    margin-bottom: .75rem;
}

.lb-sub {
    font-size: .95rem;
    color: rgba(255,255,255,.55);
    line-height: 1.6;
    margin: 0;
}

.lb-pills {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.lb-pill {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    font-size: .78rem;
    font-weight: 500;
    color: rgba(255,255,255,.65);
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.1);
    padding: .35rem .9rem;
    border-radius: 100px;
    transition: all var(--transition);
}

.lb-pill:hover {
    background: rgba(43,58,255,.2);
    border-color: rgba(43,58,255,.3);
    color: #fff;
}

.lb-footer {
    font-size: .75rem;
    color: rgba(255,255,255,.25);
    margin: 0;
}

/* ── Pannello form (destra) ── */
.login-form-panel {
    flex: 1;
    background: var(--off-white);
    padding: 2rem;
}

.login-card {
    background: var(--white);
    border-radius: 20px;
    padding: 2.5rem;
    width: 100%;
    max-width: 420px;
    box-shadow: var(--shadow-lg);
}

.lc-title {
    font-size: 1.45rem;
    font-weight: 700;
    color: var(--text-dark);
    margin-bottom: .35rem;
}

.lc-sub {
    font-size: .88rem;
    color: var(--text-muted);
    margin: 0;
}

.login-card .form-control:focus {
    border-color: var(--zest-blue);
    box-shadow: 0 0 0 0.2rem var(--zest-blue-glow);
}

.btn-login {
    background: var(--zest-blue);
    border: none;
    color: #fff;
    font-weight: 600;
    padding: .75rem;
    border-radius: var(--radius-sm);
    font-size: 1rem;
    transition: all var(--transition);
}

.btn-login:hover {
    background: var(--zest-blue-light);
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(43, 58, 255, 0.3);
}

@media (max-width: 991.98px) {
    .login-form-panel {
        background: var(--zest-dark);
        background: radial-gradient(ellipse at 50% 30%, #131850 0%, var(--zest-dark) 70%);
    }
    .login-card {
        box-shadow: 0 24px 80px rgba(0,0,0,.45);
    }
}

/* ═══════════════════════════════════════════════════════════════════════════
   NAVBAR
   ═══════════════════════════════════════════════════════════════════════════ */

.navbar {
    padding: .6rem 0;
    transition: all var(--transition);
}

.navbar-main {
    background: var(--white);
    box-shadow: var(--shadow-soft);
    z-index: 1030;
        
}

.navbar-main .navbar-brand {
    color: var(--text-dark) !important;
}

.navbar-main .nav-link {
    color: var(--gray-700) !important;
    font-weight: 500;
}

.navbar-main .nav-link:hover {
    color: var(--zest-blue) !important;
}

.navbar-main .navbar-collapse {
    background: var(--white);
}
/* Su mobile la navbar resta su una riga: logo a sinistra, icone e avatar a destra */
.navbar-main .navbar-nav .dropdown-menu { position: absolute; }
@media (max-width: 575.98px) {
    .navbar-main .logo-img { height: 30px; }
    .navbar-main .nav-link { padding-left: .35rem !important; padding-right: .35rem !important; }
    .navbar-main .dropdown-toggle::after { display: none; }
    /* Menu agganciati al bordo destro della navbar, non all'icona: restano dentro lo schermo */
    .navbar-main .navbar-nav .dropdown { position: static; }
    .navbar-main .navbar-nav .dropdown-menu { top: 100%; right: 12px; left: auto; margin-top: 0; max-height: calc(100vh - 80px); overflow-y: auto; }
    .nest-notif-menu { min-width: 0; width: calc(100vw - 24px); max-width: 360px; }
}

.topbar-simple {
    background: var(--white);
    box-shadow: var(--shadow-soft);
    padding: 0.75rem 1.5rem;
    display: flex;
    align-items: center;
    z-index: 1030;
}



.nest-notif-btn {
    position: relative;
    width: 38px;
    height: 38px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    font-size: 1.15rem;
}
.nest-bug-btn {
    color: #f97316 !important;
}
.nest-bug-toast {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 2000;
    padding: 12px 20px;
    border-radius: 10px;
    background: #16a34a;
    color: #fff;
    font-size: .9rem;
    font-weight: 600;
    box-shadow: 0 4px 16px rgba(0, 0, 0, .18);
    pointer-events: none;
}
.nest-notif-badge {
    position: absolute;
    top: 4px;
    right: 2px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    background: #ef4444;
    color: #fff !important;
    font-size: .65rem;
    font-weight: 700;
    border-radius: 99px;
    line-height: 16px;
    text-align: center;
}
.nest-notif-menu {
    min-width: 300px;
    max-width: 360px;
}
.nest-notif-item {
    display: flex !important;
    align-items: flex-start;
    gap: .7rem;
    white-space: normal;
    padding: .7rem 1rem !important;
}
.nest-notif-item i {
    margin-top: .15rem;
    color: #0D9488;
    font-size: 1.05rem;
}
.nest-notif-item strong {
    display: block;
    font-size: .86rem;
}
.nest-notif-item small {
    display: block;
    color: var(--text-muted, #6b7280);
    font-size: .78rem;
    margin-top: .1rem;
}

.nest-dash-notifs { margin-bottom: .25rem; }
.nest-dash-notif {
    display: flex;
    align-items: center;
    gap: 1rem;
    background: var(--white, #fff);
    border: 1px solid var(--gray-100, #e5e7eb);
    border-left: 4px solid #0D9488;
    border-radius: 12px;
    padding: .95rem 1.15rem;
    text-decoration: none !important;
    color: inherit;
    margin-bottom: .65rem;
    box-shadow: var(--shadow-soft);
    transition: transform .15s, box-shadow .15s;
}
.nest-dash-notif:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 24px rgba(13, 148, 136, .12);
    color: inherit;
}
.ndn-icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: rgba(13, 148, 136, .12);
    color: #0D9488;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.15rem;
    flex-shrink: 0;
}
.ndn-title { font-weight: 700; font-size: .95rem; color: var(--text-dark); }
.ndn-body { font-size: .82rem; color: var(--text-muted); }
.ndn-cta {
    margin-left: auto;
    font-size: .8rem;
    font-weight: 600;
    color: #0D9488;
    white-space: nowrap;
}

/* ═══════════════════════════════════════════════════════════════════════════
   FOUNDER DASHBOARD  –  Chiaro / Bianco
   ═══════════════════════════════════════════════════════════════════════════ */

.dash-founder {
    background: var(--off-white);
    flex: 1;
}

/* Hero */
.hero-founder {
    background: var(--white);
    border-bottom: 1px solid var(--gray-100);
    padding: 2rem 0;
}

.hf-date {
    font-size: .78rem;
    font-weight: 500;
    letter-spacing: .5px;
    text-transform: uppercase;
    color: var(--text-muted);
}

.hf-title {
    font-weight: 700;
    font-size: 1.65rem;
    color: var(--text-dark);
    letter-spacing: -.3px;
}

.hf-sub {
    font-size: .92rem;
    color: var(--text-muted);
}

.hf-badge-role {
    background: var(--zest-blue-glow);
    color: var(--zest-blue);
    font-size: .78rem;
    padding: .4em .85em;
    border-radius: 100px;
    font-weight: 600;
}

.hf-badge-coming {
    background: var(--gray-100);
    color: var(--gray-700);
    font-size: .78rem;
    padding: .4em .85em;
    border-radius: 100px;
    font-weight: 500;
}

/* Section header */
.section-header {
    display: flex;
    align-items: center;
    gap: .75rem;
}

.section-label {
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--text-muted);
}

/* Tool cards */
.founder-card {
    display: flex;
    align-items: flex-start;
    gap: 1.25rem;
    background: var(--white);
    border-radius: var(--radius);
    padding: 1.5rem;
    box-shadow: var(--shadow-soft);
    transition: all var(--transition);
    text-decoration: none !important;
    color: inherit !important;
    border: 1px solid var(--gray-100);
    height: 100%;
}

.founder-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow-lg);
    border-color: rgba(43,58,255,.15);
}

.founder-card .fc-icon {
    flex-shrink: 0;
    width: 56px;
    height: 56px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    transition: transform var(--transition);
}

.founder-card:hover .fc-icon {
    transform: scale(1.08);
}

.founder-card .fc-body {
    flex: 1;
    min-width: 0;
}

.founder-card .fc-title {
    font-weight: 700;
    font-size: 1.05rem;
    margin-bottom: .25rem;
    color: var(--text-dark);
}

.founder-card .fc-desc {
    font-size: .84rem;
    color: var(--text-muted);
    margin: 0 0 .6rem;
    line-height: 1.45;
}

.founder-card .fc-cta {
    font-size: .82rem;
    font-weight: 600;
    color: var(--zest-blue);
    display: inline-flex;
    align-items: center;
    opacity: 0;
    transform: translateX(-4px);
    transition: all var(--transition);
}

.founder-card:hover .fc-cta {
    opacity: 1;
    transform: translateX(0);
}

.founder-card .fc-arrow {
    margin-left: auto;
    align-self: center;
    color: var(--gray-200);
    transform: translateX(-4px);
    transition: all var(--transition);
    font-size: 1rem;
    flex-shrink: 0;
}

.founder-card:hover .fc-arrow {
    color: var(--zest-blue);
    transform: translateX(0);
}

.founder-card.fc-disabled {
    opacity: 0.45;
    filter: grayscale(1);
    pointer-events: none;
    cursor: default;
}

/* Empty state */
.empty-icon-wrap {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: var(--gray-100);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.8rem;
    color: var(--zest-blue);
    opacity: .5;
}

/* Program info card */
.program-info-card {
    background: var(--white);
    border: 1px solid var(--gray-100);
    border-radius: var(--radius);
    padding: 1.25rem 1.5rem;
    box-shadow: var(--shadow-soft);
}

.pi-icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: var(--zest-blue-glow);
    color: var(--zest-blue);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    flex-shrink: 0;
}

.pi-title {
    font-weight: 600;
    font-size: .92rem;
    color: var(--text-dark);
    margin-bottom: .25rem;
}

.pi-desc {
    font-size: .83rem;
    color: var(--text-muted);
    line-height: 1.5;
}

.pi-desc a {
    color: var(--zest-blue);
    text-decoration: none;
    font-weight: 500;
}

.pi-desc a:hover {
    text-decoration: underline;
}

/* ═══════════════════════════════════════════════════════════════════════════
   ADMIN / ACCELERATOR DASHBOARD  –  Scuro / Blu
   ═══════════════════════════════════════════════════════════════════════════ */

.dash-admin {
    background: var(--zest-dark);
    flex: 1;
    color: #fff;
    min-height: calc(100vh - 56px);
}

/* Stats */
.stat-card {
    background: var(--zest-navy);
    border: 1px solid rgba(255,255,255,0.06);
    border-radius: var(--radius);
    padding: 1.25rem;
    text-align: center;
}

.stat-card .stat-value {
    font-size: 1.75rem;
    font-weight: 700;
    color: #fff;
}

.stat-card .stat-label {
    font-size: .72rem;
    color: rgba(255,255,255,0.45);
    text-transform: uppercase;
    letter-spacing: .6px;
    font-weight: 500;
}

/* Stat card cliccabile (link alla schermata di gestione) */
a.stat-card-link {
    display: block;
    text-decoration: none !important;
    color: inherit;
    transition: background .2s, border-color .2s;
}
a.stat-card-link:hover {
    background: rgba(255,255,255,0.04);
    border-color: rgba(255,255,255,0.12);
}
a.stat-card-link .stat-value,
a.stat-card-link .stat-label {
    color: inherit;
}

/* Section labels */
.admin-section-label {
    font-size: .72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .8px;
    color: rgba(255,255,255,0.35);
    margin-bottom: .75rem;
    padding-left: .25rem;
}

/* Tool cards scure */
.admin-tool-card {
    display: block;
    background: var(--zest-navy);
    border-radius: var(--radius);
    padding: 1.35rem;
    transition: all var(--transition);
    text-decoration: none !important;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,0.06);
    position: relative;
    overflow: hidden;
    height: 100%;
}

.admin-tool-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    background: var(--tool-color, var(--zest-blue));
    transition: width var(--transition);
}

.admin-tool-card:hover {
    background: var(--zest-navy-mid);
    transform: translateY(-2px);
    box-shadow: 0 8px 30px rgba(0,0,0,0.3);
    border-color: rgba(255,255,255,0.1);
}

.admin-tool-card:hover::before {
    width: 4px;
}

.admin-tool-card.atc-closed {
    opacity: 0.4;
    filter: grayscale(1);
}

.admin-tool-card.atc-closed:hover {
    transform: none;
    box-shadow: none;
    background: var(--zest-navy);
    border-color: rgba(255,255,255,0.06);
}

.admin-tool-card .atc-icon {
    width: 44px;
    height: 44px;
    border-radius: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    margin-bottom: .75rem;
}

.admin-tool-card .atc-title {
    font-weight: 700;
    font-size: .95rem;
    margin-bottom: .25rem;
    color: #fff;
}

.admin-tool-card .atc-desc {
    font-size: .8rem;
    color: rgba(255,255,255,0.5);
    margin: 0;
    line-height: 1.4;
}

/* Quick links scure */
.admin-quick-link {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .75rem 1rem;
    background: var(--zest-navy);
    border: 1px solid rgba(255,255,255,0.06);
    border-radius: var(--radius-sm);
    text-decoration: none !important;
    color: rgba(255,255,255,0.75) !important;
    transition: all var(--transition);
    font-weight: 500;
    font-size: .88rem;
}

.admin-quick-link:hover {
    background: var(--zest-navy-mid);
    color: #fff !important;
    transform: translateX(3px);
}

.admin-quick-link i {
    font-size: 1.05rem;
    color: var(--zest-blue-light);
}

/* Footer scuro per admin */
.dash-admin footer {
    background: transparent;
}

.dash-admin footer p {
    color: rgba(255,255,255,0.25) !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   ADMIN PANEL (gestione)
   ═══════════════════════════════════════════════════════════════════════════ */

.admin-panel-page {
    background: var(--zest-dark);
    color: #fff;
    flex: 1;
}

.admin-panel-page .card {
    background: var(--zest-navy);
    border: 1px solid rgba(255,255,255,0.06);
    border-radius: var(--radius);
}

.admin-panel-page .card-header {
    background: transparent;
    border-bottom: 1px solid rgba(255,255,255,0.06);
    color: #fff;
}

.admin-panel-page .table {
    color: rgba(255,255,255,0.8);
}

.admin-panel-page .table-light {
    --bs-table-bg: rgba(255,255,255,0.03);
    --bs-table-color: rgba(255,255,255,0.5);
}

.admin-panel-page .table-hover > tbody > tr:hover {
    --bs-table-hover-bg: rgba(255,255,255,0.03);
    --bs-table-hover-color: #fff;
}

.admin-panel-page .nav-tabs {
    border-bottom-color: rgba(255,255,255,0.08);
}

.admin-panel-page .nav-tabs .nav-link {
    color: rgba(255,255,255,0.45);
}

.admin-panel-page .nav-tabs .nav-link.active {
    color: var(--zest-blue-light);
    border-bottom: 2px solid var(--zest-blue);
    background: transparent;
}

.admin-panel-page .nav-tabs .nav-link:hover {
    color: var(--zest-blue-light);
    border-color: transparent;
}

.admin-panel-page .modal-content {
    background: var(--zest-navy-mid);
    border: 1px solid rgba(255,255,255,0.1);
    color: #fff;
}

.admin-panel-page .modal-header {
    border-bottom-color: rgba(255,255,255,0.08);
}

.admin-panel-page .modal-footer {
    border-top-color: rgba(255,255,255,0.08);
}

.admin-panel-page .form-control,
.admin-panel-page .form-select {
    background-color: rgba(22,27,69,0.9);
    border: 1px solid rgba(255,255,255,0.1);
    color: #fff;
}

/* Select: rimuovere stile nativo del browser che forza sfondo bianco */
.admin-panel-page .form-select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: var(--zest-navy-mid) !important;
    color: #fff !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba(255,255,255,.7)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 0.6rem center;
    background-size: 1rem;
    padding-right: 2rem;
}

.admin-panel-page .form-control:focus,
.admin-panel-page .form-select:focus {
    background-color: rgba(255,255,255,0.08) !important;
    border-color: var(--zest-blue);
    color: #fff !important;
    box-shadow: 0 0 0 0.2rem var(--zest-blue-glow);
}

/* Opzioni select: testo scuro su sfondo chiaro nel dropdown */
.admin-panel-page .form-select option {
    background: #fff;
    color: #0D1137;
}

.admin-panel-page .form-control::placeholder {
    color: rgba(255,255,255,0.3);
}

.admin-panel-page .form-label {
    color: rgba(255,255,255,0.6);
}

.admin-panel-page .btn-close {
    filter: invert(1);
}

.admin-panel-page footer p {
    color: rgba(255,255,255,0.2) !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   SHARED
   ═══════════════════════════════════════════════════════════════════════════ */

.btn-primary {
    background: var(--zest-blue);
    border-color: var(--zest-blue);
}

.btn-primary:hover {
    background: var(--zest-blue-light);
    border-color: var(--zest-blue-light);
}

.btn {
    border-radius: var(--radius-sm);
    font-weight: 500;
    transition: all var(--transition);
}

/* ── Pulsanti: un solo sistema per tutto il sito ──────────────────────────────
   Si usano solo le classi Bootstrap, con l'aspetto deciso qui (chiaro) e in
   style-admin.css (scuro): btn-primary = azione principale, btn-outline-secondary =
   secondaria, btn-outline-danger = distruttiva, btn-link = azione testuale,
   btn-hero = pulsanti nella banda titolo. Taglie: normale o btn-sm.
   Solo icona: aggiungere btn-icon (quadrato, stessa altezza dei pulsanti di testo).
   Nessuna classe di pulsante propria dei servizi, nessuno style inline. */
.btn { --bs-btn-padding-x: .95rem; --bs-btn-padding-y: .45rem; --bs-btn-font-size: .875rem; }
.btn-sm { --bs-btn-padding-x: .7rem; --bs-btn-padding-y: .3rem; --bs-btn-font-size: .8rem; --bs-btn-border-radius: var(--radius-sm); }
.btn-lg { --bs-btn-padding-x: 1.25rem; --bs-btn-padding-y: .65rem; --bs-btn-font-size: 1rem; --bs-btn-border-radius: var(--radius-sm); }
.btn.btn-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.25rem;
    height: 2.25rem;
    padding: 0 .5rem;
}
.btn-sm.btn-icon { min-width: 1.9rem; height: 1.9rem; padding: 0 .4rem; }
.btn .bi { line-height: 1; }
.btn-outline-secondary {
    --bs-btn-color: var(--gray-700);
    --bs-btn-border-color: var(--gray-200);
    --bs-btn-hover-color: var(--text-dark);
    --bs-btn-hover-bg: var(--gray-100);
    --bs-btn-hover-border-color: var(--gray-200);
    --bs-btn-active-color: var(--text-dark);
    --bs-btn-active-bg: var(--gray-200);
    --bs-btn-active-border-color: var(--gray-200);
}
.btn-outline-primary {
    --bs-btn-color: var(--zest-blue);
    --bs-btn-border-color: var(--zest-blue);
    --bs-btn-hover-bg: var(--zest-blue);
    --bs-btn-hover-border-color: var(--zest-blue);
    --bs-btn-active-bg: var(--zest-blue);
    --bs-btn-active-border-color: var(--zest-blue);
}
.btn-link { --bs-btn-color: var(--zest-blue); --bs-btn-hover-color: var(--zest-blue-light); text-decoration: none; }
/* Azioni di riga (tabelle): solo icona, discrete finché non ci si passa sopra */
.btn-ghost {
    --bs-btn-color: var(--gray-500);
    --bs-btn-bg: transparent;
    --bs-btn-border-color: transparent;
    --bs-btn-hover-color: var(--text-dark);
    --bs-btn-hover-bg: var(--gray-100);
    --bs-btn-hover-border-color: transparent;
    --bs-btn-active-color: var(--text-dark);
    --bs-btn-active-bg: var(--gray-200);
    --bs-btn-active-border-color: transparent;
}
.btn-ghost-danger { --bs-btn-hover-color: #dc2626; --bs-btn-hover-bg: rgba(220,38,38,.08); --bs-btn-active-color: #dc2626; }

/* ── Avatar: tondo per i founder, quadrato arrotondato per gli altri ──────────
   Colori da NestAvatar (JS) / nestAvatarHtml (PHP): stesse iniziali = stesso colore. */
.nest-av {
    --av: 32px;
    width: var(--av);
    height: var(--av);
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: calc(var(--av) * .28);
    color: #fff;
    font-size: calc(var(--av) * .38);
    font-weight: 600;
    line-height: 1;
    letter-spacing: .02em;
    vertical-align: middle;
    user-select: none;
}
.nest-av-round { border-radius: 50%; }
.nest-av.has-img { background: var(--gray-100); }
.nest-av img { width: 100%; height: 100%; object-fit: cover; display: block; }
.nest-av-contain.has-img { background: #fff !important; padding: calc(var(--av) * .08); }
.nest-av-contain img { object-fit: contain; }
.nest-nav-av { display: inline-flex; }
.nest-person { display: inline-flex; align-items: center; gap: .5rem; min-width: 0; vertical-align: middle; }
.nest-person-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nest-founders { display: flex; flex-wrap: wrap; gap: .35rem .75rem; }
.nest-founders .nest-person { font-size: .82rem; }
.nest-founders .is-off { opacity: .5; }

/* ── Elenchi (NestList): ricerca, batch, raggruppamento, paginazione ─────────── */
.nest-list-bar { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .75rem; }
.nest-list-search { position: relative; flex: 1 1 220px; min-width: 0; max-width: 360px; }
.nest-list-search .bi { position: absolute; left: .6rem; top: 50%; transform: translateY(-50%); opacity: .55; pointer-events: none; }
.nest-list-search input { padding-left: 1.9rem; }
.nest-list-batch { width: auto; min-width: 160px; }
.nest-list-group { font-size: .82rem; white-space: nowrap; }
.nest-pager { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem; padding: .75rem 0 0; }
.nest-pager-info { font-size: .8rem; color: var(--text-muted); }
.nest-pager-nav { display: flex; align-items: center; gap: .25rem; }
.nest-pager-gap { padding: 0 .25rem; color: var(--text-muted); }
.nest-group-head { display: flex; align-items: center; gap: .6rem; font-weight: 600; }
.nest-group-head .nest-group-batch { font-size: .72rem; font-weight: 500; color: var(--text-muted); }

.badge {
    font-weight: 500;
    padding: .35em .65em;
    border-radius: 6px;
}

.form-control, .form-select, .input-group-text {
    border-radius: var(--radius-sm);
}

.input-group .form-control {
    border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
}

.input-group .input-group-text {
    border-radius: var(--radius-sm) 0 0 var(--radius-sm);
}

.dropdown-menu {
    border-radius: 12px;
    box-shadow: var(--shadow-lg);
    border: 1px solid var(--gray-100);
    padding: .5rem;
}

.dropdown-item {
    border-radius: 6px;
    padding: .5rem .75rem;
}

/* ═══════════════════════════════════════════════════════════════════════════
   SERVICE HERO — titolo sezione sotto navbar (dark di default)
   ═══════════════════════════════════════════════════════════════════════════ */

.service-hero {
    background: linear-gradient(135deg, #080d2e 0%, #0d1445 50%, #121a5c 100%) !important;
    border-bottom: 1px solid rgba(255,255,255,.06);
    padding: 2.5rem 0 2rem;
    color: #fff;
    position: relative;
    overflow: hidden;
}
.service-hero::before {
    content: '';
    position: absolute; inset: 0;
    background:
        radial-gradient(ellipse 60% 80% at 90% 50%, rgba(43,58,255,.15) 0%, transparent 70%),
        radial-gradient(ellipse 40% 60% at 10% 80%, rgba(99,102,241,.10) 0%, transparent 70%);
    pointer-events: none;
}
.service-hero > * { position: relative; z-index: 1; }
.service-hero .hero-greeting { color: rgba(255,255,255,.55); font-size: .95rem; letter-spacing: .01em; margin: 0; }
.service-hero .hero-name { color: #fff; font-size: 2rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.1; margin: .1rem 0 .3rem; }
.service-hero .hero-sub { color: rgba(255,255,255,.45); font-size: .9rem; margin: 0; }
.service-hero.hero-light {
    background: #fff !important;
    border-bottom: 1px solid rgba(0,0,0,.07);
    color: var(--zest-navy);
}
.service-hero.hero-light::before { display: none; }
.service-hero-icon {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    flex-shrink: 0;
}
.service-hero-title {
    font-size: 1.6rem;
    font-weight: 800;
    margin: 0;
    line-height: 1.15;
    letter-spacing: -.02em;
}
.service-hero-sub {
    font-size: .9rem;
    margin: 4px 0 0;
    color: rgba(255,255,255,.45);
}
.hero-light .service-hero-sub { color: rgba(13,17,55,.45); }
.hero-light .service-hero-title { color: var(--zest-navy); }

/* ═══════════════════════════════════════════════════════════════════════════
   SERVICE SUBNAV — tab di navigazione intra-servizio
   ═══════════════════════════════════════════════════════════════════════════ */

.service-subnav {
    background: var(--zest-navy);
    border-bottom: 1px solid rgba(255,255,255,.07);
}
.service-subnav.subnav-light {
    background: #f5f6fa;
    border-bottom: 1px solid rgba(0,0,0,.08);
}
.service-subnav .container,
.service-subnav .container-xl {
    display: flex;
    gap: 0;
    padding-top: 0;
    padding-bottom: 0;
}
.sn-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 11px 16px;
    font-size: .82rem;
    font-weight: 600;
    color: rgba(255,255,255,.4);
    text-decoration: none;
    border-bottom: 2px solid transparent;
    transition: color .15s, border-color .15s;
    white-space: nowrap;
}
.sn-item:hover { color: rgba(255,255,255,.8); }
.sn-item.active { color: #fff; border-bottom-color: var(--zest-blue); }
.service-subnav.subnav-light .sn-item { color: rgba(13,17,55,.4); }
.service-subnav.subnav-light .sn-item:hover { color: rgba(13,17,55,.75); }
.service-subnav.subnav-light .sn-item.active { color: var(--zest-navy); border-bottom-color: var(--zest-blue); }

/* Ruoli Nest — stesso tag ovunque (Gestione, Registro, navbar) */
.role-pill {
    display: inline-block;
    padding: .25rem .6rem;
    border-radius: 6px;
    font-size: .65rem;
    font-weight: 700;
    letter-spacing: .4px;
    text-transform: uppercase;
    line-height: 1.2;
}
.role-pill.role-admin { background: rgba(248,113,113,.18); color: #f87171; }
.role-pill.role-accell { background: rgba(129,140,248,.18); color: #818CF8; }
.role-pill.role-founder { background: rgba(34,197,94,.18); color: #4ade80; }
.role-pill.role-partner { background: rgba(251,191,36,.18); color: #FBBF24; }

/* ═══════════════════════════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════════════════════════ */

@media (max-width: 576px) {
    /* Login, reset password, accesso esterni CoFounder: la scheda usa quasi tutta la larghezza */
    .login-form-panel { padding: 1rem; }
    .login-card { margin: 0; padding: 1.75rem 1.25rem; }
    .hero-founder h1 { font-size: 1.3rem; }
    .founder-card { padding: 1.15rem; gap: 1rem; }
    .founder-card .fc-icon { width: 46px; height: 46px; font-size: 1.2rem; border-radius: 12px; }
}

/* ── Partner: header arancione in tutte le sezioni ─────────────────────── */
.navbar-main.navbar-partner,
.topbar-simple.navbar-partner {
    background: linear-gradient(90deg, #F97316 0%, #FB923C 100%) !important;
    border-bottom: 1px solid #EA580C !important;
    box-shadow: 0 2px 10px rgba(234, 88, 12, .25) !important;
}
.navbar-main.navbar-partner .navbar-brand,
.navbar-main.navbar-partner .nav-link,
.navbar-main.navbar-partner .nav-link:hover,
.navbar-main.navbar-partner .nav-link:focus {
    color: #1f1300 !important;
}
.navbar-main.navbar-partner .nest-notif-btn,
.navbar-main.navbar-partner .navbar-toggler {
    color: #1f1300 !important;
    background: transparent !important;
}
.navbar-main.navbar-partner .role-pill.role-partner {
    background: rgba(31, 19, 0, .14);
    color: #1f1300;
}
/* Il pannello interno della navbar ha sfondo bianco proprio: per i Partner va trasparente */
.navbar-main.navbar-partner .navbar-collapse {
    background: transparent !important;
    border-top-color: rgba(31, 19, 0, .15) !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   INTESTAZIONE SERVIZIO — renderServiceHeader() in _includes/layout.php
   ═══════════════════════════════════════════════════════════════════════════ */
.nest-svc-hero { padding: 1.1rem 0 1.35rem; }

/* Breadcrumb (renderBreadcrumb): unica navigazione di ritorno, sopra il titolo */
.nest-crumbs { margin: 0 0 .9rem; }
.nest-crumbs .breadcrumb {
    --bs-breadcrumb-divider: '›';
    --bs-breadcrumb-divider-color: rgba(255,255,255,.3);
    --bs-breadcrumb-item-active-color: rgba(255,255,255,.75);
    --bs-breadcrumb-item-padding-x: .45rem;
    margin: 0; font-size: .8rem; font-weight: 500; flex-wrap: wrap;
}
.nest-crumbs .breadcrumb-item { color: rgba(255,255,255,.75); }
.nest-crumbs a { color: rgba(255,255,255,.5); text-decoration: none; display: inline-flex; align-items: center; gap: .35rem; }
.nest-crumbs a:hover { color: #fff; }
.nest-crumbs .bi { font-size: .9em; }
.hero-light .nest-crumbs .breadcrumb { --bs-breadcrumb-divider-color: rgba(13,17,55,.3); --bs-breadcrumb-item-active-color: var(--zest-navy); }
.hero-light .nest-crumbs .breadcrumb-item { color: var(--zest-navy); }
.hero-light .nest-crumbs a { color: rgba(13,17,55,.5); }
.hero-light .nest-crumbs a:hover { color: var(--zest-blue); }
/* Partner: banda arancione (dashboard) */
.nest-svc-hero.hero-partner { background: #EA580C !important; border-bottom-color: rgba(0,0,0,.12); }
.nest-svc-hero.hero-partner::before { display: none; }
.nest-svc-hero.hero-partner .service-hero-sub { color: rgba(255,255,255,.85); }
.nest-svc-hero.hero-partner .service-hero-icon { background: rgba(255,255,255,.18) !important; color: #fff !important; }
.nest-svc-hero.hero-partner .nest-crumbs .breadcrumb { --bs-breadcrumb-divider-color: rgba(255,255,255,.55); --bs-breadcrumb-item-active-color: #fff; }
.nest-svc-hero.hero-partner .nest-crumbs .breadcrumb-item { color: #fff; }
.nest-svc-hero.hero-partner .nest-crumbs a { color: rgba(255,255,255,.8); }
.nest-svc-hero.hero-partner .nest-crumbs a:hover { color: #fff; }
.nest-svc-hero.hero-partner .btn-hero { background: rgba(0,0,0,.14); border-color: rgba(255,255,255,.35); color: #fff; }

/* Etichetta di gruppo (MAIUSCOLETTO piccolo) sopra blocchi e card: unica in tutto il sito */
.nest-sec-label { font-size: .7rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.35); margin: 0 0 .75rem; padding-left: 2px; }
html[data-bs-theme="light"] .nest-sec-label { color: rgba(13,17,55,.45); }

/* La navbar non eredita i padding dei .container ridefiniti dai CSS dei servizi */
.navbar-main .container { padding-top: 0 !important; padding-bottom: 0 !important; }
.nest-svc-hero-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.nest-svc-hero-main { display: flex; align-items: center; gap: 1rem; min-width: 0; flex: 1 1 260px; }
.nest-svc-hero-text { min-width: 0; }
.nest-svc-hero .service-hero-title { color: #fff; }
.nest-svc-hero.hero-light .service-hero-title { color: var(--zest-navy); }
.nest-svc-hero-actions { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
/* Pulsanti chiari nella banda scura (Gestione, Esporta…) */
.nest-svc-hero .btn-hero {
    background: rgba(255,255,255,.07); color: rgba(255,255,255,.75);
    border: 1px solid rgba(255,255,255,.12); border-radius: 8px; white-space: nowrap;
}
.nest-svc-hero .btn-hero:hover { background: rgba(255,255,255,.14); color: #fff; }
/* Stessa classe nella banda chiara dei founder: le pagine usano sempre btn-hero */
.nest-svc-hero.hero-light .btn-hero { background: #fff; color: var(--gray-700); border-color: var(--gray-200); }
.nest-svc-hero.hero-light .btn-hero:hover { background: var(--gray-100); color: var(--text-dark); }

/* Tab: stessi stili per <a> e <button> (tab gestite da JS) */
button.sn-item { background: transparent; border: 0; border-bottom: 2px solid transparent; font-family: inherit; cursor: pointer; }
button.sn-item.active { border-bottom-color: var(--zest-blue); }
.sn-item .bi { font-size: .95em; }
.sn-item .badge { font-size: .65rem; }
/* Su schermi stretti la barra tab scorre in orizzontale invece di allargare la pagina */
.service-subnav .container,
.service-subnav .container-xl { overflow-x: auto; scrollbar-width: thin; -webkit-overflow-scrolling: touch; }
.service-subnav .container::-webkit-scrollbar { height: 4px; }
.service-subnav .container::-webkit-scrollbar-thumb { background: rgba(255,255,255,.15); border-radius: 4px; }

@media (max-width: 576px) {
    .nest-svc-hero { padding: 1.1rem 0 1rem; }
    .nest-svc-hero .service-hero-icon { width: 42px; height: 42px; font-size: 1.15rem; border-radius: 11px; }
    .nest-svc-hero .service-hero-title { font-size: 1.25rem; }
    .nest-svc-hero-actions { width: 100%; }
    .sn-item { padding: 10px 12px; }
}

/* Modale di conferma/avviso (nestConfirm / nestAlert in app.js) */
.nest-dialog .modal-content { border-radius: 14px; }
.nest-dialog .modal-body { white-space: pre-line; }

/* Tabelle larghe: su mobile scorrono dentro il loro contenitore */
.nest-table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* Righe fuori dalla pagina corrente (NestList.rowPager) */
.nest-pg-off { display: none !important; }
.nest-group-row td { padding-top: 1rem !important; border-bottom-width: 1px; }

/* Paginazione in fondo alle card di elenco */
.ap-pager:not(:empty) { padding: 0 1.25rem 1rem; }
/* Nomi di persone e startup con link: colore del testo, sottolineati al passaggio */
.nest-person-name a, .nest-group-head a { color: inherit; text-decoration: none; font-weight: 500; }
.nest-person-name a:hover, .nest-group-head a:hover { text-decoration: underline; text-underline-offset: 2px; }

/* ═══════════════════════════════════════════════════════════════════════════
   MOBILE — regole comuni a tutti i servizi e a tutti i ruoli
   ═══════════════════════════════════════════════════════════════════════════ */

/* Tabelle impilate (NestTable in nest-ui.js): sotto i 992px una tabella troppo larga diventa
   un elenco di schede; ogni cella mostra l'intestazione della colonna (data-label) in una
   colonna fissa a sinistra.
   Celle senza intestazione (selezione, icone, azioni): niente etichetta; la prima resta accanto
   al titolo della riga, le altre vanno a destra. */
@media (max-width: 991.98px) {
    table.nest-stack,
    table.nest-stack > tbody { display: block; width: 100% !important; min-width: 0 !important; }
    table.nest-stack > thead { display: none; }
    table.nest-stack > tfoot { display: block; }
    table.nest-stack > tbody > tr {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: .15rem .5rem;
        padding: .8rem .9rem;
        border-bottom: 1px solid var(--bs-border-color-translucent, rgba(0,0,0,.08));
    }
    table.nest-stack > tbody > tr:last-child { border-bottom: 0; }
    table.nest-stack > tbody > tr > td,
    table.nest-stack > tbody > tr > th {
        display: flow-root;
        flex: 1 1 100%;
        min-width: 0;
        padding: .2rem 0 .2rem 7.6rem !important;
        border: 0 !important;
        width: auto !important;
        max-width: 100% !important;
        white-space: normal !important;
        text-align: left !important;
        background: transparent;
        box-shadow: none !important;
        overflow-wrap: anywhere;
    }
    table.nest-stack > tbody > tr > td::before {
        content: attr(data-label);
        float: left;
        width: 7rem;
        margin: .1rem 0 0 -7.6rem;
        font-size: .68rem;
        font-weight: 600;
        line-height: 1.5;
        letter-spacing: .04em;
        text-transform: uppercase;
        opacity: .55;
        overflow-wrap: normal;
    }
    table.nest-stack > tbody > tr > td:empty { display: none; }
    table.nest-stack > tbody > tr > td.nest-st-bare { padding-left: 0 !important; text-align: right !important; }
    table.nest-stack > tbody > tr > td.nest-st-bare::before { display: none; }
    /* Titolo della riga: la prima cella con intestazione, senza etichetta e in evidenza */
    table.nest-stack > tbody > tr > td:first-child:not(.nest-st-bare),
    table.nest-stack > tbody > tr > td.nest-st-bare:first-child + td { padding-left: 0 !important; font-weight: 600; font-size: .95rem; padding-bottom: .35rem !important; }
    table.nest-stack > tbody > tr > td:first-child:not(.nest-st-bare)::before,
    table.nest-stack > tbody > tr > td.nest-st-bare:first-child + td::before { display: none; }
    table.nest-stack > tbody > tr > td.nest-st-bare:first-child { flex: 0 0 auto; text-align: left !important; }
    table.nest-stack > tbody > tr > td.nest-st-bare:first-child + td { flex: 1 1 70%; }
    table.nest-stack > tbody > tr > td.nest-st-bare:last-child:not(:first-child) { padding-top: .5rem !important; }
    /* Righe di una sola cella (gruppi, "nessun risultato"): a tutta larghezza */
    table.nest-stack > tbody > tr.nest-st-single > td { flex: 1 1 100% !important; padding-left: 0 !important; text-align: left !important; font-weight: inherit; font-size: inherit; }
    table.nest-stack > tbody > tr.nest-st-single > td::before { display: none; }
    .table-responsive > table.nest-stack { margin-bottom: 0; }
}

/* Tablet: le coppie etichetta/valore delle tabelle impilate stanno su due colonne */
@media (min-width: 576px) and (max-width: 991.98px) {
    table.nest-stack > tbody > tr > td:not(.nest-st-bare):not(:first-child) { flex: 1 1 calc(50% - .5rem); }
    table.nest-stack > tbody > tr > td.nest-st-bare:first-child + td { flex: 1 1 70%; }
}

/* Touch: ciò che su desktop compare al passaggio del mouse su mobile è sempre visibile */
@media (hover: none) {
    .founder-card .fc-cta { opacity: 1; transform: none; }
    .founder-card .fc-arrow { color: var(--zest-blue); transform: none; }
    .founder-card:hover, .admin-tool-card:hover { transform: none; }
}

@media (max-width: 575.98px) {
    /* Modali: quasi a tutto schermo, pulsanti del piede su più righe se non entrano */
    .modal-dialog { margin: .5rem; }
    .modal-footer { flex-wrap: wrap; gap: .5rem; }
    .modal-footer > * { margin: 0; }
    .modal-body { padding: 1rem; }
    /* Intestazione di servizio: azioni nella banda su una riga che scorre se sono tante */
    .nest-svc-hero-actions .btn-hero { flex: 0 0 auto; }
    .nest-crumbs { margin-bottom: .6rem; }
    .nest-crumbs .breadcrumb { font-size: .75rem; }
    /* Elenchi: ricerca a tutta larghezza, filtri sotto */
    .nest-list-search { flex: 1 1 100%; max-width: none; }
    .nest-list-batch { flex: 1 1 auto; min-width: 0; }
    .nest-pager { justify-content: center; }
    .nest-pager-info { width: 100%; text-align: center; }
    /* Toast del bug in basso, centrato */
    .nest-bug-toast { left: 12px; right: 12px; bottom: 12px; text-align: center; }
    .dash-founder .founder-card { height: auto; }
}

/* iOS ingrandisce la pagina quando un campo ha testo sotto i 16px: sui touch i campi restano a 16px */
@media (hover: none) and (max-width: 767.98px) {
    input.form-control, select.form-select, textarea.form-control,
    input[type="text"], input[type="email"], input[type="search"], input[type="password"], input[type="number"], input[type="url"], input[type="tel"], input[type="date"], select, textarea {
        font-size: 16px !important;
    }
}
