/*
========================================================
 ECOPIU' RITIRI V5
 Override grafico sicuro.
 Il CSS originale rimane caricato sotto questo file.
========================================================
*/

:root {

    --v5-bg: #f4f7fb;
    --v5-panel: #ffffff;
    --v5-panel-soft: #f8faff;

    --v5-text: #172033;
    --v5-muted: #778297;

    --v5-primary: #2d7eea;
    --v5-primary-dark: #1768d0;
    --v5-primary-soft: #edf5ff;

    --v5-green: #2d7eea;
    --v5-green-soft: #eaf0f8;

    --v5-red: #d94b55;
    --v5-red-soft: #fff0f1;

    --v5-amber: #d99b28;
    --v5-amber-soft: #fff7e7;

    --v5-border: #e2e8f0;
    --v5-border-strong: #d6dee9;

    --v5-shadow:
        0 10px 32px
        rgba(26,43,75,.06);

    --v5-shadow-hover:
        0 16px 40px
        rgba(26,43,75,.10);

}


/* ====================================================
   BASE
==================================================== */

html,
body {

    color:
        var(--v5-text);

    background:
        radial-gradient(
            circle at 70% -20%,
            #fff 0,
            transparent 35%
        ),
        var(--v5-bg);

    font-family:
        -apple-system,
        BlinkMacSystemFont,
        "SF Pro Display",
        "Segoe UI",
        Arial,
        sans-serif;

}


/* ====================================================
   GLOBAL NAVBAR
==================================================== */

.v5-global {

    height: 72px;

    display: flex;
    align-items: center;

    position: fixed;

    top: 0;
    left: 0;
    right: 0;

    z-index: 1000;

    padding:
        0 28px;

    background:
        rgba(255,255,255,.92);

    backdrop-filter:
        blur(24px);

    border-bottom:
        1px solid
        rgba(20,35,55,.07);

}


.v5-logo {

    width: 116px;

    display: flex;
    align-items: center;

    margin-right: 24px;

}


.v5-logo img {

    display: block;

    max-width: 100px;
    max-height: 44px;

    object-fit: contain;

}


.v5-global-nav {

    display: flex;

    gap: 4px;

}


.v5-global-nav a {

    padding:
        9px
        13px;

    border-radius: 11px;

    color:
        #5d687b;

    text-decoration: none;

    font-size: 14px;
    font-weight: 600;

}


.v5-global-nav a:hover {

    color:
        var(--v5-primary);

    background:
        #f1f5fa;

}


.v5-global-nav a.active {

    color:
        var(--v5-primary);

    background:
        var(--v5-primary-soft);

}


.v5-client-area {

    color:
        #647188;

    font-size: 14px;
    font-weight: 700;

}


.v5-global-spacer {

    flex: 1;

}


.v5-user {

    display: flex;
    align-items: center;

    gap: 9px;

}


.v5-avatar {

    width: 36px;
    height: 36px;

    display: grid;
    place-items: center;

    border-radius: 50%;

    background:
        var(--v5-primary-soft);

    color:
        var(--v5-primary);

    font-size: 11px;
    font-weight: 800;

}


.v5-user-copy {

    display: grid;

    line-height: 1.15;

}


.v5-user-copy strong {

    font-size: 12px;

}


.v5-user-copy small {

    margin-top: 3px;

    color:
        var(--v5-muted);

    font-size: 9px;

}


.v5-logout {

    margin-left: 7px;

    color:
        #8993a2;

    font-size: 11px;

    text-decoration: none;

}


.v5-bell {

    position: relative;

    margin-right: 18px;

    color:
        var(--v5-primary);

}


.v5-bell span {

    position: absolute;

    top: -9px;
    right: -11px;

    min-width: 18px;
    height: 18px;

    display: grid;
    place-items: center;

    padding:
        0 4px;

    border-radius: 999px;

    background:
        var(--v5-red);

    color: white;

    font-size: 9px;
    font-weight: 800;

}


.v5-mobile-menu {

    display: none;

    margin-right: 8px;

    padding: 6px;

    border: 0;

    background: transparent;

    color:
        #647188;

    font-size: 21px;

}


/* ====================================================
   SHELL
==================================================== */

.v5-shell {

    min-height: 100vh;

    padding-top: 72px;

}


/* ====================================================
   SIDEBAR
==================================================== */

