#popup-cart .modal-title {text-transform: uppercase}

#popup-cart .modal-body .wrap-cart {padding: 0;box-shadow: none;border: 0}

#popup-cart .modal-body .top-cart {width: 100%;border: 0;padding: 0;margin: 0}

#popup-cart .modal-footer {padding: .75rem 0 0 0;border-top: 0}

.buymore-cart {color: var(--color-red);cursor: pointer;margin: 0}

.buymore-cart i {margin-right: 2px;margin-top: 5px;vertical-align: top;font-size: 12px}





.wrap-cart { padding:20px 15px; background:#ffffff; border:1px solid #d8d8d8; box-shadow:0 0 20px rgba(0,0,0,.15); font-family: var(--medium); } 

.top-cart { width:calc(60% - 15px); border-right:1px solid #eee; padding-right:15px; margin-right:15px; } 

.bottom-cart {width: 40%;}



/* .top-cart {display: flex;justify-content: space-between;align-items: flex-start} */

.left-procart {width: calc(780/1200*100%)}

.right-procart {width: calc(400/1200*100%)}

.list-procart {border-radius: 15px;overflow: hidden;background: white;-webkit-border-radius: 15px;-moz-border-radius: 15px;-ms-border-radius: 15px;-o-border-radius: 15px}

.money-procart__inner {background: white;padding: 12px 16px;border-top-left-radius: 15px;border-top-right-radius: 15px}

.procart {padding: 20px 15px;border: 1px solid #eee;border-top: 0}

.pic-procart {width: 100px;text-align: center}

.del-procart {display: block;cursor: pointer;color: #657384}

.del-procart svg {width: 18px}

.del-procart:hover {color: red}

.pic-procart-rp {display: none;margin: 10px auto auto auto;width: 100%;max-width: 85px}

.unit-procart {width: 10%;text-align: center}

.info-procart {width: 45%;margin: 0 auto 0 10px;}

.name-procart a {font-size: 14px;color: var(--text);display: block}

.name-procart a:hover {color: var(--color-red)}

.properties-procart {display: block}

.properties-procart p {display: inline-block;margin-bottom: 0}

.properties-procart p:first-child {margin-right: 10px}

.properties-procart p strong {font-family: var(--semi)}

.quantity-procart {width: 15%;text-align: center;margin: 0 10px;}

.quantity-procart p {margin-bottom: 0}

.action-procart {width: 25px}

.quantity-counter-procart {display: inline-flex;align-items: center;justify-content: center;border: 1px solid #c1c8d1;line-height: normal;text-align: center;border-radius: 50px;-webkit-border-radius: 50px;-moz-border-radius: 50px;-ms-border-radius: 50px;-o-border-radius: 50px;overflow: hidden;padding: 0 5px}

.counter-procart {width: 28px;height: 28px;display: flex;align-items: center;justify-content: center;cursor: pointer}

.counter-procart span {pointer-events: none}

.counter-procart svg {width: 12px;height: 12px}

.quantity-counter-procart .quantity-procat {width: 40px;height: 30px;padding: 3px;text-align: center;border: solid 1px #c1c8d1;border-top: none;border-bottom: none;font-size: 15px}

.price-procart {width: 15%;text-align: center;margin: 0 10px;}

.price-procart-rp {display: none;width: 100%;margin-bottom: 10px;font-size: 13.5px}

.price-new-cart {color: var(--text)b27;margin-bottom: 0;font-family: var(--bold);}

.price-old-cart {color: #999;text-decoration: line-through;margin-bottom: 0;font-size: 12px;}

.procart-label {padding: 8px 16px;background: white;font-family: var(--medium);display: flex;justify-content: space-between;align-items: center}

.bottom-cart {width: 40%}

.section-procart {margin-top: 20px}

.information-cart {background: white;border-radius: 15px;padding: 15px;-webkit-border-radius: 15px;-moz-border-radius: 15px;-ms-border-radius: 15px;-o-border-radius: 15px}

.title-cart {font-family: var(--medium);font-size: 15px;color: var(--text);margin-bottom: 15px}

.shipunit-cart {display: flex;gap: 15px;align-items: center;position: relative;isolation: isolate;border-bottom: solid 1px #e7e7e7e7;padding: 8px 20px}

.shipunit-cart:last-child {margin-bottom: 0;border-bottom: none}

.shipunit-cart input {cursor: pointer;width: 20px;height: 20px;margin: 0 !important}

.shipunit-label {cursor: pointer;display: flex;margin-bottom: 0;color: #313131 !important;flex: 1 1 0%;align-items: center;gap: 10px}

.shipunit-label::after,

.shipunit-label::before {top: calc(50% - 1rem/2)}

.shipunit-label .logo {max-width: 40px;display: block}

.shipunit-label p {flex: 1 1 0%;margin-bottom: 0;color: #313131;font-size: 15px}

.payments-cart {position: relative;isolation: isolate;border-bottom: solid 1px #e7e7e7e7;padding: 12px 20px}

.payments-cart .top {display: flex;gap: 15px;align-items: center}

.payments-cart:last-child {margin-bottom: 0}

.payments-cart .top input {cursor: pointer;width: 20px;height: 20px;margin: 0 !important}

.payments-label {cursor: pointer;display: flex;margin-bottom: 0;color: #313131 !important;flex: 1 1 0%;padding: 5px 0;align-items: center;gap: 10px}

.payments-label::after,

.payments-label::before {top: calc(50% - 1rem/2)}

.payments-label .logo {width: 40px;display: block}

.payments-label p {flex: 1 1 0%;margin-bottom: 0;color: #313131;font-size: 15px}

.payments-info {opacity: 0;visibility: hidden;height: 0;overflow: hidden;background: #f5efef;border-radius: 5px;width: 100%;padding: 0 10px;overflow: hidden;box-sizing: border-box}

.payments-info p {margin-bottom: 1em}

.payments-info.active {padding: 10px;margin-top: 5px;opacity: 1;visibility: visible;height: auto}

.btn-cart {outline: 0 !important;box-shadow: none !important;border-color: transparent !important;font-size: 14px;text-transform: uppercase;background: #121212;border-radius: 10px}

.empty-cart {padding: 25px 30px;display: block;text-align: center;color: #23527c !important;width: 100%}

.empty-cart i {color: red;font-size: 70px}

.empty-cart p {margin: 15px 0;color: #333;font-size: 18px}

.empty-cart span {display: inline-block;border: 1px solid #2e9ef2;border-radius: 3px;padding: 10px;font-size: 16px;text-transform: uppercase;width: 100%;max-width: 325px}

.procart1 {margin-bottom: 10px}

.top-cart1 p.total-price.load-price-temp {color: #5172fd}

.top-cart1 a.buymore-cart {color: var(--text);border: solid 1px var(--text);width: 100%;text-align: center;line-height: 30px;border-radius: 50px}

.top-cart1 a.buymore-cart i {vertical-align: middle;margin-top: 0}

.top-cart1 a.buymore-cart:hover {background: #5172fd;transition: all 1s;color: white;border: solid 1px white;}

.procart1 h3.name-procart:hover a {color: #5172fd}

.top-cart1 .total-procart p {font-size: 14px}

.procart1 .pic-procart {width: 30%;margin: 0}

.procart1 .info-procart {width: calc(70% - 10px);margin: 0}

.top-cart1 p.total-price.load-price-temp {color: #5172fd}

.procart1 h3.name-procart a {font-size: 14px}

.procart1 h3.name-procart {margin-bottom: 10px}

.procart1 .properties-procart {font-size: 13px}

.procart1 .quantity-procart {width: 100%;display: flex;align-items: center}

.procart1 .quantity-counter-procart {width: 70px;margin-right: 10px;border: none}

.procart1 .quantity-counter-procart input.quantity-procat {border: none}

.procart1 .properties-procart strong {font-family: var(--regular)}

.procart1 span.counter-procart-plus.counter-procart {font-size: 20px}

.procart1 .price-procart {width: calc(100% - 80px);text-align: left}

.procart1 p.price-new-cart {color: var(--text);font-size: 14px}

.top-cart1 .total-procart {background: 0 0;border: none;padding: 5px 0}

.procart__item {display: flex;align-items: flex-start;flex-wrap: wrap;justify-content: space-between}

.total-procart {display: flex;flex-direction: column;gap: 10px}

.total-procart__item {display: flex;justify-content: space-between;align-items: center}

.total-procart__item>span {font-size: 16px;color: #4a4f63;font-family: var(--medium)}

.total-procart__item>p {margin-bottom: 0;font-size: 16px;color: #020b27;font-family: var(--medium)}

.total-procart__item>p.voucher-price {color: #f79009}

.money-procart__line {display: block;width: 100%;height: 1px;margin: 10px 0;background: #e4e8ed}

.money-procart__final {display: flex;align-items: center;justify-content: space-between}

.money-procart__final span {font-size: 18px;font-family: var(--semi);color: #020b27}

.money-procart__final p {margin-bottom: 0;font-size: 20px;color: var(--main);font-family: var(--bold);}

.voucher-input {display: flex;align-items: center;justify-content: space-between;background: white;border-radius: 6px;overflow: hidden;border: solid 1px #e0e4e8;-webkit-border-radius: 6px;-moz-border-radius: 6px;-ms-border-radius: 6px;-o-border-radius: 6px;margin-bottom: 15px}

.voucher-input input {border-radius: 0;border: none;background: 0 0;-webkit-border-radius: 0;-moz-border-radius: 0;-ms-border-radius: 0;-o-border-radius: 0}

.voucher-input .code_coupon {width: calc(100% - 95px);height: 40px;font-size: 14px}

.voucher-input .apply_coupon {width: 95px;line-height: 40px;padding: 0 10px;text-align: center;font-size: 14px;font-family: var(--medium);color: #657384;background: #edf0f3}

.thanhtoan_btn {display: flex;align-items: center;justify-content: center;width: 100%;height: 45px;border-radius: 45px;background: var(--main);-webkit-border-radius: 45px;-moz-border-radius: 45px;-ms-border-radius: 45px;-o-border-radius: 45px;font-size: 16px;color: white;font-family: var(--semi);border: none;margin-top: 15px}

.procart_tos {margin-top: 10px;font-size: 13px;line-height: 23px;letter-spacing: .5px;color: #020b07;text-align: center}

.procart_tos a {text-decoration: underline !important;color: #020b07}

.wrap-cartcontent {padding: 40px 0;background: white;}

.cart-input {margin-bottom: 15px}

.cart-select select {margin-bottom: 15px;height: 55px;font-size: 15px;color: #020b27;display: flex;align-items: center;justify-content: center;border: solid 1px #c1c8d1;border-radius: 5px;background: url(../images/custom/arr_select2.png) no-repeat center right 15px/24px, white;-webkit-border-radius: 5px;-moz-border-radius: 5px;-ms-border-radius: 5px;-o-border-radius: 5px}

.cart-select select {width: 100%;padding: 0 50px 0 15px !important}

.cartinput_group1 {display: grid;grid-template-columns: repeat(2, 1fr);gap: 0 15px;grid-template-areas: "input-cart1 input-cart2""input-cart3 input-cart3"}

.cartinput_group1 .cart-input:nth-child(1) {grid-area: input-cart1}

.cartinput_group1 .cart-input:nth-child(2) {grid-area: input-cart2}

.cartinput_group1 .cart-input:nth-child(3) {grid-area: input-cart3}

.cartinput_group2 {display: grid;grid-template-columns: repeat(2, 1fr);gap: 15px;margin-bottom: 15px}

.name-procart {margin-bottom: 7px}

.member-procart {margin-bottom: 5px}

.chiendich-procart b,

.member-procart b {font-family: var(--semi)}

.dropdownSearch {position: relative;width: 100%}

.dropdownSearch .dropdown_trigger {display: flex;align-items: center;justify-content: space-between;padding: 0 10px 0 15px;color: #444;height: 50px;background-color: white;border: 1px solid #ced4da;border-radius: 4px;width: 100%}

.dropdownSearch .dropdown_trigger.invalidate {border: solid 1px #dc3545}

.dropdownSearch .dropdown_trigger.validate {border: solid 1px #198754}

.dropdownSearch .selected_text {color: #212529;font-size: 14px;}

.dropdownSearch .dropdown_menu {background: white;padding: 8px;border-radius: 10px;overflow: hidden;box-shadow: rgba(0, 0, 0, .05) 0 9px 28px 8px, rgba(0, 0, 0, .08) 0 6px 16px, rgba(0, 0, 0, .12) 0 3px 6px -4px;-webkit-border-radius: 10px;-moz-border-radius: 10px;-ms-border-radius: 10px;-o-border-radius: 10px;position: absolute;z-index: 10;top: calc(100% + 10px);width: 100%}

.dropdownSearch .dropdown_searchbar {display: flex;align-items: center;justify-content: space-between;padding: 10px 15px;border-radius: 10px;border: solid 1px #c1c8d1;-webkit-border-radius: 10px;-moz-border-radius: 10px;-ms-border-radius: 10px;-o-border-radius: 10px}

.dropdownSearch .dropdown_searchbar svg {width: 24px;margin-right: 7px}

.dropdownSearch .dropdown_searchbar input {width: 100%;border: none;padding: 0;border: none;border-radius: 0;font-size: 16px;-webkit-border-radius: 0;-moz-border-radius: 0;-ms-border-radius: 0;-o-border-radius: 0}

.dropdownSearch .dropdown_ul {padding: 0;margin: 0;height: 280px;overflow-y: auto;margin-top: 10px}

.dropdownSearch .dropdown_ul li {display: flex;align-items: center;justify-content: space-between;padding: 8px 16px;font-size: 16px;color: #4a4f63;cursor: pointer}

.dropdownSearch .dropdown_ul li:hover {font-family: var(--semi)}

.vat_trigger {display: flex;align-items: center;gap: 10px;cursor: pointer;margin-bottom: 15px}

.vat_checkbox {display: flex;align-items: center;justify-content: center;width: 20px;height: 20px;font-size: 20px}

.vat_trigger p {flex: 1 1 0%;margin-bottom: 0;color: #313131;font-size: 15px}

.vat_trigger i.fa-square-check {color: green}

.banks_grid {display: grid;grid-template-columns: repeat(2, 1fr);gap: 15px}

.banks_item {display: block;position: relative;padding: 10px;border-radius: 10px;box-shadow: rgba(99, 99, 99, .2) 0 2px 8px 0;-webkit-border-radius: 10px;-moz-border-radius: 10px;-ms-border-radius: 10px;-o-border-radius: 10px}

.banks_pic {max-width: 200px;margin-bottom: 20px}

.banks_name {font-family: var(--semi);font-size: clamp(.9375rem, .9rem + .1875vw, 1.125rem)}

.banks_desc p {margin-bottom: 10px}

.bank-warning {border: solid 1px #d7d7d7;border-left: solid 2px var(--main);padding: 10px}

.quantity_wrap {display: flex;align-items: center;margin-top: 20px;gap: 10px}

.quantity_wrap>span {font-size: 16px;color: #4a4f63;max-width: 115px;width: 100%;margin-right: 15px}

.proDetail__quantity {display: inline-flex;align-items: center;height: 37px;border-radius: 34px;-webkit-border-radius: 34px;-moz-border-radius: 34px;-ms-border-radius: 34px;-o-border-radius: 34px;border: solid 1px #c1c8d1}

.quantityButton {position: relative;width: 35px;padding: 0 3px;height: 100%;display: flex;align-items: center;justify-content: center;cursor: pointer}

.quantityButton svg {width: 15px;height: 15px}

.quantityNumber {outline: 0;height: inherit;width: 50px;border: 1px solid #c1c8d1;padding: 0 3px;text-align: center}

.cartButtons {display: grid;grid-template-columns: 1fr;gap: 15px;flex: 1 1 0%}

.cart_button {width: 100%;max-width: 280px;display: flex;align-items: center;justify-content: center;padding: 0 20px;height: 45px;background: var(--main);color: white;font-size: 15px;color: white !important;font-family: var(--medium);border-radius: 42px;-webkit-border-radius: 42px;-moz-border-radius: 42px;-ms-border-radius: 42px;-o-border-radius: 42px;letter-spacing: .005em;text-transform: uppercase;transition: .2s;-webkit-transition: .2s;-moz-transition: .2s;-ms-transition: .2s;-o-transition: .2s}

.cart_button.findmore {background: #eaeffa;color: #03183a !important}

.cart_button:hover {opacity: .8}

.cart__empty-text {margin-bottom: 30px;font-size: clamp(1.5625rem, 1.375rem + .9375vw, 2.5rem);font-family: var(--bold);text-align: center}

.cart__empty-button {display: inline-flex;align-items: center;justify-content: center;width: 210px;height: 45px;background: var(--main);color: white !important;border: solid 1px var(--main);font-size: 15px;transition: .2s;-webkit-transition: .2s;-moz-transition: .2s;-ms-transition: .2s;-o-transition: .2s}

.cart__empty-button:hover {opacity: .8}

.cart__empty-wrap {text-align: center;width: 100%}

.cart__login-title {margin: 40px 0 5px 0;color: #121212;font-size: clamp(1.125rem, 1.05rem + .375vw, 1.5rem);font-family: var(--bold)}

.cart__login-paragraph {color: #121212bf;font-size: clamp(.875rem, .85rem + .125vw, 1rem)}

.cart__login-paragraph a {color: inherit;transition: .2s;-webkit-transition: .2s;-moz-transition: .2s;-ms-transition: .2s;-o-transition: .2s}

.did-floating-label-content {position: relative}

.did-floating-label {z-index: 5;color: #777;font-size: 14px;position: absolute;pointer-events: none;left: 15px;line-height: 1;top: 17px;transition: .2s ease all}

.did-floating-input {font-size: 14px;display: block;width: 100%;padding: 22px 15px 5px 15px;background: white;border-radius: 5px;color: var(--text)}

.did-floating-input:focus~.did-floating-label {top: 6px;font-size: 11px}

.did-floating-input:not(:placeholder-shown)~.did-floating-label {top: 6px;font-size: 12px}

.form-group,.form-group-select{position:relative;margin-bottom:15px}

.form-group input,.form-group textarea{width:100%;font-size:14px;transition:.1s ease;resize:vertical;background:white !important;box-shadow:none!important;border-radius:5px;border:1px solid #cacaca}

.form-group.novalidate input,.form-group.novalidate textarea{border:1px solid #e2e2e2!important}

.form-group input{height:45px}

.form-group input.date-picker{padding-right:35px}

.form-group input:hover,.form-group textarea:hover{border-color:#7799d0!important}

.form-group label,.form-group-select>label{position:absolute;left:12px;top:12px;font-size:14px;color:#777;transition:.1s ease;pointer-events:none;background-color:transparent;margin:0;line-height:1.5}

.form-group>span{position:absolute;right:12px;top:12px;transition:.1s ease;pointer-events:none;display:inline-block;max-width:20px}

.form-group input:focus,.form-group textarea:focus{border-color:var(--main-color);outline:0}

.form-group input:focus+label,.form-group input:not(:placeholder-shown)+label,.form-group textarea:focus+label,.form-group textarea:not(:placeholder-shown)+label,.form-group-select>label{top:-10px;font-size:12px;background:white;padding:0 5px;left:8px;transform:none}

.custom-file{position:relative;display:inline-block;width:100%;height:calc(1.5em + .75rem + 2px);margin-bottom:0}

.custom-file-input{position:relative;z-index:2;width:100%;height:calc(1.5em + .75rem + 2px);margin:0;overflow:hidden;opacity:0}

.custom-file-label{position:absolute;top:0;right:0;left:0;z-index:1;height:calc(1.5em + .75rem + 2px);padding:.375rem .75rem;overflow:hidden;font-weight:400;line-height:1.5;color:#495057;background-color:white;border:1px solid #ced4da;border-radius:.25rem}

.custom-file-label::after{content:attr(title);position:absolute;top:0;right:0;bottom:0;z-index:3;display:block;height:calc(1.5em + .75rem);padding:.375rem .75rem;line-height:1.5;color:#495057;content:"Browse";background-color:#e9ecef;border-left:inherit;border-radius:0 .25rem .25rem 0}

.modal-btn--close{display:flex;align-items:center;justify-content:center;width:40px;height:40px;font-size:20px;color:var(--text);background:red;position:absolute;top:-10px;right:-10px;z-index:1;overflow:hidden;border-radius:50%}

.invalid-feedback{font-size:14px}

.button.button-cart { width: 180px; padding: 0 15px; height: 45px; border: 1px solid var(--text); position: relative; text-align: center; border-radius: 0; transition: background 0.3s; cursor: pointer; } 

.button.button-cart:hover { background: var(--main); border-color: var(--main); } 

.button.button-cart:first-child{ border-color: var(--main3); } 

.button.button-cart:last-child{ border-color: var(--main); } 

.button.button-cart:first-child .button-wrapper,.button.button-cart:first-child .text,.button.button-cart:first-child .icon { color: var(--main3); } 

.button.button-cart:last-child .button-wrapper,.button.button-cart:last-child .text,.button.button-cart:last-child .icon { color: var(--main); } 

.button.button-cart:first-child:hover { background: var(--main3); } 

.button.button-cart:last-child:hover { background: var(--main); } 

.button.button-cart::after,.button.button-cart::before { opacity: 0; visibility: hidden; transition: all 0.5s; } 

.text { display: flex; align-items: center; justify-content: center; } 

.button.button-cart .button-wrapper,.button.button-cart .text,.button.button-cart .icon { overflow: hidden; position: absolute; width: 100%; height: 100%; left: 0; } 

.text { top: 0 } 

.text,.icon { transition: top 0.5s; } 

.button.button-cart .icon { color: var(--text); top: 100%; display: flex; align-items: center; justify-content: center; } 

.button.button-cart .icon i { width: 30px; height: 30px; color: var(--text); } 
 
.button.button-cart:hover .text { top: -100%; } 

.button.button-cart:hover .icon { top: 0; } 

.button.button-cart:hover .icon i { color: #fff; } 

.button.button-cart:hover:before,.button.button-cart:hover:after { opacity: 1; visibility: visible; } 

.button.button-cart:hover:after { bottom: calc(var(--height) + var(--gap-between-tooltip-to-button) - 20px); } 

.button.button-cart:hover:before { bottom: calc(var(--height) + var(--gap-between-tooltip-to-button)); }