/* ============================================================
   ECG / EEG — Styles spécifiques (moniteur + scénarios)
   ============================================================ */

/* ── Mode selector ─────────────────────────────────────────── */
.mode-selector { display:flex; gap:5px; background:#112240; padding:5px; border-radius:8px; }
.mode-btn      { flex:1; padding:10px; border:none; background:transparent; color:white; cursor:pointer; font-weight:bold; border-radius:5px; transition:0.3s; }
.mode-btn.active { background:var(--omc-cyan, #38bdf8); color:#0a192f; }

/* ── Grille de scénarios ─────────────────────────────────────  */
.scenario-grid { display:flex; flex-direction:column; gap:4px; margin-top:6px; }

.scenario-btn {
    display:flex; align-items:center; gap:8px;
    padding:7px 10px;
    background:#172a45; border:1px solid #233554; border-radius:6px;
    color:white; cursor:pointer; font-size:11px; text-align:left;
    transition:border-color 0.2s, background 0.2s; width:100%;
}
.scenario-btn:hover  { border-color:var(--omc-cyan, #38bdf8); background:#1d3557; }
.scenario-btn.active { border-color:var(--omc-cyan, #38bdf8); background:rgba(56,189,248,0.08); color:var(--omc-cyan, #38bdf8); font-weight:700; }
.sc-icon { font-size:13px; flex-shrink:0; }

/* ── Moniteur live ───────────────────────────────────────────  */
#monitor-container {
    width:100%;
    max-width:800px;
    background:#020d18;
    border:1px solid #1e3a5f;
    border-radius:8px;
    overflow:hidden;
    box-shadow:0 0 25px rgba(56,189,248,0.07);
    flex-shrink:0;
}

/* ── Bouton freeze ───────────────────────────────────────────  */
.btn-freeze {
    background:#0f1f35;
    color:#38bdf8;
    border:1px solid #38bdf8;
    font-weight:bold;
    cursor:pointer;
    padding:12px;
    width:100%;
    margin-top:20px;
    margin-bottom:0;
    text-transform:uppercase;
    font-size:11px;
    border-radius:4px;
    transition:background 0.2s, color 0.2s, border-color 0.2s;
    letter-spacing:0.5px;
}
.btn-freeze:hover { background:rgba(56,189,248,0.1); }
.btn-freeze.frozen {
    background:rgba(34,197,94,0.1);
    color:#22c55e;
    border-color:#22c55e;
}

.monitor-header {
    display:flex; align-items:center; justify-content:space-between;
    padding:7px 14px;
    background:#010b13;
    border-bottom:1px solid #0f2133;
    font-size:11px; font-weight:700; letter-spacing:1px; text-transform:uppercase;
    color:rgba(56,189,248,0.65);
}

.monitor-vitals { display:flex; align-items:center; gap:5px; font-size:20px; font-weight:900; color:#38bdf8; font-variant-numeric:tabular-nums; }
.vital-dot { font-size:9px; color:#22c55e; animation:blink-dot 0.9s ease-in-out infinite; }
@keyframes blink-dot { 0%,100%{opacity:1} 50%{opacity:0.15} }

#trace-canvas { display:block; width:100%; image-rendering:pixelated; }

.monitor-footer {
    display:flex; justify-content:space-between; padding:5px 14px;
    background:#010b13; border-top:1px solid #0f2133;
    font-size:10px; color:rgba(56,189,248,0.4);
    letter-spacing:0.8px; text-transform:uppercase;
}

/* ── Input range ─────────────────────────────────────────────  */
input[type="range"] {
    padding:0 !important; background:transparent !important;
    border:none !important; height:20px;
    accent-color:var(--omc-cyan, #38bdf8); cursor:pointer; margin-top:4px;
}

/* ── Impression ──────────────────────────────────────────────  */
@media print {
    aside.sidebar, #monitor-container { display:none !important; }
    body, .interface-container { display:block !important; height:auto !important; }
    .preview-area { background:white !important; padding:0 !important; display:block !important; height:auto !important; overflow:visible !important; }
    #document { width:210mm !important; min-width:0 !important; box-shadow:none !important; border:none !important; margin:0 auto !important; }
}