.sidebar.v5-sidebar {

    position: fixed;

    top: 72px;
    left: 0;
    bottom: 0;

    width: 235px;

    padding:
        27px
        17px
        20px;

    background:
        rgba(255,255,255,.74);

    color:
        var(--v5-text);

    border-right:
        1px solid
        rgba(20,35,55,.07);

    box-shadow: none;

}


.v5-sidebar-title {

    padding:
        0 11px
        21px;

}


.v5-sidebar-title span {

    display: block;

    color:
        #8b95a5;

    font-size: 10px;
    font-weight: 800;

    letter-spacing:
        .14em;

}


.v5-sidebar-title strong {

    display: block;

    margin-top: 5px;

    font-size: 15px;

}


.side-nav.v5-side-nav {

    display: grid;

    gap: 5px;

}


.side-nav.v5-side-nav a {

    display: flex;
    align-items: center;

    gap: 11px;

    padding:
        11px
        12px;

    border-radius: 11px;

    background: transparent;

    color:
        #637086;

    font-size: 13px;
    font-weight: 600;

}


.side-nav.v5-side-nav a:hover {

    color:
        var(--v5-primary);

    background:
        #f1f5fb;

}


.side-nav.v5-side-nav a.active {

    color:
        var(--v5-primary);

    background:
        var(--v5-primary-soft);

}


.side-nav.v5-side-nav .nav-icon {

    width: 20px;

    color: inherit;

}


.side-nav.v5-side-nav .nav-count {

    margin-left: auto;

    background:
        var(--v5-red);

    color: white;

}


.v5-sidebar-bottom {

    position: absolute;

    left: 28px;
    right: 20px;
    bottom: 20px;

    padding-top: 15px;

    border-top:
        1px solid
        var(--v5-border);

}


.v5-sidebar-bottom span,
.v5-sidebar-bottom small {

    display: block;

}


.v5-sidebar-bottom span {

    color:
        #5e6879;

    font-size: 12px;
    font-weight: 700;

}


.v5-sidebar-bottom small {

    margin-top: 3px;

    color:
        #9aa3b0;

}


/* ====================================================
   MAIN
==================================================== */

.app-main.v5-main {

    width:
        calc(100% - 235px);

    min-height:
        calc(100vh - 72px);

    margin-left:
        235px;

}


.page.v5-page {

    width: 100%;

    max-width:
        1500px;

    margin:
        0 auto;

    padding:
        34px
        34px
        70px;

}


/* ====================================================
   PAGE HEADER
==================================================== */

.v5-page .page-head {

    margin-bottom:
        24px;

}


.v5-page .page-head h1 {

    margin:
        0 0
        6px;

    color:
        var(--v5-text);

    font-size:
        clamp(29px,3vw,38px);

    letter-spacing:
        -.035em;

}


.v5-page .page-head p {

    margin: 0;

    color:
        var(--v5-muted);

    font-size: 13px;

}


/* ====================================================
   CARDS
==================================================== */

.v5-page .panel,
.v5-page .stat-card {

    background:
        rgba(255,255,255,.97);

    border:
        1px solid
        var(--v5-border);

    box-shadow:
        var(--v5-shadow);

}


.v5-page .panel {

    padding: 22px;

    border-radius: 24px;

}


.v5-page .stat-card {

    min-height: 96px;

    padding:
        19px;

    border-radius: 18px;

}


.v5-page .panel-head {

    margin-bottom:
        19px;

}


.v5-page .panel-head h2 {

    margin:
        0 0
        5px;

    color:
        var(--v5-text);

    font-size: 19px;

}


.v5-page .panel-head p {

    color:
        var(--v5-muted);

    font-size: 12px;

}


/* ====================================================
   STATS
==================================================== */

.v5-page .stats-grid {

    gap: 14px;

    margin-bottom:
        18px;

}


.v5-page .stat-icon {

    width: 42px;
    height: 42px;

    border-radius: 13px;

}


.v5-page .stat-card strong {

    color:
        var(--v5-text);

    font-size: 22px;

    letter-spacing:
        -.025em;

}


.v5-page .stat-card span {

    color:
        var(--v5-muted);

}


/* ====================================================
   DASHBOARD
==================================================== */

.v5-page .dashboard-grid {

    grid-template-columns:
        minmax(0,2fr)
        minmax(300px,.8fr);

}


/* ====================================================
   TABLE
==================================================== */

