/* AI on the website (1.80.0) */
.ai-search { border: 1px solid color-mix(in srgb, var(--brand) 25%, var(--line)); background: color-mix(in srgb, var(--brand) 5%, var(--surface)); border-radius: var(--r-card, 16px); padding: 1rem 1.1rem; margin-bottom: 1.25rem; }
.ai-search-head { display: flex; align-items: center; gap: .5rem; font-weight: 700; margin-bottom: .35rem; }
.ai-search-head i { color: var(--brand); }
.ai-search-intro { color: var(--muted); margin-bottom: .75rem; font-size: .92rem; }
.ai-search:not(.is-done) .ai-skel { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: .75rem; }
.ai-skel span { display: block; height: 170px; border-radius: 14px; background: linear-gradient(90deg, var(--tile) 0, color-mix(in srgb, var(--tile) 60%, var(--surface)) 50%, var(--tile) 100%); background-size: 200% 100%; animation: aiSkel 1.2s linear infinite; }
.ai-search.is-done .ai-skel { display: none; }
@keyframes aiSkel { to { background-position: -200% 0; } }
.ai-pick { display: flex; flex-direction: column; }
.ai-pick-card { flex: 1 1 auto; }
.ai-why { font-size: .8rem; color: var(--muted); margin: .35rem .2rem 0; line-height: 1.3; }
.ai-why i { color: var(--brand); margin-right: .3rem; }
.ai-strip { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem .9rem; border: 1px dashed color-mix(in srgb, var(--brand) 35%, var(--line)); border-radius: var(--r-card, 16px); padding: .7rem 1rem; margin-bottom: 1.25rem; background: var(--surface); }
.ai-strip > i { color: var(--brand); font-size: 1.15rem; }
.ai-strip .ai-strip-text { flex: 1 1 260px; font-size: .92rem; }
.ai-explain-btn { border: 0; background: transparent; color: var(--brand); font-weight: 600; font-size: .85rem; padding: 0; display: inline-flex; align-items: center; gap: .35rem; }
.ai-explain-btn:hover { text-decoration: underline; }
.ai-explain-btn.is-busy i { animation: aiSpin 1s linear infinite; }
@keyframes aiSpin { to { transform: rotate(360deg); } }
.ai-explained { margin-top: .5rem; padding: .65rem .8rem; border-radius: 12px; background: var(--tint); font-size: .9rem; }
.planner-hero { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.5rem; }
.planner-icon { width: 56px; height: 56px; border-radius: 16px; display: grid; place-items: center; background: var(--tint); color: var(--brand); font-size: 1.5rem; flex: 0 0 auto; }
.planner-stepper .form-control { max-width: 70px; }
.planner-needs { display: flex; flex-wrap: wrap; gap: .4rem; }
.planner-need { display: inline-flex; align-items: center; gap: .35rem; border: 1px solid var(--line); border-radius: 99px; padding: .35rem .75rem; font-size: .85rem; cursor: pointer; background: var(--surface); }
.btn-check:checked + .planner-need { border-color: var(--brand); background: var(--tint); color: var(--brand); font-weight: 600; }
.btn-check:focus-visible + .planner-need { outline: 2px solid var(--brand); outline-offset: 2px; }
.planner-ideas { display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem; }
.planner-intro { font-weight: 500; }
.planner-lines { margin: 0; }
.planner-line { display: flex; align-items: center; gap: .75rem; padding: .6rem 0; border-bottom: 1px solid var(--line); }
.planner-qty { display: flex; align-items: center; gap: .3rem; flex: 0 0 auto; }
.planner-n { min-width: 1.6rem; text-align: center; font-weight: 700; }
.planner-choice { color: var(--accent, #d97706); }
.planner-total { display: flex; justify-content: space-between; padding-top: .75rem; font-size: 1.05rem; }
.planner-over { color: var(--accent, #d97706); margin: .4rem 0 0; }
/* My account → Made for you (1.81.0) */
.ai-account-card { color: var(--ink); text-decoration: none; }
.ai-account-card:hover { border-color: var(--brand); color: var(--ink); }
.ai-account-icon { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: var(--tint); color: var(--brand); flex: 0 0 auto; font-size: 1.15rem; }
.text-brand { color: var(--brand); }
.surprise-pick { display: grid; grid-template-columns: minmax(0, 260px) 1fr; gap: 1rem; align-items: center; }
.surprise-why { font-size: .95rem; margin: 0; }
.surprise-why i { color: var(--brand); }
@media (max-width: 575.98px) { .surprise-pick { grid-template-columns: 1fr; } }
.rewards-answer { background: var(--tint); border-radius: 12px; padding: .75rem .9rem; }
.taste-summary { font-size: 1.02rem; }
.taste-chip { display: inline-flex; align-items: center; border-radius: 99px; padding: .2rem .65rem; font-size: .8rem; background: var(--tint); color: var(--brand); font-weight: 600; }
.taste-avoid { background: color-mix(in srgb, #d92d20 10%, var(--surface)); color: #b42318; }