/* Chi tiết sản phẩm kiểu marketplace: gallery bên trái, màu sắc bên phải. */
.modal{position:fixed;inset:0;z-index:100;display:none;align-items:center;justify-content:center;padding:24px;background:rgba(6,10,14,.76);backdrop-filter:blur(5px)}
.modal.open{display:flex}
.modal .modal-box{position:relative;width:min(1160px,96vw);height:min(720px,90vh);max-width:none;max-height:90vh;background:#fff;border-radius:22px;overflow:hidden;display:grid;grid-template-columns:58% 42%;box-shadow:0 28px 100px rgba(0,0,0,.35)}
.modal .modal-close{position:absolute;z-index:5;right:18px;top:17px;width:36px;height:36px;border:1px solid #e4e6e8;border-radius:50%;background:#fff;color:#1a2027;font-size:24px;line-height:1;cursor:pointer}
.modal .modal-gallery{background:#f5f6f7;min-width:0;min-height:0;padding:22px}
.modal .gallery-layout{height:100%;display:grid;grid-template-columns:82px minmax(0,1fr);gap:14px;min-height:0}
.modal .thumb-column{min-height:0;display:grid;grid-template-rows:30px minmax(0,1fr) 30px;gap:5px}
.modal .modal-thumbs{display:flex;flex-direction:column;gap:9px;overflow-y:auto;overflow-x:hidden;scrollbar-width:none;scroll-behavior:smooth;padding:2px}
.modal .modal-thumbs::-webkit-scrollbar{display:none}
.modal .modal-thumb{flex:0 0 72px;width:72px;height:72px;border:1px solid #dfe3e7;border-radius:10px;padding:3px;background:#fff;cursor:pointer;overflow:hidden}
.modal .modal-thumb img{width:100%;height:100%;object-fit:contain}
.modal .modal-thumb.active{border:2px solid #e6532f;padding:2px}
.modal .thumb-nav{width:72px;height:28px;border:0;background:transparent;color:#68727d;font-size:19px;cursor:pointer;border-radius:7px;line-height:1}
.modal .thumb-nav:hover{background:#e9ecef}
.modal .modal-image{min-height:0;background:#fff;border-radius:14px;display:flex;align-items:center;justify-content:center;padding:28px;overflow:hidden}
.modal .modal-image img{width:100%;height:100%;object-fit:contain}
.modal .modal-body{min-width:0;background:#fff;overflow:hidden;padding:0}
.modal .modal-scroll{height:100%;overflow-y:auto;padding:52px 38px 34px}
.modal .modal-category{display:inline-block;color:#e6532f;font-size:10px;font-weight:900;letter-spacing:1.6px;text-transform:uppercase}
.modal .modal-body h2{font-size:29px;line-height:1.12;letter-spacing:-.8px;margin:9px 40px 9px 0}
.modal .modal-price{display:block;font-size:18px;color:#e6532f;font-weight:900;margin:0 0 22px}
.modal .variant-picker{margin:0 0 22px;padding:17px 0;border-top:1px solid #e7e9ec;border-bottom:1px solid #e7e9ec}
.modal .variant-picker.empty{display:none}
.modal .variant-title{color:#737d87;font-size:11px;font-weight:800;margin-bottom:11px}
.modal .variant-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.modal .variant-option{min-width:0;border:1px solid #dfe3e7;border-radius:10px;background:#fff;padding:7px 5px 6px;cursor:pointer;text-align:center;color:#20262d}
.modal .variant-option:hover{border-color:#adb5bd}
.modal .variant-option.active{border:2px solid #e6532f;padding:6px 4px 5px}
.modal .variant-option img{display:block;width:100%;height:58px;object-fit:contain;margin-bottom:5px}
.modal .variant-option span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:10.5px;font-weight:700}
.modal .spec-card{border-top:0}
.modal .spec-title{text-transform:uppercase;color:#8a939d;font-size:10px;font-weight:900;letter-spacing:1.6px;padding:3px 0 9px}
.modal .spec-table{margin:0}
.modal .spec-row{display:grid;grid-template-columns:138px minmax(0,1fr);gap:15px;padding:9px 0;border-bottom:1px solid #edf0f2;font-size:12.5px;line-height:1.5}
.modal .spec-key{color:#7c858f}.modal .spec-value{font-weight:600;color:#2c343d}
.modal .description-free{font-size:13px;line-height:1.7;color:#5f6974;padding:4px 0 10px}
.modal .quote-btn{display:flex;align-items:center;justify-content:space-between;margin-top:24px;width:100%;background:#101318;color:#fff;padding:14px 16px;border:0;border-radius:10px;font-size:13px;font-weight:900;text-decoration:none}
.modal .quote-btn span{font-size:17px}.modal .policy{display:flex;gap:16px;flex-wrap:wrap;color:#6d7680;font-size:11px;margin-top:18px;padding-top:18px;border-top:1px solid #e6e9ed}.modal .policy span{white-space:nowrap}
@media(max-width:900px){.modal .modal-box{grid-template-columns:56% 44%}.modal .modal-scroll{padding:45px 25px 28px}.modal .variant-options{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:650px){.modal{padding:0;align-items:stretch}.modal .modal-box{width:100%;height:100%;max-height:none;border-radius:0;grid-template-columns:1fr;grid-template-rows:48% 52%}.modal .modal-gallery{padding:10px}.modal .gallery-layout{grid-template-columns:62px minmax(0,1fr);gap:8px}.modal .modal-thumb{width:56px;height:56px;flex-basis:56px}.modal .thumb-nav{width:56px}.modal .modal-image{padding:14px}.modal .modal-scroll{padding:26px 20px 28px}.modal .modal-body h2{font-size:24px;margin-right:34px}.modal .modal-close{top:12px;right:12px}.modal .spec-row{grid-template-columns:115px minmax(0,1fr)}.modal .variant-options{grid-template-columns:repeat(3,minmax(0,1fr))}.modal .variant-option img{height:48px}}

/* Thumbnail lựa chọn ngay trên card sản phẩm + link chia sẻ trong cửa sổ chi tiết */
.product-card-options-wrap{position:relative;display:flex;align-items:center;justify-content:center;flex-wrap:nowrap;padding:9px 42px 2px;background:#fff;min-width:0;width:100%;box-sizing:border-box}
.product-card-options{display:flex;flex:0 0 229px;width:229px;max-width:229px;gap:7px;overflow-x:hidden;overflow-y:hidden;scroll-behavior:smooth;scrollbar-width:none;min-width:0}
.product-card-options::-webkit-scrollbar{display:none}
.product-card-option{flex:0 0 52px;width:52px;min-width:52px;max-width:52px;height:52px;padding:3px;border:1px solid #dfe3e7;border-radius:8px;background:#fff;overflow:hidden;cursor:pointer;box-sizing:border-box}
.product-card-option img{width:100%;height:100%;object-fit:contain;display:block}
.product-card-option:hover{border-color:#aeb6bf}
.product-card-option.active{border:2px solid #e6532f;padding:2px}
.product-card-options-nav{position:absolute;top:50%;transform:translateY(-44%);z-index:2;width:28px;height:42px;border:1px solid #dfe3e7;border-radius:999px;background:#fff;color:#5d6670;font-size:24px;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;box-shadow:0 2px 7px rgba(20,30,40,.08)}
.product-card-options-nav.prev{left:9px}
.product-card-options-nav.next{right:9px}
.product-card-options-nav:hover:not(:disabled){border-color:#aeb6bf;background:#f8f9fa}
.product-card-options-nav:disabled{opacity:.28;cursor:default;pointer-events:none}
.product-card-options-wrap:not(.has-more){justify-content:flex-start;padding-left:12px;padding-right:12px}
.product-card-options-wrap:not(.has-more) .product-card-options{flex:0 1 auto;width:auto;max-width:229px}
.product-share{margin:0 0 20px}
.product-share-label{font-size:10px;font-weight:900;letter-spacing:1.2px;text-transform:uppercase;color:#8a939d;margin-bottom:7px}
.product-share-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px}
.product-share-row input{min-width:0;width:100%;height:38px;border:1px solid #dfe3e7;border-radius:8px;padding:0 10px;background:#f8f9fa;color:#4e5863;font-size:11.5px}
.product-share-row button{height:38px;border:0;border-radius:8px;padding:0 13px;background:#101318;color:#fff;font-size:11px;font-weight:800;cursor:pointer;white-space:nowrap}
.product-share-status{min-height:15px;margin-top:5px;color:#49835b;font-size:10.5px}
@media(max-width:650px){.product-card-options-wrap.has-more{padding-left:38px;padding-right:38px}.product-card-options{flex-basis:213px;width:213px;max-width:213px;gap:7px}.product-card-option{flex-basis:48px;width:48px;min-width:48px;max-width:48px;height:48px}.product-card-options-nav{width:26px;height:40px}.product-card-options-nav.prev{left:7px}.product-card-options-nav.next{right:7px}.product-card-options-wrap:not(.has-more) .product-card-options{max-width:213px}.product-share-row{grid-template-columns:1fr}.product-share-row button{width:100%}}