/* Bổ sung nhỏ cho layout nguyên bản của template (không đổi style của template) */
html,body{margin:0;padding:0}
body{background:#fff}
.ladi-wraper{width:420px;margin:0 auto}

/* Template: header dính trên cùng, thanh mua hàng dính dưới cùng (Ladipage làm bằng JS) */
#SECTION9{position:fixed;top:0;left:50%;margin-left:-210px;width:420px;z-index:90000050}
#SECTION8{position:fixed;bottom:0;left:50%;margin-left:-210px;width:420px;z-index:90000050}
[data-scroll],[data-href]{cursor:pointer}

/* Popup đặt hàng (resources/views/shop/_popup.blade.php) */
.dt-backdrop{position:fixed;inset:0;background:rgba(17,17,17,.55);z-index:90000060;display:none}
.dt-pop-open .dt-backdrop{display:block}
.dtp{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:90000080;width:372px;max-width:calc(100vw - 24px);
    max-height:calc(100vh - 24px);overflow-y:auto;box-sizing:border-box;background:#fff;border-radius:14px;padding:18px 18px 16px;
    box-shadow:0 18px 50px rgba(0,0,0,.25);font-family:Roboto,sans-serif;color:#222;animation:dtp-in .2s ease-out}
.dtp[hidden]{display:none}
@keyframes dtp-in{from{opacity:0;transform:translate(-50%,-46%)}to{opacity:1;transform:translate(-50%,-50%)}}
.dtp *{box-sizing:border-box}
.dtp__x{position:absolute;top:8px;right:10px;width:32px;height:32px;border:0;background:none;font-size:26px;line-height:1;color:#999;cursor:pointer;border-radius:50%}
.dtp__x:hover{background:#f2f2f2;color:#333}
.dtp__head{display:flex;gap:12px;align-items:center;padding:0 30px 14px 0;margin-bottom:14px;border-bottom:1px solid #f0f0f0}
.dtp__head img{width:64px;height:64px;object-fit:cover;border-radius:10px;flex:none;background:#f6f6f6}
.dtp__title{font-size:16px;font-weight:700;line-height:1.3}
.dtp__price{margin-top:4px;font-size:14px}
.dtp__price b{color:#ff0958;font-size:18px}
.dtp__price s{color:#999;margin-left:4px}
.dtp__form{display:flex;flex-direction:column;gap:10px;margin:0}
.dtp__hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.dtp__in{width:100%;height:44px;padding:0 14px;border:1px solid #e1e1e1;border-radius:10px;background:#fafafa;font:15px Roboto,sans-serif;color:#222;outline:0;transition:border-color .15s,background .15s}
.dtp__in:focus{border-color:#ff0958;background:#fff;box-shadow:0 0 0 3px rgba(255,9,88,.1)}
.dtp__lab{font-size:14px;font-weight:700;margin-top:4px}
.dtp__chips{display:flex;flex-wrap:wrap;gap:8px}
.dtp__chip{position:relative;cursor:pointer}
.dtp__chip input{position:absolute;opacity:0;pointer-events:none}
.dtp__chip span{display:block;padding:8px 13px;border:1px solid #e1e1e1;border-radius:999px;font-size:14px;line-height:1.2;background:#fff;transition:all .15s}
.dtp__chip:hover span{border-color:#ffb3c9}
.dtp__chip input:checked+span{border-color:#ff0958;background:#fff0f5;color:#e0004b;font-weight:700}
.dtp__chip input:focus-visible+span{box-shadow:0 0 0 3px rgba(255,9,88,.2)}
.dtp__row{display:flex;align-items:center;justify-content:space-between;margin-top:4px}
.dtp__lab--inline{margin:0}
.dtp__qty{display:flex;align-items:center;border:1px solid #e1e1e1;border-radius:10px;overflow:hidden}
.dtp__qty button{width:38px;height:38px;border:0;background:#f6f6f6;font-size:20px;cursor:pointer;color:#444}
.dtp__qty button:hover{background:#eee}
.dtp__qty input{width:46px;height:38px;border:0;text-align:center;font:700 15px Roboto,sans-serif;-moz-appearance:textfield;appearance:textfield;outline:0}
.dtp__qty input::-webkit-outer-spin-button,.dtp__qty input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.dtp__total{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;margin-top:4px;background:#fafafa;border-radius:10px;font-size:14px}
.dtp__total b{color:#ff0958;font-size:18px}
.dtp__btn{height:50px;border:0;border-radius:10px;background:#ff0958;color:#fff;font:700 18px Roboto,sans-serif;cursor:pointer;box-shadow:0 6px 16px rgba(255,9,88,.3);transition:background .15s}
.dtp__btn:hover{background:#e6004c}
.dtp__err{position:static}
.dtp__err:empty{display:none}

/* Thông báo đặt hàng thành công */
.dt-thanks{position:fixed;inset:0;z-index:90000100;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.5);font-family:Roboto,sans-serif}
.dt-thanks[hidden]{display:none}
.dt-thanks__box{width:330px;max-width:calc(100% - 30px);background:#fff;border-radius:10px;padding:24px 20px;text-align:center;font-size:14px;line-height:1.5}
.dt-thanks__ok{width:54px;height:54px;border-radius:50%;background:#2f9e63;color:#fff;font-size:30px;line-height:54px;margin:0 auto 10px}
.dt-thanks h3{margin:0 0 8px;font-size:18px}
.dt-thanks p{margin:4px 0;color:#444}
.dt-thanks button{margin-top:14px;border:0;background:#ff0958;color:#fff;font:700 16px Roboto,sans-serif;padding:10px 34px;border-radius:4px;cursor:pointer}

/* Báo lỗi dưới nút gửi */
.dt-err{position:absolute;left:0;right:0;color:#d4143a;font-size:13px;line-height:1.3;text-align:center;font-family:Roboto,sans-serif}
