/* ============================================================
   IPPOCRATE COLLOQUIO SIMULATO — FRONTEND CSS v1.7
   Stile Apple iOS, tipografia grande, animazioni fluide.
   ============================================================ */

/* ============================================================
   ISOLATION RESET — neutralizza interferenze del tema attivo
   I temi WP spesso applicano stili a button/input/ul/li/a generici
   che corrompono la UI del plugin. Questo reset ripristina i tag base
   SOLO all'interno del simulatore (wrap normale + stage videocall).
   ============================================================ */
.ipp-colloquio-wrap,
.ipp-videocall-stage {
    box-sizing: border-box;
}
.ipp-colloquio-wrap *,
.ipp-colloquio-wrap *::before,
.ipp-colloquio-wrap *::after,
.ipp-videocall-stage *,
.ipp-videocall-stage *::before,
.ipp-videocall-stage *::after {
    box-sizing: border-box;
}

/* Reset BUTTON nel simulatore: il tema può aggiungere bordi/sfondi/shadow strani */
.ipp-colloquio-wrap button,
.ipp-videocall-stage button {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: none;
    border: 0;
    margin: 0;
    padding: 0;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    color: inherit;
    cursor: pointer !important;
    text-transform: none;
    letter-spacing: normal;
    box-shadow: none;
    text-shadow: none;
    text-decoration: none;
    min-height: 0;
    min-width: 0;
    width: auto;
    height: auto;
    pointer-events: auto !important;
    position: relative;
    z-index: 1;
    user-select: none;
}
.ipp-colloquio-wrap button:hover,
.ipp-colloquio-wrap button:focus,
.ipp-colloquio-wrap button:active,
.ipp-videocall-stage button:hover,
.ipp-videocall-stage button:focus,
.ipp-videocall-stage button:active {
    background: none;
    box-shadow: none;
    text-decoration: none;
    outline: none;
    color: inherit;
}

/* Reset INPUT/TEXTAREA: alcuni temi (Astra, OceanWP, Divi) applicano border-radius e shadows generici */
.ipp-colloquio-wrap input,
.ipp-colloquio-wrap textarea,
.ipp-videocall-stage input,
.ipp-videocall-stage textarea {
    appearance: none;
    -webkit-appearance: none;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    color: inherit;
    box-shadow: none;
    text-shadow: none;
    background: transparent;
    border: 0;
    margin: 0;
    padding: 0;
    outline: none;
    max-width: 100%;
}

/* Reset UL/LI: tema può aggiungere disc/decimal e margini */
.ipp-colloquio-wrap ul,
.ipp-colloquio-wrap ol,
.ipp-colloquio-wrap li,
.ipp-videocall-stage ul,
.ipp-videocall-stage ol,
.ipp-videocall-stage li {
    list-style: none;
    margin: 0;
    padding: 0;
    text-indent: 0;
}

/* Reset A: il tema può aggiungere underline/colori */
.ipp-colloquio-wrap a,
.ipp-videocall-stage a {
    text-decoration: none;
    color: inherit;
    background: transparent;
    border: 0;
    box-shadow: none;
}

/* Reset IMG */
.ipp-colloquio-wrap img,
.ipp-videocall-stage img {
    max-width: 100%;
    height: auto;
    display: block;
    border: 0;
    box-shadow: none;
}

/* Reset H1-H6: alcuni temi aggiungono margini negativi o border-bottom */
.ipp-colloquio-wrap h1, .ipp-colloquio-wrap h2, .ipp-colloquio-wrap h3,
.ipp-colloquio-wrap h4, .ipp-colloquio-wrap h5, .ipp-colloquio-wrap h6,
.ipp-videocall-stage h1, .ipp-videocall-stage h2, .ipp-videocall-stage h3,
.ipp-videocall-stage h4, .ipp-videocall-stage h5, .ipp-videocall-stage h6 {
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
    text-transform: none;
    letter-spacing: normal;
    line-height: 1.3;
    text-shadow: none;
}

/* Reset P */
.ipp-colloquio-wrap p,
.ipp-videocall-stage p {
    margin: 0;
    padding: 0;
    line-height: inherit;
}

.ipp-colloquio-wrap {
    /* Brand */
    --ipp-green: #2C5F2D;
    --ipp-green-dark: #1f4520;
    --ipp-green-light: #E8F1E8;
    --ipp-bordeaux: #8B2635;
    --ipp-bordeaux-light: #FDEBED;
    --ipp-gold: #B8923B;
    --ipp-gold-light: #FAF5E8;

    /* iOS-like grays */
    --ipp-bg: #F2F2F7;
    --ipp-card: #FFFFFF;
    --ipp-text: #1C1C1E;
    --ipp-text2: #3A3A3C;
    --ipp-text3: #6E6E73;
    --ipp-separator: #E5E5EA;

    /* Avatar colors palette (6 varianti deterministiche) */
    --ipp-avatar-0: #2C5F2D;
    --ipp-avatar-1: #8B2635;
    --ipp-avatar-2: #B8923B;
    --ipp-avatar-3: #4A6B8C;
    --ipp-avatar-4: #7A5A8E;
    --ipp-avatar-5: #C97B3D;

    max-width: 720px;
    margin: 32px auto;
    padding: 24px 20px !important;
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", "Segoe UI", system-ui, sans-serif;
    color: #1C1C1E !important;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;

    /* 🆕 v1.24.0 — ISOLAMENTO DA TEMA SCURO DEL SITO OSPITE.
       Molti temi WP (es. Astra, GeneratePress, OceanWP) supportano dark mode che imposta
       body { background: #1a1a1a; color: #e0e0e0; }. Il plugin eredita questi valori e
       rende il testo nero (--ipp-text) illeggibile su sfondo nero ereditato.
       Forziamo sfondo bianco esplicito + color con !important per garantire leggibilità
       indipendentemente dal tema sottostante. */
    background: #FFFFFF !important;
    border-radius: 18px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.06);
}

/* Tutti i testi all'interno del wrap usano colori chiari espliciti (non var()) per
   sopravvivere all'override di temi dark che potrebbero sovrascrivere le CSS variables. */
.ipp-colloquio-wrap,
.ipp-colloquio-wrap p,
.ipp-colloquio-wrap span,
.ipp-colloquio-wrap div,
.ipp-colloquio-wrap li,
.ipp-colloquio-wrap h2,
.ipp-colloquio-wrap h3,
.ipp-colloquio-wrap h4 {
    color: #1C1C1E;
}
.ipp-colloquio-wrap .ipp-loader-text {
    color: #6E6E73 !important;
}

/* Stage videocall eredita stessi tokens del wrap */
.ipp-videocall-stage {
    --ipp-green: #2C5F2D;
    --ipp-gold: #B8923B;
    --ipp-bordeaux: #8B2635;
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", "Segoe UI", system-ui, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.ipp-colloquio-wrap h2,
.ipp-colloquio-wrap h3,
.ipp-colloquio-wrap h4 {
    color: var(--ipp-text);
    font-weight: 700;
    letter-spacing: -0.02em;
    margin-top: 0;
}

.ipp-colloquio-wrap p { margin: 0 0 12px; }

/* ============================================================
   AVATAR (riutilizzabile)
   ============================================================ */
.ipp-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background-size: cover;
    background-position: center;
    flex-shrink: 0;
    color: #fff;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1;
    text-transform: uppercase;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    overflow: hidden;
}
.ipp-avatar-0 { background-color: var(--ipp-avatar-0); }
.ipp-avatar-1 { background-color: var(--ipp-avatar-1); }
.ipp-avatar-2 { background-color: var(--ipp-avatar-2); }
.ipp-avatar-3 { background-color: var(--ipp-avatar-3); }
.ipp-avatar-4 { background-color: var(--ipp-avatar-4); }
.ipp-avatar-5 { background-color: var(--ipp-avatar-5); }

.ipp-avatar-xs { width: 36px; height: 36px; font-size: 14px; }
.ipp-avatar-sm { width: 48px; height: 48px; font-size: 18px; }
.ipp-avatar-md { width: 72px; height: 72px; font-size: 28px; }
.ipp-avatar-lg { width: 96px; height: 96px; font-size: 36px; }
.ipp-avatar-xl { width: 120px; height: 120px; font-size: 44px; }

/* ============================================================
   NOTICE
   ============================================================ */
.ipp-notice {
    background: var(--ipp-card);
    border-radius: 14px;
    padding: 20px 24px;
    margin: 24px 0;
    font-size: 16px;
    color: var(--ipp-text2);
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
    border: 1px solid var(--ipp-separator);
}
.ipp-notice a {
    color: var(--ipp-green);
    font-weight: 600;
    text-decoration: none;
}

/* ============================================================
   BALANCE WIDGET
   ============================================================ */
.ipp-balance-widget {
    /* 🆕 v1.24.0: il widget saldo è stato refattorizzato in wallet card stile fintech con CSS
       totalmente inline. Le vecchie regole (background/border/padding/flex) sono state
       svuotate: il wrapper è ora un contenitore "trasparente" che lascia gestire layout
       e visual al markup inline (vedi render_balance_widget in class-frontend.php).
       Le vecchie regole sono mantenute (a vuoto) solo per retro-compatibilità con stylesheet
       custom che potrebbero estenderle. */
    margin-bottom: 24px;
}
.ipp-balance-widget.ipp-balance-warning,
.ipp-balance-widget.ipp-balance-low { /* legacy classes — no-op */ }

.ipp-back-link { margin: 0 0 16px; font-size: 15px; }
.ipp-back-link a {
    color: var(--ipp-green);
    text-decoration: none;
    font-weight: 600;
}
.ipp-back-link a:hover { text-decoration: underline; }

.ipp-balance-info {
    display: flex;
    align-items: center;
    gap: 14px;
    flex: 1;
    min-width: 250px;
}
.ipp-balance-icon {
    width: 44px; height: 44px;
    border-radius: 50%;
    background: var(--ipp-green);
    color: #fff;
    font-size: 22px;
    font-weight: 700;
    display: flex; align-items: center; justify-content: center;
}
.ipp-balance-warning .ipp-balance-icon { background: var(--ipp-gold); }
.ipp-balance-low .ipp-balance-icon { background: var(--ipp-bordeaux); }
.ipp-balance-amount { font-size: 17px; line-height: 1.2; }
.ipp-balance-amount strong { color: var(--ipp-green); font-size: 19px; font-weight: 700; }
.ipp-balance-low .ipp-balance-amount strong { color: var(--ipp-bordeaux); }
.ipp-balance-sessioni { font-size: 13px; color: var(--ipp-text3); margin-top: 4px; }

.ipp-balance-actions .ipp-btn { padding: 10px 18px; font-size: 14px; min-height: 38px; }

/* Topup panel */
.ipp-topup-panel {
    flex: 1 1 100%;
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid var(--ipp-separator);
    animation: ipp-fadein 0.3s ease;
}
.ipp-topup-panel h4 { font-size: 17px; margin: 0 0 4px; }
.ipp-topup-info { font-size: 14px; color: var(--ipp-text3); margin: 0 0 14px; }
.ipp-topup-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}
.ipp-topup-card {
    background: var(--ipp-bg);
    border: 1.5px solid transparent;
    border-radius: 14px;
    padding: 18px 12px;
    cursor: pointer;
    text-align: center;
    transition: transform 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
    font-family: inherit;
}
.ipp-topup-card:hover:not(:disabled) {
    border-color: var(--ipp-green);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(44,95,45,0.15);
}
.ipp-topup-card:active { transform: scale(0.97); }
.ipp-topup-card:disabled { opacity: 0.5; cursor: wait; }
.ipp-topup-amount { font-size: 22px; font-weight: 700; color: var(--ipp-green); margin-bottom: 4px; letter-spacing: -0.02em; }
.ipp-topup-desc { font-size: 12px; color: var(--ipp-text3); text-transform: uppercase; letter-spacing: 0.4px; }
.ipp-topup-disclaimer { font-size: 12px; color: var(--ipp-text3); font-style: italic; margin: 8px 0 0; }

/* ============================================================
   PAYWALL
   ============================================================ */
.ipp-paywall {
    background: var(--ipp-card);
    border-radius: 20px;
    padding: 40px 30px;
    text-align: center;
    margin: 20px 0;
    box-shadow: 0 4px 24px rgba(0,0,0,0.06);
}
.ipp-paywall-icon {
    width: 80px; height: 80px;
    border-radius: 50%;
    background: var(--ipp-bordeaux-light);
    color: var(--ipp-bordeaux);
    font-size: 36px;
    margin: 0 auto 18px;
    display: flex; align-items: center; justify-content: center;
}
.ipp-paywall h3 { color: var(--ipp-bordeaux); font-size: 24px; margin: 0 0 10px; }
.ipp-paywall p { max-width: 520px; margin: 0 auto 20px; font-size: 16px; color: var(--ipp-text2); }
.ipp-paywall .ipp-topup-grid { max-width: 600px; margin: 0 auto; }

/* ============================================================
   BOTTONI (Apple style)
   ============================================================ */
