:root { --tl-shopee-primary: #ed1c26; --tl-shopee-primary-dark: #b80f17; --tl-shopee-primary-light: rgba(237, 28, 38, 0.08); --tl-shopee-primary-border: rgba(237, 28, 38, 0.25); --tl-shopee-white: #ffffff; --tl-shopee-text: #222222; --tl-shopee-muted: #757575; --tl-shopee-star: #ffce3d; --tl-shopee-border: rgba(0, 0, 0, 0.09); --tl-shopee-surface: #fafafa; } @media (min-width: 1200px) { .container { width: 1250px !important; max-width: calc(100% - 220px) !important; margin-left: auto !important; margin-right: auto !important; } } .fix_banner { position: fixed !important; top: 50% !important; transform: translateY(-50%) !important; -webkit-transform: translateY(-50%) !important; z-index: 99999 !important; width: 100px !important; display: none; } .fix_banner img { width: 100px !important; max-width: 100% !important; height: auto !important; display: block !important; } .fix_banner.in_left { left: 0 !important; right: auto !important; } .fix_banner.in_right { right: 0 !important; left: auto !important; } @media (min-width: 1200px) { .fix_banner { display: block !important; } } @media (max-width: 1199px) { .fix_banner { display: none !important; } } header { position: relative !important; z-index: 1000 !important; background: rgba(255, 255, 255, 0.75) !important; backdrop-filter: blur(12px) saturate(160%) !important; -webkit-backdrop-filter: blur(12px) saturate(160%) !important; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06) !important; border-bottom: 1px solid rgba(255, 255, 255, 0.4) !important; } header .topbar { background: rgba(255, 255, 255, 0.25) !important; border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important; padding: 5px !important; min-height: 40px !important; height: 40px !important; position: relative !important; z-index: 1001 !important; } .topbar-container { display: flex !important; align-items: center !important; justify-content: space-between !important; height: 100% !important; position: relative !important; } .topbar-left { display: flex !important; align-items: center !important; margin-left: 205px !important; } .topbar-left table, .topbar-left table tbody, .topbar-left table tr { display: flex !important; align-items: center !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; width: auto !important; } .topbar-left table td { display: inline-flex !important; align-items: center !important; padding: 0 4px !important; border: 0 !important; font-size: 12px !important; color: #333333 !important; line-height: 24px !important; background: transparent !important; } .topbar-left table td img { width: 15px !important; height: 15px !important; object-fit: contain; margin-right: 4px; } .topbar-left table td strong { color: #006aab !important; font-size: 12px !important; margin-right: 5px; font-weight: 600 !important; } .topbar-left table td br { display: none !important; } .topbar-right { display: flex !important; align-items: center !important; justify-content: flex-end !important; margin-left: auto !important; } ul.menu_topbar { margin-bottom: 0 !important; margin-left: auto !important; display: flex !important; align-items: center !important; justify-content: flex-end !important; font-weight: 300 !important; float: none !important; } ul.menu_topbar li a { font-size: 12px !important; font-weight: 300 !important; color: #2b2b2b !important; padding: 2px 10px 2px 25px !important; line-height: 24px !important; transition: color 0.2s ease, transform 0.2s ease; } ul.menu_topbar li a:before { top: 5px !important; } ul.menu_topbar li a:hover { color: var(--tl-shopee-primary) !important; } header .headtop-search-area .block_default > h3.title, section .block_default:has(.slides_inhome) > h3.title { display: none !important; } .header-middle-container { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 20px !important; padding-top: 4px !important; padding-bottom: 0 !important; padding-left: 0 !important; position: relative !important; } header .logo { float: none !important; width: 125px !important; padding: 0 !important; margin: 0 !important; flex: 0 0 125px !important; display: flex !important; align-items: center !important; justify-content: flex-start !important; text-align: left !important; position: relative !important; z-index: 1005 !important; margin-top: -58px !important; margin-bottom: 5px !important; margin-left: 0 !important; left: 0 !important; } header .logo a { display: inline-flex !important; align-items: center !important; justify-content: flex-start !important; text-align: left !important; margin: 0 !important; padding: 0 !important; } header .logo img { width: 125px !important; height: 125px !important; object-fit: contain; filter: drop-shadow(0 4px 14px rgba(0, 0, 0, 0.16)); transition: transform 0.25s ease; margin-left: 0 !important; display: block !important; } header .logo img:hover { transform: scale(1.05); } .headtop-search-area { flex: 1 1 auto !important; max-width: 960px !important; margin: 0 auto !important; padding: 0 !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; width: 100% !important; } header .headtop-search-area .s_content, header .headtop-search-area .block_default .s_content, header .s_content { margin: 10px auto !important; width: 100% !important; max-width: 960px !important; display: flex !important; flex-direction: column !important; align-items: center !important; } header .header-cart-area { flex: 0 0 125px !important; display: flex !important; align-items: center !important; justify-content: flex-end !important; width: 125px !important; margin-left: 0 !important; margin-bottom: 20px !important; } header .header-cart-area .block_default, header .header-cart-area .s_content, header .header-cart-area .block_cart, header .header-cart-area .block { margin: 0 !important; padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; } header .header-cart-area .block_default > h3.title { display: none !important; } @keyframes tlPhoneRing { 0%, 100% { transform: rotate(0deg) scale(1); } 10%, 30% { transform: rotate(-14deg) scale(1.08); } 20%, 40% { transform: rotate(14deg) scale(1.08); } 50% { transform: rotate(0deg) scale(1); } } .show_hotline { position: fixed !important; top: auto !important; bottom: 7% !important; right: 20px !important; left: auto !important; height: auto !important; width: auto !important; padding: 0 !important; background: transparent !important; z-index: 99999 !important; } .show_hotline > a { display: inline-flex !important; align-items: center; gap: 10px; background: linear-gradient(135deg, #ed1c26 0%, #b80f17 100%) !important; color: var(--tl-shopee-white) !important; padding: 6px 16px 6px 6px !important; border-radius: 50px !important; border: 2px solid rgba(255, 255, 255, 0.92) !important; box-shadow: 0 6px 20px rgba(237, 28, 38, 0.4) !important; text-decoration: none !important; transition: transform 0.25s ease, box-shadow 0.25s ease !important; } .show_hotline > a:hover { transform: translateY(-2px) scale(1.02); box-shadow: 0 8px 25px rgba(237, 28, 38, 0.55) !important; } .show_hotline .simage { width: 36px !important; height: 36px !important; border-radius: 50% !important; background: var(--tl-shopee-white) !important; color: var(--tl-shopee-primary) !important; display: flex !important; align-items: center; justify-content: center; float: none !important; padding: 0 !important; margin: 0 !important; font-size: 18px; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15); } .show_hotline .simage i { animation: tlPhoneRing 2.2s infinite ease-in-out; } .show_hotline .simage img { display: none !important; } .show_hotline .stitle { width: auto !important; color: var(--tl-shopee-white) !important; font-size: 11px !important; font-weight: 600 !important; line-height: 1.25 !important; text-align: left !important; margin: 0 !important; padding: 0 !important; } .show_hotline .stitle span { position: static !important; display: block !important; opacity: 1 !important; background: transparent !important; color: var(--tl-shopee-white) !important; font-size: 14.5px !important; font-weight: 700 !important; padding: 0 !important; margin: 1px 0 0 !important; min-width: 0 !important; letter-spacing: 0.3px; } .header-with-search__search-section { display: flex !important; flex-direction: column !important; justify-content: flex-start !important; position: relative !important; width: 100% !important; max-width: 870px !important; } @media (min-width: 992px) { .header-with-search__search-section { margin-left: 100px !important; } } @media (max-width: 991px) { .header-with-search__search-section { margin-left: 0 !important; margin: 0 !important; } .show_hotline { display: none !important; } } .shopee-searchbar, #search_form_shops { display: flex !important; align-items: center !important; background: #ffffff !important; border: 1px solid #e8e8e8 !important; border-radius: 40px !important; box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.08) !important; box-sizing: border-box !important; height: 40px !important; padding: 3px 4px 3px 18px !important; width: 100% !important; max-width: 100% !important; transition: border-color 0.2s ease, box-shadow 0.2s ease !important; } .shopee-searchbar:focus-within, #search_form_shops:focus-within { border-color: #ed1c26 !important; box-shadow: 0 1px 6px 0 rgba(237, 28, 38, 0.2) !important; } .shopee-searchbar-input { display: flex !important; flex: 1 1 auto !important; align-items: center !important; position: relative !important; padding: 0 !important; background: transparent !important; } .shopee-searchbar-input__input { width: 100% !important; height: 34px !important; line-height: 34px !important; border: 0 !important; outline: none !important; background: transparent !important; color: #222222 !important; font-size: 14px !important; padding: 0 8px 0 0 !important; margin: 0 !important; box-shadow: none !important; font-style: normal !important; } .shopee-searchbar-input__input::placeholder, #keyword::placeholder { color: #999999 !important; font-size: 13px !important; font-style: italic !important; font-weight: 300 !important; } .shopee-searchbar-input__input::-webkit-input-placeholder, #keyword::-webkit-input-placeholder { color: #999999 !important; font-size: 13px !important; font-style: italic !important; font-weight: 300 !important; } .shopee-searchbar-input__input::-moz-placeholder, #keyword::-moz-placeholder { color: #999999 !important; font-size: 13px !important; font-style: italic !important; font-weight: 300 !important; opacity: 1 !important; } .shopee-searchbar-input__input:-ms-input-placeholder, #keyword:-ms-input-placeholder { color: #999999 !important; font-size: 13px !important; font-style: italic !important; font-weight: 300 !important; } .shopee-searchbar__search-button, .header-with-search__search-section button { display: flex !important; align-items: center !important; justify-content: center !important; width: 34px !important; height: 34px !important; line-height: 34px !important; border: 0 !important; border-radius: 50% !important; background: #ed1c26 !important; color: #ffffff !important; font-size: 14px !important; padding: 0 !important; margin: 0 !important; cursor: pointer !important; flex: 0 0 34px !important; box-shadow: 0 2px 6px rgba(237, 28, 38, 0.25) !important; transition: opacity 0.2s ease, transform 0.15s ease !important; } .shopee-searchbar__search-button:hover, .header-with-search__search-section button:hover { opacity: 0.9 !important; transform: scale(1.05) !important; } .shopee-searchbar__search-button i { color: #ffffff !important; font-size: 14px !important; } .shopee-searchbar__search-button svg, .shopee-searchbar__search-button .shopee-svg-search, .shopee-searchbar__search-button .icon-search { width: 16px !important; height: 16px !important; stroke: #ffffff !important; fill: none !important; background: transparent !important; background-color: transparent !important; display: block !important; margin: 0 auto !important; border: 0 !important; box-shadow: none !important; } .shopee-searchbar__search-button svg circle, .shopee-searchbar__search-button svg line { stroke: #ffffff !important; stroke-width: 2px !important; fill: none !important; } .shopee-searchbar-hints { display: flex !important; align-items: center !important; justify-content: center !important; text-align: center !important; flex-wrap: nowrap !important; overflow: hidden !important; height: auto !important; min-height: 22px !important; margin-top: 10px !important; margin-bottom: 5px !important; padding: 0 2px !important; gap: 13px !important; width: 100% !important; } .shopee-searchbar-hints a { color: #444444 !important; font-size: 13px !important; font-weight: 400 !important; text-decoration: none !important; white-space: nowrap !important; line-height: 18px !important; background: transparent !important; border: 0 !important; padding: 0 !important; margin: 0 !important; box-shadow: none !important; border-radius: 0 !important; transition: color 0.15s ease !important; } .shopee-searchbar-hints a:hover { color: #ed1c26 !important; background: transparent !important; box-shadow: none !important; border: 0 !important; transform: none !important; } #show_result { border-radius: 6px; border: 1px solid #e8e8e8; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.16) !important; max-height: 420px; height: auto !important; z-index: 9999 !important; } .keyhint { background: var(--tl-shopee-primary) !important; color: var(--tl-shopee-white) !important; font-weight: 600; padding: 8px 12px !important; } .result_ajax { padding: 10px 12px !important; border-bottom: 1px solid #f2f2f2 !important; transition: background-color 0.15s ease; } .result_ajax:hover { background: #fff5f5 !important; } .result_ajax .sinfo a { color: var(--tl-shopee-text); font-size: 13.5px; } .result_ajax .sinfo a:hover { color: var(--tl-shopee-primary); } header .mainmenu { background: linear-gradient(90deg, #464288 0%, #006aab 50%, #0096cf 100%) !important; min-height: 54px !important; box-shadow: 0 4px 18px rgba(0, 106, 171, 0.3) !important; border-top: 1px solid rgba(255, 255, 255, 0.25) !important; border-bottom: 1px solid rgba(0, 70, 115, 0.2) !important; position: relative; z-index: 1001; } @media (min-width: 768px) { .mobile-drawer-hints-wrapper { display: none !important; } header .mainmenu .navbar-collapse { text-align: center !important; padding-left: 0 !important; padding-right: 0 !important; } header .mainmenu #main-menu.sm-blue, header .mainmenu .sm-blue { display: inline-block !important; float: none !important; vertical-align: top !important; width: auto !important; margin: 0 auto !important; text-align: left !important; } .sm-blue > li > a { padding: 18px 24px !important; margin: 0 !important; font-size: 14px !important; font-weight: 700 !important; letter-spacing: 0.3px; color: #ffffff !important; background-image: none !important; background-color: transparent !important; border-radius: 0 !important; transition: all 0.3s ease !important; } .sm-blue > li > a:hover, .sm-blue > li > a:focus, .sm-blue > li > a:active, .sm-blue > li > a.highlighted, .sm-blue > li.active > a, .sm-blue > li.current > a { color: #ffffff !important; background-color: transparent !important; background-image: url('../images/bgmenu.png') !important; background-repeat: no-repeat !important; background-position: center center !important; background-size: 100% 100% !important; border-radius: 0 !important; } .sm-blue ul { background: #ffffff !important; border: 1px solid rgba(0, 0, 0, 0.08) !important; border-radius: 8px !important; box-shadow: 0 10px 28px rgba(0, 0, 0, 0.16) !important; padding: 6px 0 !important; margin-top: 4px !important; } .sm-blue ul a, .sm-blue ul a:hover, .sm-blue ul a:focus, .sm-blue ul a:active { background-image: none !important; color: #222222 !important; font-size: 13.5px !important; font-weight: 500 !important; text-transform: none !important; padding: 9px 18px !important; margin: 0 !important; border-left: 3px solid transparent !important; transition: all 0.15s ease !important; } .sm-blue ul a:hover, .sm-blue ul a:focus, .sm-blue ul a.highlighted { background-color: rgba(0, 106, 171, 0.08) !important; color: #006aab !important; border-left-color: #006aab !important; } } .s_cart { margin: 0 !important; padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; text-align: right !important; } .s_cart #carthover { display: inline-flex !important; align-items: center !important; justify-content: flex-end !important; gap: 10px !important; margin: 0 !important; padding: 0 !important; } .s_cart a.cart-checkout-btn, .s_cart a#submit_send { position: relative !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 34px !important; height: 32px !important; margin: 0 !important; padding: 0 !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; text-decoration: none !important; cursor: pointer !important; transition: transform 0.2s ease, opacity 0.2s ease !important; } .s_cart a.cart-checkout-btn:hover, .s_cart a#submit_send:hover { transform: scale(1.08) !important; background: transparent !important; box-shadow: none !important; } .s_cart a.cart-checkout-btn .cart-icon-svg, .s_cart a#submit_send .cart-icon-svg { display: block !important; width: 24px !important; height: 24px !important; transition: transform 0.2s ease !important; } .s_cart a.cart-checkout-btn .cart-icon-svg path, .s_cart a#submit_send .cart-icon-svg path { stroke: #006aab !important; } .s_cart a.cart-checkout-btn .cart-icon-svg circle, .s_cart a#submit_send .cart-icon-svg circle { fill: #006aab !important; } .s_cart a.cart-checkout-btn:hover .cart-icon-svg path, .s_cart a#submit_send:hover .cart-icon-svg path { stroke: #005082 !important; } .s_cart a.cart-checkout-btn:hover .cart-icon-svg circle, .s_cart a#submit_send:hover .cart-icon-svg circle { fill: #005082 !important; } .s_cart a.cart-badge-count, .s_cart a.cart-checkout-btn .cart-badge-count, .s_cart a#submit_send span, .s_cart .cart-badge-count, .s_cart a.cart-wishlist-btn span, .s_cart #wishlist_num_id { position: absolute !important; top: -5px !important; right: -5px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; min-width: 20px !important; height: 20px !important; padding: 0 2px !important; background-color: #ed1c26 !important; color: #ffffff !important; border: 2px solid #ffffff !important; border-radius: 50% !important; font-size: 11px !important; font-weight: 300 !important; line-height: 1 !important; letter-spacing: -0.2px !important; text-align: center !important; box-shadow: 0 2px 5px rgba(237, 28, 38, 0.4) !important; box-sizing: border-box !important; white-space: nowrap !important; } .s_cart a.cart-wishlist-btn { position: relative !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 34px !important; height: 32px !important; margin: 0 !important; padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; text-decoration: none !important; cursor: pointer !important; transition: transform 0.2s ease !important; } .s_cart a.cart-wishlist-btn:hover { transform: scale(1.08) !important; background: transparent !important; } .s_cart a.cart-wishlist-btn .wishlist-icon-svg { display: block !important; width: 24px !important; height: 24px !important; transition: transform 0.2s ease !important; } .s_cart a.cart-wishlist-btn .wishlist-icon-svg path { stroke: #006aab !important; fill: none !important; } .s_cart a.cart-wishlist-btn:hover .wishlist-icon-svg path { stroke: #005082 !important; } header .mainmenu .sleft { width: 100% !important; float: none !important; } header .mainmenu .sright { display: none !important; } .slides_inhome { border-radius: 8px; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08); overflow: hidden; } .block_border { position: relative !important; width: 100% !important; margin: 40px 0 !important; padding: 0 0 24px !important; border-bottom: 0 !important; } .block_border:before { position: absolute !important; content: "" !important; background-color: rgba(255, 255, 255, 0.75) !important; backdrop-filter: blur(12px) saturate(160%) !important; -webkit-backdrop-filter: blur(12px) saturate(160%) !important; border: 1px solid rgba(255, 255, 255, 0.6) !important; border-bottom: 5px solid #e0dddd !important; box-shadow: 0 16px 38px rgba(0, 0, 0, 0.16), 0 6px 16px rgba(0, 0, 0, 0.12) !important; border-radius: 12px !important; background-repeat: no-repeat !important; background-size: 100% auto !important; width: 100% !important; height: calc(100% - 52px) !important; top: 54px !important; right: 0 !important; left: 0 !important; z-index: 1 !important; pointer-events: none !important; box-sizing: border-box !important; } .block_border h3.title { padding: 50px 30px 0px 0px !important; margin: 0 auto 0px !important; } .block_border .s_content { position: relative !important; z-index: 2 !important; padding: 10px 20px 10px !important; } .block_border .bx-wrapper, .product_bxslider .bx-wrapper, .catshop_bxslider .bx-wrapper { background: transparent !important; border: 0 !important; box-shadow: none !important; -webkit-box-shadow: none !important; margin: 0 auto !important; padding: 0 !important; } .block_border .bx-wrapper .bx-viewport, .product_bxslider .bx-wrapper .bx-viewport, .catshop_bxslider .bx-wrapper .bx-viewport { background: transparent !important; border: 0 !important; box-shadow: none !important; -webkit-box-shadow: none !important; left: 0 !important; padding: 8px 4px 14px !important; } .product_bxslider .bx-viewport > div, .catshop_bxslider .bx-viewport > div { display: flex !important; align-items: stretch !important; } .product_bxslider .bx-viewport > div > div, .catshop_bxslider .bx-viewport > div > div { display: flex !important; flex-direction: column !important; flex-shrink: 0 !important; height: auto !important; } .product_bxslider .item, .catshop_bxslider .item, #category .grid_item .item, #category .thumbnail { position: relative; background-color: var(--tl-shopee-white) !important; border: 1px solid var(--tl-shopee-border) !important; border-radius: 8px !important; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04) !important; overflow: hidden; height: 100% !important; display: flex !important; flex-direction: column !important; justify-content: space-between !important; flex: 1 1 auto !important; transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important; } .product_bxslider .item:hover, .catshop_bxslider .item:hover, #category .grid_item .item:hover, #category .thumbnail:hover { transform: translateY(-4px); border-color: #006aab !important; box-shadow: 0 8px 24px rgba(0, 106, 171, 0.16) !important; z-index: 2; } .product_bxslider .item .i_image, .catshop_bxslider .item .i_image, #category .grid_item .item .s_image { position: relative; width: 100% !important; height: 250px !important; flex: 0 0 250px !important; background: #f8f8f8; overflow: hidden; border-bottom: 1px solid #f0f0f0; border-top-left-radius: 8px; border-top-right-radius: 8px; padding: 0 !important; margin: 0 !important; display: block !important; } .product_bxslider .item .i_image a, .catshop_bxslider .item .i_image a, #category .grid_item .item .s_image a { display: block !important; width: 100% !important; height: 100% !important; padding: 0 !important; margin: 0 !important; overflow: hidden; } .product_bxslider .item .i_image img, .catshop_bxslider .item .i_image img, #category .grid_item .item .s_image img { width: 100% !important; height: 100% !important; max-height: none !important; max-width: none !important; object-fit: cover !important; object-position: center !important; display: block !important; margin: 0 !important; padding: 0 !important; transition: transform 0.35s ease !important; } .product_bxslider .item:hover .i_image img, .catshop_bxslider .item:hover .i_image img, #category .grid_item .item:hover .s_image img { transform: scale(1.06) !important; } .shopee-mall-badge { display: none !important; } .product_bxslider .item .i_image .s_overlay, .catshop_bxslider .item .i_image .s_overlay, #category .grid_item .item .s_overlay { position: absolute; top: 8px !important; right: 6px !important; z-index: 4; display: flex; flex-direction: column; gap: 4px; align-items: flex-end; } .label-discount, .label-newday, .label-point, .label-gift { background-color: var(--tl-shopee-primary) !important; color: var(--tl-shopee-white) !important; border-radius: 3px !important; width: auto !important; min-width: 38px; height: 20px !important; line-height: 20px !important; padding: 0 6px !important; font-size: 11px !important; font-weight: 700 !important; letter-spacing: 0.2px; box-shadow: 0 1px 3px rgba(237, 28, 38, 0.3); } .product_bxslider .item .i_content, .catshop_bxslider .item .i_content, #category .grid_item .item .s_content { padding: 14px 14px 16px !important; text-align: left !important; background: var(--tl-shopee-white); display: flex !important; flex-direction: column !important; justify-content: space-between !important; flex: 1 1 auto !important; } .product_bxslider .item .i_content p, .catshop_bxslider .item .i_content p { display: none !important; } .product_bxslider .item .i_content h4, .catshop_bxslider .item .i_content h4, #category .thumbnail .caption h3 { margin: 0 0 10px !important; padding: 0 !important; color: #222222 !important; font-size: 14px !important; font-weight: 600 !important; line-height: 20px !important; height: auto !important; min-height: 48px !important; display: block !important; -webkit-line-clamp: unset !important; overflow: visible !important; text-overflow: unset !important; transition: color 0.15s ease; } .product_bxslider .item .i_content h4 a, .catshop_bxslider .item .i_content h4 a, #category .thumbnail .caption h3 a { color: inherit !important; } .product_bxslider .item:hover .i_content h4, .catshop_bxslider .item:hover .i_content h4, #category .thumbnail:hover .caption h3 { color: #006aab !important; } .shopee-card-meta { display: flex !important; align-items: center !important; justify-content: flex-start !important; margin: 0 0 10px !important; min-height: 18px !important; line-height: 1 !important; } .shopee-stars { display: inline-flex !important; align-items: center !important; gap: 2px !important; font-size: 12px !important; line-height: 1 !important; } .shopee-stars .star-filled, .shopee-stars .fa-star, .shopee-stars .fa-star-half-o { color: #ffbe00 !important; } .shopee-stars .star-empty, .shopee-stars .fa-star-o { color: #cbd5e1 !important; background: transparent !important; } .shopee-stock-tag { display: none !important; } .product_bxslider .item .i_content .showprice, .catshop_bxslider .item .i_content .showprice { width: 100% !important; padding: 10px 0 0 !important; margin: auto 0 0 !important; border-top: 1px dashed #efefef !important; } .product_bxslider .item .i_content .showprice > .row, .catshop_bxslider .item .i_content .showprice > .row { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 8px !important; margin: 0 !important; padding: 0 !important; width: 100% !important; } .product_bxslider .item .i_content .showprice > .row:before, .product_bxslider .item .i_content .showprice > .row:after, .catshop_bxslider .item .i_content .showprice > .row:before, .catshop_bxslider .item .i_content .showprice > .row:after { display: none !important; } .product_bxslider .item .i_content .showprice [class*="col-"], .catshop_bxslider .item .i_content .showprice [class*="col-"] { width: 100% !important; text-align: left !important; padding: 0 !important; margin: 0 !important; float: none !important; } .product_bxslider .item .price, .catshop_bxslider .item .price { display: flex !important; align-items: baseline !important; flex-wrap: wrap !important; gap: 6px 8px !important; margin: 0 !important; padding: 0 !important; width: 100% !important; text-align: left !important; } .money, .product_bxslider .item .money, .catshop_bxslider .item .money, #category .grid_item .item .money { color: var(--tl-shopee-primary) !important; font-weight: 700 !important; font-size: 16px !important; line-height: 1.2; white-space: nowrap; } .price-unit, .money .price-unit, .discounts_money .price-unit { font-size: 12px !important; font-weight: 300 !important; display: inline-block; margin-left: 2px; vertical-align: baseline; } .discounts_money, .product_bxslider .item .discounts_money, .catshop_bxslider .item .discounts_money { color: #929292 !important; font-size: 13px !important; font-weight: 400 !important; text-decoration: line-through; padding: 0 !important; display: inline-block; } #category .grid_item .item .s_content .p_price { margin: 6px 0 10px !important; min-height: 22px; } .product-card-buttons { display: flex !important; flex-direction: row !important; gap: 6px !important; width: 100% !important; margin-top: 8px !important; margin-left: 0 !important; margin-right: 0 !important; padding: 0 !important; align-items: stretch !important; box-sizing: border-box !important; } .btn-card-action { min-width: 0 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 4px !important; min-height: 38px !important; border-radius: 0 !important; font-size: 11.5px !important; font-weight: 300 !important; line-height: 1.2 !important; letter-spacing: 0.2px !important; text-transform: uppercase !important; text-align: center !important; text-decoration: none !important; white-space: nowrap !important; border: 0 !important; cursor: pointer !important; transition: all 0.2s ease !important; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08) !important; box-sizing: border-box !important; } .btn-card-action span, .btn-card-action a { font-weight: 300 !important; font-size: 11.5px !important; text-transform: uppercase !important; white-space: nowrap !important; } .btn-card-action.btn-add-cart { flex: 0 0 calc(65% - 4px) !important; width: calc(65% - 4px) !important; max-width: calc(65% - 4px) !important; padding: 8px 4px !important; background: linear-gradient(90deg, #464288 0%, #006aab 50%, #0096cf 100%) !important; color: #ffffff !important; border-radius: 0 !important; } .btn-card-action.btn-add-cart:hover { background: linear-gradient(90deg, #5751a8 0%, #007cc7 50%, #00aff2 100%) !important; color: #ffffff !important; transform: translateY(-1px); box-shadow: 0 4px 10px rgba(0, 106, 171, 0.35) !important; } .btn-card-action.btn-add-cart .cart-btn-icon, .cart-btn-icon { width: 15px !important; height: 15px !important; display: inline-block !important; vertical-align: middle !important; flex-shrink: 0 !important; color: #ffffff !important; overflow: visible !important; } .btn-card-action.btn-buy-now { flex: 1 1 calc(35% - 2px) !important; width: calc(35% - 2px) !important; max-width: calc(35% - 2px) !important; padding: 8px 2px !important; font-size: 11px !important; letter-spacing: 0px !important; background: #ed1c26 !important; color: #ffffff !important; border-radius: 0 !important; } .btn-card-action.btn-buy-now span { font-size: 11px !important; letter-spacing: 0px !important; } .btn-card-action.btn-buy-now:hover { background: #ff2b35 !important; color: #ffffff !important; transform: translateY(-1px); box-shadow: 0 4px 10px rgba(237, 28, 38, 0.35) !important; } .btn-order, a.btn-order, button.btn-order, .product_bxslider .item .btn-order, .catshop_bxslider .item .btn-order { width: 100% !important; display: flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; background: #006aab !important; color: var(--tl-shopee-white) !important; border: 0 !important; border-radius: 6px !important; padding: 8px 12px !important; font-size: 13px !important; font-weight: 600 !important; line-height: 18px !important; text-transform: uppercase !important; letter-spacing: 0.3px !important; white-space: nowrap; box-shadow: 0 2px 6px rgba(0, 106, 171, 0.25) !important; transition: all 0.25s ease !important; } .btn-order:hover, a.btn-order:hover, button.btn-order:hover, .product_bxslider .item .btn-order:hover, .catshop_bxslider .item .btn-order:hover { background: #ed1c26 !important; color: var(--tl-shopee-white) !important; box-shadow: 0 4px 12px rgba(237, 28, 38, 0.35) !important; transform: translateY(-1px) !important; } #category .grid_item .item .s_content .btn-order { width: 100%; padding: 7px 12px !important; font-size: 13px !important; } .product_bxslider .item .showprice input[type="checkbox"], .catshop_bxslider .item .showprice input[type="checkbox"], .product_bxslider .item .showprice a[onclick*="nv_compare"], .catshop_bxslider .item .showprice a[onclick*="nv_compare"] { display: none !important; } .product_bxslider .bx-wrapper .bx-controls, .catshop_bxslider .bx-wrapper .bx-controls, .block_border .bx-wrapper .bx-controls { position: relative !important; width: 100% !important; margin: 10px auto 0 !important; padding: 0 !important; display: block !important; text-align: center !important; z-index: 10 !important; clear: both !important; } .product_bxslider .bx-wrapper .bx-controls-direction, .catshop_bxslider .bx-wrapper .bx-controls-direction, .block_border .bx-wrapper .bx-controls-direction { display: flex !important; justify-content: center !important; align-items: center !important; gap: 12px !important; width: auto !important; margin: 0 auto !important; position: static !important; } .product_bxslider .bx-wrapper .bx-controls-direction a, .catshop_bxslider .bx-wrapper .bx-controls-direction a, .block_border .bx-wrapper .bx-controls-direction a { position: static !important; top: auto !important; left: auto !important; right: auto !important; bottom: auto !important; transform: none !important; margin: 0 !important; width: 38px !important; height: 38px !important; border-radius: 50% !important; background: var(--tl-shopee-white) !important; border: 1px solid rgba(0, 0, 0, 0.12) !important; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important; text-indent: 0 !important; font-size: 0 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; color: #333333 !important; z-index: 10 !important; transition: all 0.2s ease !important; cursor: pointer !important; opacity: 1 !important; } .product_bxslider .bx-wrapper .bx-prev, .catshop_bxslider .bx-wrapper .bx-prev, .block_border .bx-wrapper .bx-prev { position: static !important; left: auto !important; right: auto !important; margin: 0 !important; background-image: none !important; } .product_bxslider .bx-wrapper .bx-next, .catshop_bxslider .bx-wrapper .bx-next, .block_border .bx-wrapper .bx-next { position: static !important; left: auto !important; right: auto !important; margin: 0 !important; background-image: none !important; } .product_bxslider .bx-wrapper .bx-prev:before, .catshop_bxslider .bx-wrapper .bx-prev:before, .block_border .bx-wrapper .bx-prev:before { content: "\f104" !important; font-family: FontAwesome !important; font-size: 20px !important; line-height: 1 !important; } .product_bxslider .bx-wrapper .bx-next:before, .catshop_bxslider .bx-wrapper .bx-next:before, .block_border .bx-wrapper .bx-next:before { content: "\f105" !important; font-family: FontAwesome !important; font-size: 20px !important; line-height: 1 !important; } .product_bxslider .bx-wrapper .bx-controls-direction a:hover, .catshop_bxslider .bx-wrapper .bx-controls-direction a:hover, .block_border .bx-wrapper .bx-controls-direction a:hover { background: var(--tl-shopee-primary) !important; border-color: var(--tl-shopee-primary) !important; color: var(--tl-shopee-white) !important; transform: scale(1.08) !important; } .grid_group .bx-wrapper { max-width: 100% !important; width: 100% !important; display: block !important; margin: 0 auto !important; } .grid_group .bx-wrapper .bx-viewport { width: 100% !important; } .grid_group .bx-wrapper .bx-controls-direction a { width: 32px !important; height: 32px !important; margin-top: -16px !important; border-radius: 50% !important; background: rgba(255, 255, 255, 0.94) !important; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border: 1px solid rgba(0, 0, 0, 0.08) !important; box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12) !important; text-indent: 0 !important; font-size: 0 !important; display: flex !important; align-items: center; justify-content: center; color: #333333 !important; z-index: 10 !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; transition: all 0.28s cubic-bezier(0.4, 0, 0.2, 1) !important; } .grid_group .bx-wrapper .bx-prev { left: -8px !important; transform: translateX(6px) scale(0.9) !important; } .grid_group .bx-wrapper .bx-next { right: -8px !important; transform: translateX(-6px) scale(0.9) !important; } .grid_group .bx-wrapper .bx-prev:before { content: "\f053"; font-family: FontAwesome; font-size: 13px; line-height: 1; font-weight: 400; margin-right: 1px; } .grid_group .bx-wrapper .bx-next:before { content: "\f054"; font-family: FontAwesome; font-size: 13px; line-height: 1; font-weight: 400; margin-left: 1px; } .grid_group:hover .bx-wrapper .bx-controls-direction a, .grid_group .bx-wrapper:hover .bx-controls-direction a { opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; } .grid_group:hover .bx-wrapper .bx-prev, .grid_group .bx-wrapper:hover .bx-prev { left: -14px !important; transform: translateX(0) scale(1) !important; } .grid_group:hover .bx-wrapper .bx-next, .grid_group .bx-wrapper:hover .bx-next { right: -14px !important; transform: translateX(0) scale(1) !important; } .grid_group .bx-wrapper .bx-controls-direction a:hover { background: #ed1c26 !important; border-color: #ed1c26 !important; color: #ffffff !important; box-shadow: 0 4px 14px rgba(237, 28, 38, 0.4) !important; transform: scale(1.12) !important; } .grid_group .item { border-radius: 6px; background: transparent !important; padding: 3px; } .grid_group .item .simage { background: var(--tl-shopee-white); border: 1px solid #ebebeb !important; border-radius: 6px; padding: 8px 14px !important; height: 74px !important; display: flex !important; align-items: center; justify-content: center; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05); transition: all 0.2s ease; cursor: pointer; } .grid_group .item .simage a { display: flex !important; align-items: center; justify-content: center; width: 100% !important; height: 100% !important; text-decoration: none; cursor: pointer; } .grid_group .item .simage img { height: 52px !important; max-height: 52px !important; max-width: 100% !important; width: auto !important; object-fit: contain; } .grid_group .item .simage a:has(img) + .brand-fallback-name { display: none !important; } .grid_group .item .simage .brand-fallback-name { display: inline-flex; align-items: center; justify-content: center; font-size: 13.5px; font-weight: 700; color: var(--tl-shopee-primary) !important; text-transform: uppercase; letter-spacing: 0.6px; background: rgba(237, 28, 38, 0.06); border: 1px dashed rgba(237, 28, 38, 0.3); border-radius: 4px; padding: 6px 12px; width: 100%; height: 100%; text-align: center; } .grid_group .item:hover .simage { border-color: var(--tl-shopee-primary) !important; box-shadow: 0 4px 12px rgba(237, 28, 38, 0.15); transform: translateY(-2px); } .endfooter { width: 100% !important; border-top: 1px solid rgba(255, 255, 255, 0.4) !important; border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important; } .endfooter:before { display: none !important; } .shopee-trust-badges-bar { width: 100%; } .shopee-trust-badges-bar .trust-col { margin-bottom: 8px; } .shopee-trust-badges-bar .trust-item { display: flex; align-items: center; gap: 14px; transition: all 0.25s ease; } .shopee-trust-badges-bar .trust-item:hover { border-color: #006aab; } .shopee-trust-badges-bar .trust-icon { flex-shrink: 0; display: flex; align-items: center; justify-content: center; background: rgba(0, 106, 171, 0.08); font-size: 18px; transition: all 0.25s ease; } .shopee-trust-badges-bar .trust-item:hover .trust-icon { background: #006aab; color: #ffffff; } .shopee-trust-badges-bar .trust-text h4 { font-weight: 700 !important; margin: 0 0 2px 0 !important; text-transform: uppercase !important; letter-spacing: 0.2px !important; } .shopee-trust-badges-bar .trust-text p { margin: 0 !important; line-height: 1.4 !important; } footer { position: relative !important; width: 100% !important; border-radius: 0 !important; margin: 0 !important; } footer .s_top { position: relative !important; width: 100% !important; padding: 0 0 30px !important; border-bottom: 0 !important; border-radius: 0 !important; background: transparent !important; } footer .s_top > .container { background: transparent !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; border-radius: 0 !important; border: 0 !important; box-shadow: none !important; } .footer-row { margin-left: -15px !important; margin-right: -15px !important; } .footer-col { margin-bottom: 24px !important; } footer .s_top .block_default h3.title { font-weight: 700 !important; text-transform: uppercase !important; } footer .s_top .block_default h3.title:before { display: none !important; } .theme-tet footer .s_top .block_default h3.title:before, body.tet footer .s_top .block_default h3.title:before { display: block !important; width: 16px !important; height: 16px !important; background-size: contain !important; top: -1px !important; left: -22px !important; } footer .footer-menu ul, footer ul { list-style: none !important; padding: 0 !important; margin: 0 !important; } footer .footer-menu ul li, footer ul li { margin-bottom: 8px !important; line-height: 1.6 !important; } footer .footer-menu ul li i { font-size: 11px !important; margin-right: 6px !important; } footer .footer-menu ul li a, footer a { text-decoration: none !important; transition: all 0.2s ease !important; } footer iframe, footer .fb-page, footer .fb-like-box, footer .fb-page span, footer .fb-page iframe { max-width: 100% !important; width: 100% !important; border-radius: 6px !important; } footer .s_bottom { border-radius: 0 !important; text-align: center !important; } footer .s_bottom p { margin: 0 !important; line-height: 1.6 !important; } footer .s_bottom strong { font-weight: 600 !important; } footer .s_bottom a { font-weight: 600 !important; text-decoration: none !important; transition: color 0.2s ease !important; } footer .s_bottom a:hover { text-decoration: underline !important; } #back-to-top { background-color: var(--tl-shopee-primary) !important; border-radius: 50% !important; box-shadow: 0 3px 10px rgba(237, 28, 38, 0.35); } #detail { position: relative !important; background: transparent !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; border: 0 !important; box-shadow: none !important; border-radius: 0 !important; padding: 0 !important; margin: 25px auto 40px !important; box-sizing: border-box !important; width: 100% !important; } #detail .detail-main-box { background: #ffffff !important; border: 1px solid #e2e8f0 !important; border-radius: 8px !important; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04) !important; padding: 24px !important; margin-bottom: 24px !important; box-sizing: border-box !important; width: 100% !important; } #detail .detail-main-box .p_top { background: transparent !important; border: none !important; border-radius: 0 !important; box-shadow: none !important; padding: 0 !important; margin-bottom: 24px !important; } #detail .detail-main-box .p_content { background: transparent !important; border: none !important; border-radius: 0 !important; box-shadow: none !important; padding: 24px 0 0 0 !important; margin-top: 0 !important; margin-bottom: 0 !important; border-top: 1px solid #f1f5f9 !important; } #detail > .p_top { background: #ffffff !important; border: 1px solid #e2e8f0 !important; border-bottom: none !important; border-radius: 8px 8px 0 0 !important; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04) !important; padding: 24px !important; margin-bottom: 0 !important; box-sizing: border-box !important; } #detail > .p_content { background: #ffffff !important; border: 1px solid #e2e8f0 !important; border-top: 1px solid #f1f5f9 !important; border-radius: 0 0 8px 8px !important; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04) !important; padding: 24px !important; margin-top: 0 !important; margin-bottom: 24px !important; box-sizing: border-box !important; } #detail .p_top .s_image { position: relative !important; background: transparent !important; border: none !important; padding: 0 !important; overflow: visible !important; } #detail .p_top .s_image .detail-main-image { position: relative !important; background: #ffffff !important; border: 0 !important; border-radius: 8px !important; padding: 0 !important; overflow: hidden !important; box-sizing: border-box !important; width: 100% !important; float: none !important; } #detail .p_top .s_image .detail-main-image .bx-wrapper { margin: 0 !important; padding: 0 !important; border: 0 !important; box-shadow: none !important; background: transparent !important; } #detail .p_top .s_image .detail-main-image .bx-viewport { border: 0 !important; box-shadow: none !important; background: transparent !important; left: 0 !important; } #detail .p_top .s_image .detail-main-image .item, #detail .p_top .s_image .detail-main-image > a { display: flex !important; align-items: center !important; justify-content: center !important; height: 480px !important; } #detail .p_top .s_image .detail-main-image img { width: 100% !important; max-width: 100% !important; height: 100% !important; max-height: none !important; object-fit: cover !important; display: block !important; margin: 0 !important; border-radius: 0 !important; cursor: zoom-in !important; transition: transform 0.15s ease-out !important; will-change: transform; } #detail .p_top .s_image .detail-main-image .item { overflow: hidden !important; } #detail .p_top .s_image .detail-main-image.image_popup > a { width: 100% !important; } #detail .p_top .s_image .detail-zoom-btn { position: absolute !important; top: 12px !important; right: 12px !important; z-index: 20 !important; width: 34px !important; height: 34px !important; padding: 0 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; background: rgba(255, 255, 255, 0.92) !important; color: #334155 !important; border: 1px solid #cbd5e1 !important; border-radius: 50% !important; font-size: 15px !important; cursor: pointer !important; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12) !important; transition: all 0.2s ease !important; } #detail .p_top .s_image .detail-zoom-btn:hover { background: #ed1c26 !important; color: #ffffff !important; border-color: #ed1c26 !important; } #detail .p_top .s_image .bx-wrapper .bx-controls-direction a { width: 30px !important; height: 30px !important; margin-top: -15px !important; background: rgba(255, 255, 255, 0.9) !important; border: 1px solid #cbd5e1 !important; border-radius: 50% !important; text-indent: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; font-size: 0 !important; } #detail .p_top .s_image .slider_imgthumb { display: block !important; float: none !important; clear: both !important; width: 100% !important; margin: 10px 0 0 0 !important; padding: 0 !important; text-align: left !important; } #detail .p_top .s_image .slider_imgthumb #bx-pager { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; justify-content: flex-start !important; gap: 8px !important; width: 100% !important; } #detail .p_top .s_image .slider_imgthumb a { display: block !important; float: none !important; flex: 0 0 auto !important; width: 64px !important; height: 64px !important; border-radius: 0 !important; overflow: hidden !important; border: 1px solid #e2e8f0 !important; background: #ffffff !important; margin: 0 !important; opacity: 0.75 !important; transition: all 0.2s ease !important; } #detail .p_top .s_image .slider_imgthumb a img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; } #detail .p_top .s_image .slider_imgthumb a.active, #detail .p_top .s_image .slider_imgthumb a:hover { border: 2px solid #ed1c26 !important; opacity: 1 !important; } @media (max-width: 768px) { #detail .p_top .s_image .detail-main-image .item, #detail .p_top .s_image .detail-main-image > a { height: 300px !important; } #detail .p_top .s_image .detail-main-image img { max-height: 300px !important; } #detail .p_top .s_image .slider_imgthumb a { width: 54px !important; height: 54px !important; } } #detail .p_top .product_info { padding-left: 10px !important; } #detail .p_top .product_info h1 { font-size: 22px !important; font-weight: 700 !important; line-height: 1.35 !important; color: #1e293b !important; margin: 0 0 12px 0 !important; word-break: break-word !important; } #detail .p_top .product_info .p_price { background: #f8fafc !important; border: 1px solid transparent !important; border-image: linear-gradient(90deg, #0096cf, #ed1c26) 1 !important; border-radius: 6px !important; padding: 12px 18px !important; margin: 12px 0 16px 0 !important; display: flex !important; align-items: baseline !important; gap: 12px !important; flex-wrap: wrap !important; } @supports (background-clip: padding-box, border-box) { #detail .p_top .product_info .p_price { border-image: none !important; background: linear-gradient(#f8fafc, #f8fafc) padding-box, linear-gradient(90deg, #0096cf, #ed1c26) border-box !important; } } #detail .p_top .product_info .p_price u { text-decoration: none !important; font-size: 13px !important; color: #64748b !important; font-weight: 500 !important; } #detail .p_top .product_info .p_price .money { font-size: 26px !important; font-weight: 700 !important; color: #ed1c26 !important; line-height: 1 !important; } #detail .p_top .product_info .p_price .discounts_money { font-size: 14px !important; font-weight: 400 !important; color: #94a3b8 !important; text-decoration: line-through !important; } #detail .p_top .product_info ul { padding: 0 !important; margin: 0 0 14px 0 !important; list-style: none !important; } #detail .p_top .product_info ul li { display: flex !important; align-items: center !important; gap: 8px !important; font-size: 13px !important; line-height: 1.6 !important; color: #475569 !important; margin-bottom: 6px !important; } #detail .p_top .product_info ul li .span1 { color: #64748b !important; font-weight: 500 !important; min-width: 90px !important; } #detail .p_top .product_info ul li .span2 { color: #1e293b !important; font-weight: 600 !important; } .filter_product .label_group { border-radius: 4px; background: #ffffff !important; border: 1px solid #cbd5e1 !important; padding: 4px 12px !important; height: auto !important; line-height: 20px !important; font-size: 12px !important; transition: all 0.15s ease; } .filter_product .label_group:hover, .filter_product .label_group.active { border-color: #ed1c26 !important; color: #ed1c26 !important; background: rgba(237, 28, 38, 0.04) !important; } #detail .p_top .product_info .info_number { background: none !important; border: none !important; padding: 0 !important; margin: 12px 0 !important; box-shadow: none !important; display: flex !important; align-items: center !important; gap: 12px !important; } #detail .p_top .product_info .info_number span { font-size: 13px !important; font-weight: 600 !important; color: #475569 !important; } #detail .p_top .product_info .info_number input#pnum { width: 72px !important; height: 36px !important; text-align: center !important; border: 1px solid #cbd5e1 !important; border-radius: 0 !important; font-size: 14px !important; font-weight: 600 !important; color: #1e293b !important; background: #ffffff !important; box-shadow: none !important; } #detail .p_top .product_info .info_order { display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 10px !important; margin: 18px 0 10px 0 !important; } #detail .info_order.product-card-buttons { display: flex !important; flex-direction: row !important; align-items: center !important; gap: 6px !important; margin: 20px 0 10px 0 !important; width: auto !important; max-width: 100% !important; } #detail .info_order.product-card-buttons .btn-card-action { border-radius: 0 !important; height: 38px !important; min-height: 38px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08) !important; cursor: pointer !important; transition: all 0.2s ease !important; box-sizing: border-box !important; border: 0 !important; text-decoration: none !important; } #detail .info_order.product-card-buttons .btn-card-action.btn-add-cart { flex: 0 0 44px !important; width: 44px !important; min-width: 44px !important; max-width: 44px !important; height: 38px !important; padding: 0 !important; background: linear-gradient(90deg, #464288 0%, #006aab 50%, #0096cf 100%) !important; color: #ffffff !important; border-radius: 0 !important; } #detail .info_order.product-card-buttons .btn-card-action.btn-add-cart .cart-btn-icon { width: 18px !important; height: 18px !important; flex-shrink: 0 !important; } #detail .info_order.product-card-buttons .btn-card-action.btn-add-cart:hover { background: linear-gradient(90deg, #5751a8 0%, #007cc7 50%, #00aff2 100%) !important; color: #ffffff !important; transform: translateY(-1px) !important; box-shadow: 0 4px 10px rgba(0, 106, 171, 0.3) !important; } #detail .info_order.product-card-buttons .btn-card-action.btn-buy-now { flex: 0 0 auto !important; min-width: 140px !important; height: 38px !important; padding: 0 24px !important; background: #ed1c26 !important; color: #ffffff !important; border-radius: 0 !important; font-size: 13px !important; font-weight: 600 !important; letter-spacing: 0.4px !important; text-transform: uppercase !important; white-space: nowrap !important; } #detail .info_order.product-card-buttons .btn-card-action.btn-buy-now:hover { background: #ff2b35 !important; color: #ffffff !important; transform: translateY(-1px) !important; box-shadow: 0 4px 10px rgba(237, 28, 38, 0.3) !important; } #detail .info_order.product-card-buttons .btn-card-action.btn-card-wishlist { flex: 0 0 38px !important; width: 38px !important; min-width: 38px !important; max-width: 38px !important; height: 38px !important; padding: 0 !important; background: #ffffff !important; color: #64748b !important; border: 1px solid #cbd5e1 !important; border-radius: 0 !important; font-size: 16px !important; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04) !important; } #detail .info_order.product-card-buttons .btn-card-action.btn-card-wishlist:hover, #detail .info_order.product-card-buttons .btn-card-action.btn-card-wishlist.active, #detail .info_order.product-card-buttons .btn-card-action.btn-card-wishlist.disabled { background: #ffffff !important; color: #ed1c26 !important; border-color: #ed1c26 !important; transform: translateY(-1px) !important; } #detail .info_order.product-card-buttons .btn-card-action.btn-card-wishlist.active i:before, #detail .info_order.product-card-buttons .btn-card-action.btn-card-wishlist.disabled i:before { content: "\f004" !important; } #detail .info_order.product-card-buttons .btn-card-action.btn-disabled { background: #f1f5f9 !important; color: #94a3b8 !important; border: 1px solid #e2e8f0 !important; border-radius: 0 !important; height: 38px !important; padding: 0 20px !important; font-size: 12px !important; font-weight: 600 !important; cursor: not-allowed !important; } #detail .p_top .product_info .info_gift { background: #fff8eb !important; color: #d97706 !important; border: 1px dashed #fed7aa !important; border-radius: 6px !important; padding: 10px 14px !important; margin: 12px 0 !important; } #detail .p_content { background: #ffffff !important; border: 1px solid #e2e8f0 !important; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04) !important; padding: 24px !important; margin-bottom: 24px !important; box-sizing: border-box !important; } #detail .p_content .tabs .nav-tabs { border-bottom: 2px solid #e2e8f0 !important; margin-bottom: 20px !important; } #detail .p_content .tabs .nav-tabs > li > a { margin-right: 4px !important; } #detail .p_content .tabs .nav-tabs > li.active > a, #detail .p_content .tabs .nav-tabs > li > a:hover { color: #ed1c26 !important; border-bottom-color: #ed1c26 !important; background: transparent !important; } #detail .p_content .tab-content { font-size: 14px !important; line-height: 1.7 !important; color: #334155 !important; } #detail .p_content .s_other { margin-top: 20px !important; padding-top: 14px !important; border-top: 1px solid #f1f5f9 !important; } #detail .p_content .keywords a { display: inline-block !important; background: #f1f5f9 !important; color: #475569 !important; font-size: 12px !important; margin: 2px 4px 2px 0 !important; text-decoration: none !important; } #detail .p_content .keywords a:hover { background: #ed1c26 !important; color: #ffffff !important; } .detail-bottom-blocks { background: #ffffff !important; border: 1px solid #e2e8f0 !important; border-radius: 8px !important; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04) !important; padding: 24px !important; margin-top: 24px !important; margin-bottom: 0 !important; box-sizing: border-box !important; width: 100% !important; } .detail-related-section { background: transparent !important; border: none !important; border-radius: 0 !important; box-shadow: none !important; padding: 0 !important; margin-bottom: 0 !important; width: 100% !important; } .detail-related-section + .detail-related-section { margin-top: 30px !important; padding-top: 24px !important; border-top: 1px solid #f1f5f9 !important; } .detail-section-title { position: relative !important; border-bottom: 0 !important; padding-bottom: 12px !important; margin-bottom: 18px !important; } .detail-section-title::after { content: "" !important; position: absolute !important; left: 0 !important; bottom: 0 !important; width: 44px !important; height: 3px !important; border-radius: 2px !important; background: linear-gradient(90deg, #0096cf, #ed1c26) !important; } .detail-section-title h3 { font-size: 16px !important; font-weight: 700 !important; color: #1e293b !important; text-transform: uppercase !important; margin: 0 !important; line-height: 1.4 !important; } .detail-related-grid-wrap .detail_item { display: grid !important; grid-template-columns: repeat(5, 1fr) !important; gap: 12px !important; width: 100% !important; } .detail-related-grid-wrap .detail_item .item { background: #ffffff !important; border: 1px solid #e2e8f0 !important; border-radius: 6px !important; padding: 8px !important; display: flex !important; flex-direction: column !important; justify-content: space-between !important; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03) !important; transition: all 0.25s ease !important; box-sizing: border-box !important; position: relative !important; } .detail-related-grid-wrap .detail_item .item:hover { border-color: #cbd5e1 !important; box-shadow: 0 6px 16px rgba(0, 0, 0, 0.08) !important; transform: translateY(-2px) !important; } .detail-related-grid-wrap .detail_item .item .s_image { position: relative !important; width: 100% !important; height: 160px !important; overflow: hidden !important; background: #fafafa !important; border-radius: 4px !important; display: flex !important; align-items: center !important; justify-content: center !important; } .detail-related-grid-wrap .detail_item .item .s_image a { display: block !important; width: 100% !important; height: 100% !important; } .detail-related-grid-wrap .detail_item .item .s_image img { width: 100% !important; height: 100% !important; object-fit: cover !important; transition: transform 0.35s ease !important; } .detail-related-grid-wrap .detail_item .item:hover .s_image img { transform: scale(1.05) !important; } .detail-related-grid-wrap .detail_item .item .s_overlay { position: absolute !important; top: 4px !important; left: 4px !important; display: flex !important; flex-direction: column !important; gap: 3px !important; z-index: 2 !important; } .detail-related-grid-wrap .detail_item .item .s_overlay .label-discount { background: #ed1c26 !important; color: #ffffff !important; font-size: 10.5px !important; font-weight: 700 !important; padding: 2px 5px !important; border-radius: 2px !important; line-height: 1.2 !important; } .detail-related-grid-wrap .detail_item .item .s_overlay .label-newday { background: #10b981 !important; color: #ffffff !important; font-size: 10.5px !important; font-weight: 700 !important; padding: 2px 5px !important; border-radius: 2px !important; line-height: 1.2 !important; } .detail-related-grid-wrap .detail_item .item .s_content { display: flex !important; flex-direction: column !important; flex: 1 1 auto !important; padding-top: 6px !important; } .detail-related-grid-wrap .detail_item .item .s_content h4 { font-size: 12.5px !important; font-weight: 500 !important; line-height: 16px !important; margin: 0 0 4px 0 !important; min-height: 32px !important; max-height: 32px !important; overflow: hidden !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; } .detail-related-grid-wrap .detail_item .item .s_content h4 a { color: #1e293b !important; text-decoration: none !important; transition: color 0.2s ease !important; } .detail-related-grid-wrap .detail_item .item:hover .s_content h4 a { color: #ed1c26 !important; } .detail-related-grid-wrap .detail_item .item .s_content .p_price { margin: 2px 0 6px 0 !important; display: flex !important; align-items: baseline !important; gap: 6px !important; flex-wrap: wrap !important; } .detail-related-grid-wrap .detail_item .item .s_content .p_price .money { font-size: 13.5px !important; font-weight: 700 !important; color: #ed1c26 !important; } .detail-related-grid-wrap .detail_item .item .s_content .p_price .discounts_money { font-size: 11px !important; color: #94a3b8 !important; text-decoration: line-through !important; } .detail-related-grid-wrap .product-card-buttons { display: flex !important; flex-direction: row !important; gap: 3px !important; width: 100% !important; margin-top: 5px !important; align-items: stretch !important; box-sizing: border-box !important; } .detail-related-grid-wrap .product-card-buttons .btn-card-action { min-height: 28px !important; height: 28px !important; border-radius: 0 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; border: 0 !important; cursor: pointer !important; box-sizing: border-box !important; text-decoration: none !important; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04) !important; } .detail-related-grid-wrap .product-card-buttons .btn-card-action.btn-add-cart { flex: 0 0 30px !important; width: 30px !important; min-width: 30px !important; max-width: 30px !important; height: 28px !important; padding: 0 !important; background: linear-gradient(90deg, #464288 0%, #006aab 50%, #0096cf 100%) !important; color: #ffffff !important; border-radius: 0 !important; } .detail-related-grid-wrap .product-card-buttons .btn-card-action.btn-add-cart .cart-btn-icon { width: 14px !important; height: 14px !important; flex-shrink: 0 !important; } .detail-related-grid-wrap .product-card-buttons .btn-card-action.btn-add-cart:hover { background: linear-gradient(90deg, #5751a8 0%, #007cc7 50%, #00aff2 100%) !important; color: #ffffff !important; } .detail-related-grid-wrap .product-card-buttons .btn-card-action.btn-buy-now { flex: 1 1 auto !important; width: auto !important; min-width: 0 !important; max-width: none !important; height: 28px !important; padding: 0 4px !important; font-size: 10px !important; font-weight: 600 !important; background: #ed1c26 !important; color: #ffffff !important; border-radius: 0 !important; white-space: nowrap !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; } .detail-related-grid-wrap .product-card-buttons .btn-card-action.btn-buy-now:hover { background: #ff2b35 !important; color: #ffffff !important; } .detail-related-grid-wrap .product-card-buttons .btn-card-action.btn-card-wishlist { flex: 0 0 28px !important; width: 28px !important; min-width: 28px !important; max-width: 28px !important; height: 28px !important; padding: 0 !important; background: #ffffff !important; color: #64748b !important; border: 1px solid #cbd5e1 !important; border-radius: 0 !important; } .detail-related-grid-wrap .product-card-buttons .btn-card-action.btn-card-wishlist:hover, .detail-related-grid-wrap .product-card-buttons .btn-card-action.btn-card-wishlist.active, .detail-related-grid-wrap .product-card-buttons .btn-card-action.btn-card-wishlist.disabled { color: #ed1c26 !important; border-color: #ed1c26 !important; } .detail-related-grid-wrap .product-card-buttons .btn-card-action.btn-card-wishlist.active i:before, .detail-related-grid-wrap .product-card-buttons .btn-card-action.btn-card-wishlist.disabled i:before { content: "\f004" !important; } .detail-related-grid-wrap .detail_item .item .btn-order { width: 100% !important; background: linear-gradient(90deg, #464288 0%, #006aab 50%, #0096cf 100%) !important; color: #ffffff !important; border: none !important; border-radius: 0 !important; padding: 6px 8px !important; font-size: 11px !important; font-weight: 400 !important; text-transform: uppercase !important; cursor: pointer !important; transition: all 0.2s ease !important; } .detail-related-grid-wrap .detail_item .item .btn-order:hover { background: linear-gradient(90deg, #5751a8 0%, #007cc7 50%, #00aff2 100%) !important; box-shadow: 0 2px 6px rgba(0, 106, 171, 0.3) !important; } @media (max-width: 991px) { .detail-related-grid-wrap .detail_item { grid-template-columns: repeat(3, 1fr) !important; } } @media (max-width: 768px) { #detail { padding: 0 !important; margin: 15px auto 30px !important; border-radius: 0 !important; } #detail .p_top { padding: 14px !important; } #detail .p_content { padding: 14px !important; } .detail-related-section { padding: 14px !important; } .detail-bottom-blocks { padding: 0 !important; } .detail-related-grid-wrap .detail_item { grid-template-columns: repeat(2, 1fr) !important; gap: 8px !important; } .detail-related-grid-wrap .detail_item .item .s_image { height: 140px !important; } } #category { position: relative !important; background: rgba(255, 255, 255, 0.52) !important; backdrop-filter: blur(14px) saturate(160%) !important; -webkit-backdrop-filter: blur(14px) saturate(160%) !important; border: 1px solid rgba(255, 255, 255, 0.6) !important; border-bottom: 5px solid #e0dddd !important; box-shadow: 0 16px 38px rgba(0, 0, 0, 0.12), 0 6px 16px rgba(0, 0, 0, 0.08) !important; border-radius: 12px !important; padding: 24px 40px 30px !important; margin: 25px auto 40px !important; box-sizing: border-box !important; width: 100% !important; } #category .c_header { position: relative !important; width: 100% !important; margin: 0 0 20px 0 !important; padding: 0 0 12px 0 !important; border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important; box-sizing: border-box !important; } #category .c_header h1 { margin: 0 0 10px 0 !important; } #category .banner_image { margin: 0 0 20px 0 !important; border-radius: 8px !important; overflow: hidden !important; } #category .banner_image img { border-radius: 8px !important; } #category .c_header .category-top-row { display: flex !important; align-items: center !important; justify-content: space-between !important; flex-wrap: wrap !important; gap: 12px !important; margin: 0 !important; padding: 0 !important; width: 100% !important; box-sizing: border-box !important; } #category .c_header .category-top-row::before, #category .c_header .category-top-row::after, #category .c_header .category-top-row .clearfix { display: none !important; width: 0 !important; height: 0 !important; margin: 0 !important; padding: 0 !important; border: none !important; float: none !important; content: none !important; } #category .c_header .category-header-left { display: flex !important; align-items: center !important; flex: 0 1 auto !important; width: auto !important; max-width: none !important; margin: 0 !important; padding: 0 !important; float: none !important; box-sizing: border-box !important; } #category .category-title-box { display: flex !important; align-items: center !important; margin: 0 !important; padding: 0 !important; } #category .category-title-box .category-name { margin: 0 !important; display: inline-block !important; font-size: 26px !important; line-height: 1.2 !important; } #category .c_header .category-header-right { display: flex !important; align-items: center !important; justify-content: flex-end !important; flex: 1 1 auto !important; width: auto !important; max-width: 100% !important; margin: 0 0 0 auto !important; padding: 0 !important; float: none !important; box-sizing: border-box !important; } #category .category-sort-toolbar { display: inline-flex !important; align-items: center !important; justify-content: flex-end !important; flex-wrap: wrap !important; gap: 10px !important; background: transparent !important; border: none !important; border-radius: 0 !important; padding: 0 !important; box-shadow: none !important; margin: 0 0 0 auto !important; box-sizing: border-box !important; } #category .sort-toolbar-count { display: inline-flex !important; align-items: center !important; padding-right: 10px !important; border-right: 1px solid #e2e8f0 !important; } #category .sort-toolbar-count .category-product-count, #category .category-product-count { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 4px !important; height: 34px !important; padding: 0 !important; background: transparent !important; border: none !important; border-radius: 0 !important; color: #475569 !important; font-size: 13.5px !important; font-weight: 500 !important; line-height: 1 !important; box-shadow: none !important; white-space: nowrap !important; cursor: default !important; } #category .sort-toolbar-count .category-product-count strong, #category .category-product-count strong { font-weight: 700 !important; color: #0f172a !important; } #category .sort-toolbar-label { font-size: 13px !important; font-weight: 600 !important; color: #475569 !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; white-space: nowrap !important; margin-right: 2px !important; } #category .sort-toolbar-pills { display: inline-flex !important; align-items: center !important; flex-wrap: wrap !important; gap: 6px !important; flex: 1 1 auto !important; } #category .btn-sort-pill { display: inline-flex !important; align-items: center !important; justify-content: center !important; vertical-align: middle !important; gap: 6px !important; height: 34px !important; padding: 0 14px !important; background: #ffffff !important; border: 1px solid #cbd5e1 !important; border-radius: 0 !important; color: #334155 !important; font-size: 13px !important; font-weight: 500 !important; line-height: 1 !important; cursor: pointer !important; transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04) !important; white-space: nowrap !important; outline: none !important; } #category .btn-sort-pill span { display: inline-flex !important; align-items: center !important; line-height: 1 !important; } #category .btn-sort-pill i, #category .btn-sort-pill svg.sort-icon-svg { display: inline-flex !important; align-items: center !important; justify-content: center !important; line-height: 1 !important; font-size: 13px !important; width: 13px !important; height: 13px !important; fill: currentColor !important; vertical-align: middle !important; flex-shrink: 0 !important; } #category .btn-sort-pill:hover { background: #f8fafc !important; border-color: #006aab !important; color: #006aab !important; transform: translateY(-1px) !important; } #category .btn-sort-pill.active { background: #ed1c26 !important; border-color: #ed1c26 !important; color: #ffffff !important; font-weight: 600 !important; box-shadow: 0 3px 8px rgba(237, 28, 38, 0.3) !important; } #category .btn-sort-pill.active i, #category .btn-sort-pill.active svg.sort-icon-svg { color: #ffffff !important; fill: #ffffff !important; } #category .btn-sort-pill .star-icon { display: inline-flex !important; align-items: center !important; justify-content: center !important; line-height: 1 !important; font-size: 13px !important; position: relative !important; top: -1px !important; color: #94a3b8 !important; background: transparent !important; } #category .btn-sort-pill.active .star-icon { color: #ffffff !important; } #category .btn-sort-pill.active .star-icon:before { content: "\f005" !important; } #category .sort-toolbar-views { margin-left: 6px !important; margin-right: 0 !important; padding: 0 !important; display: inline-flex !important; align-items: center !important; } #category .viewtype-switch-group { display: inline-flex !important; align-items: center !important; gap: 5px !important; padding-left: 0 !important; padding-right: 0 !important; margin: 0 !important; border-left: none !important; } #category .btn-viewtype-icon { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 34px !important; height: 34px !important; padding: 0 !important; margin: 0 !important; background: #ffffff !important; border: 1px solid #cbd5e1 !important; border-radius: 0 !important; color: #64748b !important; font-size: 15px !important; line-height: 1 !important; cursor: pointer !important; outline: none !important; transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1) !important; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04) !important; } #category .btn-viewtype-icon:last-child { margin-right: 0 !important; } #category .btn-viewtype-icon:hover { color: #006aab !important; border-color: #006aab !important; background: #f8fafc !important; transform: translateY(-1px); } #category .btn-viewtype-icon.active { background: #ed1c26 !important; border-color: #ed1c26 !important; color: #ffffff !important; box-shadow: 0 3px 8px rgba(237, 28, 38, 0.3) !important; } #category .btn-viewtype-icon.active i { color: #ffffff !important; } #category .category-description-wrap { margin-top: 14px !important; padding-top: 12px !important; border-top: 1px dashed #e2e8f0 !important; color: #475569 !important; font-size: 13.5px !important; line-height: 1.6 !important; } #category .c_header .form-group.form-inline { background: rgba(255, 255, 255, 0.92); border: 1px solid #e8e8e8; border-radius: 6px; padding: 8px 12px; margin-top: 15px; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04); } #category .c_header .form-group select.form-control { border-radius: 4px; border-color: #dcdcdc; margin-left: 6px; } .category-pagination-wrap { display: flex !important; justify-content: center !important; align-items: center !important; width: 100% !important; margin: 35px 0 25px !important; padding: 0 !important; clear: both !important; } .category-pagination-wrap .pagination { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 6px !important; margin: 0 !important; padding: 0 !important; list-style: none !important; } .category-pagination-wrap .pagination > li { display: inline-block !important; margin: 0 !important; padding: 0 !important; float: none !important; } .category-pagination-wrap .pagination > li > a, .category-pagination-wrap .pagination > li > span { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-width: 38px !important; height: 38px !important; padding: 0 12px !important; border-radius: 4px !important; font-size: 13.5px !important; font-weight: 500 !important; color: #334155 !important; background: #ffffff !important; border: 1px solid #e2e8f0 !important; transition: all 0.2s ease !important; text-decoration: none !important; float: none !important; margin: 0 !important; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04) !important; } .category-pagination-wrap .pagination > li > a:hover { background: #f1f5f9 !important; border-color: #cbd5e1 !important; color: #006aab !important; transform: translateY(-1px); } .category-pagination-wrap .pagination > li.active > a, .category-pagination-wrap .pagination > li.active > span { background: #ed1c26 !important; border-color: #ed1c26 !important; color: #ffffff !important; font-weight: 600 !important; box-shadow: 0 3px 8px rgba(237, 28, 38, 0.3) !important; cursor: default !important; } .category-pagination-wrap .pagination > li.disabled > a, .category-pagination-wrap .pagination > li.disabled > span { background: #f8fafc !important; border-color: #e2e8f0 !important; color: #cbd5e1 !important; cursor: not-allowed !important; opacity: 0.6 !important; pointer-events: none !important; } #category .grid_item { position: relative !important; width: 100% !important; max-width: 100% !important; margin: 0 0 20px 0 !important; padding: 0 !important; box-sizing: border-box !important; clear: both !important; } #category .grid_item > .row { display: flex !important; flex-wrap: wrap !important; margin-left: -5px !important; margin-right: -5px !important; padding: 0 !important; box-sizing: border-box !important; } #category .grid_item > .row::before, #category .grid_item > .row::after { display: none !important; } #category .grid_item > .row > [class*="col-"] { display: flex !important; flex-direction: column !important; width: 20% !important; flex: 0 0 20% !important; max-width: 20% !important; padding-left: 5px !important; padding-right: 5px !important; margin-bottom: 12px !important; box-sizing: border-box !important; float: none !important; } #category .grid_item .item { display: flex !important; flex-direction: column !important; height: 100% !important; width: 100% !important; margin: 0 !important; background: #ffffff !important; border: 1px solid #cbd5e1 !important; border-radius: 4px !important; position: relative !important; transition: all 0.25s cubic-bezier(0.165, 0.84, 0.44, 1) !important; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.09), 0 1px 3px rgba(0, 0, 0, 0.06) !important; overflow: hidden !important; box-sizing: border-box !important; } #category .grid_item .item:hover { border-color: #94a3b8 !important; box-shadow: 0 14px 28px -4px rgba(0, 0, 0, 0.15), 0 6px 12px -2px rgba(0, 0, 0, 0.08) !important; transform: translateY(-3px); } #category .grid_item .item .s_image { position: relative !important; width: 100% !important; height: 148px !important; flex: 0 0 148px !important; display: block !important; overflow: hidden !important; background: #f8fafc !important; border-bottom: 1px solid #f1f5f9 !important; padding: 0 !important; margin: 0 !important; } #category .grid_item .item .s_image a { display: block !important; width: 100% !important; height: 100% !important; padding: 0 !important; margin: 0 !important; overflow: hidden !important; } #category .grid_item .item .s_image img { width: 100% !important; height: 100% !important; max-width: none !important; max-height: none !important; object-fit: cover !important; object-position: center !important; display: block !important; margin: 0 !important; padding: 0 !important; transition: transform 0.35s ease !important; } #category .grid_item .item:hover .s_image img { transform: scale(1.06); } #category .grid_item .item .s_image .s_overlay { position: absolute !important; top: 8px !important; right: 8px !important; display: flex !important; flex-direction: column !important; align-items: flex-end !important; gap: 4px !important; z-index: 2 !important; pointer-events: none !important; } #category .grid_item .item .s_image .s_overlay .label-discount { background: #ff424e !important; color: #ffffff !important; font-size: 11px !important; font-weight: 700 !important; padding: 2px 6px !important; border-radius: 2px !important; line-height: 1.2 !important; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) !important; } #category .grid_item .item .s_image .s_overlay .label-newday { background: #10b981 !important; color: #ffffff !important; font-size: 11px !important; font-weight: 700 !important; padding: 2px 6px !important; border-radius: 2px !important; line-height: 1.2 !important; } #category .grid_item .item .s_content { display: flex !important; flex-direction: column !important; flex: 1 1 auto !important; padding: 8px 8px 8px !important; } #category .grid_item .item .s_content .p_title, #category .grid_item .item .s_content h3, #category .grid_item .item .p_title, #category .grid_item .item h3 { font-size: 12px !important; font-weight: 500 !important; line-height: 15px !important; margin: 0 0 1px 0 !important; padding: 0 !important; color: #1e293b !important; display: block !important; height: auto !important; min-height: 30px !important; max-height: none !important; overflow: visible !important; text-overflow: clip !important; white-space: normal !important; word-break: break-word !important; } #category .grid_item .item .s_content .p_title a, #category .grid_item .item .s_content h3 a, #category .grid_item .item .p_title a, #category .grid_item .item h3 a { color: #1e293b !important; text-decoration: none !important; transition: color 0.2s ease !important; display: block !important; font-size: 12px !important; line-height: 15px !important; } #category .grid_item .item .s_content:hover .p_title a, #category .grid_item .item:hover .s_content h3 a, #category .grid_item .item:hover .p_title a, #category .grid_item .item:hover h3 a { color: #ed1c26 !important; } #category .grid_item .item .shopee-card-meta { display: flex !important; align-items: center !important; margin: 0 0 2px 0 !important; padding: 0 !important; min-height: 12px !important; } #category .grid_item .item .shopee-stars { display: inline-flex !important; align-items: center !important; gap: 2px !important; font-size: 11px !important; line-height: 1 !important; } #category .grid_item .item .shopee-stars .fa-star, #category .grid_item .item .shopee-stars .fa-star-half-o, #category .grid_item .item .shopee-stars .star-filled { color: #ffbe00 !important; } #category .grid_item .item .shopee-stars .star-empty, #category .grid_item .item .shopee-stars .fa-star-o { color: #cbd5e1 !important; background: transparent !important; } #category .grid_item .item .p_bottom_area { margin-top: auto !important; display: flex !important; flex-direction: column !important; width: 100% !important; } #category .grid_item .item .p_price { display: flex !important; align-items: baseline !important; flex-wrap: wrap !important; gap: 6px !important; margin: 2px 0 0 0 !important; padding: 0 !important; min-height: 18px !important; } #category .grid_item .item .p_price .money { color: #ed1c26 !important; font-size: 13.5px !important; font-weight: 700 !important; } #category .grid_item .item .p_price .discounts_money { color: #94a3b8 !important; font-size: 11px !important; font-weight: 400 !important; text-decoration: line-through !important; } #category .grid_item .item .p_compare { margin: 1px 0 0 0 !important; font-size: 11px !important; line-height: 1.2 !important; color: #64748b !important; } #category .grid_item .item .p_compare label { font-weight: normal !important; cursor: pointer !important; margin: 0 !important; } #category .grid_item .product-card-buttons { display: flex !important; flex-direction: row !important; gap: 3px !important; width: 100% !important; margin-top: 5px !important; align-items: stretch !important; box-sizing: border-box !important; } #category .grid_item .product-card-buttons .btn-card-action { min-height: 28px !important; height: 28px !important; border-radius: 0 !important; } #category .grid_item .product-card-buttons .btn-card-action.btn-add-cart { flex: 0 0 30px !important; width: 30px !important; min-width: 30px !important; max-width: 30px !important; height: 28px !important; padding: 0 !important; background: linear-gradient(90deg, #464288 0%, #006aab 50%, #0096cf 100%) !important; color: #ffffff !important; border-radius: 0 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; } #category .grid_item .product-card-buttons .btn-card-action.btn-add-cart .cart-btn-icon { width: 14px !important; height: 14px !important; flex-shrink: 0 !important; } #category .grid_item .product-card-buttons .btn-card-action.btn-add-cart:hover { background: linear-gradient(90deg, #5751a8 0%, #007cc7 50%, #00aff2 100%) !important; color: #ffffff !important; } #category .grid_item .product-card-buttons .btn-card-action.btn-buy-now { flex: 1 1 auto !important; width: auto !important; min-width: 0 !important; max-width: none !important; height: 28px !important; padding: 0 4px !important; font-size: 10px !important; font-weight: 600 !important; background: #ed1c26 !important; color: #ffffff !important; border-radius: 0 !important; white-space: nowrap !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; } #category .grid_item .product-card-buttons .btn-card-action.btn-buy-now:hover { background: #ff2b35 !important; color: #ffffff !important; } #category .grid_item .product-card-buttons .btn-card-action.btn-card-wishlist { flex: 0 0 28px !important; width: 28px !important; min-width: 28px !important; max-width: 28px !important; height: 28px !important; padding: 0 !important; background: #ffffff !important; color: #64748b !important; border: 1px solid #cbd5e1 !important; border-radius: 0 !important; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04) !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; cursor: pointer !important; transition: all 0.2s ease !important; } #category .grid_item .product-card-buttons .btn-card-action.btn-card-wishlist i { font-size: 12px !important; line-height: 1 !important; color: inherit !important; transition: all 0.2s ease !important; } #category .grid_item .product-card-buttons .btn-card-action.btn-card-wishlist:hover { color: #ed1c26 !important; background: #fff1f2 !important; border-color: #fca5a5 !important; transform: translateY(-1px); box-shadow: 0 4px 8px rgba(237, 28, 38, 0.15) !important; } #category .grid_item .product-card-buttons .btn-card-action.btn-card-wishlist.active, #category .grid_item .product-card-buttons .btn-card-action.btn-card-wishlist.disabled { color: #ed1c26 !important; background: #fff1f2 !important; border-color: #fca5a5 !important; cursor: default !important; } #category .grid_item .product-card-buttons .btn-card-action.btn-card-wishlist.active i::before, #category .grid_item .product-card-buttons .btn-card-action.btn-card-wishlist.disabled i::before { content: "\f004" !important; } #category .list_item { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 16px !important; width: 100% !important; max-width: 100% !important; box-sizing: border-box !important; margin: 0 0 20px 0 !important; } #category .list_item .item { display: flex !important; flex-direction: row !important; align-items: flex-start !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; background: #ffffff !important; border: 1px solid rgba(0, 0, 0, 0.09) !important; border-radius: 4px !important; padding: 12px !important; margin: 0 !important; gap: 14px !important; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04) !important; transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease !important; position: relative !important; box-sizing: border-box !important; height: 100% !important; overflow: hidden !important; } #category .list_item .item > .clearfix { display: none !important; } #category .list_item .item:hover { border-color: #d1d5db !important; box-shadow: 0 4px 14px rgba(0, 0, 0, 0.09) !important; transform: translateY(-2px) !important; } #category .list_item .item .s_image { position: relative !important; width: 150px !important; min-width: 150px !important; max-width: 150px !important; height: 150px !important; flex: 0 0 150px !important; border-radius: 4px !important; overflow: hidden !important; background: #fafafa !important; display: flex !important; align-items: center !important; justify-content: center !important; border: 1px solid #f0f0f0 !important; padding: 0 !important; margin: 0 !important; float: none !important; box-sizing: border-box !important; align-self: flex-start !important; } #category .list_item .item .s_image a { display: block !important; width: 100% !important; height: 100% !important; padding: 0 !important; margin: 0 !important; overflow: hidden !important; } #category .list_item .item .s_image img { width: 100% !important; height: 100% !important; max-width: none !important; max-height: none !important; object-fit: cover !important; object-position: center !important; display: block !important; margin: 0 !important; padding: 0 !important; transition: transform 0.35s ease !important; } #category .list_item .item:hover .s_image img { transform: scale(1.05) !important; } #category .list_item .item .s_image .s_overlay { position: absolute !important; top: 6px !important; left: 6px !important; right: auto !important; display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 4px !important; z-index: 2 !important; pointer-events: none !important; } #category .list_item .item .s_image .s_overlay .label-discount { background: #ed1c26 !important; color: #ffffff !important; font-size: 11px !important; font-weight: 700 !important; padding: 2px 6px !important; border-radius: 3px !important; line-height: 1.2 !important; box-shadow: 0 2px 4px rgba(237, 28, 38, 0.35) !important; } #category .list_item .item .s_image .s_overlay .label-newday { background: #10b981 !important; color: #ffffff !important; font-size: 11px !important; font-weight: 700 !important; padding: 2px 6px !important; border-radius: 3px !important; line-height: 1.2 !important; } #category .list_item .item .s_detail { flex: 1 1 auto !important; display: flex !important; flex-direction: column !important; justify-content: space-between !important; min-width: 0 !important; max-width: calc(100% - 164px) !important; height: 100% !important; align-self: stretch !important; gap: 6px !important; box-sizing: border-box !important; overflow: hidden !important; } #category .list_item .item .s_content { flex: 0 0 auto !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; padding: 0 !important; margin: 0 !important; float: none !important; display: flex !important; flex-direction: column !important; gap: 3px !important; box-sizing: border-box !important; overflow: hidden !important; } #category .list_item .item .s_content .p_title, #category .list_item .item .s_content h3 { font-size: 14px !important; font-weight: 600 !important; line-height: 1.35 !important; margin: 0 0 2px 0 !important; padding: 0 !important; color: #222222 !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; text-overflow: ellipsis !important; max-height: 38px !important; white-space: normal !important; word-break: break-word !important; overflow-wrap: break-word !important; max-width: 100% !important; min-width: 0 !important; } #category .list_item .item .s_content .p_title a, #category .list_item .item .s_content h3 a { color: #222222 !important; text-decoration: none !important; transition: color 0.2s ease !important; } #category .list_item .item:hover .s_content .p_title a, #category .list_item .item:hover .s_content h3 a { color: #ed1c26 !important; } #category .list_item .item .s_content .shopee-card-meta { display: flex !important; align-items: center !important; min-height: 14px !important; margin: 0 0 2px 0 !important; } #category .list_item .item .s_content .shopee-stars { display: inline-flex !important; align-items: center !important; gap: 2px !important; font-size: 11.5px !important; line-height: 1 !important; } #category .list_item .item .s_content .shopee-stars .fa-star, #category .list_item .item .s_content .shopee-stars .fa-star-half-o, #category .list_item .item .s_content .shopee-stars .star-filled { color: #ffbe00 !important; } #category .list_item .item .s_content .shopee-stars .star-empty, #category .list_item .item .s_content .shopee-stars .fa-star-o { color: #cbd5e1 !important; background: transparent !important; } #category .list_item .item .s_content .p_code { font-size: 11.5px !important; color: #64748b !important; margin: 0 !important; line-height: 1.3 !important; } #category .list_item .item .s_content .p_info, #category .list_item .item .s_content .p_info p { font-size: 12px !important; color: #666666 !important; line-height: 1.4 !important; margin: 0 !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; text-overflow: ellipsis !important; max-height: 34px !important; white-space: normal !important; word-break: break-word !important; overflow-wrap: break-word !important; max-width: 100% !important; min-width: 0 !important; } #category .list_item .item .s_order { flex: 0 0 auto !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; padding: 0 !important; margin: 0 !important; border-left: none !important; border-top: none !important; float: none !important; display: flex !important; flex-direction: column !important; align-items: flex-start !important; text-align: left !important; gap: 6px !important; box-sizing: border-box !important; overflow: hidden !important; } #category .list_item .item .s_order .p_price { display: flex !important; flex-direction: row !important; align-items: baseline !important; gap: 8px !important; flex-wrap: wrap !important; margin: 2px 0 2px 0 !important; width: 100% !important; } #category .list_item .item .s_order .p_price .money { color: #ed1c26 !important; font-size: 16px !important; font-weight: 700 !important; line-height: 1.2 !important; } #category .list_item .item .s_order .p_price .discounts_money { color: #8c8c8c !important; font-size: 12px !important; font-weight: 400 !important; text-decoration: line-through !important; } #category .list_item .item .s_order .s_compare { display: none !important; } #category .list_item .item .s_order .product-card-buttons { display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 6px !important; width: 100% !important; max-width: 100% !important; margin-top: 4px !important; padding: 0 !important; box-sizing: border-box !important; } #category .list_item .item .s_order .product-card-buttons .btn-card-action { display: inline-flex !important; align-items: center !important; justify-content: center !important; text-decoration: none !important; border: none !important; border-radius: 0 !important; cursor: pointer !important; font-size: 11px !important; font-weight: 300 !important; text-transform: uppercase !important; line-height: 1 !important; padding-top: 7px !important; padding-bottom: 7px !important; padding-left: 10px !important; padding-right: 10px !important; letter-spacing: 0.3px !important; transition: all 0.2s ease !important; box-sizing: border-box !important; white-space: nowrap !important; width: auto !important; max-width: 100% !important; flex: 0 0 auto !important; min-width: auto !important; min-height: 30px !important; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08) !important; } #category .list_item .item .s_order .product-card-buttons .btn-card-action span { font-weight: 300 !important; font-size: 11px !important; text-transform: uppercase !important; padding: 0 !important; margin: 0 !important; line-height: 1 !important; } #category .list_item .item .s_order .product-card-buttons .btn-card-action.btn-add-cart { background: linear-gradient(90deg, #464288 0%, #006aab 50%, #0096cf 100%) !important; color: #ffffff !important; gap: 6px !important; } #category .list_item .item .s_order .product-card-buttons .btn-card-action.btn-add-cart:hover { background: linear-gradient(90deg, #5751a8 0%, #007cc7 50%, #00aff2 100%) !important; color: #ffffff !important; transform: translateY(-1px) !important; box-shadow: 0 4px 8px rgba(0, 106, 171, 0.35) !important; } #category .list_item .item .s_order .product-card-buttons .btn-card-action.btn-add-cart .cart-btn-icon { width: 14px !important; height: 14px !important; color: #ffffff !important; display: inline-block !important; flex-shrink: 0 !important; vertical-align: middle !important; } #category .list_item .item .s_order .product-card-buttons .btn-card-action.btn-buy-now { background: #ed1c26 !important; color: #ffffff !important; } #category .list_item .item .s_order .product-card-buttons .btn-card-action.btn-buy-now:hover { background: #ff2b35 !important; color: #ffffff !important; transform: translateY(-1px) !important; box-shadow: 0 4px 8px rgba(237, 28, 38, 0.35) !important; } #category .list_item .item .s_order .product-card-buttons .btn-card-action.btn-card-wishlist { width: 32px !important; min-width: 32px !important; max-width: 32px !important; height: 32px !important; min-height: 32px !important; padding: 0 !important; background: #ffffff !important; color: #64748b !important; border: 1px solid #e2e8f0 !important; border-radius: 0 !important; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; cursor: pointer !important; transition: all 0.2s ease !important; } #category .list_item .item .s_order .product-card-buttons .btn-card-action.btn-card-wishlist i { font-size: 15px !important; line-height: 1 !important; color: inherit !important; transition: all 0.2s ease !important; } #category .list_item .item .s_order .product-card-buttons .btn-card-action.btn-disabled { background: #94a3b8 !important; color: #ffffff !important; cursor: not-allowed !important; } #category .list_item .item .s_order .product-card-buttons .btn-card-action.btn-card-wishlist:hover { color: #ed1c26 !important; background: #fff1f2 !important; border-color: #fca5a5 !important; transform: translateY(-1px); box-shadow: 0 4px 8px rgba(237, 28, 38, 0.15) !important; } #category .list_item .item .s_order .product-card-buttons .btn-card-action.btn-card-wishlist.active, #category .list_item .item .s_order .product-card-buttons .btn-card-action.btn-card-wishlist.disabled { color: #ed1c26 !important; background: #fff1f2 !important; border-color: #fca5a5 !important; cursor: default !important; } #category .list_item .item .s_order .product-card-buttons .btn-card-action.btn-card-wishlist.active i::before, #category .list_item .item .s_order .product-card-buttons .btn-card-action.btn-card-wishlist.disabled i::before { content: "\f004" !important; } @media (max-width: 991px) { #category { padding: 16px 0px 22px !important; margin: 15px auto 30px !important; border-radius: 8px !important; } #category .c_header .category-top-row { flex-direction: column !important; align-items: stretch !important; gap: 12px !important; } #category .c_header .category-header-left { width: 100% !important; } #category .category-title-box { width: 100% !important; display: flex !important; flex-direction: row !important; align-items: center !important; justify-content: space-between !important; margin-bottom: 0 !important; gap: 8px !important; } #category .category-title-box .category-name { font-size: 20px !important; padding: 20px 45px 20px 15px !important; } #category .c_header .category-header-right { width: 100% !important; margin-left: 0 !important; } #category .category-sort-toolbar { display: flex !important; flex-direction: column !important; align-items: stretch !important; padding: 0 !important; background: transparent !important; border: none !important; border-radius: 0 !important; box-shadow: none !important; gap: 10px !important; width: 100% !important; } #category .sort-toolbar-count { border-right: 0 !important; padding-right: 0 !important; border-bottom: 1px dashed #e2e8f0 !important; padding-bottom: 8px !important; width: 100% !important; display: flex !important; justify-content: space-between !important; } #category .sort-toolbar-label { display: none !important; } #category .sort-toolbar-pills { display: grid !important; grid-template-columns: repeat(2, 1fr) !important; gap: 6px !important; width: 100% !important; } #category .btn-sort-pill { width: 100% !important; padding: 0 8px !important; font-size: 12px !important; height: 34px !important; } #category .sort-toolbar-views { margin-left: 0 !important; width: 100% !important; justify-content: flex-end !important; } #category .viewtype-switch-group { margin-left: auto !important; border-left: 0 !important; padding-left: 0 !important; } #category .grid_item > .row > [class*="col-"] { width: 50% !important; flex: 0 0 50% !important; max-width: 50% !important; } #category .grid_item .item .s_image { height: 180px !important; flex: 0 0 180px !important; } #category .grid_item .product-card-buttons { gap: 3px !important; } #category .grid_item .product-card-buttons .btn-card-action.btn-buy-now { min-width: 60px !important; padding: 8px 4px !important; } #category .list_item { grid-template-columns: 1fr !important; gap: 12px !important; } #category .list_item .item { padding: 10px !important; gap: 10px !important; } #category .list_item .item .s_detail { max-width: calc(100% - 120px) !important; min-width: 0 !important; overflow: hidden !important; } #category .list_item .item .s_image { width: 105px !important; min-width: 105px !important; height: 105px !important; flex: 0 0 105px !important; margin: 0 !important; } #category .list_item .item .s_content .p_title, #category .list_item .item .s_content h3 { font-size: 13px !important; max-height: 36px !important; } #category .list_item .item .s_content .p_info, #category .list_item .item .s_content .p_info p { font-size: 11.5px !important; max-height: 32px !important; } #category .list_item .item .s_order .p_price .money { font-size: 15px !important; } #category .list_item .item .s_order .product-card-buttons { display: flex !important; width: 100% !important; gap: 6px !important; } #category .list_item .item .s_order .product-card-buttons .btn-card-action { padding-left: 8px !important; padding-right: 8px !important; padding-top: 8px !important; padding-bottom: 8px !important; font-size: 10.5px !important; flex: 1 1 auto !important; } #category .list_item .item .s_order .product-card-buttons .btn-card-action.btn-card-wishlist { flex: 0 0 32px !important; min-width: 32px !important; } } #cart .step_bar a span.step_current, #cart .shipping .s_header { background-color: var(--tl-shopee-primary) !important; } #cart .ctotal { border-color: var(--tl-shopee-primary) !important; border-radius: 6px; } #total, #cart .coupons_reduce_money span { color: var(--tl-shopee-primary) !important; } .msgshow { background: var(--tl-shopee-primary) !important; color: var(--tl-shopee-white) !important; box-shadow: 0 -2px 12px rgba(237, 28, 38, 0.3); } @media (max-width: 991px) { #category .grid_item > .row > [class*="col-"] { width: 33.333333% !important; flex: 0 0 33.333333% !important; max-width: 33.333333% !important; } .header-middle-container { flex-wrap: wrap !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; } .topbar-left { margin-left: 0 !important; } header .logo { order: 1 !important; flex: 0 0 auto !important; margin-top: 0 !important; margin-bottom: 0 !important; } header .header-cart-area { order: 2 !important; flex: 0 0 auto !important; margin-bottom: 0 !important; width: auto !important; } .headtop-search-area { order: 3 !important; width: 100% !important; max-width: 100% !important; } .shopee-searchbar-hints { overflow-x: auto !important; } .produc_showsearch { flex-direction: column !important; align-items: stretch !important; gap: 10px !important; } #search_form_shops { flex: 1 1 auto !important; max-width: 100% !important; } .produc_showsearch .help_input { justify-content: center !important; } } @media (max-width: 767px) { header .topbar { display: none !important; } .header-middle-container { padding-top: 8px !important; padding-bottom: 8px !important; } header .logo { float: none !important; text-align: left !important; width: auto !important; margin: 0 !important; } header .logo img { width: 68px !important; height: 68px !important; margin: 0 !important; } header .header-cart-area { margin-bottom: 0 !important; width: auto !important; } header .mainmenu { min-height: 48px !important; } header .mainmenu .sleft { width: 100% !important; float: none !important; } header .mainmenu .sright { display: none !important; } } @media (max-width: 480px) { .product-card-buttons { flex-direction: column !important; gap: 6px !important; } .btn-card-action, .btn-card-action.btn-add-cart, .btn-card-action.btn-buy-now { flex: 1 1 auto !important; width: 100% !important; max-width: 100% !important; padding: 8px 10px !important; font-size: 12px !important; } } section .breadcrumbs-wrap, .breadcrumbs-wrap { position: relative !important; width: 100% !important; padding: 0 !important; margin: 0 !important; background: none !important; background-color: transparent !important; border: none !important; border-top: none !important; border-bottom: none !important; box-shadow: none !important; text-align: center !important; } section .breadcrumbs-wrap .container, .breadcrumbs-wrap .container { display: flex !important; justify-content: center !important; align-items: center !important; text-align: center !important; padding: 0 !important; margin: 0 auto !important; } section .breadcrumbs-wrap .breadcrumbs, .breadcrumbs-wrap .breadcrumbs { display: inline-flex !important; flex-wrap: wrap !important; justify-content: center !important; align-items: center !important; gap: 6px !important; margin: 0 auto !important; padding: 0 !important; list-style: none !important; width: auto !important; overflow: visible !important; } section .breadcrumbs-wrap .breadcrumbs li, .breadcrumbs-wrap .breadcrumbs li { display: inline-flex !important; align-items: center !important; gap: 6px !important; padding: 0 !important; margin: 0 !important; float: none !important; background: none !important; background-image: none !important; font-size: 13px !important; line-height: 1.4 !important; font-style: normal !important; color: #000000 !important; } section .breadcrumbs-wrap .breadcrumbs a, .breadcrumbs-wrap .breadcrumbs a { display: inline-flex !important; align-items: center !important; gap: 5px !important; color: #000000 !important; font-size: 13px !important; font-weight: 400 !important; font-style: normal !important; text-decoration: none !important; transition: color 0.2s ease, transform 0.15s ease !important; float: none !important; padding: 0 !important; } section .breadcrumbs-wrap .breadcrumbs a:hover, .breadcrumbs-wrap .breadcrumbs a:hover { color: #076aa9 !important; text-decoration: none !important; } section .breadcrumbs-wrap .breadcrumbs li:last-child, .breadcrumbs-wrap .breadcrumbs li:last-child, section .breadcrumbs-wrap .breadcrumbs li:last-child a, .breadcrumbs-wrap .breadcrumbs li:last-child a, section .breadcrumbs-wrap .breadcrumbs li:last-child span[itemprop="name"], .breadcrumbs-wrap .breadcrumbs li:last-child span[itemprop="name"] { color: #076aa9 !important; font-style: normal !important; font-weight: 600 !important; cursor: default !important; pointer-events: none !important; } .breadcrumbs-wrap .bread-sep { color: #000000 !important; font-size: 11px !important; display: inline-flex !important; align-items: center !important; margin: 0 3px !important; opacity: 0.7 !important; } @media (max-width: 767px) { section .breadcrumbs-wrap, .breadcrumbs-wrap { padding: 0 !important; margin: 0 !important; } section .breadcrumbs-wrap .breadcrumbs li, .breadcrumbs-wrap .breadcrumbs li, section .breadcrumbs-wrap .breadcrumbs a, .breadcrumbs-wrap .breadcrumbs a { font-size: 12px !important; } } #detail .p_top .s_image .detail-main-image .bx-wrapper .bx-controls-direction a { opacity: 0 !important; visibility: hidden !important; transition: opacity 0.2s ease !important; } #detail .p_top .s_image .detail-main-image:hover .bx-wrapper .bx-controls-direction a { opacity: 1 !important; visibility: visible !important; } #detail .p_top .s_image .detail-main-image .bx-wrapper .bx-controls-direction a { background-image: none !important; text-indent: 0 !important; overflow: hidden !important; color: #334155 !important; text-decoration: none !important; } #detail .p_top .s_image .detail-main-image .bx-wrapper .bx-controls-direction a:before { font-family: FontAwesome !important; font-size: 18px !important; line-height: 1 !important; color: #334155 !important; display: block !important; } #detail .p_top .s_image .detail-main-image .bx-wrapper .bx-prev:before { content: "\f104" !important; margin-right: 2px !important; } #detail .p_top .s_image .detail-main-image .bx-wrapper .bx-next:before { content: "\f105" !important; margin-left: 2px !important; } #detail .p_top .s_image .detail-main-image .bx-wrapper .bx-controls-direction a:hover { background-color: #ed1c26 !important; border-color: #ed1c26 !important; } #detail .p_top .s_image .detail-main-image .bx-wrapper .bx-controls-direction a:hover:before { color: #ffffff !important; } #detail .p_top .product_info .i_social { display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 8px !important; width: 100% !important; margin: 14px 0 0 0 !important; padding: 12px 0 0 0 !important; border: 0 !important; border-top: 1px solid #f1f5f9 !important; position: relative !important; } #detail .p_top .product_info .i_social .i_social_label { font-size: 13px !important; font-weight: 600 !important; color: #475569 !important; margin-right: 2px !important; } #detail .p_top .product_info .i_social .soc-btn { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 34px !important; height: 34px !important; border-radius: 50% !important; color: #ffffff !important; font-size: 15px !important; font-weight: 700 !important; text-decoration: none !important; transition: all 0.2s ease !important; } #detail .p_top .product_info .i_social .soc-btn:hover { transform: translateY(-2px) !important; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2) !important; } #detail .p_top .product_info .i_social .soc-btn span { font-size: 11px !important; font-weight: 700 !important; } #detail .p_top .product_info .i_social .soc-facebook { background: #1877f2 !important; } #detail .p_top .product_info .i_social .soc-messenger { background: #0084ff !important; } #detail .p_top .product_info .i_social .soc-zalo { background: #0068ff !important; } #detail .p_top .product_info .i_social .soc-twitter { background: #000000 !important; } #detail .p_top .product_info .i_social .soc-pinterest { background: #e60023 !important; } #detail .p_top .product_info .i_social .soc-copy { background: #64748b !important; } #detail .p_top .product_info .i_social .soc-copied { font-size: 12px !important; color: #16a34a !important; font-weight: 600 !important; } a, a:hover, a:focus, a:active, a:focus-visible, button, button:focus, button:active, button:focus-visible, img, img:focus, img:focus-visible, area, summary, label, [role="tab"], [role="button"], [tabindex], [tabindex]:focus, [tabindex]:focus-visible, .nav-tabs > li > a:focus, .nav-tabs > li > a:focus-visible, .nav > li > a:focus, .fancybox-thumb, .fancybox-thumb:focus, .bx-wrapper a:focus, .bx-wrapper a:focus-visible { outline: none !important; outline-offset: 0 !important; -webkit-tap-highlight-color: transparent; } a:focus, button:focus, .nav-tabs > li > a:focus, .btn:focus, .btn:active:focus { box-shadow: none; } #detail .p_top .s_image .detail-main-image, #detail .p_top .s_image .detail-main-image .bx-wrapper, #detail .p_top .s_image .detail-main-image .bx-viewport, #detail .p_top .s_image .detail-main-image .item, #detail .p_top .s_image .detail-main-image a, #detail .p_top .s_image .detail-main-image img { border-radius: 0 !important; } #detail .p_top .product_info ul li.detail-hometext { display: block !important; column-count: 1 !important; columns: auto !important; margin-bottom: 10px !important; } #detail .p_top .product_info ul li.detail-hometext .detail-hometext-content { display: block !important; width: 100% !important; font-size: 13px !important; line-height: 1.6 !important; color: #475569 !important; word-wrap: break-word !important; } #detail .p_top .product_info ul li.detail-hometext .detail-hometext-content p, #detail .p_top .product_info ul li.detail-hometext .detail-hometext-content div { display: block !important; float: none !important; width: auto !important; max-width: 100% !important; margin: 0 0 6px 0 !important; } #detail .p_top .product_info ul li.detail-hometext .detail-hometext-content p:last-child { margin-bottom: 0 !important; } body.nv-cart-open { overflow: hidden !important; } .nv-cart-overlay { position: fixed !important; inset: 0 !important; z-index: 100000 !important; background: rgba(15, 23, 42, 0.45) !important; -webkit-backdrop-filter: blur(5px) !important; backdrop-filter: blur(5px) !important; opacity: 0 !important; visibility: hidden !important; transition: opacity 0.3s ease, visibility 0.3s ease !important; } .nv-cart-overlay.is-open { opacity: 1 !important; visibility: visible !important; } .nv-cart-drawer { position: fixed !important; top: 0 !important; right: 0 !important; bottom: 0 !important; z-index: 100001 !important; width: 440px !important; max-width: 100% !important; display: flex !important; flex-direction: column !important; background: #ffffff !important; box-shadow: -12px 0 40px rgba(15, 23, 42, 0.22) !important; transform: translateX(105%) !important; visibility: hidden !important; transition: transform 0.35s cubic-bezier(0.22, 0.8, 0.25, 1), visibility 0.35s ease !important; font-family: inherit !important; box-sizing: border-box !important; } .nv-cart-drawer.is-open { transform: translateX(0) !important; visibility: visible !important; } .nv-cart-drawer * { box-sizing: border-box !important; } .nv-cart-head { display: flex !important; align-items: center !important; gap: 12px !important; padding: 18px 20px !important; background: #f8fafc !important; border-bottom: 1px solid #e2e8f0 !important; } .nv-cart-head-icon { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 42px !important; height: 42px !important; flex: 0 0 42px !important; background: #ffffff !important; color: #006aab !important; border: 1px solid #e2e8f0 !important; } .nv-cart-head-text { flex: 1 1 auto !important; display: flex !important; flex-direction: column !important; min-width: 0 !important; } .nv-cart-head-text strong { font-size: 16px !important; font-weight: 700 !important; color: #510f0e !important; line-height: 1.3 !important; } .nv-cart-head-text small { font-size: 12px !important; color: #006aab !important; font-weight: 600 !important; margin-top: 2px !important; } .nv-cart-close { flex: 0 0 34px !important; width: 34px !important; height: 34px !important; padding: 0 !important; background: #ffffff !important; color: #475569 !important; border: 1px solid #cbd5e1 !important; font-size: 15px !important; cursor: pointer !important; transition: all 0.2s ease !important; } .nv-cart-close:hover { background: #ed1c26 !important; border-color: #ed1c26 !important; color: #ffffff !important; } .nv-cart-body { flex: 1 1 auto !important; overflow-y: auto !important; padding: 16px 20px !important; background: #ffffff !important; } .nv-cart-item { position: relative !important; display: flex !important; align-items: flex-start !important; gap: 12px !important; padding: 12px !important; margin-bottom: 12px !important; background: #ffffff !important; border: 1px solid #e2e8f0 !important; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04) !important; } .nv-cart-thumb { flex: 0 0 64px !important; width: 64px !important; height: 64px !important; display: block !important; background: #fafafa !important; border: 1px solid #f1f5f9 !important; overflow: hidden !important; } .nv-cart-thumb img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; } .nv-cart-info { flex: 1 1 auto !important; min-width: 0 !important; padding-right: 22px !important; } .nv-cart-title { display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; font-size: 13.5px !important; font-weight: 600 !important; line-height: 1.4 !important; color: #1e293b !important; text-decoration: none !important; } .nv-cart-title:hover { color: #ed1c26 !important; } .nv-cart-meta { margin-top: 4px !important; min-height: 0 !important; } .nv-cart-code { display: inline-block !important; padding: 1px 7px !important; background: #f1f5f9 !important; color: #475569 !important; font-size: 11px !important; font-weight: 600 !important; } .nv-cart-line { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 10px !important; margin-top: 8px !important; } .nv-cart-price { display: flex !important; flex-direction: column !important; line-height: 1.3 !important; } .nv-cart-price strong { font-size: 15px !important; font-weight: 700 !important; color: #ed1c26 !important; } .nv-cart-price del { font-size: 11.5px !important; color: #94a3b8 !important; } .nv-cart-qty { display: inline-flex !important; align-items: center !important; border: 1px solid #cbd5e1 !important; background: #ffffff !important; flex: 0 0 auto !important; } .nv-cart-qty button { width: 28px !important; height: 28px !important; padding: 0 !important; background: #ffffff !important; border: 0 !important; color: #475569 !important; font-size: 15px !important; line-height: 1 !important; cursor: pointer !important; transition: all 0.15s ease !important; } .nv-cart-qty button:hover { background: #006aab !important; color: #ffffff !important; } .nv-cart-qty .nv-qty-val { min-width: 30px !important; text-align: center !important; font-size: 13px !important; font-weight: 600 !important; color: #1e293b !important; } .nv-cart-remove { position: absolute !important; top: 8px !important; right: 8px !important; width: 24px !important; height: 24px !important; padding: 0 !important; background: transparent !important; border: 0 !important; color: #94a3b8 !important; font-size: 15px !important; cursor: pointer !important; transition: color 0.2s ease !important; } .nv-cart-remove:hover { color: #ed1c26 !important; } .nv-cart-empty { display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; gap: 10px !important; height: 100% !important; min-height: 220px !important; color: #94a3b8 !important; text-align: center !important; } .nv-cart-empty i { font-size: 44px !important; } .nv-cart-empty p { margin: 0 !important; font-size: 14px !important; } .nv-cart-foot { flex: 0 0 auto !important; padding: 16px 20px 20px !important; background: #f8fafc !important; border-top: 1px solid #e2e8f0 !important; } .nv-cart-total { display: flex !important; align-items: baseline !important; justify-content: space-between !important; gap: 10px !important; margin-bottom: 14px !important; } .nv-cart-total span { font-size: 13px !important; font-weight: 600 !important; color: #475569 !important; } .nv-cart-total strong { font-size: 21px !important; font-weight: 700 !important; color: #ed1c26 !important; } .nv-cart-actions { display: flex !important; gap: 8px !important; } .nv-cart-btn { flex: 1 1 0 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; height: 42px !important; padding: 0 14px !important; border: 0 !important; border-radius: 0 !important; font-size: 12.5px !important; font-weight: 600 !important; letter-spacing: 0.3px !important; text-transform: uppercase !important; text-decoration: none !important; white-space: nowrap !important; cursor: pointer !important; transition: all 0.2s ease !important; } .nv-cart-continue { background: #ffffff !important; color: #334155 !important; border: 1px solid #cbd5e1 !important; } .nv-cart-continue:hover { background: #f1f5f9 !important; color: #1e293b !important; } .nv-cart-checkout { background: linear-gradient(90deg, #464288 0%, #006aab 50%, #0096cf 100%) !important; color: #ffffff !important; } .nv-cart-checkout:hover { background: linear-gradient(90deg, #5751a8 0%, #007cc7 50%, #00aff2 100%) !important; color: #ffffff !important; box-shadow: 0 4px 10px rgba(0, 106, 171, 0.3) !important; } .nv-cart-foot.is-empty .nv-cart-checkout { display: none !important; } .nv-cart-foot.is-empty .nv-cart-total { display: none !important; } @media (max-width: 480px) { .nv-cart-drawer { width: 100% !important; } .nv-cart-head, .nv-cart-body, .nv-cart-foot { padding-left: 14px !important; padding-right: 14px !important; } } #cart.cart-page { margin: 20px auto 40px !important; } #cart.cart-page .step_bar { margin-bottom: 18px !important; } #cart.cart-page .error_nummber, #cart.cart-page .edit_order { margin-bottom: 14px !important; } #cart.cart-page .cart-card, #cart.cart-page .cart-summary { background: #ffffff !important; border: 1px solid #e2e8f0 !important; border-radius: 8px !important; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04) !important; box-sizing: border-box !important; } #cart.cart-page .cart-card { padding: 20px 22px !important; margin-bottom: 20px !important; } #cart.cart-page .cart-card-head { display: flex !important; align-items: baseline !important; justify-content: space-between !important; gap: 10px !important; padding-bottom: 12px !important; margin-bottom: 8px !important; border-bottom: 2px solid #ed1c26 !important; } #cart.cart-page .cart-card-head h2 { margin: 0 !important; font-size: 17px !important; font-weight: 700 !important; text-transform: uppercase !important; color: #1e293b !important; } #cart.cart-page .cart-count { font-size: 13px !important; font-weight: 600 !important; color: #006aab !important; } #cart.cart-page .table-responsive { border: 0 !important; margin: 0 !important; } #cart.cart-page table.cart-table { width: 100% !important; border-collapse: collapse !important; margin: 0 !important; background: transparent !important; } #cart.cart-page table.cart-table thead th { padding: 10px 8px !important; font-size: 12px !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: 0.3px !important; color: #64748b !important; background: transparent !important; border: 0 !important; border-bottom: 1px solid #e2e8f0 !important; white-space: nowrap !important; } #cart.cart-page table.cart-table tbody td { padding: 14px 8px !important; vertical-align: middle !important; background: transparent !important; border: 0 !important; border-bottom: 1px solid #f1f5f9 !important; font-size: 13.5px !important; color: #334155 !important; } #cart.cart-page table.cart-table tbody tr:last-child td { border-bottom: 0 !important; } #cart.cart-page .cart-col-product { display: table-cell !important; min-width: 260px !important; } #cart.cart-page .cart-prod { display: flex !important; align-items: center !important; gap: 12px !important; } #cart.cart-page .cart-prod-img { flex: 0 0 72px !important; width: 72px !important; height: 72px !important; display: block !important; background: #fafafa !important; border: 1px solid #f1f5f9 !important; overflow: hidden !important; } #cart.cart-page .cart-prod-img img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; } #cart.cart-page .cart-prod-info { min-width: 0 !important; } #cart.cart-page .cart-prod-title { display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; font-size: 14px !important; font-weight: 600 !important; line-height: 1.4 !important; color: #1e293b !important; text-decoration: none !important; } #cart.cart-page .cart-prod-title:hover { color: #ed1c26 !important; } #cart.cart-page .cart-prod-attrs { display: flex !important; flex-wrap: wrap !important; gap: 4px 6px !important; margin-top: 5px !important; } #cart.cart-page .cart-prod-attr { display: inline-block !important; padding: 1px 8px !important; background: #f1f5f9 !important; color: #64748b !important; font-size: 11.5px !important; line-height: 1.6 !important; } #cart.cart-page .cart-prod-attr a { color: #64748b !important; text-decoration: none !important; } #cart.cart-page .cart-col-price, #cart.cart-page .cart-col-total { white-space: nowrap !important; } #cart.cart-page .cart-unit-price { color: #334155 !important; font-weight: 500 !important; } #cart.cart-page .cart-line-total { color: #ed1c26 !important; font-size: 15px !important; font-weight: 700 !important; } #cart.cart-page .money small { font-size: 11px !important; color: #94a3b8 !important; } #cart.cart-page .cart-col-qty { width: 130px !important; text-align: center !important; } #cart.cart-page .cart-qty { display: inline-flex !important; align-items: center !important; border: 1px solid #cbd5e1 !important; background: #ffffff !important; } #cart.cart-page .cart-qty button { width: 30px !important; height: 32px !important; padding: 0 !important; background: #ffffff !important; border: 0 !important; color: #475569 !important; font-size: 16px !important; line-height: 1 !important; cursor: pointer !important; transition: all 0.15s ease !important; } #cart.cart-page .cart-qty button:hover { background: #006aab !important; color: #ffffff !important; } #cart.cart-page .cart-qty input.cart-qty-input { width: 46px !important; height: 32px !important; padding: 0 !important; text-align: center !important; border: 0 !important; border-left: 1px solid #e2e8f0 !important; border-right: 1px solid #e2e8f0 !important; border-radius: 0 !important; box-shadow: none !important; background: #ffffff !important; font-size: 14px !important; font-weight: 600 !important; color: #1e293b !important; -moz-appearance: textfield; } #cart.cart-page .cart-qty input.cart-qty-input::-webkit-outer-spin-button, #cart.cart-page .cart-qty input.cart-qty-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } #cart.cart-page .cart-qty-unit { display: block !important; margin-top: 3px !important; font-size: 11px !important; color: #94a3b8 !important; } #cart.cart-page .cart-col-remove { width: 40px !important; } #cart.cart-page a.remove_cart { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 30px !important; height: 30px !important; color: #94a3b8 !important; font-size: 17px !important; text-decoration: none !important; transition: color 0.2s ease !important; } #cart.cart-page a.remove_cart:hover { color: #ed1c26 !important; } #cart.cart-page .cart-summary { padding: 20px 22px !important; margin-bottom: 20px !important; } #cart.cart-page .cart-summary-title { margin: 0 0 14px 0 !important; padding-bottom: 12px !important; border-bottom: 2px solid #ed1c26 !important; font-size: 16px !important; font-weight: 700 !important; text-transform: uppercase !important; color: #1e293b !important; } #cart.cart-page .cart-summary .point_note, #cart.cart-page .cart-summary .showpoint, #cart.cart-page .cart-summary .coupons_reduce_money { margin: 0 0 12px 0 !important; padding: 9px 12px !important; background: #f8fafc !important; border: 1px dashed #cbd5e1 !important; border-radius: 0 !important; font-size: 12.5px !important; line-height: 1.5 !important; color: #475569 !important; } #cart.cart-page .cart-point-row { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 10px !important; } #cart.cart-page .cart-summary .ccoupons { margin: 0 0 14px 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; } #cart.cart-page .cart-summary .ccoupons label { display: block !important; margin-bottom: 6px !important; font-size: 13px !important; font-weight: 600 !important; color: #475569 !important; } #cart.cart-page .cart-summary .ccoupons .input-group { display: flex !important; width: 100% !important; } #cart.cart-page .cart-summary .ccoupons .form-control { flex: 1 1 auto !important; height: 40px !important; border-radius: 0 !important; box-shadow: none !important; border: 1px solid #cbd5e1 !important; } #cart.cart-page .cart-summary .ccoupons .input-group-btn { width: auto !important; display: block !important; } #cart.cart-page .cart-summary #coupons_info { font-size: 12px !important; margin-top: 4px !important; } #cart.cart-page .cart-total-row { display: flex !important; align-items: baseline !important; justify-content: space-between !important; gap: 10px !important; margin: 6px 0 4px 0 !important; padding: 14px 0 !important; border-top: 1px solid #e2e8f0 !important; } #cart.cart-page .cart-total-label { font-size: 14px !important; font-weight: 600 !important; color: #475569 !important; } #cart.cart-page .cart-total-value strong, #cart.cart-page #total { font-size: 22px !important; font-weight: 700 !important; color: #ed1c26 !important; } #cart.cart-page .cart-total-value small { font-size: 12px !important; color: #94a3b8 !important; } #cart.cart-page .cart-unit-note { display: block !important; margin: -6px 0 10px 0 !important; font-size: 11.5px !important; color: #94a3b8 !important; text-align: right !important; } #cart.cart-page .cart-actions { display: flex !important; flex-direction: column !important; gap: 8px !important; margin: 6px 0 0 0 !important; padding: 0 !important; } #cart.cart-page .cart-btn { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; height: 44px !important; padding: 0 16px !important; border: 0 !important; border-radius: 0 !important; font-size: 13px !important; font-weight: 600 !important; letter-spacing: 0.3px !important; text-transform: uppercase !important; cursor: pointer !important; box-shadow: none !important; transition: all 0.2s ease !important; } #cart.cart-page .cart-btn-primary { background: #ed1c26 !important; color: #ffffff !important; } #cart.cart-page .cart-btn-primary:hover { background: #ff2b35 !important; box-shadow: 0 4px 10px rgba(237, 28, 38, 0.3) !important; } #cart.cart-page .cart-btn-light { background: #ffffff !important; color: #334155 !important; border: 1px solid #cbd5e1 !important; } #cart.cart-page .cart-btn-light:hover { background: #f1f5f9 !important; } #cart.cart-page .cart-btn-dark { width: auto !important; height: 40px !important; background: linear-gradient(90deg, #464288 0%, #006aab 50%, #0096cf 100%) !important; color: #ffffff !important; } #cart.cart-page .cart-back-link { display: block !important; margin-top: 4px !important; text-align: center !important; font-size: 13px !important; font-weight: 600 !important; color: #006aab !important; text-decoration: none !important; } #cart.cart-page .cart-back-link:hover { color: #ed1c26 !important; } @media (min-width: 1200px) { #cart.cart-page .cart-summary { position: sticky !important; top: 16px !important; } } @media (max-width: 767px) { #cart.cart-page .cart-card, #cart.cart-page .cart-summary { padding: 14px !important; } #cart.cart-page table.cart-table thead { display: none !important; } #cart.cart-page table.cart-table, #cart.cart-page table.cart-table tbody { display: block !important; width: 100% !important; } #cart.cart-page table.cart-table tbody tr { display: grid !important; grid-template-columns: 1fr auto !important; gap: 8px 10px !important; padding: 12px 0 !important; border-bottom: 1px solid #f1f5f9 !important; position: relative !important; } #cart.cart-page table.cart-table tbody td { display: flex !important; align-items: center !important; justify-content: space-between !important; padding: 0 !important; border: 0 !important; width: auto !important; min-width: 0 !important; } #cart.cart-page table.cart-table tbody td.cart-col-product { grid-column: 1 / -1 !important; justify-content: flex-start !important; padding-right: 34px !important; } #cart.cart-page table.cart-table tbody td[data-label]:before { content: attr(data-label) ": " !important; font-size: 12px !important; color: #94a3b8 !important; margin-right: 6px !important; } #cart.cart-page table.cart-table tbody td.cart-col-qty { justify-content: flex-start !important; gap: 8px !important; } #cart.cart-page table.cart-table tbody td.cart-col-qty:before { display: none !important; } #cart.cart-page table.cart-table tbody td.cart-col-remove { position: absolute !important; top: 10px !important; right: 0 !important; width: auto !important; } #cart.cart-page .cart-qty-unit { display: none !important; } } #cart .sorder .s_header h3 { background: linear-gradient(90deg, #464288 0%, #006aab 50%, #0096cf 100%) !important; background-color: #006aab !important; color: #ffffff !important; margin: 0 !important; padding: 14px 20px !important; font-size: 15px !important; font-weight: 700 !important; letter-spacing: 0.4px !important; text-transform: uppercase !important; border-radius: 0 !important; box-shadow: 0 2px 8px rgba(0, 106, 171, 0.25) !important; } #cart .step_bar a span:not(.step_current) { background: linear-gradient(90deg, #464288 0%, #006aab 50%, #0096cf 100%) !important; background-color: #006aab !important; color: #ffffff !important; } #cart .sorder .s_body { background: #ffffff !important; border: 1px solid #e2e8f0 !important; border-top: 0 !important; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04) !important; margin-bottom: 20px !important; } #cart .sorder .s_body label { cursor: pointer !important; font-weight: 500 !important; } #cart .sorder .s_body .pay-item { margin: 0 0 10px 0 !important; line-height: 20px !important; } #cart .sorder .s_body .pay-item label { margin: 0 !important; } #cart .order-confirm { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 20px !important; margin: 6px 0 20px 0 !important; padding: 18px 22px !important; background: #ffffff !important; border: 1px solid #e2e8f0 !important; border-left: 4px solid #ed1c26 !important; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04) !important; box-sizing: border-box !important; } #cart .order-confirm .c_check { flex: 1 1 auto !important; margin: 0 !important; padding: 0 !important; background: transparent !important; border: 0 !important; text-align: left !important; width: auto !important; } #cart .order-confirm .confirm-label { display: flex !important; align-items: flex-start !important; gap: 10px !important; margin: 0 !important; font-size: 14px !important; font-weight: 500 !important; line-height: 1.5 !important; color: #334155 !important; cursor: pointer !important; } #cart .order-confirm .confirm-label input[type="checkbox"] { flex: 0 0 20px !important; width: 20px !important; height: 20px !important; margin: 1px 0 0 0 !important; accent-color: #ed1c26; cursor: pointer !important; } #cart .order-confirm .c_check .error { display: block !important; margin: 6px 0 0 30px !important; font-size: 12.5px !important; color: #ed1c26 !important; } #cart .order-confirm .c_order { flex: 0 0 auto !important; margin: 0 !important; padding: 0 !important; width: auto !important; } #cart .order-confirm .c_order a.btn-order { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 10px !important; min-width: 260px !important; height: 54px !important; padding: 0 34px !important; background: #ed1c26 !important; color: #ffffff !important; border: 0 !important; border-radius: 0 !important; font-size: 15px !important; font-weight: 700 !important; letter-spacing: 0.6px !important; text-transform: uppercase !important; text-decoration: none !important; box-shadow: 0 6px 16px rgba(237, 28, 38, 0.35) !important; transition: all 0.2s ease !important; } #cart .order-confirm .c_order a.btn-order span { color: #ffffff !important; font-weight: 700 !important; font-size: 15px !important; text-transform: uppercase !important; } #cart .order-confirm .c_order a.btn-order i { font-size: 18px !important; } #cart .order-confirm .c_order a.btn-order:hover { background: #ff2b35 !important; transform: translateY(-2px) !important; box-shadow: 0 10px 22px rgba(237, 28, 38, 0.45) !important; } @media (max-width: 767px) { #cart .order-confirm { flex-direction: column !important; align-items: stretch !important; padding: 14px !important; gap: 14px !important; } #cart .order-confirm .c_order a.btn-order { width: 100% !important; min-width: 0 !important; } } @media (min-width: 1200px) { #cart .sorder form#fpost > .row, #cart.cart-page .cart-layout { display: flex !important; flex-wrap: wrap !important; align-items: flex-start !important; } #cart .sorder form#fpost > .row:before, #cart .sorder form#fpost > .row:after, #cart.cart-page .cart-layout:before, #cart.cart-page .cart-layout:after { display: none !important; } #cart .order-right .order-sticky { position: sticky !important; top: 16px !important; } } #cart .order-left .s_body { margin-bottom: 20px !important; } #cart .order-right .s_body { padding: 14px !important; margin-bottom: 14px !important; } #cart .order-right .order-items-scroll { max-height: 340px !important; overflow-y: auto !important; margin: 0 !important; border: 0 !important; } #cart .order-right table.order-items-table { width: 100% !important; margin: 0 !important; font-size: 12.5px !important; } #cart .order-right table.order-items-table thead th { position: sticky !important; top: 0 !important; z-index: 2 !important; padding: 8px 6px !important; background: #f8fafc !important; font-size: 11px !important; font-weight: 700 !important; text-transform: uppercase !important; color: #64748b !important; border-bottom: 1px solid #e2e8f0 !important; white-space: nowrap !important; } #cart .order-right table.order-items-table tbody td { padding: 9px 6px !important; vertical-align: middle !important; border-top: 1px solid #f1f5f9 !important; } #cart .order-right table.order-items-table tfoot td { position: sticky !important; bottom: 0 !important; z-index: 2 !important; padding: 8px 6px !important; background: #ffffff !important; border-top: 1px solid #e2e8f0 !important; } #cart .order-right table.order-items-table tfoot tr:last-child td { font-size: 15px !important; font-weight: 700 !important; color: #ed1c26 !important; } #cart .order-right table.order-items-table tfoot tr:last-child td:first-child { color: #334155 !important; } #cart .order-right .order-confirm { flex-direction: column !important; align-items: stretch !important; gap: 14px !important; margin: 0 0 20px 0 !important; padding: 16px !important; } #cart .order-right .order-confirm .c_order a.btn-order { display: flex !important; width: 100% !important; min-width: 0 !important; } #cart .sorder .acc-item { margin: 0 0 12px 0 !important; background: #ffffff !important; border: 1px solid #e2e8f0 !important; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04) !important; } #cart .sorder .acc-item .acc-head { cursor: pointer !important; user-select: none !important; } #cart .sorder .acc-item .acc-head h3 { display: flex !important; align-items: center !important; gap: 12px !important; text-align: left !important; padding: 14px 18px !important; transition: background 0.2s ease, color 0.2s ease !important; box-shadow: none !important; } #cart .sorder .acc-item:not(.is-open) .acc-head h3 { background: #ffffff !important; color: #1e293b !important; } #cart .sorder .acc-item:not(.is-open) .acc-head:hover h3 { background: #f8fafc !important; } #cart .sorder .acc-item.is-open .acc-head h3 { background: linear-gradient(90deg, #464288 0%, #006aab 50%, #0096cf 100%) !important; color: #ffffff !important; } #cart .sorder .acc-num { display: inline-flex !important; align-items: center !important; justify-content: center !important; flex: 0 0 28px !important; width: 28px !important; height: 28px !important; border-radius: 50% !important; font-size: 13px !important; font-weight: 700 !important; line-height: 1 !important; background: linear-gradient(90deg, #464288 0%, #006aab 50%, #0096cf 100%) !important; color: #ffffff !important; } #cart .sorder .acc-item.is-open .acc-num { background: #ffffff !important; color: #006aab !important; } #cart .sorder .acc-title { flex: 0 0 auto !important; font-size: 14px !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: 0.3px !important; } #cart .sorder .acc-summary { flex: 1 1 auto !important; min-width: 0 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; text-align: right !important; font-size: 12.5px !important; font-weight: 500 !important; text-transform: none !important; letter-spacing: 0 !important; color: #64748b !important; } #cart .sorder .acc-item.is-open .acc-summary { display: none !important; } #cart .sorder .acc-chevron { flex: 0 0 auto !important; margin-left: auto !important; font-size: 20px !important; transition: transform 0.25s ease !important; } #cart .sorder .acc-summary:not(:empty) + .acc-chevron { margin-left: 0 !important; } #cart .sorder .acc-item.is-open .acc-chevron { transform: rotate(180deg) !important; } #cart .sorder .acc-item .acc-body { margin: 0 !important; padding: 18px !important; border: 0 !important; border-top: 1px solid #e2e8f0 !important; box-shadow: none !important; background: #ffffff !important; } #cart .sorder .acc-next { margin-top: 14px !important; text-align: right !important; } #cart .sorder .acc-next-btn { display: inline-flex !important; align-items: center !important; gap: 8px !important; height: 40px !important; padding: 0 22px !important; border: 0 !important; border-radius: 0 !important; background: linear-gradient(90deg, #464288 0%, #006aab 50%, #0096cf 100%) !important; color: #ffffff !important; font-size: 13px !important; font-weight: 600 !important; text-transform: uppercase !important; letter-spacing: 0.3px !important; cursor: pointer !important; transition: all 0.2s ease !important; } #cart .sorder .acc-next-btn:hover { background: linear-gradient(90deg, #5751a8 0%, #007cc7 50%, #00aff2 100%) !important; box-shadow: 0 4px 10px rgba(0, 106, 171, 0.3) !important; } #cart .sorder input.is-invalid, #cart .sorder select.is-invalid { border-color: #ed1c26 !important; box-shadow: 0 0 0 1px #ed1c26 !important; } #cart .sorder .acc-body .error { color: #ed1c26 !important; font-size: 12.5px !important; } @media (max-width: 767px) { #cart .sorder .acc-summary { display: none !important; } #cart .sorder .acc-chevron { margin-left: auto !important; } #cart .sorder .acc-title { font-size: 13px !important; } } #cart .order-items-table .money-unit { font-size: 11px !important; font-weight: 500 !important; color: #94a3b8 !important; } #cart .order-items-table tfoot tr:last-child td .money-unit { color: #ed1c26 !important; font-size: 12px !important; } #cart .order-items-table td.order-col-name a { color: #1e293b !important; text-decoration: none !important; line-height: 1.4 !important; } #cart .order-items-table td.order-col-name a:hover strong { color: #ed1c26 !important; } .home-news-compact-block { margin: 25px 0 20px !important; padding: 18px 20px 20px !important; background: rgba(255, 255, 255, 0.78) !important; -webkit-backdrop-filter: blur(14px) saturate(180%) !important; backdrop-filter: blur(14px) saturate(180%) !important; border: 1px solid rgba(255, 255, 255, 0.85) !important; border-radius: 12px !important; box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.07), 0 2px 6px rgba(0, 0, 0, 0.03) !important; box-sizing: border-box !important; } .home-news-compact-block .home-news-head { display: flex !important; align-items: center !important; justify-content: space-between !important; padding-bottom: 12px !important; margin-bottom: 16px !important; border-bottom: 0 !important; position: relative !important; } .home-news-compact-block .home-news-head::after { content: "" !important; position: absolute !important; bottom: 0 !important; left: 0 !important; width: 44px !important; height: 3px !important; background: linear-gradient(90deg, #0096cf, #ed1c26) !important; border-radius: 2px !important; box-shadow: none !important; } .home-news-compact-block .home-news-head-title, .home-news-compact-block .home-news-text { margin: 0 !important; padding: 0 !important; font-size: 17px !important; font-weight: 700 !important; color: #000000 !important; text-transform: uppercase !important; letter-spacing: 0.3px !important; display: flex !important; align-items: center !important; gap: 10px !important; } .home-news-compact-block .home-news-icon { font-size: 21px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; background: linear-gradient(90deg, #464288 0%, #006aab 50%, #0096cf 100%) !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; background-clip: text !important; color: #006aab !important; filter: drop-shadow(0 1px 2px rgba(0, 106, 171, 0.25)) !important; } .home-news-compact-block .home-news-icon i { background: inherit !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; background-clip: text !important; } .home-news-compact-block .home-news-viewall { display: inline-flex !important; align-items: center !important; gap: 5px !important; font-size: 13px !important; color: #006aab !important; font-weight: 600 !important; text-decoration: none !important; transition: color 0.2s ease, transform 0.2s ease !important; } .home-news-compact-block .home-news-viewall:hover { color: #0096cf !important; transform: translateX(3px) !important; } .home-news-compact-block .home-news-row { display: flex !important; flex-wrap: wrap !important; margin-left: -10px !important; margin-right: -10px !important; } .home-news-compact-block .home-news-row::before, .home-news-compact-block .home-news-row::after { display: none !important; } .home-news-compact-block .home-news-col { padding-left: 10px !important; padding-right: 10px !important; margin-bottom: 0 !important; box-sizing: border-box !important; } @media (min-width: 992px) { .home-news-compact-block .home-news-col, .home-news-compact-block .home-news-col.col-md-3, .home-news-compact-block .home-news-col.col-md-6 { width: 25% !important; flex: 0 0 25% !important; max-width: 25% !important; } .home-news-compact-block .home-news-col.col-md-8 { width: 33.333333% !important; flex: 0 0 33.333333% !important; max-width: 33.333333% !important; } .home-news-compact-block .home-news-col.col-md-12 { width: 50% !important; flex: 0 0 50% !important; max-width: 50% !important; } } .home-news-compact-block .home-news-card { background: rgba(255, 255, 255, 0.88) !important; -webkit-backdrop-filter: blur(8px) !important; backdrop-filter: blur(8px) !important; border: 1px solid rgba(255, 255, 255, 0.9) !important; border-radius: 10px !important; overflow: hidden !important; display: flex !important; flex-direction: column !important; height: 100% !important; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.04) !important; transition: transform 0.25s cubic-bezier(0.165, 0.84, 0.44, 1), box-shadow 0.25s cubic-bezier(0.165, 0.84, 0.44, 1), border-color 0.25s ease, background 0.25s ease !important; } .home-news-compact-block .home-news-card:hover { background: rgba(255, 255, 255, 0.98) !important; transform: translateY(-4px) !important; box-shadow: 0 12px 28px -4px rgba(0, 106, 171, 0.16), 0 4px 12px rgba(0, 0, 0, 0.05) !important; border-color: rgba(0, 150, 207, 0.45) !important; } .home-news-compact-block .home-news-thumb { position: relative !important; display: block !important; width: 100% !important; aspect-ratio: 16 / 10 !important; min-height: 165px !important; max-height: 210px !important; overflow: hidden !important; background: #f8fafc !important; } .home-news-compact-block .home-news-thumb img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; transition: transform 0.45s cubic-bezier(0.165, 0.84, 0.44, 1) !important; } .home-news-compact-block .home-news-card:hover .home-news-thumb img { transform: scale(1.06) !important; } .home-news-compact-block .home-news-cat { display: none !important; } .home-news-compact-block .home-news-info { padding: 14px 16px 14px !important; display: flex !important; flex-direction: column !important; flex: 1 1 auto !important; background: transparent !important; } .home-news-compact-block .home-news-date { font-size: 12px !important; color: #64748b !important; display: inline-flex !important; align-items: center !important; gap: 5px !important; margin-bottom: 8px !important; font-weight: 500 !important; } .home-news-compact-block .home-news-date i { color: #94a3b8 !important; font-size: 12px !important; } .home-news-compact-block .home-news-title { margin: 0 0 8px 0 !important; padding: 0 !important; font-size: 15px !important; font-weight: 700 !important; line-height: 1.45 !important; height: auto !important; min-height: 44px !important; overflow: visible !important; display: block !important; -webkit-line-clamp: unset !important; } .home-news-compact-block .home-news-title a { color: #1e293b !important; text-decoration: none !important; transition: color 0.2s ease !important; display: block !important; } .home-news-compact-block .home-news-title a:hover { color: #006aab !important; } .home-news-compact-block .home-news-desc { margin: 0 0 12px 0 !important; padding: 0 !important; font-size: 13px !important; line-height: 1.5 !important; color: #475569 !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; } .home-news-compact-block .home-news-card-footer { margin-top: auto !important; padding-top: 10px !important; border-top: 1px dashed rgba(226, 232, 240, 0.8) !important; display: flex !important; align-items: center !important; justify-content: flex-end !important; } .home-news-compact-block .home-news-more { font-size: 12.5px !important; font-weight: 600 !important; color: #006aab !important; text-decoration: none !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; transition: gap 0.2s ease, color 0.2s ease !important; } .home-news-compact-block .home-news-more i { color: #ed1c26 !important; font-size: 14px !important; transition: transform 0.2s ease, color 0.2s ease !important; } .home-news-compact-block .home-news-card:hover .home-news-more { color: #0096cf !important; } .home-news-compact-block .home-news-card:hover .home-news-more i { color: #c92027 !important; transform: translateX(4px) !important; } @media (min-width: 768px) and (max-width: 991px) { .home-news-compact-block .home-news-col { width: 50% !important; flex: 0 0 50% !important; max-width: 50% !important; margin-bottom: 16px !important; } .home-news-compact-block .home-news-col:nth-last-child(-n+2) { margin-bottom: 0 !important; } .home-news-compact-block .home-news-thumb { min-height: 180px !important; } } @media (max-width: 767px) { .home-news-compact-block { margin: 18px 0 14px !important; padding: 14px 10px 14px !important; } .home-news-compact-block .home-news-head-title { font-size: 15px !important; } .home-news-compact-block .home-news-row { margin-left: -5px !important; margin-right: -5px !important; display: flex !important; flex-wrap: wrap !important; } .home-news-compact-block .home-news-col { padding-left: 5px !important; padding-right: 5px !important; width: 50% !important; flex: 0 0 50% !important; max-width: 50% !important; margin-bottom: 12px !important; } .home-news-compact-block .home-news-col:nth-last-child(-n+2) { margin-bottom: 0 !important; } .home-news-compact-block .home-news-card { border-radius: 8px !important; } .home-news-compact-block .home-news-thumb { min-height: unset !important; max-height: unset !important; aspect-ratio: 16 / 10 !important; border-radius: 8px 8px 0 0 !important; } .home-news-compact-block .home-news-info { padding: 10px 8px 10px !important; } .home-news-compact-block .home-news-date { font-size: 11px !important; margin-bottom: 4px !important; gap: 4px !important; } .home-news-compact-block .home-news-date i { font-size: 10.5px !important; } .home-news-compact-block .home-news-title { font-size: 13px !important; line-height: 1.35 !important; min-height: 35px !important; margin-bottom: 6px !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; } .home-news-compact-block .home-news-desc { font-size: 11.5px !important; line-height: 1.35 !important; margin-bottom: 8px !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; } .home-news-compact-block .home-news-card-footer { padding-top: 6px !important; } .home-news-compact-block .home-news-more { font-size: 11.5px !important; gap: 4px !important; } } .news-page-wrapper { position: relative !important; width: 100% !important; margin: 25px auto 40px !important; box-sizing: border-box !important; } .news-glass-container { position: relative !important; background: rgba(255, 255, 255, 0.52) !important; backdrop-filter: blur(14px) saturate(160%) !important; -webkit-backdrop-filter: blur(14px) saturate(160%) !important; border: 1px solid rgba(255, 255, 255, 0.6) !important; border-bottom: 5px solid #e0dddd !important; box-shadow: 0 16px 38px rgba(0, 0, 0, 0.12), 0 6px 16px rgba(0, 0, 0, 0.08) !important; border-radius: 12px !important; padding: 28px 36px 36px !important; box-sizing: border-box !important; width: 100% !important; } .news-page-header { position: relative !important; margin-bottom: 22px !important; padding-bottom: 14px !important; border-bottom: 0 !important; display: flex !important; justify-content: center !important; align-items: center !important; text-align: center !important; } .news-page-header::after { content: "" !important; position: absolute !important; bottom: 0 !important; left: 50% !important; transform: translateX(-50%) !important; width: 44px !important; height: 3px !important; background: linear-gradient(90deg, #0096cf, #ed1c26) !important; border-radius: 2px !important; box-shadow: none !important; } .news-page-title { margin: 0 auto !important; padding: 0 !important; font-size: 22px !important; font-weight: 700 !important; color: #000000 !important; text-transform: uppercase !important; letter-spacing: 0.3px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 12px !important; text-align: center !important; } .news-title-icon { font-size: 26px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; background: linear-gradient(90deg, #464288 0%, #006aab 50%, #0096cf 100%) !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; background-clip: text !important; color: #006aab !important; filter: drop-shadow(0 1px 2px rgba(0, 106, 171, 0.25)) !important; } .news-title-icon i { background: inherit !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; background-clip: text !important; } .news-pills-wrap { margin-bottom: 24px !important; padding-bottom: 6px !important; width: 100% !important; display: flex !important; justify-content: center !important; align-items: center !important; } .news-pills-list { display: flex !important; flex-wrap: wrap !important; gap: 10px !important; align-items: center !important; justify-content: center !important; margin: 0 auto !important; } .news-pill-btn { display: inline-flex !important; align-items: center !important; padding: 8px 20px !important; border-radius: 30px !important; font-size: 13.5px !important; font-weight: 500 !important; text-decoration: none !important; transition: all 0.25s cubic-bezier(0.165, 0.84, 0.44, 1) !important; color: #475569 !important; background: rgba(255, 255, 255, 0.85) !important; border: 1px solid #e2e8f0 !important; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important; cursor: pointer !important; } .news-pill-btn:hover { color: #006aab !important; background: #ffffff !important; border-color: #0096cf !important; transform: translateY(-2px) !important; box-shadow: 0 4px 10px rgba(0, 106, 171, 0.16) !important; text-decoration: none !important; } .news-pill-btn.active { color: #ffffff !important; background: linear-gradient(90deg, #464288 0%, #006aab 50%, #0096cf 100%) !important; border-color: transparent !important; box-shadow: 0 4px 12px rgba(0, 106, 171, 0.35) !important; font-weight: 600 !important; } .news-cat-description { display: none !important; } .news-grid-row { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 22px !important; width: 100% !important; margin-bottom: 30px !important; box-sizing: border-box !important; } .news-grid-col { min-width: 0 !important; width: 100% !important; box-sizing: border-box !important; } .news-modern-card { background: rgba(255, 255, 255, 0.92) !important; -webkit-backdrop-filter: blur(8px) !important; backdrop-filter: blur(8px) !important; border: 1px solid rgba(255, 255, 255, 0.95) !important; border-radius: 10px !important; overflow: hidden !important; display: flex !important; flex-direction: column !important; height: 100% !important; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.05) !important; transition: transform 0.28s cubic-bezier(0.165, 0.84, 0.44, 1), box-shadow 0.28s cubic-bezier(0.165, 0.84, 0.44, 1), border-color 0.25s ease, background 0.25s ease !important; box-sizing: border-box !important; } .news-modern-card:hover { background: #ffffff !important; transform: translateY(-5px) !important; box-shadow: 0 14px 30px -4px rgba(0, 106, 171, 0.18), 0 4px 14px rgba(0, 0, 0, 0.06) !important; border-color: rgba(0, 150, 207, 0.5) !important; } .news-card-thumb-wrap { position: relative !important; width: 100% !important; aspect-ratio: 16 / 10 !important; overflow: hidden !important; background: #f1f5f9 !important; } .news-card-thumb { display: block !important; width: 100% !important; height: 100% !important; overflow: hidden !important; } .news-card-thumb img { width: 100% !important; height: 100% !important; object-fit: cover !important; object-position: center !important; transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important; display: block !important; } .news-modern-card:hover .news-card-thumb img { transform: scale(1.08) !important; } .news-card-badge { position: absolute !important; top: 10px !important; left: 10px !important; z-index: 2 !important; background: rgba(0, 106, 171, 0.9) !important; color: #ffffff !important; font-size: 11px !important; font-weight: 600 !important; text-transform: uppercase !important; padding: 4px 10px !important; border-radius: 4px !important; letter-spacing: 0.3px !important; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2) !important; text-decoration: none !important; backdrop-filter: blur(4px) !important; -webkit-backdrop-filter: blur(4px) !important; transition: background 0.2s ease, transform 0.2s ease !important; } .news-card-badge:hover { background: #ed1c26 !important; color: #ffffff !important; text-decoration: none !important; transform: translateY(-1px) !important; } .news-card-body { padding: 16px 18px 18px !important; display: flex !important; flex-direction: column !important; flex: 1 1 auto !important; justify-content: space-between !important; gap: 8px !important; box-sizing: border-box !important; } .news-card-meta { display: flex !important; align-items: center !important; gap: 14px !important; font-size: 12px !important; color: #64748b !important; } .news-meta-item { display: inline-flex !important; align-items: center !important; gap: 5px !important; } .news-meta-date i { color: #0096cf !important; } .news-meta-hits i { color: #94a3b8 !important; } .news-card-title { margin: 2px 0 0 0 !important; padding: 0 !important; font-size: 15.5px !important; font-weight: 700 !important; line-height: 1.4 !important; color: #111111 !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; text-overflow: ellipsis !important; word-break: break-word !important; overflow-wrap: break-word !important; min-height: 43px !important; } .news-card-title a { color: #111111 !important; text-decoration: none !important; transition: color 0.2s ease !important; } .news-modern-card:hover .news-card-title a { color: #006aab !important; } .news-card-desc { margin: 0 !important; font-size: 13px !important; color: #64748b !important; line-height: 1.5 !important; display: -webkit-box !important; -webkit-line-clamp: 3 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; text-overflow: ellipsis !important; word-break: break-word !important; overflow-wrap: break-word !important; max-height: 59px !important; } .news-card-desc:empty { display: none !important; } .news-card-footer { margin-top: 6px !important; padding-top: 10px !important; border-top: 1px solid #f1f5f9 !important; display: flex !important; align-items: center !important; justify-content: space-between !important; } .news-card-more { display: inline-flex !important; align-items: center !important; gap: 6px !important; font-size: 12.5px !important; font-weight: 600 !important; color: #006aab !important; text-decoration: none !important; transition: transform 0.2s ease, color 0.2s ease !important; } .news-card-more i { color: #ed1c26 !important; font-size: 13px !important; transition: transform 0.2s ease !important; } .news-modern-card:hover .news-card-more { color: #0096cf !important; transform: translateX(2px) !important; } .news-modern-card:hover .news-card-more i { transform: translateX(3px) !important; } .news-admin-links { font-size: 11.5px !important; } .news-pagination-wrap { display: flex !important; justify-content: center !important; align-items: center !important; padding-top: 24px !important; margin-top: 15px !important; border-top: 1px dashed rgba(0, 0, 0, 0.08) !important; width: 100% !important; text-align: center !important; } .news-pagination-wrap .pagination { display: inline-flex !important; align-items: center !important; justify-content: center !important; flex-wrap: wrap !important; gap: 6px !important; margin: 0 auto !important; padding: 0 !important; list-style: none !important; } .news-pagination-wrap .pagination > li { display: inline-flex !important; align-items: center !important; justify-content: center !important; margin: 0 !important; padding: 0 !important; float: none !important; } .news-pagination-wrap .pagination > li > a, .news-pagination-wrap .pagination > li > span { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-width: 36px !important; height: 36px !important; padding: 0 10px !important; border-radius: 6px !important; font-size: 13.5px !important; font-weight: 500 !important; color: #475569 !important; background: #ffffff !important; border: 1px solid #e2e8f0 !important; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04) !important; text-decoration: none !important; margin: 0 !important; transition: all 0.2s ease !important; line-height: 1 !important; float: none !important; } .news-pagination-wrap .pagination > li > a:hover { color: #006aab !important; border-color: #0096cf !important; background: #f0f9ff !important; transform: translateY(-1px) !important; } .news-pagination-wrap .pagination > li.active > a, .news-pagination-wrap .pagination > li.active > span, .news-pagination-wrap .pagination > .active > a, .news-pagination-wrap .pagination > .active > span { background: linear-gradient(90deg, #464288 0%, #006aab 50%, #0096cf 100%) !important; border-color: transparent !important; color: #ffffff !important; font-weight: 700 !important; box-shadow: 0 4px 10px rgba(0, 106, 171, 0.3) !important; cursor: default !important; transform: none !important; } .news-pagination-wrap .pagination > li.disabled > a, .news-pagination-wrap .pagination > li.disabled > span, .news-pagination-wrap .pagination > .disabled > a, .news-pagination-wrap .pagination > .disabled > span { color: #cbd5e1 !important; background: #f8fafc !important; border-color: #e2e8f0 !important; cursor: not-allowed !important; box-shadow: none !important; opacity: 0.6 !important; transform: none !important; } .news-pagination-wrap .pagination > li:first-child > a, .news-pagination-wrap .pagination > li:first-child > span, .news-pagination-wrap .pagination > li:last-child > a, .news-pagination-wrap .pagination > li:last-child > span { font-size: 16px !important; margin-top: 0 !important; border: 1px solid #e2e8f0 !important; border-radius: 6px !important; font-weight: 600 !important; width: auto !important; height: 36px !important; padding: 0 10px !important; } .news-pagination-wrap .pagination > li:first-child > a:hover, .news-pagination-wrap .pagination > li:last-child > a:hover { background: #f0f9ff !important; color: #006aab !important; } @media (max-width: 991px) { .news-glass-container { padding: 22px 20px 28px !important; margin: 15px auto 30px !important; } .news-grid-row { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 16px !important; } } @media (max-width: 767px) { .news-page-wrapper { margin: 12px auto 20px !important; } .news-glass-container { padding: 14px 10px 18px !important; border-radius: 10px !important; } .news-page-title { font-size: 16px !important; } .news-title-icon { font-size: 18px !important; } .news-grid-row { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; margin-bottom: 20px !important; } .news-card-thumb-wrap { aspect-ratio: 16 / 10 !important; } .news-card-badge { font-size: 9.5px !important; padding: 2px 6px !important; top: 6px !important; left: 6px !important; border-radius: 3px !important; } .news-card-body { padding: 10px 8px 10px !important; gap: 5px !important; } .news-card-meta { font-size: 10.5px !important; gap: 6px !important; } .news-meta-hits { display: none !important; } .news-card-title { font-size: 12.5px !important; line-height: 1.35 !important; min-height: 34px !important; margin: 0 !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; } .news-card-desc { font-size: 11px !important; line-height: 1.35 !important; min-height: unset !important; margin: 0 !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; } .news-card-footer { margin-top: auto !important; padding-top: 6px !important; } .news-card-more { font-size: 11px !important; gap: 4px !important; } .news-pills-list { flex-wrap: nowrap !important; overflow-x: auto !important; padding-bottom: 6px !important; -webkit-overflow-scrolling: touch !important; } .news-pill-btn { flex-shrink: 0 !important; font-size: 12px !important; padding: 5px 12px !important; } } .news-detail-wrapper { width: 100% !important; max-width: 1200px !important; margin: 15px auto 40px !important; padding: 0 15px !important; box-sizing: border-box !important; } .news-detail-container { max-width: 920px !important; margin: 0 auto !important; box-sizing: border-box !important; } .news-detail-header { margin-bottom: 24px !important; padding-bottom: 0 !important; border-bottom: none !important; } .news-detail-cat-badge-wrap { margin-bottom: 12px !important; } .news-detail-cat-badge { display: inline-block !important; background: linear-gradient(135deg, #076aa9 0%, #0098da 100%) !important; color: #ffffff !important; font-size: 12px !important; font-weight: 600 !important; text-transform: uppercase !important; letter-spacing: 0.5px !important; padding: 4px 14px !important; border-radius: 999px !important; text-decoration: none !important; box-shadow: 0 2px 8px rgba(7, 106, 169, 0.3) !important; transition: transform 0.2s ease, box-shadow 0.2s ease !important; } .news-detail-cat-badge:hover { transform: translateY(-1px) !important; box-shadow: 0 4px 12px rgba(7, 106, 169, 0.45) !important; color: #ffffff !important; text-decoration: none !important; } .news-detail-title { font-size: 28px !important; font-weight: 700 !important; line-height: 1.35 !important; color: #1e293b !important; margin: 0 0 16px 0 !important; font-family: inherit !important; } .news-detail-meta-bar { display: flex !important; align-items: center !important; justify-content: space-between !important; flex-wrap: wrap !important; gap: 15px !important; font-size: 13.5px !important; color: #64748b !important; } .news-detail-meta-left { display: flex !important; align-items: center !important; gap: 18px !important; flex-wrap: wrap !important; } .news-detail-meta-left .meta-item { display: inline-flex !important; align-items: center !important; gap: 6px !important; } .news-detail-meta-left .meta-item i { color: #94a3b8 !important; } .news-detail-share-toolbar { display: inline-flex !important; align-items: center !important; gap: 8px !important; } .news-detail-share-toolbar .share-label { font-size: 12.5px !important; color: #64748b !important; font-weight: 500 !important; display: inline-flex !important; align-items: center !important; gap: 4px !important; } .news-detail-share-toolbar .share-btn { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 32px !important; height: 32px !important; border-radius: 50% !important; border: none !important; font-size: 14px !important; color: #ffffff !important; cursor: pointer !important; transition: all 0.2s ease !important; text-decoration: none !important; line-height: 1 !important; } .news-detail-share-toolbar .share-btn-fb { background: #1877f2 !important; } .news-detail-share-toolbar .share-btn-fb:hover { background: #1464cc !important; transform: translateY(-2px) !important; box-shadow: 0 4px 10px rgba(24, 119, 242, 0.3) !important; color: #ffffff !important; } .news-detail-share-toolbar .share-btn-zalo { background: #0068ff !important; } .news-detail-share-toolbar .share-btn-zalo:hover { background: #0052cc !important; transform: translateY(-2px) !important; box-shadow: 0 4px 10px rgba(0, 104, 255, 0.3) !important; color: #ffffff !important; } .news-detail-share-toolbar .share-btn-zalo .zalo-text { font-size: 10px !important; font-weight: 800 !important; letter-spacing: -0.5px !important; } .news-detail-share-toolbar .share-btn-copy { background: #475569 !important; } .news-detail-share-toolbar .share-btn-copy:hover { background: #334155 !important; transform: translateY(-2px) !important; box-shadow: 0 4px 10px rgba(51, 65, 85, 0.3) !important; color: #ffffff !important; } .news-detail-sapo { margin-bottom: 24px !important; } .news-detail-sapo .sapo-text { font-size: 16px !important; line-height: 1.7 !important; font-weight: 500 !important; color: #334155 !important; font-style: italic !important; } .news-detail-sapo figure { margin: 0 0 14px 0 !important; text-align: center !important; } .news-detail-sapo figure img { max-width: 100% !important; height: auto !important; border-radius: 8px !important; } .news-detail-sapo figcaption { font-size: 13px !important; color: #64748b !important; margin-top: 6px !important; font-style: italic !important; } .news-detail-toc { background: rgba(255, 255, 255, 0.85) !important; backdrop-filter: blur(10px) !important; -webkit-backdrop-filter: blur(10px) !important; border: 1px solid rgba(7, 106, 169, 0.25) !important; border-left: 4px solid #076aa9 !important; border-radius: 8px !important; padding: 16px 20px !important; margin: 22px 0 28px !important; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.04) !important; } .news-detail-toc .toc-header { display: flex !important; align-items: center !important; justify-content: space-between !important; cursor: pointer !important; user-select: none !important; } .news-detail-toc .toc-title { font-size: 14.5px !important; font-weight: 700 !important; color: #076aa9 !important; text-transform: uppercase !important; letter-spacing: 0.5px !important; display: flex !important; align-items: center !important; gap: 8px !important; } .news-detail-toc .toc-title i { font-size: 15px !important; } .news-detail-toc .toc-toggle-btn { width: 26px !important; height: 26px !important; display: flex !important; align-items: center !important; justify-content: center !important; border-radius: 4px !important; background: rgba(7, 106, 169, 0.1) !important; color: #076aa9 !important; font-size: 14px !important; transition: background 0.2s ease !important; } .news-detail-toc .toc-header:hover .toc-toggle-btn { background: #076aa9 !important; color: #ffffff !important; } .news-detail-toc .toc-list { list-style: none !important; padding: 0 !important; margin: 12px 0 0 0 !important; border-top: 1px dashed rgba(7, 106, 169, 0.2) !important; padding-top: 10px !important; } .news-detail-toc .toc-item { margin: 0 !important; } .news-detail-toc .toc-item-h2 { padding: 5px 0 !important; } .news-detail-toc .toc-item-h2 .toc-link { font-size: 14px !important; font-weight: 600 !important; color: #1e293b !important; } .news-detail-toc .toc-item-h3 { padding: 3px 0 3px 20px !important; } .news-detail-toc .toc-item-h3 .toc-link { font-size: 13.5px !important; font-weight: 500 !important; color: #475569 !important; } .news-detail-toc .toc-link { text-decoration: none !important; transition: color 0.2s ease !important; display: inline-block !important; line-height: 1.5 !important; } .news-detail-toc .toc-link:hover { color: #971a1e !important; } .news-detail-toc .toc-prefix { color: #076aa9 !important; font-weight: 700 !important; margin-right: 5px !important; } .news-detail-body { font-size: 16.5px !important; line-height: 1.8 !important; color: #334155 !important; margin-bottom: 30px !important; word-break: break-word !important; } .news-detail-body p { margin-bottom: 1.25em !important; font-size: inherit !important; line-height: inherit !important; color: inherit !important; } .news-detail-body img { max-width: 100% !important; height: auto !important; border-radius: 8px !important; display: block !important; margin: 22px auto !important; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.06) !important; } .news-detail-body h1 { font-size: 24px !important; font-weight: 700 !important; color: #971a1e !important; margin: 32px 0 16px !important; line-height: 1.4 !important; border-bottom: 2px solid #971a1e !important; padding-bottom: 8px !important; } .news-detail-body h2 { font-size: 21px !important; font-weight: 700 !important; margin: 34px 0 16px !important; line-height: 1.45 !important; padding: 8px 14px !important; background: linear-gradient(90deg, rgba(151, 26, 30, 0.08) 0%, rgba(151, 26, 30, 0.01) 80%, transparent 100%) !important; } .news-detail-body h3 { font-size: 18px !important; font-weight: 600 !important; margin: 26px 0 12px !important; line-height: 1.4 !important; padding: 6px 12px !important; background: linear-gradient(90deg, rgba(7, 106, 169, 0.06) 0%, transparent 100%) !important; border-radius: 0 6px 6px 0 !important; } .news-detail-body h4 { font-size: 16px !important; font-weight: 600 !important; color: #1e293b !important; margin: 20px 0 10px !important; line-height: 1.4 !important; padding-left: 10px !important; border-left: 2px solid #64748b !important; } .news-detail-body ul, .news-detail-body ol { padding-left: 24px !important; margin-bottom: 1.25em !important; } .news-detail-body li { margin-bottom: 6px !important; line-height: 1.7 !important; } .news-detail-body blockquote { border-left: 4px solid #cbd5e1 !important; padding: 12px 18px !important; margin: 20px 0 !important; background: rgba(0, 0, 0, 0.02) !important; border-radius: 0 8px 8px 0 !important; font-style: italic !important; } .news-detail-body table { width: 100% !important; max-width: 100% !important; border-collapse: collapse !important; margin: 20px 0 !important; } .news-detail-body th, .news-detail-body td { border: 1px solid #e2e8f0 !important; padding: 10px 14px !important; font-size: 15px !important; } .news-detail-body th { background: #f8fafc !important; font-weight: 600 !important; } .news-detail-credits { display: flex !important; justify-content: flex-end !important; gap: 20px !important; flex-wrap: wrap !important; margin: 20px 0 15px !important; font-size: 14px !important; color: #475569 !important; } .news-detail-credits .credit-item { display: inline-flex !important; align-items: center !important; gap: 6px !important; } .news-detail-credits .credit-item i { color: #94a3b8 !important; } .news-detail-copyright { font-size: 13px !important; color: #64748b !important; background: rgba(0, 106, 171, 0.05) !important; border-left: 3px solid #006aab !important; padding: 10px 14px !important; border-radius: 0 6px 6px 0 !important; margin-bottom: 24px !important; display: flex !important; align-items: center !important; gap: 8px !important; } .news-detail-copyright i { color: #006aab !important; } .news-detail-tags { display: flex !important; align-items: center !important; flex-wrap: wrap !important; gap: 12px !important; padding: 16px 0 !important; border-top: 1px dashed rgba(0, 0, 0, 0.1) !important; border-bottom: 1px dashed rgba(0, 0, 0, 0.1) !important; margin: 24px 0 !important; } .news-detail-tags .tags-header { font-size: 13.5px !important; font-weight: 600 !important; color: #475569 !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .news-detail-tags .tags-header i { color: #971a1e !important; } .news-detail-tags .tags-list { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; } .news-detail-tags .tag-pill { display: inline-flex !important; align-items: center !important; background: #f1f5f9 !important; color: #475569 !important; padding: 5px 13px !important; border-radius: 999px !important; font-size: 12.5px !important; text-decoration: none !important; transition: all 0.2s ease !important; font-weight: 500 !important; } .news-detail-tags .tag-pill:hover { background: #971a1e !important; color: #ffffff !important; transform: translateY(-1px) !important; box-shadow: 0 2px 8px rgba(151, 26, 30, 0.25) !important; } .news-detail-adminlink { text-align: right !important; margin: 12px 0 !important; } .news-detail-bottom-share { background: rgba(248, 250, 252, 0.85) !important; border-radius: 12px !important; padding: 18px 24px !important; margin: 26px 0 !important; display: flex !important; align-items: center !important; justify-content: space-between !important; flex-wrap: wrap !important; gap: 16px !important; border: 1px solid rgba(0, 0, 0, 0.04) !important; } .news-detail-bottom-share .bottom-share-desc { font-size: 14.5px !important; font-weight: 600 !important; color: #1e293b !important; display: flex !important; align-items: center !important; gap: 8px !important; } .news-detail-bottom-share .bottom-share-desc i { color: #971a1e !important; font-size: 16px !important; } .news-detail-bottom-share .bottom-share-actions { display: flex !important; gap: 10px !important; flex-wrap: wrap !important; } .news-detail-bottom-share .b-share-btn { display: inline-flex !important; align-items: center !important; gap: 8px !important; padding: 8px 16px !important; border-radius: 999px !important; font-size: 13px !important; font-weight: 600 !important; color: #ffffff !important; text-decoration: none !important; border: none !important; cursor: pointer !important; transition: all 0.2s ease !important; line-height: 1 !important; } .news-detail-bottom-share .b-share-fb { background: #1877f2 !important; } .news-detail-bottom-share .b-share-fb:hover { background: #1464cc !important; transform: translateY(-2px) !important; box-shadow: 0 4px 12px rgba(24, 119, 242, 0.3) !important; color: #ffffff !important; } .news-detail-bottom-share .b-share-zalo { background: #0068ff !important; } .news-detail-bottom-share .b-share-zalo:hover { background: #0052cc !important; transform: translateY(-2px) !important; box-shadow: 0 4px 12px rgba(0, 104, 255, 0.3) !important; color: #ffffff !important; } .news-detail-bottom-share .b-share-zalo .zalo-pill-text { background: #ffffff !important; color: #0068ff !important; font-size: 10px !important; font-weight: 800 !important; padding: 2px 6px !important; border-radius: 4px !important; line-height: 1 !important; } .news-detail-bottom-share .b-share-copy { background: #334155 !important; } .news-detail-bottom-share .b-share-copy:hover { background: #1e293b !important; transform: translateY(-2px) !important; box-shadow: 0 4px 12px rgba(51, 65, 85, 0.3) !important; color: #ffffff !important; } .news-detail-rating-box { background: #ffffff !important; border: 1px solid #e2e8f0 !important; border-radius: 10px !important; padding: 14px 20px !important; margin: 20px 0 !important; } .news-detail-rating-box .rating-flex { display: flex !important; align-items: center !important; flex-wrap: wrap !important; gap: 12px !important; } .news-detail-rating-box .rating-label { font-size: 14px !important; font-weight: 600 !important; color: #334155 !important; } .news-detail-rating-box .rating-score { font-size: 13px !important; color: #64748b !important; } .news-detail-related-section { margin: 40px auto 0 !important; } .related-section-header { margin-bottom: 24px !important; text-align: center !important; } .related-section-title { font-size: 20px !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: 0.5px !important; margin: 0 !important; } .related-title-divider { background: #971a1e !important; margin: 10px auto 0 !important; } .news-related-grid { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 20px !important; margin-bottom: 24px !important; } .news-related-card { background: rgba(255, 255, 255, 0.85) !important; backdrop-filter: blur(10px) !important; -webkit-backdrop-filter: blur(10px) !important; border: 1px solid rgba(255, 255, 255, 0.9) !important; border-radius: 12px !important; overflow: hidden !important; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.04) !important; display: flex !important; flex-direction: column !important; transition: transform 0.25s ease, box-shadow 0.25s ease !important; } .news-related-card:hover { transform: translateY(-4px) !important; box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08) !important; } .related-card-thumb { position: relative !important; display: block !important; width: 100% !important; padding-top: 58% !important; overflow: hidden !important; background: #f1f5f9 !important; } .related-card-thumb img { position: absolute !important; top: 0 !important; left: 0 !important; width: 100% !important; height: 100% !important; object-fit: cover !important; transition: transform 0.4s ease !important; } .news-related-card:hover .related-card-thumb img { transform: scale(1.06) !important; } .related-card-body { padding: 14px 16px !important; display: flex !important; flex-direction: column !important; flex-grow: 1 !important; } .related-card-meta { font-size: 12px !important; color: #94a3b8 !important; margin-bottom: 8px !important; display: flex !important; align-items: center !important; gap: 6px !important; } .related-card-title { font-size: 14.5px !important; font-weight: 600 !important; line-height: 1.4 !important; margin: 0 !important; display: -webkit-box !important; -webkit-box-orient: vertical !important; -webkit-line-clamp: 2 !important; overflow: hidden !important; } .related-card-title a { color: #1e293b !important; text-decoration: none !important; transition: color 0.2s ease !important; } .news-related-card:hover .related-card-title a, .related-card-title a:hover { color: #971a1e !important; } .news-detail-topic-wrap { background: rgba(255, 255, 255, 0.8) !important; border-radius: 12px !important; padding: 20px 24px !important; margin-top: 24px !important; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.04) !important; } .news-detail-topic-wrap .topic-header { font-size: 16px !important; font-weight: 700 !important; color: #1e293b !important; margin: 0 0 14px 0 !important; display: flex !important; align-items: center !important; gap: 8px !important; } .news-detail-topic-wrap .topic-header i { color: #971a1e !important; } .news-detail-topic-wrap .topic-list { list-style: none !important; padding: 0 !important; margin: 0 !important; } .news-detail-topic-wrap .topic-list li { padding: 8px 0 !important; border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important; } .news-detail-topic-wrap .topic-list li:last-child { border-bottom: none !important; } .news-detail-topic-wrap .topic-list a { color: #334155 !important; text-decoration: none !important; font-size: 14px !important; display: flex !important; align-items: center !important; gap: 8px !important; transition: color 0.2s ease !important; } .news-detail-topic-wrap .topic-list a:hover { color: #971a1e !important; } .news-copy-toast { position: fixed !important; bottom: 30px !important; left: 50% !important; transform: translateX(-50%) translateY(20px) !important; background: #0f172a !important; color: #ffffff !important; padding: 12px 24px !important; border-radius: 999px !important; font-size: 14px !important; box-shadow: 0 10px 25px rgba(0, 0, 0, 0.25) !important; display: flex !important; align-items: center !important; gap: 8px !important; opacity: 0 !important; visibility: hidden !important; transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important; z-index: 99999 !important; } .news-copy-toast.show { opacity: 1 !important; visibility: visible !important; transform: translateX(-50%) translateY(0) !important; } .news-copy-toast i { color: #10b981 !important; } @media (max-width: 768px) { .news-detail-container { padding: 24px 18px !important; border-radius: 10px !important; } .news-detail-title { font-size: 21px !important; } .news-detail-meta-bar { flex-direction: column !important; align-items: flex-start !important; gap: 12px !important; } .news-detail-share-toolbar { width: 100% !important; justify-content: flex-start !important; } .news-detail-bottom-share { flex-direction: column !important; align-items: flex-start !important; padding: 16px 18px !important; } .news-detail-bottom-share .bottom-share-actions { width: 100% !important; } .news-detail-body { font-size: 15.5px !important; } .news-related-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 14px !important; } } @media (max-width: 480px) { .news-related-grid { grid-template-columns: 1fr !important; } .news-detail-bottom-share .bottom-share-actions { flex-direction: column !important; } .news-detail-bottom-share .b-share-btn { width: 100% !important; justify-content: center !important; } } .news-detail-sapo .article-img-full { margin: 16px 0 0 !important; text-align: center !important; } .news-detail-sapo .article-img-full img { max-width: 100% !important; width: auto !important; height: auto !important; border-radius: 8px !important; } .news-detail-body div { max-width: 100% !important; } .news-detail-sapo figcaption { line-height: 1.5 !important; } .news-detail-toc { clear: both !important; position: relative !important; overflow: hidden !important; height: auto !important; } .news-detail-toc .toc-item { height: auto !important; min-height: 0 !important; float: none !important; display: block !important; } .news-detail-header { position: static !important; z-index: auto !important; background: transparent !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; box-shadow: none !important; border: none !important; } .news-detail-container { background: rgba(255, 255, 255, 0.72) !important; backdrop-filter: blur(14px) !important; -webkit-backdrop-filter: blur(14px) !important; border: 1px solid rgba(255, 255, 255, 0.9) !important; border-radius: 14px !important; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06), 0 1px 3px rgba(0, 0, 0, 0.03) !important; padding: 36px 40px !important; } @media (max-width: 768px) { .news-detail-container { padding: 22px 16px !important; border-radius: 10px !important; } } .news-detail-sapo .article-img-full, .news-detail-sapo figure { display: block !important; width: 100% !important; margin: 20px 0 0 !important; text-align: center !important; line-height: normal !important; } .news-detail-sapo .article-img-full img, .news-detail-sapo figure img { display: block !important; width: 100% !important; max-width: 100% !important; max-height: none !important; height: auto !important; margin: 0 auto !important; object-fit: contain !important; border-radius: 10px !important; } .news-detail-body h2 { color: #076aa9 !important; border-left: 4px solid #076aa9 !important; border-image: linear-gradient(180deg, #464288 0%, #006aab 50%, #0096cf 100%) 1 !important; background: linear-gradient(90deg, rgba(0, 106, 171, 0.10) 0%, rgba(0, 150, 207, 0.02) 80%, transparent 100%) !important; border-radius: 0 !important; } .news-detail-body h2 *, .news-detail-body h2 strong { color: #076aa9 !important; } .news-detail-body h3 { color: #ed1c26 !important; border-left: 3px solid #ed1c26 !important; border-image: none !important; background: linear-gradient(90deg, rgba(237, 28, 38, 0.07) 0%, transparent 100%) !important; } .news-detail-body h3 *, .news-detail-body h3 strong { color: #ed1c26 !important; } .news-detail-related-section { max-width: 920px !important; } .related-section-title { color: #000000 !important; } .related-section-title .title-highlight { color: #000000 !important; } .related-title-divider { width: 70px !important; height: 4px !important; background: linear-gradient(90deg, #464288 0%, #006aab 50%, #0096cf 100%) !important; border-radius: 2px !important; } .news-related-slider { position: relative !important; margin-bottom: 24px !important; } .news-related-grid.is-slider { display: flex !important; grid-template-columns: none !important; gap: 20px !important; overflow-x: auto !important; scroll-snap-type: x mandatory !important; scrollbar-width: none !important; -webkit-overflow-scrolling: touch !important; margin-bottom: 0 !important; padding: 4px 2px 10px !important; } .news-related-grid.is-slider::-webkit-scrollbar { display: none !important; } .news-related-grid.is-slider .news-related-card { flex: 0 0 calc((100% - 40px) / 3) !important; scroll-snap-align: start !important; } .news-related-slider .rel-nav { position: absolute !important; top: 38% !important; transform: translateY(-50%) !important; width: 36px !important; height: 36px !important; border-radius: 50% !important; border: none !important; background: linear-gradient(135deg, #006aab, #0096cf) !important; color: #fff !important; font-size: 22px !important; line-height: 1 !important; display: flex !important; align-items: center !important; justify-content: center !important; cursor: pointer !important; box-shadow: 0 4px 12px rgba(0, 106, 171, 0.35) !important; z-index: 3 !important; opacity: 0 !important; transition: opacity 0.2s ease !important; } .news-related-slider:hover .rel-nav { opacity: 1 !important; } .news-related-slider .rel-prev { left: -10px !important; } .news-related-slider .rel-next { right: -10px !important; } @media (max-width: 768px) { .news-related-grid.is-slider .news-related-card { flex: 0 0 calc((100% - 20px) / 2) !important; } } @media (max-width: 480px) { .news-related-grid.is-slider .news-related-card { flex: 0 0 85% !important; } .news-related-slider .rel-nav { opacity: 1 !important; } } #detail .p_content .tabs .nav-tabs { display: flex !important; flex-wrap: nowrap !important; gap: 6px !important; padding: 5px !important; margin: 0 0 22px 0 !important; background: #f1f5f9 !important; border: 1px solid #e2e8f0 !important; border-radius: 999px !important; overflow-x: auto !important; scrollbar-width: none !important; width: fit-content !important; max-width: 100% !important; } #detail .p_content .tabs .nav-tabs::-webkit-scrollbar { display: none !important; } #detail .p_content .tabs .nav-tabs::before, #detail .p_content .tabs .nav-tabs::after { display: none !important; } #detail .p_content .tabs .nav-tabs > li { float: none !important; margin: 0 !important; flex: 0 0 auto !important; } #detail .p_content .tabs .nav-tabs > li > a { display: inline-flex !important; align-items: center !important; justify-content: center !important; margin: 0 !important; padding: 9px 22px !important; border: none !important; border-bottom: none !important; border-radius: 999px !important; background: transparent !important; color: #475569 !important; font-size: 14px !important; font-weight: 600 !important; line-height: 1.2 !important; white-space: nowrap !important; transition: background 0.25s ease, color 0.25s ease, box-shadow 0.25s ease !important; } #detail .p_content .tabs .nav-tabs > li > a:hover { background: rgba(0, 106, 171, 0.1) !important; color: #076aa9 !important; border: none !important; } #detail .p_content .tabs .nav-tabs > li.active > a, #detail .p_content .tabs .nav-tabs > li.active > a:hover, #detail .p_content .tabs .nav-tabs > li.active > a:focus { background: linear-gradient(90deg, #464288 0%, #006aab 50%, #0096cf 100%) !important; color: #ffffff !important; border: none !important; box-shadow: 0 4px 12px rgba(0, 106, 171, 0.35) !important; } @media (max-width: 575px) { #detail .p_content .tabs .nav-tabs { width: 100% !important; } #detail .p_content .tabs .nav-tabs > li > a { padding: 8px 16px !important; font-size: 13px !important; } } #detail .p_content { border-radius: 16px !important; } #detail .p_content .tabs .tab-content { border-radius: 14px !important; overflow: hidden !important; } #detail .p_content .tabs .tab-content > .tab-pane, #detail .p_content .tabs .tab-content > .active { border: 1px solid #e2e8f0 !important; border-radius: 14px !important; background: #ffffff !important; padding: 20px !important; margin: 0 !important; box-sizing: border-box !important; } #detail .p_content .tabs .tab-content img { max-width: 100% !important; height: auto !important; } #detail .p_content .s_other, #detail .s_other { background: #f8fafc !important; border: 1px solid #e2e8f0 !important; border-radius: 14px !important; padding: 14px 18px !important; margin-top: 20px !important; box-sizing: border-box !important; } #detail .p_content .keywords a { border-radius: 999px !important; padding: 4px 12px !important; } .contact.contact-modern { background: rgba(255, 255, 255, 0.78) !important; backdrop-filter: blur(14px) !important; -webkit-backdrop-filter: blur(14px) !important; border: 1px solid rgba(255, 255, 255, 0.9) !important; border-radius: 16px !important; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06) !important; padding: 32px 34px 36px !important; margin: 22px 0 30px !important; overflow: hidden !important; } .contact-modern .contact-header { text-align: center !important; margin-bottom: 28px !important; } .contact-modern .contact-title { display: inline-flex !important; align-items: center !important; gap: 12px !important; margin: 0 0 8px !important; font-size: 28px !important; font-weight: 700 !important; color: #0f172a !important; text-transform: none !important; line-height: 1.3 !important; } .contact-modern .contact-title-icon { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 44px !important; height: 44px !important; border-radius: 12px !important; background: linear-gradient(135deg, #464288 0%, #006aab 55%, #0096cf 100%) !important; color: #fff !important; font-size: 20px !important; box-shadow: 0 6px 16px rgba(0, 106, 171, 0.35) !important; } .contact-modern .contact-subtitle { max-width: 640px !important; margin: 0 auto !important; color: #64748b !important; font-size: 14.5px !important; line-height: 1.7 !important; } .contact-modern .contact-row { display: flex !important; flex-wrap: wrap !important; align-items: stretch !important; } .contact-modern .contact-col-info, .contact-modern .contact-col-form { float: none !important; box-sizing: border-box !important; } @media (max-width: 991px) { .contact-modern .contact-col-info, .contact-modern .contact-col-form { width: 100% !important; margin-bottom: 20px !important; } } .contact-modern .sbody { height: 100% !important; box-sizing: border-box !important; background: #ffffff !important; border: 1px solid #e2e8f0 !important; border-radius: 14px !important; padding: 22px 22px 14px !important; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.03) !important; } .contact-modern .sbody h2 { position: relative !important; font-size: 18px !important; font-weight: 700 !important; color: #076aa9 !important; margin: 0 0 14px !important; padding-bottom: 12px !important; text-transform: none !important; border-bottom: 0 !important; border-image: none !important; } .contact-modern .sbody h2::after { content: "" !important; position: absolute !important; left: 0 !important; bottom: 0 !important; width: 44px !important; height: 3px !important; border-radius: 2px !important; background: linear-gradient(90deg, #0096cf, #ed1c26) !important; } .contact-modern .sbody table, .contact-modern .sbody .table { width: 100% !important; border: 0 !important; margin: 0 0 8px !important; background: transparent !important; } .contact-modern .sbody table td, .contact-modern .sbody table th { border: 0 !important; border-bottom: 1px dashed #e2e8f0 !important; padding: 9px 4px !important; font-size: 14px !important; color: #334155 !important; vertical-align: top !important; background: transparent !important; } .contact-modern .sbody table tr td:first-child:not([colspan]) { color: #64748b !important; font-weight: 600 !important; white-space: nowrap !important; } .contact-modern .sbody table td[colspan] { border-bottom: 0 !important; padding: 14px 0 4px !important; } .contact-modern .sbody table h4 { display: inline-block !important; margin: 0 !important; padding: 5px 14px !important; font-size: 14px !important; font-weight: 700 !important; color: #ffffff !important; border-radius: 999px !important; background: linear-gradient(90deg, #464288 0%, #006aab 50%, #0096cf 100%) !important; } .contact-modern .sbody table tr:last-child td { border-bottom: 0 !important; } .contact-modern .sform { height: 100% !important; box-sizing: border-box !important; background: #ffffff !important; border: 1px solid #e2e8f0 !important; border-radius: 14px !important; padding: 22px !important; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.03) !important; } .contact-modern .sform h3 { font-size: 18px !important; font-weight: 700 !important; color: #0f172a !important; margin: 0 0 18px !important; display: flex !important; align-items: center !important; gap: 10px !important; } .contact-modern .sform h3 i { color: #ed1c26 !important; } .contact-modern .nv-fullbg { background: transparent !important; padding: 0 !important; border: 0 !important; box-shadow: none !important; } .contact-modern .sform .form-group { margin-bottom: 14px !important; } .contact-modern .sform .form-control { height: 46px !important; border: 1px solid #e2e8f0 !important; border-radius: 10px !important; background: #f8fafc !important; padding: 10px 14px !important; font-size: 14px !important; color: #0f172a !important; box-shadow: none !important; transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease !important; } .contact-modern .sform textarea.form-control { height: auto !important; min-height: 140px !important; resize: vertical !important; } .contact-modern .sform .form-control:focus { background: #ffffff !important; border-color: #0096cf !important; box-shadow: 0 0 0 3px rgba(0, 150, 207, 0.18) !important; outline: 0 !important; } .contact-modern .sform .form-group.row { margin-left: -7px !important; margin-right: -7px !important; } .contact-modern .sform .form-group.row > [class*="col-"] { padding-left: 7px !important; padding-right: 7px !important; } @media (max-width: 767px) { .contact-modern .sform .form-group.row > [class*="col-"] { margin-bottom: 14px !important; } } .contact-modern .sform .fcode { width: 130px !important; height: 46px !important; display: inline-block !important; vertical-align: middle !important; } .contact-modern .sform .captchaImg { height: 46px !important; border-radius: 10px !important; vertical-align: middle !important; border: 1px solid #e2e8f0 !important; } .contact-modern .sform .fa-refresh { color: #076aa9 !important; cursor: pointer !important; } .contact-modern .sform input[type="submit"].btn-site { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-width: 170px !important; height: 48px !important; padding: 0 30px !important; border: 0 !important; border-radius: 999px !important; background: linear-gradient(90deg, #464288 0%, #006aab 50%, #0096cf 100%) !important; color: #ffffff !important; font-size: 15px !important; font-weight: 700 !important; letter-spacing: 0.3px !important; box-shadow: 0 8px 20px rgba(0, 106, 171, 0.35) !important; transition: transform 0.2s ease, box-shadow 0.2s ease !important; } .contact-modern .sform input[type="submit"].btn-site:hover { transform: translateY(-2px) !important; box-shadow: 0 12px 26px rgba(0, 106, 171, 0.45) !important; } section .container iframe[src*="google.com/maps"] { display: block !important; width: 100% !important; height: 360px !important; border: 0 !important; border-radius: 16px !important; margin: 22px 0 0 !important; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1) !important; } @media (max-width: 767px) { .contact.contact-modern { padding: 22px 14px 24px !important; border-radius: 12px !important; } .contact-modern .contact-title { font-size: 21px !important; } section .container iframe[src*="google.com/maps"] { height: 260px !important; } } .contact-modern .sbody .contact-row-icon { color: #ed1c26 !important; width: 20px !important; margin-right: 6px !important; font-size: 16px !important; text-align: center !important; display: inline-block !important; } .contact-modern .sbody table tr td:first-child:not([colspan]) { width: 130px !important; } .page-modern { max-width: 960px !important; margin: 22px auto 34px !important; background: rgba(255, 255, 255, 0.78) !important; backdrop-filter: blur(14px) !important; -webkit-backdrop-filter: blur(14px) !important; border: 1px solid rgba(255, 255, 255, 0.9) !important; border-radius: 16px !important; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06) !important; padding: 38px 44px 42px !important; box-sizing: border-box !important; } .page-modern-header { text-align: center !important; margin-bottom: 28px !important; } .page-modern-title { margin: 0 !important; padding: 0 !important; font-size: 30px !important; font-weight: 700 !important; line-height: 1.35 !important; color: #0f172a !important; text-transform: none !important; } .page-modern-line { width: 80px !important; height: 4px !important; border-radius: 2px !important; margin: 14px auto 0 !important; background: linear-gradient(90deg, #464288 0%, #006aab 50%, #0096cf 100%) !important; } .page-modern-body { font-size: 16px !important; line-height: 1.8 !important; color: #334155 !important; word-break: break-word !important; text-align: justify !important; } .page-modern-body p { margin-bottom: 1.2em !important; } .page-modern-body a { color: #076aa9 !important; text-decoration: underline !important; } .page-modern-body a:hover { color: #ed1c26 !important; } .page-modern-body img { max-width: 100% !important; height: auto !important; border-radius: 10px !important; margin: 18px auto !important; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.07) !important; } .page-modern-body h2 { font-size: 21px !important; font-weight: 700 !important; color: #076aa9 !important; margin: 34px 0 16px !important; line-height: 1.45 !important; padding: 8px 14px !important; border-left: 4px solid #076aa9 !important; border-image: linear-gradient(180deg, #464288 0%, #006aab 50%, #0096cf 100%) 1 !important; background: linear-gradient(90deg, rgba(0, 106, 171, 0.10) 0%, rgba(0, 150, 207, 0.02) 80%, transparent 100%) !important; text-align: left !important; } .page-modern-body h3 { font-size: 18px !important; font-weight: 600 !important; color: #ed1c26 !important; margin: 26px 0 12px !important; line-height: 1.4 !important; padding: 6px 12px !important; border-left: 3px solid #ed1c26 !important; background: linear-gradient(90deg, rgba(237, 28, 38, 0.07) 0%, transparent 100%) !important; text-align: left !important; } .page-modern-body h2 *, .page-modern-body h3 * { color: inherit !important; } .page-modern-body ul, .page-modern-body ol { padding-left: 24px !important; margin-bottom: 1.2em !important; } .page-modern-body ul { list-style: disc !important; } .page-modern-body ol { list-style: decimal !important; } .page-modern-body li { margin-bottom: 6px !important; } .page-modern-body blockquote { border-left: 4px solid #cbd5e1 !important; padding: 12px 18px !important; margin: 20px 0 !important; background: rgba(0, 0, 0, 0.02) !important; border-radius: 0 8px 8px 0 !important; font-style: italic !important; } .page-modern-body table { width: 100% !important; border-collapse: collapse !important; margin: 20px 0 !important; display: block !important; overflow-x: auto !important; } .page-modern-body th, .page-modern-body td { border: 1px solid #e2e8f0 !important; padding: 10px 14px !important; font-size: 15px !important; } .page-modern-body th { background: #f8fafc !important; font-weight: 600 !important; } @media (max-width: 767px) { .page-modern { padding: 24px 16px 28px !important; border-radius: 12px !important; margin: 14px auto 24px !important; } .page-modern-title { font-size: 23px !important; } .page-modern-body { font-size: 15px !important; text-align: left !important; } } .page-modern-list { max-width: 960px !important; margin: 22px auto 34px !important; } .page-modern-list .page-list-card { background: rgba(255, 255, 255, 0.85) !important; border: 1px solid rgba(255, 255, 255, 0.9) !important; border-radius: 14px !important; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05) !important; margin-bottom: 16px !important; overflow: hidden !important; transition: transform 0.2s ease, box-shadow 0.2s ease !important; } .page-modern-list .page-list-card:hover { transform: translateY(-3px) !important; box-shadow: 0 10px 25px rgba(0, 0, 0, 0.09) !important; } .page-modern-list .page-list-card .panel-body { padding: 18px 22px !important; } .page-modern-list .page-list-card h3 { margin: 0 0 8px !important; font-size: 18px !important; font-weight: 700 !important; } .page-modern-list .page-list-card h3 a { color: #076aa9 !important; text-decoration: none !important; } .page-modern-list .page-list-card h3 a:hover { color: #ed1c26 !important; } .page-modern-list .page-list-card p { color: #475569 !important; font-size: 14.5px !important; line-height: 1.7 !important; } .page-modern-list .page-list-card .img-thumbnail { border-radius: 10px !important; } .page-modern-body.page-partners { text-align: left !important; } .page-partners .partner-intro { text-align: center !important; font-size: 17px !important; font-weight: 600 !important; color: #334155 !important; margin: 0 0 8px !important; line-height: 1.7 !important; } .page-partners .partner-group-title { display: flex !important; align-items: center !important; gap: 14px !important; margin: 34px 0 18px !important; padding: 0 !important; border: 0 !important; background: none !important; font-size: 17px !important; font-weight: 700 !important; color: #076aa9 !important; text-transform: none !important; } .page-partners .partner-group-title::before { content: "" !important; width: 5px !important; height: 22px !important; border-radius: 3px !important; flex: 0 0 5px !important; background: linear-gradient(180deg, #464288 0%, #006aab 50%, #0096cf 100%) !important; } .page-partners .partner-group-title::after { content: "" !important; flex: 1 1 auto !important; height: 1px !important; background: linear-gradient(90deg, #cbd5e1, transparent) !important; } .page-partners .partner-grid { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 16px !important; } .page-partners .partner-card { display: flex !important; align-items: center !important; justify-content: center !important; height: 110px !important; padding: 14px 18px !important; box-sizing: border-box !important; background: #ffffff !important; border: 1px solid #e2e8f0 !important; border-radius: 14px !important; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important; transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease !important; } .page-partners .partner-card:hover { transform: translateY(-4px) !important; box-shadow: 0 10px 22px rgba(0, 106, 171, 0.15) !important; border-color: #0096cf !important; } .page-partners .partner-card img { max-width: 100% !important; max-height: 100% !important; width: auto !important; height: auto !important; margin: 0 !important; border-radius: 0 !important; box-shadow: none !important; object-fit: contain !important; filter: grayscale(35%) !important; transition: filter 0.2s ease !important; } .page-partners .partner-card:hover img { filter: none !important; } @media (max-width: 991px) { .page-partners .partner-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } } @media (max-width: 575px) { .page-partners .partner-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 12px !important; } .page-partners .partner-card { height: 92px !important; padding: 10px 12px !important; } } .grid_group { padding: 0 0 50px !important; } @media (max-width: 991px) { .grid_group { padding: 0 !important; } } .endfooter { background: transparent !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; border: 0 !important; box-shadow: none !important; margin: 50px 0 -44px 0 !important; } .shopee-trust-badges-bar { background: #ffffff !important; border: 1px solid rgba(0, 106, 171, 0.12) !important; border-radius: 18px !important; box-shadow: 0 14px 34px rgba(7, 40, 80, 0.16) !important; padding: 18px 14px 10px !important; } .shopee-trust-badges-bar .trust-item { background: transparent !important; border: 0 !important; border-radius: 12px !important; padding: 8px 12px !important; } .shopee-trust-badges-bar .trust-item:hover { background: #f1f7fb !important; box-shadow: none !important; transform: translateY(-2px) !important; } .shopee-trust-badges-bar .trust-icon { width: 46px !important; height: 46px !important; border-radius: 14px !important; background: linear-gradient(135deg, #464288 0%, #006aab 55%, #0096cf 100%) !important; color: #ffffff !important; box-shadow: 0 6px 14px rgba(0, 106, 171, 0.3) !important; } .shopee-trust-badges-bar .trust-item:hover .trust-icon { background: linear-gradient(135deg, #ed1c26, #ff5a3c) !important; } .shopee-trust-badges-bar .trust-text h4 { font-size: 13px !important; color: #0f2a43 !important; } .shopee-trust-badges-bar .trust-text p { font-size: 12px !important; color: #64748b !important; } footer { background: linear-gradient(180deg, #0b2540 0%, #081a2e 100%) !important; overflow: hidden !important; } footer::before { content: "" !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } footer .s_top > .container { padding-top: 30px !important; padding-bottom: 18px !important; } footer .s_top .block_default h3.title { display: block !important; font-size: 15px !important; letter-spacing: 0.6px !important; margin: 0 0 18px 0 !important; padding: 0 0 12px 0 !important; border-bottom: 0 !important; position: relative !important; } footer .s_top .block_default h3.title::after { content: "" !important; position: absolute !important; left: 0 !important; bottom: 0 !important; width: 44px !important; height: 3px !important; border-radius: 2px !important; background: linear-gradient(90deg, #0096cf, #ed1c26) !important; } footer .footer-menu ul li { margin-bottom: 10px !important; } footer .footer-menu ul li a, footer a { font-size: 13.5px !important; } footer .footer-menu ul li a:hover, footer a:hover { transform: translateX(4px) !important; } footer .s_content h4 { color: #ffffff !important; font-size: 14px !important; font-weight: 700 !important; margin: 0 0 12px !important; line-height: 1.5 !important; } footer .s_content h4 span { color: #ffffff !important; } footer .s_content p { margin: 0 0 9px !important; font-size: 13.5px !important; line-height: 1.65 !important; } footer .s_content p .fl-ic { display: inline-block !important; width: 18px !important; margin-right: 8px !important; text-align: center !important; color: #ed1c26 !important; font-size: 14px !important; } footer iframe { border-radius: 14px !important; border: 0 !important; filter: saturate(0.95) !important; } footer .footer-col-1 img { background: #ffffff !important; border-radius: 10px !important; padding: 6px 10px !important; margin-top: 10px !important; max-width: 100% !important; height: auto !important; } footer .s_bottom { padding: 18px 0 !important; } footer .s_bottom p { font-size: 13px !important; } @media (max-width: 767px) { .endfooter { margin: 0 !important; } .shopee-trust-badges-bar { display: none !important; } footer { padding-top: 38px !important; } footer .s_top > .container { padding-top: 30px !important; } } footer .footer-row { display: grid !important; grid-template-columns: 1.25fr 1fr 1.25fr !important; gap: 36px !important; margin-left: 0 !important; margin-right: 0 !important; } footer .footer-row::before, footer .footer-row::after { display: none !important; content: none !important; } footer .footer-row > .footer-col { float: none !important; width: auto !important; max-width: none !important; padding-left: 0 !important; padding-right: 0 !important; margin-bottom: 0 !important; min-width: 0 !important; display: flex !important; flex-direction: column !important; } footer .footer-row > .footer-col-1 { display: none !important; } footer .footer-row > .footer-col-3 { order: 1 !important; } footer .footer-row > .footer-col-2 { order: 2 !important; } footer .footer-row > .footer-col-4 { order: 3 !important; } footer .footer-col-2 .footer-bct img { border-radius: 10px !important; padding: 6px 10px !important; max-width: 100% !important; height: auto !important; display: inline-block !important; } footer .footer-col-4 { padding-top: 0 !important; } footer .footer-col-4 iframe { width: 100% !important; } @media (max-width: 991px) { footer .footer-row { grid-template-columns: 1fr 1fr !important; gap: 28px !important; } footer .footer-row > .footer-col-4 { grid-column: 1 / -1 !important; } } @media (max-width: 575px) { footer .footer-row { grid-template-columns: 1fr !important; } } footer { background: rgba(255, 255, 255, 0.75) !important; backdrop-filter: blur(12px) saturate(160%) !important; -webkit-backdrop-filter: blur(12px) saturate(160%) !important; border-top: 1px solid rgba(255, 255, 255, 0.4) !important; box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.06) !important; color: #4a4a4a !important; padding-top: 60px !important; } footer::before { height: 3px !important; } footer .s_content, footer .s_content p, footer .s_content span, footer .s_content div { color: #4a4a4a !important; } footer .s_top .block_default h3.title { color: #006aab !important; } footer .footer-menu ul li a, footer a { color: #4a4a4a !important; } footer .footer-menu ul li a:hover, footer a:hover { color: #006aab !important; } footer .footer-menu ul li i { color: #006aab !important; } footer .s_content h4, footer .s_content h4 span { color: #0f2a43 !important; } footer .footer-col-2 .footer-bct img { background: #ffffff !important; border: 1px solid #e2e8f0 !important; } footer iframe { box-shadow: 0 6px 18px rgba(0, 0, 0, 0.12) !important; } footer .s_bottom { background: rgba(255, 255, 255, 0.6) !important; border-top: 1px solid rgba(0, 0, 0, 0.06) !important; } footer .s_bottom p { color: #666666 !important; } footer .s_bottom strong { color: #222222 !important; } footer .s_bottom a { color: #006aab !important; } footer .s_bottom a:hover { color: #ed1c26 !important; } footer .footer-row { align-items: start !important; } footer .footer-row > .footer-col-4 { align-self: start !important; } footer .footer-col-4 iframe { flex: 0 0 auto !important; min-height: 0 !important; } .endfooter { height: 0 !important; padding: 0 !important; overflow: visible !important; position: relative !important; z-index: 6 !important; } .endfooter > .container { position: relative !important; height: 0 !important; } .endfooter .shopee-trust-badges-bar { position: absolute !important; left: 0 !important; right: auto !important; width: 100% !important; box-sizing: border-box !important; bottom: 43px !important; transform: translateY(50%) !important; margin: 0 !important; } footer { padding: 65px 20px 0 !important; } footer .footer-social { display: flex !important; flex-wrap: wrap !important; align-items: center !important; justify-content: center !important; gap: 10px 22px !important; margin-top: 24px !important; } footer .footer-social .fs-btn { display: inline-flex !important; align-items: center !important; gap: 9px !important; padding: 0 !important; background: none !important; box-shadow: none !important; border: 0 !important; height: auto !important; text-decoration: none !important; transition: transform 0.2s ease !important; } footer .footer-social .fs-btn:hover { transform: translateY(-2px) !important; } footer .footer-social .fs-ic { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 36px !important; height: 36px !important; flex: 0 0 36px !important; border-radius: 50% !important; color: #ffffff !important; font-size: 16px !important; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.18) !important; transition: box-shadow 0.2s ease !important; } footer .footer-social .fs-btn:hover .fs-ic { box-shadow: 0 8px 16px rgba(0, 0, 0, 0.28) !important; } footer .footer-social .fs-ic i { color: #ffffff !important; font-size: 16px !important; margin: 0 !important; } footer .footer-social .fs-text { color: #334155 !important; font-size: 13.5px !important; font-weight: 600 !important; line-height: 1 !important; } footer .footer-social .fs-btn:hover .fs-text { color: #006aab !important; } footer .footer-social .fs-facebook .fs-ic { background: #1877f2 !important; } footer .footer-social .fs-shopee .fs-ic { background: #ee4d2d !important; } footer .footer-social .fs-lazada .fs-ic { background: #ffffff url("../images/lazada-icon.png") center / 22px 22px no-repeat !important; border: 1px solid #e2e8f0 !important; } .home-block-viewall-wrap { display: flex !important; justify-content: center !important; align-items: center !important; margin-top: 14px !important; position: relative !important; z-index: 5 !important; } .btn-home-block-viewall { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 6px !important; border-radius: 999px !important; padding: 9px 28px !important; font-size: 13.5px !important; font-weight: 600 !important; color: #006aab !important; background: #ffffff !important; border: 1.5px solid rgba(0, 106, 171, 0.35) !important; box-shadow: 0 2px 8px rgba(0, 106, 171, 0.08) !important; text-decoration: none !important; transition: all 0.25s ease !important; line-height: 1.3 !important; } .btn-home-block-viewall i { font-size: 15px !important; transition: transform 0.25s ease !important; } .btn-home-block-viewall:hover, .btn-home-block-viewall:focus { background: linear-gradient(90deg, #464288 0%, #006aab 50%, #0096cf 100%) !important; color: #ffffff !important; border-color: transparent !important; box-shadow: 0 5px 15px rgba(0, 106, 171, 0.28) !important; transform: translateY(-1px) !important; text-decoration: none !important; } .btn-home-block-viewall:hover i { transform: translateX(3px) !important; } @media (max-width: 767px) { html, body { overflow-x: hidden !important; width: 100% !important; } .show_hotline { display: none !important; } body, body.intro { background-attachment: fixed !important; background-position: center top !important; background-repeat: no-repeat !important; background-size: cover !important; -webkit-background-size: cover !important; min-height: 100vh !important; padding-bottom: 0 !important; } body.has-detail-bottom-bar { padding-bottom: 0 !important; } header { position: sticky !important; top: 0 !important; z-index: 1020 !important; background: rgba(255, 255, 255, 0.98) !important; backdrop-filter: blur(14px) !important; -webkit-backdrop-filter: blur(14px) !important; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06) !important; } body.mobile-menu-open header { z-index: 99999 !important; } header .topbar { display: none !important; } .header-middle-container { display: flex !important; flex-wrap: nowrap !important; flex-direction: row !important; align-items: center !important; justify-content: space-between !important; gap: 0 !important; padding: 6px 8px !important; min-height: 50px !important; width: 100% !important; box-sizing: border-box !important; overflow: hidden !important; } .header-middle-container:before, .header-middle-container:after { display: none !important; content: none !important; } header .logo { order: 1 !important; flex: 0 0 36px !important; width: 36px !important; max-width: 36px !important; min-width: 36px !important; height: 36px !important; text-align: left !important; margin: 0 !important; padding: 0 !important; line-height: 1 !important; display: flex !important; align-items: center !important; justify-content: center !important; box-sizing: border-box !important; } header .logo a { display: flex !important; align-items: center !important; justify-content: center !important; width: 36px !important; height: 36px !important; margin: 0 !important; padding: 0 !important; } header .logo img { width: 36px !important; height: 36px !important; max-width: 36px !important; max-height: 36px !important; object-fit: contain !important; margin: 0 !important; display: block !important; } .headtop-search-area { order: 2 !important; flex: 1 1 auto !important; min-width: 0 !important; margin-left: 15px !important; margin-right: 15px !important; margin-top: 0 !important; margin-bottom: 0 !important; padding: 0 !important; width: auto !important; max-width: none !important; box-sizing: border-box !important; display: flex !important; align-items: center !important; justify-content: center !important; overflow: hidden !important; } .header-with-search__search-section { margin: 0 !important; padding: 0 !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; position: static !important; display: block !important; box-sizing: border-box !important; } header .headtop-search-area .block_default, header .headtop-search-area .s_content, header .headtop-search-area .block_default .s_content { margin: 0 !important; padding: 0 !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; display: block !important; box-sizing: border-box !important; } .headtop-search-area .shopee-searchbar, #search_form_shops.shopee-searchbar, #search_form_shops { margin: 0 !important; background: #f1f5f9 !important; border: 1.5px solid #e2e8f0 !important; border-radius: 999px !important; padding: 0 4px 0 12px !important; height: 36px !important; max-height: 36px !important; min-height: 36px !important; display: flex !important; align-items: center !important; justify-content: space-between !important; box-sizing: border-box !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; transition: all 0.2s ease !important; overflow: hidden !important; } .headtop-search-area .shopee-searchbar:focus-within, #search_form_shops:focus-within { border-color: #006aab !important; background: #ffffff !important; box-shadow: 0 0 0 3px rgba(0, 106, 171, 0.12) !important; } .headtop-search-area .shopee-searchbar-main { height: 100% !important; flex: 1 1 auto !important; min-width: 0 !important; display: flex !important; align-items: center !important; } .headtop-search-area .shopee-searchbar-input, .shopee-searchbar-input { height: 100% !important; flex: 1 1 auto !important; min-width: 0 !important; display: flex !important; align-items: center !important; padding: 0 !important; margin: 0 !important; background: transparent !important; } .headtop-search-area .shopee-searchbar-input__input, .shopee-searchbar-input__input, #keyword { font-size: 12.5px !important; height: 100% !important; line-height: normal !important; width: 100% !important; padding: 0 4px 0 0 !important; margin: 0 !important; background: transparent !important; border: none !important; outline: none !important; color: #1e293b !important; flex: 1 1 auto !important; min-width: 0 !important; box-shadow: none !important; } .headtop-search-area .shopee-searchbar-input__input::placeholder, .shopee-searchbar-input__input::placeholder, #keyword::placeholder { font-weight: 300 !important; } .headtop-search-area .shopee-searchbar-input__input::-webkit-input-placeholder, .shopee-searchbar-input__input::-webkit-input-placeholder, #keyword::-webkit-input-placeholder { font-weight: 300 !important; } .headtop-search-area .shopee-searchbar-input__input::-moz-placeholder, .shopee-searchbar-input__input::-moz-placeholder, #keyword::-moz-placeholder { font-weight: 300 !important; } .headtop-search-area .shopee-searchbar-input__input:-ms-input-placeholder, .shopee-searchbar-input__input:-ms-input-placeholder, #keyword:-ms-input-placeholder { font-weight: 300 !important; } .headtop-search-area .btn-shopee-search, .headtop-search-area .shopee-searchbar__search-button, #search_form_shops .shopee-searchbar__search-button, #search_form_shops #submit { width: 30px !important; height: 30px !important; min-width: 30px !important; max-width: 30px !important; min-height: 30px !important; max-height: 30px !important; border-radius: 50% !important; aspect-ratio: 1 / 1 !important; background: #ed1c26 !important; color: #ffffff !important; display: flex !important; align-items: center !important; justify-content: center !important; border: none !important; padding: 0 !important; margin: 0 !important; box-shadow: 0 1px 4px rgba(237, 28, 38, 0.25) !important; flex: 0 0 30px !important; flex-shrink: 0 !important; cursor: pointer !important; box-sizing: border-box !important; } .headtop-search-area .btn-shopee-search svg, .headtop-search-area .shopee-searchbar__search-button svg, #search_form_shops #submit svg, .shopee-svg-search { width: 14px !important; height: 14px !important; min-width: 14px !important; min-height: 14px !important; display: block !important; margin: auto !important; } .headtop-search-area .shopee-searchbar-hints, .header-with-search__search-section > .shopee-searchbar-hints { display: none !important; } header .header-cart-area { display: none !important; width: 0 !important; height: 0 !important; min-width: 0 !important; max-width: 0 !important; padding: 0 !important; margin: 0 !important; flex: 0 0 0 !important; overflow: hidden !important; } .wishlist-icon-svg, .cart-wishlist-btn, #wishlist_num_id, .s_cart a.cart-wishlist-btn, .s_cart .wishlist-icon-svg, .s_cart #wishlist_num_id { display: none !important; } .btn-mobile-menu-toggle { display: inline-flex !important; order: 3 !important; flex: 0 0 36px !important; width: 36px !important; height: 36px !important; min-width: 36px !important; max-width: 36px !important; background: #f8fafc !important; border: 1px solid #e2e8f0 !important; border-radius: 9px !important; align-items: center !important; justify-content: center !important; cursor: pointer !important; padding: 0 !important; margin: 0 !important; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important; transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1) !important; -webkit-tap-highlight-color: transparent !important; z-index: 5 !important; box-sizing: border-box !important; } .btn-mobile-menu-toggle:active { background: #edf2f7 !important; transform: scale(0.95) !important; } .btn-mobile-menu-toggle .hamburger-box { width: 18px !important; height: 13px !important; position: relative !important; display: flex !important; flex-direction: column !important; justify-content: space-between !important; align-items: flex-end !important; } .btn-mobile-menu-toggle .hamburger-bar { display: block !important; height: 2px !important; background: linear-gradient(90deg, #0096cf, #ed1c26) !important; border-radius: 999px !important; transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s ease, width 0.2s ease, background 0.25s ease !important; transform-origin: center right !important; } .btn-mobile-menu-toggle .hamburger-bar.bar-top { width: 100% !important; } .btn-mobile-menu-toggle .hamburger-bar.bar-mid { width: 60% !important; } .btn-mobile-menu-toggle .hamburger-bar.bar-bot { width: 82% !important; } .btn-mobile-menu-toggle.is-active { background: #fee2e2 !important; border-color: #fecaca !important; } .btn-mobile-menu-toggle.is-active .hamburger-box { align-items: center !important; } .btn-mobile-menu-toggle.is-active .bar-top { width: 100% !important; transform: translateY(5.5px) rotate(45deg) !important; transform-origin: center !important; background: #ed1c26 !important; } .btn-mobile-menu-toggle.is-active .bar-mid { opacity: 0 !important; transform: scaleX(0) !important; } .btn-mobile-menu-toggle.is-active .bar-bot { width: 100% !important; transform: translateY(-5.5px) rotate(-45deg) !important; transform-origin: center !important; background: #ed1c26 !important; } header .mainmenu { height: 0 !important; min-height: 0 !important; background: transparent !important; padding: 0 !important; margin: 0 !important; border: 0 !important; overflow: visible !important; } header .mainmenu .container, header .mainmenu .sleft { padding: 0 !important; margin: 0 !important; } header .mainmenu .navbar { margin: 0 !important; border: none !important; min-height: 0 !important; } header .mainmenu .navbar-header { display: none !important; } .navbar-collapse, body > .navbar-collapse { position: fixed !important; top: 0 !important; right: 0 !important; left: auto !important; bottom: 0 !important; width: 82% !important; max-width: 320px !important; height: 100vh !important; max-height: 100vh !important; background: #ffffff !important; z-index: 99999 !important; box-shadow: -6px 0 28px rgba(0, 0, 0, 0.25) !important; transform: translateX(105%) !important; transition: transform 0.3s cubic-bezier(0.25, 1, 0.5, 1) !important; overflow-y: auto !important; -webkit-overflow-scrolling: touch !important; display: block !important; padding: 0 !important; margin: 0 !important; border: none !important; opacity: 1 !important; filter: none !important; } body.mobile-menu-open .navbar-collapse, body.mobile-menu-open > .navbar-collapse { transform: translateX(0) !important; opacity: 1 !important; filter: none !important; } .mobile-menu-backdrop { position: fixed !important; top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important; width: 100% !important; height: 100% !important; background: rgba(15, 23, 42, 0.6) !important; backdrop-filter: blur(4px) !important; -webkit-backdrop-filter: blur(4px) !important; z-index: 99998 !important; opacity: 0 !important; visibility: hidden !important; transition: opacity 0.28s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.28s ease !important; pointer-events: none !important; } body.mobile-menu-open { overflow: hidden !important; } body.mobile-menu-open .mobile-menu-backdrop { opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; } .mobile-drawer-header { display: flex !important; align-items: center !important; justify-content: space-between !important; padding: 15px 18px !important; background: linear-gradient(135deg, #006aab 0%, #0088cc 100%) !important; color: #ffffff !important; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important; position: sticky !important; top: 0 !important; z-index: 10 !important; } .mobile-drawer-header .drawer-title { display: flex !important; align-items: center !important; gap: 10px !important; font-size: 15px !important; font-weight: 700 !important; letter-spacing: 0.3px !important; color: #ffffff !important; } .mobile-drawer-header .drawer-title i { font-size: 16px !important; } .mobile-drawer-header .btn-drawer-close { background: rgba(255, 255, 255, 0.18) !important; border: none !important; width: 32px !important; height: 32px !important; border-radius: 50% !important; display: flex !important; align-items: center !important; justify-content: center !important; color: #ffffff !important; font-size: 15px !important; cursor: pointer !important; transition: background-color 0.2s ease !important; padding: 0 !important; } .mobile-drawer-header .btn-drawer-close:active { background: rgba(255, 255, 255, 0.32) !important; } #main-menu.sm-blue { padding: 6px 0 40px 0 !important; margin: 0 !important; list-style: none !important; background: #ffffff !important; border: none !important; } #main-menu.sm-blue > li { border-bottom: 1px solid #f1f5f9 !important; margin: 0 !important; position: relative !important; } #main-menu.sm-blue > li > a { display: flex !important; align-items: center !important; justify-content: space-between !important; padding: 13px 18px !important; color: #1e293b !important; font-size: 14px !important; font-weight: 600 !important; text-decoration: none !important; background: transparent !important; background-image: none !important; transition: background-color 0.15s ease, color 0.15s ease !important; } #main-menu.sm-blue > li > a:active, #main-menu.sm-blue > li > a:hover { background-color: #f8fafc !important; color: #006aab !important; background-image: none !important; } #main-menu.sm-blue > li.active > a, #main-menu.sm-blue > li.current > a { color: #006aab !important; background: #f0f7fc !important; background-image: none !important; font-weight: 700 !important; } #main-menu.sm-blue ul { background: #f8fafc !important; padding: 4px 0 !important; margin: 0 !important; border-top: 1px solid #edf2f7 !important; list-style: none !important; } #main-menu.sm-blue ul li a { padding: 11px 18px 11px 32px !important; font-size: 13.5px !important; font-weight: 500 !important; color: #475569 !important; border-bottom: 1px dashed #e2e8f0 !important; display: block !important; text-decoration: none !important; } #main-menu.sm-blue ul li:last-child a { border-bottom: none !important; } #main-menu.sm-blue .sub-arrow { width: 32px !important; height: 32px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; color: #94a3b8 !important; font-size: 14px !important; } .mobile-drawer-hints-wrapper { display: block !important; padding: 16px 18px 32px !important; border-top: 8px solid #f1f5f9 !important; background: #ffffff !important; } .mobile-drawer-hints-wrapper .drawer-hints-title { display: flex !important; align-items: center !important; gap: 8px !important; font-size: 13px !important; font-weight: 700 !important; color: #0f2a43 !important; text-transform: uppercase !important; letter-spacing: 0.3px !important; margin-bottom: 12px !important; } .mobile-drawer-hints-wrapper .drawer-hints-title i { color: #ed1c26 !important; font-size: 13px !important; } .mobile-drawer-hints-wrapper .shopee-searchbar-hints, .navbar-collapse .mobile-drawer-hints, body > .navbar-collapse .mobile-drawer-hints { display: flex !important; flex-wrap: wrap !important; gap: 8px 6px !important; padding: 0 !important; margin: 0 !important; justify-content: flex-start !important; width: 100% !important; height: auto !important; visibility: visible !important; opacity: 1 !important; } .mobile-drawer-hints-wrapper .shopee-searchbar-hints a, .navbar-collapse .mobile-drawer-hints a, body > .navbar-collapse .mobile-drawer-hints a { display: inline-flex !important; align-items: center !important; padding: 6px 12px !important; background: #f8fafc !important; border: 1px solid #e2e8f0 !important; border-radius: 999px !important; color: #334155 !important; font-size: 12.5px !important; font-weight: 500 !important; text-decoration: none !important; line-height: normal !important; transition: all 0.18s ease !important; } .mobile-drawer-hints-wrapper .shopee-searchbar-hints a:active, .mobile-drawer-hints-wrapper .shopee-searchbar-hints a:hover, .navbar-collapse .mobile-drawer-hints a:active, .navbar-collapse .mobile-drawer-hints a:hover, body > .navbar-collapse .mobile-drawer-hints a:active, body > .navbar-collapse .mobile-drawer-hints a:hover { background: #fef2f2 !important; border-color: #fecaca !important; color: #ed1c26 !important; } .grid_item .row, .category-products-grid .row, .product_hero_grid .row, .shops-cards-grid { display: flex !important; flex-wrap: wrap !important; margin-left: -5px !important; margin-right: -5px !important; } .grid_item .col-xs-12, .col-xs-12.col-sm-12.col-md-6, .col-xs-12.col-sm-12.col-md-4, .col-xs-12.col-sm-12.col-md-3, .product-card-col { width: 50% !important; max-width: 50% !important; flex: 0 0 50% !important; padding-left: 5px !important; padding-right: 5px !important; margin-bottom: 10px !important; float: left !important; } .grid_item .item, .product-card-shopee, .product-hero-card { height: 100% !important; display: flex !important; flex-direction: column !important; background: #ffffff !important; border: 1px solid #f1f5f9 !important; border-radius: 10px !important; overflow: hidden !important; padding: 6px !important; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important; transition: transform 0.2s ease, box-shadow 0.2s ease !important; } .grid_item .item .s_image, .product-card-shopee .product-card-thumb, .product-hero-card .product-hero-thumb { position: relative !important; width: 100% !important; aspect-ratio: 1 / 1 !important; height: auto !important; max-height: none !important; border-radius: 8px !important; overflow: hidden !important; background: #f8fafc !important; margin-bottom: 8px !important; } .grid_item .item .s_image img, .product-card-shopee .product-card-thumb img, .product-hero-card .product-hero-thumb img { width: 100% !important; height: 100% !important; object-fit: contain !important; transition: transform 0.3s ease !important; } .grid_item .item .s_content, .product-card-shopee .product-card-body, .product-hero-card .product-hero-info { display: flex !important; flex-direction: column !important; flex: 1 1 auto !important; padding: 0 2px !important; } .grid_item .item .p_title, .product-card-shopee .product-card-name, .product-hero-card .product-hero-name { font-size: 13px !important; font-weight: 500 !important; line-height: 1.35 !important; color: #1e293b !important; height: 35px !important; margin: 0 0 6px 0 !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; text-overflow: ellipsis !important; } .grid_item .item .p_title a, .product-card-shopee .product-card-name a, .product-hero-card .product-hero-name a { color: inherit !important; text-decoration: none !important; } .grid_item .item .p_price, .product-card-shopee .product-card-price-row, .product-hero-card .product-hero-price { display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 2px !important; margin-top: auto !important; margin-bottom: 8px !important; } .grid_item .item .p_price .money, .product-card-shopee .price-current, .product-hero-card .price-current { font-size: 14px !important; font-weight: 700 !important; color: #ed1c26 !important; line-height: 1.2 !important; } .grid_item .item .p_price .discounts_money, .product-card-shopee .price-old, .product-hero-card .price-old { font-size: 11px !important; color: #94a3b8 !important; text-decoration: line-through !important; } .grid_item .item .label-discount, .product-card-shopee .card-badge-discount { position: absolute !important; top: 5px !important; right: 5px !important; background: #ed1c26 !important; color: #ffffff !important; font-size: 10px !important; font-weight: 700 !important; padding: 2px 5px !important; border-radius: 4px !important; z-index: 2 !important; line-height: 1.1 !important; } .grid_item .item .product-card-buttons { display: flex !important; gap: 4px !important; margin-top: auto !important; } .grid_item .item .product-card-buttons .btn-card-action { height: 32px !important; padding: 0 8px !important; font-size: 11px !important; border-radius: 6px !important; } .grid_item .item .product-card-buttons .btn-add-cart { flex: 0 0 32px !important; width: 32px !important; padding: 0 !important; } .grid_item .item .product-card-buttons .btn-buy-now { flex: 1 1 auto !important; } .shopee-trust-badges-bar { display: none !important; } footer { display: block !important; padding-top: 30px !important; padding-bottom: 0 !important; margin-bottom: 0 !important; background: rgba(255, 255, 255, 0.78) !important; backdrop-filter: blur(14px) saturate(180%) !important; -webkit-backdrop-filter: blur(14px) saturate(180%) !important; } footer .s_bottom { background: rgba(255, 255, 255, 0.85) !important; backdrop-filter: blur(14px) saturate(180%) !important; -webkit-backdrop-filter: blur(14px) saturate(180%) !important; border-top: 1px solid rgba(0, 0, 0, 0.06) !important; padding-top: 16px !important; padding-bottom: calc(76px + env(safe-area-inset-bottom, 0px)) !important; margin: 0 !important; } body.has-detail-bottom-bar footer .s_bottom { padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px)) !important; } footer .footer-row { display: flex !important; flex-direction: column !important; gap: 22px !important; } footer .footer-col-3 { order: 1 !important; } footer .footer-col-2 { order: 2 !important; } footer .footer-col-4 { order: 3 !important; } footer .footer-col-2 .footer-bct img { max-width: 140px !important; height: auto !important; } footer .footer-social, .footer-social { display: none !important; } .footer-menu ul li a { padding: 0 !important; } body:has(#detail) .mobile-bottom-nav, body.has-detail-bottom-bar .mobile-bottom-nav { display: none !important; } .mobile-bottom-nav { display: flex !important; position: fixed !important; bottom: 0 !important; left: 0 !important; right: 0 !important; width: 100% !important; height: 60px !important; background: rgba(255, 255, 255, 0.98) !important; backdrop-filter: blur(14px) saturate(180%) !important; -webkit-backdrop-filter: blur(14px) saturate(180%) !important; border-top: 1px solid rgba(0, 0, 0, 0.08) !important; box-shadow: 0 -3px 18px rgba(0, 0, 0, 0.08) !important; z-index: 9990 !important; align-items: center !important; justify-content: space-around !important; padding: 0 4px !important; box-sizing: border-box !important; } .mobile-bottom-nav .mb-nav-item { flex: 1 1 0 !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; height: 100% !important; color: #475569 !important; text-decoration: none !important; font-size: 10.5px !important; font-weight: 600 !important; line-height: 1.2 !important; gap: 3px !important; transition: color 0.2s ease, transform 0.15s ease !important; -webkit-tap-highlight-color: transparent !important; position: relative !important; } .mobile-bottom-nav .mb-nav-icon-wrap { width: 24px !important; height: 24px !important; display: flex !important; align-items: center !important; justify-content: center !important; } .mobile-bottom-nav .mb-nav-item i { font-size: 22px !important; line-height: 1 !important; } .mobile-bottom-nav .mb-nav-shopee i { color: #ee4d2d !important; font-size: 22px !important; line-height: 1 !important; } .mobile-bottom-nav .mb-nav-shopee:active span { color: #ee4d2d !important; } .mobile-bottom-nav .mb-nav-lazada .mb-nav-icon-wrap { background: transparent !important; border: none !important; padding: 0 !important; box-sizing: border-box !important; } .mobile-bottom-nav .mb-nav-lazada .mb-nav-icon-wrap img { width: 22px !important; height: 22px !important; max-width: 100% !important; max-height: 100% !important; object-fit: contain !important; display: block !important; } .mobile-bottom-nav .mb-nav-lazada:active span { color: #f15a24 !important; } .mobile-bottom-nav .mb-nav-facebook i { color: #1877f2 !important; font-size: 22px !important; line-height: 1 !important; } .mobile-bottom-nav .mb-nav-facebook:active span { color: #1877f2 !important; } .mobile-bottom-nav .mb-nav-center-hotline { flex: 0 0 72px !important; position: relative !important; margin-top: -22px !important; height: 100% !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; text-decoration: none !important; z-index: 10 !important; } .mobile-bottom-nav .center-hotline-btn { width: 60px !important; height: 60px !important; min-width: 60px !important; min-height: 60px !important; max-width: 60px !important; max-height: 60px !important; flex: 0 0 60px !important; flex-shrink: 0 !important; aspect-ratio: 1 / 1 !important; border-radius: 50% !important; background: linear-gradient(90deg, #464288 0%, #006aab 50%, #0096cf 100%) !important; color: #ffffff !important; display: flex !important; align-items: center !important; justify-content: center !important; box-shadow: 0 4px 16px rgba(0, 106, 171, 0.45) !important; border: 3.5px solid #ffffff !important; box-sizing: border-box !important; transition: transform 0.18s ease, box-shadow 0.18s ease !important; animation: hotline-pulse 2s infinite !important; } .mobile-bottom-nav .center-hotline-btn i { font-size: 24px !important; color: #ffffff !important; animation: hotline-wiggle 3s infinite ease-in-out !important; } .mobile-bottom-nav .mb-nav-center-hotline:active .center-hotline-btn { transform: scale(0.92) !important; } .mobile-bottom-nav .mb-nav-center-hotline .hotline-text { display: none !important; } @keyframes hotline-pulse { 0% { box-shadow: 0 0 0 0 rgba(0, 106, 171, 0.6); } 70% { box-shadow: 0 0 0 10px rgba(0, 106, 171, 0); } 100% { box-shadow: 0 0 0 0 rgba(0, 106, 171, 0); } } @keyframes hotline-wiggle { 0%, 80%, 100% { transform: rotate(0deg); } 85% { transform: rotate(-15deg); } 90% { transform: rotate(15deg); } 95% { transform: rotate(-10deg); } } .mobile-bottom-nav .mb-cart-icon-wrap { position: relative !important; width: 24px !important; height: 24px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; } .mobile-bottom-nav .mb-cart-icon-wrap .cart-btn-icon { width: 20px !important; height: 20px !important; color: rgb(0, 106, 171) !important; stroke: rgb(0, 106, 171) !important; display: block !important; transition: color 0.2s ease, stroke 0.2s ease !important; } .mobile-bottom-nav .mb-cart-icon-wrap .cart-btn-icon circle { fill: rgb(0, 106, 171) !important; stroke: none !important; } .mobile-bottom-nav .mb-cart-icon-wrap .cart-btn-icon path { stroke: rgb(0, 106, 171) !important; } .mobile-bottom-nav .mb-nav-cart:active .cart-btn-icon, .mobile-bottom-nav .mb-nav-cart:active span { color: #006aab !important; } .mobile-bottom-nav .mb-cart-badge { position: absolute !important; top: -6px !important; right: -10px !important; background: #ed1c26 !important; color: #ffffff !important; border-radius: 999px !important; font-size: 10px !important; font-weight: 700 !important; padding: 1px 5px !important; min-width: 16px !important; height: 16px !important; line-height: 14px !important; text-align: center !important; border: 1.5px solid #ffffff !important; box-sizing: border-box !important; } .mobile-sticky-buy-bar { display: flex !important; position: fixed !important; bottom: 10px !important; left: auto !important; right: 8px !important; width: auto !important; max-width: calc(100% - 16px) !important; height: auto !important; background: transparent !important; background-color: transparent !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; border: none !important; border-top: none !important; box-shadow: none !important; z-index: 9995 !important; align-items: center !important; justify-content: flex-end !important; padding: 0 !important; margin: 0 !important; gap: 8px !important; box-sizing: border-box !important; pointer-events: none !important; } .mobile-sticky-buy-bar > * { pointer-events: auto !important; } .mobile-sticky-buy-bar .btn-sticky-contact { flex: 0 0 44px !important; width: 44px !important; min-width: 44px !important; max-width: 44px !important; height: 44px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; text-decoration: none !important; border-radius: 8px !important; background: #ffffff !important; border: 1px solid #cbd5e1 !important; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12) !important; padding: 0 !important; margin: 0 !important; box-sizing: border-box !important; transition: all 0.2s ease !important; } .mobile-sticky-buy-bar .btn-sticky-contact span { display: none !important; } .mobile-sticky-buy-bar .btn-sticky-contact i { font-size: 18px !important; color: #006aab !important; margin: 0 !important; } .mobile-sticky-buy-bar .btn-sticky-contact[href*="zalo"], .mobile-sticky-buy-bar .btn-sticky-contact:has(.zalo-badge) { display: none !important; } .mobile-sticky-buy-bar .btn-sticky-contact:hover, .mobile-sticky-buy-bar .btn-sticky-contact:active { background: #f1f5f9 !important; color: #006aab !important; transform: translateY(-1px) !important; } .mobile-sticky-buy-bar .btn-sticky-action { height: 44px !important; border: 0 !important; border-radius: 8px !important; font-weight: 700 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; text-decoration: none !important; cursor: pointer !important; transition: transform 0.15s ease, filter 0.2s ease !important; -webkit-tap-highlight-color: transparent !important; box-sizing: border-box !important; } .mobile-sticky-buy-bar .btn-sticky-add-cart { flex: 0 0 44px !important; width: 44px !important; min-width: 44px !important; max-width: 44px !important; height: 44px !important; background: #ffffff !important; color: #006aab !important; border: 1.5px solid #006aab !important; box-shadow: 0 2px 8px rgba(0, 106, 171, 0.18) !important; padding: 0 !important; margin: 0 !important; } .mobile-sticky-buy-bar .btn-sticky-add-cart span { display: none !important; } .mobile-sticky-buy-bar .btn-sticky-add-cart i { font-size: 18px !important; margin: 0 !important; } .mobile-sticky-buy-bar .btn-sticky-add-cart:hover, .mobile-sticky-buy-bar .btn-sticky-add-cart:active { background: #f0f7fc !important; transform: translateY(-1px) !important; } .mobile-sticky-buy-bar .btn-sticky-buy-now { flex: 0 0 auto !important; width: auto !important; min-width: 130px !important; height: 44px !important; padding: 0 22px !important; background: linear-gradient(135deg, #ed1c26 0%, #ff5238 100%) !important; color: #ffffff !important; font-size: 13.5px !important; letter-spacing: 0.3px !important; box-shadow: 0 4px 14px rgba(237, 28, 38, 0.38) !important; white-space: nowrap !important; margin: 0 !important; } .mobile-sticky-buy-bar .btn-sticky-buy-now:hover, .mobile-sticky-buy-bar .btn-sticky-buy-now:active { filter: brightness(1.08) !important; transform: translateY(-1px) !important; } .mobile-sticky-buy-bar .btn-sticky-disabled { flex: 0 0 auto !important; width: auto !important; min-width: 140px !important; height: 44px !important; padding: 0 20px !important; background: #94a3b8 !important; color: #ffffff !important; font-size: 13.5px !important; cursor: not-allowed !important; white-space: nowrap !important; margin: 0 !important; } .slides_inhome, .hero-slider-left, .bx-wrapper, .bx-viewport { max-width: 100% !important; } .slides_inhome img { width: 100% !important; height: auto !important; object-fit: cover !important; } #back-to-top { bottom: 70px !important; } } @media (max-width: 768px) { .block_border:before { background-image: none !important; } .block_border { margin: 20px 0 !important; padding: 0 0 12px !important; } .block_border .s_content { padding: 5px 10px 10px !important; } .product_bxslider .item .i_image, .product_bxslider .item .i_image a, .product_bxslider .item .i_image img { height: 132px !important; max-height: 132px !important; min-height: 132px !important; object-fit: contain !important; } .product_bxslider .item .i_content { padding: 8px !important; } .product_bxslider .product-card-buttons { display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; align-items: center !important; gap: 6px !important; width: 100% !important; margin-top: 6px !important; } .product_bxslider .product-card-buttons .btn-card-action.btn-add-cart { flex: 0 0 38px !important; width: 38px !important; min-width: 38px !important; max-width: 38px !important; min-height: 32px !important; height: 32px !important; padding: 0 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; } .product_bxslider .product-card-buttons .btn-card-action.btn-add-cart span { display: none !important; } .product_bxslider .product-card-buttons .btn-card-action.btn-add-cart .cart-btn-icon { margin: 0 !important; width: 15px !important; height: 15px !important; } .product_bxslider .product-card-buttons .btn-card-action.btn-buy-now { flex: 1 1 auto !important; width: auto !important; max-width: none !important; min-height: 32px !important; height: 32px !important; padding: 0 6px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; font-size: 11px !important; } .product_horizontal_promo { padding: 2px 0 6px !important; } .product_horizontal_promo .promo-card-image { width: 130px !important; min-width: 130px !important; max-width: 130px !important; height: 130px !important; } .product_horizontal_promo .promo-card-image img { width: 100% !important; height: 100% !important; object-fit: cover !important; } .product_horizontal_promo .promo-card-desc { display: none !important; } .product_horizontal_promo .promo-card-buttons { display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; align-items: center !important; width: 100% !important; gap: 6px !important; margin-top: 4px !important; } .product_horizontal_promo .promo-card-buttons .promo-btn-cart { flex: 0 0 38px !important; width: 38px !important; min-width: 38px !important; max-width: 38px !important; min-height: 32px !important; height: 32px !important; padding: 0 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; } .product_horizontal_promo .promo-card-buttons .promo-btn-cart span { display: none !important; } .product_horizontal_promo .promo-card-buttons .promo-btn-cart .cart-btn-icon { margin: 0 !important; width: 15px !important; height: 15px !important; } .product_horizontal_promo .promo-card-buttons .promo-btn-buy { flex: 1 1 auto !important; width: auto !important; max-width: none !important; min-height: 32px !important; height: 32px !important; padding: 0 10px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; font-size: 11px !important; } .product-hero-grid-container { grid-template-columns: repeat(2, 1fr) !important; grid-template-rows: auto !important; gap: 8px !important; margin: 4px 0 8px !important; } .phg-card.is-hero-item { grid-column: 1 / -1 !important; grid-row: auto !important; } .phg-card.is-hero-item .phg-card-inner { flex-direction: column !important; align-items: stretch !important; padding: 12px !important; } .phg-card.is-hero-item .phg-image-wrap { width: 100% !important; min-width: 0 !important; height: 200px !important; max-height: 200px !important; margin-bottom: 10px !important; } .phg-card.is-hero-item .phg-image-wrap img { max-height: 190px !important; object-fit: contain !important; } .phg-card.is-hero-item .phg-info-wrap { margin-top: 0 !important; width: 100% !important; } .phg-card.is-hero-item .phg-desc { display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; margin: 0 0 8px !important; } .phg-actions { display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; align-items: center !important; gap: 6px !important; width: 100% !important; margin-top: 6px !important; } .phg-actions .phg-btn-cart { flex: 0 0 38px !important; width: 38px !important; min-width: 38px !important; max-width: 38px !important; min-height: 32px !important; height: 32px !important; padding: 0 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; } .phg-actions .phg-btn-cart span { display: none !important; } .phg-actions .phg-btn-cart .cart-btn-icon { margin: 0 !important; width: 15px !important; height: 15px !important; } .phg-actions .phg-btn-buy { flex: 1 1 auto !important; width: auto !important; max-width: none !important; min-height: 32px !important; height: 32px !important; padding: 0 6px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; font-size: 11px !important; } .phg-card.is-grid-item .phg-card-inner { padding: 8px !important; } .phg-card.is-grid-item .phg-image-wrap { height: 120px !important; max-height: 120px !important; } .phg-card.is-grid-item .phg-image-wrap img { max-height: 110px !important; object-fit: contain !important; } .phg-card.is-grid-item .phg-desc { display: none !important; } .home-block-viewall-wrap { justify-content: flex-start !important; text-align: left !important; margin-top: 10px !important; padding-left: 2px !important; } #category { background: transparent !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; border: none !important; box-shadow: none !important; padding-left: 0 !important; padding-right: 0 !important; } #category .c_header .category-top-row { position: relative !important; display: flex !important; flex-direction: column !important; gap: 8px !important; padding: 0 !important; margin: 0 !important; } #category .c_header .category-header-left { width: 100% !important; padding-right: 95px !important; padding-left: 0 !important; display: flex !important; align-items: center !important; justify-content: flex-start !important; min-height: 75px !important; position: static !important; box-sizing: border-box !important; } #category .category-title-box { width: auto !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; display: flex !important; align-items: center !important; justify-content: flex-start !important; } #category .category-title-box .category-name { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 220px !important; max-width: 100% !important; height: 75px !important; min-height: 75px !important; background-image: url(../images/title-bg-block.png) !important; background-repeat: no-repeat !important; background-position: center center !important; background-size: 100% 100% !important; font-size: 14.5px !important; font-weight: 700 !important; color: #ffffff !important; text-transform: uppercase !important; text-align: center !important; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45) !important; padding: 20px 32px 8px 12px !important; margin: 0 !important; box-sizing: border-box !important; overflow: hidden !important; line-height: 1.2 !important; } #category .category-title-box .category-name a { color: #ffffff !important; text-decoration: none !important; } #category .sort-toolbar-count { position: absolute !important; top: 0 !important; right: 0 !important; height: 75px !important; width: auto !important; border: none !important; padding: 0 !important; margin: 0 !important; display: inline-flex !important; align-items: center !important; justify-content: flex-end !important; z-index: 10 !important; } #category .sort-toolbar-count .category-product-count { font-size: 11.5px !important; color: #475569 !important; white-space: nowrap !important; background: #f1f5f9 !important; padding: 4px 8px !important; border-radius: 12px !important; border: 1px solid #e2e8f0 !important; line-height: 1.2 !important; } #category .sort-toolbar-count .category-product-count strong { color: #ed1c26 !important; font-weight: 700 !important; } #category .c_header .category-header-right { position: static !important; width: 100% !important; margin: 0 !important; padding: 0 !important; } #category .category-sort-toolbar { position: static !important; display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; align-items: center !important; justify-content: space-between !important; gap: 8px !important; width: 100% !important; margin-top: 0 !important; padding: 0 !important; background: transparent !important; border: none !important; box-shadow: none !important; } #category .sort-toolbar-label { display: none !important; } #category .sort-toolbar-pills { display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; align-items: center !important; gap: 6px !important; flex: 1 1 auto !important; min-width: 0 !important; overflow-x: auto !important; -webkit-overflow-scrolling: touch !important; scrollbar-width: none !important; padding: 2px 0 !important; } #category .sort-toolbar-pills::-webkit-scrollbar { display: none !important; } #category .btn-sort-pill { flex: 0 0 auto !important; width: auto !important; height: 30px !important; padding: 0 8px !important; font-size: 11px !important; white-space: nowrap !important; } #category .sort-toolbar-pills .btn-sort-pill:not(:first-child) { width: 30px !important; min-width: 30px !important; padding: 0 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; } #category .sort-toolbar-pills .btn-sort-pill:not(:first-child) span { display: none !important; } #category .sort-toolbar-pills .btn-sort-pill:not(:first-child) i, #category .sort-toolbar-pills .btn-sort-pill:not(:first-child) svg.sort-icon-svg { margin: 0 !important; font-size: 13px !important; width: 13px !important; height: 13px !important; } #category .sort-toolbar-views { flex: 0 0 auto !important; width: auto !important; margin: 0 !important; display: inline-flex !important; align-items: center !important; } #category .viewtype-switch-group { display: inline-flex !important; align-items: center !important; gap: 4px !important; margin: 0 !important; padding: 0 !important; border: none !important; } #category .btn-viewtype-icon { width: 30px !important; height: 30px !important; font-size: 13px !important; padding: 0 !important; } #category .grid_item > .row { display: flex !important; flex-wrap: wrap !important; margin-left: -4px !important; margin-right: -4px !important; } #category .grid_item > .row > [class*="col-"] { width: 50% !important; flex: 0 0 50% !important; max-width: 50% !important; padding-left: 4px !important; padding-right: 4px !important; margin-bottom: 8px !important; } #category .grid_item .item { position: relative !important; height: 100% !important; display: flex !important; flex-direction: column !important; padding: 6px !important; } #category .grid_item .item .s_content, #category .grid_item .item .p_bottom_area, #category .grid_item .item .product-card-buttons { position: static !important; } #category .grid_item .item .s_image { position: relative !important; height: 132px !important; min-height: 132px !important; max-height: 132px !important; flex: 0 0 132px !important; overflow: hidden !important; margin-bottom: 6px !important; display: flex !important; align-items: center !important; justify-content: center !important; } #category .grid_item .item .s_image a { display: flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; height: 100% !important; } #category .grid_item .item .s_image img { height: 132px !important; max-height: 132px !important; width: 100% !important; object-fit: contain !important; } #category .grid_item .item .product-card-buttons .btn-card-action.btn-card-wishlist { position: absolute !important; top: 108px !important; right: 12px !important; width: 24px !important; min-width: 24px !important; max-width: 24px !important; height: 24px !important; min-height: 24px !important; border-radius: 50% !important; padding: 0 !important; background: rgba(255, 255, 255, 0.95) !important; border: 1px solid rgba(0, 0, 0, 0.12) !important; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.18) !important; z-index: 5 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; } #category .grid_item .item .product-card-buttons .btn-card-action.btn-card-wishlist i { font-size: 11px !important; line-height: 1 !important; } #category .grid_item .item .product-card-buttons { display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; align-items: center !important; gap: 4px !important; width: 100% !important; margin-top: auto !important; } #category .grid_item .item .product-card-buttons .btn-card-action.btn-add-cart { flex: 0 0 32px !important; width: 32px !important; min-width: 32px !important; max-width: 32px !important; height: 30px !important; min-height: 30px !important; padding: 0 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; } #category .grid_item .item .product-card-buttons .btn-card-action.btn-add-cart span { display: none !important; } #category .grid_item .item .product-card-buttons .btn-card-action.btn-add-cart .cart-btn-icon { margin: 0 !important; width: 14px !important; height: 14px !important; } #category .grid_item .item .product-card-buttons .btn-card-action.btn-buy-now { flex: 1 1 auto !important; width: auto !important; min-width: 0 !important; max-width: none !important; height: 30px !important; min-height: 30px !important; padding: 0 4px !important; font-size: 10.5px !important; font-weight: 600 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; white-space: nowrap !important; } #category .list_item .item { display: flex !important; flex-direction: row !important; align-items: flex-start !important; padding: 10px !important; gap: 10px !important; } #category .list_item .item .s_image { width: 130px !important; min-width: 130px !important; max-width: 130px !important; height: 130px !important; min-height: 130px !important; max-height: 130px !important; flex: 0 0 130px !important; margin: 0 !important; align-self: flex-start !important; overflow: hidden !important; position: relative !important; } #category .list_item .item .s_image a { display: flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; height: 100% !important; } #category .list_item .item .s_image img { width: 130px !important; height: 130px !important; max-width: 130px !important; max-height: 130px !important; object-fit: contain !important; } #category .list_item .item .s_detail { flex: 1 1 auto !important; max-width: calc(100% - 140px) !important; min-width: 0 !important; align-self: flex-start !important; display: flex !important; flex-direction: column !important; justify-content: space-between !important; min-height: 130px !important; gap: 6px !important; } #category .list_item .item .s_order .product-card-buttons { display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; align-items: center !important; gap: 5px !important; width: 100% !important; margin-top: 6px !important; } #category .list_item .item .s_order .product-card-buttons .btn-card-action.btn-add-cart { flex: 0 0 34px !important; width: 34px !important; min-width: 34px !important; max-width: 34px !important; height: 32px !important; min-height: 32px !important; padding: 0 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; } #category .list_item .item .s_order .product-card-buttons .btn-card-action.btn-add-cart span { display: none !important; } #category .list_item .item .s_order .product-card-buttons .btn-card-action.btn-add-cart .cart-btn-icon { margin: 0 !important; width: 15px !important; height: 15px !important; } #category .list_item .item .s_order .product-card-buttons .btn-card-action.btn-buy-now { flex: 1 1 auto !important; width: auto !important; min-width: 0 !important; max-width: none !important; height: 32px !important; min-height: 32px !important; padding: 0 6px !important; font-size: 11px !important; font-weight: 600 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; white-space: nowrap !important; } #category .list_item .item .s_order .product-card-buttons .btn-card-action.btn-card-wishlist { flex: 0 0 32px !important; width: 32px !important; min-width: 32px !important; max-width: 32px !important; height: 32px !important; min-height: 32px !important; padding: 0 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; } #detail .p_top .product_info { padding-left: 0 !important; } #detail .p_top .product_info h1 { margin-top: 15px !important; margin-bottom: 12px !important; text-align: left !important; } #detail .p_top .product_info .info_order, #detail .info_order.product-card-buttons, #detail .info_order.detail-card-buttons { display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; align-items: center !important; gap: 8px !important; width: 100% !important; max-width: 100% !important; margin: 18px 0 10px 0 !important; box-sizing: border-box !important; } #detail .info_order.product-card-buttons .btn-card-action { height: 38px !important; min-height: 38px !important; box-sizing: border-box !important; } #detail .info_order.product-card-buttons .btn-card-action.btn-add-cart { flex: 0 0 44px !important; width: 44px !important; min-width: 44px !important; max-width: 44px !important; height: 38px !important; min-height: 38px !important; padding: 0 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; } #detail .info_order.product-card-buttons .btn-card-action.btn-add-cart .cart-btn-icon { width: 18px !important; height: 18px !important; margin: 0 !important; } #detail .info_order.product-card-buttons .btn-card-action.btn-buy-now { flex: 1 1 auto !important; width: auto !important; min-width: 0 !important; max-width: none !important; height: 38px !important; min-height: 38px !important; padding: 0 12px !important; font-size: 13px !important; font-weight: 600 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; white-space: nowrap !important; } #detail .info_order.product-card-buttons .btn-card-action.btn-card-wishlist { flex: 0 0 38px !important; width: 38px !important; min-width: 38px !important; max-width: 38px !important; height: 38px !important; min-height: 38px !important; padding: 0 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; font-size: 16px !important; } #detail .info_order.product-card-buttons .btn-card-action.btn-disabled { flex: 1 1 auto !important; width: auto !important; min-width: 0 !important; max-width: none !important; height: 38px !important; min-height: 38px !important; padding: 0 12px !important; font-size: 12px !important; font-weight: 600 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; white-space: nowrap !important; } .detail-bottom-blocks { padding: 0 !important; } #detail .p_content .tabs .nav-tabs, .tabs .nav.nav-tabs { display: flex !important; flex-wrap: nowrap !important; width: 100% !important; max-width: 100% !important; gap: 4px !important; padding: 4px !important; box-sizing: border-box !important; } #detail .p_content .tabs .nav-tabs > li, .tabs .nav.nav-tabs > li { flex: 1 1 50% !important; width: 50% !important; min-width: 0 !important; max-width: 50% !important; margin: 0 !important; box-sizing: border-box !important; text-align: center !important; } #detail .p_content .tabs .nav-tabs > li > a, .tabs .nav.nav-tabs > li > a { display: flex !important; width: 100% !important; justify-content: center !important; align-items: center !important; text-align: center !important; padding: 8px 10px !important; font-size: 13px !important; white-space: nowrap !important; box-sizing: border-box !important; } }