/* ShowLesson · Tutor LMS 4 con la grafica della demo A.
   Tutor 4 disegna tutto con i suoi token (--tutor-*): qui li ridefiniamo invece di riscrivere i modelli,
   così gli aggiornamenti di Tutor non rompono la grafica.
   1. token chiari su tutto il sito (area personale, registrazione, carrello, cassa);
   2. token scuri solo nell'area lezione (inchiostro, come la lezione della demo);
   3. pochi ritocchi: titoli larghi, pulsanti a pillola, arancio per avanzamento e completati. */

/* 1. Chiaro: carta, inchiostro, linee calde. Il «brand» di Tutor diventa l'inchiostro. */
:root,[data-tutor-theme="light"]{
	--tutor-brand-50:#F7F5F0; --tutor-brand-100:#EEEBE3; --tutor-brand-200:#E3DFD5; --tutor-brand-300:#DDD9CF;
	--tutor-brand-400:#8B8F96; --tutor-brand-500:#2A2E35; --tutor-brand-600:#15171B; --tutor-brand-700:#2A2E35;
	--tutor-brand-800:#1E2126; --tutor-brand-900:#15171B; --tutor-brand-950:#15171B;
	--tutor-surface-base:#F7F5F0; --tutor-surface-l1:#FFFFFF; --tutor-surface-l1-hover:#EEEBE3;
	--tutor-surface-l2:#EEEBE3; --tutor-surface-l2-hover:#E3DFD5; --tutor-surface-l3:#EEEBE3; --tutor-surface-sidebar-l1:#FBFAF7;
	--tutor-surface-dark:#15171B; --tutor-surface-success:#FFF1EC;
	--tutor-text-primary:#15171B; --tutor-text-secondary:#2A2E35; --tutor-text-subdued:#575B63; --tutor-text-disabled:#ABAFB8;
	--tutor-text-brand:#15171B; --tutor-text-brand-hover:#2A2E35; --tutor-text-success:#15171B;
	--tutor-border-idle:#DDD9CF; --tutor-border-idle2:#E3DFD5; --tutor-border-hover:#BDB8AC; --tutor-border-tertiary:#8B8F96; --tutor-border-dark:#15171B;
	--tutor-icon-success-primary:#FF5A36; --tutor-icon-success-secondary:#FF5A36;
	--tutor-actions-success-primary:#FF5A36; --tutor-actions-success-secondary:#FFC7B8;
	--tutor-button-primary:#15171B; --tutor-button-primary-hover:#2A2E35; --tutor-button-primary-focused:#15171B; --tutor-button-primary-disabled:#ABAFB8;
	--tutor-button-primary-soft:#EEEBE3; --tutor-button-primary-soft-hover:#E3DFD5; --tutor-button-primary-soft-focused:#EEEBE3;
	--tutor-button-success:#FF5A36; --tutor-button-success-hover:#FF7352; --tutor-button-success-focused:#FF5A36;
	--tutor-shadow-sm:0 1px 2px rgba(21,23,27,.06),0 1px 3px rgba(21,23,27,.08);
	--tutor-shadow-md:0 2px 4px -2px rgba(21,23,27,.06),0 4px 8px -2px rgba(21,23,27,.1);
	--tutor-shadow-lg:0 1px 2px rgba(21,23,27,.06),0 14px 40px rgba(21,23,27,.12);
}