.ipp-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 14px 28px;
    border: none;
    border-radius: 14px;
    font-family: inherit;
    font-size: 17px;
    font-weight: 600;
    letter-spacing: -0.01em;
    cursor: pointer;
    text-decoration: none;
    transition: transform 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
    min-height: 50px;
    line-height: 1.2;
    -webkit-tap-highlight-color: transparent;
}
.ipp-btn:active { transform: scale(0.97); }
.ipp-btn-primary { background: var(--ipp-green); color: #fff; box-shadow: 0 2px 8px rgba(44,95,45,0.25); }
.ipp-btn-primary:hover { background: var(--ipp-green-dark); color: #fff; box-shadow: 0 4px 14px rgba(44,95,45,0.35); }
.ipp-btn-secondary { background: var(--ipp-gold); color: #fff; }
.ipp-btn-secondary:hover { background: #9c7a30; color: #fff; }
.ipp-btn-outline { background: transparent; color: var(--ipp-green); border: 2px solid var(--ipp-green); }
.ipp-btn-outline:hover { background: var(--ipp-green); color: #fff; }
.ipp-btn-block { width: 100%; }
.ipp-btn-lg { font-size: 19px; padding: 18px 32px; min-height: 60px; }

/* ============================================================
   LISTA CASI
   ============================================================ */
.ipp-hero {
    background: var(--ipp-card);
    color: var(--ipp-text);
    padding: 28px 28px;
    border-radius: 20px;
    margin-bottom: 24px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.05);
    border-left: 5px solid var(--ipp-green);
}
.ipp-hero h2 {
    margin: 0 0 10px;
    font-size: 28px;
    color: var(--ipp-text);
    letter-spacing: -0.03em;
}
.ipp-hero p { margin: 0; font-size: 16px; color: var(--ipp-text2); }

.ipp-casi-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 14px;
}
.ipp-caso-card {
    background: var(--ipp-card);
    border-radius: 18px;
    padding: 22px;
    transition: transform 0.18s ease, box-shadow 0.18s ease;
    border: 1px solid var(--ipp-separator);
    display: flex;
    flex-direction: column;
}
.ipp-caso-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 32px rgba(0,0,0,0.08);
}
.ipp-caso-card-header {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 14px;
}
.ipp-caso-card h3 {
    margin: 0;
    font-size: 18px;
    line-height: 1.25;
    color: var(--ipp-text);
}
.ipp-caso-info {
    color: var(--ipp-text3);
    font-size: 14px;
    margin-top: 4px;
}
.ipp-caso-richiesta {
    color: var(--ipp-text2);
    font-size: 14px;
    line-height: 1.5;
    min-height: 60px;
    margin: 6px 0 14px;
    font-style: italic;
}
.ipp-caso-meta { display: flex; justify-content: flex-end; margin-bottom: 4px; }
.ipp-pill {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 999px;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    font-weight: 700;
}
.ipp-pill-bassa { background: var(--ipp-green-light); color: var(--ipp-green); }
.ipp-pill-media { background: var(--ipp-gold-light); color: var(--ipp-gold); }
.ipp-pill-alta { background: var(--ipp-bordeaux-light); color: var(--ipp-bordeaux); }

/* ============================================================
   SCHEDA SENZIENTE
   ============================================================ */
/* ────────────────────────────────────────────────
   🆕 v1.25.0 — Stile editoriale Apple/Hermès
   Palette neutra avorio+sabbia, Cambria + SF Pro
   ──────────────────────────────────────────────── */
.ipp-caso-header {
    background: linear-gradient(180deg, #FFFFFF 0%, #FAF8F4 100%);
    border: 1px solid #E8E3D6;
    border-radius: 22px;
    padding: 32px 30px;
    margin-bottom: 22px;
    text-align: center;
    box-shadow: 0 1px 2px rgba(28,28,30,0.03);
}
.ipp-caso-header .ipp-avatar {
    margin: 0 auto 18px;
    display: flex;
    box-shadow: 0 1px 3px rgba(28,28,30,0.06);
    border: 1px solid #E8E3D6;
}
.ipp-caso-header h2 {
    margin: 0 0 6px;
    font-family: Cambria, Georgia, 'Times New Roman', serif;
    font-size: 28px;
    font-weight: 400;
    letter-spacing: -0.018em;
    line-height: 1.2;
    color: #1C1C1E;
}
.ipp-caso-anagrafica {
    color: #6E6E73;
    font-size: 14px;
    margin-bottom: 18px;
    font-style: italic;
    letter-spacing: -0.005em;
}
.ipp-caso-richiesta-box {
    background: #FAF8F4;
    border: 1px solid #E8E3D6;
    border-left: 3px solid #2C5F2D;
    border-radius: 0 12px 12px 0;
    padding: 14px 18px;
    margin: 0 auto 16px;
    max-width: 540px;
    text-align: left;
    font-size: 14.5px;
    color: #3A3A3C;
    line-height: 1.55;
    letter-spacing: -0.005em;
}
.ipp-caso-richiesta-box strong {
    color: #2C5F2D;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.6px;
    text-transform: uppercase;
    display: block;
    margin-bottom: 4px;
}

.ipp-caso-foto {
    display: flex;
    gap: 14px;
    justify-content: center;
    margin-top: 16px;
    flex-wrap: wrap;
}
.ipp-caso-foto-intro {
    margin-top: 22px;
    padding: 11px 16px;
    background: #FAF8F4;
    border: 1px solid #E8E3D6;
    border-left: 3px solid #B8923B;
    border-radius: 0 10px 10px 0;
    font-size: 13px;
    color: #3A3A3C;
    line-height: 1.55;
    letter-spacing: -0.005em;
}
.ipp-caso-foto-intro strong {
    color: #B8923B;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.6px;
    text-transform: uppercase;
}
.ipp-foto-item {
    margin: 0;
    text-align: center;
    cursor: zoom-in;
    transition: transform 0.18s ease;
}
.ipp-foto-item:hover {
    transform: translateY(-2px);
}
.ipp-foto-item img {
    display: block;
    width: 90px;
    height: 90px;
    border-radius: 14px;
    border: 1px solid var(--ipp-separator);
    object-fit: cover;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    transition: box-shadow 0.18s ease;
}
.ipp-foto-item:hover img {
    box-shadow: 0 6px 20px rgba(0,0,0,0.12);
}
.ipp-foto-item figcaption {
    font-size: 11px;
    color: var(--ipp-text3);
    margin-top: 6px;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    font-weight: 600;
    line-height: 1.2;
    max-width: 90px;
}

/* Lightbox overlay quando si clicca su una foto */
.ipp-foto-lightbox {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.92);
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: zoom-out;
    animation: ipp-fadein 0.2s ease;
    padding: 30px;
}
.ipp-foto-lightbox img {
    max-width: 90vw;
    max-height: 85vh;
    border-radius: 8px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.5);
}
.ipp-foto-lightbox-caption {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    color: #fff;
    font-size: 14px;
    background: rgba(0,0,0,0.6);
    padding: 8px 18px;
    border-radius: 999px;
    letter-spacing: 0.4px;
}
.ipp-foto-lightbox-close {
    position: absolute;
    top: 20px;
    right: 24px;
    color: #fff;
    background: rgba(255,255,255,0.15);
    border: none;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    font-size: 22px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}
.ipp-foto-lightbox-close:hover {
    background: rgba(255,255,255,0.25);
}

.ipp-caso-semeiotica { margin-top: 16px; text-align: left; }
.ipp-caso-semeiotica summary {
    cursor: pointer;
    color: var(--ipp-green);
    font-weight: 600;
    padding: 8px 0;
    font-size: 14px;
    text-align: center;
    list-style: none;
}
.ipp-caso-semeiotica summary::-webkit-details-marker { display: none; }
.ipp-caso-semeiotica summary::before { content: "▸ "; }
.ipp-caso-semeiotica[open] summary::before { content: "▾ "; }
.ipp-caso-semeiotica p {
    margin: 10px 0 0;
    padding: 16px;
    background: var(--ipp-bg);
    border-radius: 14px;
    font-size: 14px;
    line-height: 1.6;
    color: var(--ipp-text2);
}

/* ============================================================
   PROGRESSO
   ============================================================ */
.ipp-progress-wrap {
    background: var(--ipp-card);
    border-radius: 16px;
    padding: 14px 20px;
    margin-bottom: 18px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}
.ipp-progress-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
    font-size: 13px;
    color: var(--ipp-text3);
}
.ipp-step-label { font-weight: 600; color: var(--ipp-text); font-size: 14px; }
.ipp-fase-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    color: var(--ipp-gold);
    font-weight: 700;
}
.ipp-progress-bar {
    height: 6px;
    background: var(--ipp-separator);
    border-radius: 999px;
    overflow: hidden;
}
.ipp-progress-fill {
    height: 100%;
    background: linear-gradient(90deg, var(--ipp-green) 0%, var(--ipp-gold) 100%);
    transition: width 0.6s cubic-bezier(.4,0,.2,1);
    border-radius: 999px;
}

/* ============================================================
   INTRO PRONTO?
   ============================================================ */
/* .ipp-sim-intro: stile ora applicato inline da PHP (editorial v1.25.0).
   Le regole legacy qui sotto sono mantenute solo come fallback per browser che ignorano gli inline. */
