/* BrandBridge profit calculator. Uses site.css tokens: forest / cream / gold / paper, Alexandria. */
.calc{padding-bottom:var(--s7)}
.calc-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,400px);gap:var(--s4);align-items:start}
@media (max-width:960px){.calc-grid{grid-template-columns:minmax(0,1fr)}}
.calc-in{display:flex;flex-direction:column;gap:var(--s3);min-width:0}

.cstep{background:#fff;border:1px solid var(--rule);padding:var(--s4);display:flex;flex-direction:column;gap:var(--s3)}
@media (max-width:560px){.cstep{padding:var(--s3)}}
.cstep-h{display:flex;gap:var(--s2);align-items:flex-start}
.cstep-h .small{opacity:.7;margin-top:2px}
.cnum{flex:none;width:34px;height:34px;display:grid;place-items:center;background:var(--forest);color:var(--cream);font-weight:700;font-size:.95rem}
.cfield{display:flex;flex-direction:column;gap:10px;min-width:0}
.cfield label,.clabel{font-weight:600;font-size:var(--t-small)}
.crow{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s2)}
.crow output{font-weight:700;font-size:1.25rem;font-variant-numeric:tabular-nums}
.chint{font-size:.85rem;opacity:.7;line-height:1.45}

.cbox{display:flex;align-items:center;border:1.5px solid var(--rule-strong);background:var(--paper);max-width:340px;transition:border-color .2s}
.cbox:focus-within{border-color:var(--forest)}
.cbox input{flex:1;min-width:0;border:0;background:transparent;padding:12px 14px;font-size:1.125rem;font-weight:600;font-variant-numeric:tabular-nums;outline:none}
.cbox span{padding:0 14px;font-size:.85rem;font-weight:600;opacity:.6;white-space:nowrap}
.cbox-big input{font-size:1.6rem;font-weight:700;padding:10px 14px}

.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips button{border:1.5px solid var(--rule-strong);background:transparent;padding:10px 16px;font-weight:600;font-size:.95rem;cursor:pointer;transition:background .15s,color .15s,border-color .15s}
.chips button:hover{border-color:var(--forest)}
.chips button[aria-pressed="true"],.seg2 button[aria-pressed="true"],.strats button[aria-pressed="true"]{background:var(--forest);border-color:var(--forest);color:var(--cream)}

.seg2,.strats{display:grid;gap:10px}
.seg2{grid-template-columns:1fr 1fr}
.strats{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:700px){.strats{grid-template-columns:1fr 1fr}}
@media (max-width:420px){.seg2{grid-template-columns:1fr}}
.seg2 button,.strats button{display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:left;border:1.5px solid var(--rule-strong);background:transparent;padding:14px 16px;cursor:pointer;min-width:0;transition:background .15s,color .15s,border-color .15s}
.seg2 button:hover,.strats button:hover{border-color:var(--forest)}
.seg2 b,.strats b{font-size:1rem}
.seg2 span,.strats span{font-size:.82rem;opacity:.75}

input[type=range]{width:100%;accent-color:var(--forest);height:28px;cursor:pointer}
.cprice{display:flex;flex-direction:column;gap:10px;padding-top:var(--s2);border-top:1px solid var(--rule)}
.cprice label{font-weight:600;font-size:var(--t-small)}

.cfixed{background:var(--cream);padding:var(--s4);display:flex;flex-direction:column;gap:var(--s2)}
@media (max-width:560px){.cfixed{padding:var(--s3)}}
.cfixed-h{display:flex;align-items:center;gap:10px}
.lock{width:22px;height:22px;flex:none}
.fees{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px 24px}
.fees li{display:flex;flex-direction:column;border-top:1px solid var(--rule);padding-top:10px}
.fees b{font-size:1.15rem;font-variant-numeric:tabular-nums}
.fees span{font-size:.85rem;opacity:.75;line-height:1.4}

.cadv,.cmore{border:1px solid var(--rule);background:#fff}
.cadv summary,.cmore summary{padding:var(--s2) var(--s3);font-weight:700;cursor:pointer}
.cadv-b{padding:0 var(--s3) var(--s3);display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--s2)}
.ccheck{display:flex;align-items:center;gap:10px;cursor:pointer}
.ccheck input{width:18px;height:18px;accent-color:var(--forest)}

