/* rb-calc: the free calculators (src/_layouts/calculator.liquid on rb-tool): /ebay-fee-calculator/,
   /ebay-sell-through-rate-calculator/, /poshmark-fee-calculator/. Loaded by the layout via pageStyles.
   Built only on rb.css tokens and components (.rb-tool__panel, .rb-fields, .rb-calc, .rb-kpis, .rb-table). */

/* Head: a tool's name fits one line on desktop, so the panel starts higher */
.rb-tool .rb-ph__h1{max-width:30ch}

/* Before the panel: the no-JS line */
.rb-calc-nojs{margin-bottom:16px;padding:12px 16px;border-radius:var(--r2);background:var(--well);font-size:var(--fs-sm);color:var(--ink-2)}

/* Inputs */
.rb-tool__in{display:flex;flex-direction:column}
/* The foot of the inputs cell (sources, coverage, the worked formula) sits at the bottom of the panel. */
.rb-calc-foot{margin-top:auto;padding-top:28px}
.rb-calc-foot--flow{margin-top:0;padding-top:24px}
.rb-calc-hint{margin-top:12px;font-size:var(--fs-xs);line-height:1.5;color:var(--ink-3)}
.rb-calc-eq{display:grid;gap:8px;padding:14px 16px;border-radius:var(--r2);background:var(--bg);box-shadow:inset 0 0 0 1px var(--line-2)}
.rb-calc-eq__k{font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3)}
.rb-calc-eq__x{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:15px;font-weight:500;color:var(--ink-2);font-variant-numeric:tabular-nums}
.rb-calc-eq var{padding:1px 8px;border-radius:6px;background:var(--paper);box-shadow:var(--sh1);font-style:normal;font-weight:700;color:var(--ink)}
.rb-calc-eq i{font-style:normal;color:var(--ink-3)}
.rb-calc-eq b{font-weight:800;color:var(--ink)}
.rb-more{margin-top:22px;border-top:1px solid var(--line)}
.rb-more>summary{display:flex;justify-content:space-between;align-items:center;gap:8px;padding-top:16px;font-size:var(--fs-sm);font-weight:700;color:var(--ink)}
.rb-more>summary .rb-icon{color:var(--ink-3);transition:transform .2s var(--ease)}
.rb-more[open]>summary .rb-icon{transform:rotate(180deg)}
.rb-more>summary:hover .rb-icon{color:var(--ink)}
.rb-more .rb-fields{margin-top:16px;align-items:end}
.rb-more__check{padding-block:4px}
.rb-offer{display:flex;flex-wrap:wrap;gap:8px}
.rb-offer .rb-ig{flex:1 1 110px;width:auto}
.rb-presets{flex:3 1 280px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px;padding:3px;border-radius:14px;background:var(--well)}
.rb-presets button{height:40px;padding:0 10px;border:0;border-radius:11px;background:none;font:600 var(--fs-sm)/1 var(--font);color:var(--ink-3);white-space:nowrap;cursor:pointer;transition:background-color .15s,color .15s}
.rb-presets button:hover{color:var(--ink)}
.rb-presets button[aria-pressed="true"]{background:var(--paper);color:var(--ink);box-shadow:var(--sh1)}
.rb-presets button:focus-visible{outline:2px solid var(--ink);outline-offset:1px}
.rb-calc-alert{margin-top:18px;padding:12px 14px;border-radius:var(--r2);background:var(--red-2);font-size:var(--fs-sm);font-weight:600;color:var(--red)}

/* The result: big number + chip, what it's after, the split bar, the receipt */
.rb-res__big{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px}
.rb-res__big .rb-out__n{min-width:0}
.rb-res__big>:is(.rb-chip,.rb-tag,.rb-flag){height:26px}
.rb-split{display:flex;height:12px;margin-top:24px;overflow:hidden;border-radius:99px;background:var(--well)}
.rb-split i{flex:none;height:100%;box-shadow:inset -2px 0 0 var(--tint);transition:width .35s var(--ease)}
.rb-split i:last-child{box-shadow:none}
.rb-split__fees,.rb-key--fees{background:var(--ink)}
.rb-split__costs,.rb-key--costs{background:var(--ink-4)}
.rb-split__profit,.rb-key--profit{background:var(--green)}
.rb-key{display:inline-block;width:10px;height:10px;margin-right:8px;border-radius:3px}
.rb-tool__out .rb-split+.rb-calc{margin-top:20px}
.rb-calc dl>div[hidden]{display:none}
.rb-calc dl>div.is-sub{padding-block:0 10px;padding-left:38px;border-top:0;font-size:var(--fs-xs)}
.rb-calc dt:has(.rb-key) small{padding-left:18px}
.rb-calc .is-sub dt{color:var(--ink-3)}
.rb-calc .is-sub dd{font-weight:600;color:var(--ink-2)}
.rb-calc .is-sum{background:var(--tint)}
.rb-calc .is-sum :is(dt,dd){font-weight:800;color:var(--ink)}
.rb-calc dd.is-pos{color:var(--green)}
.rb-calc dd.is-neg{color:var(--red)}
.rb-calc__note b{font-weight:700;color:var(--ink-2)}
.rb-cells{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 16px;margin-top:20px;font-variant-numeric:tabular-nums}
.rb-cells>div{display:grid;grid-template-rows:1fr auto}
.rb-cells dt{font-size:var(--fs-2xs);line-height:1.35;color:var(--ink-3)}
.rb-cells dd{margin-top:4px;font-size:20px;font-weight:800;letter-spacing:-.03em;line-height:1.2}

