/* Mode 1 contre 1 : réglages dans l'onglet et horloge d'échecs plein écran */

/* Mode 1 contre 1 : réglage dans l'onglet, horloge plein écran */
#tab-timer.duel-mode .timer-display-card { display: none; }

.duel-heading {
    max-width: 560px;
    margin: 0 auto 0.4rem;
    color: var(--heading);
    text-align: center;
}

.duel-rules {
    max-width: 560px;
    margin: 0 auto 1.2rem;
    padding-left: 1.4rem;
    color: var(--text-strong);
    font-size: 0.9rem;
    line-height: 1.5;
}

.duel-rules li { margin-bottom: 0.3rem; }
.duel-rules .pour { font-weight: 700; }

.duel-intro {
    max-width: 560px;
    margin: 0 auto 1rem;
    color: var(--text-soft);
    text-align: center;
    font-size: 0.9rem;
}

.duel-open-btn {
    display: block;
    margin: 1.2rem auto 0;
    padding: 0.9rem 1.6rem;
    font-size: 1rem;
}

body.duel-open { overflow: hidden; }

.duel-overlay {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    flex-direction: column;
    background: var(--navy);
}

.duel-overlay[hidden] { display: none; }

/* Chaque moitié est un grand bouton ; celle du haut est retournée pour l'orateur assis en face */
.duel-side {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    border-radius: 0;
    background: var(--timer-bg);
    color: var(--timer-label);
    font-weight: 700;
    -webkit-tap-highlight-color: transparent;
    user-select: none;
}

.duel-top { transform: rotate(180deg); }

.duel-side.active { background: var(--teal-dark); color: white; }
.duel-side.paused { background: #2a2760; color: white; }
/* Dernière minute : la moitié de l'orateur qui parle passe du turquoise à l'orange */
.duel-side.warning { background: #e8740c; color: white; }

/* Temps épuisé : moitié en rouge, consigne en évidence */
.duel-side.overtime { background: var(--contre-fill); color: white; }
.duel-side.overtime .duel-hint {
    padding: 0.3rem 0.8rem;
    border-radius: var(--radius);
    background: white;
    color: var(--contre);
    font-size: 1.05rem;
    font-weight: 800;
    opacity: 1;
}

.duel-name { font-size: 1rem; text-transform: uppercase; letter-spacing: 1px; }

/* Camp de l'orateur (une fois les camps tirés) : pastille claire, texte vert ou rouge */
.duel-camp {
    padding: 0.15rem 0.7rem;
    border-radius: 999px;
    background: #f8fafc;
    font-size: 0.85rem;
    font-weight: 800;
    letter-spacing: 1px;
}

.duel-camp.pour { color: #16a34a; }
.duel-camp.contre { color: #dc2626; }
.duel-camp[hidden] { display: none; }

.duel-time {
    font-family: 'Courier New', Courier, monospace;
    font-size: clamp(3.5rem, 20vw, 9rem);
    font-weight: 800;
    line-height: 1;
}

.duel-hint { min-height: 1.2em; font-size: 0.9rem; font-weight: 600; opacity: 0.85; }

.duel-center {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    padding: 0.7rem 0.6rem;
    background: var(--navy);
}

.duel-controls {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
}

/* Sujet dans un bandeau clair bien visible, de part et d'autre des boutons */
.duel-topic {
    padding: 0.7rem 1rem;
    border-radius: var(--radius);
    border-left: 5px solid var(--teal);
    background: white;
    color: var(--navy);
    font-size: clamp(1.05rem, 4.8vw, 1.5rem);
    font-weight: 800;
    line-height: 1.25;
    text-align: center;
}

.duel-topic[hidden] { display: none; }
.duel-topic-flipped { transform: rotate(180deg); }

.duel-controls .btn { flex: 1; max-width: 160px; }
.duel-controls .duel-sound { flex: 0 0 auto; min-width: 2.8rem; }