.ipp-sim-intro {
    background: linear-gradient(180deg, #FFFFFF 0%, #FAF8F4 100%);
    border: 1px solid #E8E3D6;
    border-radius: 20px;
    padding: 36px 40px;
    text-align: left;
    box-shadow: 0 1px 2px rgba(28,28,30,0.03);
}
.ipp-sim-intro h3 {
    font-family: Cambria, Georgia, 'Times New Roman', serif;
    font-size: 30px;
    font-weight: 400;
    margin: 0 0 14px;
    letter-spacing: -0.02em;
    color: #1C1C1E;
    text-align: center;
}
.ipp-sim-intro p {
    font-size: 15px;
    color: #3A3A3C;
    margin: 0 auto 14px;
    max-width: 560px;
    line-height: 1.65;
    letter-spacing: -0.005em;
}
/* OVERRIDE deliberato: l'inline PHP usa <em> per il claim "il tuo compito è far emergere..."
   con Cambria italic in stone. NIENTE più bordeaux pesante. */
.ipp-sim-intro em {
    color: #6E6E73;
    font-style: italic;
    font-weight: 400;
    font-family: Cambria, Georgia, 'Times New Roman', serif;
}
.ipp-sim-intro .ipp-btn { margin-top: 24px; }

/* ============================================================
   CHAT MESSAGGIO DEL SENZIENTE / ALLIEVO
   ============================================================ */
.ipp-sim-question { background: transparent; }

/* Container conversazione (storico) */
.ipp-chat-history {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin-bottom: 20px;
    padding: 8px 4px;
    max-height: 480px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.ipp-chat-message {
    display: flex;
    gap: 12px;
    animation: ipp-slide-up 0.4s cubic-bezier(.4,0,.2,1);
    max-width: 88%;
}

/* SENZIENTE (Barbara) — bubble a sinistra, sfondo crema/avorio caldo, accento gold */
.ipp-chat-message-senziente {
    align-self: flex-start;
    margin-right: auto;
}
.ipp-chat-message-senziente .ipp-chat-message-avatar { order: 0; flex-shrink: 0; }
.ipp-chat-message-senziente .ipp-chat-message-content {
    background: linear-gradient(135deg, #FAF5E8 0%, #FBF7EE 100%);
    border-radius: 4px 20px 20px 20px;
    border-left: 3px solid var(--ipp-gold);
    padding: 16px 20px;
    box-shadow: 0 2px 10px rgba(184, 146, 59, 0.08);
    flex: 1;
    min-width: 0;
}
.ipp-chat-message-senziente .ipp-chat-message-name {
    font-size: 12px;
    color: var(--ipp-gold);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 6px;
}
.ipp-chat-message-senziente .ipp-chat-message-text {
    font-size: 17px;
    line-height: 1.55;
    color: var(--ipp-text);
    font-weight: 400;
    letter-spacing: -0.005em;
    font-style: italic;
}

/* ALLIEVO (Naturopata) — bubble a destra, sfondo verde foresta, testo bianco */
.ipp-chat-message-allievo {
    align-self: flex-end;
    flex-direction: row-reverse;
    margin-left: auto;
}
.ipp-chat-message-allievo .ipp-chat-message-avatar { order: 0; flex-shrink: 0; }
.ipp-chat-message-allievo .ipp-chat-message-content {
    background: linear-gradient(135deg, var(--ipp-green) 0%, #3a7a3b 100%);
    border-radius: 20px 4px 20px 20px;
    padding: 14px 18px;
    box-shadow: 0 3px 12px rgba(44, 95, 45, 0.25);
    flex: 1;
    min-width: 0;
}
.ipp-chat-message-allievo .ipp-chat-message-name {
    font-size: 11px;
    color: rgba(255,255,255,0.75);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 4px;
    text-align: right;
}
.ipp-chat-message-allievo .ipp-chat-message-text {
    font-size: 15px;
    line-height: 1.5;
    color: #ffffff;
    font-weight: 400;
}

/* Avatar dell'allievo (naturopata): badge piccolo verde con "Tu" */
.ipp-avatar-allievo {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--ipp-green) 0%, #3a7a3b 100%);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.5px;
    box-shadow: 0 2px 8px rgba(44, 95, 45, 0.3);
    flex-shrink: 0;
}

/* Legacy fallback: per chat-messagge senza class senziente/allievo (compat) */
.ipp-chat-message:not(.ipp-chat-message-senziente):not(.ipp-chat-message-allievo) .ipp-chat-message-avatar { flex-shrink: 0; }
.ipp-chat-message:not(.ipp-chat-message-senziente):not(.ipp-chat-message-allievo) .ipp-chat-message-content {
    background: var(--ipp-card);
    border-radius: 6px 20px 20px 20px;
    padding: 18px 22px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.06);
    flex: 1;
    min-width: 0;
}
.ipp-chat-message:not(.ipp-chat-message-senziente):not(.ipp-chat-message-allievo) .ipp-chat-message-name {
    font-size: 13px;
    color: var(--ipp-text3);
    font-weight: 600;
    margin-bottom: 6px;
}
.ipp-chat-message:not(.ipp-chat-message-senziente):not(.ipp-chat-message-allievo) .ipp-chat-message-text {
    font-size: 19px;
    line-height: 1.5;
    color: var(--ipp-text);
    font-weight: 400;
}

/* Domanda neutra */
.ipp-question-prompt {
    text-align: center;
    margin: 20px 0 18px;
    font-size: 13px;
    color: var(--ipp-text3);
    text-transform: uppercase;
    letter-spacing: 1.2px;
    font-weight: 700;
}

/* ============================================================
   OPZIONI (capsule grandi)
   ============================================================ */
.ipp-options-list { list-style: none; padding: 0; margin: 0; }
.ipp-option {
    display: flex;
    align-items: center;
    gap: 14px;
    background: var(--ipp-card);
    border: 2px solid transparent;
    border-radius: 16px;
    padding: 18px 20px;
    margin-bottom: 12px;
    cursor: pointer;
    transition: transform 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.2s ease;
    font-size: 17px;
    line-height: 1.45;
    color: var(--ipp-text);
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
    -webkit-tap-highlight-color: transparent;
}
.ipp-option:hover:not(.ipp-option-disabled) {
    border-color: var(--ipp-green);
    transform: translateX(3px);
    box-shadow: 0 4px 14px rgba(0,0,0,0.08);
}
.ipp-option:active:not(.ipp-option-disabled) { transform: scale(0.99); }
.ipp-option-letter {
    width: 36px; height: 36px;
    background: var(--ipp-bg);
    color: var(--ipp-text2);
    text-align: center;
    line-height: 36px;
    border-radius: 50%;
    font-weight: 700;
    font-size: 15px;
    flex-shrink: 0;
    transition: background-color 0.2s ease, color 0.2s ease;
}
.ipp-option-text { flex: 1; min-width: 0; }
.ipp-option-selected-corretta { border-color: var(--ipp-green); background: var(--ipp-green-light); }
.ipp-option-selected-corretta .ipp-option-letter { background: var(--ipp-green); color: #fff; }
.ipp-option-selected-errata { border-color: var(--ipp-bordeaux); background: var(--ipp-bordeaux-light); }
.ipp-option-selected-errata .ipp-option-letter { background: var(--ipp-bordeaux); color: #fff; }
.ipp-option-corretta-rivelata { border-color: var(--ipp-green); background: var(--ipp-green-light); position: relative; }
.ipp-option-corretta-rivelata .ipp-option-letter { background: var(--ipp-green); color: #fff; }
.ipp-option-corretta-rivelata::after {
    content: '✓ Corretta';
    position: absolute;
    right: 18px;
    top: 50%;
    transform: translateY(-50%);
    background: var(--ipp-green);
    color: #fff;
    font-size: 11px;
    padding: 4px 10px;
    border-radius: 999px;
    font-weight: 700;
    letter-spacing: 0.4px;
}
.ipp-option-disabled { cursor: default; }

/* ============================================================
   FEEDBACK
   ============================================================ */
.ipp-feedback-box {
    margin-top: 22px;
    padding: 22px;
    border-radius: 18px;
    animation: ipp-slide-up 0.4s cubic-bezier(.4,0,.2,1);
    background: var(--ipp-card);
    box-shadow: 0 4px 18px rgba(0,0,0,0.06);
}
.ipp-feedback-corretto { border-top: 4px solid var(--ipp-green); }
.ipp-feedback-errato { border-top: 4px solid var(--ipp-bordeaux); }
.ipp-feedback-title {
    font-weight: 700;
    font-size: 19px;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 10px;
    letter-spacing: -0.02em;
}
.ipp-feedback-corretto .ipp-feedback-title { color: var(--ipp-green); }
.ipp-feedback-errato .ipp-feedback-title { color: var(--ipp-bordeaux); }
.ipp-feedback-icon {
    width: 32px; height: 32px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    color: #fff;
    font-size: 18px;
}
.ipp-feedback-corretto .ipp-feedback-icon { background: var(--ipp-green); }
.ipp-feedback-errato .ipp-feedback-icon { background: var(--ipp-bordeaux); }
.ipp-feedback-text {
    font-size: 16px;
    line-height: 1.6;
    color: var(--ipp-text2);
}
.ipp-feedback-spiegazione-corretta {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid var(--ipp-separator);
    font-size: 15px;
    color: var(--ipp-text2);
}
.ipp-feedback-spiegazione-corretta strong { color: var(--ipp-green); }
.ipp-feedback-next { margin-top: 22px; text-align: center; }

/* ============================================================
   MODALITÀ LIBERA — textarea, feedback con voto, reazione senziente
   ============================================================ */
.ipp-free-prompt {
    font-size: 14px;
    color: var(--ipp-text3);
    text-align: center;
    margin: 20px 0 12px;
    font-style: italic;
    letter-spacing: 0.2px;
}
.ipp-free-input-wrap {
    background: var(--ipp-card);
    border-radius: 18px;
    border: 2px solid var(--ipp-separator);
    padding: 16px;
    transition: border-color 0.2s ease;
}
.ipp-free-input-wrap:focus-within {
    border-color: var(--ipp-green);
    box-shadow: 0 0 0 3px rgba(44, 95, 45, 0.1);
}
.ipp-free-input {
    width: 100%;
    border: none;
    outline: none;
    background: transparent;
    font-family: inherit;
    font-size: 16px;
    line-height: 1.6;
    color: var(--ipp-text1);
    resize: vertical;
    min-height: 120px;
    padding: 4px;
}
.ipp-free-input:disabled { opacity: 0.6; }
.ipp-free-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--ipp-separator);
}
.ipp-free-counter {
    font-size: 12px;
    color: var(--ipp-text3);
    font-variant-numeric: tabular-nums;
}
.ipp-counter-warn { color: var(--ipp-bordeaux); font-weight: 600; }
.ipp-btn-send-free { min-width: 180px; }

/* Feedback libero */
.ipp-feedback-libero {
    margin-top: 20px;
    background: var(--ipp-card);
    border-radius: 20px;
    padding: 24px;
    box-shadow: 0 2px 16px rgba(0,0,0,0.06);
    border: 1px solid var(--ipp-separator);
}

/* Badge voto */
.ipp-voto-badge {
    display: inline-flex;
    align-items: baseline;
    justify-content: center;
    gap: 4px;
    padding: 14px 28px;
    border-radius: 999px;
    margin-bottom: 18px;
    font-weight: 700;
    box-shadow: 0 4px 14px rgba(0,0,0,0.1);
}
.ipp-voto-numero { font-size: 32px; line-height: 1; }
.ipp-voto-su { font-size: 15px; opacity: 0.8; font-weight: 500; }
.ipp-voto-eccellente { background: linear-gradient(135deg, #2C5F2D, #4a8a4b); color: #fff; }
.ipp-voto-buono { background: linear-gradient(135deg, #B8923B, #d4a94a); color: #fff; }
.ipp-voto-sufficiente { background: linear-gradient(135deg, #d68c2e, #e0a04a); color: #fff; }
.ipp-voto-basso { background: linear-gradient(135deg, #8B2635, #a8344a); color: #fff; }

/* Feedback tutor */
.ipp-feedback-tutor {
    background: rgba(44, 95, 45, 0.05);
    border-left: 3px solid var(--ipp-green);
    padding: 16px 18px;
    border-radius: 0 12px 12px 0;
    margin-bottom: 14px;
}
.ipp-feedback-tutor-title {
    font-size: 13px;
    font-weight: 700;
    color: var(--ipp-green);
    text-transform: uppercase;
    letter-spacing: 0.6px;
    margin-bottom: 8px;
}
.ipp-feedback-tutor-text {
    font-size: 15px;
    line-height: 1.65;
    color: var(--ipp-text1);
}

/* Suggerimento */
.ipp-feedback-suggerimento {
    background: rgba(184, 146, 59, 0.08);
    border-left: 3px solid var(--ipp-gold);
    padding: 12px 16px;
    border-radius: 0 10px 10px 0;
    margin-bottom: 14px;
    font-size: 14px;
    line-height: 1.55;
    color: var(--ipp-text2);
}

/* Reazione senziente (immersività) */
.ipp-reazione-senziente {
    text-align: center;
    padding: 12px 20px;
    background: linear-gradient(180deg, rgba(0,0,0,0.02), rgba(0,0,0,0.04));
    border-radius: 12px;
    margin-bottom: 14px;
    color: var(--ipp-text3);
    font-size: 14px;
    line-height: 1.5;
}
.ipp-reazione-senziente em { font-style: italic; }

/* ============================================================
   LOADER (typing dots iOS)
   ============================================================ */
.ipp-sim-loader {
    background: var(--ipp-card);
    border-radius: 20px;
    padding: 50px 30px;
    text-align: center;
    box-shadow: 0 2px 12px rgba(0,0,0,0.05);
}
.ipp-spinner {
    display: inline-flex;
    gap: 6px;
    margin-bottom: 18px;
    align-items: center;
    justify-content: center;
}
.ipp-spinner span {
    width: 10px; height: 10px;
    border-radius: 50%;
    background: var(--ipp-green);
    display: inline-block;
    animation: ipp-bounce 1.2s infinite ease-in-out;
}
.ipp-spinner span:nth-child(1) { animation-delay: -0.32s; }
.ipp-spinner span:nth-child(2) { animation-delay: -0.16s; }
@keyframes ipp-bounce {
    0%, 80%, 100% { transform: scale(0.4); opacity: 0.5; }
    40% { transform: scale(1); opacity: 1; }
}
.ipp-loader-text { color: var(--ipp-text3); font-size: 15px; font-style: italic; margin: 0 0 18px; }

/* 🆕 v1.27.9 — Barra di progresso del loader (sostituisce lo spinner a puntini).
   Dà percezione di avanzamento durante l'attesa della risposta AI. */
.ipp-loader-bar {
    width: 100%;
    max-width: 360px;
    height: 8px;
    margin: 0 auto;
    background: var(--ipp-bg-soft, #f0ede6);
    border-radius: 999px;
    overflow: hidden;
}
.ipp-loader-bar-fill {
    height: 100%;
    width: 0%;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--ipp-green, #2C5F2D), var(--ipp-gold, #B8923B));
    transition: width 0.4s ease;
    /* Striping animato per dare sensazione di movimento anche quando la barra è "ferma" */
    background-size: 200% 100%;
    animation: ipp-loader-shimmer 1.6s linear infinite;
}
@keyframes ipp-loader-shimmer {
    0% { background-position: 200% 0; }
    100% { background-position: 0 0; }
}

/* ============================================================
   REPORT FINALE
   ============================================================ */
.ipp-sim-report {
    background: var(--ipp-card);
    border-radius: 20px;
    padding: 32px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.05);
}
.ipp-report-header {
    text-align: center;
    padding: 30px 20px;
    background: linear-gradient(135deg, var(--ipp-green) 0%, var(--ipp-green-dark) 100%);
    color: #fff;
    border-radius: 18px;
    margin-bottom: 26px;
}
.ipp-report-header h3 {
    color: #fff;
    margin: 0 0 10px;
    font-size: 26px;
    letter-spacing: -0.03em;
}
.ipp-report-header p { font-size: 16px; opacity: 0.92; margin: 0; }
.ipp-report-livello {
    display: inline-block;
    background: var(--ipp-gold);
    color: #fff;
    padding: 8px 18px;
    border-radius: 999px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-size: 13px;
    margin-top: 12px;
}
.ipp-report-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 12px;
    margin-bottom: 28px;
}
.ipp-stat-card {
    background: var(--ipp-bg);
    border-radius: 16px;
    padding: 20px 14px;
    text-align: center;
}
.ipp-stat-value {
    font-size: 34px;
    font-weight: 700;
    color: var(--ipp-green);
    line-height: 1;
    display: block;
    letter-spacing: -0.03em;
}
.ipp-stat-label {
    font-size: 12px;
    color: var(--ipp-text3);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-top: 6px;
    display: block;
    font-weight: 600;
}
.ipp-report-fasi-migliorare {
    background: var(--ipp-bordeaux-light);
    border-radius: 16px;
    padding: 20px 22px;
    margin-bottom: 24px;
}
.ipp-report-fasi-migliorare h4 { color: var(--ipp-bordeaux); margin: 0 0 8px; font-size: 17px; }
.ipp-report-fasi-migliorare p { margin: 0 0 10px; font-size: 14px; color: var(--ipp-text2); }
.ipp-report-fasi-migliorare ul { margin: 0; padding-left: 22px; }
.ipp-report-dettaglio { margin-top: 26px; }
.ipp-report-dettaglio h4 {
    color: var(--ipp-green);
    border-bottom: 2px solid var(--ipp-gold);
    padding-bottom: 8px;
    margin-bottom: 16px;
    font-size: 18px;
}
.ipp-report-item {
    background: var(--ipp-bg);
    border-radius: 14px;
    padding: 16px 18px;
    margin-bottom: 12px;
    border-left: 4px solid var(--ipp-green);
}
.ipp-report-item.ipp-errata {
    border-left-color: var(--ipp-bordeaux);
    background: var(--ipp-bordeaux-light);
}
.ipp-report-item-header {
    font-size: 11px;
    color: var(--ipp-text3);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 6px;
    font-weight: 700;
}
.ipp-report-item-domanda { font-weight: 600; font-size: 15px; margin-bottom: 8px; }
.ipp-report-item-scelta { font-size: 14px; margin: 6px 0; color: var(--ipp-text2); }
.ipp-report-actions { text-align: center; margin-top: 28px; padding-top: 22px; border-top: 1px solid var(--ipp-separator); }

/* ============================================================
   STORICO
   ============================================================ */
.ipp-colloquio-storico {
    max-width: 720px;
    margin: 32px auto;
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Helvetica Neue", system-ui, sans-serif;
}
.ipp-storico-table {
    width: 100%;
    border-collapse: collapse;
    background: var(--ipp-card);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}
.ipp-storico-table th {
    background: var(--ipp-green);
    color: #fff;
    padding: 14px;
    text-align: left;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}
.ipp-storico-table td { padding: 14px; border-bottom: 1px solid var(--ipp-separator); font-size: 14px; }
.ipp-storico-table tr:last-child td { border-bottom: none; }

/* ============================================================
   ANIMAZIONI
   ============================================================ */
@keyframes ipp-fadein {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes ipp-slide-up {
    from { opacity: 0; transform: translateY(14px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 720px) {
    .ipp-colloquio-wrap { padding: 0 12px; margin: 18px auto; }
    .ipp-hero { padding: 22px 20px; border-radius: 16px; }
    .ipp-hero h2 { font-size: 22px; }
    .ipp-caso-header { padding: 22px 18px; border-radius: 18px; }
    .ipp-caso-header h2 { font-size: 22px; }
    .ipp-avatar-xl { width: 100px; height: 100px; font-size: 36px; }
    .ipp-chat-message-content { padding: 16px 18px; }
    .ipp-chat-message-text { font-size: 17px; }
    .ipp-option { padding: 16px 18px; font-size: 16px; gap: 12px; }
    .ipp-option-letter { width: 32px; height: 32px; line-height: 32px; font-size: 14px; }
    .ipp-option-corretta-rivelata::after { right: 12px; }
    .ipp-feedback-box { padding: 18px; border-radius: 14px; }
    .ipp-feedback-title { font-size: 17px; }
    .ipp-feedback-text { font-size: 15px; }
    .ipp-sim-intro { padding: 30px 22px; }
    .ipp-sim-intro h3 { font-size: 22px; }
    .ipp-sim-intro p { font-size: 16px; }
    .ipp-report-stats { grid-template-columns: repeat(2, 1fr); }
    .ipp-stat-value { font-size: 28px; }
    /* .ipp-balance-widget mobile rules removed in v1.24.0 — wallet card is fully responsive via inline styles */
}

@media (max-width: 480px) {
    .ipp-foto-item img { width: 70px; height: 70px; }
    .ipp-foto-item figcaption { font-size: 10px; max-width: 70px; }
    .ipp-chat-message { gap: 10px; }
    .ipp-avatar-sm { width: 42px; height: 42px; font-size: 15px; }
}

/* ============================================================
   MODALITÀ VIDEOCALL — Video avatar a tutto schermo + chat overlay
   ============================================================ */

/* Stage videocall: occupa viewport completo con cornice elegante stile Zoom */
.ipp-videocall-stage {
    position: fixed;
    inset: 0;
    z-index: 99990;
    /* Sfondo scuro elegante stile Zoom/Teams */
    background: linear-gradient(135deg, #0d1117 0%, #1c2128 50%, #161b22 100%);
    overflow: hidden;
    display: none;
    /* Cornice intorno alle card */
    padding: 28px;
    box-sizing: border-box;
}
.ipp-videocall-stage.is-active {
    display: flex; /* split orizzontale */
    flex-direction: row;
    gap: 18px; /* spazio tra video-card e chat-card */
    animation: ipp-videocall-fadein 0.35s ease;
}
@keyframes ipp-videocall-fadein {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* COLONNA SINISTRA: video card galleggiante (40% del viewport per dare più spazio alla chat) */
.ipp-videocall-video-col {
    flex: 0 1 40%;
    max-width: 520px;
    position: relative;
    background: #0a0a0a;
    min-width: 0;
    overflow: hidden;
    /* Card galleggiante stile Zoom */
    border-radius: 16px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5), 0 2px 8px rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.05);
}

.ipp-videocall-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain; /* mostra TUTTO il viso, non taglia */
    background: #0a0a0a;
}
.ipp-videocall-bg::-webkit-media-controls { display: none !important; }

/* COLONNA DESTRA: chat verticale come card galleggiante */
.ipp-videocall-chat-col {
    flex: 1 1 60%;
    min-width: 340px;
    background: #1a1a1c;
    display: flex;
    flex-direction: column;
    /* Card galleggiante stile Zoom */
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5), 0 2px 8px rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.05);
}
.ipp-videocall-chat-col-header {
    padding: 18px 22px;
    border-bottom: 1px solid rgba(255,255,255,0.08);
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-shrink: 0;
}
.ipp-videocall-chat-col-title {
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: -0.01em;
    display: flex;
    align-items: center;
    gap: 10px;
}
.ipp-videocall-chat-col-title::before {
    content: '';
    width: 8px;
    height: 8px;
    background: #34c759;
    border-radius: 50%;
    box-shadow: 0 0 0 2px rgba(52, 199, 89, 0.3);
    animation: ipp-pulse-green 2s infinite;
}
@keyframes ipp-pulse-green {
    0%, 100% { box-shadow: 0 0 0 2px rgba(52, 199, 89, 0.3); }
    50% { box-shadow: 0 0 0 6px rgba(52, 199, 89, 0.08); }
}
.ipp-videocall-chat-col-subtitle {
    color: rgba(255,255,255,0.55);
    font-size: 12px;
    margin-top: 2px;
}

/* Bottone exit/minimize in alto a sinistra */
.ipp-videocall-exit {
    position: absolute;
    top: 18px;
    left: 18px;
    z-index: 100002;
    background: rgba(0,0,0,0.55);
    color: #fff;
    border: none;
    padding: 10px 18px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    transition: background 0.2s ease;
}
.ipp-videocall-exit:hover {
    background: rgba(0,0,0,0.75);
}
.ipp-videocall-exit::before {
    content: '←';
    font-size: 16px;
}

/* Badge REC dentro l'header della chat (non più absolute sul video) */
.ipp-videocall-chat-col-header .ipp-videocall-label {
    position: static;
    background: rgba(255, 59, 48, 0.15);
    color: #ff3b30;
    padding: 6px 12px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.8px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 1px solid rgba(255, 59, 48, 0.3);
}
.ipp-videocall-chat-col-header .ipp-videocall-label .ipp-rec-dot {
    width: 6px;
    height: 6px;
    background: #ff3b30;
    border-radius: 50%;
    display: inline-block;
    animation: ipp-rec-blink 1.5s infinite;
}

/* Etichetta nome senziente in alto a destra (legacy, ora non più usata) */
.ipp-videocall-label {
    position: absolute;
    top: 18px;
    right: 18px;
    z-index: 100002;
    background: rgba(0,0,0,0.55);
    color: #fff;
    padding: 10px 16px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.ipp-videocall-label .ipp-rec-dot {
    width: 8px;
    height: 8px;
    background: #ff3b30;
    border-radius: 50%;
    display: inline-block;
    animation: ipp-rec-blink 1.5s infinite;
}
@keyframes ipp-rec-blink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.3; }
}

/* Controlli audio (mute/unmute) - in alto a destra della colonna video */
.ipp-videocall-audio {
    position: absolute;
    top: 18px;
    right: 18px;
    z-index: 100002;
    background: rgba(0,0,0,0.55);
    color: #fff;
    border: none;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    font-size: 18px;
    cursor: pointer;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
}

/* Bottone "Riascolta" — appare in basso al centro quando il video è fermo */
.ipp-videocall-replay {
    position: absolute;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%) translateY(20px);
    z-index: 100002;
    background: rgba(0,0,0,0.75);
    color: #fff;
    border: 1px solid rgba(255,255,255,0.15);
    padding: 12px 22px;
    border-radius: 999px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    opacity: 0;
    pointer-events: none;
    transition: all 0.3s ease;
}
.ipp-videocall-replay.is-visible {
    opacity: 1;
    pointer-events: auto;
    transform: translateX(-50%) translateY(0);
}
.ipp-videocall-replay:hover {
    background: rgba(0,0,0,0.9);
    border-color: rgba(255,255,255,0.3);
}

/* Indicatore "Barbara sta parlando" — 3 dots animati in basso a sinistra del video */
.ipp-videocall-speaking-indicator {
    position: absolute;
    bottom: 24px;
    left: 24px;
    z-index: 100002;
    background: rgba(0,0,0,0.65);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    padding: 10px 16px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    gap: 4px;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s ease;
}
.ipp-videocall-speaking-indicator.is-active {
    opacity: 1;
}
.ipp-videocall-speaking-indicator span {
    width: 6px;
    height: 6px;
    background: #34c759;
    border-radius: 50%;
    animation: ipp-speaking-bounce 1.2s infinite ease-in-out;
}
.ipp-videocall-speaking-indicator span:nth-child(2) { animation-delay: 0.15s; }
.ipp-videocall-speaking-indicator span:nth-child(3) { animation-delay: 0.3s; }
@keyframes ipp-speaking-bounce {
    0%, 60%, 100% { transform: scale(0.7); opacity: 0.5; }
    30% { transform: scale(1.3); opacity: 1; }
}

/* Chat dentro colonna destra (scrollabile) */
.ipp-videocall-chat {
    flex: 1 1 auto;
    background: transparent;
    padding: 20px 22px 24px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    min-height: 0;
}
.ipp-videocall-chat-inner {
    max-width: 100%;
    margin: 0;
}

/* Bubble dialogo nella videocall: senziente */
.ipp-videocall-chat .ipp-chat-message-senziente .ipp-chat-message-content {
    background: rgba(250, 245, 232, 0.98);
    color: #1c1c1e;
    border-left: 3px solid var(--ipp-gold);
    box-shadow: 0 2px 12px rgba(0,0,0,0.3);
}
.ipp-videocall-chat .ipp-chat-message-senziente .ipp-chat-message-name {
    color: #B8923B;
}

/* Bubble dialogo nella videocall: allievo */
.ipp-videocall-chat .ipp-chat-message-allievo .ipp-chat-message-content {
    background: linear-gradient(135deg, #2C5F2D 0%, #3a7a3b 100%);
    box-shadow: 0 2px 12px rgba(0,0,0,0.3);
}

/* Avatar allievo non serve nella videocall */
.ipp-videocall-chat .ipp-chat-message-allievo .ipp-chat-message-avatar { display: none; }
.ipp-videocall-chat .ipp-chat-message-senziente .ipp-chat-message-avatar { display: none; }

/* Storico chat espanso a tutta colonna */
.ipp-videocall-chat .ipp-chat-history {
    max-height: none;
    margin-bottom: 16px;
}

/* Legacy compat */
.ipp-videocall-chat .ipp-chat-message-text {
    background: transparent;
    color: inherit;
    padding: 0;
    box-shadow: none;
}
.ipp-videocall-chat .ipp-chat-message:not(.ipp-chat-message-senziente):not(.ipp-chat-message-allievo) .ipp-chat-message-content {
    background: rgba(255,255,255,0.96);
    color: #1c1c1e;
    padding: 14px 18px;
    border-radius: 18px 18px 18px 4px;
    font-size: 16px;
    line-height: 1.55;
    box-shadow: 0 4px 24px rgba(0,0,0,0.3);
    backdrop-filter: blur(8px);
}
.ipp-videocall-chat .ipp-chat-message-name {
    color: rgba(255,255,255,0.9);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 6px;
    text-shadow: 0 1px 3px rgba(0,0,0,0.6);
}

/* Textarea risposta libera in modalità videocall */
.ipp-videocall-chat .ipp-free-prompt {
    color: rgba(255,255,255,0.9);
    font-size: 13px;
    text-shadow: 0 1px 3px rgba(0,0,0,0.6);
    margin-bottom: 10px;
}
.ipp-videocall-chat .ipp-free-input-wrap {
    background: rgba(255,255,255,0.97);
    border: 2px solid rgba(255,255,255,0.2);
    box-shadow: 0 8px 32px rgba(0,0,0,0.4);
}
.ipp-videocall-chat .ipp-free-input {
    background: transparent;
    color: #1c1c1e;
}
.ipp-videocall-chat .ipp-free-toolbar {
    border-top-color: rgba(0,0,0,0.08);
}

/* Feedback libero in modalità videocall */
.ipp-videocall-chat .ipp-feedback-libero {
    background: rgba(255,255,255,0.97);
    backdrop-filter: blur(12px);
    box-shadow: 0 8px 32px rgba(0,0,0,0.4);
}

/* Quiz options in modalità videocall */
.ipp-videocall-chat .ipp-question-prompt {
    color: rgba(255,255,255,0.92);
    text-shadow: 0 1px 3px rgba(0,0,0,0.6);
}
.ipp-videocall-chat .ipp-option {
    background: rgba(255,255,255,0.94);
    border-color: rgba(255,255,255,0.3);
    backdrop-filter: blur(8px);
    box-shadow: 0 4px 16px rgba(0,0,0,0.2);
}
.ipp-videocall-chat .ipp-option:hover {
    background: rgba(255,255,255,1);
    transform: translateY(-1px);
}

/* Loader (typing) in modalità videocall */
.ipp-videocall-chat .ipp-mini-loader {
    background: rgba(255,255,255,0.94);
    color: #1c1c1e !important;
    border-radius: 18px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.3);
}

/* Quando videocall attivo, blocca lo scroll del body */
body.ipp-videocall-active {
    overflow: hidden;
}

/* Progress bar dentro la chat overlay */
.ipp-videocall-chat .ipp-progress-wrap {
    background: rgba(0,0,0,0.4);
    backdrop-filter: blur(20px);
    padding: 10px 16px;
    border-radius: 999px;
    margin-bottom: 14px;
}
.ipp-videocall-chat .ipp-progress-info {
    color: rgba(255,255,255,0.9);
    font-size: 12px;
}
.ipp-videocall-chat .ipp-progress-bar {
    background: rgba(255,255,255,0.2);
}
.ipp-videocall-chat .ipp-progress-fill {
    background: #fff;
}

/* Bottone "inizia il colloquio" stile videocall */
.ipp-mode-videocall .ipp-btn-start {
    background: linear-gradient(135deg, #34c759, #248a3d);
    color: #fff;
    box-shadow: 0 4px 20px rgba(52, 199, 89, 0.4);
}
.ipp-mode-videocall .ipp-btn-start::before {
    content: '📹 ';
    margin-right: 6px;
}

/* Tablet stretto e mobile: stack verticale (video sopra, chat sotto) */
@media (max-width: 900px) {
    .ipp-videocall-stage {
        padding: 14px; /* cornice ridotta su mobile per non sacrificare spazio */
    }
    .ipp-videocall-stage.is-active {
        flex-direction: column;
        gap: 12px;
    }
    .ipp-videocall-video-col {
        flex: 0 0 45vh; /* video occupa 45% altezza */
        width: 100%;
    }
    .ipp-videocall-chat-col {
        flex: 1 1 auto;
        max-width: 100%;
        min-width: 0;
        width: 100%;
    }
}

@media (max-width: 600px) {
    .ipp-videocall-stage {
        padding: 10px;
    }
    .ipp-videocall-stage.is-active {
        gap: 10px;
    }
    .ipp-videocall-chat {
        padding: 14px 14px 18px;
    }
    .ipp-videocall-chat .ipp-chat-message-text { font-size: 14px; padding: 12px 14px; }
    .ipp-videocall-exit { font-size: 12px; padding: 8px 14px; top: 12px; left: 12px; }
    .ipp-videocall-audio { top: 12px; right: 12px; width: 38px; height: 38px; font-size: 16px; }
    .ipp-videocall-chat-col-header { padding: 14px 16px; }
}

/* Notice per audio (autoplay block) */
.ipp-videocall-audio-notice {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 100003;
    background: rgba(0,0,0,0.85);
    color: #fff;
    padding: 24px 32px;
    border-radius: 16px;
    text-align: center;
    cursor: pointer;
    max-width: 80%;
    box-shadow: 0 12px 40px rgba(0,0,0,0.5);
    backdrop-filter: blur(20px);
}
.ipp-videocall-audio-notice button {
    margin-top: 14px;
    background: #fff;
    color: #000;
    border: none;
    padding: 10px 24px;
    border-radius: 999px;
    font-weight: 600;
    cursor: pointer;
    font-size: 15px;
}

/* ============================================================
   TTS — bottone "Ascolta" sotto le bubble del senziente
   ============================================================ */
.ipp-bubble-tts-btn:hover {
    background: rgba(184, 146, 59, 0.22) !important;
}
.ipp-bubble-tts-btn.is-playing {
    background: linear-gradient(135deg, #B8923B, #d4a94a) !important;
    color: #fff !important;
    animation: ipp-tts-pulse 1.4s infinite;
}
@keyframes ipp-tts-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(184,146,59,0.5); }
    50% { box-shadow: 0 0 0 8px rgba(184,146,59,0); }
}

/* Toggle voce nell'intro */
.ipp-voice-toggle-intro {
    user-select: none;
}
.ipp-voice-toggle-intro input[type="checkbox"] {
    transform: scale(1.1);
}

/* Typing indicator (il senziente sta riflettendo...) */
.ipp-typing-dots {
    display: inline-flex;
    gap: 3px;
    margin-left: 6px;
    vertical-align: middle;
}
.ipp-typing-dots span {
    width: 5px;
    height: 5px;
    background: currentColor;
    border-radius: 50%;
    opacity: 0.4;
    animation: ipp-typing-bounce 1.2s infinite ease-in-out;
}
.ipp-typing-dots span:nth-child(2) { animation-delay: 0.15s; }
.ipp-typing-dots span:nth-child(3) { animation-delay: 0.3s; }
@keyframes ipp-typing-bounce {
    0%, 60%, 100% { transform: translateY(0); opacity: 0.3; }
    30% { transform: translateY(-4px); opacity: 0.9; }
}

/* ============================================================
   VIDEOCALL — COLONNA THUMBNAILS SEMEIOTICA (sinistra stretta)
   ============================================================ */
.ipp-videocall-thumbs-col {
    flex: 0 0 96px;
    background: rgba(255, 255, 255, 0.03);
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.05);
    box-shadow: 0 10px 40px rgba(0,0,0,0.5), 0 2px 8px rgba(0,0,0,0.3);
    padding: 14px 8px;
    overflow-y: auto;
    overflow-x: hidden;
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: center;
    box-sizing: border-box;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,0.15) transparent;
}
.ipp-videocall-thumbs-col::-webkit-scrollbar {
    width: 4px;
}
.ipp-videocall-thumbs-col::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,0.15);
    border-radius: 4px;
}
.ipp-videocall-thumbs-label {
    color: rgba(255,255,255,0.5);
    font-size: 9px;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    font-weight: 700;
    margin-bottom: 4px;
    text-align: center;
}

/* Singola thumbnail */
.ipp-videocall-thumb {
    width: 76px;
    height: 76px;
    flex-shrink: 0;
    background: rgba(255,255,255,0.05);
    border: 2px solid transparent !important;
    border-radius: 10px;
    overflow: hidden;
    cursor: pointer !important;
    padding: 0;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}
.ipp-videocall-thumb:hover {
    border-color: rgba(184, 146, 59, 0.6) !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(184, 146, 59, 0.3);
}
.ipp-videocall-thumb.is-active {
    border-color: #B8923B !important;
    box-shadow: 0 0 0 3px rgba(184, 146, 59, 0.3), 0 4px 12px rgba(184, 146, 59, 0.4);
}
.ipp-videocall-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.ipp-videocall-thumb-label {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0) 100%);
    color: #fff;
    font-size: 9px;
    font-weight: 600;
    padding: 14px 4px 4px;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    line-height: 1.1;
    pointer-events: none;
}

/* Pulsante "Torna al video" (nascosto di default, visibile quando un'immagine è in mostra) */
.ipp-videocall-thumb-reset {
    display: none !important;
    background: linear-gradient(135deg, #2C5F2D, #3a7a3b) !important;
    color: #fff;
    flex-direction: column;
    gap: 2px;
}
.ipp-videocall-thumb-reset.is-visible {
    display: flex !important;
}
.ipp-videocall-thumb-reset:hover {
    border-color: rgba(255,255,255,0.4) !important;
    transform: translateY(-2px);
}
.ipp-videocall-thumb-reset .ipp-videocall-thumb-label {
    position: static;
    background: none;
    padding: 0;
    text-shadow: 0 1px 2px rgba(0,0,0,0.3);
}

/* OVERLAY immagine semeiotica al centro (sostituisce il video) */
.ipp-videocall-semeio-overlay {
    position: absolute;
    inset: 0;
    background: #0a0a0a;
    z-index: 50;
    display: none;
    align-items: center;
    justify-content: center;
}
.ipp-videocall-semeio-overlay.is-active {
    display: flex;
    animation: ipp-semeio-fadein 0.3s ease;
}
@keyframes ipp-semeio-fadein {
    from { opacity: 0; transform: scale(0.98); }
    to { opacity: 1; transform: scale(1); }
}
.ipp-videocall-semeio-overlay img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    display: block;
}
.ipp-videocall-semeio-caption {
    position: absolute;
    top: 18px;
    left: 18px;
    background: rgba(0,0,0,0.65);
    color: #fff;
    padding: 8px 16px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255,255,255,0.1);
}
.ipp-videocall-semeio-close {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: rgba(0,0,0,0.65) !important;
    color: #fff;
    border: 1px solid rgba(255,255,255,0.1) !important;
    font-size: 22px;
    font-weight: 400;
    cursor: pointer !important;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 60;
    pointer-events: auto !important;
}
.ipp-videocall-semeio-close:hover {
    background: rgba(139, 38, 53, 0.85) !important;
    transform: scale(1.05);
}
/* L'immagine nell'overlay deve essere cliccabile (e mostrare cursor zoom) */
.ipp-videocall-semeio-overlay img {
    cursor: zoom-in !important;
    pointer-events: auto !important;
    position: relative;
    z-index: 51;
}

/* Mobile: colonna thumbs diventa orizzontale in basso */
@media (max-width: 900px) {
    .ipp-videocall-thumbs-col {
        flex: 0 0 auto;
        flex-direction: row;
        width: 100%;
        height: 88px;
        overflow-x: auto;
        overflow-y: hidden;
        padding: 8px 12px;
        gap: 8px;
    }
    .ipp-videocall-thumbs-label {
        display: none;
    }
    .ipp-videocall-thumb {
        width: 64px;
        height: 64px;
    }
}

/* ============================================================
   TIMER COUNTDOWN
   ============================================================ */
.ipp-timer {
    display: none;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    border-radius: 999px;
    background: rgba(44, 95, 45, 0.15);
    color: #2C5F2D;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.3px;
    font-variant-numeric: tabular-nums;
    transition: all 0.3s ease;
    border: 1px solid rgba(44, 95, 45, 0.25);
}
.ipp-videocall-stage .ipp-timer {
    background: rgba(52, 199, 89, 0.15);
    color: #34c759;
    border-color: rgba(52, 199, 89, 0.3);
}
.ipp-timer.is-warn {
    background: rgba(184, 146, 59, 0.15);
    color: #B8923B;
    border-color: rgba(184, 146, 59, 0.3);
}
.ipp-videocall-stage .ipp-timer.is-warn {
    background: rgba(255, 193, 7, 0.18);
    color: #ffc107;
    border-color: rgba(255, 193, 7, 0.4);
}
.ipp-timer.is-urgent {
    background: rgba(139, 38, 53, 0.18);
    color: #8B2635;
    border-color: rgba(139, 38, 53, 0.35);
    animation: ipp-timer-pulse 1.5s infinite;
}
.ipp-videocall-stage .ipp-timer.is-urgent {
    background: rgba(255, 59, 48, 0.18);
    color: #ff3b30;
    border-color: rgba(255, 59, 48, 0.4);
}
.ipp-timer.is-over {
    background: rgba(85, 0, 0, 0.85);
    color: #fff;
    border-color: rgba(255, 100, 100, 0.5);
    animation: ipp-timer-pulse 1s infinite;
}
@keyframes ipp-timer-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.05); }
}

