/* MarketingSeoLab Storefront – cart drawer, toast, options chooser dialog. */
.msl-drawer{position:fixed;inset:0;z-index:100001}
.msl-drawer__overlay{position:absolute;inset:0;background:rgba(0,0,0,.55);opacity:0;transition:opacity .25s}
.msl-drawer__panel{position:absolute;top:0;right:0;bottom:0;display:flex;flex-direction:column;width:min(430px,100%);height:100%;background:#fff;color:#111;box-shadow:-18px 0 50px rgba(0,0,0,.25);transform:translateX(100%);transition:transform .28s ease;outline:0;overscroll-behavior:contain}
.msl-drawer.is-open .msl-drawer__overlay{opacity:1}
.msl-drawer.is-open .msl-drawer__panel{transform:none}
@supports(height:100dvh){.msl-drawer__panel{height:100dvh}}
.msl-drawer__head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px 14px 20px;border-bottom:1px solid var(--msl-line)}
.msl-drawer__title{font:800 20px/1.2 var(--msl-font)}
.msl-drawer__count{font-weight:700}
.msl-drawer__head .msl-iconbtn{background:#f4f4f0}
.msl-drawer__head .msl-iconbtn:hover{background:var(--msl-y)}
.msl-drawer__status{min-height:0;padding:0 20px;font-size:13px;color:var(--msl-mut)}
.msl-drawer__status:not(:empty){padding-top:8px}
.msl-drawer__status.is-error{color:#b3261e}
.msl-drawer__body{flex:1;min-height:0;overflow-y:auto;padding:4px 20px;transition:opacity .15s}
.msl-drawer.is-loading .msl-drawer__body{opacity:.6}
.msl-cart-item{display:grid;grid-template-columns:72px minmax(0,1fr);gap:14px;padding:16px 0;border-bottom:1px solid var(--msl-line);transition:opacity .2s}
.msl-cart-item.is-removing{opacity:.35}
.msl-cart-item__img{width:72px;height:72px;overflow:hidden;border-radius:12px;background:#f6f6f1}
.msl-cart-item__img img{display:block;width:100%;height:100%;object-fit:contain}
.msl-cart-item__info{min-width:0}
.msl-cart-item__name{display:block;font-weight:700;font-size:14.5px;line-height:1.3;overflow-wrap:anywhere}
.msl-cart-item__info .variation{margin:2px 0 0;font-size:12.5px;color:var(--msl-mut)}
.msl-cart-item__info .variation dt,.msl-cart-item__info .variation dd{display:inline;margin:0}
.msl-cart-item__info .variation dd p{display:inline;margin:0}
.msl-cart-item__price{margin-top:2px;font-weight:800;font-size:15px}
.msl-cart-item__row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:8px}
.msl-qty{display:inline-flex;align-items:center;border:1.5px solid #e1e1da;border-radius:12px;overflow:hidden}
.msl-qty__btn{display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:0;background:#fff;color:#111;cursor:pointer}
.msl-qty__btn:hover:not(:disabled){background:var(--msl-y-soft)}
.msl-qty__btn:disabled{opacity:.35;cursor:not-allowed}
.msl-qty__val{min-width:30px;text-align:center;font-weight:700;font-size:15px}
.msl-trash{display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:0;border-radius:12px;background:transparent;color:#6a6a6a;cursor:pointer}
.msl-trash:hover{background:#fdecea;color:#b3261e}
.msl-drawer__empty{display:flex;flex-direction:column;align-items:center;gap:14px;padding:56px 12px;text-align:center;color:var(--msl-mut)}
.msl-drawer__empty-ico{display:flex;align-items:center;justify-content:center;width:76px;height:76px;border-radius:50%;background:var(--msl-y-soft);color:#111}
.msl-drawer__foot{display:flex;flex-direction:column;gap:10px;padding:16px 20px calc(16px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--msl-line);background:#fff}
.msl-drawer__subtotal{display:flex;align-items:center;justify-content:space-between;font-size:16px}
.msl-drawer__subtotal strong{font-size:20px;font-weight:800}

.msl-toast{position:fixed;left:50%;bottom:20px;z-index:100003;max-width:calc(100vw - 32px);padding:12px 18px;border-radius:12px;background:#111;color:#fff;font:600 14px/1.4 var(--msl-font);transform:translateX(-50%);box-shadow:0 10px 30px rgba(0,0,0,.3)}

dialog.msl-vdlg{width:min(440px,calc(100vw - 24px));max-height:calc(100vh - 24px);padding:0;border:0;border-radius:18px;background:#fff;color:#111;overflow:auto}
dialog.msl-vdlg::backdrop{background:rgba(0,0,0,.55)}
.msl-vform{display:flex;flex-direction:column;gap:14px;padding:18px}
.msl-vform__head{display:grid;grid-template-columns:64px minmax(0,1fr) 44px;align-items:start;gap:12px}
.msl-vform__img{width:64px;height:64px;overflow:hidden;border-radius:12px;background:#f6f6f1}
.msl-vform__img img{display:block;width:100%;height:100%;object-fit:contain}
.msl-vform__title{font:800 16px/1.3 var(--msl-font)}
.msl-vform__price{margin-top:4px;font-weight:800;font-size:17px}
.msl-vform__price del{font-weight:500;font-size:13px;color:#8a8a8a}
.msl-vform__price ins{text-decoration:none}
.msl-field{display:flex;flex-direction:column;gap:6px;font-weight:700;font-size:13px}
.msl-field select,.msl-field input{width:100%;height:48px;padding:0 12px;border:1.5px solid #dcdcd2;border-radius:10px;background:#fff;color:#111;font:500 16px/1 var(--msl-font)}
.msl-field select:focus,.msl-field input:focus{border-color:var(--msl-y-d);outline:3px solid var(--msl-y-soft)}
.msl-vform__msg{min-height:18px;font-size:13px;color:var(--msl-mut)}
.msl-vform__msg.is-error{color:#b3261e}
.msl-vform__actions{display:flex;flex-direction:column;gap:10px}
@media(max-width:480px){.msl-drawer__panel{width:100%}.msl-drawer__head{padding-left:16px}.msl-drawer__body,.msl-drawer__foot,.msl-drawer__status{padding-left:16px;padding-right:16px}}