.v5-page .modern-table th {

    padding:
        11px;

    color:
        #929baa;

    border-bottom:
        1px solid
        #edf1f5;

    font-size: 9px;
    font-weight: 800;

    letter-spacing:
        .06em;

    text-transform:
        uppercase;

}


.v5-page .modern-table td {

    padding:
        12px
        11px;

    color:
        #536076;

    border-bottom:
        1px solid
        #edf1f5;

    font-size: 12px;

}


.v5-page .modern-table tbody tr:hover {

    background:
        #fafcff;

}


.v5-page .row-action {

    border-radius: 9px;

    background:
        var(--v5-primary-soft);

    color:
        var(--v5-primary);

}


/* ====================================================
   BUTTONS
==================================================== */

.v5-page .btn {

    min-height: 40px;

    padding:
        9px
        14px;

    border-radius: 10px;

    font-weight: 650;

}


.v5-page .btn.primary,
.v5-page button.btn.primary {

    border: 0;

    background:
        var(--v5-primary);

    box-shadow: none;

    color: white;

}


.v5-page .btn.primary:hover {

    background:
        var(--v5-primary-dark);

}


.v5-page .btn.ghost {

    border:
        1px solid
        var(--v5-border-strong);

    background: white;

    color:
        #5f6b80;

}


.v5-page .btn.danger {

    border:
        1px solid
        #ffd3d7;

    background:
        var(--v5-red-soft);

    color:
        var(--v5-red);

}


/* ====================================================
   FORMS
==================================================== */

.v5-page .form-panel {

    padding: 24px;

}


.v5-page .field {

    gap: 6px;

}


.v5-page .field label {

    color:
        #667286;

    font-size: 11px;
    font-weight: 650;

}


.v5-page input,
.v5-page select,
.v5-page textarea {

    min-height: 41px;

    padding:
        9px
        11px;

    border:
        1px solid
        var(--v5-border-strong);

    border-radius: 10px;

    color:
        var(--v5-text);

}


.v5-page input:focus,
.v5-page select:focus,
.v5-page textarea:focus {

    border-color:
        #8cbcff;

    box-shadow:
        0 0 0 3px
        rgba(45,126,234,.10);

}


.v5-page .info-box {

    padding: 13px;

    border:
        1px solid
        #d9e7f8;

    border-radius: 12px;

    background:
        var(--v5-primary-soft);

}


/* ====================================================
   STATUS
==================================================== */

.v5-page .status {

    padding:
        5px
        8px;

    border-radius:
        999px;

    font-size: 10px;

}


.v5-page .status-richiesto,
.v5-page .status-da-confermare {

    background:
        var(--v5-amber-soft);

    color:
        #a66f0b;

}


.v5-page .status-confermato {

    background:
        var(--v5-green-soft);

    color:
        var(--v5-green);

}


.v5-page .status-annullato {

    background:
        var(--v5-red-soft);

    color:
        var(--v5-red);

}


/* ====================================================
   DETAILS
==================================================== */

.v5-page .company-badge {

    border-radius: 15px;

    background:
        var(--v5-primary-soft);

    color:
        var(--v5-primary);

}


.v5-page .detail-list div {

    border-bottom:
        1px solid
        #edf1f5;

}


/* ====================================================
   ACTIVITY
==================================================== */

.v5-page .activity-row {

    border-bottom:
        1px solid
        #edf1f5;

}


.v5-page .activity-icon {

    border-radius: 10px;

}


/* ====================================================
   NOTIFICATIONS
==================================================== */

.v5-page .notification-row {

    border-bottom:
        1px solid
        #edf1f5;

}


.v5-page .notification-dot {

    border-radius: 11px;

}


/* ====================================================
   CALENDAR

   Non cambiamo geometria e logica del calendario.
   Modifichiamo soltanto l'aspetto esterno.
==================================================== */

.v5-page .calendar-panel {

    padding: 18px;

}


.v5-page .calendar-grid {

    overflow: hidden;

    border-color:
        var(--v5-border);

    border-radius:
        15px;

}


.v5-page .calendar-weekday {

    background:
        #f7f9fc;

    color:
        #738095;

}


.v5-page .calendar-cell {

    border-color:
        #edf1f5;

}


.v5-page .calendar-cell.is-today {

    box-shadow:
        inset 0 0 0 2px
        rgba(45,126,234,.28);

}


.v5-page .segmented {

    border-radius: 10px;

}


