﻿/*#region [pneus3000 - stile comune del gestionale]*/
/* ------------------------------------------------------------------------------------------
   Foglio di stile comune (livello 1): solo regole estetiche e responsive.
   Richiamato dopo i fogli del tema in MasterPage.master e login.aspx.
   Nessuna regola cambia il comportamento delle pagine: stesse classi Bootstrap 3 / tema.
   Le griglie (elenchi) restano da rivedere in un intervento successivo.
   ------------------------------------------------------------------------------------------ */

/*#region [caratteri (file locali in /assets/fonts, licenza SIL OFL): woff2 e, se il server non lo serve, woff]*/
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 500; font-display: swap; src: url('../../../assets/fonts/barlow/barlow-latin-500-normal.woff2') format('woff2'), url('../../../assets/fonts/barlow/barlow-latin-500-normal.woff') format('woff'); }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 600; font-display: swap; src: url('../../../assets/fonts/barlow/barlow-latin-600-normal.woff2') format('woff2'), url('../../../assets/fonts/barlow/barlow-latin-600-normal.woff') format('woff'); }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 700; font-display: swap; src: url('../../../assets/fonts/barlow/barlow-latin-700-normal.woff2') format('woff2'), url('../../../assets/fonts/barlow/barlow-latin-700-normal.woff') format('woff'); }
@font-face { font-family: 'Source Sans 3'; font-style: normal; font-weight: 400; font-display: swap; src: url('../../../assets/fonts/source-sans-3/source-sans-3-latin-400-normal.woff2') format('woff2'), url('../../../assets/fonts/source-sans-3/source-sans-3-latin-400-normal.woff') format('woff'); }
@font-face { font-family: 'Source Sans 3'; font-style: normal; font-weight: 600; font-display: swap; src: url('../../../assets/fonts/source-sans-3/source-sans-3-latin-600-normal.woff2') format('woff2'), url('../../../assets/fonts/source-sans-3/source-sans-3-latin-600-normal.woff') format('woff'); }
@font-face { font-family: 'Source Sans 3'; font-style: normal; font-weight: 700; font-display: swap; src: url('../../../assets/fonts/source-sans-3/source-sans-3-latin-700-normal.woff2') format('woff2'), url('../../../assets/fonts/source-sans-3/source-sans-3-latin-700-normal.woff') format('woff'); }
/*#endregion [/caratteri]*/

/*#region [variabili (tavolozza dal logo Pneus3000)]*/
:root {
    --p3-rosso: #CE000C;          /* [rosso del logo: azioni principali, menu attivo /] */
    --p3-rosso-scuro: #A8000A;    /* [hover / premuto /] */
    --p3-rosso-tenue: #FDEBEC;
    --p3-elimina: #8E0A0F;        /* [conferma di cancellazione /] */
    --p3-nero: #16181B;           /* [nero gomma: menu /] */
    --p3-nero-2: #2A2D33;
    --p3-testo: #1B1D21;
    --p3-testo-2: #5E636B;
    --p3-bordo: #D5D7DB;
    --p3-bordo-campo: #BFC2C7;
    --p3-fondo: #F2F3F5;
    --p3-fondo-2: #F6F7F8;
    --p3-bianco: #FFFFFF;
    --p3-ok: #1F7A4D;
    --p3-ok-tenue: #E6F4EC;
    --p3-attenzione: #8A5200;
    --p3-attenzione-tenue: #FFF3DC;
    --p3-errore: #B42318;
    --p3-errore-tenue: #FDECEA;
    --p3-info: #34506B;
    --p3-info-tenue: #E8EDF3;
    --p3-font: 'Source Sans 3', 'Segoe UI', Tahoma, sans-serif;
    --p3-font-titoli: 'Barlow', 'Segoe UI', Tahoma, sans-serif;
    --p3-raggio: 8px;
    --p3-raggio-scheda: 12px;
    --p3-h-campo: 40px;
}
@media (max-width: 991px) {
    :root { --p3-h-campo: 44px; } /* [su telefono e tablet campi e pulsanti alti 44 px /] */
}
/*#endregion [/variabili]*/

/*#region [base]*/
body { font-family: var(--p3-font); font-size: 15px; color: var(--p3-testo); background: var(--p3-nero); }
h1, h2, h3, h4, .page-title h3, .x_title h2 { font-family: var(--p3-font-titoli); color: var(--p3-testo); }
a { color: var(--p3-rosso); }
a:hover, a:focus { color: var(--p3-rosso-scuro); }
.right_col { background: var(--p3-fondo) !important; }
.page-title .title_left h3 { font-size: 28px; font-weight: 700; margin: 8px 0 12px; }
/*#endregion [/base]*/

