/* =====================================================================
   VALAD · Herramientas Pro: dosis por peso y riñón, interacciones y riesgo
   ===================================================================== */
.ds-layout, .mx-layout{ display:grid; grid-template-columns:minmax(260px,.85fr) minmax(0,1.6fr); gap:20px; align-items:start; }
.ds-side, .mx-side{ display:flex; flex-direction:column; gap:14px; position:sticky; top:calc(var(--bar-h) + 16px); }
#m-dosis.is-locked .ds-layout, #m-meds.is-locked .mx-layout{ opacity:.5; pointer-events:none; filter:saturate(.6); }
.ds-vars, .mx-ctx{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.ds-vars div, .mx-ctx div{ padding:10px 12px; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--surface); display:flex; flex-direction:column; gap:2px; }
.ds-vars span, .mx-ctx span{ font-size:11.5px; color:var(--muted); }
.ds-vars b, .mx-ctx b{ font-size:22px; font-weight:600; letter-spacing:-.02em; font-variant-numeric:tabular-nums; line-height:1.1; }
.ds-vars i, .mx-ctx i{ font-style:normal; font-size:11px; color:var(--muted); }
.ds-vars em{ font-style:normal; font-size:11px; color:var(--accent-strong); }
.mx-ctx a{ color:var(--accent-strong); }
.ds-search input, .mx-combo input{ width:100%; height:48px; border:1px solid var(--line-strong); border-radius:var(--r-sm); background:var(--surface); color:var(--ink); font:inherit; font-size:16px; padding:0 14px; }
.ds-search input:focus, .mx-combo input:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 18%,transparent); }
.ds-picker{ margin:14px 0 18px; display:flex; flex-direction:column; gap:12px; max-height:300px; overflow:auto; padding-right:4px; }
.ds-group p, .mx-sug p{ margin:0 0 6px; font-size:12px; font-weight:600; color:var(--muted); }
.ds-group div, .mx-sug div{ display:flex; flex-wrap:wrap; gap:6px; }
.ds-chip, .mx-add{ height:34px; padding:0 12px; border-radius:var(--r-pill); border:1px solid var(--line-strong); background:var(--surface); color:var(--ink); font:inherit; font-size:13px; font-weight:560; cursor:pointer; display:inline-flex; align-items:center; gap:6px; transition:background-color var(--d-fast), border-color var(--d-fast), color var(--d-fast), transform var(--d-instant) var(--ease-out); }
.ds-chip:active, .mx-add:active{ transform:scale(.96); }
.ds-chip[aria-pressed="true"]{ background:var(--ink); color:var(--bg); border-color:var(--ink); }
@media (hover:hover){ .ds-chip:hover, .mx-add:hover{ border-color:var(--accent); } }
.mx-add span{ color:var(--accent-strong); font-weight:700; }
.ds-out{ display:flex; flex-direction:column; gap:12px; }
.ds-card{ border:1px solid var(--line); border-radius:var(--r-md); background:var(--surface); padding:16px 18px; animation:modIn var(--d-base) var(--ease-out) both; }
.ds-card.is-danger{ border-color:color-mix(in srgb,var(--risk-vhigh) 45%,var(--line)); }
.ds-card header{ display:flex; justify-content:space-between; gap:12px; align-items:flex-start; margin-bottom:12px; }
.ds-card h3{ margin:0; font-size:17px; font-weight:620; }
.ds-card header p{ margin:2px 0 0; font-size:12.5px; color:var(--muted); }
.ds-doses{ display:flex; flex-direction:column; gap:8px; }
.ds-dose{ padding:10px 12px; border-radius:var(--r-sm); background:var(--accent-soft); display:flex; flex-direction:column; gap:2px; }
.ds-dose span{ font-size:11.5px; color:var(--accent-strong); font-weight:600; }
.ds-dose b{ font-size:15.5px; font-weight:620; line-height:1.45; }
.ds-dose i{ font-style:normal; font-family:var(--font-mono); font-size:11.5px; color:var(--ink-2); }
.ds-dose em{ font-style:normal; font-size:12.5px; color:var(--warn-tx); margin-top:4px; line-height:1.45; }
.ds-dose-off{ background:var(--surface-2); }
.ds-card.is-danger .ds-dose:last-child{ background:var(--danger-bg); }
.ds-card.is-danger .ds-dose:last-child span, .ds-card.is-danger .ds-dose:last-child b{ color:var(--danger-tx); }
.ds-dl{ margin:12px 0 0; display:flex; flex-direction:column; gap:8px; }
.ds-dl div{ display:grid; grid-template-columns:130px 1fr; gap:10px; font-size:13px; }
.ds-dl dt{ color:var(--muted); font-size:12.5px; }
.ds-dl dd{ margin:0; color:var(--ink-2); line-height:1.5; }
.ds-src, .mx-src{ margin-top:12px; padding-top:10px; border-top:1px solid var(--line); font-size:12px; }
.ds-src b, .mx-src b{ color:var(--accent-strong); }
.ds-src ul, .mx-src ul{ margin:4px 0 0; padding-left:18px; color:var(--ink-2); }
.ds-src a, .mx-src a{ color:var(--accent-strong); }
.ds-empty, .mx-empty, .mx-ok{ font-size:14px; color:var(--muted); padding:14px; border:1px dashed var(--line-strong); border-radius:var(--r-md); margin:0; }
.mx-ok{ color:var(--ok-tx); background:var(--ok-bg); border-style:solid; border-color:transparent; }

