/* التجهيز والحاسبة — فوق activate.css */
.hero-sh{padding-bottom:clamp(24px,4vh,44px)}

/* الأوضاع الجاهزة */
.presets{display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin-bottom:24px}
.pr-lab{margin-left:4px}
.pr{background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:10px 16px; cursor:pointer; text-align:right; color:var(--ink); font-family:var(--ar); transition:border-color .2s var(--ease)}
.pr:hover{border-color:var(--lav)}
.pr b{display:block; font-size:14px}
.pr span{font-size:11px; color:var(--ink-mut)}

/* الشبكة */
.calc-grid{display:grid; grid-template-columns:1.5fr 1fr; gap:22px; align-items:start}
.calc-grid>*{min-width:0}

/* البنود */
.cg{background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:18px; margin-bottom:16px}
.cg-head b{font-size:15.5px; color:var(--lav-hi)}
.cg-head p{font-size:12px; color:var(--ink-mut); margin:2px 0 12px}
.ci{display:grid; grid-template-columns:auto 1fr auto; gap:4px 12px; align-items:center; padding:10px 12px; border:1px solid var(--line); border-radius:12px; margin-bottom:8px; cursor:pointer; opacity:.6; transition:all .2s var(--ease); background:var(--bg2)}
.ci.on{opacity:1; border-color:rgba(150,123,182,.4)}
.ci.warn.on{border-color:rgba(201,123,142,.5)}
.ci input{accent-color:var(--lav); width:16px; height:16px}
.ci-name{font-size:13.5px; font-weight:700}
.ci-note{display:block; font-style:normal; font-size:11px; color:var(--gold); font-weight:400}
.ci-usd{color:var(--lav-hi); font-size:14px; white-space:nowrap}
.ci-src{grid-column:2/4; font-size:9.5px; color:var(--ink-mut)}
.ci.unv .ci-src{color:var(--gold)}

/* الجانب */
.calc-side{position:sticky; top:70px; display:flex; flex-direction:column; gap:14px}
.total-card{background:linear-gradient(135deg,var(--surface2),var(--surface)); border:1px solid var(--lav-deep); border-radius:18px; padding:22px}
.tc-lab{color:var(--gold)}
.tc-big{display:flex; align-items:baseline; gap:10px; margin:8px 0 2px}
.tc-big b{font-size:clamp(38px,4vw,52px); line-height:1.1; color:var(--lav-hi)}
.tc-big span{color:var(--ink-dim)}
.tc-usd{font-size:12px}
.tc-split{list-style:none; margin-top:14px; display:flex; flex-direction:column; gap:6px}
.tc-split li{display:flex; justify-content:space-between; font-size:12.5px; border-bottom:1px dashed var(--line); padding-bottom:5px}
.tc-split b{color:var(--ink)}
.tc-unv{margin-top:10px; font-size:10px; color:var(--gold)}
.valve-card,.media-card{background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:16px}
.valve-card h4,.media-card h4{color:var(--teal); margin-bottom:10px}
.vo{display:block; width:100%; text-align:right; background:var(--bg2); border:1px solid var(--line); border-radius:12px; padding:9px 12px; margin-bottom:7px; cursor:pointer; color:var(--ink); font-family:var(--ar); transition:border-color .2s var(--ease)}
.vo.on{border-color:var(--teal)}
.vo b{font-size:13px; display:block}
.vo span{font-size:10.5px; color:var(--ink-mut)}
.ms{margin-bottom:14px}
.ms-top{display:flex; justify-content:space-between; font-size:12.5px; margin-bottom:4px}
.ms-top b{color:var(--lav-hi)}
.ms input{width:100%; accent-color:var(--lav)}
.ms-src{font-size:9px}
.k-where{color:var(--teal); font-size:11px; direction:ltr; display:inline-block}

@media (max-width:900px){
 .calc-grid{grid-template-columns:1fr}
 .calc-side{position:static}
}