/* Sell-through: the four demand bands, the current one filled */
.rb-bands{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;margin-top:24px}
.rb-bands li{display:grid;align-content:start;gap:2px;min-width:0;font-size:var(--fs-2xs);line-height:1.35;color:var(--ink-3)}
.rb-bands li::before{content:"";height:10px;margin-bottom:8px;border-radius:3px;background:var(--well);transition:background-color .2s}
.rb-bands li:first-child::before{border-radius:99px 3px 3px 99px}
.rb-bands li:last-child::before{border-radius:3px 99px 99px 3px}
.rb-bands b{font-size:var(--fs-xs);font-weight:600;color:var(--ink-3)}
.rb-bands .is-on b{font-weight:800;color:var(--ink)}
.rb-bands .is-on::before{background:var(--ink)}
.rb-bands [data-band="slow"].is-on::before{background:var(--red)}
.rb-bands :is([data-band="healthy"],[data-band="fast"]).is-on::before{background:var(--green)}

/* Fee sources and coverage checks */
.rb-calc-src{font-size:var(--fs-xs);line-height:1.55;color:var(--ink-3)}
.rb-prose .rb-calc-src{margin-top:1.6em}
.rb-calc-src a{font-weight:600;color:var(--ink-2);text-decoration:underline;text-decoration-color:rgba(28,27,25,.25);text-underline-offset:2px}
.rb-calc-src a:hover{color:var(--ink);text-decoration-color:currentColor}
.rb-calc-checks{display:grid;gap:10px;font-size:var(--fs-sm);font-weight:500;line-height:1.4;color:var(--ink-2)}
.rb-calc-checks li{display:flex;align-items:center;gap:10px}

/* Sold-comps lookup under the eBay panel: a plain GET form into /ebay-sold-listings/ */
.rb-calc-find{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;margin-top:20px;padding:16px 20px;border-radius:var(--r3);background:var(--well)}
.rb-calc-find label{flex:1 1 220px;font-size:var(--fs-sm);line-height:1.45;color:var(--ink-2)}
.rb-calc-find label b{display:block;font-weight:700;color:var(--ink)}
.rb-calc-find .rb-input{flex:2 1 240px;width:auto}

/* Explainer: key numbers (two by two in the reading column), wide tables, related tools */
.rb-calc-kpis dl>div,.rb-calc-rules dl>div{flex-basis:40%}
.rb-calc-kpis dd:not(.rb-kpis__n){font-size:clamp(20px,2vw,24px);white-space:normal;text-wrap:balance}
.rb-calc-rules dd:not(.rb-kpis__n){font-size:clamp(24px,2.4vw,30px)}
.rb-tool__body>.rb-calc-wide{grid-column:full;justify-self:center;width:min(100%,880px)}
.rb-calc-wide .rb-table{min-width:620px}
.rb-table tbody th{vertical-align:top;white-space:normal;min-width:9em}
.rb-table td a{font-weight:600;color:var(--ink);text-decoration:underline;text-decoration-color:rgba(28,27,25,.28);text-underline-offset:3px;white-space:nowrap}
.rb-table td a:hover{text-decoration-color:currentColor}
.rb-table td.is-pos{color:var(--green);font-weight:700}
.rb-table td.is-neg{color:var(--red);font-weight:700}
.rb-calc-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.rb-calc-links:has(>li:nth-child(3):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}
.rb-calc-link{display:grid;align-content:start;gap:4px;height:100%;padding:16px 18px 18px;border-radius:var(--r3);background:var(--paper);box-shadow:var(--sh1);text-decoration:none;transition:box-shadow .25s var(--ease)}
.rb-calc-link:hover{box-shadow:var(--sh2)}
.rb-calc-link strong{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;font-size:16px;font-weight:800;letter-spacing:-.015em;line-height:1.35}
.rb-calc-link .rb-icon{margin-top:3px;color:var(--ink-3);transition:transform .2s var(--ease),color .2s}
.rb-calc-link:hover .rb-icon{color:var(--ink);transform:translateX(3px)}
.rb-calc-link span{font-size:var(--fs-sm);line-height:1.5;color:var(--ink-3)}
.rb-prose .rb-topics{margin-top:1.3em}
.rb-prose .rb-topics a{font-weight:600;color:var(--ink-2);text-decoration:none}
.rb-prose .rb-topics a:hover{color:var(--ink)}

@media (max-width:640px){
/* Keep inputs two-up on phones so the result is one short scroll away; notes sit under labels. */
.rb-tool__in .rb-fields{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 12px}
.rb-tool__in .rb-field__l{flex-direction:column;align-items:flex-start;gap:0}
.rb-tool__in .rb-field:is(:has(#ebay-category),:has(#ebay-buyer-tax-rate)){grid-column:1/-1}
.rb-calc-links,.rb-calc-links:has(>li:nth-child(3):last-child){grid-template-columns:minmax(0,1fr)}
.rb-cells{gap:12px}
.rb-cells dd{font-size:17px}
.rb-bands{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 8px}
.rb-bands li:nth-child(n)::before{border-radius:99px}
.rb-calc dl>div.is-sub{padding-left:34px}
.rb-presets{flex-basis:100%}
.rb-calc-kpis dl>div{flex-basis:40%}
}
@media (prefers-reduced-motion:reduce){
.rb-split i,.rb-bands li::before{transition:none}
}