.v5-page .segmented a.active {

    background:
        var(--v5-primary);

}


/* ====================================================
   CLIENT AREA
==================================================== */

.client-body .v5-page {

    max-width:
        1250px;

}


/* ====================================================
   FLASH
==================================================== */

.flash {

    border-radius: 12px;

}


.flash.success {

    background:
        var(--v5-green-soft);

    color:
        #24497b;

}


.flash.danger {

    background:
        var(--v5-red-soft);

    color:
        #a13c43;

}


/* ====================================================
   LOGIN / REGISTER

   I template originali rimangono invariati.
==================================================== */

.auth-body {

    background:
        #f4f7fb;

}


.auth-body .login-page {

    grid-template-columns:
        minmax(0,1.2fr)
        minmax(400px,.8fr);

}


.auth-body .login-visual {

    background:
        linear-gradient(
            135deg,
            #ddecff,
            #edf5ff 44%,
            #d3e8ff
        );

}


.auth-body .login-visual:before {

    background:
        radial-gradient(
            circle at 20% 25%,
            rgba(255,255,255,.45),
            transparent 25%
        );

}


.auth-body .eco-rings {

    border-color:
        rgba(255,255,255,.18);

    box-shadow:
        0 0 0 70px rgba(45,126,234,.08),
        0 0 0 140px rgba(255,255,255,.10);

}


.auth-body .login-visual-copy span {

    color:
        #6e8db7;

}


.auth-body .login-visual-copy h2 {

    color:
        var(--v5-text);

    font-size:
        clamp(38px,4vw,58px);

    letter-spacing:
        -.045em;

    text-shadow: none;

}


.auth-body .login-panel {

    background: white;

}


.auth-body .login-box {

    width:
        min(400px,78%);

}


.auth-body .login-logo {

    width: 145px;
    height: auto;

    margin-bottom:
        28px;

}


.auth-body .login-box h1 {

    font-size: 30px;

    letter-spacing:
        -.035em;

}


.auth-body .login-box > p {

    color:
        var(--v5-muted);

}


.auth-body .login-box input {

    min-height: 43px;

    border:
        1px solid
        var(--v5-border-strong);

    border-radius: 10px;

}


.auth-body .login-box .btn.primary {

    border-radius: 10px;

    background:
        var(--v5-primary);

    box-shadow: none;

}


/* ====================================================
   OLD FLOATING BUTTON
==================================================== */

.back-to-gestionale {

    display:
        none !important;

}


/* ====================================================
   MOBILE
==================================================== */

@media(max-width:1050px) {

    .sidebar.v5-sidebar {

        width: 205px;

    }

    .app-main.v5-main {

        width:
            calc(100% - 205px);

        margin-left:
            205px;

    }

    .v5-page .dashboard-grid,
    .v5-page .two-col,
    .v5-page .detail-layout {

        grid-template-columns:
            1fr;

    }

}


@media(max-width:760px) {

    .v5-global {

        height: 62px;

        padding:
            0 12px;

    }

    .v5-mobile-menu {

        display: block;

    }

    .v5-logo {

        width: 62px;

        margin-right: 4px;

    }

    .v5-logo img {

        max-width: 56px;

    }

    .v5-global-nav {

        overflow-x: auto;

    }

    .v5-global-nav a {

        padding:
            8px
            9px;

        white-space: nowrap;

        font-size: 12px;

    }

    .v5-user-copy {

        display: none;

    }

    .v5-client-area {

        font-size: 12px;

    }

    .v5-shell {

        padding-top:
            62px;

    }

    .sidebar.v5-sidebar {

        top: 62px;

        width: 225px;

        transform:
            translateX(-100%);

        transition:
            transform .2s ease;

        z-index: 900;

    }

    .menu-open
    .sidebar.v5-sidebar {

        transform:
            translateX(0);

    }

    .app-main.v5-main {

        width: 100%;

        margin-left: 0;

    }

    .page.v5-page {

        padding:
            24px
            14px
            55px;

    }

    .v5-page .stats-grid {

        grid-template-columns:
            repeat(2,minmax(0,1fr));

    }

    .auth-body .login-page {

        grid-template-columns:
            1fr;

    }

    .auth-body .login-visual {

        display: none;

    }

}


@media(max-width:480px) {

    .v5-page .stats-grid {

        grid-template-columns:
            1fr;

    }

}