/* Blend advisor — "رأي خبير التوليفات" under the blend receipt (js/blend-advisor.js). */
.bba{margin:14px 0 4px;padding:14px;border-radius:var(--r-sm,14px);background:linear-gradient(180deg,var(--paper,#fffaf2),var(--cream-2,#f3e8d6));
  border:1px solid var(--line,#e6d6bd);color:var(--espresso,#2c1810)}
.bba[hidden]{display:none}
.bba-head{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.bba-head b{display:block;font-size:1rem}
.bba-head small{display:block;font-size:.78rem;color:var(--ink-soft,#7a6552)}
.bba-badge{flex:0 0 34px;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:var(--gold-soft,#e9c98f);
  background:radial-gradient(circle at 35% 30%,#4a2e1c,#1a110c 80%);box-shadow:0 4px 10px -4px rgba(44,24,16,.6)}
.bba-badge svg{width:18px;height:18px}

/* form */
.bba-label{display:block;font-size:.82rem;font-weight:700;margin:4px 0 6px;color:var(--espresso,#2c1810)}
.bba-label small{font-weight:400;color:var(--ink-soft,#7a6552)}
.bba-brews{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.bba-brews button{font:inherit;font-size:.8rem;font-weight:700;padding:6px 12px;border-radius:999px;cursor:pointer;
  border:1.5px solid var(--line,#e6d6bd);background:var(--paper,#fff);color:var(--ink-soft,#7a6552);transition:background .15s,color .15s,border-color .15s}
.bba-brews button[aria-pressed="true"]{background:var(--brand,#6b3a1f);border-color:var(--brand,#6b3a1f);color:#fff}
.bba-brews button:focus-visible,.bba-apply:focus-visible,.bba-again:focus-visible{outline:2px solid var(--gold,#c79a4b);outline-offset:2px}
.bba textarea{width:100%;box-sizing:border-box;resize:vertical;min-height:52px;font:inherit;font-size:.88rem;padding:8px 10px;border-radius:10px;
  border:1.5px solid var(--line,#e6d6bd);background:var(--paper,#fff);color:inherit}
.bba textarea:focus{outline:none;border-color:var(--brand,#6b3a1f)}
.bba-go{width:100%;margin-top:10px;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.bba-go svg{width:16px;height:16px}
.bba-off{margin:0 0 8px;font-size:.86rem;color:var(--ink-soft,#7a6552)}
.bba-again{display:block;width:100%;margin-top:10px;font:inherit;font-size:.82rem;font-weight:700;color:var(--brand,#6b3a1f);
  background:none;border:1.5px dashed var(--line-strong,#d3bb97);border-radius:10px;padding:8px;cursor:pointer}

/* thinking */
.bba-think{display:flex;align-items:center;gap:12px;padding:14px 4px;font-size:.9rem;color:var(--ink-soft,#7a6552)}
.bba-beans{display:inline-flex;gap:5px}
.bba-beans i{width:10px;height:14px;border-radius:50%;background:#5a3318;transform-origin:50% 100%;animation:bbaHop 1s ease-in-out infinite;
  box-shadow:inset -2px 0 0 rgba(0,0,0,.25)}
.bba-beans i:nth-child(2){animation-delay:.15s;background:#7a4a26}
.bba-beans i:nth-child(3){animation-delay:.3s;background:#3a2010}
@keyframes bbaHop{0%,100%{transform:translateY(0) rotate(0)}40%{transform:translateY(-7px) rotate(20deg)}}

/* result */
.bba-res.is-stale .bba-top,.bba-res.is-stale .bba-sum,.bba-res.is-stale .bba-cup{opacity:.55}
.bba-stale{font-size:.8rem;font-weight:700;color:#8a5a00;background:#fff3d6;border:1px solid #f0d79a;border-radius:8px;padding:6px 10px;margin:8px 0}
.bba-top{display:flex;align-items:center;gap:12px;margin-bottom:8px;--tone:#3f7d3a}
.bba-good{--tone:#6a8f2f}.bba-fair{--tone:#c07a16}.bba-poor{--tone:#b2412b}
.bba-ring{flex:0 0 62px;width:62px;height:62px;border-radius:50%;display:grid;place-items:center;align-content:center;position:relative;
  background:conic-gradient(var(--tone) var(--deg),rgba(44,24,16,.1) 0)}
.bba-ring::before{content:"";position:absolute;inset:6px;border-radius:50%;background:var(--paper,#fff)}
.bba-ring b,.bba-ring small{position:relative;line-height:1}
.bba-ring b{font-size:1.15rem;color:var(--tone)}
.bba-ring small{font-size:.62rem;color:var(--ink-soft,#7a6552);margin-top:2px}
.bba-pill{display:inline-block;font-size:.72rem;font-weight:800;color:#fff;background:var(--tone);padding:2px 9px;border-radius:999px}
.bba-verdict h4{margin:4px 0 0;font-size:1rem;line-height:1.35}
.bba-sum{margin:0 0 10px;font-size:.88rem;line-height:1.75}
.bba-cup{display:grid;gap:5px;padding:10px;border-radius:10px;background:rgba(255,255,255,.6);border:1px solid var(--line,#e6d6bd);margin-bottom:10px}
.bba-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:.8rem}
.bba-dots{display:inline-flex;gap:4px;direction:ltr}
.bba-dots i{width:16px;height:7px;border-radius:4px;background:rgba(44,24,16,.12)}
.bba-dots i.on{background:var(--brand,#6b3a1f)}
.bba-pc{display:grid;gap:6px;margin-bottom:10px}
.bba-pc ul{list-style:none;margin:0;padding:0;display:grid;gap:5px}
.bba-pc li{position:relative;font-size:.84rem;line-height:1.6;padding-inline-start:22px}
.bba-pc li::before{position:absolute;inset-inline-start:0;top:1px;width:16px;height:16px;border-radius:50%;display:grid;place-items:center;font-size:.65rem;font-weight:900;color:#fff}
.bba-pros li::before{content:"✓";background:#3f7d3a}
.bba-cons li::before{content:"!";background:#c07a16}
.bba-sugs{display:grid;gap:7px;margin-bottom:10px}
.bba-sug{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:10px;background:var(--paper,#fff);border:1px solid var(--line,#e6d6bd)}
.bba-sug-t{flex:1;min-width:0}
.bba-act{display:block;font-size:.85rem;font-weight:700;line-height:1.45}
.bba-sug p{margin:3px 0 0;font-size:.8rem;line-height:1.6;color:var(--ink-soft,#7a6552)}
.bba-apply{flex:0 0 auto;font:inherit;font-size:.8rem;font-weight:800;padding:7px 14px;border-radius:999px;border:0;cursor:pointer;
  background:var(--brand,#6b3a1f);color:#fff;transition:transform .15s,opacity .15s}
.bba-apply:hover{transform:translateY(-1px)}
.bba-apply:disabled{background:#3f7d3a;opacity:.85;cursor:default;transform:none}
.bba-none{font-size:.84rem;font-weight:700;color:#3f7d3a;margin-bottom:10px}
.bba-brew{font-size:.83rem;line-height:1.65;padding-top:8px;border-top:1px dashed var(--line-strong,#d3bb97)}
.bba-brew p{margin:6px 0 0}
.bba-for{display:flex;flex-wrap:wrap;align-items:center;gap:5px;font-weight:700}
.bba-for span{font-size:.75rem;padding:2px 9px;border-radius:999px;background:var(--cream-2,#f3e8d6);border:1px solid var(--line,#e6d6bd)}

/* inline status (pages without the site toast) */
.bba-note{margin-top:8px;font-size:.8rem;font-weight:700;color:#fff;background:var(--brand,#6b3a1f);border-radius:8px;padding:6px 10px}

/* /blend page: the advisor sits under the bean grid */
.bl-advisor{max-width:640px;margin:26px auto 0}
.bl-advisor .bba{margin:0}

@media (prefers-reduced-motion:reduce){
  .bba-beans i{animation:none}
  .bba-apply,.bba-brews button{transition:none}
}
