/* ============================================================= pim-formazione · CSS frontend pubblico (/formazione/) Va DOPO pim-theme.css. Stili specifici delle pagine collaboratore. ============================================================= */ /* ---------- GATE (non loggato) ---------- */ .gate{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px} .gate-card{width:100%;max-width:460px;text-align:center;background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-lg);padding:44px 36px;box-shadow:var(--shadow-2);position:relative;overflow:hidden} .gate-card::before{content:"";position:absolute;right:-60px;top:-60px;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,var(--accent) 0%,transparent 70%);opacity:.12;pointer-events:none} .ag-stage{--size:72px;width:var(--size);height:var(--size);margin:0 auto 22px;position:relative} .ag-mark{position:absolute;inset:0;border-radius:50%;background:var(--accent);font-size:0} .ag-orbit{position:absolute;top:50%;left:50%;width:calc(var(--size) * .81);height:calc(var(--size) * .81);transform:translate(-50%,-50%);animation:ag-spin 6.5s linear infinite} .ag-sphere{position:absolute;top:0;left:50%;width:11px;height:11px;border-radius:50%;background:#fff;transform:translate(-50%,-50%);box-shadow:0 0 10px 1px rgba(255,255,255,.45)} @keyframes ag-spin{to{transform:translate(-50%,-50%) rotate(360deg)}} .gate-card .eyebrow{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin-bottom:8px} .gate-card h1{font-size:24px;font-weight:700;letter-spacing:-.01em;margin:0 0 12px} .gate-card .lead{font-size:14px;color:var(--ink-soft);line-height:1.6;margin:0 0 8px} .gate-card .why{font-size:13px;color:var(--ink-mute);line-height:1.6;margin:18px 0 26px;padding:14px 16px;background:var(--bg-2);border-radius:var(--radius);text-align:left;border:1px solid var(--line-soft)} .gate-card .why b{color:var(--ink-soft)} .gate-card .btn{width:100%;justify-content:center} .gate-foot{margin-top:18px;font-size:12px;color:var(--ink-mute)} .gate-theme{position:fixed;top:16px;right:16px} /* ---------- DASHBOARD ---------- */ .mt-team-layout{display:grid;grid-template-columns:280px minmax(0,1fr);gap:22px;align-items:start;margin-top:26px}.mt-team-people{display:flex;flex-direction:column;gap:8px;position:sticky;top:130px}.mt-team-person{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:15px 16px;border:1px solid var(--line);border-radius:14px;background:var(--bg-1);color:var(--ink);text-decoration:none}.mt-team-person:hover,.mt-team-person.is-active{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 7%,var(--bg-1))}.mt-team-person span,.mt-team-person b,.mt-team-person small{display:block}.mt-team-person small{margin-top:4px;color:var(--ink-soft);font-size:12px}.mt-team-person i{font-size:24px;font-style:normal;color:var(--accent)}.mt-team-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin:0 0 14px;padding:20px}.mt-team-head h2{margin:3px 0 6px;font-size:22px}.mt-team-head p{margin:0;color:var(--ink-soft);font-size:13px}.mt-team-types{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin:0 0 14px;color:var(--ink-soft);font-size:12px}.mt-team-types span{padding:6px 9px;border:1px solid var(--line);border-radius:999px;background:var(--bg-1)}.mt-team-appointment{display:grid;grid-template-columns:72px minmax(180px,1fr) minmax(130px,.6fr) auto;align-items:center;gap:14px;padding:14px 16px;border:1px solid var(--line);border-radius:13px;background:var(--bg-1);margin-bottom:8px}.mt-team-appointment time b,.mt-team-appointment time span,.mt-team-appointment div b,.mt-team-appointment div small{display:block}.mt-team-appointment time span,.mt-team-appointment div small{margin-top:3px;color:var(--ink-soft);font-size:12px}.mt-team-appointment em{font-size:11px;font-style:normal;text-transform:uppercase;letter-spacing:.08em;color:var(--ok)}.mt-team-appointment.is-cancelled{opacity:.58}.mt-guide-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:28px 0}.mt-guide-grid article,.mt-guide-example{padding:24px;border:1px solid var(--line);border-radius:18px;background:var(--bg-1)}.mt-guide-grid article>span{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--accent);color:var(--accent-ink);font-weight:800}.mt-guide-grid h2,.mt-guide-example h2{margin:16px 0 8px;font-size:18px}.mt-guide-grid p,.mt-guide-example p{margin:0;color:var(--ink-soft);line-height:1.65}.mt-guide-example{margin-bottom:20px;border-color:color-mix(in srgb,var(--accent) 45%,var(--line));background:color-mix(in srgb,var(--accent) 6%,var(--bg-1))}.mt-tour{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;padding:20px;background:rgba(4,8,8,.72);backdrop-filter:blur(8px)}.mt-tour-card{width:min(620px,100%);padding:30px;border:1px solid color-mix(in srgb,var(--accent) 35%,var(--line));border-radius:24px;background:var(--bg-1);box-shadow:var(--shadow-2)}.mt-tour-progress{display:flex;gap:7px;margin-bottom:30px}.mt-tour-progress i{height:4px;flex:1;border-radius:99px;background:var(--line)}.mt-tour-progress i.is-on{background:var(--accent)}.mt-tour section{display:none;min-height:250px}.mt-tour section.is-on{display:block}.mt-tour-icon{display:grid;place-items:center;width:58px;height:58px;margin-bottom:22px;border-radius:18px;background:var(--accent);color:var(--accent-ink);font-size:16px;font-weight:850}.mt-tour h2{margin:0 0 12px;font-size:28px;letter-spacing:-.025em}.mt-tour p{margin:0;color:var(--ink-soft);font-size:16px;line-height:1.65}.mt-tour-example{display:block;margin-top:14px;padding:12px 14px;border:1px solid color-mix(in srgb,var(--accent) 35%,var(--line));border-radius:12px;background:color-mix(in srgb,var(--accent) 6%,var(--bg-1));font-size:13px;line-height:1.5}.mt-tour-actions{display:flex;justify-content:space-between;gap:12px;padding-top:20px;border-top:1px solid var(--line)}.mt-tour-actions form{margin-left:auto}.mt-tour-actions [hidden]{display:none} @media(max-width:850px){.mt-team-layout{grid-template-columns:1fr}.mt-team-people{position:static;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.mt-team-appointment{grid-template-columns:64px 1fr}.mt-team-appointment>span,.mt-team-appointment>em{grid-column:2}.mt-guide-grid{grid-template-columns:1fr}}@media(max-width:560px){.mt-team-people{grid-template-columns:1fr}.mt-team-head{flex-direction:column}.mt-team-head .mt-booking-actions{width:100%}.mt-tour-card{padding:22px}.mt-tour h2{font-size:23px}.mt-tour section{min-height:300px}} .hero{border-radius:var(--radius-lg);border:1px solid var(--line);padding:24px;margin-bottom:24px;background:linear-gradient(135deg,color-mix(in srgb,var(--ok) 6%,var(--bg-1)) 0%,var(--bg-1) 55%);display:flex;align-items:center;gap:24px;flex-wrap:wrap;position:relative;overflow:hidden} .hero.is-warn{background:linear-gradient(135deg,color-mix(in srgb,var(--warn) 6%,var(--bg-1)) 0%,var(--bg-1) 55%);border-color:color-mix(in srgb,var(--warn) 30%,var(--line))} .hero .ring{flex:0 0 96px;width:96px;height:96px;border-radius:50%;display:grid;place-items:center;position:relative;background:conic-gradient(var(--accent) calc(var(--p,0)*1%),var(--bg-2) 0)} .hero .ring::after{content:"";position:absolute;inset:8px;border-radius:50%;background:var(--bg-1)} .hero .ring .val{position:relative;z-index:1;font-size:22px;font-weight:700;font-variant-numeric:tabular-nums;text-align:center} .hero .ring .val small{display:block;font-size:9px;font-weight:600;letter-spacing:.1em;color:var(--ink-mute);text-transform:uppercase} .hero .htxt{flex:1;min-width:240px} .hero .heyebrow{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-mute);margin-bottom:6px;display:flex;align-items:center;gap:8px;flex-wrap:wrap} .hero h1{margin:0 0 6px;font-size:24px;font-weight:700;letter-spacing:-.01em} .hero .hsub{margin:0;font-size:14px;color:var(--ink-soft);line-height:1.55;max-width:460px} .pgd-progress-breakdown{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px}.pgd-progress-breakdown span,.pgd-progress-breakdown a{display:inline-flex;align-items:center;gap:5px;padding:6px 9px;border:1px solid var(--line);border-radius:9px;background:color-mix(in srgb,var(--card) 88%,transparent);color:var(--ink-soft);font-size:11px;line-height:1.25;text-decoration:none}.pgd-progress-breakdown b{color:var(--ink);font-size:12px;font-variant-numeric:tabular-nums}.pgd-progress-breakdown .is-ok{border-color:color-mix(in srgb,var(--ok,#198754) 35%,var(--line))}.pgd-progress-breakdown .is-warn{border-color:color-mix(in srgb,var(--warn,#b56b00) 45%,var(--line));background:color-mix(in srgb,var(--warn,#b56b00) 7%,var(--card))}.pgd-progress-breakdown a:hover{border-color:var(--accent);color:var(--ink)} .hero .hcta{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px} .alert{margin-bottom:24px} .sec{margin-bottom:36px} .sec-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px;flex-wrap:wrap} /* Header impilato: titolo sempre su una riga a sé, controlli sotto (coerente su ogni larghezza, non solo quando andrebbe a capo). */ .sec-head-stack{flex-direction:column;align-items:flex-start;gap:10px} .sec-head h2{margin:0;font-size:16px;font-weight:600;display:flex;align-items:center;gap:10px} .sec-head h2 .cnt{font-size:11px;font-weight:600;color:var(--ink-mute);background:var(--bg-2);border:1px solid var(--line);padding:2px 8px;border-radius:var(--radius-pill)} .mods{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px} .pf-card .progress > i{background:var(--accent)} .empty{text-align:center;padding:48px 24px;border:1.5px dashed var(--line);border-radius:var(--radius-lg);background:var(--bg-1);color:var(--ink-soft)} .empty .ico{font-size:32px;margin-bottom:10px;opacity:.6} .empty h4{margin:0 0 6px;font-size:15px;color:var(--ink);font-weight:600} .empty p{margin:0;font-size:13px} /* ---------- PLAYER MODULO ---------- */ .crumbs{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--ink-mute);margin-bottom:18px;flex-wrap:wrap} .crumbs a{color:var(--ink-mute)} .crumbs a:hover{color:var(--accent)} .crumbs .sep{opacity:.5} .player{display:grid;grid-template-columns:1fr 280px;gap:28px;align-items:start} @media (max-width:900px){.player{grid-template-columns:1fr}.player .side{order:-1}} .mod-hero{margin-bottom:24px} .mod-hero .eyebrow{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-mute);margin-bottom:10px} .mod-hero h1{margin:0 0 12px;font-size:30px;font-weight:700;letter-spacing:-.015em;line-height:1.15} .mod-hero .facts{display:flex;gap:16px;flex-wrap:wrap;font-size:13px;color:var(--ink-soft);align-items:center} .mod-hero .facts .sep{width:3px;height:3px;background:var(--ink-mute);border-radius:50%} .mod-progress{margin:18px 0 0;background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius);padding:12px 14px;display:flex;align-items:center;gap:14px} .mod-progress .lab{font-size:12px;color:var(--ink-soft);white-space:nowrap} .mod-progress .progress{flex:1} .tabs{display:flex;gap:4px;border-bottom:1px solid var(--line)} .tab{display:inline-flex;align-items:center;gap:8px;padding:11px 16px;font-size:13px;font-weight:600;color:var(--ink-soft);cursor:pointer;border:none;background:transparent;border-bottom:2px solid transparent;margin-bottom:-1px;transition:color var(--t-fast),border-color var(--t-fast)} .tab svg{width:15px;height:15px}.tab:hover{color:var(--ink)} .tab[aria-selected="true"]{color:var(--accent);border-bottom-color:var(--accent)} .tab .badge-mini{font-size:10px;padding:1px 6px;border-radius:999px;background:var(--bg-2);color:var(--ink-mute);font-weight:600} .panel{display:none;padding-top:22px}.panel.is-active{display:block} .pdf-stage{position:relative;background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden} .pdf-stage object,.pdf-stage iframe{width:100%;height:70vh;min-height:480px;border:none;display:block} .pdf-empty{aspect-ratio:16/10;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:var(--ink-mute);font-size:13px;text-align:center;padding:24px} .pdf-empty .doc-ico{width:48px;height:48px;color:var(--accent)} .video-stage{position:relative;aspect-ratio:16/9;background:#0a0a0a;border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden} .video-stage iframe{width:100%;height:100%;border:none;display:block} .video-empty{aspect-ratio:16/9;border:1.5px dashed var(--line);border-radius:var(--radius-lg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:var(--ink-mute);font-size:13px;text-align:center;padding:24px} /* prosa dispensa */ .reading{background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-lg);padding:32px 36px} .reading h1{font-size:24px;font-weight:700;letter-spacing:-.01em;margin:0 0 14px} .reading h2{font-size:20px;font-weight:700;letter-spacing:-.01em;margin:26px 0 8px} .reading h3{font-size:16px;font-weight:600;margin:22px 0 8px} .reading p{font-size:15px;line-height:1.7;color:var(--ink-soft);margin:0 0 16px} .reading strong{color:var(--ink);font-weight:600} .reading ul,.reading ol{margin:0 0 16px;padding-left:22px;color:var(--ink-soft);font-size:15px;line-height:1.7} .reading li{margin-bottom:6px} .reading code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.88em;background:var(--bg-2);padding:2px 6px;border-radius:5px;border:1px solid var(--line-soft)} .reading hr{border:none;border-top:1px solid var(--line);margin:24px 0} .reading .lf-callout{border-left:3px solid var(--accent);background:color-mix(in srgb,var(--accent) 6%,var(--bg-1));padding:14px 18px;border-radius:0 var(--radius) var(--radius) 0;margin:20px 0;font-size:14px;color:var(--ink-soft)} .reading .lf-table{width:100%;border-collapse:collapse;margin:18px 0;font-size:13px} .reading .lf-table th{text-align:left;padding:9px 12px;border-bottom:2px solid var(--line);color:var(--ink);font-weight:600} .reading .lf-table td{padding:9px 12px;border-bottom:1px solid var(--line-soft);color:var(--ink-soft);vertical-align:top} .quiz-cta{margin-top:28px;background:none;border-top:1px solid var(--line-soft);padding:18px 0 4px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap} .quiz-cta .qinfo{font-size:13px;color:var(--ink-soft)} .quiz-cta .qinfo strong{color:var(--ink)} .side{position:sticky;top:80px} .side-card{background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-lg);padding:16px;margin-bottom:16px} .side-card h4{margin:0 0 12px;font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-mute)} .side-list{display:flex;flex-direction:column;gap:2px} .side-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:var(--radius);font-size:13px;color:var(--ink-soft);transition:background var(--t-fast)} .side-item:hover{background:var(--bg-2)} .side-item.is-current{background:var(--bg-2);color:var(--ink);font-weight:600} .side-item .dot{flex:0 0 16px;width:16px;height:16px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:9px;border:1.5px solid var(--line)} .side-item .dot.done{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)} .side-item .dot.current{border-color:var(--accent)} .side-item .dot.current::after{content:"";width:8px;height:8px;border-radius:50%;background:var(--accent)} .side-item .t{flex:1;line-height:1.3} /* ---------- QUIZ ---------- */ .quiz-top{position:sticky;top:0;z-index:100;background:color-mix(in srgb,var(--bg-0) 88%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid var(--line-soft)} .quiz-top .inner{max-width:760px;margin:0 auto;padding:0 24px;height:60px;display:flex;align-items:center;justify-content:space-between;gap:16px} .quiz-top .exit{display:inline-flex;align-items:center;gap:7px;font-size:13px;color:var(--ink-soft);padding:6px 8px;border-radius:var(--radius)} .quiz-top .exit:hover{background:var(--bg-2);color:var(--ink)} .quiz-top .exit svg{width:15px;height:15px} .quiz-top .modtitle{font-size:13px;font-weight:600;color:var(--ink);text-align:center;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .quiz-top .count{font-size:12px;color:var(--ink-mute);font-variant-numeric:tabular-nums;white-space:nowrap} .quiz-steps{max-width:760px;margin:0 auto;padding:14px 24px 0} .steps{display:flex;gap:6px} .steps i{flex:1;height:4px;background:var(--bg-2);border-radius:999px} .steps i.done{background:var(--accent)} .steps i.current{background:linear-gradient(90deg,var(--accent) 50%,var(--bg-2) 50%)} .quiz-main{max-width:760px;margin:0 auto;padding:28px 24px 140px} .q-eyebrow{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin-bottom:12px} .q-text{font-size:23px;font-weight:700;letter-spacing:-.01em;line-height:1.3;margin:0 0 6px} .q-hint{font-size:13px;color:var(--ink-mute);margin:0 0 24px} .answers{display:flex;flex-direction:column;gap:12px} .q-nav{position:fixed;left:0;right:0;bottom:0;z-index:90;background:color-mix(in srgb,var(--bg-0) 90%,transparent);backdrop-filter:blur(14px);border-top:1px solid var(--line)} .q-nav .inner{max-width:760px;margin:0 auto;padding:16px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px} .q-nav .saved{display:inline-flex;align-items:center;gap:7px;font-size:12px;color:var(--ink-mute)} .q-nav .saved svg{width:13px;height:13px;color:var(--ok)} .q-nav .btns{display:flex;gap:10px} /* ---------- RISULTATO ---------- */ .res-main{max-width:760px;margin:0 auto;padding:40px 24px 80px} .res-hero{text-align:center;margin-bottom:36px} .res-badge{margin-bottom:18px} .res-ring{width:132px;height:132px;margin:0 auto 20px;border-radius:50%;display:grid;place-items:center;position:relative;background:conic-gradient(var(--c) calc(var(--p)*1%),var(--bg-2) 0)} .res-ring::after{content:"";position:absolute;inset:11px;border-radius:50%;background:var(--bg-0)} .res-ring .v{position:relative;z-index:1;text-align:center} .res-ring .v b{font-size:34px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1} .res-ring .v small{display:block;font-size:10px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-mute);margin-top:2px} .res-hero h1{font-size:26px;font-weight:700;letter-spacing:-.01em;margin:0 0 8px} .res-hero p{font-size:15px;color:var(--ink-soft);line-height:1.55;margin:0 auto;max-width:460px} .res-stats{display:flex;justify-content:center;margin:28px 0 8px;border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;background:var(--bg-1)} .res-stats .s{flex:1;padding:16px 12px;text-align:center;border-right:1px solid var(--line-soft)} .res-stats .s:last-child{border-right:none} .res-stats .s b{display:block;font-size:22px;font-weight:700;font-variant-numeric:tabular-nums} .res-stats .s span{font-size:11px;color:var(--ink-mute)} .res-stats .s.ok b{color:var(--ok)} .res-stats .s.err b{color:var(--err)} .review{margin-top:36px} .review > h2{font-size:15px;font-weight:600;margin:0 0 14px;display:flex;align-items:center;gap:9px} .review > h2 .n{font-size:11px;font-weight:700;background:color-mix(in srgb,var(--err) 16%,var(--bg-1));color:var(--err);border:1px solid var(--err);padding:2px 8px;border-radius:var(--radius-pill)} .rev-item{background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-lg);padding:18px;margin-bottom:12px} .rev-q{font-size:14px;font-weight:600;margin:0 0 14px;line-height:1.4} .rev-a{display:flex;align-items:flex-start;gap:10px;font-size:13px;padding:10px 12px;border-radius:var(--radius);margin-bottom:8px;line-height:1.5} .rev-a .ico{flex:0 0 18px;width:18px;height:18px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;margin-top:1px} .rev-a .lab{font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.7;display:block;margin-bottom:2px} .rev-a.yours{background:color-mix(in srgb,var(--err) 10%,var(--bg-1));border:1px solid color-mix(in srgb,var(--err) 30%,var(--line))} .rev-a.yours .ico{background:var(--err);color:var(--err-ink)} .rev-a.correct{background:color-mix(in srgb,var(--ok) 10%,var(--bg-1));border:1px solid color-mix(in srgb,var(--ok) 30%,var(--line))} .rev-a.correct .ico{background:var(--ok);color:var(--ok-ink)} .rev-why{margin-top:12px;font-size:13px;color:var(--ink-soft);line-height:1.6;border-left:3px solid var(--accent);padding:8px 14px;background:color-mix(in srgb,var(--accent) 5%,var(--bg-1));border-radius:0 var(--radius) var(--radius) 0} .rev-why strong{color:var(--ink)} .res-cta{display:flex;gap:12px;justify-content:center;margin-top:36px;flex-wrap:wrap} /* ---------- ATTESTATO (stampa) ---------- */ .cert-actions{max-width:840px;margin:24px auto 0;padding:0 24px;display:flex;justify-content:space-between;gap:12px} .cert-sheet{max-width:840px;margin:18px auto 60px;padding:0 24px} .cert-doc{background:var(--bg-1);border:1px solid var(--accent-soft);border-radius:var(--radius-lg);padding:54px 56px;text-align:center;position:relative;overflow:hidden} .cert-doc::before{content:"";position:absolute;right:-70px;top:-70px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,var(--accent) 0%,transparent 70%);opacity:.12;pointer-events:none} .cert-top{display:flex;align-items:center;justify-content:center;gap:14px;margin-bottom:26px} .cert-org{font-weight:700;font-size:16px} .cert-eyebrow2{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin-bottom:24px} .cert-intro{font-size:14px;color:var(--ink-mute);margin:0 0 6px} .cert-name{font-size:34px;font-weight:700;letter-spacing:-.02em;margin:0 0 14px} .cert-body{font-size:14px;color:var(--ink-soft);margin:0 0 4px} .cert-mod{font-size:22px;font-weight:600;margin:0 0 14px;color:var(--ink)} .cert-score{font-size:14px;color:var(--ink-soft);margin:0 0 34px} .cert-foot2{display:flex;justify-content:center;gap:40px;border-top:1px solid var(--line);padding-top:22px} .cert-foot2 span{display:block;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-mute);margin-bottom:3px} .cert-foot2 b{font-size:14px;font-variant-numeric:tabular-nums} /* Stampa = copia esatta dello schermo: forza la resa di sfondi/colori, nasconde solo la toolbar */ /* Attestato in stampa: foglio ORIZZONTALE, card a tutta pagina e centrata, copia esatta dei colori */ @media print{ /* SOLO il certificato/attestato: foglio orizzontale + grafica avorio mantenuta. */ .no-print{display:none!important} *{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important} @page cert{size:A4 landscape;margin:0} html,body{height:100%} .cert-sheet{margin:0;padding:0;min-height:100vh;display:flex;align-items:center;justify-content:center;page:cert} .cert-doc{width:100%;max-width:none;min-height:92vh;margin:0;display:flex;flex-direction:column;justify-content:center;border-radius:0} } /* Meeting: creazione immediata di un appuntamento gia' concordato. */ .mt-direct-page{position:relative;max-width:none;min-height:calc(100dvh - 122px);padding:20px!important} .mt-direct-dialog{--mtw-accent:#00e7d2;--mtw-accent-hover:#00cdbb;--mtw-ink:#06110f;--accent:var(--mtw-accent);--accent-ink:var(--mtw-ink);position:fixed;inset:0;z-index:1200;width:min(900px,calc(100vw - 36px));max-width:none;max-height:calc(100dvh - 36px);margin:auto;padding:0;overflow:visible;border:0;background:transparent;color:var(--text)} .mt-direct-dialog::backdrop{background:rgba(2,5,5,.76);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)} .mt-direct-dialog[open]{display:block} body.mt-direct-dialog-open{overflow:hidden} .mt-direct-dialog .mt-direct-dialog-shell{width:100%;height:calc(100dvh - 36px);max-height:calc(100dvh - 36px);grid-template-rows:minmax(0,1fr);align-items:stretch} .mt-direct-wizard-main{height:100%;max-height:100%;min-height:0;overflow:hidden} .mt-direct-notice{margin:0 20px 10px;display:grid;gap:3px}.mt-direct-notice strong{font-size:14px}.mt-direct-notice span{line-height:1.45}.mt-direct-notice small{opacity:.78}.mt-direct-empty{margin:18px 20px} .mt-direct-force-notice{background:color-mix(in srgb,var(--warn) 11%,var(--bg-1));border-color:color-mix(in srgb,var(--warn) 52%,var(--line));box-shadow:0 10px 28px color-mix(in srgb,var(--warn) 9%,transparent)}.mt-direct-force-notice strong{color:var(--warn)}.mt-direct-force-notice span b{color:var(--text)} .mt-direct-card{display:flex;min-height:0;flex:1 1 auto;overflow:hidden;border:0;border-radius:0;background:var(--bg-1);box-shadow:none} .mt-direct-main,.mt-direct-side{display:flex;width:100%;min-height:0;flex-direction:column;gap:13px;padding:16px 20px 20px;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;scroll-padding-bottom:20px} .mt-direct-main[hidden],.mt-direct-side[hidden]{display:none} .mt-direct-side{border:0;background:var(--bg-1)} .mt-direct-section-head{display:flex;align-items:center;gap:12px} .mt-direct-section-head>span{display:grid;place-items:center;flex:0 0 34px;height:34px;border-radius:50%;background:var(--mtw-accent);color:var(--mtw-ink);font-size:12px;font-weight:900} .mt-direct-section-head h2{margin:0;font-size:19px;line-height:1.1} .mt-direct-section-head p{margin:3px 0 0;color:var(--muted);font-size:11px} .mt-direct-card label,.mt-direct-card legend{color:var(--text);font-size:11px;font-weight:800} .mt-direct-card label>small,.mt-direct-card legend small{color:var(--muted);font-weight:600} .mt-direct-card .mt-in{width:100%;min-height:42px;margin-top:6px;border:1.5px solid color-mix(in srgb,var(--ink) 23%,var(--line));border-radius:11px;background:var(--bg-1)} .mt-direct-card .mt-in:focus{outline:3px solid color-mix(in srgb,var(--mtw-accent) 20%,transparent);border-color:var(--mtw-accent)} .mt-direct-title input{font-size:15px;font-weight:750} .mt-direct-types,.mt-direct-internals{margin:0;padding:0;border:0} .mt-direct-types>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:7px} .mt-direct-types label,.mt-direct-internals label{position:relative;cursor:pointer} .mt-direct-types input,.mt-direct-internals input{position:absolute;opacity:0;pointer-events:none} .mt-direct-types label>span{position:relative;display:grid;grid-template-columns:34px minmax(0,1fr) auto;grid-template-rows:auto auto;column-gap:9px;min-height:62px;padding:10px;border:1px solid var(--line);border-radius:12px;background:var(--bg-2)} .mt-direct-types label>span>i{grid-row:1/3;display:grid;place-items:center;width:34px;height:34px;align-self:center;border-radius:10px;background:color-mix(in srgb,var(--mt-type-color) 14%,transparent);color:var(--mt-type-color);font-style:normal}.mt-direct-types label>span>i svg{width:18px;height:18px} .mt-direct-types label>span>b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px} .mt-direct-types label>span>small{color:var(--muted);font-size:9px;font-weight:550} .mt-direct-types label>span>em{display:none;grid-column:3;grid-row:1/3;align-self:center;font-style:normal} .mt-direct-types input:checked+span,.mt-direct-internals input:checked+span{border-color:var(--primary);background:color-mix(in srgb,var(--primary) 9%,var(--bg-2))} .mt-direct-types input:checked+span>em,.mt-direct-internals input:checked+span>em{display:block;color:var(--primary)} .mt-direct-when{display:grid;grid-template-columns:1fr 1fr;gap:10px} .mt-direct-date-control{display:block;margin-top:6px} .mt-direct-date-control button{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;height:42px;padding:0 13px;border:1.5px solid color-mix(in srgb,var(--ink) 23%,var(--line));border-radius:11px;background:var(--bg-1);color:var(--muted);font:inherit;font-weight:800;text-align:left;cursor:pointer} .mt-direct-date-control button:hover,.mt-direct-date-control button:focus-visible,.mt-direct-date-control button[aria-expanded="true"]{outline:0;border-color:var(--mtw-accent);color:var(--mtw-accent);background:color-mix(in srgb,var(--mtw-accent) 8%,var(--bg-1))} .mt-direct-date-control button>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .mt-direct-date-control svg{width:18px;height:18px} .mt-direct-busy-calendar{position:relative;display:grid;gap:7px;padding:10px;border:1px solid color-mix(in srgb,var(--mtw-accent) 30%,var(--line));border-radius:13px;background:var(--bg-1);box-shadow:0 14px 32px rgba(0,0,0,.18)} .mt-direct-busy-calendar[hidden]{display:none!important} .mt-direct-busy-calendar>header{display:grid;grid-template-columns:30px 1fr 30px;align-items:center;gap:7px} .mt-direct-busy-calendar>header b{text-align:center;font-size:11px;text-transform:capitalize} .mt-direct-busy-calendar>header button{display:grid;place-items:center;width:30px;height:30px;padding:0;border:1px solid var(--line);border-radius:9px;background:var(--bg-2);color:var(--text);font-size:20px;line-height:1;cursor:pointer} .mt-direct-busy-calendar>header button:disabled{opacity:.28;cursor:default} .mt-direct-calendar-weekdays,.mt-direct-calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px} .mt-direct-calendar-weekdays span{color:var(--muted);font-size:8px;font-weight:850;text-align:center;text-transform:uppercase} .mt-direct-calendar-grid>span{min-height:28px} .mt-direct-calendar-grid>button{position:relative;display:grid;place-items:center;min-width:0;height:30px;padding:0;border:1px solid transparent;border-radius:8px;background:transparent;color:var(--text);font:inherit;font-size:10px;font-weight:750;cursor:pointer} .mt-direct-calendar-grid>button:hover,.mt-direct-calendar-grid>button:focus-visible{outline:0;border-color:var(--mtw-accent);background:color-mix(in srgb,var(--mtw-accent) 8%,var(--bg-2))} .mt-direct-calendar-grid>button.has-free{color:var(--mtw-accent)} .mt-direct-calendar-grid>button.has-busy:after{content:"";position:absolute;right:4px;bottom:3px;width:4px;height:4px;border-radius:50%;background:var(--warn)} .mt-direct-calendar-grid>button.is-selected{border-color:var(--mtw-accent);background:var(--mtw-accent);color:var(--mtw-ink)} .mt-direct-calendar-grid>button.is-selected:after{background:var(--mtw-ink)} .mt-direct-calendar-grid>button:disabled{opacity:.24;cursor:default} .mt-direct-calendar-grid>p{grid-column:1/-1;margin:8px 0;color:var(--muted);font-size:10px;text-align:center} .mt-direct-slot-popover{position:absolute;z-index:5;right:10px;bottom:calc(100% - var(--mt-direct-slot-anchor-top,0px));left:10px;display:grid;max-height:calc(100% - 56px);gap:8px;overflow:auto;padding:11px;border:1.5px solid color-mix(in srgb,var(--mtw-accent) 58%,var(--line));border-radius:12px;background:var(--bg-2);box-shadow:0 18px 44px rgba(0,0,0,.58);color:var(--ink);isolation:isolate} .mt-direct-slot-popover[hidden]{display:none!important} .mt-direct-slot-popover>header{display:flex;align-items:center;justify-content:space-between;gap:8px} .mt-direct-slot-popover>header>div{display:grid;min-width:0;gap:2px}.mt-direct-slot-popover>header span{color:var(--mtw-accent);font-size:8px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}.mt-direct-slot-popover>header strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;text-transform:capitalize} .mt-direct-slot-popover>header button{display:grid;place-items:center;flex:0 0 24px;width:24px;height:24px;padding:0;border:1px solid var(--line);border-radius:50%;background:var(--bg-1);color:var(--ink-soft);font-size:16px;line-height:1;cursor:pointer} .mt-direct-slot-popover>header button:hover,.mt-direct-slot-popover>header button:focus-visible{outline:0;background:color-mix(in srgb,var(--mtw-accent) 12%,transparent);color:var(--mtw-accent)} .mt-direct-slot-help{margin:0;color:var(--ink-soft);font-size:9px;line-height:1.35} .mt-direct-slot-popover>[data-mt-direct-slot-list]{display:grid;grid-template-columns:repeat(auto-fit,minmax(52px,1fr));gap:6px;min-height:0} .mt-direct-slot-popover>[data-mt-direct-slot-list]>button{min-width:0;height:31px;padding:0 7px;border:1px solid var(--line);border-radius:8px;background:var(--bg-1);color:var(--ink);font:inherit;font-size:10px;font-weight:850;cursor:pointer} .mt-direct-slot-popover>[data-mt-direct-slot-list]>button:hover,.mt-direct-slot-popover>[data-mt-direct-slot-list]>button:focus-visible,.mt-direct-slot-popover>[data-mt-direct-slot-list]>button.is-selected{outline:0;border-color:var(--mtw-accent);background:color-mix(in srgb,var(--mtw-accent) 12%,var(--bg-2));color:var(--mtw-accent)} .mt-direct-slot-popover>p[data-mt-direct-slot-empty]{margin:0;padding:8px;border-radius:8px;background:var(--bg-1);color:var(--ink-soft);font-size:10px;line-height:1.4} .mt-direct-busy-calendar>footer{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:7px;border-top:1px solid var(--line);color:var(--muted);font-size:9px} .mt-direct-busy-calendar>footer>span{display:flex;align-items:center;gap:5px;white-space:nowrap}.mt-direct-busy-calendar>footer i{width:5px;height:5px;border-radius:50%;background:var(--warn)} .mt-direct-busy-calendar>footer b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text);font-size:9px;text-align:right} .mt-direct-time-status{margin:-2px 0 0;padding:7px 9px;border:1px solid var(--line);border-radius:9px;background:var(--bg-2);color:var(--muted);font-size:10px;font-weight:650} .mt-direct-time-status.is-free{border-color:color-mix(in srgb,var(--ok) 42%,var(--line));background:color-mix(in srgb,var(--ok) 7%,var(--bg-2));color:var(--ok)} .mt-direct-time-status.is-busy{border-color:color-mix(in srgb,var(--warn) 48%,var(--line));background:color-mix(in srgb,var(--warn) 8%,var(--bg-2));color:var(--warn)} .mt-direct-time-status.is-loading{color:var(--mtw-accent)} .mt-direct-address[hidden]{display:none} .mt-direct-add{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px;align-items:end;margin-top:8px} .mt-direct-add .mt-in{margin:0} .mt-direct-email-list{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px} .mt-direct-email-list>span{display:inline-flex;align-items:center;gap:8px;max-width:100%;padding:7px 9px 7px 12px;border:1px solid color-mix(in srgb,var(--primary) 52%,var(--line));border-radius:999px;background:color-mix(in srgb,var(--primary) 8%,var(--bg-2));color:var(--text)} .mt-direct-email-list b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px} .mt-direct-email-list button{display:grid;place-items:center;width:22px;height:22px;padding:0;border:0;border-radius:50%;background:transparent;color:var(--muted);font-size:18px;cursor:pointer} .mt-direct-external>p{margin:8px 0 0;color:var(--err);font-size:12px;font-weight:700} .mt-direct-clients{position:relative;display:grid;gap:8px} .mt-direct-clients>label{display:block} .mt-direct-client-search{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center} .mt-direct-client-search .mt-in{margin:0} .mt-direct-client-search button{height:38px;padding:0 12px;border:1px solid var(--line);border-radius:11px;background:var(--bg-2);color:var(--text);font-size:11px;font-weight:800;cursor:pointer} .mt-direct-client-search button:hover,.mt-direct-client-search button:focus-visible{border-color:var(--primary);color:var(--primary)} .mt-direct-client-list{position:relative;z-index:1;display:grid;min-width:0;width:100%;max-height:238px;overflow:auto;padding:6px;border:1px solid color-mix(in srgb,var(--primary) 38%,var(--line));border-radius:13px;background:var(--panel);box-shadow:0 12px 30px rgba(0,0,0,.2)} .mt-direct-client-list[hidden],.mt-direct-client-selected[hidden],[data-mt-direct-new-client][hidden]{display:none!important} .mt-direct-client-list>button{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:45px;padding:8px 10px;border:1px solid transparent;border-radius:10px;background:transparent;color:var(--text);text-align:left;cursor:pointer} .mt-direct-client-list>button:hover,.mt-direct-client-list>button:focus-visible{border-color:var(--primary);background:color-mix(in srgb,var(--primary) 9%,var(--bg-2))} .mt-direct-client-list>button span{display:grid;min-width:0;gap:1px}.mt-direct-client-list>button b,.mt-direct-client-list>button small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mt-direct-client-list>button small{color:var(--muted);font-size:10px}.mt-direct-client-list>button em{color:var(--primary);font-size:10px;font-style:normal;font-weight:800} .mt-direct-client-list>p{margin:0;padding:10px;color:var(--muted);font-size:11px;text-align:center} .mt-direct-client-selected{display:grid;gap:8px;padding:10px;border:1px solid color-mix(in srgb,var(--primary) 44%,var(--line));border-radius:13px;background:color-mix(in srgb,var(--primary) 7%,var(--bg-2))} .mt-direct-client-selected>header{display:flex;align-items:center;justify-content:space-between;gap:12px}.mt-direct-client-selected>header span{display:grid;gap:1px}.mt-direct-client-selected>header small,.mt-direct-client-selected>header em{color:var(--muted);font-size:9px;font-style:normal}.mt-direct-client-selected>header b{font-size:13px} .mt-direct-client-contacts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px} .mt-direct-client-contacts>label{display:flex;align-items:center;gap:8px;min-width:0;padding:7px 8px;border:1px solid var(--line);border-radius:9px;background:var(--bg-2);cursor:pointer} .mt-direct-client-contacts>label span{display:grid;min-width:0}.mt-direct-client-contacts b,.mt-direct-client-contacts small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mt-direct-client-contacts b{font-size:10px}.mt-direct-client-contacts small{color:var(--muted);font-size:9px;font-weight:550} .mt-direct-attach-client{display:flex;align-items:center;gap:9px;padding-top:8px;border-top:1px solid var(--line);cursor:pointer}.mt-direct-attach-client>span{display:grid;gap:1px}.mt-direct-attach-client b{font-size:10px}.mt-direct-attach-client small{color:var(--muted);font-size:9px;font-weight:550} .mt-direct-save-client{display:flex;align-items:center;gap:10px;padding:11px 13px;border:1px solid var(--line);border-radius:13px;background:var(--bg-2);cursor:pointer} .mt-direct-save-client>span{display:grid;gap:2px}.mt-direct-save-client small{color:var(--muted);font-size:10px;font-weight:550} .mt-direct-client-name[hidden]{display:none} .mt-wizard-client-picker{margin:0 0 18px;border:1px solid var(--line);border-radius:18px;background:color-mix(in srgb,var(--panel) 82%,transparent);overflow:hidden} .mt-wizard-client-picker>summary{cursor:pointer;list-style:none;padding:13px 16px;font-weight:800;color:var(--text)} .mt-wizard-client-picker>summary::-webkit-details-marker{display:none} .mt-wizard-client-picker>summary:after{content:'+';float:right;color:var(--primary);font-size:20px;line-height:1} .mt-wizard-client-picker[open]>summary:after{content:'−'} .mt-wizard-client-picker>div{max-height:190px;overflow:auto;padding:0 12px 12px;display:grid;gap:10px} .mt-wizard-client-picker section{display:grid;grid-template-columns:minmax(110px,.38fr) 1fr;gap:12px;align-items:start;padding:10px;border:1px solid var(--line);border-radius:14px} .mt-wizard-client-picker section>b{padding:8px 5px;font-size:13px} .mt-wizard-client-picker section>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px} .mt-wizard-client-picker button{border:1px solid var(--line);border-radius:11px;background:var(--bg-2);color:var(--text);padding:8px 10px;text-align:left;display:grid;gap:2px;cursor:pointer} .mt-wizard-client-picker button:hover,.mt-wizard-client-picker button:focus-visible,.mt-wizard-client-picker button.is-added{border-color:var(--primary);background:color-mix(in srgb,var(--primary) 9%,var(--bg-2))} .mt-wizard-client-picker button span{font-weight:750;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .mt-wizard-client-picker button small{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .mt-wizard-client-picker.is-group{margin-bottom:14px} .mt-addressbook-picker{position:relative;display:grid;gap:8px;margin:0 0 16px;padding:10px;border:1px solid var(--line);border-radius:15px;background:color-mix(in srgb,var(--panel) 82%,transparent)} .mt-addressbook-picker>label,.mt-addressbook-picker>[data-mt-direct-addressbook-panel]{display:grid;gap:6px;margin:0} .mt-addressbook-picker .mt-in{width:100%;min-height:40px} .mt-addressbook-switch{display:inline-flex;justify-self:start;gap:3px;padding:3px;border:1px solid var(--line);border-radius:999px;background:var(--bg-2)} .mt-addressbook-switch button{min-height:30px;padding:5px 12px;border:0;border-radius:999px;background:transparent;color:var(--muted);font:inherit;font-size:10px;font-weight:800;cursor:pointer} .mt-addressbook-switch button:hover,.mt-addressbook-switch button:focus-visible{color:var(--text)} .mt-addressbook-switch button.is-active{background:var(--primary);color:var(--primary-ink)} .mt-addressbook-results{position:absolute;z-index:20;top:calc(100% - 3px);right:10px;left:10px;display:grid;gap:4px;max-height:230px;padding:6px;overflow:auto;border:1px solid color-mix(in srgb,var(--primary) 48%,var(--line));border-radius:13px;background:var(--panel);box-shadow:0 16px 38px rgba(0,0,0,.26)} .mt-addressbook-results[hidden],.mt-addressbook-picker [data-mt-direct-addressbook-panel][hidden]{display:none!important} .mt-addressbook-results>button{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:45px;padding:7px 10px;border:1px solid transparent;border-radius:10px;background:var(--bg-2);color:var(--text);text-align:left;cursor:pointer} .mt-addressbook-results>button:hover,.mt-addressbook-results>button:focus-visible{border-color:var(--primary);background:color-mix(in srgb,var(--primary) 8%,var(--bg-2))} .mt-addressbook-results>button span{display:grid;min-width:0;gap:2px}.mt-addressbook-results>button b,.mt-addressbook-results>button small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mt-addressbook-results>button b{font-size:11px}.mt-addressbook-results>button small{color:var(--muted);font-size:9px}.mt-addressbook-results>button em{flex:0 0 auto;color:var(--primary);font-size:9px;font-style:normal;font-weight:850} .mt-addressbook-empty{margin:0;padding:11px;color:var(--muted);font-size:10px;text-align:center} .mt-addressbook-picker.is-direct{margin:2px 0 10px}.mt-addressbook-picker.is-direct .mt-direct-clients{margin:0;padding:0;border:0;background:transparent}.mt-addressbook-picker.is-direct .mt-addressbook-results{top:auto;margin-top:5px} .mt-direct-internals>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-top:7px} .mt-direct-internals label>span{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 7px;min-height:52px;padding:9px 10px;border:1px solid var(--line);border-radius:12px;background:var(--bg-2)} .mt-direct-internals b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px} .mt-direct-internals small{grid-column:1;color:var(--muted);font-size:9px;font-weight:550} .mt-direct-internals em{display:none;grid-column:2;grid-row:1/3;align-self:center;font-style:normal} .mt-direct-owner{display:flex;justify-content:space-between;gap:15px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--bg-2)} .mt-direct-owner span{color:var(--muted);font-size:10px;font-weight:750;text-transform:uppercase;letter-spacing:.06em} .mt-direct-owner b{font-size:11px} .mt-direct-step-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-top:auto;padding-top:2px}.mt-direct-step-actions .btn{min-width:116px}.mt-direct-step-actions .btn-primary{background:var(--mtw-accent);border-color:var(--mtw-accent);color:var(--mtw-ink)}.mt-direct-step-actions .btn-primary:hover{background:var(--mtw-accent-hover);border-color:var(--mtw-accent-hover);color:var(--mtw-ink)} .mt-direct-submit{margin:0} @media(max-width:700px){.mt-direct-page{padding:8px!important}.mt-direct-dialog{width:calc(100vw - 16px);max-height:calc(100dvh - 16px)}.mt-direct-dialog .mt-direct-dialog-shell{height:calc(100dvh - 16px);max-height:calc(100dvh - 16px);grid-template-rows:auto minmax(0,1fr)}.mt-direct-main,.mt-direct-side{padding:12px 14px 14px}.mt-direct-types>div,.mt-direct-internals>div,.mt-direct-when,.mt-direct-client-contacts{grid-template-columns:1fr 1fr}.mt-direct-step-actions .btn{min-width:94px}.mt-wizard-client-picker section{grid-template-columns:1fr}.mt-wizard-client-picker section>div{grid-template-columns:1fr}.mt-addressbook-picker{padding:8px}.mt-addressbook-switch{width:100%}.mt-addressbook-switch button{flex:1}.mt-addressbook-results{right:8px;left:8px;max-height:190px}} @media(max-width:430px){.mt-direct-types>div,.mt-direct-internals>div,.mt-direct-when,.mt-direct-client-contacts{grid-template-columns:1fr}.mt-direct-busy-calendar>footer{align-items:flex-start;flex-direction:column}.mt-direct-busy-calendar>footer b{width:100%;white-space:normal;text-align:left}.mt-direct-step-actions{align-items:stretch}.mt-direct-step-actions .btn{flex:1;min-width:0}} /* ---------- ATTESTATI lista ---------- */ .att-head{margin-bottom:28px} .att-head h1{font-size:28px;font-weight:700;letter-spacing:-.01em;margin:0 0 8px} .att-head p{font-size:14px;color:var(--ink-soft);margin:0;max-width:560px;line-height:1.55} .att-global{margin-bottom:36px;background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 9%,var(--bg-1)) 0%,var(--bg-1) 70%);border:1px solid var(--accent-soft);border-radius:var(--radius-lg);padding:26px;display:flex;align-items:center;gap:26px;position:relative;overflow:hidden;flex-wrap:wrap} .att-global.ready{border-color:var(--ok)} .att-global .seal{flex:0 0 88px;width:88px;height:88px;border-radius:50%;border:3px solid var(--accent);background:var(--bg-0);display:flex;align-items:center;justify-content:center;color:var(--accent)} .att-global .seal svg{width:42px;height:42px} .att-global .gtxt{flex:1;min-width:240px} .att-global .geyebrow{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin-bottom:6px} .att-global h2{font-size:21px;font-weight:700;letter-spacing:-.01em;margin:0 0 8px} .att-global .gmeta{display:flex;gap:16px;flex-wrap:wrap;font-size:12px;color:var(--ink-mute)} .att-global .gmeta b{color:var(--ink-soft);font-weight:600} .att-sec{font-size:13px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-mute);margin:0 0 16px} .certs{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px} .cert-card{background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 6%,var(--bg-1)) 0%,var(--bg-1) 80%);border:1px solid var(--accent-soft);border-radius:var(--radius-lg);padding:20px;display:flex;flex-direction:column;gap:14px;position:relative;overflow:hidden} .cert-card.locked{opacity:.6;background:var(--bg-1);border-color:var(--line)} .cert-card .cert-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px} .cert-card .cert-eyebrow{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);font-weight:700} .cert-card.locked .cert-eyebrow{color:var(--ink-mute)} .cert-card .cert-title{font-size:15px;font-weight:600;margin:4px 0 0} .cert-card .cert-meta{font-size:11px;color:var(--ink-mute);margin-top:4px} .cert-card .cert-seal{width:44px;height:44px;border-radius:50%;border:2px solid var(--accent);display:flex;align-items:center;justify-content:center;color:var(--accent);font-size:16px;font-weight:700;background:var(--bg-0);flex:0 0 44px} .cert-card.locked .cert-seal{border-color:var(--line);color:var(--ink-mute)} .cert-card .cert-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:auto} .cert-card .code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11px;color:var(--ink-mute);background:var(--bg-2);padding:2px 7px;border-radius:5px;border:1px solid var(--line-soft)} /* ---------- IMMAGINI nel testo (illustrazioni) ---------- */ .reading .lf-figure{margin:22px 0;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--line);background:var(--bg-2)} .reading .lf-figure img{display:block;width:100%;height:auto} .reading .lf-figure figcaption{font-size:12px;color:var(--ink-mute);padding:8px 14px;text-align:center} .reading .lf-inline-img{max-width:100%;height:auto;border-radius:var(--radius);vertical-align:middle} /* rete di sicurezza: se WP rimette le emoji-immagine, restano grandi come il testo */ .reading img.emoji{display:inline-block;width:1em;height:1em;margin:0 .07em;vertical-align:-.12em;border:none;background:none;box-shadow:none} /* ---------- INFOGRAFICHE in codice ---------- */ .reading .lf-info{margin:24px 0} .reading .lf-info-cap{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:12px;text-align:center} .lf-info-cols{display:grid;grid-template-columns:1fr 1fr;gap:14px} @media (max-width:640px){.lf-info-cols{grid-template-columns:1fr}} .lf-info-col{border:1px solid var(--line);border-radius:var(--radius-lg);padding:18px;background:var(--bg-1)} .lf-info-col.good{border-color:color-mix(in srgb,var(--ok) 45%,var(--line));background:color-mix(in srgb,var(--ok) 6%,var(--bg-1))} .lf-info-col.bad{border-color:color-mix(in srgb,var(--warn) 45%,var(--line));background:color-mix(in srgb,var(--warn) 6%,var(--bg-1))} .lf-info-h{display:flex;align-items:center;gap:9px;font-size:14px;font-weight:700;color:var(--ink);margin-bottom:12px} .lf-info-h svg{width:20px;height:20px;flex:0 0 20px} .lf-info-col.good .lf-info-h svg{color:var(--ok)} .lf-info-col.bad .lf-info-h svg{color:var(--warn)} .lf-info-col ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:9px} .lf-info-col li{position:relative;padding-left:20px;font-size:13px;line-height:1.5;color:var(--ink-soft)} .lf-info-col li::before{content:"";position:absolute;left:2px;top:7px;width:7px;height:7px;border-radius:50%} .lf-info-col.good li::before{background:var(--ok)} .lf-info-col.bad li::before{background:var(--warn)} /* infografica: 3 pilastri / passi */ .lf-info-prow{display:grid;grid-template-columns:repeat(3,1fr);gap:14px} @media (max-width:640px){.lf-info-prow{grid-template-columns:1fr}} .lf-info-pillar{border:1px solid var(--line);border-radius:var(--radius-lg);padding:18px;background:var(--bg-1);position:relative} .lf-info-num{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:var(--accent);color:var(--accent-ink);font-weight:700;font-size:14px;margin-bottom:10px} .lf-info-pillar b{display:block;font-size:14px;color:var(--ink);margin-bottom:6px} .lf-info-pillar p{margin:0;font-size:12.5px;line-height:1.55;color:var(--ink-soft)} /* infografica: timeline verticale */ .lf-tl{list-style:none;margin:0;padding:0 0 0 6px;position:relative} .lf-tl::before{content:"";position:absolute;left:11px;top:6px;bottom:6px;width:2px;background:var(--line)} .lf-tl-item{position:relative;padding:0 0 18px 34px;min-height:24px} .lf-tl-item:last-child{padding-bottom:0} .lf-tl-dot{position:absolute;left:4px;top:2px;width:16px;height:16px;border-radius:50%;background:var(--bg-1);border:2px solid var(--line)} .lf-tl-item.on .lf-tl-dot{border-color:var(--accent);background:var(--accent)} .lf-tl-date{display:block;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--accent)} .lf-tl-item:not(.on) .lf-tl-date{color:var(--ink-mute)} .lf-tl-text{display:block;font-size:13.5px;line-height:1.5;color:var(--ink-soft);margin-top:2px} /* ---------- LOCK: un solo modulo avviato per volta ---------- */ .player.pf-locked{filter:saturate(.55);opacity:.45;pointer-events:none;user-select:none} .pf-modal-backdrop{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:24px;background:color-mix(in srgb,var(--bg-0) 55%,transparent);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);animation:pf-fade .18s ease} @keyframes pf-fade{from{opacity:0}to{opacity:1}} .pf-modal{width:100%;max-width:440px;background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-2);padding:30px 28px;text-align:center;animation:pf-pop .2s cubic-bezier(.2,.8,.3,1)} @keyframes pf-pop{from{transform:translateY(8px) scale(.98);opacity:0}to{transform:none;opacity:1}} .pf-modal-ico{width:52px;height:52px;margin:0 auto 14px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--warn) 14%,var(--bg-1));color:var(--warn)} .pf-modal-ico svg{width:26px;height:26px} .pf-modal h2{margin:0 0 10px;font-size:19px;font-weight:700;letter-spacing:-.01em;color:var(--ink)} .pf-modal p{margin:0 0 8px;font-size:14px;line-height:1.6;color:var(--ink-soft)} .pf-modal .pf-modal-q{margin-top:12px;color:var(--ink)} .pf-modal-actions{display:flex;flex-direction:column;gap:10px;margin-top:22px} .pf-modal-actions form{margin:0} .pf-modal-actions .btn{width:100%;justify-content:center} /* infografica: griglia di carte con icona */ .lf-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px} .lf-card{border:1px solid var(--line);border-radius:var(--radius-lg);padding:16px;background:var(--bg-1)} .lf-card-ico{display:inline-flex;width:34px;height:34px;border-radius:10px;align-items:center;justify-content:center;background:color-mix(in srgb,var(--accent) 12%,var(--bg-1));color:var(--accent);margin-bottom:10px} .lf-card-ico svg{width:18px;height:18px} .lf-card b{display:block;font-size:13.5px;color:var(--ink);margin-bottom:5px} .lf-card p{margin:0;font-size:12.5px;line-height:1.5;color:var(--ink-soft)} /* infografica: flow a passi numerati */ .lf-flow{display:grid;grid-template-columns:repeat(auto-fit,minmax(155px,1fr));gap:14px} .lf-step{position:relative;border:1px solid var(--line);border-radius:var(--radius-lg);padding:16px;background:var(--bg-1)} .lf-step-n{display:inline-flex;width:26px;height:26px;border-radius:50%;align-items:center;justify-content:center;background:var(--accent);color:var(--accent-ink);font-weight:700;font-size:13px;margin-bottom:10px} .lf-step b{display:block;font-size:13.5px;color:var(--ink);margin-bottom:5px} .lf-step p{margin:0;font-size:12.5px;line-height:1.5;color:var(--ink-soft)} @media (min-width:641px){.lf-flow .lf-step:not(:last-child)::after{content:"›";position:absolute;right:-11px;top:50%;transform:translateY(-50%);color:var(--ink-mute);font-size:22px;line-height:1;z-index:1}} /* infografica: checklist (spunta/crocetta) */ .lf-checklist{list-style:none;margin:0;padding:0;display:grid;gap:8px} .lf-checklist li{display:flex;align-items:flex-start;gap:10px;font-size:13.5px;line-height:1.5;color:var(--ink-soft);border:1px solid var(--line-soft);border-radius:var(--radius);padding:10px 12px;background:var(--bg-1)} .lf-ck-ico{flex:0 0 auto;width:20px;height:20px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;margin-top:1px} .lf-ck-ico svg{width:13px;height:13px} .lf-checklist li.is-ok .lf-ck-ico{background:color-mix(in srgb,var(--ok) 16%,var(--bg-1));color:var(--ok)} .lf-checklist li.is-no .lf-ck-ico{background:color-mix(in srgb,var(--warn) 16%,var(--bg-1));color:var(--warn)} /* ============================================================ GESTIONE (admin) /formazione/gestione/ ============================================================ */ .mg-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:22px} .mg-head h1{margin:0 0 4px;font-size:24px;font-weight:700;letter-spacing:-.01em} .mg-sub{margin:0;font-size:13.5px;color:var(--ink-soft);max-width:560px;line-height:1.5} .mg-tabs{display:flex;gap:4px;background:var(--bg-2);border:1px solid var(--line);border-radius:var(--radius-pill);padding:4px} .mg-tabs a{font-size:13px;font-weight:600;color:var(--ink-soft);padding:7px 14px;border-radius:var(--radius-pill);text-decoration:none;transition:background var(--t-fast),color var(--t-fast)} .mg-tabs a:hover{color:var(--ink)} .mg-tabs a.is-active{background:var(--bg-1);color:var(--accent);box-shadow:var(--shadow-1)} .mg-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin-bottom:30px} .mg-stat{background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-lg);padding:18px 20px} .mg-stat .n{display:block;font-size:30px;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums} .mg-stat .l{display:block;font-size:12px;color:var(--ink-mute);margin-top:2px} .mg-stat.is-warn .n{color:var(--warn)} .mg-tablewrap{background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:auto} .mg-table{width:100%;border-collapse:collapse;font-size:13.5px} .mg-table th{text-align:left;padding:12px 16px;border-bottom:2px solid var(--line);color:var(--ink-mute);font-weight:600;font-size:11px;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap} .mg-table td{padding:12px 16px;border-bottom:1px solid var(--line-soft);color:var(--ink-soft);vertical-align:middle} .mg-table tbody tr:last-child td{border-bottom:none} .mg-table tbody tr:hover{background:var(--bg-2)} /* Tabelle Utenti: larghezze colonne fisse e identiche fra tutte le categorie, così "Conformità" e azioni cadono sempre alla stessa x (anche la Dirigenza). */ .ut-table{table-layout:fixed} .ut-table th:nth-child(2),.ut-table td:nth-child(2){width:340px} .ut-table th:nth-child(3),.ut-table td:nth-child(3){width:130px} .ut-table td:first-child .mg-person-tx{min-width:0} .ut-table td:first-child b{overflow:hidden;text-overflow:ellipsis} .mg-rowact{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:6px} .mg-rowact .btn{vertical-align:middle} .mg-inlineform{display:inline-flex;margin:0} /* Tabelle larghe: scroll orizzontale pulito invece di tagliare il contenuto */ .mg-tablewrap{-webkit-overflow-scrolling:touch} .mg-table th,.mg-table td{vertical-align:middle} .mg-person{display:flex;align-items:center;gap:10px} .mg-ava{flex:0 0 auto;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--accent) 16%,var(--bg-1));color:var(--accent);font-weight:700;font-size:13px} .mg-person b{display:block;color:var(--ink);font-weight:600} .mg-person small{display:block;color:var(--ink-mute);font-size:11.5px} .mg-chip{display:inline-block;white-space:nowrap;font-size:11px;font-weight:600;color:var(--ink-soft);background:var(--bg-2);border:1px solid var(--line);border-radius:var(--radius-pill);padding:2px 9px;margin:2px 3px 2px 0} .mg-chip.is-base{color:var(--accent);border-color:color-mix(in srgb,var(--accent) 35%,var(--line));background:color-mix(in srgb,var(--accent) 7%,var(--bg-1))} .mg-prog{display:flex;align-items:center;gap:10px;min-width:120px} .mg-prog .bar{flex:1;height:6px;border-radius:999px;background:var(--bg-2);overflow:hidden} .mg-prog .bar i{display:block;height:100%;background:var(--accent);border-radius:999px} .mg-prog .t{font-size:12px;color:var(--ink-mute);font-variant-numeric:tabular-nums;white-space:nowrap} .mg-mute{color:var(--ink-mute)} .mg-exp{color:var(--warn);font-weight:600} .mg-code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;background:var(--bg-2);padding:2px 7px;border-radius:6px;border:1px solid var(--line-soft)} .mg-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;flex-wrap:wrap} .mg-search{flex:1;min-width:220px;max-width:340px;background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius);padding:9px 14px;font:inherit;font-size:13.5px;color:var(--ink)} .mg-search:focus{outline:none;border-color:var(--accent)} .mg-notice{background:color-mix(in srgb,var(--ok) 10%,var(--bg-1));border:1px solid color-mix(in srgb,var(--ok) 35%,var(--line));color:var(--ink);border-radius:var(--radius);padding:11px 16px;font-size:13.5px;margin-bottom:18px} .mg-formfoot{margin-top:24px;padding-top:18px;display:flex;justify-content:flex-end;border-top:1px solid var(--line-soft)} /* checkbox custom (no UI nativa) */ .mg-roles .mg-rolecol{text-align:center} .mg-check{display:inline-flex;cursor:pointer} .mg-check input{position:absolute;opacity:0;width:0;height:0} .mg-check .box{width:22px;height:22px;border-radius:7px;border:1.5px solid var(--line);background:var(--bg-1);display:grid;place-items:center;transition:background var(--t-fast),border-color var(--t-fast)} .mg-check .box svg{width:14px;height:14px;color:#fff;opacity:0;transform:scale(.6);transition:opacity var(--t-fast),transform var(--t-fast)} .mg-check input:checked + .box{background:var(--accent);border-color:var(--accent)} .mg-check input:checked + .box svg{opacity:1;transform:none;color:var(--accent-ink)} .mg-check input:focus-visible + .box{outline:2px solid var(--accent);outline-offset:2px} /* dossier stampabile */ .mg-doc-actions{display:flex;gap:10px;justify-content:center;padding:18px} .mg-sheet{display:flex;justify-content:center;padding:0 16px 40px} .mg-doc{width:100%;max-width:820px;background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-lg);padding:44px 48px;box-shadow:var(--shadow-2)} .mg-doc-top{display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--line);padding-bottom:18px;margin-bottom:24px} .mg-doc-brand{display:flex;align-items:center;gap:12px} .mg-doc-brand .mark{width:34px;height:34px;border-radius:50%;background:var(--accent);position:relative} .mg-doc-brand .mark::after{content:"";position:absolute;top:50%;right:15%;transform:translateY(-50%);width:28%;height:28%;border-radius:50%;background:#fff} .mg-doc-brand b{display:block;font-size:14px;color:var(--ink)} .mg-doc-brand small{display:block;font-size:11px;color:var(--ink-mute);letter-spacing:.04em;text-transform:uppercase} .mg-doc-date{font-size:12px;color:var(--ink-mute)} .mg-doc-h1{font-size:22px;font-weight:700;letter-spacing:-.01em;margin:0 0 18px} .mg-doc-meta{display:grid;grid-template-columns:repeat(2,1fr);gap:12px 24px;margin-bottom:26px} .mg-doc-meta>div span{display:block;font-size:11px;color:var(--ink-mute);text-transform:uppercase;letter-spacing:.05em;margin-bottom:2px} .mg-doc-meta>div b{font-size:14px;color:var(--ink);font-weight:600} .mg-doc-h2{font-size:14px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;color:var(--accent);margin:0 0 12px} .mg-doc-table{width:100%;border-collapse:collapse;font-size:12.5px;margin-bottom:24px} .mg-doc-table th{text-align:left;padding:8px 10px;border-bottom:2px solid var(--line);color:var(--ink);font-weight:600} .mg-doc-table td{padding:8px 10px;border-bottom:1px solid var(--line-soft);color:var(--ink-soft)} .mg-doc-table code{font-family:ui-monospace,Menlo,monospace;font-size:11.5px} .mg-doc-note{font-size:12px;color:var(--ink-soft);line-height:1.6;border-top:1px solid var(--line);padding-top:16px} .mg-doc-sign{margin-top:10px;color:var(--ink-mute)} @media (max-width:560px){.mg-doc-meta{grid-template-columns:1fr}.mg-doc{padding:28px 22px}} @media print{ /* PDF di gestione (dossier ecc.): SFONDO BIANCO. Testo e accenti restano (sono scuri/teal, visibili su bianco). L'avorio è riservato al certificato. */ html,body{background:#fff!important} .pf-topbar,.mg-doc-actions,.no-print{display:none!important} .mg-sheet{padding:0;background:#fff!important} .mg-doc{border:none;box-shadow:none;max-width:none;border-radius:0;padding:0;background:#fff!important} .mg-doc-brand b,.mg-doc-h1,.mg-doc-meta>div b,.mg-doc-table th{color:#1f1e1d} *{print-color-adjust:exact;-webkit-print-color-adjust:exact} @page{size:A4 portrait;margin:16mm} } /* barra avvisi nel quadro gestione */ .mg-toolbar .mg-hint{flex:1;min-width:220px;font-size:12.5px;color:var(--ink-mute);line-height:1.5} .mg-btns{display:flex;gap:10px;flex-wrap:wrap} /* ---------- Regolamento · presa visione ---------- */ .pf-ack{display:flex;gap:14px;align-items:flex-start;background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-lg);padding:16px 18px;margin-bottom:18px} .pf-ack.is-done{border-color:color-mix(in srgb,var(--ok) 40%,var(--line));background:color-mix(in srgb,var(--ok) 6%,var(--bg-1))} .pf-ack-ico{flex:0 0 auto;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--ok) 16%,var(--bg-1));color:var(--ok)} .pf-ack-ico.is-warn{background:color-mix(in srgb,var(--warn) 16%,var(--bg-1));color:var(--warn)} .pf-ack-ico svg{width:18px;height:18px} .pf-ack-txt b{display:block;font-size:14px;color:var(--ink)} .pf-ack-txt span{display:block;font-size:13px;color:var(--ink-soft);margin-top:2px} .pf-ack-form{margin-top:18px;background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-lg);padding:20px 22px;display:flex;flex-direction:column;gap:16px} .pf-ack-check{display:flex;gap:12px;align-items:flex-start;cursor:pointer;font-size:14px;color:var(--ink-soft);line-height:1.5} .pf-ack-check input{position:absolute;opacity:0;width:0;height:0} .pf-ack-check .box{flex:0 0 auto;width:22px;height:22px;border-radius:7px;border:1.5px solid var(--line);background:var(--bg-1);display:grid;place-items:center;margin-top:1px;transition:background var(--t-fast),border-color var(--t-fast)} .pf-ack-check .box svg{width:14px;height:14px;color:var(--accent-ink);opacity:0;transform:scale(.6);transition:opacity var(--t-fast),transform var(--t-fast)} .pf-ack-check input:checked + .box{background:var(--accent);border-color:var(--accent)} .pf-ack-check input:checked + .box svg{opacity:1;transform:none} .pf-ack-check input:focus-visible + .box{outline:2px solid var(--accent);outline-offset:2px} .pf-ack-form .btn{align-self:flex-start} /* banner presa visione in dashboard */ .pf-banner{display:flex;align-items:center;gap:14px;text-decoration:none;background:color-mix(in srgb,var(--warn) 8%,var(--bg-1));border:1px solid color-mix(in srgb,var(--warn) 35%,var(--line));border-radius:var(--radius-lg);padding:14px 18px;margin-bottom:24px;transition:background var(--t-fast)} .pf-banner:hover{background:color-mix(in srgb,var(--warn) 13%,var(--bg-1))} .pf-banner-ico{flex:0 0 auto;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:color-mix(in srgb,var(--warn) 18%,var(--bg-1));color:var(--warn)} .pf-banner-ico svg{width:19px;height:19px} .pf-banner-txt{flex:1} .pf-banner-txt b{display:block;font-size:14px;color:var(--ink)} .pf-banner-txt span{display:block;font-size:12.5px;color:var(--ink-soft)} .pf-banner-cta{font-size:13px;font-weight:600;color:var(--accent);white-space:nowrap} /* ---------- Inventario strumenti ---------- */ .mg-toolico{flex:0 0 auto;width:32px;height:32px;border-radius:9px;background:var(--bg-2);border:1px solid var(--line);display:grid;place-items:center;overflow:hidden} .mg-toolico img{width:20px;height:20px;object-fit:contain;display:block} .btn-ghost{background:transparent;border:1px solid transparent;color:var(--ink-mute)} .btn-ghost:hover{color:var(--ink);background:var(--bg-2)} .btn-danger{background:var(--err);color:var(--err-ink);border:1px solid var(--err)} .btn-danger:hover{background:color-mix(in srgb,var(--err) 86%,#000);border-color:color-mix(in srgb,var(--err) 86%,#000);color:var(--err-ink);filter:none} :root[data-pim-theme="dark"] .btn-danger{background:var(--pim-accent);color:var(--pim-accent-ink);border-color:var(--pim-accent)} :root[data-pim-theme="dark"] .btn-danger:hover{background:var(--pim-primary);color:var(--pim-accent-ink);border-color:var(--pim-primary);filter:none} .pf-del-confirm{font-size:12.5px;color:var(--ink-soft);white-space:nowrap} .pf-toolform{background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-lg);padding:22px 24px;display:flex;flex-direction:column;gap:16px} .pf-fldgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px} @media (max-width:640px){.pf-fldgrid{grid-template-columns:1fr}} /* Sezione "Email e password": due colonne (email | password), impilate su mobile. */ .pf-credgrid{display:grid;grid-template-columns:1fr 1fr;gap:26px} @media (max-width:640px){.pf-credgrid{grid-template-columns:1fr;gap:22px}} .pf-credcol{display:flex;flex-direction:column;gap:12px;align-items:flex-start} .pf-credcol .pf-fld{width:100%} .pf-credcol button{margin-top:2px} .pf-fld{display:flex;flex-direction:column;gap:6px} .pf-fld-lab{font-size:12px;font-weight:600;color:var(--ink-mute);letter-spacing:.02em} /* Tutti i campi testo del frontend Hub usano il design system (mai input nativi). */ .pim-formazione-screen input[type=text], .pim-formazione-screen input[type=email], .pim-formazione-screen input[type=password], .pim-formazione-screen input[type=search], .pim-formazione-screen input[type=url], .pim-formazione-screen input[type=tel], .pim-formazione-screen input[type=number], .pim-formazione-screen textarea{width:100%;min-width:0;max-width:100%;box-sizing:border-box;background:var(--bg-2);border:1px solid var(--line);border-radius:var(--radius);padding:9px 12px;font:inherit;font-size:14px;color:var(--ink);transition:border-color var(--t-fast),background var(--t-fast),box-shadow var(--t-fast)} .pim-formazione-screen input[type=text], .pim-formazione-screen input[type=email], .pim-formazione-screen input[type=password], .pim-formazione-screen input[type=search], .pim-formazione-screen input[type=url], .pim-formazione-screen input[type=tel], .pim-formazione-screen input[type=number]{align-self:start} .pim-formazione-screen input[type=text]:hover, .pim-formazione-screen input[type=email]:hover, .pim-formazione-screen input[type=password]:hover, .pim-formazione-screen input[type=search]:hover, .pim-formazione-screen input[type=url]:hover, .pim-formazione-screen input[type=tel]:hover, .pim-formazione-screen input[type=number]:hover, .pim-formazione-screen textarea:hover{border-color:color-mix(in srgb,var(--ink) 28%,var(--line))} .pim-formazione-screen input[type=text]:focus, .pim-formazione-screen input[type=email]:focus, .pim-formazione-screen input[type=password]:focus, .pim-formazione-screen input[type=search]:focus, .pim-formazione-screen input[type=url]:focus, .pim-formazione-screen input[type=tel]:focus, .pim-formazione-screen input[type=number]:focus, .pim-formazione-screen textarea:focus{outline:none;border-color:var(--accent);background:var(--bg-1);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 16%,transparent)} .pim-formazione-screen input::placeholder,.pim-formazione-screen textarea::placeholder{color:var(--ink-soft);opacity:.7} .pim-formazione-screen input:disabled,.pim-formazione-screen textarea:disabled,.pim-formazione-screen select:disabled{cursor:not-allowed;opacity:.58} .pf-domwrap{display:flex;align-items:center;gap:8px} .pf-domwrap input{flex:1} .pf-search-wrap{position:relative} .pf-search-menu{position:absolute;top:calc(100% + 4px);left:0;right:0;z-index:20;background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-2);overflow:hidden;max-height:320px;overflow-y:auto} .pf-search-item{display:flex;align-items:center;gap:10px;width:100%;text-align:left;background:transparent;border:none;border-bottom:1px solid var(--line-soft);padding:9px 12px;cursor:pointer;color:var(--ink)} .pf-search-item:hover{background:var(--bg-2)} .pf-search-item img{width:18px;height:18px;object-fit:contain} .pf-search-item span{font-size:13.5px;font-weight:600} .pf-search-item small{margin-left:auto;color:var(--ink-mute);font-size:12px} .pf-search-empty{padding:10px 12px;font-size:13px;color:var(--ink-mute)} .pf-seg{display:flex;align-items:stretch;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--bg-2)} .pf-seg label{position:relative;cursor:pointer;flex:1 1 0;min-width:0;display:flex} .pf-seg input{position:absolute;opacity:0;width:0;height:0} .pf-seg span{flex:1;display:flex;align-items:center;justify-content:center;text-align:center;padding:8px 10px;font-size:12.5px;line-height:1.25;color:var(--ink-soft);border-right:1px solid var(--line)} .pf-seg label:last-child span{border-right:none} .pf-seg input:checked + span{background:var(--accent);color:var(--accent-ink);font-weight:600} .pf-toolform-foot{display:flex;gap:10px;align-items:center} /* ---------- Clausole / disclosure ---------- */ .pf-clausole{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:16px} .pf-clause{background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-lg);padding:18px 20px;display:flex;flex-direction:column;gap:12px} .pf-clause-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px} .pf-clause-cat{display:block;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--accent);margin-bottom:4px} .pf-clause-head h3{margin:0;font-size:15px;font-weight:600;color:var(--ink)} .pf-clause-text{margin:0;font-size:13.5px;line-height:1.6;color:var(--ink-soft);background:var(--bg-2);border:1px solid var(--line-soft);border-radius:var(--radius);padding:12px 14px} /* ---------- PIM Hub · home aree ---------- */ .hub-hero{padding:14px 0 26px} .hub-eyebrow{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin-bottom:10px} .hub-hero h1{margin:0 0 8px;font-size:30px;font-weight:700;letter-spacing:-.015em} .hub-hero p{margin:0;font-size:15px;color:var(--ink-soft);line-height:1.6;max-width:620px} .hub-areas{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:16px} .hub-area{display:flex;align-items:flex-start;gap:16px;text-decoration:none;background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-lg);padding:22px 24px;box-shadow:var(--shadow-1);transition:transform var(--t-fast),box-shadow var(--t-fast),border-color var(--t-fast);position:relative} a.hub-area:hover{transform:translateY(-2px);box-shadow:var(--shadow-2);border-color:color-mix(in srgb,var(--accent) 40%,var(--line))} .hub-area.is-soon{opacity:.6} .hub-area-ico{flex:0 0 auto;width:46px;height:46px;border-radius:13px;background:color-mix(in srgb,var(--accent) 12%,var(--bg-1));display:grid;place-items:center} .hub-area-ico svg{width:25px;height:25px;color:var(--ink)} .hub-area.is-soon .hub-area-ico svg{color:var(--ink-mute)} .hub-area-body{flex:1;min-width:0} .hub-area-eyebrow{font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-mute);margin-bottom:5px} .hub-area-body h3{margin:0 0 6px;font-size:18px;font-weight:700;color:var(--ink);display:flex;align-items:center;gap:8px;flex-wrap:wrap} .hub-area-body p{margin:0;font-size:13.5px;line-height:1.55;color:var(--ink-soft)} .hub-soon{font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--warn);background:color-mix(in srgb,var(--warn) 14%,var(--bg-1));border-radius:var(--radius-pill);padding:2px 9px} .hub-area-cta{align-self:center;font-size:14px;font-weight:600;color:var(--accent);white-space:nowrap} /* pagine gestione: layout a colonna così la barra schede sta sempre in cima */ .mg-main{display:flex;flex-direction:column} /* barra schede: sempre sotto la topbar (order:-1), sticky; sfondo = stesso gradiente FISSO della pagina → a riposo invisibile, sotto lo scroll copre il contenuto */ /* Sfondo TRASPARENTE: lascia passare il gradiente della pagina → nessuna banda (un colore solido non combacia mai col gradiente del body). Il blur sfuoca solo il contenuto che scorre sotto la barra sticky. */ .mg-tabbar{order:-1;position:sticky;top:60px;z-index:60;margin:0 -24px 22px;padding:12px 24px;border-bottom:1px solid var(--line-soft);background:transparent;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)} .mg-tabbar .mg-tabs{margin:0;max-width:max-content} @media (max-width:760px){.mg-tabbar{overflow-x:auto}.mg-tabbar .mg-tabs{max-width:none;width:max-content}} /* dropdown custom riutilizzabile (no