/* ============================================================
   BOTTONE TERMINA COLLOQUIO
   ============================================================ */
.ipp-btn-end-session {
    appearance: none;
    -webkit-appearance: none;
    background: rgba(139, 38, 53, 0.85) !important;
    color: #fff !important;
    border: 1px solid rgba(139, 38, 53, 0.5) !important;
    padding: 7px 16px !important;
    border-radius: 999px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 0.3px;
    cursor: pointer !important;
    text-decoration: none;
    text-transform: none;
    box-shadow: none;
    line-height: 1.3;
    transition: all 0.2s ease;
    pointer-events: auto !important;
    font-family: inherit;
}
.ipp-btn-end-session:hover {
    background: #8B2635 !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(139, 38, 53, 0.35) !important;
}
.ipp-videocall-stage .ipp-btn-end-session {
    background: rgba(255, 59, 48, 0.85) !important;
    border-color: rgba(255, 59, 48, 0.4) !important;
}
.ipp-videocall-stage .ipp-btn-end-session:hover {
    background: #ff3b30 !important;
}

/* ============================================================
   SCHERMATA POST-COLLOQUIO: scelta percorsi
   ============================================================ */
.ipp-post-choice-wrap {
    max-width: 920px;
    margin: 0 auto;
    padding: 20px 0;
}
.ipp-post-choice-header {
    text-align: center;
    margin-bottom: 36px;
}
.ipp-post-choice-header h3 {
    font-size: 28px;
    color: #2C5F2D;
    margin: 0 0 12px;
    letter-spacing: -0.02em;
}
.ipp-post-choice-header p {
    color: #3A3A3C;
    font-size: 15px;
    line-height: 1.6;
    max-width: 640px;
    margin: 0 auto;
}
.ipp-post-choice-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 20px;
    margin-bottom: 32px;
}
.ipp-post-choice-card {
    appearance: none !important;
    background: #fff !important;
    border: 2px solid #E5E5EA !important;
    border-radius: 18px !important;
    padding: 28px 22px !important;
    cursor: pointer !important;
    text-align: left !important;
    transition: all 0.25s ease;
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-family: inherit;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
    /* 🆕 v1.24.0: forziamo i colori del testo per supportare tema scuro del sito ospite.
       Senza !important alcuni temi (es. quelli che fanno color:inherit) renderebbero
       il testo nero su fondo nero. */
    color: #1C1C1E !important;
}
.ipp-post-choice-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 28px rgba(0,0,0,0.12);
    border-color: #B8923B !important;
}
.ipp-post-choice-report:hover { border-color: #2C5F2D !important; }
.ipp-post-choice-esercizio:hover { border-color: #B8923B !important; }
.ipp-post-choice-setting:hover { border-color: #8B2635 !important; }

/* 🆕 v1.24.0 — CARD PRIMARY (Esercitati): in primo piano, occupa l'intera larghezza
   in alto e ha visual hierarchy maggiore (bordo dorato, sfondo cream, ombra più forte). */
.ipp-post-choice-primary {
    grid-column: 1 / -1;
    border-color: #B8923B !important;
    border-width: 3px !important;
    background: linear-gradient(135deg, #FFFBF3 0%, #FFFFFF 100%) !important;
    box-shadow: 0 6px 20px rgba(184,146,59,0.18) !important;
    padding: 32px 28px !important;
}
.ipp-post-choice-primary .ipp-post-choice-title {
    font-size: 20px !important;
    color: #2C5F2D !important;
}
.ipp-post-choice-primary .ipp-post-choice-icon {
    font-size: 52px !important;
}
.ipp-post-choice-primary .ipp-post-choice-cta {
    font-size: 16px !important;
    color: #B8923B !important;
}
.ipp-post-choice-primary:hover {
    transform: translateY(-3px);
    box-shadow: 0 14px 32px rgba(184,146,59,0.28) !important;
    border-color: #d4a94a !important;
}

.ipp-post-choice-icon {
    font-size: 44px;
    line-height: 1;
    margin-bottom: 8px;
}
.ipp-post-choice-title {
    font-size: 17px;
    font-weight: 700;
    color: #1C1C1E !important;
    letter-spacing: -0.01em;
}
.ipp-post-choice-desc {
    color: #3A3A3C !important;
    font-size: 13px;
    line-height: 1.55;
    flex: 1;
}
.ipp-post-choice-cta {
    color: #2C5F2D !important;
    font-size: 14px;
    font-weight: 700;
    margin-top: 10px;
}
.ipp-post-choice-esercizio .ipp-post-choice-cta { color: #B8923B !important; }
.ipp-post-choice-setting .ipp-post-choice-cta { color: #8B2635 !important; }
.ipp-post-choice-footer {
    text-align: center;
    margin-top: 16px;
}

/* ============================================================
   ESERCIZIO DI VALUTAZIONE — STEP BY STEP
   ============================================================ */
.ipp-esercizio-wrap {
    max-width: 760px;
    margin: 0 auto;
    padding: 16px 0;
}
.ipp-esercizio-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 18px;
}
.ipp-esercizio-counter {
    font-size: 12px;
    font-weight: 700;
    color: #B8923B;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}
.ipp-esercizio-progress-bar {
    height: 6px;
    background: #E5E5EA;
    border-radius: 999px;
    overflow: hidden;
    margin-bottom: 28px;
}
.ipp-esercizio-progress-fill {
    height: 100%;
    background: linear-gradient(90deg, #2C5F2D, #B8923B);
    border-radius: 999px;
    transition: width 0.4s ease;
}
.ipp-esercizio-card {
    background: #fff;
    border-radius: 20px;
    padding: 32px 28px;
    box-shadow: 0 8px 28px rgba(0,0,0,0.06);
    margin-bottom: 24px;
}
.ipp-esercizio-icona {
    font-size: 56px;
    line-height: 1;
    margin-bottom: 12px;
}
.ipp-esercizio-titolo {
    font-size: 24px;
    font-weight: 700;
    color: #1C1C1E;
    margin: 0 0 10px;
    letter-spacing: -0.02em;
}
.ipp-esercizio-help {
    color: #6E6E73;
    font-size: 14px;
    line-height: 1.55;
    margin: 0 0 22px;
    font-style: italic;
}
.ipp-esercizio-textarea:focus {
    border-color: #B8923B !important;
    box-shadow: 0 0 0 4px rgba(184,146,59,0.15) !important;
}
.ipp-esercizio-counter-chars {
    text-align: right;
    margin-top: 8px;
    font-size: 12px;
    color: #6E6E73;
}
.ipp-esercizio-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}
.ipp-esercizio-nav button:hover {
    transform: translateY(-2px);
}

@keyframes ipp-pulse-grow {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.08); opacity: 0.8; }
}

/* ============================================================
   CONFRONTO ALLIEVO vs ESPERTO
   ============================================================ */
.ipp-confronto-wrap {
    max-width: 880px;
    margin: 0 auto;
    padding: 16px 0;
}
.ipp-confronto-header {
    text-align: center;
    margin-bottom: 28px;
}
.ipp-confronto-header h3 {
    font-size: 28px;
    color: #2C5F2D;
    margin: 8px 0 4px;
    letter-spacing: -0.02em;
}
.ipp-confronto-section {
    background: #fff;
    border-radius: 16px;
    padding: 22px 24px;
    margin-bottom: 18px;
    box-shadow: 0 4px 14px rgba(0,0,0,0.05);
}
.ipp-confronto-section-label {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    margin-bottom: 10px;
}
.ipp-confronto-forza {
    background: linear-gradient(135deg, #FAF5E8 0%, #fff 100%);
    border-left: 4px solid #B8923B;
}
.ipp-confronto-forza .ipp-confronto-section-label { color: #B8923B; }
.ipp-confronto-forza p { color: #1C1C1E; font-weight: 600; font-size: 16px; line-height: 1.5; margin: 0; }
.ipp-confronto-globale {
    background: #E8F1E8;
    border-left: 4px solid #2C5F2D;
}
.ipp-confronto-globale .ipp-confronto-section-label { color: #2C5F2D; }
.ipp-confronto-globale p { color: #1C1C1E; font-size: 15px; line-height: 1.65; margin: 0; }
.ipp-confronto-aree {
    margin: 20px 0;
}
.ipp-confronto-area {
    background: #fff;
    border-radius: 16px;
    padding: 22px 24px;
    margin-bottom: 16px;
    box-shadow: 0 4px 14px rgba(0,0,0,0.05);
}
.ipp-confronto-area h4 {
    font-size: 18px;
    color: #1C1C1E;
    margin: 0 0 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid #E5E5EA;
    letter-spacing: -0.01em;
}
.ipp-confronto-block {
    margin-bottom: 14px;
}
.ipp-confronto-block:last-child { margin-bottom: 0; }
.ipp-confronto-block-title {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    margin-bottom: 8px;
}
.ipp-confronto-centrati .ipp-confronto-block-title { color: #2C5F2D; }
.ipp-confronto-approfondire .ipp-confronto-block-title { color: #B8923B; }
.ipp-confronto-mancanti .ipp-confronto-block-title { color: #8B2635; }
.ipp-confronto-block ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}
.ipp-confronto-block li {
    background: rgba(0,0,0,0.02);
    padding: 10px 14px;
    border-radius: 10px;
    margin-bottom: 6px;
    font-size: 14px;
    line-height: 1.55;
    color: #3A3A3C;
    border-left: 3px solid transparent;
}
.ipp-confronto-centrati li { border-left-color: #2C5F2D; background: rgba(44,95,45,0.05); }
.ipp-confronto-approfondire li { border-left-color: #B8923B; background: rgba(184,146,59,0.05); }
.ipp-confronto-mancanti li { border-left-color: #8B2635; background: rgba(139,38,53,0.05); }
.ipp-confronto-consiglio {
    background: linear-gradient(135deg, #FAF5E8 0%, #fff 100%);
    border-radius: 16px;
    padding: 22px 24px;
    border-left: 4px solid #B8923B;
    margin: 20px 0 24px;
}
.ipp-confronto-consiglio .ipp-confronto-section-label { color: #B8923B; }
.ipp-confronto-consiglio p { color: #1C1C1E; font-size: 15px; line-height: 1.6; margin: 0; font-style: italic; }
.ipp-confronto-actions {
    text-align: center;
    padding-top: 12px;
}

/* ============================================================
   SETTING ESPERTO — valutazione completa del caso
   ============================================================ */
.ipp-setting-wrap {
    max-width: 860px;
    margin: 0 auto;
    padding: 16px 0;
}
.ipp-setting-header h3 {
    font-size: 28px;
    color: #2C5F2D;
    margin: 0 0 12px;
    letter-spacing: -0.02em;
}
.ipp-setting-areas {
    margin: 24px 0;
}
.ipp-setting-area {
    background: #fff;
    border-radius: 16px;
    margin-bottom: 14px;
    box-shadow: 0 4px 14px rgba(0,0,0,0.05);
    overflow: hidden;
}
.ipp-setting-area summary {
    list-style: none;
    padding: 18px 22px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 12px;
    background: linear-gradient(135deg, #E8F1E8 0%, #fff 100%);
    user-select: none;
    transition: background 0.2s ease;
}
.ipp-setting-area summary::-webkit-details-marker { display: none; }
.ipp-setting-area summary:hover {
    background: linear-gradient(135deg, #d6e8d6 0%, #f5f9f5 100%);
}
.ipp-setting-icona {
    font-size: 28px;
    line-height: 1;
}
.ipp-setting-titolo {
    flex: 1;
    font-size: 17px;
    font-weight: 700;
    color: #1C1C1E;
    letter-spacing: -0.01em;
}
.ipp-setting-toggle {
    color: #6E6E73;
    font-size: 12px;
    transition: transform 0.2s ease;
}
.ipp-setting-area[open] .ipp-setting-toggle {
    transform: rotate(180deg);
}
.ipp-setting-content {
    padding: 18px 24px 22px;
}
.ipp-setting-campo {
    margin-bottom: 18px;
}
.ipp-setting-campo:last-child { margin-bottom: 0; }
.ipp-setting-label {
    font-size: 12px;
    font-weight: 700;
    color: #B8923B;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 6px;
}
.ipp-setting-valore {
    color: #1C1C1E;
    font-size: 14px;
    line-height: 1.65;
    background: rgba(184,146,59,0.05);
    padding: 12px 14px;
    border-radius: 10px;
    border-left: 3px solid #B8923B;
}
.ipp-setting-actions {
    text-align: center;
    padding-top: 12px;
}

/* Mobile */
@media (max-width: 600px) {
    .ipp-post-choice-cards { grid-template-columns: 1fr; }
    .ipp-esercizio-card { padding: 22px 18px; }
    .ipp-esercizio-titolo { font-size: 20px; }
    .ipp-esercizio-nav { justify-content: center; }
}

/* ============================================================
   BOTTONE ZOOM nell'overlay semeiotica
   ============================================================ */
.ipp-videocall-semeio-zoom {
    position: absolute;
    top: 16px;
    right: 64px; /* a sinistra del bottone Close */
    padding: 8px 14px !important;
    background: rgba(0,0,0,0.65) !important;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,0.1) !important;
    border-radius: 999px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-family: inherit;
    line-height: 1.3;
    z-index: 60;
    pointer-events: auto !important;
}
.ipp-videocall-semeio-zoom:hover {
    background: rgba(184,146,59,0.85) !important;
    border-color: rgba(255,255,255,0.3) !important;
}
.ipp-videocall-semeio-overlay img {
    cursor: zoom-in;
    transition: transform 0.15s ease;
}
.ipp-videocall-semeio-overlay img:hover {
    transform: scale(1.02);
}

/* ============================================================
   ZOOM LIGHTBOX FULLSCREEN (per immagini semeiotiche)
   ============================================================ */
.ipp-zoom-lightbox {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.96);
    z-index: 999999;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: ipp-zoom-fade 0.25s ease;
}
@keyframes ipp-zoom-fade {
    from { opacity: 0; }
    to { opacity: 1; }
}
.ipp-zoom-stage {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    touch-action: none;
    user-select: none;
}
.ipp-zoom-img {
    max-width: 92vw;
    max-height: 88vh;
    object-fit: contain;
    transform-origin: center center;
    transition: transform 0.18s ease;
    display: block;
    will-change: transform;
    user-select: none;
    -webkit-user-drag: none;
}
.ipp-zoom-img:active {
    transition: none; /* durante drag/pinch niente transizione, per fluidità */
}
.ipp-zoom-caption {
    position: absolute;
    top: 28px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(0,0,0,0.7);
    color: #fff;
    padding: 10px 22px;
    border-radius: 999px;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255,255,255,0.12);
    z-index: 2;
}
.ipp-zoom-close {
    position: absolute;
    top: 24px;
    right: 24px;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: rgba(0,0,0,0.7) !important;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,0.15) !important;
    font-size: 26px;
    font-weight: 300;
    cursor: pointer !important;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 3;
    transition: all 0.2s ease;
}
.ipp-zoom-close:hover {
    background: rgba(139,38,53,0.9) !important;
    transform: scale(1.08);
}
.ipp-zoom-controls {
    position: absolute;
    bottom: 32px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    gap: 8px;
    background: rgba(0,0,0,0.7);
    padding: 8px;
    border-radius: 999px;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255,255,255,0.12);
    z-index: 3;
}
.ipp-zoom-btn {
    appearance: none !important;
    -webkit-appearance: none;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: rgba(255,255,255,0.12) !important;
    color: #fff !important;
    border: 0 !important;
    font-size: 18px;
    font-weight: 700;
    cursor: pointer !important;
    line-height: 1;
    transition: all 0.15s ease;
    font-family: inherit;
}
.ipp-zoom-reset {
    width: auto !important;
    padding: 0 14px;
    font-size: 12px !important;
    letter-spacing: 0.5px;
}
.ipp-zoom-max {
    width: auto !important;
    padding: 0 16px;
    font-size: 11px !important;
    letter-spacing: 1px;
    background: linear-gradient(135deg, #B8923B, #d4a94a) !important;
    font-weight: 800 !important;
}
.ipp-zoom-max:hover {
    background: linear-gradient(135deg, #d4a94a, #e6c061) !important;
    transform: scale(1.06);
}
.ipp-zoom-percent {
    color: rgba(255,255,255,0.95);
    font-size: 12px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    min-width: 48px;
    text-align: center;
    padding: 0 6px;
    letter-spacing: 0.3px;
}
.ipp-zoom-btn:hover {
    background: rgba(184,146,59,0.85) !important;
    transform: scale(1.05);
}

@media (max-width: 600px) {
    .ipp-videocall-semeio-zoom { right: 52px; padding: 6px 10px !important; font-size: 11px !important; }
    .ipp-zoom-close { width: 38px; height: 38px; top: 16px; right: 16px; }
    .ipp-zoom-caption { top: 20px; padding: 8px 16px; font-size: 12px; }
    .ipp-zoom-controls { bottom: 20px; gap: 6px; padding: 6px; }
    .ipp-zoom-btn { width: 38px; height: 38px; font-size: 16px; }
    .ipp-zoom-reset, .ipp-zoom-max { padding: 0 10px !important; font-size: 10px !important; }
    .ipp-zoom-percent { font-size: 11px; min-width: 40px; }
}

/* Durante la videocall i controlli (timer + bottone Termina) della progress bar sono duplicati 
   dei controlli nell'header chat: li nascondiamo per evitare confusione */
body.ipp-videocall-active .ipp-progress-controls {
    display: none !important;
}
body.ipp-videocall-active .ipp-progress-wrap {
    display: none !important;
}

/* Modalità videocall SENZA video MP4: usa l'immagine avatar statica al centro
   con stesso comportamento di object-fit del video */
.ipp-videocall-bg-static {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    background: #0a0a0a;
    display: block;
}
/* Piccolo glow di "presenza" sull'immagine statica quando il senziente "parla" */
.ipp-videocall-video-col:has(.ipp-videocall-speaking-indicator.is-active) .ipp-videocall-bg-static {
    box-shadow: inset 0 0 100px rgba(52, 199, 89, 0.15);
    transition: box-shadow 0.4s ease;
}

/* ============================================================
   MARKDOWN RENDERED — stile leggibile per output formattato
   ============================================================ */
.ipp-md-content {
    line-height: 1.65;
    color: #1C1C1E;
}
.ipp-md-content strong { color: #2C5F2D; font-weight: 700; }
.ipp-md-content em { color: #3A3A3C; font-style: italic; }

/* 🆕 v1.25.0 — Stile RICH per le card MTC/Ayurveda del dettaglio caso.
   Headings h4 (punti MTC tipo "#### Pi Xu Yang") con accent + Cambria.
   Punti MTC cardine evidenziati con codice oro. */
.ipp-feedback-md-rich {
    line-height: 1.7;
    color: #3A3A3C;
}
.ipp-feedback-md-rich h1,
.ipp-feedback-md-rich h2,
.ipp-feedback-md-rich h3,
.ipp-feedback-md-rich h4,
.ipp-feedback-md-rich h5,
.ipp-feedback-md-rich h6 {
    font-family: Cambria, Georgia, 'Times New Roman', serif;
    font-weight: 400;
    color: #1C1C1E;
    letter-spacing: -0.015em;
    line-height: 1.25;
    margin: 22px 0 8px;
}
.ipp-feedback-md-rich h1 { font-size: 22px; }
.ipp-feedback-md-rich h2 { font-size: 20px; }
.ipp-feedback-md-rich h3 { font-size: 18px; }
.ipp-feedback-md-rich h4 {
    font-size: 17px;
    color: #2C5F2D;
    padding-left: 12px;
    border-left: 3px solid #2C5F2D;
    margin-top: 18px;
}
.ipp-feedback-md-rich h5,
.ipp-feedback-md-rich h6 { font-size: 15px; }
.ipp-feedback-md-rich strong {
    color: #1C1C1E;
    font-weight: 600;
}
.ipp-feedback-md-rich em {
    color: #6E6E73;
    font-style: italic;
}
.ipp-feedback-md-rich p {
    margin: 0 0 12px;
    line-height: 1.7;
}
.ipp-feedback-md-rich p:last-child {
    margin-bottom: 0;
}
.ipp-feedback-md-rich ul,
.ipp-feedback-md-rich ol {
    margin: 8px 0 14px;
    padding-left: 22px;
}
.ipp-feedback-md-rich li {
    margin: 5px 0;
    line-height: 1.65;
}
/* Inline code per sigle MTC (LU7, SP6, BL18 ecc.) — pill oro */
.ipp-feedback-md-rich code,
.ipp-feedback-md-rich .ipp-md-code {
    background: rgba(184,146,59,0.12);
    color: #8B6F2A;
    padding: 2px 7px;
    border-radius: 4px;
    font-family: ui-monospace, "SF Mono", Menlo, Monaco, "Cascadia Mono", "Roboto Mono", Consolas, monospace;
    font-size: 0.88em;
    font-weight: 600;
    border: 1px solid rgba(184,146,59,0.20);
}
/* Blockquote per le note "Punti MTC cardine: ..." */
.ipp-feedback-md-rich blockquote {
    margin: 14px 0;
    padding: 12px 18px;
    background: #FAF8F4;
    border-left: 3px solid #B8923B;
    border-radius: 0 10px 10px 0;
    font-style: italic;
    color: #3A3A3C;
}

.ipp-md-content .ipp-md-code {
    background: rgba(184,146,59,0.12);
    color: #8B2635;
    padding: 1px 6px;
    border-radius: 4px;
    font-family: ui-monospace, "SF Mono", Menlo, Monaco, "Cascadia Mono", "Roboto Mono", Consolas, monospace;
    font-size: 0.92em;
    font-weight: 600;
}
.ipp-md-content .ipp-md-p {
    margin: 0 0 10px;
}
.ipp-md-content .ipp-md-p:last-child {
    margin-bottom: 0;
}
.ipp-md-content .ipp-md-list {
    list-style: disc !important;
    margin: 8px 0 12px 22px !important;
    padding: 0 !important;
}
.ipp-md-content ol.ipp-md-list {
    list-style: decimal !important;
}
.ipp-md-content .ipp-md-list li {
    list-style: inherit !important;
    margin: 0 0 4px !important;
    padding: 0 !important;
    line-height: 1.55;
}
.ipp-md-content .ipp-md-list li::marker {
    color: #B8923B;
}
.ipp-md-content .ipp-md-h4 {
    font-size: 16px;
    color: #2C5F2D;
    font-weight: 700;
    margin: 14px 0 8px;
    letter-spacing: -0.01em;
}
.ipp-md-content .ipp-md-h5 {
    font-size: 14px;
    color: #B8923B;
    font-weight: 700;
    margin: 12px 0 6px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.ipp-md-content .ipp-md-hr {
    border: 0;
    border-top: 1px solid #E5E5EA;
    margin: 14px 0;
}
.ipp-md-content .ipp-md-table {
    width: 100%;
    border-collapse: collapse;
    margin: 12px 0;
    font-size: 13px;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(0,0,0,0.05);
    background: #fff;
}
.ipp-md-content .ipp-md-table th {
    background: #2C5F2D;
    color: #fff;
    padding: 10px 14px;
    text-align: left;
    font-weight: 700;
    font-size: 12px;
    letter-spacing: 0.3px;
    text-transform: uppercase;
}
.ipp-md-content .ipp-md-table td {
    padding: 10px 14px;
    border-top: 1px solid #E5E5EA;
    vertical-align: top;
}
.ipp-md-content .ipp-md-table tr:nth-child(even) td {
    background: rgba(184,146,59,0.04);
}
.ipp-md-content .ipp-md-table tr:hover td {
    background: rgba(44,95,45,0.05);
}

/* ============================================================
   SETTING ESPERTO — galleria semeiotica integrata
   ============================================================ */
.ipp-setting-galleria {
    background: linear-gradient(135deg, #FAF5E8 0%, #fff 100%);
    border: 1px solid rgba(184,146,59,0.3);
}
.ipp-setting-galleria summary {
    background: linear-gradient(135deg, #FAF5E8 0%, #fff 100%);
}
.ipp-setting-galleria-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 14px;
    margin-top: 8px;
}
.ipp-setting-galleria-item {
    appearance: none !important;
    background: #0a0a0a !important;
    border: 2px solid transparent !important;
    border-radius: 12px !important;
    overflow: hidden;
    cursor: pointer !important;
    padding: 0 !important;
    position: relative;
    aspect-ratio: 1 / 1;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
    font-family: inherit;
}
.ipp-setting-galleria-item:hover {
    border-color: #B8923B !important;
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(184,146,59,0.25);
}
.ipp-setting-galleria-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.ipp-setting-galleria-label {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.92) 0%, rgba(0,0,0,0) 100%);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    padding: 18px 8px 8px;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    line-height: 1.2;
    pointer-events: none;
}

/* ============================================================
   SEZIONI DIDATTICHE nel confronto tutor (MTC, Ayurveda, Rimedi)
   ============================================================ */
.ipp-confronto-didattica {
    background: #fff;
    border: 1px solid #e5e5ea;
    border-radius: 14px;
    margin: 16px 0;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0,0,0,0.04);
}
.ipp-confronto-didattica summary {
    list-style: none;
    padding: 16px 22px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 12px;
    user-select: none;
    transition: background 0.2s ease;
}
.ipp-confronto-didattica summary::-webkit-details-marker { display: none; }
.ipp-didattica-mtc {
    border-left: 4px solid #8B2635;
}
.ipp-didattica-mtc summary {
    background: linear-gradient(135deg, rgba(139,38,53,0.06) 0%, #fff 100%);
}
.ipp-didattica-ayurveda {
    border-left: 4px solid #B8923B;
}
.ipp-didattica-ayurveda summary {
    background: linear-gradient(135deg, rgba(184,146,59,0.06) 0%, #fff 100%);
}
.ipp-didattica-rimedi {
    border-left: 4px solid #2C5F2D;
}
.ipp-didattica-rimedi summary {
    background: linear-gradient(135deg, rgba(44,95,45,0.06) 0%, #fff 100%);
}
.ipp-didattica-icona {
    font-size: 28px;
    line-height: 1;
}
.ipp-didattica-titolo {
    flex: 1;
    font-size: 16px;
    font-weight: 700;
    color: #1C1C1E;
    letter-spacing: -0.01em;
}
.ipp-didattica-toggle {
    color: #6E6E73;
    font-size: 13px;
    transition: transform 0.2s ease;
}
.ipp-confronto-didattica[open] .ipp-didattica-toggle {
    transform: rotate(180deg);
}
.ipp-didattica-content {
    padding: 18px 24px 22px;
    border-top: 1px solid #e5e5ea;
    font-size: 14px;
    line-height: 1.7;
    color: #1C1C1E;
}

/* Sezione consigli di studio (blu) */
.ipp-didattica-studio {
    border-left: 4px solid #1A3A8A !important;
}
.ipp-didattica-studio summary {
    background: linear-gradient(135deg, rgba(26,58,138,0.07) 0%, #fff 100%) !important;
}

/* Typing indicator quando arriva una nuova battuta del senziente */
.ipp-typing-indicator {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 12px 16px;
    background: rgba(184,146,59,0.12);
    border-radius: 18px;
    margin: 8px 0;
}
.ipp-typing-indicator span {
    width: 8px;
    height: 8px;
    background: #B8923B;
    border-radius: 50%;
    animation: ipp-typing-dot 1.3s infinite ease-in-out;
}
.ipp-typing-indicator span:nth-child(2) { animation-delay: 0.2s; }
.ipp-typing-indicator span:nth-child(3) { animation-delay: 0.4s; }
@keyframes ipp-typing-dot {
    0%, 60%, 100% { transform: translateY(0); opacity: 0.5; }
    30% { transform: translateY(-6px); opacity: 1; }
}
/* Cursore lampeggiante durante il typing effect */
.ipp-typing-cursor {
    display: inline-block;
    width: 2px;
    height: 1em;
    background: #B8923B;
    vertical-align: text-bottom;
    margin-left: 1px;
    animation: ipp-cursor-blink 0.8s infinite step-end;
}
@keyframes ipp-cursor-blink {
    0%, 50% { opacity: 1; }
    51%, 100% { opacity: 0; }
}

/* ============================================================
   💡 TOOLTIP SUGGERIMENTO DIDATTICO (modalità tutorial)
   ============================================================ */
.ipp-suggerimento-tooltip {
    background: linear-gradient(135deg, #FFF8E1 0%, #FFFCF2 100%);
    border: 1px solid #f0d896;
    border-radius: 14px;
    margin: 0 0 14px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(184,146,59,0.10);
    transition: box-shadow 0.2s ease;
}
.ipp-suggerimento-tooltip:hover {
    box-shadow: 0 4px 14px rgba(184,146,59,0.18);
}
.ipp-suggerimento-toggle {
    appearance: none;
    -webkit-appearance: none;
    background: none;
    border: 0;
    width: 100%;
    text-align: left;
    padding: 12px 16px;
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    font-family: inherit;
    font-weight: 600;
    color: #8a6a1f;
    font-size: 13px;
    letter-spacing: 0.1px;
    user-select: none;
}
.ipp-sugg-icon {
    font-size: 18px;
    line-height: 1;
}
.ipp-sugg-label {
    flex: 1;
}
.ipp-sugg-arrow {
    color: #b8923b;
    font-size: 11px;
    transition: transform 0.2s ease;
}
.ipp-suggerimento-toggle.is-open .ipp-sugg-arrow {
    transform: rotate(180deg);
}
.ipp-suggerimento-body {
    padding: 0 18px 14px 44px;
    font-size: 13.5px;
    line-height: 1.6;
    color: #5a4a20;
    font-style: italic;
}
.ipp-suggerimento-body strong {
    color: #6b4f0d;
    font-style: normal;
}
.ipp-suggerimento-body em {
    color: #b8923b;
}

/* ───────────────────────────────────────────────────────────
   🆕 v1.25.0 — Tooltip warning validatore prompt (regex + AI)
   ─────────────────────────────────────────────────────────── */
@keyframes ippWarningSlide {
    from {
        opacity: 0;
        transform: translateY(-6px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.ipp-prompt-warning-tooltip {
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.06);
}

.ipp-prompt-warning-tooltip button:hover {
    opacity: 0.9;
    transform: translateY(-1px);
    transition: all 0.15s ease;
}

.ipp-prompt-warning-tooltip ul li {
    color: #3a3a3c;
}

/* ============================================================
   🆕 v1.25.0 — STAMPA dell'area riservata
   Quando l'utente clicca "Stampa / Salva PDF" dalla dashboard,
   queste regole nascondono UI non necessaria e mostrano TUTTI i pane
   (Valutazione + Trascrizione + Report docente) in un unico documento
   stampabile, ricalibrato per la carta.
   ============================================================ */
@media print {
    /* Nasconde tutto ciò che NON serve nel PDF stampato */
    .ipp-no-print,
    .ipp-dash-tab,
    .ipp-btn-back-to-choice,
    nav, header, footer,
    .site-header, .site-footer, .main-navigation,
    #wpadminbar, .wp-block-navigation,
    .ipp-warning-fix, .ipp-warning-proceed,
    button[onclick*="window.print"] {
        display: none !important;
    }

    /* Mostra TUTTI i pane stampati (anziché solo l'attivo) */
    .ipp-dash-pane {
        display: block !important;
        page-break-before: always;
        margin-bottom: 24px;
    }
    .ipp-dash-pane:first-of-type {
        page-break-before: avoid;
    }

    /* Sfondi pieni → flat per risparmiare inchiostro */
    body, html {
        background: #fff !important;
        color: #1C1C1E !important;
    }
    .ipp-balance-widget,
    .ipp-dashboard-wrap > div[style*="gradient"],
    .ipp-dashboard-wrap > div[style*="background:linear-gradient"] {
        background: #fff !important;
        box-shadow: none !important;
        border: 1px solid #E8E3D6 !important;
    }

    /* Tipografia ottimizzata per stampa */
    h1, h2, h3, h4 { page-break-after: avoid; }
    p, li, blockquote { orphans: 3; widows: 3; }

    /* Link visibili */
    a, a:link, a:visited { color: #1C1C1E !important; text-decoration: underline; }

    /* Card → bordi sottili, niente shadow */
    .ipp-voto-hero,
    .ipp-voto-micro,
    .ipp-dash-row {
        box-shadow: none !important;
        border: 1px solid #E8E3D6 !important;
        page-break-inside: avoid;
    }

    /* Margini di pagina */
    @page { margin: 1.5cm 1.8cm; }
}

/* ============================================================
   🆕 v1.25.1 — VIDEOCALL: richiesta d'aiuto come OVERLAY sopra il video
   ============================================================
   Spostato dalla sidebar laterale (troppo stretta → testo illeggibile)
   all'area centrale, in alto sopra il video del senziente. Stile "glass"
   semi-trasparente con backdrop-blur per non oscurare il senziente.
   Click sulla freccia → espande il box a tutta l'area del video col,
   coprendo anche la foto del senziente (panel modale, no scroll interno). */
.ipp-videocall-richiesta {
    position: absolute;
    top: 16px;
    left: 50%;
    transform: translateX(-50%);
    width: min(640px, calc(100% - 60px));
    z-index: 9;
    background: rgba(15, 15, 18, 0.68);
    backdrop-filter: blur(16px) saturate(140%);
    -webkit-backdrop-filter: blur(16px) saturate(140%);
    border: 1px solid rgba(184, 146, 59, 0.32);
    border-left: 3px solid #B8923B;
    border-radius: 14px;
    padding: 12px 16px 14px;
    cursor: pointer;
    transition: background 0.25s ease, border-color 0.25s ease, top 0.3s ease, bottom 0.3s ease, width 0.3s ease, padding 0.3s ease;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.32);
}
.ipp-videocall-richiesta:hover {
    background: rgba(15, 15, 18, 0.78);
    border-color: rgba(184, 146, 59, 0.55);
}
.ipp-videocall-richiesta-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
}
.ipp-videocall-richiesta-label {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #B8923B;
    font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Text', system-ui, sans-serif;
}
.ipp-videocall-richiesta-toggle {
    background: rgba(184, 146, 59, 0.22);
    border: 1px solid rgba(184, 146, 59, 0.55);
    padding: 6px 12px;
    cursor: pointer;
    color: #F0CC78;
    font-size: 12px;
    line-height: 1;
    border-radius: 8px;
    transition: background 0.2s ease, transform 0.25s ease, box-shadow 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-weight: 600;
    letter-spacing: 0.3px;
    flex-shrink: 0;
}
.ipp-videocall-richiesta-toggle:hover {
    background: rgba(184, 146, 59, 0.42);
    box-shadow: 0 4px 12px rgba(184, 146, 59, 0.25);
}
.ipp-videocall-richiesta-toggle-icon {
    display: inline-block;
    font-size: 14px;
    line-height: 1;
    transition: transform 0.3s ease;
}
.ipp-videocall-richiesta-text {
    font-family: Cambria, Georgia, 'Times New Roman', serif;
    font-style: italic;
    font-size: 15.5px;
    line-height: 1.65;
    color: rgba(255, 255, 255, 0.92);
    letter-spacing: 0;
    white-space: pre-wrap;
    /* Collassato: 2 righe con ellipsis (default) */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ============ STATO ESPANSO ============
   Il box si espande a tutta l'area del video col (top:16 → bottom:16)
   coprendo anche la foto del senziente come un panel modale.
   Niente scroll interno: tutto il testo è sempre visibile. */
.ipp-videocall-richiesta[data-expanded="1"] {
    top: 16px;
    bottom: 16px;
    width: calc(100% - 32px);
    max-width: 820px;
    padding: 22px 28px 26px;
    background: rgba(15, 15, 18, 0.88);
    backdrop-filter: blur(24px) saturate(160%);
    -webkit-backdrop-filter: blur(24px) saturate(160%);
    border-color: rgba(184, 146, 59, 0.5);
    overflow-y: auto;
    overscroll-behavior: contain;
    display: flex;
    flex-direction: column;
}
.ipp-videocall-richiesta[data-expanded="1"] .ipp-videocall-richiesta-head {
    margin-bottom: 18px;
    position: sticky;
    top: 0;
    background: rgba(15, 15, 18, 0.0);
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(184, 146, 59, 0.18);
}
.ipp-videocall-richiesta[data-expanded="1"] .ipp-videocall-richiesta-label {
    font-size: 11px;
    letter-spacing: 2.4px;
}
.ipp-videocall-richiesta[data-expanded="1"] .ipp-videocall-richiesta-text {
    -webkit-line-clamp: unset;
    display: block;
    overflow: visible;
    font-size: 17px;
    line-height: 1.75;
    flex: 1;
}
.ipp-videocall-richiesta[data-expanded="1"] .ipp-videocall-richiesta-toggle-icon {
    transform: rotate(180deg);
}
/* Scrollbar sottile per il caso in cui il testo sia davvero molto lungo (>800 char) */
.ipp-videocall-richiesta[data-expanded="1"]::-webkit-scrollbar { width: 6px; }
.ipp-videocall-richiesta[data-expanded="1"]::-webkit-scrollbar-track { background: transparent; }
.ipp-videocall-richiesta[data-expanded="1"]::-webkit-scrollbar-thumb {
    background: rgba(184, 146, 59, 0.35);
    border-radius: 3px;
}

/* ============================================================
   🆕 v1.25.0 — VIDEOCALL: progress bar al posto dei 3 puntini
   ============================================================
   Animazione asintotica: parte veloce (0→60% in ~1.5s), rallenta a metà,
   resta sul 95% finché la risposta non arriva. Gradient verde → oro
   in tema con la palette Accademia. */
.ipp-videocall-speaking-indicator {
    display: none;
    position: absolute;
    left: 50%;
    bottom: 32px;
    transform: translateX(-50%);
    width: min(340px, 70%);
    flex-direction: column;
    align-items: center;
    gap: 10px;
    z-index: 8;
    background: rgba(15, 15, 18, 0.72);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    padding: 14px 22px;
    border-radius: 14px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
}
.ipp-videocall-speaking-indicator.is-active {
    display: flex;
}
.ipp-videocall-speaking-label {
    font-family: Cambria, Georgia, 'Times New Roman', serif;
    font-style: italic;
    font-size: 13px;
    color: rgba(255, 255, 255, 0.78);
    letter-spacing: 0.2px;
    text-align: center;
}
.ipp-videocall-progress-track {
    width: 100%;
    height: 4px;
    background: rgba(255, 255, 255, 0.10);
    border-radius: 999px;
    overflow: hidden;
    position: relative;
}
.ipp-videocall-progress-fill {
    height: 100%;
    width: 0;
    background: linear-gradient(90deg, #2C5F2D 0%, #4f8a3f 35%, #B8923B 100%);
    border-radius: 999px;
    box-shadow: 0 0 8px rgba(184, 146, 59, 0.35);
    /* L'animazione parte SOLO quando il container ha .is-active (display:flex riavvia il rendering) */
}
.ipp-videocall-speaking-indicator.is-active .ipp-videocall-progress-fill {
    animation: ippProgressLoad 7s cubic-bezier(0.22, 0.61, 0.36, 1) forwards;
}
@keyframes ippProgressLoad {
    0%   { width: 0%; }
    20%  { width: 45%; }
    40%  { width: 68%; }
    60%  { width: 82%; }
    80%  { width: 90%; }
    100% { width: 95%; }
}

/* ============================================================
   🆕 v1.25.0 — Modalità NON-videocall: stesso loader progress
   ============================================================
   Sostituisce i 3 puntini del .ipp-spinner con la stessa barra di
   progresso, per coerenza visiva tra modalità videocall e modalità chat. */
.ipp-sim-loader .ipp-spinner {
    display: block;
    width: min(320px, 80%);
    height: 4px;
    margin: 0 auto 14px;
    background: rgba(0, 0, 0, 0.08);
    border-radius: 999px;
    overflow: hidden;
    position: relative;
}
.ipp-sim-loader .ipp-spinner span {
    display: none; /* nasconde i 3 puntini originali */
}
.ipp-sim-loader .ipp-spinner::after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 0;
    background: linear-gradient(90deg, #2C5F2D 0%, #4f8a3f 35%, #B8923B 100%);
    border-radius: 999px;
    box-shadow: 0 0 8px rgba(184, 146, 59, 0.28);
    animation: ippProgressLoad 7s cubic-bezier(0.22, 0.61, 0.36, 1) forwards;
}
.ipp-sim-loader .ipp-loader-text {
    font-family: Cambria, Georgia, 'Times New Roman', serif;
    font-style: italic;
    font-size: 24px !important;
    line-height: 1.3;
    color: #FFFFFF !important;
    letter-spacing: 0.2px;
    text-align: center;
    margin: 0 0 18px;
}

/* Toggle "Leggi tutto" → "Chiudi" via CSS quando espanso */
.ipp-videocall-richiesta-toggle-text {
    font-weight: 600;
    letter-spacing: 0.3px;
}
.ipp-videocall-richiesta[data-expanded="1"] .ipp-videocall-richiesta-toggle-text::before {
    content: "Chiudi";
}
.ipp-videocall-richiesta[data-expanded="1"] .ipp-videocall-richiesta-toggle-text {
    font-size: 0;
}
.ipp-videocall-richiesta[data-expanded="1"] .ipp-videocall-richiesta-toggle-text::before {
    font-size: 11px;
}
/* Cursor default sul body quando espanso (è già aperto, il click ovunque chiude solo via toggle) */
.ipp-videocall-richiesta[data-expanded="1"] {
    cursor: default;
}
.ipp-videocall-richiesta[data-expanded="1"] .ipp-videocall-richiesta-toggle {
    cursor: pointer;
}

/* ============================================================
   🆕 v1.25.1 — Bottone X di chiusura (visibile solo se espanso)
   ============================================================
   Stile modale: cerchio in alto a destra, sempre sopra il contenuto
   sticky. Hover bordeaux per evidenziare l'azione di chiusura. */
.ipp-videocall-richiesta-close {
    display: none;
    position: absolute;
    top: 14px;
    right: 14px;
    width: 38px;
    height: 38px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 50%;
    color: rgba(255, 255, 255, 0.92);
    font-size: 24px;
    line-height: 1;
    font-weight: 300;
    cursor: pointer;
    z-index: 11;
    transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease, color 0.2s ease;
    padding: 0;
    align-items: center;
    justify-content: center;
    font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', system-ui, sans-serif;
}
.ipp-videocall-richiesta[data-expanded="1"] .ipp-videocall-richiesta-close {
    display: inline-flex;
}
.ipp-videocall-richiesta-close:hover {
    background: rgba(139, 38, 53, 0.45);
    border-color: rgba(139, 38, 53, 0.75);
    color: #fff;
    transform: scale(1.05);
}