.product-wrapper{max-width:1200px;margin:20px auto;padding:0 10px;}
.gallery-box{border:1px solid var(--border-color);border-radius:var(--radius-box);padding:10px;overflow:hidden;margin-bottom:20px;}
.swiper-slide img{width:100%;height:auto;object-fit:contain;display:block;border-radius:4px;}
.mySwiper .swiper-slide{opacity:.6;cursor:pointer;border:1px solid transparent;transition:.3s;}
.mySwiper .swiper-slide-thumb-active{opacity:1;border-color:var(--primary);}
.info-box{padding-left:20px;}
@media (max-width:768px){.info-box{padding-left:0;margin-top:20px;}}
.box_title_product{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px;padding-bottom:10px;margin-bottom:15px;border-bottom:1px solid var(--border);}
.prod-title{font-size:24px;font-weight:700;margin:0;color:var(--text);line-height:1.2;}
.prod-subtitle{font-size:16px;font-weight:500;color:var(--secondary);}
.meta-data{display:flex;align-items:center;gap:15px;font-size:13px;color:#666;margin:0;margin-left:auto;}
.meta-item{display:flex;align-items:center;gap:5px;}
.stock-ready{color:#27ae60;font-weight:700;}
.flash-sale-wrapper{background:var(--flash-bg);color:#fff;border-radius:var(--radius-box);padding:10px 15px;margin-bottom:15px;position:relative;overflow:hidden;box-shadow:0 4px 10px rgba(215,0,24,.2);}
.flash-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;border-bottom:1px solid rgba(255,255,255,.3);padding-bottom:5px;}
.flash-title{font-size:16px;font-weight:800;text-transform:uppercase;font-style:italic;display:flex;align-items:center;gap:5px;}
.flash-title i{animation:flashIcon .5s infinite;}
@keyframes flashIcon{0%,100%{opacity:1;}50%{opacity:.5;}}
.countdown-timer{font-size:13px;font-weight:600;display:flex;gap:3px;align-items:center;}
.time-box{background:#fff;color:var(--primary);padding:2px 5px;border-radius:4px;min-width:20px;text-align:center;font-weight:800;}
.flash-content{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;}
.flash-price-group{display:flex;flex-direction:row;align-items:flex-end;gap:15px;margin-bottom:10px;}
.flash-price-now{font-size:30px;font-weight:800;line-height:1;}
.flash-price-old{font-size:16px;text-decoration:line-through;opacity:.8;margin-top:0;line-height:1.5;}
.flash-sale-box{background:linear-gradient(90deg,#ff0000 0%,#d70018 100%);border-radius:8px;padding:10px 15px;color:#fff;margin-bottom:20px;display:none;position:relative;overflow:hidden;}
.flash-sale-box.active{display:block;}
.fs-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;}
.fs-title{font-size:18px;font-weight:800;text-transform:uppercase;font-style:italic;display:flex;align-items:center;gap:5px;}
.fs-title i{color:#ffe600;}
.fs-timer{display:flex;align-items:center;gap:5px;font-size:13px;font-weight:600;}
.fs-timer span{background:#111;color:#fff;padding:3px 6px;border-radius:4px;min-width:24px;text-align:center;}
.fs-price-info{display:flex;align-items:center;gap:15px;font-size:14px;margin-bottom:8px;}
.fs-saved{font-weight:700;color:#fff;}
.fs-badge{background:#ffe600;color:var(--primary);padding:2px 6px;border-radius:4px;font-size:12px;font-weight:800;}
.fs-progress{background:rgba(255,255,255,.3);height:16px;border-radius:10px;position:relative;overflow:hidden;}
.fs-progress-bar{height:100%;background:#52b848;border-radius:10px;width:0%;transition:width 1s ease;}
.fs-progress-text{position:absolute;top:0;left:0;width:100%;text-align:center;font-size:10px;line-height:16px;font-weight:700;color:#fff;text-shadow:0 0 2px rgba(0,0,0,.5);}
.fs-fire-icon{position:absolute;left:5px;top:-2px;color:#ffa500;font-size:14px;z-index:2;}
.price-wrapper{display:flex;align-items:center;gap:10px;margin-bottom:20px;padding:10px;background:#f9f9f9;border-radius:8px;flex-wrap:wrap;}
.current-price{font-size:28px;font-weight:800;color:var(--primary);line-height:1;}
.old-price{font-size:16px;text-decoration:line-through;color:#888;}
.discount-tag{background:#fff0f0;color:var(--primary);border:1px solid var(--primary);padding:2px 8px;font-size:12px;font-weight:bold;border-radius:4px;}
.discount-tag::after{content:"";flex-basis:100%;height:0;}
.stock-badge{display:inline-flex;align-items:center;gap:5px;background:#e6ffe6;color:#1a7331;border:1px solid #a8e8a8;padding:3px 10px;font-size:13px;font-weight:600;border-radius:4px;margin-top:2px;}
.stock-badge i{color:#28a745;}
.price-footer-row {
    width: 100%;          /* Chiếm hết chiều ngang -> Tự động xuống dòng */
    display: flex;        /* Để các badge bên trong nằm ngang hàng nhau */
    align-items: center;
    gap: 10px;            /* Khoảng cách giữa 2 badge */
}
/* Tinh chỉnh lại badge cũ một chút nếu cần (để đảm bảo không bị margin thừa) */
.price-footer-row .stock-badge {
    margin-top: 0; /* Reset margin top cũ nếu có */
}
.opt-section{margin-bottom:15px;}
.opt-title{font-size:14px;font-weight:700;margin-bottom:8px;display:block;}
.opt-container{display:flex;flex-wrap:wrap;gap:10px;}
.opt-box{border:1px solid #ddd;background:#fff;border-radius:6px;padding:8px 12px;min-width:90px;text-align:center;cursor:pointer;position:relative;transition:.2s;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.opt-box:hover{border-color:var(--primary);}
.opt-box.active{border-color:var(--primary);background:#fffdfd;color:var(--primary);}
.opt-box.active::after{content:'\f00c';font-family:"Font Awesome 5 Free";font-weight:900;position:absolute;top:0;right:0;background:var(--primary);color:#fff;font-size:8px;padding:2px 4px;border-bottom-left-radius:6px;}
a.opt-box{text-decoration:none;color:inherit;}
.opt-box strong{font-size:13px;display:block;margin-bottom:2px;}
.opt-box span{font-size:11px;color:#666;}
.opt-box.active span{color:var(--primary);}
@keyframes phone-shake{0%{transform:rotate(0deg);}25%{transform:rotate(15deg);}50%{transform:rotate(0deg);}75%{transform:rotate(-15deg);}100%{transform:rotate(0deg);}
}
.bk-head{font-size:15px;font-weight:700;margin-bottom:12px;color:#222;line-height:1.4;padding-right:90px;}
.bk-group{display:flex;height:44px;margin-bottom:10px;}
.bk-input{flex:1;border:1px solid #ccc;border-right:none;border-radius:6px 0 0 6px;padding:0 12px;outline:none;font-size:14px;}
.bk-input:focus{border-color:#28a745;}
.bk-btn{background:#d70018;color:#fff;border:none;padding:0 20px;border-radius:0 6px 6px 0;font-weight:bold;cursor:pointer;text-transform:uppercase;font-size:13px;transition:.2s;}
.bk-btn:hover{background:#b30014;}
.bk-msg{color:#d0021b;font-size:12px;margin-top:5px;display:none;font-style:italic;}
.bk-promo-tag{display:inline-flex;align-items:center;background:#f0fff4;color:#1a7331;font-size:13px;font-weight:600;padding:6px 12px;border-radius:4px;border:1px solid #c3e6cb;margin-top:8px;}
.bk-promo-tag i{margin-right:6px;color:#28a745;}
.btn-specs-mini{position:absolute;top:0;right:0;z-index:5;display:inline-flex;align-items:center;gap:5px;background:var(--gray);color:var(--text-main);border:none;padding:6px 12px;border-radius:0 8px 0 8px;font-size:11px;font-weight:700;text-transform:uppercase;cursor:pointer;transition:.2s;}
.btn-specs-mini:hover{background:#b30014;color:var(--white);}
.btn-specs-mini i{color:var(--primary);}
.cta-group{display:flex;gap:10px;margin-bottom:20px;}
.btn-action{flex:1;border:none;border-radius:8px;padding:12px;cursor:pointer;color:#fff;text-align:center;transition:.2s;}
.btn-buy{background:var(--primary);}
.btn-buy:hover{background:var(--primary-dark);box-shadow:0 4px 15px rgba(215,0,24,.3);}
.btn-install{background:#0071e3;}
.btn-install:hover{background:#005bb5;}
.btn-action strong{display:block;font-size:16px;text-transform:uppercase;margin-bottom:2px;}
.btn-action span{font-size:11px;opacity:.9;}
.trust-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;background:#fff;border:1px solid #eee;padding:10px;border-radius:var(--radius-box);}
.trust-item{font-size:12px;display:flex;align-items:center;gap:6px;color:#555;}
.trust-item i{color:#27ae60;font-size:14px;}
.modal-wrap{position:fixed;top:0;left:0;width:100%;height:100%;z-index:9999;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;pointer-events:none;transition:.3s;}
.modal-wrap.active{opacity:1;visibility:visible;pointer-events:auto;}
.modal-box{background:#fff;width:90%;max-width:500px;max-height:90vh;border-radius:10px;box-shadow:0 10px 40px rgba(0,0,0,.3);display:flex;flex-direction:column;transform:translateY(20px);transition:.3s;}
.modal-wrap.active .modal-box{transform:translateY(0);}
.modal-head{padding:15px;border-bottom:1px solid #eee;display:flex;justify-content:space-between;align-items:center;background:#f8f8f8;border-radius:10px 10px 0 0;}
.modal-body{padding:20px;overflow-y:auto;}
.captcha-area{text-align:center;}
.math-str{font-size:24px;font-weight:bold;color:var(--primary);margin:15px 0;letter-spacing:2px;}
.captcha-inp{width:120px;padding:8px;text-align:center;border:1px solid #ccc;font-size:18px;margin-bottom:15px;border-radius:4px;}
.btn-verify{background:var(--primary);color:#fff;border:none;padding:10px 30px;border-radius:4px;font-weight:bold;cursor:pointer;}

/* --- MODERN FLOATING BOX STYLE (CLEAN VERSION) --- */
.box-overlap{position:relative;border:1px solid #e0e0e0;border-radius:var(--radius-box);background:#fff;margin-top:25px;margin-bottom:20px;padding:25px 15px 15px;transition:all .3s ease;}
.box-overlap-title{position:absolute;top:-15px;left:7px;background:#f9f9f9;color:#333;padding:4px 15px;border:1px solid #e0e0e0;border-radius:20px;font-size:12px;font-weight:700;text-transform:uppercase;box-shadow:0 2px 4px rgba(0,0,0,.05);display:flex;align-items:center;gap:8px;white-space:nowrap;z-index:2;transition:all .3s ease;}
.box-overlap-title i{font-size:13px;color:var(--primary);transition:all .3s ease;}
.box-overlap-content ul{list-style:none;margin:0;padding:0;}
.box-overlap-content li{display:flex;align-items:flex-start;gap:10px;margin-bottom:10px;font-size:13px;color:#333;line-height:1.5;}
.box-overlap-content li:last-child{margin-bottom:0;}
.box-overlap-content li i{color:var(--primary);font-size:14px;margin-top:3px;flex-shrink:0;}
.box-overlap:hover{border-color:var(--primary);box-shadow:0 5px 15px rgba(215,0,24,.1);}
.box-overlap:hover .box-overlap-title{background:var(--primary);color:#fff;border-color:var(--primary);box-shadow:0 4px 10px rgba(215,0,24,.3);}
.box-overlap:hover .box-overlap-title i{color:#fff;animation:flashIcon 1s infinite;}
/* Container chung */
.booking-wrapper {
    padding-top: 35px;
    background: #fff;
}

/* Nút cấu hình */
.booking-wrapper .btn-specs-mini {
    top: -1px;
    right: -1px;
    border-radius: 0 var(--radius-box) 0 8px;
    padding: 6px 12px;
    background: #f5f5f5;
    color: #555;
    border-left: 1px solid #e0e0e0;
    border-bottom: 1px solid #e0e0e0;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    cursor: pointer;
    transition: all .2s ease;
}
.booking-wrapper .btn-specs-mini:hover {
    background: var(--primary);
    color: #fff;
    border-color: var(--primary);
}

/* Group Input */
.booking-wrapper .bk-group {
    height: 48px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
    border-radius: 6px;
    display: flex;
    position: relative; /* Giữ vị trí chuẩn */
}

/* Input Styles */
.booking-wrapper .bk-input {
    flex: 1;
    border: 1px solid #ddd;
    border-right: none;
    border-radius: 6px 0 0 6px;
    padding: 0 15px;
    outline: none;
    transition: .2s;
    color: #333;
}

.booking-wrapper .bk-input:focus {
    border-color: var(--primary);
}

/* --- TRẠNG THÁI LỖI (QUAN TRỌNG) --- */
.booking-wrapper .bk-input.input-error {
    color: #d70018 !important;   /* Chữ màu đỏ */
    border-color: #d70018 !important; /* Viền đỏ */
    font-weight: 600;
    background: #fff5f5; /* Nền hồng nhạt cảnh báo */
    animation: shakeInput 0.4s ease-in-out; /* Rung lắc */
}

/* Animation rung lắc */
@keyframes shakeInput {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-5px); }
    75% { transform: translateX(5px); }
}

/* Nút Gửi */
.booking-wrapper .bk-btn {
    border: none;
    background: var(--primary);
    color: #fff;
    border-radius: 0 6px 6px 0;
    font-weight: 700;
    padding: 0 20px;
    cursor: pointer;
    transition: .2s;
}
.booking-wrapper .bk-btn:hover {
    background: var(--primary-dark);
    box-shadow: 0 4px 10px rgba(215,0,24,.3);
}
.st-image-modern{width:100%;height:160px;border-radius:6px;overflow:hidden;border:1px solid #eee;margin-bottom:15px;}
.st-image-modern img{width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .5s ease;display:block;}
.box-overlap:hover .st-image-modern img{transform:scale(1.05);}
.st-info-list{margin-bottom:15px!important;}
.st-info-list li{display:flex;align-items:flex-start;gap:10px;margin-bottom:8px;font-size:13px;color:#444;}
.st-info-list li i{color:var(--primary);font-size:14px;margin-top:3px;}
.st-hotline-modern{text-align:center;background:#fff5f5;border:1px dashed var(--primary);border-radius:8px;padding:12px;transition:all .3s ease;}
.st-hotline-modern span{display:block;font-size:11px;color:#666;margin-bottom:4px;text-transform:uppercase;}
.st-hotline-modern a{display:block;font-size:20px;font-weight:800;color:var(--primary);text-decoration:none;line-height:1.2;}
.st-hotline-modern i{font-size:18px;margin-right:5px;animation:phone-shake .5s infinite;}
.st-hotline-modern:hover{background:var(--primary);border-style:solid;box-shadow:0 5px 15px rgba(215,0,24,.3);}
.st-hotline-modern:hover span{color:rgba(255,255,255,.8);}
.st-hotline-modern:hover a{color:#fff;}
