/* =====================================================================
UI2 — MASTER RULE v2 · REGOLA GRAFICA ASSOLUTA
---------------------------------------------------------------------
Sopra OGNI altra regola (!important). Le funzionalità restano intatte:
qui si tocca SOLO grafica/layout/impaginazione.
ADOZIONE
+ caricare per ULTIMO:
ARCHETIPI (scegli in base al TIPO di pagina):
.arch-form → form a SEZIONI NUMERATE / multi-step (contratto, proposta)
e form a pagina singola (card impilate). Layout 3 colonne
opzionale (nav · form · riepilogo).
.arch-dash → DASHBOARD a colpo d'occhio (home): KPI + colonne di card
con liste, pill, azioni rapide.
.arch-list → LISTE / TABELLE (pratiche, archivio, …).
.arch-tools → STRUMENTI / pagine a ICONE e funzioni (foto AI, PDF, …).
Tutto ciò che è UNIVERSALE (token, campi, bottoni, ricerca, dropzone AI,
anelli) vale su .mrv2 senza archetipo. Gli archetipi aggiungono solo il
LAYOUT/IMPAGINAZIONE specifico del tipo di pagina.
===================================================================== */
/* anello gradiente rotante (firma UI condivisa da tutti gli archetipi) */
@property --mrx{syntax:"";initial-value:0deg;inherits:false}
@keyframes mrxspin{to{--mrx:360deg}}
/* CHECKBOX: native con accent-color (repaint istantaneo, no glitch appearance:none+bg-image
di Bootstrap per cui la spunta compariva solo dopo il blur). Escl. switch. */
.mrv2 input[type="checkbox"]:not([role="switch"]):not(.form-switch .form-check-input),
.mrv2 .form-check-input[type="checkbox"]:not([role="switch"]){
appearance:auto !important;-webkit-appearance:checkbox !important;
accent-color:#4f46e5 !important;background:none !important;background-image:none !important;
border:0 !important;border-radius:0 !important;box-shadow:none !important;
width:1rem;height:1rem;min-width:1rem;cursor:pointer;flex-shrink:0}
/* =====================================================================
0. TOKEN
===================================================================== */
body.mrv2{
--mr-bg:#eaf1ff;
--mr-card:#ffffff; --mr-card-bd:#dfe3ef;
--mr-grey:#e9ecf4; --mr-grey-bd:#d9dde9;
--mr-field:#ffffff; --mr-field-bd:#d4d8ea;
--mr-line:#e4e8f0; --mr-panel2:#f4f6fc;
--mr-grad:linear-gradient(135deg,#4f46e5,#06b6d4);
--mr-blue:#4f46e5; --mr-cyan:#06b6d4;
--mr-acc:#4f46e5; --mr-acc-soft:#eef0ff; --mr-acc-ink:#1d2a8a;
--mr-ink:#1a2233; --mr-ink2:#2a3142; --mr-mut:#6b7587; --mr-mut2:#9aa3b2;
--mr-divider:#1e3a8a;
--mr-ai:#ea7317; --mr-ai-dark:#c75f0f; --mr-ai-cream:#fff7ef; --mr-ai-bd:#f0a868; --mr-ai-ink:#c2691f;
--mr-search:#fffad6; --mr-search-bd:#ecd25e; --mr-search-ink:#5c4a08;
--mr-ok:#16a34a; --mr-ok-soft:#dcfce7; --mr-warn:#d97706; --mr-warn-soft:#fef3c7;
--mr-danger:#dc2626; --mr-danger-soft:#fee2e2; --mr-viol-soft:#ede9fe;
--mr-r-card:13px; --mr-r-box:10px; --mr-r-field:9px; --mr-r-btn:10px;
--mr-shadow:0 1px 2px rgba(16,24,40,.05),0 10px 24px rgba(31,28,70,.08);
--mr-ring:0 0 0 3px rgba(79,70,229,.14);
--mr-fz:14px; --mr-fz-field:13.5px; --mr-fz-label:12.5px;
/* Sfondo pagina MR = gradiente glass blu, reso FISSO da body.mrv2::before (scorre solo il contenuto) */
--mr-bg-grad: linear-gradient(90deg, #c2e0fc 0%, #a2cef9 40%, #86bef6 75%, #6fb0f2 100%);
}
/* =====================================================================
1. PAGINA + TIPOGRAFIA (universale)
===================================================================== */
body.mrv2::before{content:'';position:fixed;inset:0;z-index:-1;background:var(--mr-bg-grad,var(--mr-bg));will-change:transform;pointer-events:none}
body.mrv2{background:transparent !important;font-family:'Inter',system-ui,-apple-system,Segoe UI,sans-serif;color:var(--mr-ink)}
.mrv2 .text-muted{color:var(--mr-mut) !important}
/* intestazione pagina (pagehead) — comune a tutti gli archetipi */
.mrv2 .pagehead h1{font-size:21px;font-weight:800;color:var(--mr-ink)}
.mrv2 .pagehead .sub{font-size:14.5px;color:var(--mr-mut)}
.mrv2 .pagehead .ico,.mrv2 .pagehead .ic{background:var(--mr-grad) !important;color:#fff !important}
/* =====================================================================
2. CAMPI FORM (universale)
===================================================================== */
.mrv2 input[type=text],.mrv2 input[type=email],.mrv2 input[type=number],.mrv2 input[type=date],
.mrv2 input[type=tel],.mrv2 input[type=password],.mrv2 input[type=time],.mrv2 select,.mrv2 textarea,
.mrv2 .form-control,.mrv2 .form-select,.mrv2 .ctl{
background:var(--mr-field) !important;border:1px solid var(--mr-field-bd) !important;
border-radius:var(--mr-r-field) !important;font-size:var(--mr-fz-field) !important;color:var(--mr-ink) !important}
.mrv2 input:hover,.mrv2 select:hover,.mrv2 textarea:hover,.mrv2 .form-control:hover,.mrv2 .form-select:hover{background:#fbfcff !important;border-color:#c3c9da !important}
.mrv2 input:focus,.mrv2 select:focus,.mrv2 textarea:focus,.mrv2 .form-control:focus,.mrv2 .form-select:focus,.mrv2 .ctl:focus{
background:#fff !important;border-color:var(--mr-blue) !important;box-shadow:var(--mr-ring) !important;outline:0}
.mrv2 .form-label,.mrv2 label.form-label,.mrv2 .mr-label{font-size:var(--mr-fz-label) !important;font-weight:600;color:var(--mr-ink2);margin-bottom:3px}
.mrv2 .input-group>.input-group-text{border:1px solid var(--mr-field-bd) !important;border-right:0 !important;background:var(--mr-panel2)}
.mrv2 .input-group>.form-control:not(:first-child){border-left:0 !important}
/* =====================================================================
3. RICERCA = GIALLO (universale)
===================================================================== */
.mrv2 .mr-search input,.mrv2 .cerca-db-wrap input,.mrv2 input[type=search],
.mrv2 input[id^="cerca"],.mrv2 .search-field input,.mrv2 input.mr-search{
background:var(--mr-search) !important;border:1px solid var(--mr-search-bd) !important;color:var(--mr-search-ink) !important}
.mrv2 .mr-search .input-group-text,.mrv2 .cerca-db-wrap .input-group-text{background:var(--mr-search) !important;border-color:var(--mr-search-bd) !important;color:#8a6d12 !important}
.mrv2 .mr-search input:focus,.mrv2 .cerca-db-wrap input:focus,.mrv2 input[type=search]:focus,.mrv2 input[id^="cerca"]:focus{
background:#fffef0 !important;border-color:#dcbb3e !important;box-shadow:0 0 0 3px rgba(236,210,94,.35) !important}
.mrv2 .cerca-db-wrap{background:transparent !important;border:0 !important;padding:0 !important}
.mrv2 .cerca-db-wrap::before{display:none !important}
/* ECCEZIONE: powersearch della topbar NON è giallo */
.mrv2 .topbar input[type=search],.mrv2 #powersearch,.mrv2 .powersearch input{background:#fff !important;border-color:var(--mr-field-bd) !important;color:var(--mr-ink) !important}
/* =====================================================================
4. BOTTONI + ANELLO (universale)
===================================================================== */
.mrv2 .mr-btn,.mrv2 .btn-secondary,.mrv2 .btn-outline-custom,.mrv2 .btn-outline-secondary,.mrv2 .btn-light{
background:#eef0f8 !important;border:1px solid var(--mr-field-bd) !important;color:var(--mr-ink2) !important;font-weight:650 !important;border-radius:var(--mr-r-btn) !important;padding:9px 16px !important;cursor:pointer}
.mrv2 .mr-btn:hover,.mrv2 .btn-secondary:hover,.mrv2 .btn-outline-custom:hover{background:#e2e6f3 !important;border-color:#c3c9da !important;color:var(--mr-ink) !important}
.mrv2 .mr-btn--action,.mrv2 .btn-primary,.mrv2 .btn-accent,.mrv2 .btn-add-persona,.mrv2 .btn-gradient,.mrv2 .btn.prim{
background:var(--mr-grad) !important;border:0 !important;color:#fff !important;font-weight:700 !important;border-radius:var(--mr-r-btn) !important;padding:9px 16px !important;box-shadow:0 4px 12px rgba(79,70,229,.22) !important;cursor:pointer}
.mrv2 .mr-btn--action:hover,.mrv2 .btn-primary:hover,.mrv2 .btn-accent:hover,.mrv2 .btn-add-persona:hover,.mrv2 .btn.prim:hover{filter:brightness(1.06);color:#fff !important}
.mrv2 .mr-btn--ai,.mrv2 .btn-ai,.mrv2 .btn-sm-accent,.mrv2 .btn-extract-ai,.mrv2 #btnExtract{
background:var(--mr-ai) !important;border:1px solid var(--mr-ai) !important;color:#fff !important;font-weight:650 !important;border-radius:var(--mr-r-btn) !important;box-shadow:0 4px 12px rgba(234,115,23,.22) !important;cursor:pointer}
.mrv2 .mr-btn--ai:hover,.mrv2 .btn-ai:hover,.mrv2 .btn-sm-accent:hover,.mrv2 .btn-extract-ai:hover,.mrv2 #btnExtract:hover{
background:var(--mr-ai-dark) !important;border-color:var(--mr-ai-dark) !important;color:#fff !important;box-shadow:0 6px 20px rgba(234,115,23,.5) !important}
.mrv2 .mr-btn--ai:disabled,.mrv2 .btn-ai:disabled,.mrv2 .btn-sm-accent:disabled,.mrv2 .btn-extract-ai:disabled,.mrv2 #btnExtract:disabled{opacity:.78 !important}
/* anello */
.mrv2 .mr-btn,.mrv2 .mr-btn--action,.mrv2 .mr-btn--ai,.mrv2 .btn-primary,.mrv2 .btn-secondary,.mrv2 .btn-accent,
.mrv2 .btn-add-persona,.mrv2 .btn-outline-custom,.mrv2 .btn-ai,.mrv2 .btn-sm-accent,.mrv2 .btn-extract-ai,.mrv2 #btnExtract,.mrv2 .btn.prim{
position:relative;transition:transform .18s ease,filter .18s ease,background .18s ease,border-color .18s ease,color .18s ease,box-shadow .18s ease}
.mrv2 .mr-btn::after,.mrv2 .mr-btn--action::after,.mrv2 .btn-primary::after,.mrv2 .btn-secondary::after,.mrv2 .btn-accent::after,
.mrv2 .btn-add-persona::after,.mrv2 .btn-outline-custom::after,.mrv2 .btn.prim::after{
content:"";position:absolute;inset:0;border-radius:inherit;padding:1.7px;
background:conic-gradient(from var(--mrx),#4f46e5,#06b6d4,#0ea5e9,#22d3ee,#06b6d4,#4f46e5);
-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .25s ease;pointer-events:none;z-index:2}
.mrv2 .mr-btn--ai::after,.mrv2 .btn-ai::after,.mrv2 .btn-sm-accent::after,.mrv2 .btn-extract-ai::after,.mrv2 #btnExtract::after{
content:"";position:absolute;inset:0;border-radius:inherit;padding:3px;
background:conic-gradient(from var(--mrx),#5c1a02,#c2410c,#ff9a4d,#fff7ed,#ff9a4d,#c2410c,#5c1a02);
-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .25s ease;pointer-events:none;z-index:2}
.mrv2 .mr-btn:not(:disabled):hover::after,.mrv2 .mr-btn--action:not(:disabled):hover::after,.mrv2 .btn-primary:not(:disabled):hover::after,
.mrv2 .btn-secondary:not(:disabled):hover::after,.mrv2 .btn-accent:not(:disabled):hover::after,.mrv2 .btn-add-persona:not(:disabled):hover::after,
.mrv2 .btn-outline-custom:not(:disabled):hover::after,.mrv2 .btn.prim:not(:disabled):hover::after{opacity:1;animation:mrxspin 2.4s linear infinite}
.mrv2 .mr-btn--ai:hover::after,.mrv2 .btn-ai:hover::after,.mrv2 .btn-sm-accent:hover::after,.mrv2 .btn-extract-ai:hover::after,.mrv2 #btnExtract:hover::after{opacity:1 !important;animation:mrxspin 2.2s linear infinite}
.mrv2 .mr-btn:not(:disabled):hover,.mrv2 .mr-btn--action:not(:disabled):hover,.mrv2 .btn-primary:not(:disabled):hover,
.mrv2 .btn-accent:not(:disabled):hover,.mrv2 .btn-add-persona:not(:disabled):hover,.mrv2 .btn-outline-custom:not(:disabled):hover,.mrv2 .btn.prim:not(:disabled):hover{transform:translateY(-1px)}
/* =====================================================================
5. UPLOAD / DROPZONE AI (universale, grafica unica)
===================================================================== */
.mrv2 .mr-upload,.mrv2 .upload-sec-box{background:transparent !important;border:0 !important;padding:0 !important;margin:0 0 12px !important}
.mrv2 .mr-upload>.d-flex,.mrv2 .upload-sec-box>.d-flex{gap:10px !important;align-items:stretch !important;flex-wrap:wrap}
.mrv2 .mr-drop,.mrv2 .drop-zone,.mrv2 .dz-mini{
position:relative;border:1.5px dashed var(--mr-ai-bd) !important;background:var(--mr-ai-cream) !important;color:var(--mr-ai-ink) !important;
border-radius:var(--mr-r-box) !important;display:flex !important;flex-direction:column !important;align-items:center !important;justify-content:center !important;
text-align:center !important;gap:.35rem !important;padding:1.35rem 1rem !important;min-height:112px !important;font-size:.85rem !important;font-weight:600 !important;cursor:pointer;flex:1 1 0 !important;min-width:0}
.mrv2 .mr-drop:hover,.mrv2 .mr-drop.drag-over,.mrv2 .drop-zone:hover,.mrv2 .drop-zone.drag-over,.mrv2 .dz-mini:hover,.mrv2 .dz-mini.drag-over{
border-color:var(--mr-ai) !important;background:#feeede !important;color:var(--mr-ai-dark) !important}
.mrv2 .mr-drop i,.mrv2 .drop-zone .dz-icon,.mrv2 .dz-mini>i{color:#e67e22 !important;font-size:1.9rem !important;margin:0 !important;line-height:1}
.mrv2 .mr-upload .mr-btn--ai,.mrv2 .upload-sec-box .btn-sm-accent,.mrv2 .upload-sec-box #btnExtract{flex:0 0 auto !important;align-self:stretch !important;min-height:112px !important;padding-left:18px !important;padding-right:18px !important;border-radius:var(--mr-r-box) !important}
.mrv2 .mr-drop::after,.mrv2 .drop-zone::after,.mrv2 .dz-mini::after{
content:"";position:absolute;inset:0;border-radius:inherit;padding:2.4px;
background:conic-gradient(from var(--mrx),#5c1a02,#c2410c,#ff9a4d,#fff7ed,#ff9a4d,#c2410c,#5c1a02);
-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .25s ease;pointer-events:none;z-index:2}
.mrv2 .mr-drop:hover::after,.mrv2 .mr-drop.drag-over::after,.mrv2 .drop-zone:hover::after,.mrv2 .drop-zone.drag-over::after,.mrv2 .dz-mini:hover::after,.mrv2 .dz-mini.drag-over::after{opacity:1;animation:mrxspin 2.2s linear infinite}
/* =====================================================================
6. DIVISORI · LISTE PIATTE · UTILITY ANELLO (universale)
===================================================================== */
.mrv2 .mr-divider{display:flex;align-items:center;gap:.5rem;margin:.5rem 0;color:var(--mr-divider) !important;font-weight:800;font-size:12px;letter-spacing:.04em;text-transform:uppercase;background:transparent !important;-webkit-text-fill-color:var(--mr-divider) !important}
.mrv2 .mr-divider::before,.mrv2 .mr-divider::after{content:'';flex:1;height:1px;background:#c8cfde}
.mrv2 .mr-row-flat,.mrv2 .clausola-row{background:transparent !important;border:0 !important;border-bottom:1px solid #d7dbe6 !important;border-radius:0 !important;padding:8px 2px !important;margin:0 !important}
.mrv2 .mr-row-flat:last-child,.mrv2 .clausola-row:last-child{border-bottom:0 !important}
.mrv2 .mr-row-flat .form-control,.mrv2 .clausola-row .form-control,.mrv2 .clausola-row .form-select{background:#fff !important}
.mrv2 .fx-ring{position:relative}
.mrv2 .fx-ring::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.7px;background:conic-gradient(from var(--mrx),#4f46e5,#06b6d4,#22d3ee,#0ea5e9,#06b6d4,#4f46e5);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .25s ease;pointer-events:none;z-index:2}
.mrv2 .fx-ring:hover::after{opacity:1;animation:mrxspin 2.2s linear infinite}
/* =====================================================================
ARCHETIPO A — FORM A SEZIONI NUMERATE (.arch-form)
contratto, proposta, deleghe, disdetta, ecc.
===================================================================== */
/* layout 3 colonne opzionale: nav (240) · form · riepilogo — solo l'area centrale scrolla.
Scalabilità desktop: griglia capped a 1880px centrata (ultrawide 21:9 non stira le colonne);
col3 riepilogo = clamp(360px,40%,620px) → cresce col viewport ma non diventa enorme. */
.mrv2.arch-form .mr-layout-3col,.mrv2.arch-form .contratto-grid{
display:grid !important;grid-template-columns:240px minmax(0,1fr) clamp(360px,40%,620px) !important;gap:14px;align-items:stretch;overflow:hidden;min-height:0;
max-width:1880px;margin-left:auto;margin-right:auto}
.mrv2.arch-form .mr-nav,.mrv2.arch-form .contratto-nav{position:static !important;align-self:stretch;overflow:auto;min-height:0}
.mrv2.arch-form .mr-main,.mrv2.arch-form .main-content{overflow:auto;min-height:0;padding:0 6px 18px 0}
.mrv2.arch-form .mr-aside,.mrv2.arch-form .riepilogo-aside{position:static !important;align-self:stretch;overflow:auto;min-height:0}
@media(max-width:1100px){.mrv2.arch-form .mr-layout-3col,.mrv2.arch-form .contratto-grid{display:block !important;overflow:visible}}
/* card sezione = bianca + header a BANDA GRADIENTE + collassabile */
.mrv2 .mr-card,.mrv2.arch-form .step-card,.mrv2.arch-form .section-card{
background:var(--mr-card) !important;border:1px solid var(--mr-card-bd) !important;border-radius:var(--mr-r-card) !important;box-shadow:var(--mr-shadow) !important;padding:14px !important;margin:0 0 16px !important;overflow:hidden;box-sizing:border-box}
/* variante con struttura .card>.card-h(header)+.card-b(body): padding sui figli, non sulla card */
.mrv2.arch-form .card{background:var(--mr-card) !important;border:1px solid var(--mr-card-bd) !important;border-radius:var(--mr-r-card) !important;box-shadow:var(--mr-shadow) !important;padding:0 !important;margin:0 0 16px !important;overflow:hidden;box-sizing:border-box}
.mrv2.arch-form .card>.card-h{background:var(--mr-grad) !important;color:#fff !important;border:0 !important;border-bottom:0 !important;border-radius:var(--mr-r-card) var(--mr-r-card) 0 0 !important;margin:0 !important;padding:12px 14px !important;display:flex !important;align-items:center !important;gap:.55rem !important;cursor:pointer;user-select:none}
.mrv2.arch-form .card>.card-h h3,.mrv2.arch-form .card>.card-h .card-title{color:#fff !important;font-size:14px !important;font-weight:750 !important;margin:0 !important;flex:1}
.mrv2.arch-form .card>.card-h .ic,.mrv2.arch-form .card>.card-h .title-icon{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:rgba(255,255,255,.20) !important;color:#fff !important;flex-shrink:0}
.mrv2.arch-form .card>.card-b{padding:14px !important}
.mrv2.arch-form .card.collapsed>.card-h{border-radius:var(--mr-r-card) !important}
.mrv2.arch-form .card.collapsed>.card-h .collapse-chevron{transform:rotate(-90deg)}
.mrv2.arch-form .card.collapsed>*:not(.card-h){display:none !important}
.mrv2 .mr-card>.mr-head,.mrv2.arch-form .card>.card-header,.mrv2.arch-form .step-card>.step-title,.mrv2.arch-form .section-card>.section-title{
margin:-14px -14px 14px !important;padding:12px 14px !important;background:var(--mr-grad) !important;border:0 !important;border-bottom:0 !important;
border-radius:var(--mr-r-card) var(--mr-r-card) 0 0 !important;color:#fff !important;font-size:14px !important;font-weight:750 !important;display:flex !important;align-items:center !important;gap:.55rem !important}
.mrv2 .mr-head .mr-head-ic,.mrv2.arch-form .step-title .title-icon,.mrv2.arch-form .card>.card-header .title-icon{
width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:rgba(255,255,255,.20) !important;color:#fff !important;flex-shrink:0}
/* collassabile */
.mrv2 .mr-card>.mr-head,.mrv2.arch-form .step-card>.step-title{cursor:pointer;user-select:none}
.mrv2 .collapse-chevron{margin-left:auto !important;font-size:14px;opacity:.92;transition:transform .2s;flex-shrink:0}
.mrv2 .mr-card.collapsed,.mrv2.arch-form .step-card.collapsed{padding:0 !important;overflow:hidden}
.mrv2 .mr-card.collapsed>.mr-head,.mrv2.arch-form .step-card.collapsed>.step-title{margin:0 !important;border-radius:var(--mr-r-card) !important}
.mrv2 .mr-card.collapsed>.mr-head .collapse-chevron,.mrv2.arch-form .step-card.collapsed>.step-title .collapse-chevron{transform:rotate(-90deg)}
.mrv2 .mr-card.collapsed>*:not(.mr-head),.mrv2.arch-form .step-card.collapsed>*:not(.step-title){display:none !important}
/* ===== STRUMENTI AI → arch-form: sezioni come card MR con header a banda gradiente.
Scoped alle classi USATE SOLO da queste pagine (card-main, settings-*, card2, panel-head,
step-card-body>step-title) → NON tocca contratto/proposta (che usano .step-card>.step-title diretto). ===== */
.mrv2.arch-form .card-main,.mrv2.arch-form .card2,.mrv2.arch-form .settings-accordion,.mrv2.arch-form .pt-card.panel{
background:var(--mr-card) !important;border:1px solid var(--mr-card-bd) !important;border-radius:var(--mr-r-card) !important;
box-shadow:var(--mr-shadow) !important;padding:14px !important;margin:0 0 16px !important;overflow:hidden;box-sizing:border-box}
.mrv2.arch-form .settings-accordion,.mrv2.arch-form .pt-card.panel{padding:0 !important}
/* header a banda gradiente (titolo primo figlio) */
.mrv2.arch-form .card-main>h5:first-child,
.mrv2.arch-form .step-card-body>.step-title,
.mrv2.arch-form .settings-accordion>.settings-header,
.mrv2.arch-form .pt-card.panel>.panel-head{
margin:-14px -14px 14px !important;padding:12px 14px !important;background:var(--mr-grad) !important;color:#fff !important;
border:0 !important;border-radius:var(--mr-r-card) var(--mr-r-card) 0 0 !important;
font-size:14px !important;font-weight:750 !important;display:flex !important;align-items:center !important;gap:.55rem !important}
.mrv2.arch-form .settings-accordion>.settings-header,.mrv2.arch-form .pt-card.panel>.panel-head{margin:0 0 0 0 !important;border-radius:var(--mr-r-card) var(--mr-r-card) 0 0 !important}
.mrv2.arch-form .settings-accordion>.settings-body{padding:14px !important}
/* icone/testi dentro l'header → bianchi su gradiente */
.mrv2.arch-form .step-card-body>.step-title .title-icon,
.mrv2.arch-form .pt-card.panel>.panel-head .ph-ico{background:rgba(255,255,255,.20) !important;color:#fff !important}
.mrv2.arch-form .card-main>h5:first-child i,
.mrv2.arch-form .pt-card.panel>.panel-head h2,
.mrv2.arch-form .pt-card.panel>.panel-head p{color:#fff !important;margin:0 !important}
/* sotto-sezioni = greybox */
.mrv2 .mr-sub,.mrv2.arch-form .subsec,.mrv2 .greybox,.mrv2.arch-form .persona-card,.mrv2.arch-form .immobile-card{
background:var(--mr-grey) !important;border:1px solid var(--mr-grey-bd) !important;border-radius:var(--mr-r-box) !important;box-shadow:none !important;padding:11px 12px 12px !important;margin:0 0 12px !important;width:100% !important;box-sizing:border-box}
.mrv2 .mr-sub>.mr-sub-title,.mrv2.arch-form .subsec>.section-divider{
justify-content:flex-start !important;margin:0 0 10px !important;font-size:12px !important;font-weight:800 !important;letter-spacing:.04em;text-transform:uppercase;
color:transparent !important;background:var(--mr-grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.mrv2.arch-form .subsec>.section-divider::before{display:none !important}
.mrv2.arch-form .subsec>.section-divider::after{margin-left:9px;height:1px;background:#c8cfde}
/* divisore nudo dentro le card persona/immobile (solo riga blu) */
.mrv2.arch-form .persona-card .section-divider,.mrv2.arch-form .immobile-card .section-divider{color:var(--mr-divider) !important;font-weight:800 !important;background:transparent !important;-webkit-text-fill-color:var(--mr-divider) !important}
/* righe Bootstrap: campi affiancati (no impilamento) in colonne strette */
.mrv2.arch-form .step-card .row{display:flex !important;flex-wrap:wrap !important;gap:0 !important;margin-left:0 !important;margin-right:0 !important}
.mrv2.arch-form .step-card .row>[class*="col"]{padding-left:6px !important;padding-right:6px !important;box-sizing:border-box}
.mrv2.arch-form .step-card .row>.col-md-1{flex:0 0 8.333% !important;max-width:8.333% !important}
.mrv2.arch-form .step-card .row>.col-md-2{flex:0 0 16.666% !important;max-width:16.666% !important}
.mrv2.arch-form .step-card .row>.col-md-3{flex:0 0 25% !important;max-width:25% !important}
.mrv2.arch-form .step-card .row>.col-md-4{flex:0 0 33.333% !important;max-width:33.333% !important}
.mrv2.arch-form .step-card .row>.col-md-5{flex:0 0 41.666% !important;max-width:41.666% !important}
.mrv2.arch-form .step-card .row>.col-md-6{flex:0 0 50% !important;max-width:50% !important}
.mrv2.arch-form .step-card .row>.col-md-7{flex:0 0 58.333% !important;max-width:58.333% !important}
.mrv2.arch-form .step-card .row>.col-md-8{flex:0 0 66.666% !important;max-width:66.666% !important}
.mrv2.arch-form .step-card .row>.col-md-9{flex:0 0 75% !important;max-width:75% !important}
.mrv2.arch-form .step-card .row>.col-md-10{flex:0 0 83.333% !important;max-width:83.333% !important}
.mrv2.arch-form .step-card .row>.col-md-12{flex:0 0 100% !important;max-width:100% !important}
/* =====================================================================
ARCHETIPO B — DASHBOARD (.arch-dash) [stesse regole/UI della home]
===================================================================== */
/* KPI griglia */
.mrv2.arch-dash .kpis{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:12px}
@media(max-width:1200px){.mrv2.arch-dash .kpis{grid-template-columns:repeat(3,1fr)}}
@media(max-width:620px){.mrv2.arch-dash .kpis{grid-template-columns:repeat(2,1fr)}}
.mrv2.arch-dash .kpi{position:relative;background:var(--mr-card);border:1px solid var(--mr-card-bd);border-radius:12px;padding:11px 13px;box-shadow:var(--mr-shadow);cursor:pointer;transition:.12s}
.mrv2.arch-dash .kpi:hover{border-color:#cfd8e6;box-shadow:0 6px 18px rgba(20,30,55,.08);transform:translateY(-1px)}
.mrv2.arch-dash .kpi .ic{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;font-size:18px;margin-bottom:7px;background:var(--mr-acc-soft);color:var(--mr-acc)}
.mrv2.arch-dash .kpi .v{font-size:27px;font-weight:800;letter-spacing:-.02em;line-height:1}
.mrv2.arch-dash .kpi .l{font-size:13.5px;color:var(--mr-mut);font-weight:600;text-transform:uppercase;letter-spacing:.04em;margin-top:3px}
.mrv2.arch-dash .kpi.k-green .ic{background:var(--mr-ok-soft);color:#15803d}
.mrv2.arch-dash .kpi.k-red .ic{background:var(--mr-danger-soft);color:var(--mr-danger)}
.mrv2.arch-dash .kpi.k-amber .ic{background:var(--mr-warn-soft);color:#b45309}
.mrv2.arch-dash .kpi.k-viol .ic{background:var(--mr-viol-soft);color:#6d28d9}
.mrv2.arch-dash .kpi.k-cyan .ic{background:#cffafe;color:#0e7490}
/* colonne dashboard */
.mrv2.arch-dash .dash-cols{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:12px;align-items:start}
@media(max-width:1100px){.mrv2.arch-dash .dash-cols{grid-template-columns:1fr 1fr}}
@media(max-width:720px){.mrv2.arch-dash .dash-cols{grid-template-columns:1fr}}
.mrv2.arch-dash .dcol{display:flex;flex-direction:column;gap:12px;min-width:0}
/* card dashboard = bianca con header LEGGERO .card-h (NON banda gradiente) */
.mrv2.arch-dash .card{background:var(--mr-card) !important;border:1px solid var(--mr-card-bd) !important;border-radius:13px !important;box-shadow:var(--mr-shadow) !important;overflow:hidden}
.mrv2.arch-dash .card-h{display:flex;align-items:center;gap:9px;padding:11px 13px;border-bottom:1px solid var(--mr-line)}
.mrv2.arch-dash .card-h .ic{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;background:var(--mr-acc-soft);color:var(--mr-acc);font-size:16px}
.mrv2.arch-dash .card-h h3{font-size:15.5px;font-weight:750;margin:0;color:var(--mr-ink);flex:1}
.mrv2.arch-dash .card-h .more{cursor:pointer;font-size:13.5px;font-weight:650;color:var(--mr-acc)}
.mrv2.arch-dash .card-b{padding:11px 13px}
.mrv2.arch-dash .count-badge{background:var(--mr-acc);color:#fff;font-size:13px;font-weight:700;padding:1px 7px;border-radius:10px}
/* pill di filtro (con anello su hover) */
.mrv2.arch-dash .sd-pills{display:flex;gap:5px;margin-bottom:10px;flex-wrap:wrap;align-items:center}
.mrv2.arch-dash .sd-pill{position:relative;background:#eef0f8;border:1px solid var(--mr-field-bd);border-radius:9px;padding:8px 14px;font-size:14.5px;font-weight:650;color:#1f2937;cursor:pointer;display:inline-flex;align-items:center;gap:6px;font-family:inherit;transition:background .16s,border-color .16s,color .16s}
.mrv2.arch-dash .sd-pill:hover{border-color:#c4c9e4;background:#e4e7f3;color:var(--mr-acc)}
.mrv2.arch-dash .sd-pill::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.1px;background:conic-gradient(from var(--mrx),#4f46e5,#06b6d4,#22d3ee,#0ea5e9,#06b6d4,#4f46e5);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .25s;pointer-events:none;z-index:2}
.mrv2.arch-dash .sd-pill:hover::after{opacity:1;animation:mrxspin 2.4s linear infinite}
.mrv2.arch-dash .sd-pill.active{background:var(--mr-acc);border-color:var(--mr-acc);color:#fff}
.mrv2.arch-dash .sd-pill-c{font-size:12px;font-weight:700;background:rgba(0,0,0,.08);border-radius:7px;padding:0 5px;min-width:14px;text-align:center}
.mrv2.arch-dash .sd-pill.active .sd-pill-c{background:rgba(255,255,255,.28)}
/* righe agenda/scadenze (con anello) */
.mrv2.arch-dash .scadenze-list{display:flex;flex-direction:column;gap:6px;max-height:340px;overflow:auto}
.mrv2.arch-dash .scadenza{position:relative;display:flex;align-items:center;gap:10px;background:#edeef7;border:1px solid var(--mr-line);border-radius:9px;padding:8px 10px;transition:background .22s,border-color .22s}
.mrv2.arch-dash .scadenza:hover{border-color:#c2c8dc;background:#dde1ee}
.mrv2.arch-dash .scadenza.urgent{border-left:3px solid var(--mr-danger)}.mrv2.arch-dash .scadenza.warn{border-left:3px solid var(--mr-warn)}
.mrv2.arch-dash .scadenza::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.7px;background:conic-gradient(from var(--mrx),#4f46e5,#06b6d4,#0ea5e9,#22d3ee,#06b6d4,#4f46e5);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .25s;pointer-events:none;z-index:2}
.mrv2.arch-dash .scadenza:hover::after{opacity:1;animation:mrxspin 2.4s linear infinite}
.mrv2.arch-dash .scadenza .sd-day{text-align:center;min-width:40px;padding:3px 5px;background:#fff;border:1px solid var(--mr-line);border-radius:7px}
.mrv2.arch-dash .scadenza .sd-day b{display:block;font-size:17px;font-weight:800;line-height:1.05}
.mrv2.arch-dash .scadenza .sd-day small{font-size:11.5px;font-weight:700;color:var(--mr-mut);letter-spacing:.04em}
.mrv2.arch-dash .scadenza.urgent .sd-day{background:#fee2e2;border-color:#fecaca}.mrv2.arch-dash .scadenza.urgent .sd-day b{color:var(--mr-danger)}
.mrv2.arch-dash .scadenza.warn .sd-day{background:#fef3c7;border-color:#fde68a}.mrv2.arch-dash .scadenza.warn .sd-day b{color:#854d0e}
.mrv2.arch-dash .scadenza .sd-body{flex:1;min-width:0}
.mrv2.arch-dash .scadenza .sd-type{font-size:12.5px;font-weight:700;color:var(--mr-mut);text-transform:uppercase;letter-spacing:.03em;display:inline-flex;align-items:center;gap:4px}
.mrv2.arch-dash .scadenza .sd-title{font-size:15px;font-weight:600;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mrv2.arch-dash .scadenza .sd-meta{font-size:13px;color:var(--mr-mut);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mrv2.arch-dash .chip{display:inline-flex;align-items:center;padding:2px 7px;border-radius:6px;font-size:12.5px;font-weight:700;white-space:nowrap}
.mrv2.arch-dash .chip.done{background:#dcfce7;color:#166534}.mrv2.arch-dash .chip.wip{background:#fef3c7;color:#854d0e}.mrv2.arch-dash .chip.err{background:#fee2e2;color:#991b1b}.mrv2.arch-dash .chip.draft{background:#eef1f7;color:#475569}
/* task board (input con anello) */
.mrv2.arch-dash .task-board{display:flex;flex-direction:column;gap:4px}
.mrv2.arch-dash .task-input{position:relative;display:flex;align-items:center;gap:7px;padding:7px 9px;background:#edeef7;border:1px dashed var(--mr-line);border-radius:8px;flex-wrap:wrap;margin-bottom:4px;transition:background .22s}
.mrv2.arch-dash .task-input:hover{background:#dde1ef}
.mrv2.arch-dash .task-input::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.7px;background:conic-gradient(from var(--mrx),#4f46e5,#06b6d4,#0ea5e9,#22d3ee,#06b6d4,#4f46e5);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .25s;pointer-events:none;z-index:2}
.mrv2.arch-dash .task-input:hover::after{opacity:1;animation:mrxspin 2.4s linear infinite}
.mrv2.arch-dash .task-input>i{color:var(--mr-acc);font-size:16px}
.mrv2.arch-dash .task-input input[type=text]{flex:1;min-width:140px;border:none !important;background:transparent !important;font-size:14.5px;color:var(--mr-ink);outline:none;font-family:inherit}
.mrv2.arch-dash .task-list{max-height:300px;overflow:auto}
.mrv2.arch-dash .task-item{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:7px;transition:.1s;border:1px solid transparent}
.mrv2.arch-dash .task-item:hover{background:var(--mr-panel2);border-color:var(--mr-line)}
.mrv2.arch-dash .task-check{width:15px;height:15px;accent-color:var(--mr-acc);cursor:pointer;flex-shrink:0}
.mrv2.arch-dash .task-item .dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.mrv2.arch-dash .dot.p-high{background:var(--mr-danger)}.mrv2.arch-dash .dot.p-med{background:var(--mr-warn)}.mrv2.arch-dash .dot.p-low{background:var(--mr-mut2)}
.mrv2.arch-dash .task-body{flex:1;min-width:0}
.mrv2.arch-dash .task-title{font-size:15px;font-weight:500;line-height:1.25}
.mrv2.arch-dash .task-title.done{text-decoration:line-through;color:var(--mr-mut2)}
.mrv2.arch-dash .task-meta{font-size:13px;color:var(--mr-mut);margin-top:1px;display:flex;gap:6px;flex-wrap:wrap}
/* mini-row (pratiche/utenze recenti, con anello) */
.mrv2.arch-dash .mini-list{display:flex;flex-direction:column;gap:5px}
.mrv2.arch-dash .mini-row{position:relative;display:flex;align-items:center;gap:9px;background:#edeef7;border:1px solid var(--mr-line);border-radius:8px;padding:7px 9px;cursor:pointer;transition:background .22s,border-color .22s}
.mrv2.arch-dash .mini-row:hover{background:#dde1ee;border-color:#c2c8dc}
.mrv2.arch-dash .mini-row::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.7px;background:conic-gradient(from var(--mrx),#4f46e5,#06b6d4,#0ea5e9,#22d3ee,#06b6d4,#4f46e5);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .25s;pointer-events:none;z-index:2}
.mrv2.arch-dash .mini-row:hover::after{opacity:1;animation:mrxspin 2.4s linear infinite}
.mrv2.arch-dash .mini-row .mi-ic{width:28px;height:28px;border-radius:7px;background:var(--mr-acc-soft);color:var(--mr-acc);display:grid;place-items:center;font-size:16px;flex-shrink:0}
.mrv2.arch-dash .mini-row .mi-b{flex:1;min-width:0}
.mrv2.arch-dash .mini-row .mi-t{font-size:14.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mrv2.arch-dash .mini-row .mi-s{font-size:13px;color:var(--mr-mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* azioni rapide (griglia di bottoni-icona, con anello) */
.mrv2.arch-dash .qa-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.mrv2.arch-dash .qa{position:relative;display:flex;align-items:center;gap:9px;background:#edeef7;border:1px solid var(--mr-line);border-radius:9px;padding:9px 10px;cursor:pointer;transition:background .22s,border-color .22s,color .22s;font-family:inherit;color:var(--mr-ink);text-align:left;width:100%}
.mrv2.arch-dash .qa:hover{background:#dde1ee;border-color:#c2c8dc;color:var(--mr-acc-ink)}
.mrv2.arch-dash .qa::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.7px;background:conic-gradient(from var(--mrx),#4f46e5,#06b6d4,#0ea5e9,#22d3ee,#06b6d4,#4f46e5);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .25s;pointer-events:none;z-index:2}
.mrv2.arch-dash .qa:hover::after{opacity:1;animation:mrxspin 2.4s linear infinite}
.mrv2.arch-dash .qa .ic{width:30px;height:30px;border-radius:8px;background:var(--mr-acc-soft);color:var(--mr-acc);display:grid;place-items:center;font-size:17px;flex-shrink:0}
.mrv2.arch-dash .qa .t{font-size:14.5px;font-weight:700}
.mrv2.arch-dash .empty-mini{padding:12px;color:var(--mr-mut2);text-align:center;font-size:14px}
.mrv2.arch-dash .loading-row{padding:14px;color:var(--mr-mut);text-align:center;font-size:14.5px}
/* =====================================================================
ARCHETIPO C — LISTE / TABELLE (.arch-list)
===================================================================== */
.mrv2.arch-list .card,.mrv2.arch-list .mr-card{background:var(--mr-card) !important;border:1px solid var(--mr-card-bd) !important;border-radius:var(--mr-r-card) !important;box-shadow:var(--mr-shadow) !important;overflow:hidden}
.mrv2.arch-list .mr-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.mrv2.arch-list table,.mrv2.arch-list .table{width:100%;border-collapse:collapse;background:var(--mr-card);border-radius:var(--mr-r-card);overflow:hidden}
.mrv2.arch-list thead th{background:var(--mr-panel2) !important;color:var(--mr-ink2) !important;font-size:12.5px;font-weight:750;text-transform:uppercase;letter-spacing:.03em;padding:10px 12px;border-bottom:1px solid var(--mr-line);text-align:left}
.mrv2.arch-list tbody td{padding:10px 12px;border-bottom:1px solid var(--mr-line);font-size:14px;color:var(--mr-ink)}
.mrv2.arch-list tbody tr{transition:background .15s}
.mrv2.arch-list tbody tr:hover{background:#f5f8ff}
.mrv2.arch-list tbody tr:last-child td{border-bottom:0}
/* =====================================================================
ARCHETIPO D — STRUMENTI / ICONE (.arch-tools)
griglia di card-strumento cliccabili (con anello)
===================================================================== */
.mrv2.arch-tools .tool-grid,.mrv2.arch-tools .mr-tool-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}
.mrv2.arch-tools .tool-card,.mrv2.arch-tools .mr-tool{position:relative;background:var(--mr-card);border:1px solid var(--mr-card-bd);border-radius:var(--mr-r-card);box-shadow:var(--mr-shadow);padding:16px;cursor:pointer;display:flex;flex-direction:column;gap:8px;transition:transform .15s,box-shadow .15s}
.mrv2.arch-tools .tool-card:hover,.mrv2.arch-tools .mr-tool:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(31,28,70,.12)}
.mrv2.arch-tools .tool-card::after,.mrv2.arch-tools .mr-tool::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.7px;background:conic-gradient(from var(--mrx),#4f46e5,#06b6d4,#0ea5e9,#22d3ee,#06b6d4,#4f46e5);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .25s;pointer-events:none;z-index:2}
.mrv2.arch-tools .tool-card:hover::after,.mrv2.arch-tools .mr-tool:hover::after{opacity:1;animation:mrxspin 2.4s linear infinite}
.mrv2.arch-tools .tool-card .ic,.mrv2.arch-tools .mr-tool .ic{width:42px;height:42px;border-radius:11px;display:grid;place-items:center;font-size:20px;background:var(--mr-grad);color:#fff}
.mrv2.arch-tools .tool-card .t,.mrv2.arch-tools .mr-tool .t{font-size:15.5px;font-weight:750;color:var(--mr-ink)}
.mrv2.arch-tools .tool-card .d,.mrv2.arch-tools .mr-tool .d{font-size:13px;color:var(--mr-mut)}
/* PULIZIA MR — Strumenti AI (arch-tools): sfondo pagina chiaro (non il grigio --bg-soft),
sezioni come card MR coerenti. Le sezioni restano box bianchi; il token --bg-soft resta
invariato per i componenti interni (dropzone, barre, ecc.). */
html:has(>body.mrv2.arch-tools){background:#eef2fb !important}
body.mrv2.arch-tools{background:#eef2fb !important}
.mrv2.arch-tools .step-card,.mrv2.arch-tools .section-card,.mrv2.arch-tools .card-main{
background:var(--mr-card) !important;border:1px solid var(--mr-card-bd) !important;
border-radius:var(--mr-r-card) !important;box-shadow:var(--mr-shadow) !important;
margin:0 0 14px !important;box-sizing:border-box;overflow:hidden}
/* =====================================================================
9. COMPAT — TOKEN LEGACY → PALETTE v2 (universale)
Le pagine vecchie sono token-driven: costruiscono colori da
var(--accent)/--danger/--bg/--border ecc. definiti nei loro :root.
Ridefinendo gli STESSI nomi su body.mrv2 l'intera pagina si ricolora
v2 senza toccare le singole classi. Questa è la "regola unica":
ogni eccezione di colore si gestisce QUI.
===================================================================== */
body.mrv2{
--bg:#ffffff !important; --bg-soft:#d6dae8 !important; --bg-soft-2:#eef1f8 !important;
--fg:#1a2233 !important; --text:#1a2233 !important; --ink:#1a2233 !important;
--muted:#6b7587 !important; --muted-2:#9aa3b2 !important; --text-muted:#6b7587 !important;
--border:#dfe3ef !important; --border-soft:#e9ecf4 !important;
--primary:#4f46e5 !important; --primary-dark:#3f37c9 !important; --primary-light:#06b6d4 !important;
--accent:#4f46e5 !important; --accent-light:#06b6d4 !important; --accent-soft:#eef0ff !important;
--accent2:#ea7317 !important; --accent2-soft:#fff7ef !important;
--success:#16a34a !important; --warning:#d97706 !important; --danger:#dc2626 !important;
}
/* =====================================================================
10. BOTTONI — copertura UNIVERSALE (qualunque .btn: anello + varianti)
Estende la sez. 4 a TUTTI i .btn, incl. success/danger/warning.
===================================================================== */
.mrv2 .btn{border-radius:var(--mr-r-btn) !important;font-weight:650 !important;position:relative}
.mrv2 .btn-success,.mrv2 .btn-ok,.mrv2 .btn-save{background:var(--mr-ok) !important;border:0 !important;color:#fff !important;box-shadow:0 4px 12px rgba(22,163,74,.22) !important}
.mrv2 .btn-danger,.mrv2 .btn-delete,.mrv2 .btn-reset-danger,.mrv2 .btn-remove{background:var(--mr-danger) !important;border:0 !important;color:#fff !important;box-shadow:0 4px 12px rgba(220,38,38,.20) !important}
.mrv2 .btn-warning{background:var(--mr-warn) !important;border:0 !important;color:#fff !important}
.mrv2 .btn-outline-primary,.mrv2 .btn-outline-secondary{background:#eef0f8 !important;border:1px solid var(--mr-field-bd) !important;color:var(--mr-ink2) !important}
/* anello generico su ogni .btn */
.mrv2 .btn::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.7px;
background:conic-gradient(from var(--mrx),#4f46e5,#06b6d4,#0ea5e9,#22d3ee,#06b6d4,#4f46e5);
-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .25s;pointer-events:none;z-index:2}
.mrv2 .btn-danger::after,.mrv2 .btn-reset-danger::after,.mrv2 .btn-delete::after{background:conic-gradient(from var(--mrx),#7f1d1d,#dc2626,#f87171,#fca5a5,#dc2626,#7f1d1d)}
.mrv2 .btn-success::after,.mrv2 .btn-save::after{background:conic-gradient(from var(--mrx),#14532d,#16a34a,#4ade80,#86efac,#16a34a,#14532d)}
.mrv2 .btn:not(:disabled):hover::after{opacity:1;animation:mrxspin 2.4s linear infinite}
.mrv2 .btn:not(:disabled):hover{transform:translateY(-1px)}
/* =====================================================================
11. COMPAT — CLASSI LEGACY CONTRATTO / PROPOSTA (arch-form)
Bottoni custom, divisori e pannelli delle pagine wizard: mappati qui
(regola unica) così le pagine non tengono CSS grafico proprio.
===================================================================== */
/* azione = gradiente firma + anello */
.mrv2 .btn-primary-custom,.mrv2 .btn-genera-step{
background:var(--mr-grad) !important;border:0 !important;color:#fff !important;font-weight:700 !important;
border-radius:var(--mr-r-btn) !important;padding:9px 16px !important;box-shadow:0 4px 12px rgba(79,70,229,.22) !important;
cursor:pointer;position:relative;display:inline-flex;align-items:center;gap:.35rem;
transition:transform .18s ease,filter .18s ease,box-shadow .18s ease}
.mrv2 .btn-primary-custom:hover,.mrv2 .btn-genera-step:hover{filter:brightness(1.06);color:#fff !important;transform:translateY(-1px)}
.mrv2 .btn-primary-custom::after,.mrv2 .btn-genera-step::after,.mrv2 .btn-salva-pratica::after,.mrv2 .btn-doc-extra::after{
content:"";position:absolute;inset:0;border-radius:inherit;padding:1.7px;
background:conic-gradient(from var(--mrx),#4f46e5,#06b6d4,#0ea5e9,#22d3ee,#06b6d4,#4f46e5);
-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
opacity:0;transition:opacity .25s;pointer-events:none;z-index:2}
.mrv2 .btn-primary-custom:not(:disabled):hover::after,.mrv2 .btn-genera-step:not(:disabled):hover::after,
.mrv2 .btn-doc-extra:not(:disabled):hover::after{opacity:1;animation:mrxspin 2.4s linear infinite}
/* salva pratica = verde ok (anello verde) */
.mrv2 .btn-salva-pratica{background:var(--mr-ok) !important;border:0 !important;color:#fff !important;font-weight:700 !important;
border-radius:var(--mr-r-btn) !important;box-shadow:0 4px 12px rgba(22,163,74,.22) !important;cursor:pointer;position:relative;
transition:transform .18s ease,filter .18s ease}
.mrv2 .btn-salva-pratica::after{background:conic-gradient(from var(--mrx),#14532d,#16a34a,#4ade80,#86efac,#16a34a,#14532d)}
.mrv2 .btn-salva-pratica:not(:disabled):hover{filter:brightness(1.06);transform:translateY(-1px)}
.mrv2 .btn-salva-pratica:not(:disabled):hover::after{opacity:1;animation:mrxspin 2.4s linear infinite}
/* neutri */
.mrv2 .btn-doc-extra{background:#eef0f8 !important;border:1px solid var(--mr-field-bd) !important;color:var(--mr-ink2) !important;
border-radius:var(--mr-r-btn) !important;font-weight:650 !important;cursor:pointer;position:relative;transition:background .18s,border-color .18s}
.mrv2 .btn-doc-extra:hover{background:#e2e6f3 !important;border-color:#c3c9da !important}
.mrv2 .btn-salva-bozza{background:transparent !important;border:0 !important;color:var(--mr-mut) !important;cursor:pointer;border-radius:8px;transition:background .15s,color .15s}
.mrv2 .btn-salva-bozza:hover{background:var(--mr-acc-soft) !important;color:var(--mr-acc) !important}
/* cestini/elimina: outline rosso pieno su hover */
.mrv2 .btn-remove-persona,.mrv2 .btn-link.text-danger{border:1px solid var(--mr-danger) !important;color:var(--mr-danger) !important;
background:#fff !important;border-radius:8px !important;min-width:32px;height:32px;display:inline-flex !important;align-items:center;
justify-content:center;padding:0 .45rem !important;cursor:pointer;transition:background .15s,color .15s}
.mrv2 .btn-remove-persona:hover,.mrv2 .btn-link.text-danger:hover{background:var(--mr-danger) !important;color:#fff !important;text-decoration:none !important}
/* divisore = solo riga blu (nessun box) */
.mrv2 .section-divider{display:flex;align-items:center;gap:.5rem;margin:.85rem 0 .5rem;color:var(--mr-divider) !important;
font-weight:800;font-size:12px;letter-spacing:.04em;text-transform:uppercase;background:transparent !important;-webkit-text-fill-color:var(--mr-divider) !important}
.mrv2 .section-divider::before{display:none}
.mrv2 .section-divider::after{content:'';flex:1;height:1px;background:#c8cfde}
/* pannelli/inner-box della proposta = greybox MR */
.mrv2 .cs-field-panel:not(.cs-flat-panel),.mrv2 .cs-inner-box,.mrv2 .catastale-card,.mrv2 .catasto-box,
.mrv2 .gen-form-panel,.mrv2 .doc-section-group{
background:var(--mr-grey) !important;border:1px solid var(--mr-grey-bd) !important;border-radius:var(--mr-r-box) !important;
box-shadow:none !important;padding:11px 12px 12px !important;margin:0 0 12px !important;box-sizing:border-box}
.mrv2 .catasto-box-title,.mrv2 .gen-form-panel-header,.mrv2 .doc-section-header{
background:transparent !important;border:0 !important;padding:0 0 .5rem !important;margin:0 0 .5rem !important;
color:var(--mr-divider) !important;font-size:12.5px !important;font-weight:800 !important;text-transform:uppercase !important;
letter-spacing:.04em !important;display:flex;align-items:center;gap:.4rem;border-bottom:1px solid var(--mr-grey-bd) !important}
/* header/stepper: colori firma */
.mrv2 .step-item.active .step-circle{background:var(--mr-acc) !important;border-color:var(--mr-acc) !important}
.mrv2 .step-item.active .step-label{color:var(--mr-acc) !important}
.mrv2 .step-item.completed .step-circle{background:var(--mr-ok) !important;border-color:var(--mr-ok) !important}
.mrv2 .step-item.completed:not(:last-child)::after{background:var(--mr-acc) !important}
/* input-group: addon mai a capo */
.mrv2 .input-group{flex-wrap:nowrap !important}
.mrv2 .input-group>.input-group-text{white-space:nowrap;flex:0 0 auto}
.mrv2 .input-group>.form-control{min-width:0}
/* titoli card persona/immobile: pallino numerato gradiente + scritta BLU maiuscola (come i titoli sezione) */
.mrv2 .persona-card-title{color:var(--mr-divider) !important;text-transform:uppercase !important;font-weight:800 !important;
font-size:12.5px !important;letter-spacing:.04em !important;display:flex !important;align-items:center;gap:.5rem;min-width:0}
.mrv2 .persona-card-title .persona-num{background:var(--mr-grad) !important;color:#fff !important;border-radius:50% !important;
width:22px;height:22px;flex:0 0 22px;display:grid !important;place-items:center;font-size:.72rem;font-weight:800}
/* titolo pagina = come "Archivio clienti": icona in tile GRADIENTE + scritta BOLD NERA (niente banda) */
.mrv2 .page-title-block{background:transparent !important;border:0 !important;border-radius:0 !important;
padding:0 !important;margin:0 0 12px !important;box-shadow:none !important}
.mrv2 .page-title-main{color:var(--mr-ink) !important;font-size:21px !important;font-weight:800 !important;margin:0 !important;
display:flex !important;align-items:center;gap:.6rem}
.mrv2 .page-title-main i{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;
background:var(--mr-grad) !important;color:#fff !important;font-size:1.05rem;flex:0 0 34px}
/* =====================================================================
12. FORM 3 COLONNE (arch-form): nav sezioni progressive · corpo · riepilogo live
Markup: .prop-3col > .prop-nav(.prop-nav-card>.prop-nav-h+#stepNav) +
.prop-main(>.main-content con le .step-card) + .prop-aside(.prop-aside-card)
===================================================================== */
/* Scalabilità desktop: cap 1760px centrato (ultrawide 21:9); col3 riepilogo = clamp → mai enorme */
.mrv2 .prop-3col{display:grid;grid-template-columns:236px minmax(0,1fr) clamp(320px,27%,470px);gap:16px;align-items:start;
width:100%;max-width:1760px;margin:0 auto;padding:4px 1.2rem 120px}
.mrv2 .prop-nav{position:sticky;top:14px}
.mrv2 .prop-main{min-width:0}
.mrv2 .prop-main .main-content{padding:0 !important}
.mrv2 .prop-aside{position:sticky;top:14px}
@media(max-width:1200px){
.mrv2 .prop-3col{grid-template-columns:212px minmax(0,1fr)}
.mrv2 .prop-aside{grid-column:1/-1;position:static}
}
@media(max-width:820px){
.mrv2 .prop-3col{grid-template-columns:1fr}
.mrv2 .prop-nav{position:static}
}
/* Scalabilità desktop: su ultrawide titolo pagina e stepper restano allineati alla griglia capped
(vince sui width:100%!important/max-width:none!important delle pagine, ui2 è caricato per ultimo) */
.mrv2 .page-title-host{width:100% !important;max-width:1760px !important;margin-left:auto !important;margin-right:auto !important;padding-left:1.2rem;padding-right:1.2rem}
.mrv2 .stepper-wrapper{width:100% !important;max-width:1760px !important;margin-left:auto !important;margin-right:auto !important}
.mrv2 .prop-nav-card,.mrv2 .prop-aside-card{background:var(--mr-card);border:1px solid var(--mr-card-bd);
border-radius:var(--mr-r-card);box-shadow:var(--mr-shadow);overflow:hidden}
.mrv2 .prop-nav-h,.mrv2 .prop-aside-h{background:var(--mr-grad);color:#fff;font-size:13.5px;font-weight:750;
padding:11px 14px;display:flex;align-items:center;gap:.5rem}
.mrv2 .prop-nav-body{padding:8px}
.mrv2 .prop-step{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:9px;cursor:pointer;
color:var(--mr-ink2);font-size:13.5px;font-weight:600;transition:background .15s,color .15s;border:1px solid transparent}
.mrv2 .prop-step:hover{background:var(--mr-panel2)}
.mrv2 .prop-step .ps-num{width:24px;height:24px;flex:0 0 24px;border-radius:50%;display:grid;place-items:center;
font-size:12.5px;font-weight:800;background:#e6e9f5;color:var(--mr-mut);border:1px solid #d4d8ea;transition:.15s}
.mrv2 .prop-step.active{background:var(--mr-acc-soft);border-color:#c7ccf3}
.mrv2 .prop-step.active .ps-num{background:var(--mr-grad);color:#fff;border-color:transparent}
.mrv2 .prop-step.active .ps-label{color:var(--mr-acc-ink);font-weight:750}
.mrv2 .prop-step.done .ps-num{background:var(--mr-ok);color:#fff;border-color:transparent}
.mrv2 .prop-step.done .ps-label{color:var(--mr-ink)}
.mrv2 .prop-step .ps-label{flex:1;min-width:0;line-height:1.2}
.mrv2 .prop-aside-body{padding:10px 12px;max-height:calc(100vh - 120px);overflow:auto}
.mrv2 .rp-sec{margin-bottom:12px}
.mrv2 .rp-sec:last-child{margin-bottom:0}
.mrv2 .rp-sec-t{font-size:11.5px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--mr-divider);
margin:0 0 6px;padding-bottom:4px;border-bottom:1px solid var(--mr-line);display:flex;align-items:center;gap:.35rem}
.mrv2 .rp-row{display:flex;justify-content:space-between;gap:10px;font-size:12.5px;padding:2px 0}
.mrv2 .rp-row .rp-k{color:var(--mr-mut);flex:0 0 auto}
.mrv2 .rp-row .rp-v{color:var(--mr-ink);font-weight:600;text-align:right;word-break:break-word}
.mrv2 .rp-chip{display:inline-block;background:var(--mr-grey);border:1px solid var(--mr-grey-bd);border-radius:7px;
padding:2px 8px;font-size:12px;font-weight:600;color:var(--mr-ink2);margin:0 4px 4px 0}
.mrv2 .rp-empty{color:var(--mr-mut2);font-size:12.5px;font-style:italic}
.mrv2 .rp-big{font-size:15px;font-weight:800;color:var(--mr-acc-ink)}
/* sezione attiva alta almeno quanto la parte visibile (i dropdown di ricerca non restano tagliati) */
.mrv2 .prop-main .step-card.active{min-height:calc(100vh - 250px);overflow:visible !important}
.mrv2 .prop-main .step-card.collapsed{overflow:hidden !important}