/*
 * ══════════════════════════════════════════════════════════════
 * Cardioteca.com — Guía Clínica Interactiva
 * Fibrilación Auricular · ESC 2024
 * Archivo: style.css
 * Carpeta: /components/com_cardiotools/fa/
 * © Campus Formación Sanitaria S.L. — CIF B88633318
 * ══════════════════════════════════════════════════════════════
 */

/* ── VARIABLES ──────────────────────────────────────────── */
#fa-root{
  --bg:#f0f4f8;--surface:#ffffff;--surface2:#f8fafc;
  --border:#dde3ed;--border-focus:#0e6fbd;
  --navy:#0d2d5e;--navy2:#1a4a8a;
  --teal:#0891b2;--teal2:#0e7490;
  --green:#059669;--blue:#2563eb;--amber:#d97706;--red:#dc2626;
  --text:#1e293b;--text2:#475569;--text3:#94a3b8;
  --shadow:0 1px 3px rgba(0,0,0,.08),0 4px 16px rgba(0,0,0,.06);
  --shadow2:0 2px 8px rgba(0,0,0,.12),0 8px 32px rgba(0,0,0,.08);
}
/* ── RESET ──────────────────────────────────────────────── */
#fa-root,#fa-root *,#fa-root *::before,#fa-root *::after{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
#fa-root button:focus:not(:focus-visible),
#fa-root input:focus:not(:focus-visible),
#fa-root select:focus:not(:focus-visible),
#fa-root label:focus:not(:focus-visible){outline:none}
#fa-root{background:var(--bg);color:var(--text);font-family:'Source Sans 3',sans-serif;font-size:15px;line-height:1.6;padding:24px 16px 48px;max-width:780px;margin:0 auto;min-height:auto}
/* ── HEADER ─────────────────────────────────────────────── */
#fa-root .app-header{text-align:center;margin-bottom:28px}
#fa-root .badge{display:inline-flex;align-items:center;gap:6px;background:var(--navy);color:#fff;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:4px 12px;border-radius:20px;margin-bottom:14px;font-family:'Outfit',sans-serif}
#fa-root .badge .dot{width:6px;height:6px;border-radius:50%;background:var(--teal);animation:faPulse 2s infinite}
@keyframes faPulse{0%,100%{opacity:1}50%{opacity:.4}}
#fa-root .app-header h1{font-family:'Outfit',sans-serif;font-size:26px;font-weight:700;color:var(--navy);line-height:1.2;margin-bottom:6px}
#fa-root .app-header h1 span{color:var(--teal)}
#fa-root .app-header p{color:var(--text2);font-size:14px;max-width:520px;margin:0 auto}
/* ── PROGRESS BAR ───────────────────────────────────────── */
#fa-root .fa-prog-bar{display:flex;align-items:center;margin-bottom:24px;padding:0 4px}
#fa-root .prog-step{display:flex;flex-direction:column;align-items:center;gap:5px;flex:1}
#fa-root .prog-circle{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;font-family:'Outfit',sans-serif;transition:all .3s;border:2px solid var(--border);background:var(--surface);color:var(--text3)}
#fa-root .prog-circle.active{border-color:var(--navy);background:var(--navy);color:#fff}
#fa-root .prog-circle.done{border-color:var(--teal);background:var(--teal);color:#fff}
#fa-root .prog-label{font-size:10px;color:var(--text3);font-weight:500;text-align:center;line-height:1.3;white-space:nowrap}
#fa-root .prog-label.active{color:var(--navy);font-weight:600}
#fa-root .prog-label.done{color:var(--teal)}
#fa-root .prog-line{flex:1;height:2px;background:var(--border);transition:background .3s;max-width:48px;margin-bottom:16px}
#fa-root .prog-line.done{background:var(--teal)}
/* ── CARD ───────────────────────────────────────────────── */
#fa-root .card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:24px;box-shadow:var(--shadow);margin-bottom:16px}
#fa-root .card-title{font-family:'Outfit',sans-serif;font-size:18px;font-weight:600;color:var(--navy);margin-bottom:5px}
#fa-root .card-subtitle{font-size:13px;color:var(--text2);margin-bottom:20px}
/* ── BREADCRUMB ─────────────────────────────────────────── */
#fa-root .breadcrumb{background:linear-gradient(135deg,#eff6ff,#ecfdf5);border:1px solid var(--border);border-radius:10px;padding:9px 14px;margin-bottom:18px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
#fa-root .bc-label{font-size:11px;color:var(--text3);font-weight:600;text-transform:uppercase;letter-spacing:.08em;font-family:'Outfit',sans-serif}
#fa-root .bc-val{font-size:13px;font-weight:600;color:var(--navy);font-family:'Outfit',sans-serif}
#fa-root .bc-sep{color:var(--text3);font-size:12px}
/* ── FORM SECTION ───────────────────────────────────────── */
#fa-root .form-section{margin-bottom:22px}
#fa-root .form-section-title{font-family:'Outfit',sans-serif;font-size:12px;font-weight:700;color:var(--teal2);text-transform:uppercase;letter-spacing:.08em;margin-bottom:12px;padding-bottom:5px;border-bottom:1px solid var(--border)}
#fa-root .hint{font-size:11px;color:var(--text3);font-style:italic;line-height:1.5}
/* ── OPTION LIST ────────────────────────────────────────── */
#fa-root .option-list{display:flex;flex-direction:column;gap:9px}
#fa-root .opt-list-btn{border:2px solid var(--border);background:var(--surface2);border-radius:10px;padding:12px 16px;cursor:pointer;text-align:left;transition:all .2s;font-family:'Source Sans 3',sans-serif;font-size:14px;font-weight:500;color:var(--text);width:100%;display:flex;align-items:flex-start;gap:10px}
#fa-root .opt-list-btn:hover{border-color:var(--teal)}
#fa-root .opt-list-btn.sel{border-color:var(--navy);background:var(--navy);color:#fff}
/* ── CHA2DS2-VA GRID ────────────────────────────────────── */
#fa-root .cha2-grid{display:flex;flex-direction:column;gap:8px}
#fa-root .cha2-item{display:flex;align-items:center;gap:12px;background:var(--surface2);border:2px solid var(--border);border-radius:10px;padding:11px 14px;cursor:pointer;transition:all .2s;user-select:none}
#fa-root .cha2-item:hover{border-color:var(--teal)}
#fa-root .cha2-item.cha2-sel{border-color:var(--navy);background:#eff6ff}
#fa-root .cha2-item.cha2-disabled{opacity:.4;cursor:not-allowed;pointer-events:none}
#fa-root .cha2-check{width:22px;height:22px;border-radius:6px;border:2px solid var(--border);background:#fff;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:var(--navy);flex-shrink:0;transition:all .2s}
#fa-root .cha2-item.cha2-sel .cha2-check{background:var(--navy);border-color:var(--navy);color:#fff}
#fa-root .cha2-label{flex:1;font-size:14px;color:var(--text);font-weight:500}
#fa-root .cha2-item.cha2-sel .cha2-label{color:var(--navy);font-weight:600}
#fa-root .cha2-points{font-family:'JetBrains Mono',monospace;font-size:12px;font-weight:700;padding:2px 8px;border-radius:12px;background:var(--bg);color:var(--text3);flex-shrink:0}
#fa-root .cha2-item.cha2-sel .cha2-points{background:var(--navy);color:#fff}
#fa-root .cha2-points.pts2{background:#fef2f2;color:var(--red)}
#fa-root .cha2-item.cha2-sel .cha2-points.pts2{background:var(--red);color:#fff}
/* ── SCORE DISPLAY ──────────────────────────────────────── */
#fa-root .score-box{background:linear-gradient(135deg,var(--navy),var(--navy2));border-radius:14px;padding:18px 20px;display:flex;align-items:center;gap:16px;margin:16px 0 0}
#fa-root .score-num{font-family:'Outfit',sans-serif;font-size:48px;font-weight:700;color:#fff;line-height:1;flex-shrink:0}
#fa-root .score-info{flex:1}
#fa-root .score-title{font-family:'Outfit',sans-serif;font-size:12px;font-weight:700;color:rgba(255,255,255,.7);text-transform:uppercase;letter-spacing:.08em;margin-bottom:4px}
#fa-root .score-rec{font-size:14px;color:#fff;font-weight:600;line-height:1.4}
#fa-root .score-class{display:inline-flex;align-items:center;padding:3px 10px;border-radius:12px;font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:500;margin-top:6px;border:1.5px solid}
#fa-root .score-class.cI{background:#f0fdf4;color:#065f46;border-color:#6ee7b7}
#fa-root .score-class.cIIa{background:#eff6ff;color:#1e40af;border-color:#93c5fd}
#fa-root .score-class.cIII{background:#fef2f2;color:#991b1b;border-color:#fca5a5}
/* ── SPECIAL SITUATIONS ─────────────────────────────────── */
#fa-root .special-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
@media(max-width:440px){#fa-root .special-grid{grid-template-columns:1fr}}
#fa-root .special-item{display:flex;align-items:center;gap:10px;background:var(--surface2);border:2px solid var(--border);border-radius:10px;padding:10px 12px;cursor:pointer;transition:all .2s;user-select:none}
#fa-root .special-item:hover{border-color:var(--amber)}
#fa-root .special-item.sp-sel{border-color:var(--amber);background:#fffbeb}
#fa-root .special-item.sp-sel .cha2-check{background:var(--amber);border-color:var(--amber);color:#fff}
#fa-root .special-item.sp-sel .cha2-label{color:#92400e;font-weight:600}
/* ── ANTICOAG RESULT BOX ────────────────────────────────── */
#fa-root .anticoag-box{border-radius:12px;padding:16px;margin-top:14px;border:1.5px solid}
#fa-root .anticoag-box.ac-none{background:#fef2f2;border-color:#fca5a5}
#fa-root .anticoag-box.ac-consider{background:#eff6ff;border-color:#93c5fd}
#fa-root .anticoag-box.ac-recommended{background:#f0fdf4;border-color:#6ee7b7}
#fa-root .anticoag-box.ac-avk{background:#f0fdf4;border-color:#6ee7b7}
#fa-root .anticoag-header{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;flex-wrap:wrap;margin-bottom:8px}
#fa-root .anticoag-title{font-family:'Outfit',sans-serif;font-size:15px;font-weight:700;color:var(--navy)}
#fa-root .anticoag-text{font-size:13px;color:var(--text2);line-height:1.5}
/* ── EHRA GRID ──────────────────────────────────────────── */
#fa-root .ehra-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
@media(max-width:520px){#fa-root .ehra-grid{grid-template-columns:repeat(2,1fr)}}
#fa-root .ehra-card{border:2px solid var(--border);background:var(--surface2);border-radius:12px;padding:12px 8px;cursor:pointer;text-align:center;transition:all .2s;user-select:none}
#fa-root .ehra-card:hover{border-color:var(--teal);transform:translateY(-1px)}
#fa-root .ehra-card.ehra-sel{border-color:var(--navy);background:var(--navy)}
#fa-root .ehra-icon{font-size:22px;display:block;margin-bottom:5px}
#fa-root .ehra-class{font-family:'Outfit',sans-serif;font-size:13px;font-weight:700;color:var(--navy);display:block;margin-bottom:2px}
#fa-root .ehra-card.ehra-sel .ehra-class{color:#fff}
#fa-root .ehra-desc{font-size:10px;color:var(--text3);line-height:1.3;display:block}
#fa-root .ehra-card.ehra-sel .ehra-desc{color:rgba(255,255,255,.65)}
/* ── FEVI / LA SIZE CARDS ───────────────────────────────── */
#fa-root .fevi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
#fa-root .la-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
@media(max-width:480px){#fa-root .la-grid{grid-template-columns:repeat(2,1fr)}}
#fa-root .fevi-card,#fa-root .la-card{border:2px solid var(--border);background:var(--surface2);border-radius:12px;padding:14px 10px;cursor:pointer;text-align:center;transition:all .2s;user-select:none}
#fa-root .fevi-card:hover,#fa-root .la-card:hover{border-color:var(--teal);transform:translateY(-1px)}
#fa-root .fevi-card.fevi-sel{border-color:var(--navy);background:var(--navy)}
#fa-root .la-card.la-sel{border-color:var(--teal2);background:var(--teal2)}
#fa-root .fevi-val,#fa-root .la-val{font-family:'JetBrains Mono',monospace;font-size:13px;font-weight:700;color:var(--navy);display:block;margin-bottom:4px}
#fa-root .fevi-card.fevi-sel .fevi-val,#fa-root .la-card.la-sel .la-val{color:#fff}
#fa-root .fevi-lbl,#fa-root .la-lbl{font-family:'Outfit',sans-serif;font-size:12px;font-weight:600;color:var(--text2);display:block;line-height:1.3}
#fa-root .fevi-card.fevi-sel .fevi-lbl,#fa-root .la-card.la-sel .la-lbl{color:rgba(255,255,255,.8)}
/* ── STRATEGY RECOMMENDATION BOX ───────────────────────── */
#fa-root .strat-rec-box{border-radius:14px;padding:18px 20px;margin-bottom:20px;border:2px solid}
#fa-root .strat-rec-box.rec-rhythm{background:linear-gradient(135deg,#ecfdf5,#eff6ff);border-color:#6ee7b7}
#fa-root .strat-rec-box.rec-rate{background:linear-gradient(135deg,#eff6ff,#f0f9ff);border-color:#93c5fd}
#fa-root .strat-rec-box.rec-both{background:linear-gradient(135deg,#fffbeb,#f8fafc);border-color:#fcd34d}
#fa-root .strat-rec-header{display:flex;align-items:flex-start;gap:8px;margin-bottom:12px;flex-wrap:wrap}
#fa-root .strat-rec-badge{font-family:'Outfit',sans-serif;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;padding:4px 12px;border-radius:20px;white-space:nowrap;flex-shrink:0}
#fa-root .strat-rec-box.rec-rhythm .strat-rec-badge{background:var(--teal2);color:#fff}
#fa-root .strat-rec-box.rec-rate .strat-rec-badge{background:var(--blue);color:#fff}
#fa-root .strat-rec-box.rec-both .strat-rec-badge{background:var(--amber);color:#fff}
#fa-root .strat-rec-title{font-family:'Outfit',sans-serif;font-size:15px;font-weight:700;color:var(--navy)}
#fa-root .strat-rec-strength{font-size:11px;color:var(--text3);font-family:'JetBrains Mono',monospace;padding:4px 10px;background:rgba(255,255,255,.6);border-radius:10px;flex-shrink:0}
#fa-root .strat-rec-narrative{font-size:14px;color:var(--text);line-height:1.6;margin-bottom:12px}
#fa-root .strat-factors{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media(max-width:480px){#fa-root .strat-factors{grid-template-columns:1fr}}
#fa-root .factor-col{background:rgba(255,255,255,.7);border-radius:10px;padding:10px 12px}
#fa-root .factor-col-title{font-family:'Outfit',sans-serif;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;margin-bottom:7px}
#fa-root .factor-col.fc-rhythm .factor-col-title{color:var(--teal2)}
#fa-root .factor-col.fc-rate .factor-col-title{color:var(--blue)}
#fa-root .factor-col ul{list-style:none;display:flex;flex-direction:column;gap:5px}
#fa-root .factor-col li{font-size:12px;color:var(--text2);line-height:1.4;display:flex;gap:6px}
#fa-root .factor-col.fc-rhythm li::before{content:"▶";color:var(--teal);font-size:9px;flex-shrink:0;margin-top:3px}
#fa-root .factor-col.fc-rate li::before{content:"▶";color:var(--blue);font-size:9px;flex-shrink:0;margin-top:3px}
/* ── STRATEGY CHOICE CARDS ──────────────────────────────── */
#fa-root .strat-choice-label{font-family:'Outfit',sans-serif;font-size:12px;font-weight:700;color:var(--text2);text-transform:uppercase;letter-spacing:.08em;margin-bottom:12px;margin-top:28px}
#fa-root .strategy-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:4px}
@media(max-width:380px){#fa-root .strategy-grid{grid-template-columns:1fr}}
#fa-root .strategy-card{border:2px solid var(--border);background:var(--surface2);border-radius:14px;padding:18px 14px;cursor:pointer;text-align:center;transition:all .2s;user-select:none;position:relative}
#fa-root .strategy-card:hover{transform:translateY(-2px);box-shadow:0 4px 16px rgba(0,0,0,.1)}
#fa-root .strategy-card.strat-rate-c{border-color:var(--blue);background:#eff6ff}
#fa-root .strategy-card.strat-rhythm-c{border-color:var(--teal);background:#ecfdf5}
#fa-root .strat-rec-tag{position:absolute;top:-10px;left:50%;transform:translateX(-50%);font-family:'Outfit',sans-serif;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:2px 10px;border-radius:10px;white-space:nowrap}
#fa-root .strat-rec-tag.tag-rhythm{background:var(--teal2);color:#fff}
#fa-root .strat-rec-tag.tag-rate{background:var(--blue);color:#fff}
#fa-root .strat-rec-tag.tag-both{background:var(--amber);color:#fff}
#fa-root .strategy-icon{font-size:28px;display:block;margin-bottom:8px}
#fa-root .strategy-title{font-family:'Outfit',sans-serif;font-size:15px;font-weight:700;color:var(--navy);margin-bottom:5px}
#fa-root .strategy-card.strat-rate-c .strategy-title{color:var(--blue)}
#fa-root .strategy-card.strat-rhythm-c .strategy-title{color:var(--teal2)}
#fa-root .strategy-desc{font-size:12px;color:var(--text2);line-height:1.5}
/* ── MODALITY REC BOX ───────────────────────────────────── */
#fa-root .modality-box{border-radius:14px;padding:20px;border:2px solid;margin-bottom:16px}
#fa-root .modality-box.mod-ablation{background:linear-gradient(135deg,#ecfdf5,#f0f9ff);border-color:var(--teal)}
#fa-root .modality-box.mod-pharma{background:linear-gradient(135deg,#eff6ff,#f0f4f8);border-color:var(--blue)}
#fa-root .modality-box.mod-both{background:linear-gradient(135deg,#fffbeb,#f8fafc);border-color:var(--amber)}
#fa-root .mod-header{display:flex;align-items:flex-start;gap:14px;margin-bottom:14px}
#fa-root .mod-icon{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0}
#fa-root .modality-box.mod-ablation .mod-icon{background:#d1fae5}
#fa-root .modality-box.mod-pharma .mod-icon{background:#dbeafe}
#fa-root .modality-box.mod-both .mod-icon{background:#fef3c7}
#fa-root .mod-title{font-family:'Outfit',sans-serif;font-size:16px;font-weight:700;color:var(--navy);margin-bottom:4px}
#fa-root .mod-subtitle{font-size:13px;color:var(--text2);line-height:1.4}
#fa-root .mod-reasons{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
@media(max-width:480px){#fa-root .mod-reasons{grid-template-columns:1fr}}
/* ── REFERRAL BOX ───────────────────────────────────────── */
#fa-root .referral-box{background:#f8fafc;border:1.5px solid var(--border);border-radius:12px;padding:16px;margin-top:14px}
#fa-root .referral-title{font-family:'Outfit',sans-serif;font-size:12px;font-weight:700;color:var(--teal2);text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px;display:flex;align-items:center;gap:6px}
#fa-root .referral-text{font-size:13px;color:var(--text);line-height:1.7;font-style:italic;background:#fff;border:1px solid var(--border);border-radius:8px;padding:12px 14px}
#fa-root .referral-hint{font-size:11px;color:var(--text3);margin-top:8px;font-style:italic}
/* ── BUTTONS ────────────────────────────────────────────── */
#fa-root .nav-row{display:flex;justify-content:space-between;align-items:center;margin-top:22px;gap:12px}
#fa-root .btn-back{background:none;border:1.5px solid var(--border);border-radius:8px;padding:9px 18px;font-family:'Source Sans 3',sans-serif;font-size:14px;font-weight:500;color:var(--text2);cursor:pointer;transition:all .2s}
#fa-root .btn-back:hover{border-color:var(--navy);color:var(--navy)}
#fa-root .btn-next{background:var(--navy);color:#fff;border:none;border-radius:8px;padding:10px 24px;font-family:'Outfit',sans-serif;font-size:15px;font-weight:600;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:8px}
#fa-root .btn-next:hover{background:var(--navy2);transform:translateY(-1px);box-shadow:0 4px 12px rgba(13,45,94,.25)}
#fa-root .btn-next:disabled{background:var(--text3);cursor:not-allowed;transform:none;box-shadow:none}
#fa-root .btn-analyze{background:linear-gradient(135deg,var(--teal2),var(--navy));color:#fff;border:none;border-radius:8px;padding:12px 28px;font-family:'Outfit',sans-serif;font-size:15px;font-weight:700;cursor:pointer;transition:all .2s;width:100%;display:flex;align-items:center;justify-content:center;gap:10px;box-shadow:0 4px 16px rgba(8,145,178,.3)}
#fa-root .btn-analyze:hover{transform:translateY(-2px);box-shadow:0 6px 24px rgba(8,145,178,.4)}
#fa-root .btn-analyze:disabled{background:var(--text3);cursor:not-allowed;transform:none;box-shadow:none}
#fa-root .btn-restart{background:var(--surface2);border:1.5px solid var(--border);border-radius:8px;padding:10px 24px;font-family:'Source Sans 3',sans-serif;font-size:14px;font-weight:600;color:var(--text2);cursor:pointer;transition:all .2s;width:100%;margin-top:10px}
#fa-root .btn-restart:hover{background:var(--border);color:var(--navy)}
/* ── EVIDENCE BADGES ────────────────────────────────────── */
#fa-root .ev-row{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
#fa-root .ev-badge{display:inline-flex;align-items:center;gap:5px;padding:4px 12px;border-radius:20px;font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:500;border:1.5px solid}
#fa-root .ev-badge.cI{background:#f0fdf4;color:#065f46;border-color:#6ee7b7}
#fa-root .ev-badge.cIIa{background:#eff6ff;color:#1e40af;border-color:#93c5fd}
#fa-root .ev-badge.cIIb{background:#fffbeb;color:#92400e;border-color:#fcd34d}
#fa-root .ev-badge.cIII{background:#fef2f2;color:#991b1b;border-color:#fca5a5}
#fa-root .ev-badge.loe{background:#f8fafc;color:var(--text2);border-color:var(--border)}
/* ── RESULT SECTIONS NUMBERED ───────────────────────────── */
#fa-root .result-header{display:flex;align-items:flex-start;gap:14px;margin-bottom:20px}
#fa-root .result-icon{width:52px;height:52px;border-radius:13px;display:flex;align-items:center;justify-content:center;font-size:24px;flex-shrink:0}
#fa-root .result-icon.ic-blue{background:#eff6ff}
#fa-root .result-icon.ic-green{background:#f0fdf4}
#fa-root .result-icon.ic-amber{background:#fffbeb}
#fa-root .result-title{font-family:'Outfit',sans-serif;font-size:20px;font-weight:700;color:var(--navy);line-height:1.2;margin-bottom:3px}
#fa-root .result-subtitle{font-size:13px;color:var(--text2)}
#fa-root .rec-section{border-top:1px solid var(--border);padding-top:0;margin-top:0}
#fa-root details.rec-section{background:var(--surface);border-top:1px solid var(--border)}
#fa-root details.rec-section>summary{list-style:none;cursor:pointer;display:flex;flex-direction:column;gap:6px;padding:13px 0;user-select:none;-webkit-user-select:none}
#fa-root details.rec-section>summary::-webkit-details-marker{display:none}
#fa-root details.rec-section>summary::marker{display:none}
#fa-root .rec-summary-row1{display:flex;align-items:center;gap:10px;justify-content:space-between}
#fa-root .rec-summary-left{display:flex;align-items:center;gap:10px;flex:1;min-width:0}
#fa-root .rec-summary-chip{display:inline-block;font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:500;padding:3px 10px;border-radius:10px;border:1px solid;margin-left:36px;align-self:flex-start}
#fa-root .rec-summary-chip.chip-yes{background:#f0fdf4;border-color:#6ee7b7;color:#065f46}
#fa-root .rec-summary-chip.chip-blue{background:#eff6ff;border-color:#93c5fd;color:#1e40af}
#fa-root .rec-summary-chip.chip-amber{background:#fffbeb;border-color:#fcd34d;color:#92400e}
#fa-root .rec-summary-chip.chip-na{background:#f8fafc;border-color:var(--border);color:var(--text3);font-style:italic}
#fa-root .rec-expand-bar{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:8px;padding:8px 14px;background:linear-gradient(135deg,#f0f9ff,#ecfdf5);border:1px solid var(--teal);border-radius:8px;font-family:'Outfit',sans-serif;font-size:12px;font-weight:600;color:var(--teal2);letter-spacing:.02em}
#fa-root details.rec-section[open] .rec-expand-bar{display:none}
#fa-root .rec-chevron{font-size:11px;color:var(--text3);flex-shrink:0;transition:transform .25s}
#fa-root details.rec-section[open] .rec-chevron{transform:rotate(180deg)}
#fa-root .rec-details-body{padding:4px 0 18px}
#fa-root .rec-section-header{display:flex;align-items:center;gap:10px;margin-bottom:6px}
#fa-root .rec-section-num{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:'Outfit',sans-serif;font-size:12px;font-weight:700;flex-shrink:0;color:#fff}
#fa-root .rec-section-num.n-shield{background:var(--navy)}
#fa-root .rec-section-num.n-scale{background:var(--teal2)}
#fa-root .rec-section-num.n-rhythm{background:var(--teal)}
#fa-root .rec-section-num.n-rate{background:var(--blue)}
#fa-root .rec-section-num.n-comorbid{background:var(--amber)}
#fa-root .rec-section-num.n-followup{background:var(--green)}
#fa-root .rec-section-title{font-family:'Outfit',sans-serif;font-size:14px;font-weight:700;color:var(--navy);text-transform:uppercase;letter-spacing:.06em}
#fa-root .rec-section-subtitle{font-size:12px;color:var(--text2);margin-top:2px;margin-bottom:14px;font-style:italic;padding-left:36px}
#fa-root .rec-subsec-title{font-family:'Outfit',sans-serif;font-size:12px;font-weight:700;color:var(--teal2);text-transform:uppercase;letter-spacing:.07em;margin-bottom:8px;margin-top:16px;padding-bottom:4px;border-bottom:1px dashed var(--border)}
/* ── DRUG GRID ───────────────────────────────────────────── */
#fa-root .drug-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}
@media(max-width:560px){#fa-root .drug-grid{grid-template-columns:1fr}}
#fa-root .drug-card{background:var(--surface2);border:1.5px solid var(--border);border-radius:12px;padding:12px 14px;min-width:0;overflow:hidden;margin-bottom:8px}
#fa-root .drug-card.dc-first{border-color:#6ee7b7;background:#f0fdf4}
#fa-root .drug-card.dc-alt{border-color:#93c5fd;background:#eff6ff}
#fa-root .drug-card.dc-last{border-color:#fcd34d;background:#fffbeb}
#fa-root .drug-card.dc-adj{border-color:var(--teal);background:#f0f9ff}
#fa-root .drug-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:6px;margin-bottom:5px;flex-wrap:wrap}
#fa-root .drug-name{font-family:'Outfit',sans-serif;font-size:14px;font-weight:700;color:var(--navy);min-width:0;flex-shrink:1;margin-bottom:3px}
#fa-root .drug-detail{font-size:12px;color:var(--text2);line-height:1.5;word-break:break-word}
#fa-root .drug-tag{display:inline-block;padding:2px 8px;border-radius:10px;font-size:10px;font-weight:700;font-family:'JetBrains Mono',monospace;white-space:normal;word-break:break-word;flex-shrink:0;max-width:100%;margin-right:4px}
#fa-root .drug-bullets{list-style:none;margin:4px 0 0 0;padding:0;display:flex;flex-direction:column;gap:4px}
#fa-root .drug-bullets li{font-size:12px;color:var(--text2);line-height:1.5;padding-left:12px;position:relative}
#fa-root .drug-bullets li::before{content:"•";color:var(--teal);font-weight:700;position:absolute;left:0;top:0}
#fa-root .dt-first{background:#f0fdf4;color:#065f46;border:1px solid #6ee7b7}
#fa-root .dt-alt{background:#eff6ff;color:#1e40af;border:1px solid #93c5fd}
#fa-root .dt-last{background:#fffbeb;color:#92400e;border:1px solid #fcd34d}
#fa-root .dt-adj{background:#f0f9ff;color:var(--teal2);border:1px solid #bae6fd}
#fa-root .notes-list{background:var(--surface2);border-radius:10px;padding:14px 16px;margin-bottom:10px}
#fa-root .notes-title{font-size:10px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.08em;margin-bottom:9px;font-family:'Outfit',sans-serif}
#fa-root .notes-list ul{list-style:none;display:flex;flex-direction:column;gap:7px}
#fa-root .notes-list li{display:block;position:relative;padding-left:14px;font-size:13px;color:var(--text2);line-height:1.5}
#fa-root .notes-list li::before{content:"•";color:var(--teal);font-weight:700;position:absolute;left:0;top:0}
/* ── FOLLOWUP BOX ───────────────────────────────────────── */
#fa-root .followup-box{border:2px solid;border-radius:10px;padding:13px 16px;display:flex;align-items:flex-start;gap:12px;margin-bottom:10px}
#fa-root .followup-box.fu-green{border-color:#6ee7b7;background:#f0fdf4}
#fa-root .followup-box.fu-blue{border-color:#93c5fd;background:#eff6ff}
#fa-root .fu-icon{font-size:22px;flex-shrink:0;margin-top:2px}
#fa-root .fu-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-family:'Outfit',sans-serif;opacity:.7}
#fa-root .fu-value{font-family:'Outfit',sans-serif;font-size:14px;font-weight:700;margin-top:2px}
#fa-root .followup-box.fu-green .fu-value{color:var(--green)}
#fa-root .followup-box.fu-blue .fu-value{color:var(--blue)}
#fa-root .followup-box br{display:block;margin-top:8px;content:''}
/* ── DISCLAIMER ─────────────────────────────────────────── */
#fa-root .disclaimer{background:#fff8e1;border:1px solid #fde68a;border-radius:10px;padding:12px 16px;margin-bottom:16px;display:block}
#fa-root .disclaimer-text{font-size:11px;color:#78350f;line-height:1.6}
#fa-root .disclaimer-text strong{display:inline;font-weight:700}
@media(min-width:520px){#fa-root .disclaimer-text{font-size:12px}}
#fa-root .dis-icon{font-size:15px;flex-shrink:0;margin-top:2px}
#fa-root .dis-text{font-size:12px;color:#78350f;line-height:1.5}
#fa-root .dis-text strong{display:block;margin-bottom:2px;font-size:12px}
/* ── WARNING / INFO BOX ─────────────────────────────────── */
#fa-root .warn-box{background:#fef2f2;border:1px solid #fca5a5;border-radius:10px;padding:11px 14px;margin-bottom:10px;font-size:13px;color:#7f1d1d;display:flex;gap:8px;align-items:flex-start;line-height:1.6}
#fa-root .info-box{background:#eff6ff;border:1px solid #93c5fd;border-radius:10px;padding:11px 14px;margin-bottom:12px;font-size:13px;color:#1e3a5f;display:flex;gap:8px;align-items:flex-start;line-height:1.6}
#fa-root .info-box br,#fa-root .warn-box br,#fa-root .clinical-alert br{display:block;margin-top:6px;content:''}
#fa-root .warn-icon,#fa-root .info-icon{flex-shrink:0;font-size:14px;margin-top:1px}
/* ── CLINICAL ALERT BOX ─────────────────────────────────── */
#fa-root .clinical-alert{background:linear-gradient(135deg,#fffbeb,#fef9c3);border:2px solid #f59e0b;border-radius:10px;padding:13px 15px;margin-bottom:12px;font-size:13px;color:#78350f;display:flex;gap:10px;align-items:flex-start;line-height:1.6;box-shadow:0 2px 8px rgba(245,158,11,.18)}
#fa-root .clinical-alert .ca-icon{flex-shrink:0;font-size:18px;margin-top:0px}
#fa-root .clinical-alert strong{color:#92400e;font-size:13.5px}
#fa-root .clinical-alert .ca-body{flex:1}
/* ── RESULT TEXT ────────────────────────────────────────── */
#fa-root .result-text{font-size:14px;color:var(--text);line-height:1.7;margin-bottom:12px}
/* ── FOOTER ─────────────────────────────────────────────── */
#fa-root .app-footer{text-align:center;margin-top:20px;font-size:11px;color:var(--text3);line-height:1.7}
#fa-root .app-footer strong{color:var(--text2)}
#fa-root .app-footer a{color:var(--teal);text-decoration:none}
#fa-root .app-footer a:hover{text-decoration:underline}
/* ── COADJUVANT BANNER ──────────────────────────────────── */
#fa-root .coadj-banner{background:linear-gradient(135deg,#f0f9ff,#ecfdf5);border:1.5px solid var(--teal);border-radius:10px;padding:10px 14px;margin-bottom:14px;display:flex;align-items:center;gap:10px;font-size:13px;color:var(--teal2);font-weight:500}
#fa-root .coadj-banner strong{font-family:'Outfit',sans-serif;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.06em}
/* ── URGENCY MESSAGE (step 2) ───────────────────────────── */
#fa-root .ac-urgent{background:linear-gradient(135deg,#fff1f2,#fff8e1);border:2px solid #fca5a5;border-radius:12px;padding:14px 16px;margin-top:14px;display:flex;gap:12px;align-items:flex-start}
#fa-root .ac-urgent-icon{font-size:22px;flex-shrink:0}
#fa-root .ac-urgent-title{font-family:'Outfit',sans-serif;font-size:13px;font-weight:700;color:#991b1b;text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px}
#fa-root .ac-urgent-text{font-size:13px;color:#7f1d1d;line-height:1.5}
/* ── TRIAGE BLOCKS ──────────────────────────────────────── */
#fa-root .triage-block{border-radius:12px;padding:16px;margin-bottom:12px;border:2px solid}
#fa-root .triage-block.tb-red{background:#fff1f2;border-color:#fca5a5}
#fa-root .triage-block.tb-orange{background:#fff7ed;border-color:#fdba74}
#fa-root .triage-block.tb-green{background:#f0fdf4;border-color:#6ee7b7}
#fa-root .triage-block-header{display:flex;align-items:center;gap:10px;margin-bottom:12px}
#fa-root .triage-block-icon{font-size:20px;flex-shrink:0}
#fa-root .triage-block-title{font-family:'Outfit',sans-serif;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.07em}
#fa-root .triage-block.tb-red .triage-block-title{color:#991b1b}
#fa-root .triage-block.tb-orange .triage-block-title{color:#9a3412}
#fa-root .triage-block.tb-green .triage-block-title{color:#065f46}
#fa-root .triage-block-sub{font-size:12px;color:var(--text2);margin-top:2px}
#fa-root .triage-item{display:flex;align-items:flex-start;gap:10px;background:rgba(255,255,255,.65);border:1.5px solid rgba(0,0,0,.07);border-radius:9px;padding:10px 12px;cursor:pointer;transition:all .2s;user-select:none;margin-bottom:7px}
#fa-root .triage-item:last-child{margin-bottom:0}
#fa-root .triage-item:hover{background:rgba(255,255,255,.9)}
#fa-root .triage-item.ti-red-sel{background:#fee2e2;border-color:#f87171}
#fa-root .triage-item.ti-orange-sel{background:#ffedd5;border-color:#fb923c}
#fa-root .ti-check{width:20px;height:20px;border-radius:5px;border:2px solid #d1d5db;background:#fff;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex-shrink:0;margin-top:1px;transition:all .2s}
#fa-root .triage-item.ti-red-sel .ti-check{background:#dc2626;border-color:#dc2626;color:#fff}
#fa-root .triage-item.ti-orange-sel .ti-check{background:#ea580c;border-color:#ea580c;color:#fff}
#fa-root .ti-label{font-size:13px;color:var(--text);font-weight:500;line-height:1.4}
#fa-root .ti-sub{font-size:11px;color:var(--text3);margin-top:2px;font-style:italic}
/* ── TRIAGE RESULT ALERTS ───────────────────────────────── */
#fa-root .triage-alert{border-radius:14px;padding:18px 20px;margin-top:16px;border:2px solid}
#fa-root .triage-alert.ta-red{background:linear-gradient(135deg,#fff1f2,#fef2f2);border-color:#f87171}
#fa-root .triage-alert.ta-orange{background:linear-gradient(135deg,#fff7ed,#fffbeb);border-color:#fb923c}
#fa-root .triage-alert.ta-green{background:linear-gradient(135deg,#f0fdf4,#ecfdf5);border-color:#34d399}
#fa-root .triage-alert-header{display:flex;align-items:center;gap:12px;margin-bottom:10px}
#fa-root .triage-alert-icon{font-size:28px;flex-shrink:0}
#fa-root .ta-green .triage-alert-icon{font-size:18px}
#fa-root .triage-alert-title{font-family:'Outfit',sans-serif;font-size:16px;font-weight:700}
#fa-root .triage-alert.ta-red .triage-alert-title{color:#991b1b}
#fa-root .triage-alert.ta-orange .triage-alert-title{color:#9a3412}
#fa-root .triage-alert.ta-green .triage-alert-title{color:#065f46}
#fa-root .triage-alert-text{font-size:13px;line-height:1.6;margin-bottom:10px}
#fa-root .triage-alert.ta-red .triage-alert-text{color:#7f1d1d}
#fa-root .triage-alert.ta-orange .triage-alert-text{color:#7c2d12}
#fa-root .triage-alert.ta-green .triage-alert-text{color:#064e3b}
#fa-root .triage-reasons{list-style:none;display:flex;flex-direction:column;gap:5px;margin-bottom:12px}
#fa-root .triage-reasons li{font-size:12px;line-height:1.4;padding-left:14px;position:relative}
#fa-root .triage-reasons li::before{content:"▶";font-size:8px;position:absolute;left:0;top:3px}
#fa-root .triage-alert.ta-red .triage-reasons li::before{color:#dc2626}
#fa-root .triage-alert.ta-orange .triage-reasons li::before{color:#ea580c}
/* ── DETECTION PANEL ────────────────────────────────────── */
#fa-root .detect-panel{background:var(--surface);border:1px solid var(--border);border-radius:14px;margin-bottom:20px;box-shadow:var(--shadow);overflow:hidden}
#fa-root .detect-toggle{width:100%;background:linear-gradient(135deg,#f0f9ff,#ecfdf5);border:none;padding:14px 18px;cursor:pointer;display:flex;align-items:center;gap:12px;text-align:left;border-radius:14px;transition:background .2s}
#fa-root .detect-toggle:hover{background:linear-gradient(135deg,#e0f2fe,#dcfce7)}
#fa-root .detect-toggle.open{border-radius:14px 14px 0 0}
#fa-root .detect-toggle-icon{font-size:22px;flex-shrink:0}
#fa-root .detect-toggle-text{flex:1}
#fa-root .detect-toggle-title{font-family:'Outfit',sans-serif;font-size:14px;font-weight:700;color:var(--navy);display:block}
#fa-root .detect-toggle-sub{font-size:12px;color:var(--text2);display:block;margin-top:2px}
#fa-root .detect-toggle-arrow{font-size:16px;color:var(--text3);transition:transform .25s;flex-shrink:0}
#fa-root .detect-toggle-arrow.open{transform:rotate(180deg)}
#fa-root .detect-body{display:none;padding:16px 18px 18px;border-top:1px solid var(--border)}
#fa-root .detect-body.open{display:block}
#fa-root .detect-scenario{background:var(--surface2);border:1.5px solid var(--border);border-radius:10px;padding:12px 14px;margin-bottom:10px}
#fa-root .detect-scenario:last-child{margin-bottom:0}
#fa-root .detect-scenario-header{display:flex;align-items:center;gap:10px;margin-bottom:8px}
#fa-root .detect-scenario-icon{font-size:20px;flex-shrink:0}
#fa-root .detect-scenario-title{font-family:'Outfit',sans-serif;font-size:13px;font-weight:700;color:var(--navy)}
#fa-root .detect-scenario-body{font-size:12px;color:var(--text2);line-height:1.6}
#fa-root .detect-scenario-body strong{color:var(--text)}
/* ── EVIDENCE PILLS (inline) ────────────────────────────── */
#fa-root .fa-pill{display:inline-block;white-space:nowrap;font-family:'JetBrains Mono',sans-serif;font-size:11px;font-weight:500;border-radius:10px;padding:1px 7px;border:1px solid;vertical-align:middle;margin-top:4px}
#fa-root li .fa-pill,#fa-root p .fa-pill{margin-top:0;vertical-align:baseline;position:relative;top:-1px}
#fa-root .fa-pill-green{background:#f0fdf4;color:#065f46;border-color:#6ee7b7}
#fa-root .fa-pill-red{background:#fef2f2;color:#991b1b;border-color:#fca5a5}
#fa-root .fa-pill-amber{background:#fffbeb;color:#92400e;border-color:#fcd34d}