/* result panel */
.calc-out{position:sticky;top:96px;background:var(--forest);color:var(--cream);padding:var(--s4);display:flex;flex-direction:column;gap:var(--s3);min-width:0}
@media (max-width:960px){.calc-out{position:static}}
.big{display:flex;flex-direction:column;gap:2px}
.big span{font-size:var(--t-small);opacity:.8}
.big b{font-size:clamp(2.6rem,5vw,3.4rem);line-height:1.05;font-weight:700;color:#E2BC6E;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.big b.neg{color:#F0A08A}
.big small{opacity:.75;font-size:.9rem}
.rlist{display:flex;flex-direction:column;margin:0}
.rlist div{display:flex;justify-content:space-between;gap:var(--s2);padding:10px 0;border-top:1px solid var(--rule-cream)}
.rlist dt{opacity:.8;font-size:var(--t-small)}
.rlist dd{margin:0;font-weight:700;font-variant-numeric:tabular-nums;text-align:right}
.rlist dd small{display:block;font-weight:400;opacity:.7;font-size:.8rem}
.split{display:flex;flex-direction:column;gap:10px}
.split .small{opacity:.8}
.sbar{display:flex;height:14px;overflow:hidden;background:rgba(243,233,210,.12)}
.sbar i{display:block;height:100%}
.slegend{display:grid;grid-template-columns:1fr 1fr;gap:6px 14px;font-size:.8rem}
.slegend li{display:flex;align-items:center;gap:8px;min-width:0}
.slegend i{width:10px;height:10px;flex:none}
.slegend span{opacity:.85}
.verdict{font-size:var(--t-small);line-height:1.5;padding:12px 14px;background:rgba(243,233,210,.08)}
.tiny{font-size:.78rem;opacity:.6;text-align:center}

/* full forecast */
.cmore{margin-top:var(--s4)}
.cmore-b{padding:0 var(--s3) var(--s3);display:flex;flex-direction:column;gap:var(--s3)}
.ctable{overflow-x:auto}
.ctable table{border-collapse:collapse;width:100%;min-width:560px;font-size:.92rem;font-variant-numeric:tabular-nums}
.ctable th,.ctable td{padding:9px 12px;border-bottom:1px solid var(--rule);text-align:right}
.ctable th:first-child,.ctable td:first-child{text-align:left}
.ctable thead th{font-size:.8rem;opacity:.7;font-weight:600}
.ctable tr.tot td{font-weight:700}
.ctable tr.big td{font-weight:700;border-top:2px solid var(--forest);color:var(--forest)}
.levers{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}
.levers li{display:flex;justify-content:space-between;gap:12px;background:var(--cream);padding:12px 14px;font-size:var(--t-small)}
.levers b{color:var(--forest);white-space:nowrap}

/* mobile sticky summary */
.calc-bar{position:fixed;left:0;right:0;bottom:0;z-index:50;display:flex;justify-content:space-between;align-items:center;gap:var(--s2);background:var(--forest);color:var(--cream);padding:12px var(--gutter);padding-bottom:calc(12px + env(safe-area-inset-bottom,0px));font-size:var(--t-small)}
.calc-bar b{color:#E2BC6E}
.calc-bar .link{border-bottom-color:var(--rule-cream);font-weight:700}
@media (min-width:961px){.calc-bar{display:none!important}}

.cnumin{display:inline-flex;align-items:center;border:1.5px solid var(--rule-strong);background:var(--paper)}
.cnumin:focus-within{border-color:var(--forest)}
.cnumin input{width:5.5em;border:0;background:transparent;padding:6px 8px;font-weight:700;font-size:1.05rem;text-align:right;font-variant-numeric:tabular-nums;outline:none}
.cnumin span{padding:0 10px 0 2px;font-size:.8rem;font-weight:600;opacity:.6}
.calcline{background:var(--cream);padding:12px 14px;font-size:var(--t-small);line-height:1.5}
.calcline b{font-variant-numeric:tabular-nums}

/* sections as headers */
.cstep{gap:0}
.cstep-h{display:block}
.cstep-t{width:100%;display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"num txt chev" "num sum chev";column-gap:var(--s2);row-gap:6px;align-items:center;text-align:left;background:none;border:0;padding:0;cursor:pointer}
.cstep-t .cnum{grid-area:num;align-self:start}
.cstep-t>div{grid-area:txt;min-width:0}
.cstep-t .csum{grid-area:sum;font-size:.88rem;font-weight:600;color:var(--gold);display:none;min-width:0}
.cstep.closed .csum{display:block}
.cstep.closed .cstep-t>div .small{display:none}
.chev{grid-area:chev;width:12px;height:12px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);margin:0 6px 6px;transition:transform .2s}
.cstep.closed .chev{transform:rotate(-45deg);margin-bottom:0}
.cstep-b{display:flex;flex-direction:column;gap:var(--s3);padding-top:var(--s3)}
.cstep-b[hidden]{display:none}
.cstep.closed{padding-block:var(--s3)}
.cnext{align-self:flex-start;border:1.5px solid var(--forest);background:var(--forest);color:var(--cream);font-weight:700;padding:10px 22px;cursor:pointer}
.cnext:hover{background:transparent;color:var(--forest)}

/* plain-language version */
.curbar{display:flex;align-items:center;justify-content:space-between;gap:var(--s2);flex-wrap:wrap;font-weight:600;font-size:var(--t-small)}
.chips-sm button{padding:7px 13px;font-size:.88rem}
.slide{display:flex;align-items:center;gap:var(--s2)}
.slide input[type=range]{flex:1;min-width:0}
.seg3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.seg3 button{display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:left;border:1.5px solid var(--rule-strong);background:transparent;padding:14px 16px;cursor:pointer;min-width:0;transition:background .15s,color .15s,border-color .15s}
.seg3 button:hover{border-color:var(--forest)}
.seg3 b{font-size:1.05rem}.seg3 span{font-size:.82rem;opacity:.75}
.seg3 button[aria-pressed="true"]{background:var(--forest);border-color:var(--forest);color:var(--cream)}
@media (max-width:420px){.seg3{grid-template-columns:1fr}}
.cstep-b .cbox{max-width:none}
.suggest{display:flex;align-items:center;gap:var(--s2);flex-wrap:wrap;background:var(--cream);padding:14px 16px}
.suggest span{font-size:var(--t-small);font-weight:600}
.suggest b{font-size:1.5rem;flex:1;font-variant-numeric:tabular-nums}
.suggest .cnext{padding:8px 18px}
.howprice{border-top:1px solid var(--rule);padding-top:var(--s2)}
.howprice summary{cursor:pointer;font-weight:600;font-size:var(--t-small)}
.howprice[open]{display:flex;flex-direction:column;gap:var(--s2)}
.howprice[open] summary{margin-bottom:4px}
.verdict.ok{background:rgba(159,179,155,.18)}
.verdict.no{background:rgba(240,160,138,.18)}
.rlist .win dd span{color:#E2BC6E}
.big .after{display:block;margin-top:8px;font-size:.85rem;font-weight:600;opacity:1;color:var(--cream);background:rgba(243,233,210,.1);padding:8px 10px}
.warnline{display:block;margin-top:8px;color:#A23A22;font-weight:600}
.egpnote{display:flex;flex-direction:column;gap:4px;background:var(--cream);padding:12px 14px;font-size:var(--t-small)}
.egpnote:empty{display:none}
.egpnote b{font-variant-numeric:tabular-nums}
.rlist dt .dts{display:block;font-size:.75rem;opacity:.7;margin-top:2px}
.btn-ghost-cream{background:transparent;color:var(--cream);border-color:var(--cream)}
.btn-ghost-cream:hover{background:var(--cream);color:var(--forest)}
.testline{font-size:.88rem;line-height:1.5;padding:12px 14px;border:1px solid var(--rule-cream)}
.testline:empty{display:none}
/* right-to-left (Arabic) */
[dir=rtl] .cstep-t,[dir=rtl] .seg2 button,[dir=rtl] .seg3 button,[dir=rtl] .strats button{text-align:right}
[dir=rtl] .ctable th,[dir=rtl] .ctable td{text-align:left}
[dir=rtl] .ctable th:first-child,[dir=rtl] .ctable td:first-child{text-align:right}
[dir=rtl] .rlist dd{text-align:left}
[dir=rtl] .cnumin input{text-align:left}
[dir=rtl] .cstep.closed .chev{transform:rotate(135deg)}
.mkscale{display:flex;justify-content:space-between;font-size:.78rem;font-weight:600;opacity:.6;margin-top:-6px}
.mkclean{font-weight:600;opacity:.85}
