/* Roadmap item 102: the bag's auto-potion panel (src/auto-potion-ui.js) and the HP bar blink after a server-made use. */
.auto-potion{position:relative;z-index:1;flex:none;margin:8px 0 2px;padding:8px 10px;border:1px solid #d5b89a;border-radius:11px;background:linear-gradient(110deg,#fff7eb,#fbefdc);box-shadow:inset 0 0 0 2px #fff9eb80;color:#5d4532;font-size:12px;display:grid;gap:6px;min-width:0}
.auto-potion.is-on{border-color:#b9894f;box-shadow:inset 0 0 0 2px #fff9eb80,0 0 0 1px #e7c27a66}
.auto-potion-head{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.auto-potion-head h3{margin:0;font-size:14px;font-weight:700;color:#6b4a2f}
.auto-potion-switch{position:relative;display:inline-flex;align-items:center;gap:8px;min-height:38px;cursor:pointer;font-size:12px}
.auto-potion-switch input{position:absolute;opacity:0;width:44px;height:26px;margin:0;cursor:pointer}
.auto-potion-track{position:relative;flex:none;width:44px;height:24px;border-radius:12px;background:#cdb69c;box-shadow:inset 0 1px 3px #0003;transition:background .15s}
.auto-potion-track::after{content:'';position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fffaf1;box-shadow:0 1px 2px #0004;transition:transform .15s}
.auto-potion-switch input:checked+.auto-potion-track{background:#5f9a43}
.auto-potion-switch input:checked+.auto-potion-track::after{transform:translateX(20px)}
.auto-potion-switch input:focus-visible+.auto-potion-track{outline:2px solid #2f6fd6;outline-offset:2px}
.auto-potion-switch input:disabled+.auto-potion-track{opacity:.5}
.auto-potion-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
.auto-potion-threshold{display:inline-flex;align-items:center;gap:4px;flex:none}
.auto-potion-threshold button{width:38px;height:38px;border:1px solid #c7a37c;border-radius:9px;background:#fff6e7;color:#6b4a2f;font-size:18px;font-weight:700;line-height:1;cursor:pointer;padding:0}
.auto-potion-threshold button:disabled{opacity:.45;cursor:default}
.auto-potion-threshold output{min-width:78px;text-align:center;font-weight:700;font-size:13px}
.auto-potion select{flex:1 1 150px;min-width:0;max-width:100%;min-height:38px;border:1px solid #c7a37c;border-radius:9px;background:#fffaf2;color:#5d4532;font:inherit;padding:0 8px}
.auto-potion-status{margin:0;font-size:11px;color:#806248;min-height:15px}
.auto-potion.is-on .auto-potion-status{color:#3f6f2c}
#health-bar.auto-potion-flash{animation:auto-potion-flash .6s ease-out}
@keyframes auto-potion-flash{0%{filter:brightness(1.9) saturate(1.4);box-shadow:0 0 10px #8cff7a}100%{filter:none;box-shadow:none}}
@media(prefers-reduced-motion:reduce){#health-bar.auto-potion-flash{animation:none;outline:2px solid #8cff7a}}
/* Phones: the item grid keeps its whole height and the panel follows it (the bag page scrolls). */
@media(max-width:600px){.auto-potion{margin:6px 0 0;padding:7px 8px}.auto-potion-head h3{font-size:13px}#adventure-inventory .adventure-bag-grid>.adventure-item-grid{flex:none}}
/* Short landscape screens: one compact strip, and the item grid keeps at least one row. */
@media(max-height:520px) and (min-width:601px){.auto-potion{display:flex;flex-wrap:wrap;align-items:center;gap:2px 8px;padding:3px 8px;margin-top:4px}.auto-potion-head{gap:6px;flex-wrap:nowrap}.auto-potion-head h3{font-size:12px}.auto-potion-switch>span:last-child{display:none}.auto-potion-row{flex:1 1 200px;gap:6px}.auto-potion-threshold output{min-width:64px;font-size:12px}.auto-potion-status{flex-basis:100%;font-size:10px;min-height:0}#adventure-inventory .adventure-bag-grid>.adventure-item-grid{min-height:62px}}