/* 2. Area lezione scura: inchiostro della demo, arancio per il pulsante principale e l'avanzamento */
.tutor-learning-area{
	--tutor-surface-base:#15171B; --tutor-surface-l1:#1E2126; --tutor-surface-l1-hover:#2A2E35;
	--tutor-surface-l2:#2A2E35; --tutor-surface-l2-hover:#3A3F48; --tutor-surface-l3:#22252B; --tutor-surface-sidebar-l1:#1E2126;
	--tutor-surface-brand-tertiary:#2A2E35; --tutor-surface-brand-secondary:#2A2E35; --tutor-surface-brand-quaternary:#3A3F48;
	--tutor-surface-dark:#F7F5F0; --tutor-surface-success:#2A2E35; --tutor-surface-warning:#2A2E35;
	--tutor-text-primary:#F7F5F0; --tutor-text-primary-inverse:#15171B; --tutor-text-secondary:#DCDAD4;
	--tutor-text-subdued:#ABAFB8; --tutor-text-disabled:#6A6E76; --tutor-text-light:#F7F5F0;
	--tutor-text-brand:#FF7352; --tutor-text-brand-hover:#FF5A36; --tutor-text-brand-secondary:#ABAFB8; --tutor-text-success:#F7F5F0;
	--tutor-icon-idle:#DCDAD4; --tutor-icon-idle-inverse:#15171B; --tutor-icon-hover:#F7F5F0; --tutor-icon-secondary:#ABAFB8;
	--tutor-icon-subdued:#6A6E76; --tutor-icon-brand:#FF7352; --tutor-icon-brand-secondary:#2A2E35;
	--tutor-border-idle:#32363D; --tutor-border-idle2:#3A3F48; --tutor-border-hover:#6A6E76; --tutor-border-tertiary:#6A6E76;
	--tutor-border-inverse:#3A3F48; --tutor-border-dark:#3A3F48; --tutor-border-brand:#FF5A36; --tutor-border-brand-secondary:#3A3F48;
	--tutor-button-primary:#FF5A36; --tutor-button-primary-hover:#FF7352; --tutor-button-primary-focused:#FF5A36; --tutor-button-primary-disabled:#3A3F48;
	--tutor-button-primary-soft:#2A2E35; --tutor-button-primary-soft-hover:#3A3F48; --tutor-button-primary-soft-focused:#2A2E35;
	--tutor-button-secondary:#2A2E35; --tutor-button-secondary-hover:#3A3F48; --tutor-button-outline-inverse:#1E2126;
	--tutor-button-outline-hover:#2A2E35; --tutor-button-ghost-hover:#2A2E35; --tutor-button-disabled:#2A2E35;
	--tutor-tab-sidebar-l2:#F7F5F0; --tutor-tab-sidebar-l2-hover:#2A2E35; --tutor-tab-sidebar-l2-active:#F7F5F0;
	--tutor-tab-sidebar-l4-hover:#2A2E35; --tutor-tab-sidebar-l4-active:#2A2E35;
	--tutor-tab-l3:#2A2E35; --tutor-tab-l3-hover:#3A3F48; --tutor-tab-l3-active:#2A2E35;
	--tutor-actions-brand-primary:#FF5A36; --tutor-actions-brand-secondary:#2A2E35; --tutor-actions-brand-tertiary:#2A2E35;
	--tutor-actions-gray-empty:#3A3F48; --tutor-actions-gray-secondary:#2A2E35; --tutor-actions-gray-tertiary:#1E2126; --tutor-actions-gray-quaternary:#15171B;
	--tutor-actions-success-tertiary:#3A3F48;
	background:#15171B; color:#F7F5F0;
}
.tutor-learning-area ::selection{background:#FF5A36;color:#15171B}

/* 3. Ritocchi: carattere largo nei titoli come nella demo, pulsanti a pillola */
.tutor-learning-area h1,.tutor-learning-area h2,.tutor-learning-area h3,
[class*="tutor-dashboard"] h1,[class*="tutor-dashboard"] h2,[class*="tutor-dashboard"] h3{font-family:Archivo,system-ui,sans-serif;font-stretch:112%;letter-spacing:-.02em}
body.sl-sito .tutor-btn{border-radius:999px;font-weight:700}
body.sl-sito :focus-visible{outline:3px solid #2F6FED;outline-offset:2px}
.tutor-learning-area :focus-visible{outline-color:#7FA6FF}

/* Spunte e barre dei completati in arancio anche nell'area lezione; numeri delle statistiche in inchiostro */
:root,[data-tutor-theme="light"],.tutor-learning-area{
	--tutor-icon-success-primary:#FF5A36; --tutor-icon-success-secondary:#FF5A36;
	--tutor-actions-success-primary:#FF5A36; --tutor-button-success:#FF5A36; --tutor-button-success-hover:#FF7352;
	--tutor-icon-exception1:#FF5A36; --tutor-icon-exception4:#FF5A36; --tutor-icon-exception5:#FF5A36;
}
:root,[data-tutor-theme="light"]{--tutor-text-exception1:#15171B; --tutor-text-exception4:#15171B; --tutor-text-exception5:#15171B}

/* Area lezione: voce attiva carta e inchiostro come nella demo; player arancio */
.tutor-learning-area .tutor-learning-nav-item.active,.tutor-learning-area .tutor-learning-nav-item.active *{color:#15171B}
.tutor-learning-area .tutor-learning-nav-item.active{background:#F7F5F0}
.tutor-learning-area .tutor-learning-nav-item.active svg{color:#15171B}
.tutor-learning-area{--plyr-color-main:#FF5A36; --plyr-video-control-color-hover:#15171B; --plyr-captions-background:rgba(21,23,27,.9); --plyr-font-family:Archivo,system-ui,sans-serif}
.tutor-learning-area .plyr__control--overlaid{color:#15171B}
.tutor-learning-area .plyr--full-ui input[type=range]{color:#FF5A36}

/* Titolo della lezione sotto il video (dal nostro modello del video) */
.sl-lz-head{padding:22px 24px 18px}
.sl-lz-head h1{margin:0;font:800 clamp(24px,2.6vw,36px)/1.05 Archivo,system-ui,sans-serif;font-stretch:125%;letter-spacing:-.025em;color:var(--tutor-text-primary);text-wrap:balance}
.sl-lz-head p{margin:8px 0 0;font-size:15px;color:var(--tutor-text-subdued);font-variant-numeric:tabular-nums}
.sl-video-assente{display:grid;place-items:center;aspect-ratio:16/9;background:#1E2126;color:#ABAFB8}

/* Logo nostro nell'area personale e nell'area lezione */
.tutor-brand-logo.sl-brand{display:inline-flex;align-items:center;gap:10px;color:#15171B;text-decoration:none}
.sl-brand .sl-brand-wm{font:800 19px/1 Archivo,system-ui,sans-serif;font-stretch:112%;letter-spacing:-.02em;color:#15171B}
a:has(>.tutor-brand-logo.sl-brand){text-decoration:none}

/* Spunte delle lezioni completate: in Tutor sono SVG con il verde scritto dentro */
.tutor-learning-area svg circle[fill="#0BB01B"]{fill:#FF5A36}
.tutor-learning-area svg path[stroke="#007E0C"]{stroke:#15171B}

/* Logo nell'area personale: Tutor lo vuole a blocco e largo al massimo 120 px */
.tutor-dashboard-sidebar-logo .tutor-brand-logo.sl-brand{display:inline-flex;max-width:none}
.tutor-dashboard-sidebar-logo a{text-decoration:none}

/* Statistiche dell'area personale: numeri in inchiostro, icone arancio */
.tutor-stat-card-value{color:#15171B!important}
[class*="tutor-stat-card"] svg{color:#FF5A36}

/* Le parti di Tutor ancora sul vecchio sistema di colori (carrello, cassa, accesso, moduli) */
:root{--tutor-color-primary:#15171B; --tutor-color-primary-rgb:21,23,27; --tutor-color-primary-hover:#2A2E35; --tutor-color-primary-hover-rgb:42,46,53; --tutor-color-success:#FF5A36}

/* Quiz: le risposte sono testo chiaro, il riquadro deve restare scuro come il resto dell'area lezione */
.tutor-learning-page,.tutor-learning-area{--tutor-quiz-idle:#22252B;--tutor-quiz-hover:#2A2E35}
.tutor-quiz-summary-page .tutor-question-content{word-break:normal!important;overflow-wrap:break-word}
.tutor-learning-area .tutor-quiz-question-option:not(:has(:checked)):not([data-option=correct]):not([data-option=incorrect]){background-color:#22252B;border-color:#3A3F48;color:#F7F5F0}
.tutor-learning-area .tutor-quiz-question-option .tutor-label,.tutor-learning-area .tutor-quiz-question-option label{color:inherit}

/* Invito all'attestato sul risultato del quiz; sparisce se si rifà il quiz */
.sl-pronto{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:50;display:flex;align-items:center;gap:20px;padding:12px 12px 12px 22px;background:#F7F5F0;color:#15171B;border-radius:999px;font:500 16px/1.3 Archivo,system-ui,sans-serif;box-shadow:0 12px 34px rgba(21,23,27,.45);white-space:nowrap}
.sl-pronto b{font-weight:800}
.sl-pronto a{padding:10px 20px;border-radius:999px;background:#FF5A36;color:#15171B;font-weight:800;text-decoration:none}
body:has(.tutor-quiz-question-option):not(:has(.tutor-quiz-summary-page)) .sl-pronto{display:none}
@media (max-width:600px){.sl-pronto{left:16px;right:16px;transform:none;white-space:normal;border-radius:20px;flex-wrap:wrap}}