/*#region [menu laterale e barra superiore]*/
.left_col .fa.fa-afterbit {
    margin-right:10px;
}
.left_col, .nav_title, .nav-md .container.body .col-md-3.left_col, .nav-sm .container.body .col-md-3.left_col {
    background: var(--p3-nero);
}
.site_title { font-family: var(--p3-font-titoli); font-weight: 700; font-size: 19px; letter-spacing: .01em; display: flex; align-items: center; height: 57px; line-height: 1.1; white-space: nowrap; }
.site_title > span { display: inline-block; vertical-align: middle; }
.site_title small { display: block; font-family: var(--p3-font); font-weight: 400; font-size: 12px; color: #B9BDC3; letter-spacing: 0; }   /* [seconda riga sotto il nome /] */
.login_content h1 small { font-family: var(--p3-font); font-weight: 400; font-size: 13px; letter-spacing: 0; }
.login_content h1 small { color: var(--p3-testo-2); }
.profile_info span { color: #B9BDC3; }
.profile_info h2 { font-family: var(--p3-font); color: var(--p3-bianco); }
.main_menu .menu_section h3 { color: #8B9097; font-family: var(--p3-font); letter-spacing: .08em; }
.nav.side-menu > li > a, .nav.child_menu > li > a { color: #C7CACF; font-size: 15px; }
.nav.side-menu > li > a:hover, .nav.child_menu > li > a:hover, .nav.child_menu li li a:hover { color: var(--p3-bianco) !important; }
.nav.side-menu > li.active > a { background: var(--p3-nero-2); box-shadow: none; text-shadow: none; }
.nav-md ul.nav.child_menu li:before { background: #4A4E55; }
.nav-md ul.nav.child_menu li:after { border-left-color: #4A4E55; }
.nav.side-menu > li.current-page, .nav.side-menu > li.active { border-right: 5px solid var(--p3-rosso); }
.nav li.current-page { background: rgba(255,255,255,0.06); }
.nav-sm .nav.child_menu li.active, .nav-sm .nav.side-menu li.active-sm { border-right: 5px solid var(--p3-rosso); }   /* [menu ridotto a icone /] */
.nav-sm > .nav.side-menu > li.active-sm > a { color: var(--p3-bianco) !important; }
.green { color: var(--p3-ok); }
.red { color: var(--p3-errore); }
.sidebar-footer { background: var(--p3-nero); }
.sidebar-footer a { background: var(--p3-nero-2); color: #C7CACF; }
.sidebar-footer a:hover { background: #3A3E45; color: var(--p3-bianco); }
.nav_menu { background: var(--p3-bianco); border-bottom: 1px solid var(--p3-bordo); }
.nav.navbar-nav > li > a { color: var(--p3-testo); }
.toggle a { color: var(--p3-testo); }
.toggle a:hover { color: var(--p3-rosso); }
.footer_fixed footer, footer { background: var(--p3-bianco); border-top: 1px solid var(--p3-bordo); color: var(--p3-testo-2); }
/*#endregion [/menu laterale e barra superiore]*/

/*#region [schede (x_panel)]*/
.x_panel { border: 1px solid var(--p3-bordo); border-radius: var(--p3-raggio-scheda); padding: 16px 20px; }
.x_title { border-bottom: 1px solid #E4E6E9; padding: 2px 0 10px; margin-bottom: 16px; }
.x_title h2 { font-size: 20px; font-weight: 600; }
.x_title h2 small { font-family: var(--p3-font); color: var(--p3-testo-2); font-size: 14px; }
.ln_solid { border-top-color: #E4E6E9; }
/*#endregion [/schede]*/

/*#region [campi]*/
.form-control {
    height: var(--p3-h-campo);
    border: 1px solid var(--p3-bordo-campo);
    border-radius: var(--p3-raggio);
    box-shadow: none;
    font-family: var(--p3-font);
    font-size: 16px; /* [16 px: su telefono evita lo zoom automatico durante la digitazione /] */
    color: var(--p3-testo);
}
textarea.form-control { height: auto; min-height: 84px; }
.form-control:focus { border-color: var(--p3-rosso); box-shadow: 0 0 0 3px rgba(206,0,12,0.15); }
.form-control::placeholder { color: #8E9298; }
.form-control[disabled], .form-control[readonly] { background: var(--p3-fondo-2); }
.control-label, .form-group > label, label { color: var(--p3-testo); font-weight: 600; font-size: 14px; }
.form-horizontal .control-label { text-align: left; }
.has-feedback-left { padding-left: 38px; }
.form-control-feedback { margin-top: 8px; line-height: calc(var(--p3-h-campo) - 16px); height: calc(var(--p3-h-campo) - 16px); color: var(--p3-testo-2); } /* [il tema sposta l'icona di 8 px in basso: altezza ridotta di 16 px = icona e separatore centrati nel campo /] */
.form-control-feedback.left { border-right-color: var(--p3-bordo); }
.required { color: var(--p3-errore); }
.formError .formErrorContent { background: var(--p3-errore); border-radius: 6px; font-family: var(--p3-font); font-size: 13px; box-shadow: none; }
.formError .formErrorArrow div { background: var(--p3-errore); }
.input-group-addon { border-color: var(--p3-bordo-campo); background: var(--p3-fondo); }
/* [select2 allineato ai campi] */
.select2-container--default .select2-selection--single, .select2-container--default .select2-selection--multiple {
    min-height: var(--p3-h-campo); border: 1px solid var(--p3-bordo-campo) !important; border-radius: var(--p3-raggio);
}
.select2-container--default .select2-selection--single .select2-selection__rendered { line-height: calc(var(--p3-h-campo) - 2px); padding-left: 12px; color: var(--p3-testo); font-size: 16px; }
.select2-container--default .select2-selection--single .select2-selection__arrow { height: calc(var(--p3-h-campo) - 2px); }
.select2-container--default .select2-results__option--highlighted[aria-selected] { background: var(--p3-rosso); }
.select2-dropdown { border-color: var(--p3-bordo-campo); border-radius: var(--p3-raggio); min-width: min(320px, calc(100vw - 32px)); }
/* [caselle iCheck: tutta la riga comoda da toccare] */
.icheckbox_flat-red, .iradio_flat-red { margin-right: 6px; }
/*#endregion [/campi]*/

/*#region [pulsanti: mappa delle classi esistenti sul nuovo stile]*/
.btn {
    border-radius: var(--p3-raggio);
    font-family: var(--p3-font);
    font-weight: 600;
    font-size: 15px;
    min-height: var(--p3-h-campo);
    padding: 8px 16px;
    box-shadow: none !important;
    text-shadow: none;
}
.btn-xs, .btn-sm { min-height: 0; font-size: 13px; padding: 3px 10px; }
/* [azione principale (Inserisci, Modifica, Filtra, Esegui): rosso pieno] */
.btn-success { background: var(--p3-rosso); border-color: var(--p3-rosso); color: #fff; }
.btn-success:hover, .btn-success:focus, .btn-success:active, .btn-success.active { background: var(--p3-rosso-scuro) !important; border-color: var(--p3-rosso-scuro) !important; color: #fff; }
/* [azione secondaria (Inserisci nuova/nuovo): bordo rosso] */
.btn-dark { background: #fff; border-color: var(--p3-rosso); color: var(--p3-rosso); }
.btn-dark:hover, .btn-dark:focus, .btn-dark:active { background: var(--p3-rosso-tenue) !important; border-color: var(--p3-rosso-scuro) !important; color: var(--p3-rosso-scuro) !important; }
/* [annulla, annulla ricerca, vai: bordo grigio] */
.btn-primary, .btn-warning, .btn-danger, .btn-default, .btn-info { background: #fff; border-color: var(--p3-bordo-campo); color: var(--p3-testo); }
.btn-primary:hover, .btn-warning:hover, .btn-danger:hover, .btn-default:hover, .btn-info:hover,
.btn-primary:focus, .btn-warning:focus, .btn-danger:focus, .btn-default:focus, .btn-info:focus,
.btn-primary:active, .btn-warning:active, .btn-danger:active, .btn-default:active, .btn-info:active { background: var(--p3-fondo) !important; border-color: #8E9298 !important; color: var(--p3-testo) !important; }
.btn:focus-visible { outline: 3px solid rgba(206,0,12,0.35); outline-offset: 2px; }
/*#endregion [/pulsanti]*/

/*#region [etichette, avvisi, paginazione]*/
.label { border-radius: 12px; font-family: var(--p3-font); font-weight: 700; font-size: 12px; padding: .3em .7em; }
.label-success { background: var(--p3-ok-tenue); color: var(--p3-ok); }
.label-warning { background: var(--p3-attenzione-tenue); color: var(--p3-attenzione); }
.label-danger { background: var(--p3-errore-tenue); color: var(--p3-errore); }
.label-info, .label-primary { background: var(--p3-info-tenue); color: var(--p3-info); }
.label-default { background: #EDEEF0; color: #3D4855; }
.alert { border-radius: 10px; border: 0; font-size: 15px; }
.alert-warning { background: var(--p3-attenzione-tenue); color: #6E4100; }
.alert-danger { background: var(--p3-errore-tenue); color: #8E1B12; }
.alert-success { background: var(--p3-ok-tenue); color: #17603C; }
.alert-info { background: var(--p3-info-tenue); color: var(--p3-info); }
.pagination > li > a, .pagination > li > span { color: var(--p3-testo); border-color: var(--p3-bordo); }
.pagination > .active > a, .pagination > .active > span, .pagination > li > a.current { background: var(--p3-rosso) !important; border-color: var(--p3-rosso) !important; color: #fff !important; }
/*#endregion [/etichette, avvisi, paginazione]*/

/*#region [messaggi SweetAlert2 e PNotify]*/
.swal2-popup { font-family: var(--p3-font); border-radius: var(--p3-raggio-scheda); }
.swal2-popup .swal2-title { font-family: var(--p3-font-titoli); color: var(--p3-testo); }
.swal2-popup .swal2-html-container, .swal2-popup .swal2-content { color: var(--p3-testo); }
.swal2-popup .swal2-actions .btn { margin: 0 5px; }
.swal2-popup .btn-danger { background: var(--p3-elimina); border-color: var(--p3-elimina); color: #fff; } /* [conferma "Sì, elimina": resta ben visibile /] */
.swal2-popup .btn-danger:hover, .swal2-popup .btn-danger:focus { background: #6E070B !important; border-color: #6E070B !important; color: #fff !important; }
.swal2-styled.swal2-confirm { background-color: var(--p3-rosso) !important; border-radius: var(--p3-raggio) !important; }
.swal2-popup.swal2-toast { border-radius: 10px; box-shadow: 0 8px 24px rgba(22,24,27,0.18); }
.swal2-icon.swal2-success [class^=swal2-success-line] { background-color: var(--p3-ok); }
.swal2-icon.swal2-success .swal2-success-ring { border-color: rgba(31,122,77,0.3); }
.swal2-timer-progress-bar { background: rgba(206,0,12,0.35); }
.ui-pnotify .alert { font-family: var(--p3-font); }
/*#endregion [/messaggi]*/

/*#region [blocchi riutilizzabili (stile 2.0): filtri, schede a sezioni, griglie, riepilogo, barra azioni]*/
/* [filtri richiudibili: testata cliccabile + corpo; aperto/chiuso lo decide il JS della pagina] */
.p3-filtri { background: var(--p3-bianco); border: 1px solid var(--p3-bordo); border-radius: var(--p3-raggio-scheda); margin-bottom: 16px; }
.p3-filtri-testata { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 48px; padding: 10px 16px; background: none; border: 0; text-align: left;
                     font-family: var(--p3-font-titoli); font-weight: 600; font-size: 17px; color: var(--p3-testo); cursor: pointer; }
.p3-filtri-testata:focus-visible { outline: 3px solid rgba(206,0,12,0.35); outline-offset: -3px; border-radius: var(--p3-raggio-scheda); }
.p3-filtri-conta { background: var(--p3-rosso); color: #fff; border-radius: 12px; font-family: var(--p3-font); font-size: 12px; font-weight: 700; padding: 1px 8px; }
.p3-filtri-freccia { margin-left: auto; color: var(--p3-testo-2); transition: transform .2s; }
.p3-filtri.p3-chiuso .p3-filtri-freccia { transform: rotate(-90deg); }
.p3-filtri.p3-chiuso .p3-filtri-corpo { display: none; }
.p3-filtri-corpo { padding: 0 16px 16px; }
.p3-filtri-azioni { display: flex; justify-content: flex-end; gap: 8px; margin-top: 12px; }
.p3-filtri-azioni .btn { margin: 0; }

/* [ricerca libera (Vetture, Clienti): campo con lente, filtri facoltativi, Cerca / Annulla ricerca] */
.p3-ricerca { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; background: var(--p3-bianco); border: 1px solid var(--p3-bordo);
              border-radius: var(--p3-raggio-scheda); padding: 12px 16px; margin-bottom: 16px; }
.p3-ricerca-campo { position: relative; flex: 1 1 280px; min-width: 0; }
.p3-ricerca-campo .fa { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); color: var(--p3-testo-2); pointer-events: none; }
.p3-ricerca-campo .form-control { padding-left: 38px; width: 100%; }
.p3-ricerca-filtro { flex: 0 1 240px; min-width: 0; }
.p3-ricerca-filtro .form-control { width: 100%; }
.p3-ricerca-azioni { display: flex; gap: 8px; }
.p3-ricerca-azioni .btn { margin: 0; }

/* [griglie di campi: N colonne uguali su desktop, meno colonne su telefono] */
.p3-griglia { display: grid; gap: 14px 16px; margin-bottom: 14px; align-items: end; }   /* [campi allineati in basso anche se un'etichetta va a capo] */
.p3-griglia-1 { grid-template-columns: minmax(0, 1fr); }
.p3-griglia-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.p3-griglia-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.p3-griglia-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.p3-griglia-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.p3-griglia-filtri { grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); margin-bottom: 0; }
.p3-griglia-pneumatici { grid-template-columns: minmax(0, 2fr) repeat(4, minmax(0, 1fr)); }  /* [misura larga + prezzo, stato, stagione, cerchi] */
.p3-griglia-altro { grid-template-columns: minmax(0, 3fr) minmax(0, 1fr); }                  /* [descrizione larga + prezzo] */
.p3-campo-largo { grid-column: 1 / -1; }
.p3-griglia.p3-griglia-inizio { align-items: start; }                                    /* [campi allineati in alto (es. un campo ha una nota sotto)] */
.p3-campo > .p3-spunta + small { display: block; margin-top: 2px; }                        /* [nota sotto la casella di spunta] */
.p3-griglia-foto { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); }                    /* [foto + note] */

/* [foto con caricamento (blocco .singleImage agganciato da afterbit.js: non cambiare i livelli interni)] */
.p3-foto  { display: flex; align-items: flex-start; gap: 12px; }
.p3-foto .uploadComponent  { border: 1px solid var(--p3-bordo); border-radius: var(--p3-raggio); cursor: pointer; }
.p3-foto-immagine  { position: relative; }
/* [attesa del caricamento: sopra la foto invece che sotto (la rende visibile afterbit.js)] */
.p3-foto .pleaseWait_img  { position: absolute; top: 0; left: 0; }
.p3-foto .btn-app  { margin: 0; }

/* [campo con unita' di misura dentro il riquadro (es. %)] */
.p3-con-unita { position: relative; }
.p3-con-unita .form-control { padding-right: 36px; }
.p3-unita { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); color: var(--p3-testo-2); font-weight: 700; pointer-events: none; }

/* [tessere con casella di spunta (evidenziate dal JS con p3-tessera-attiva: afterbit_tessereEvidenzia)] */
.p3-tessere { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
.p3-tessera { display: flex; flex-direction: column; gap: 6px; min-height: 52px; padding: 8px 12px 10px; border: 1px solid var(--p3-bordo); border-radius: var(--p3-raggio);
              background: var(--p3-bianco); transition: border-color .15s, background-color .15s; }
.p3-tessera .p3-spunta { min-height: 32px; font-weight: 600 !important; }
.p3-tessera-nota { color: var(--p3-testo-2); font-size: 13px; }
.p3-tessera.p3-tessera-attiva { border-color: var(--p3-rosso); background: var(--p3-rosso-tenue); box-shadow: inset 3px 0 0 var(--p3-rosso); }

/* [campo: etichetta sempre sopra; i campi occupano tutta la cella (anche con classi col-* ereditate)] */
.p3-campo { min-width: 0; margin-bottom: 14px; }
.p3-griglia > .p3-campo { margin-bottom: 0; }
.p3-campo > label { display: block; margin-bottom: 6px; }
.p3-campo .form-control { width: 100%; float: none; }
.p3-campo .easy-autocomplete { width: 100% !important; }                                   /* [il plugin fissa la larghezza in px all'avvio /] */
.p3-campo .select2-container { width: 100% !important; }
/* [campo con azione accanto (es. tendina + "Inserisci nuova")] */
.p3-campo-azione { display: flex; align-items: center; gap: 8px; }
.p3-campo-azione > .select2-container, .p3-campo-azione > .form-control { flex: 1 1 auto; min-width: 0; }
.p3-campo-azione > .btn { flex: 0 0 auto; margin: 0 !important; }
/* [casella di spunta con testo: riga intera comoda da toccare] */
.p3-spunta small { margin-left: 6px; }
.p3-spunta { display: inline-flex !important; align-items: center; min-height: var(--p3-h-campo); margin: 0; font-weight: 400 !important; font-size: 15px !important; cursor: pointer; }

/* [scheda a sezioni con riepilogo: riepilogo a destra da 1200 px, sopra ai campi sotto] */
.p3-scheda { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.p3-scheda-corpo { min-width: 0; }
.p3-scheda.p3-scheda-stretta { max-width: 960px; }                                          /* [schede senza riepilogo (Vetture, Clienti): una colonna] */

/* [campo con icona a sinistra (classi del tema has-feedback / has-feedback-left)] */
.p3-con-icona { position: relative; }
.p3-con-icona .form-control-feedback.left { left: 0; top: 0; width: 38px; }

/* [campo password con pulsante "occhio" a destra (afterbit_occhiPrepara)] */
.p3-con-occhio .form-control { padding-right: 44px; }
.p3-occhio { position: absolute; right: 0; top: 0; z-index: 3; width: 44px; height: var(--p3-h-campo); border: 0; background: none; color: var(--p3-testo-2); cursor: pointer; }
.p3-occhio:hover, .p3-occhio:focus-visible { color: var(--p3-rosso); }

/* [permessi dei gruppi amministratori: tessere con caselle native] */
.p3-permessi { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.p3-permesso { display: flex; align-items: center; gap: 8px; margin: 0; min-height: 30px; font-weight: 400 !important; font-size: 15px !important; cursor: pointer; }
.p3-permesso-voce { font-weight: 700 !important; }
.p3-permesso input[type="checkbox"] { width: 18px; height: 18px; margin: 0; accent-color: var(--p3-rosso); flex: 0 0 auto; }
.p3-permesso .fa { width: 18px; text-align: center; color: var(--p3-testo-2); }
.p3-permessi-sottovoci { border-top: 1px dashed var(--p3-bordo); margin-top: 4px; padding-top: 4px; padding-left: 8px; }
.p3-sezione { border: 1px solid var(--p3-bordo); border-radius: var(--p3-raggio-scheda); padding: 16px 18px 4px; margin-bottom: 16px; background: var(--p3-bianco); }
.p3-sezione-titolo { display: flex; align-items: center; gap: 10px; margin: 0 0 14px; font-size: 18px; font-weight: 600; }
.p3-sezione-num { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 50%;
                  background: var(--p3-nero); color: #fff; font-family: var(--p3-font); font-size: 13px; font-weight: 700; }
.p3-sottotitolo { font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--p3-testo-2); margin: 4px 0 8px; }

/* [riepilogo in sola lettura] */
.p3-riepilogo { background: var(--p3-nero); color: #fff; border-radius: var(--p3-raggio-scheda); padding: 16px 18px; align-self: start; }
.p3-riepilogo-titolo { font-family: var(--p3-font-titoli); font-weight: 600; font-size: 17px; margin-bottom: 10px; }
.p3-riepilogo-dati { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 12px; margin: 0 0 12px; }
.p3-riepilogo-dati dt { font-weight: 400; color: #AEB2B8; font-size: 14px; }
.p3-riepilogo-dati dd { margin: 0; font-weight: 600; overflow-wrap: anywhere; }
.p3-riepilogo-importi { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; border-top: 1px solid var(--p3-nero-2); padding-top: 12px; }
.p3-riepilogo-importi span { display: block; color: #AEB2B8; font-size: 13px; }
.p3-riepilogo-importi b { font-family: var(--p3-font-titoli); font-size: 18px; white-space: nowrap; }
.p3-riepilogo-stato { margin-top: 10px; }
.p3-riepilogo-stato:empty { display: none; }
.p3-riepilogo-nota { display: block; margin-top: 6px; color: #AEB2B8; font-size: 13px; }

/* [barra azioni: fissa in fondo alla finestra mentre si scorre la scheda] */
.p3-barra-azioni { position: sticky; bottom: 0; z-index: 20; display: flex; justify-content: flex-end; gap: 8px;
                   background: rgba(255,255,255,0.96); border-top: 1px solid var(--p3-bordo); padding: 10px 0 12px; margin-top: -4px; }
.p3-barra-azioni .btn { margin: 0; min-width: 120px; }
.x_content.p3-contiene-scheda { overflow: visible; }                                        /* [serve alla barra fissa: niente scorrimento sul contenitore /] */

@media (min-width: 1200px) {
    .p3-scheda:not(.p3-scheda-stretta) { grid-template-columns: minmax(0, 1fr) 300px; column-gap: 20px; }
    .p3-scheda > .p3-riepilogo { grid-column: 2; grid-row: 1; position: sticky; top: 12px; }
    .p3-scheda > .p3-scheda-corpo, .p3-scheda > .p3-barra-azioni { grid-column: 1; }
}
@media (max-width: 991px) {
    .p3-griglia-4, .p3-griglia-5, .p3-griglia-pneumatici { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .p3-griglia-pneumatici > .p3-campo-misura { grid-column: 1 / -1; }
    .p3-sezione { padding: 14px 14px 2px; }
    .p3-solo-desktop { display: none; }
}
@media (max-width: 767px) {
    .p3-griglia-2, .p3-griglia.p3-griglia-telefono-1 { grid-template-columns: minmax(0, 1fr); }      /* [p3-griglia-telefono-1: una colonna sola su telefono] */
    .p3-griglia-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .p3-griglia-altro { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
    .p3-griglia-filtri { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .p3-griglia-foto, .p3-tessere { grid-template-columns: minmax(0, 1fr); }
    .p3-filtri-azioni .btn, .p3-barra-azioni .btn, .p3-ricerca-azioni .btn { flex: 1 1 0; min-width: 0; }
    .p3-ricerca-campo, .p3-ricerca-filtro, .p3-ricerca-azioni { flex: 1 1 100%; }
    .p3-barra-azioni { flex-wrap: wrap; }
    .p3-barra-azioni .btn { flex: 1 0 auto; }                              /* [con tre o piu' pulsanti quelli che non ci stanno vanno sulla riga sotto /] */
    .p3-riepilogo { padding: 12px 14px; }
    .p3-riepilogo-titolo { display: none; }
    .p3-riepilogo-dati { margin-bottom: 8px; }
    .p3-riepilogo-importi b { font-size: 16px; }
}
/*#endregion [/blocchi riutilizzabili]*/

/*#region [finestre modali SweetAlert2 con campi (classe p3-modale sul popup)]*/
/* [struttura: testata (icona + titolo + spiegazione), corpo con p3-griglia/p3-campo, messaggio d'errore, barra pulsanti] */
.swal2-popup.p3-modale { padding: 0; text-align: left; overflow: visible; }                 /* [overflow visibile: i suggerimenti dell'autocompletamento non vengono tagliati /] */
.p3-modale .swal2-header { display: block; padding: 18px 22px 14px; border-bottom: 1px solid #E4E6E9; }
.p3-modale .swal2-title { display: flex !important; align-items: center; gap: 14px; margin: 0; padding: 0; text-align: left; }
.p3-modale-icona { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 42px; height: 42px; border-radius: 50%;
                   background: var(--p3-rosso-tenue); color: var(--p3-rosso); font-size: 19px; }
.p3-modale-titolo { display: block; font-family: var(--p3-font-titoli); font-weight: 700; font-size: 21px; line-height: 1.2; color: var(--p3-testo); }
.p3-modale-sotto { display: block; font-family: var(--p3-font); font-weight: 400; font-size: 14px; line-height: 1.3; color: var(--p3-testo-2); }
.p3-modale .swal2-content { padding: 16px 22px 0; text-align: left; font-size: 15px; }
.p3-modale .swal2-html-container { text-align: left; }
.p3-modale .p3-campo .form-control { height: var(--p3-h-campo); margin: 0; }
.p3-modale-gruppo { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--p3-testo-2); margin: 2px 0 8px; }
.p3-modale-evidenza { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; background: var(--p3-fondo); border-radius: var(--p3-raggio); padding: 10px 14px; margin-bottom: 14px; }
.p3-modale-evidenza b { font-family: var(--p3-font-titoli); font-size: 20px; }
.p3-modale .form-control.p3-campo-errato { border-color: var(--p3-errore); box-shadow: 0 0 0 3px rgba(180,35,24,0.15); }
/* [messaggio d'errore (Swal.showValidationMessage)] */
.p3-modale .swal2-validation-message { justify-content: flex-start; margin: 0 22px 12px; padding: 8px 12px; border-radius: var(--p3-raggio);
                                       background: var(--p3-errore-tenue); color: #8E1B12; font-size: 14px; font-weight: 400; }
.p3-modale .swal2-validation-message::before { background-color: var(--p3-errore); }
/* [barra pulsanti: Annulla a sinistra, azione principale a destra (reverseButtons)] */
.p3-modale .swal2-actions { justify-content: flex-end; gap: 8px; margin: 0; padding: 12px 22px 18px; border-top: 1px solid #E4E6E9;
                            background: #FAFAFB; border-radius: 0 0 var(--p3-raggio-scheda) var(--p3-raggio-scheda); }
.p3-modale .swal2-actions .btn { margin: 0; min-width: 120px; }
.p3-modale .swal2-loader { margin: 0 8px; border-color: var(--p3-rosso) transparent var(--p3-rosso) transparent; }
/* [targa: aspetto da targa, sempre maiuscola] */
.form-control.p3-targa, .p3-campo-targa .form-control { font-family: var(--p3-font-titoli); font-weight: 700; font-size: 18px; letter-spacing: .12em; text-transform: uppercase; border-left: 18px solid #1F4FA3; }
.form-control.p3-targa::placeholder, .p3-campo-targa .form-control::placeholder { font-family: var(--p3-font); font-weight: 400; font-size: 16px; letter-spacing: normal; text-transform: none; }
@media (max-width: 575px) {
    .p3-modale .swal2-header { padding: 14px 16px 12px; }
    .p3-modale .swal2-content { padding: 14px 16px 0; }
    .p3-modale .swal2-validation-message { margin: 0 16px 12px; }
    .p3-modale .swal2-actions { padding: 12px 16px 16px; }
    .p3-modale .swal2-actions .btn { flex: 1 1 0; min-width: 0; }
    .p3-modale .p3-griglia-2 { grid-template-columns: minmax(0, 1fr); }
}
.p3-griglia-indirizzo { grid-template-columns: minmax(0, 2fr) minmax(70px, .6fr) minmax(90px, .8fr); }  /* [citta' + provincia + CAP] */
@media (max-width: 575px) {
    .p3-griglia-indirizzo { grid-template-columns: minmax(0, 1fr) 90px; }
    .p3-griglia-indirizzo > .p3-campo:first-child { grid-column: 1 / -1; }
}
/*#endregion [/finestre modali]*/

/*#region [attesa durante i postback asincroni (components/updateProgress.ascx)]*/
/* [velo sulla pagina: compare subito (trasparente) e blocca i clic finche' l'operazione non termina;
    la scheda appare dopo 0,2 s cosi' le operazioni rapide non lampeggiano] */
.p3-attesa { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 3000; display: flex; align-items: center; justify-content: center; padding: 16px;
             background: rgba(22,24,27,0.35); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); animation: p3-comparsa .15s ease-out .2s both; }
.p3-attesa-box { display: flex; align-items: center; gap: 16px; min-width: 240px; padding: 18px 24px 18px 18px; background: var(--p3-bianco);
                 border-top: 3px solid var(--p3-rosso); border-radius: var(--p3-raggio-scheda); box-shadow: 0 12px 32px rgba(22,24,27,0.25); animation: p3-comparsa .15s ease-out .2s both; }
/* [la "ruota": spalla grigia, tratto rosso che gira, battistrada tratteggiato] */
.p3-attesa-ruota { position: relative; flex: 0 0 auto; width: 44px; height: 44px; box-sizing: border-box; border-radius: 50%;
                   border: 6px solid #E4E6E9; border-top-color: var(--p3-rosso); animation: p3-giro .8s linear infinite; }
.p3-attesa-ruota:after { content: ""; position: absolute; top: 7px; right: 7px; bottom: 7px; left: 7px; border-radius: 50%; border: 2px dashed var(--p3-bordo-campo); }
.p3-attesa-testo { font-family: var(--p3-font-titoli); font-weight: 600; font-size: 18px; color: var(--p3-testo); }
.p3-attesa-sotto { font-size: 14px; color: var(--p3-testo-2); }
@keyframes p3-giro { to { transform: rotate(360deg); } }
@keyframes p3-comparsa { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
    .p3-attesa-ruota { animation-duration: 2.4s; }
    .p3-attesa { animation: none; }
}
/*#endregion [/attesa]*/

/*#region [griglie DataTables + Responsive]*/
table.p3-griglia-dt { width: 100% !important; margin: 0 !important; border-left: 0 !important; border-right: 0 !important; }   /* [bordi laterali: Responsive non li conta nel calcolo delle colonne] */
table.p3-griglia-dt > thead > tr > th, table.p3-griglia-dt > tbody > tr > td { padding: 8px 6px; }   /* [celle un po' piu' compatte: piu' colonne visibili prima di finire nel "+"] */
/* [il tema nasconde i titoli quando si selezionano righe (Bulk Actions): con DataTables restano visibili] */
table.p3-griglia-dt > thead > tr > th.column-title:not(.dtr-hidden) { display: table-cell !important; }
/* [colonna di controllo: stretta, icona "+" / "-" nei colori del gestionale] */
table.p3-griglia-dt > thead > tr > th.p3-dtr, table.p3-griglia-dt > tbody > tr > td.p3-dtr { width: 26px; min-width: 26px; max-width: 26px; padding-left: 4px !important; padding-right: 4px !important; box-sizing: border-box; }
table.p3-griglia-dt { --dtr-control-triangle_color: var(--p3-rosso); --dtr-control-triangle_size: 6px; }
table.p3-griglia-dt > tbody > tr > td.dtr-control { cursor: pointer; text-align: center; }
/* [riga dettagli (colonne nascoste)] */
table.p3-griglia-dt > tbody > tr.child > td.child { background: var(--p3-fondo-2); padding: 8px 12px; }
table.p3-griglia-dt > tbody > tr.child ul.dtr-details { display: block !important; width: 100%; padding: 0; margin: 0; }
table.p3-griglia-dt > tbody > tr.child ul.dtr-details > li { display: flex !important; text-align: left !important; align-items: baseline; gap: 12px; padding: 6px 0 !important; border-bottom: 1px solid var(--p3-bordo); }
table.p3-griglia-dt > tbody > tr.child ul.dtr-details > li:last-child { border-bottom: 0; }
table.p3-griglia-dt > tbody > tr.child ul.dtr-details > li.p3-vuoto { display: none !important; }   /* [colonne senza valore (es. servizi non fatti): non si elencano] */
table.p3-griglia-dt > tbody > tr.child span.dtr-title { display: inline-block !important; flex: 0 0 110px; min-width: 0 !important; font-weight: 600; color: var(--p3-testo-2); }
table.p3-griglia-dt > tbody > tr.child span.dtr-data { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
/* [DataTables (stile Bootstrap 3) mette la tabella in una colonna con 15 px di rientro per lato: Responsive pero' calcola
    lo spazio sul contenitore intero, quindi il rientro va tolto, altrimenti la tabella sborda e compare la barra di scorrimento] */
div.dt-container { width: 100%; }
div.dt-container .dt-layout-row { margin-left: 0 !important; margin-right: 0 !important; }
div.dt-container .dt-layout-cell { padding-left: 0 !important; padding-right: 0 !important; }
/* [griglie lato server: righe per pagina, conteggio e pagine] */
div.dt-container .dt-length select { display: inline-block; width: auto; margin: 0 6px; height: 36px; }
div.dt-container .dt-info { padding-top: 10px; color: var(--p3-testo-2); }
div.dt-container .dt-paging .pagination { margin: 6px 0; }
div.dt-container div.dt-processing { background: rgba(255,255,255,0.9); border: 1px solid var(--p3-bordo); border-radius: var(--p3-raggio); box-shadow: 0 6px 18px rgba(22,24,27,0.12); }
@media (max-width: 767px) {
    div.dt-container .dt-layout-row { flex-wrap: wrap; }
    div.dt-container .dt-paging, div.dt-container .dt-info, div.dt-container .dt-length { text-align: center; width: 100%; }
}
/*#endregion [/griglie DataTables]*/

/*#region [telefono e tablet (< 992 px)]*/
@media (max-width: 991px) {
    body { overflow-x: hidden; background: var(--p3-fondo); }         /* [fondo chiaro: su telefono il menu e' a scomparsa (ha il suo fondo scuro) /] */                                         /* [niente scorrimento orizzontale: solo su body, che lo passa alla finestra (su html+body taglierebbe i contenuti assoluti, es. login) /] */
    .top_nav:after { content: ""; display: table; clear: both; }        /* [la barra superiore contiene il suo menu flottante: il titolo non le finisce sotto /] */
    .nav_menu { margin-bottom: 0; }
    /* [il tema fa flottare tutte le colonne a ogni larghezza: le colonne "solo desktop" vanno a tutta riga, come in Bootstrap standard] */
    .right_col [class*="col-md-"]:not([class*="col-sm-"]):not([class*="col-xs-"]),
    .right_col [class*="col-lg-"]:not([class*="col-sm-"]):not([class*="col-xs-"]) { width: 100%; }
    .nav-md .container.body .right_col, .right_col { padding: 8px 10px 0 !important; min-width: 0; }
    .x_panel { padding: 12px 14px; }
    .page-title .title_left, .page-title .title_right { width: 100%; float: none; }
    .page-title .title_right .pull-right { float: none !important; }
    /* [etichetta sopra il campo, colonne a tutta larghezza] */
    .form-horizontal .control-label { text-align: left; padding-top: 0; margin-bottom: 6px; }
    .form-horizontal .form-group { margin-bottom: 14px; }
    .form-group div[class*="col-"] + div[class*="col-"] { margin-top: 8px; }     /* [campi impilati: un po' di respiro /] */
    .select2-container + .btn, .select2-container + input[type="button"], .select2-container + input[type="submit"] { margin-top: 8px; }
    .form-group [class*="col-md-offset"], .form-group [class*="col-sm-offset"] { margin-left: 0; }
    /* [contenuti larghi (tabelle, riepiloghi) scorrono dentro la scheda, non la pagina:
        le colonne flottanti di Bootstrap si allargherebbero seguendo la tabella] */
    .right_col [class*="col-"], .x_panel, .x_content { max-width: 100%; }
    .x_content, .table-responsive { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .form-group .btn { margin-bottom: 8px; }                             /* [pulsanti che vanno a capo: non attaccati /] */
}
@media (max-width: 767px) {
    /* [sotto i 768 px anche le colonne "tablet" vanno a tutta riga] */
    .right_col [class*="col-sm-"]:not([class*="col-xs-"]) { width: 100%; }
}
@media (max-width: 575px) {
    .page-title .title_left h3 { font-size: 24px; }
    .btn { width: auto; }
}
/*#endregion [/telefono e tablet]*/

/*#region [pagina di login]*/
body.login { background: var(--p3-fondo); }
.login_wrapper { max-width: 380px; }
.login_wrapper .login_form { left: 0; right: 0; width: auto; padding: 0 12px; box-sizing: border-box; }
.login_content .btn { font-size: 16px; min-width: 120px; margin: 4px; }
.login_content #login_Button { background: var(--p3-rosso); border-color: var(--p3-rosso); color: #fff !important; }       /* [accesso = azione principale /] */
.login_content #login_Button:hover, .login_content #login_Button:focus { background: var(--p3-rosso-scuro) !important; border-color: var(--p3-rosso-scuro) !important; }
.login_content a.btn-primary { color: var(--p3-testo) !important; }                                                     /* [Torna al sito: il tema lo rendeva bianco su bianco /] */
.login_content { background: var(--p3-bianco); border: 1px solid var(--p3-bordo); border-radius: var(--p3-raggio-scheda); padding: 24px 20px; margin-top: 10%; text-shadow: none; }
.login_content h1 { font-family: var(--p3-font-titoli); font-weight: 700; color: var(--p3-testo); }
.login_content h1:before, .login_content h1:after { background: var(--p3-bordo); }
.login_content form input[type="text"], .login_content form input[type="password"] { height: 44px; border-radius: var(--p3-raggio); font-size: 16px; box-shadow: none; }
/*#endregion [/pagina di login]*/

/*#endregion [/pneus3000]*/

/*#region [documento pronto (afterbit_scarica): finestra SweetAlert2 Apri / Scarica / Chiudi]*/
.swal2-popup.p3-scarica { border-radius: 12px; }
.p3-scarica .swal2-title { font-family: 'Barlow', sans-serif; font-weight: 700; }
.p3-scarica .p3-scarica-testo { margin: 0 0 14px; color: #5E636B; font-size: 15px; }
.p3-scarica .p3-scarica-file { display: flex; align-items: center; gap: 12px; border: 1px solid #D5D7DB; border-radius: 10px; padding: 10px 12px; background: #FAFAFB; text-align: left; }
.p3-scarica .p3-scarica-file i { font-size: 26px; color: #CE000C; flex: 0 0 auto; }
.p3-scarica .p3-scarica-file b { display: block; font-size: 15px; word-break: break-all; color: #1B1D21; }
.p3-scarica .p3-scarica-file small { color: #5E636B; }
.p3-scarica .swal2-actions { gap: 8px; flex-wrap: wrap; }
.p3-scarica .swal2-actions .btn { min-height: 42px; border-radius: 8px; padding: 8px 18px; margin: 0; font-weight: 600; }
.p3-scarica .swal2-actions .btn i { margin-right: 4px; }
@media (max-width: 480px) { .p3-scarica .swal2-actions .btn { flex: 1 1 100%; } }
/*#endregion [/documento pronto]*/

/*#region [griglie: pulsanti di riga (Modifica evidenziato, Elimina discreto) - solo stile, markup invariato]*/
td.column_actions { white-space: nowrap; text-align: right; vertical-align: middle !important; }
td.column_actions a.fa-pencil {
    display: inline-flex; align-items: center; justify-content: center; vertical-align: middle;
    width: 40px; height: 40px; border-radius: var(--p3-raggio);
    background: var(--p3-rosso); color: #fff; font-size: 18px; text-decoration: none;
    box-shadow: 0 2px 6px rgba(206, 0, 12, .25);
}
td.column_actions a.fa-pencil:before { content: "\f044"; } /* [icona "matita su foglio" (fa-pencil-square-o) /] */
td.column_actions a.fa-pencil:hover, td.column_actions a.fa-pencil:focus { background: var(--p3-rosso-scuro); color: #fff; text-decoration: none; }
td.column_actions a.fa-trash-o {
    display: inline-flex; align-items: center; justify-content: center; vertical-align: middle;
    width: 32px; height: 32px; border-radius: var(--p3-raggio); margin-left: 14px;
    color: #9AA0A8; font-size: 16px; text-decoration: none;
}
td.column_actions a.fa-trash-o:hover, td.column_actions a.fa-trash-o:focus { background: var(--p3-rosso-tenue); color: var(--p3-elimina); text-decoration: none; }
td.column_actions a.fa-pencil:focus-visible, td.column_actions a.fa-trash-o:focus-visible { outline: 2px solid var(--p3-testo); outline-offset: 2px; }
/* [per ora nascoste le frecce "sposta sopra/sotto" (Vetture e pagine di configurazione) /] */
td.column_actions .glyphicon-circle-arrow-up, td.column_actions .glyphicon-circle-arrow-down { display: none !important; }
/*#endregion [/griglie: pulsanti di riga]*/