/* ---------- Interacciones ---------- */
.mx-block{ background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); padding:16px 18px; }
.mx-main{ display:flex; flex-direction:column; gap:14px; min-width:0; }
.mx-h{ margin:0 0 10px; font-size:13px; font-weight:600; color:var(--muted); letter-spacing:var(--track-label); }
.mx-h-row{ display:flex; justify-content:space-between; align-items:baseline; }
.mx-n{ font:500 12px/1 var(--font-mono); color:var(--muted); }
.mx-dzs{ display:flex; flex-wrap:wrap; gap:6px; }
.mx-dz{ height:32px; padding:0 11px; border-radius:var(--r-pill); border:1px solid var(--line-strong); background:transparent; font:inherit; font-size:12.5px; font-weight:560; color:var(--ink-2); cursor:pointer; transition:background-color var(--d-fast), color var(--d-fast), border-color var(--d-fast); }
.mx-dz[aria-pressed="true"]{ background:var(--accent-soft); color:var(--accent-strong); border-color:color-mix(in srgb,var(--accent) 40%,transparent); }
.mx-combo{ position:relative; }
.mx-combo svg{ position:absolute; left:14px; top:17px; width:18px; height:18px; color:var(--muted); pointer-events:none; }
.mx-combo input{ padding-left:42px; height:52px; }
.mx-listbox{ position:absolute; left:0; right:0; top:calc(100% + 6px); z-index:var(--z-sheet); list-style:none; margin:0; padding:6px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r-md); box-shadow:var(--shadow-3); max-height:320px; overflow:auto; animation:modIn var(--d-fast) var(--ease-out) both; }
.mx-listbox li{ display:flex; flex-direction:column; gap:1px; padding:9px 12px; border-radius:var(--r-sm); cursor:pointer; }
.mx-listbox li b{ font-size:14.5px; font-weight:600; }
.mx-listbox li span{ font-size:12px; color:var(--muted); }
.mx-listbox li[aria-selected="true"]{ background:var(--accent-soft); }
.mx-listbox li[aria-selected="true"] b{ color:var(--accent-strong); }
.mx-listbox .mx-none{ cursor:default; color:var(--muted); font-size:13px; }
.mx-chips{ list-style:none; margin:12px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
.mx-chips:empty{ display:none; }
.mx-chip{ display:inline-flex; align-items:center; gap:4px; padding:5px 6px 5px 12px; border-radius:var(--r-md); background:var(--ink); color:var(--bg); animation:modIn var(--d-base) var(--ease-spring) both; }
.mx-chip span{ display:flex; flex-direction:column; line-height:1.2; }
.mx-chip b{ font-size:13.5px; font-weight:600; }
.mx-chip i{ font-style:normal; font-size:11px; color:color-mix(in srgb,var(--bg) 70%,transparent); }
.mx-chip button{ width:28px; height:28px; border:0; border-radius:50%; background:transparent; color:var(--bg); font-size:18px; line-height:1; cursor:pointer; }
.mx-chip button:hover{ background:color-mix(in srgb,var(--bg) 15%,transparent); }
.mx-sugs{ margin-top:16px; display:flex; flex-direction:column; gap:12px; }
.mx-summary{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:8px; margin-bottom:12px; }
.mx-summary:empty{ display:none; }
.mx-count{ padding:10px 12px; border-radius:var(--r-sm); background:var(--bg); border:1px solid var(--line); display:flex; flex-direction:column; }
.mx-count b{ font-size:24px; font-weight:600; letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
.mx-count span{ font-size:11.5px; color:var(--muted); }
.mx-count.mx-contraindicado b{ color:var(--risk-max); }
.mx-count.mx-evitar b{ color:var(--risk-vhigh); }
.mx-count.mx-precaucion b{ color:#a86e00; }
:root[data-theme="dark"] .mx-count.mx-precaucion b{ color:var(--risk-mod); }
.mx-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
.mx-alert details{ border:1px solid var(--line); border-left:4px solid var(--line-strong); border-radius:var(--r-sm); background:var(--bg); }
.mx-contraindicado details{ border-left-color:var(--risk-max); }
.mx-evitar details{ border-left-color:var(--risk-vhigh); }
.mx-precaucion details{ border-left-color:var(--risk-mod); }
.mx-informativo details{ border-left-color:var(--info-bd); }
.mx-alert summary{ list-style:none; cursor:pointer; display:grid; grid-template-columns:auto 1fr auto; gap:10px; align-items:center; padding:11px 12px; }
.mx-alert summary::-webkit-details-marker{ display:none; }
.mx-sev{ font:600 10.5px/1 var(--font-mono); padding:5px 7px; border-radius:var(--r-xs); background:var(--surface-2); color:var(--ink-2); white-space:nowrap; }
.mx-contraindicado .mx-sev{ background:var(--risk-max); color:#fff; }
.mx-evitar .mx-sev{ background:var(--risk-vhigh); color:#fff; }
.mx-precaucion .mx-sev{ background:var(--risk-mod); color:var(--risk-mod-ink); }
.mx-title{ display:flex; flex-direction:column; min-width:0; }
.mx-title b{ font-size:14.5px; font-weight:620; }
.mx-title i{ font-style:normal; font-size:12.5px; color:var(--muted); }
.mx-body{ padding:0 14px 12px; font-size:13.5px; color:var(--ink-2); }
.mx-body p{ margin:6px 0; }
.mx-extra{ font-family:var(--font-mono); font-size:12px; color:var(--accent-strong); }
.mx-pending{ margin:10px 0 0; font-size:12.5px; color:var(--warn-tx); background:var(--warn-bg); padding:8px 10px; border-radius:var(--r-sm); }
@media (max-width:1100px){
  .ds-layout, .mx-layout{ grid-template-columns:1fr; }
  .ds-side, .mx-side{ position:static; }
  .mx-summary{ grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:960px){
  .ds-dl div{ grid-template-columns:1fr; gap:2px; }
  .mx-summary{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .mx-alert summary{ grid-template-columns:auto 1fr; }
  .mx-alert summary .ev{ display:none; }
}
.ds-crit{ margin-top:8px; padding:10px 12px; border-radius:var(--r-sm); border:1px solid var(--line); background:var(--bg); }
.ds-crit span{ display:block; font-size:11.5px; font-weight:600; color:var(--muted); margin-bottom:6px; }
.ds-crit ul{ list-style:none; margin:0 0 6px; padding:0; display:flex; flex-wrap:wrap; gap:6px; }
.ds-crit li{ font-size:12.5px; padding:3px 8px; border-radius:var(--r-xs); background:var(--surface-2); color:var(--ink-2); }
.ds-crit li.ds-crit-yes{ background:var(--warn-bg); color:var(--warn-tx); font-weight:600; }
.ds-crit li.ds-crit-na{ font-style:italic; }
.ds-crit b{ font-size:14px; font-weight:620; color:var(--ink); }
.ds-more{ margin-top:10px; font-size:12.5px; color:var(--ink-2); }
.ds-more summary{ cursor:pointer; font-weight:600; color:var(--accent-strong); padding:4px 0; }
.ds-more p{ margin:6px 0; line-height:1.55; }
.ds-warn{ grid-column:1 / -1; background:var(--warn-bg)!important; border-color:transparent!important; }
.ds-warn span{ color:var(--warn-tx)!important; font-weight:600; }
.ds-warn em{ color:var(--warn-tx)!important; font-size:12px!important; }

.mx-cond{ font-size:13px; color:var(--ink-2); background:var(--surface-2, var(--surface)); padding:8px 10px; border-radius:var(--r-sm); }
