/* NOTE: CLS fix for header moved to base.css (loaded in ) for earlier application */ /* See base.css lines 5-21 for the actual implementation */ /* TYPOGRAPHY */ @media screen and (width < 750px) { h1, .h1.h1, .custom-typography h1, .text-block.h1 > * { font-size: 40px; line-height: 1.2; } h2, .h2.h2, .custom-typography h2, .text-block.h2 > * { font-size: 30px; line-height: 1.2; } h3, .h3, .h3.h3, .custom-typography h3, .text-block.h3 > * { } h4, .h4.h4, .custom-typography h4, .text-block.h4 > * { } h5, .h5.h5, .custom-typography h5, .text-block.h5 > * { } h6, .h6.h6, .custom-typography h6, .text-block.h6 > * { } /* .custom-typography p { font-size: 18px; } */ .custom-typography p br { display: none; } h1 br, h2 br, h3 br, h4 br, h5 br, h6 br { display: none; } } .text-block.custom-font-weight-300 * { font-weight: 300; } .text-block.custom-font-weight-400 * { font-weight: 400; } .text-block.custom-font-weight-500 * { font-weight: 500; } .text-block.custom-font-weight-600 * { font-weight: 600; } .text-block.custom-font-weight-700 * { font-weight: 700; } .text-block.custom-typography.has-mobile-line-height { line-height: 1.2 !important; } /* TYPOGRAPHY */ .main-navigation { display: flex; } .main-navigation.mobile-navigation { display: none; } @media screen and (max-width: 1023px) { .main-navigation { display: none; } .main-navigation.mobile-navigation { display: flex; } } /* Header Styles */ .custom-header { background: var(--header-bg-color, #2f3c46); color: white; position: sticky; top: 0; z-index: 4; box-shadow: none; } .header-top-bar { background: #e91e63; color: white; padding: 8px 0; font-size: 14px; text-align: center; } .header-main { display: flex; align-items: center; justify-content: center; height: 96px; } .header-container { display: flex; align-items: center; justify-content: space-between; gap: 32px; height: 77px; max-width: calc(1488px + 48px); width: 100%; margin: 0 auto; padding: 0 24px; } .header-logo { display: flex; flex-direction: column; align-items: flex-start; color: white; text-decoration: none; } .header-logo img { height: 50px; width: auto; } .header-logo-text { font-size: 11px; opacity: 0.9; font-weight: 400; letter-spacing: 0.5px; } .header-logo-main { font-size: 22px; font-weight: 700; line-height: 1; margin-bottom: 2px; } .header-search { flex: 1; position: relative; } .search-container { display: flex; align-items: center; position: relative; } .search-input { height: 40px; width: 100%; padding: 8px 48px 8px 12px; border: none; border-radius: 6px; font-size: 14px; font-family: var(--font-body--family); font-style: var(--font-body--style, normal); font-weight: var(--font-body--weight, 400); outline: none; background-color: #fff; transition: background-color 0.4s ease, box-shadow 0.4s ease; } .search-input:hover { background-color: #fff; } .search-input:focus { box-shadow: 0px 0px 0px 2px #fff; } .search-button { display: flex; align-items: center; justify-content: center; position: absolute; right: 1px; background-color: rgb(47, 60, 70); border: none; border-bottom-left-radius: 0px; border-bottom-right-radius: 6px; border-top-left-radius: 0px; border-top-right-radius: 6px; width: 38px; height: 38px; color: white; cursor: pointer; } .header-actions { display: flex; align-items: center; gap: 16px; } .wishlist-page-widget:not(.tt-header-heart-icon) { position: relative; } .wishlist-page-widget:not(.tt-header-heart-icon) svg { width: 24px; height: 24px; } .header-actions .wishlist-page-widget:not(.tt-header-heart-icon) .wishlist-total-count, .cart-bubble, .wishlist-h-count.wishlist-total-count { display: flex; align-items: center; justify-content: center; width: 20px; height: 20px; margin: 0; padding-inline: 0; position: absolute; top: -12px; right: -12px; background-color: #c70751; border-radius: 50%; font-size: 12px; } .cart-bubble__text { display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; font-size: 12px; line-height: normal; } .cart-bubble__background { background-color: #c70751; } .wishlist-btn-content-span.wishlist-after-label { display: none; } @media screen and (max-width: 749px) { .header-actions .wishlist-page-widget:not(.tt-header-heart-icon) .wishlist-total-count, .cart-bubble, .wishlist-h-count.wishlist-total-count { top: -5px; right: -5px; } } /* Header Styles */ /* Phone Dropdown */ .phone-dropdown { position: relative; display: inline-block; } .phone-toggle { background: none; border: none; cursor: pointer; display: flex; align-items: center; gap: 4px; } .phone-dropdown-content { position: absolute; top: 100%; right: 0; background: white; min-width: 200px; box-shadow: none; border-radius: var(--card-border-radius, 8px); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); opacity: 0; visibility: hidden; transform: translateY(-10px); transition: all 0.3s ease; z-index: 1000; padding: 4px; margin-top: 5px; } @media screen and (max-width: 749px) { .phone-dropdown-content { right: auto; left: 0; } .phone-toggle.mobile-icon svg:last-child { width: 12px; } } .phone-dropdown.open .phone-dropdown-content { opacity: 1; visibility: visible; transform: translateY(0); } .phone-dropdown-item { display: flex; align-items: center; gap: 8px; padding: 6px 8px; color: #333; text-decoration: none; transition: background-color 0.2s ease; } .phone-label { font-weight: 600; font-size: 12px; color: #666; } .phone-number { font-weight: 500; font-size: 13px; color: #333; } .header-icon { display: flex; align-items: center; gap: 4px; padding: 0; color: white; text-decoration: none; transition: background-color 0.3s; position: relative; } .header-icon:hover { color: #d1d5db; } /* Navigation Styles */ .desktop-menu { display: block; } .mobile-menu { display: none; } @media screen and (max-width: 1023px) { .desktop-menu { display: none; } .mobile-menu { display: block; } } .main-navigation { background: var(--nav-bg-color, #fff); border-bottom: 1px solid #e4e4e4; } .nav-container { max-width: 1488px; width: 100%; height: 61px; margin: 0 auto; } @media screen and (max-width: 1023px) { .nav-container { height: 64px; } } .main-menu { display: flex; height: 100%; list-style: none; margin: 0; padding: 0; } @media screen and (max-width: 749px) { .main-menu { height: 100%; } } .menu-item { position: relative; } @media screen and (max-width: 1024px) { .menu-item { position: unset; } } .menu-item > a { display: flex; padding: 16px 32px; color: rgb(75 85 99); text-decoration: none; font-size: 18px; font-family: var(--font-heading--family, var(--font-body--family)); font-style: var(--font-heading--style, normal); font-weight: var(--font-heading--weight, 600); transition: color 0.3s ease, background-color 0.3s ease; } .menu-item > a:hover { background-color: #f9fafb; } .menu-item.active > a { background-color: var(--accent-color, #e91e63); color: #fff; } .menu-item.menu-open::after { content: ''; position: fixed; top: 204px; left: 0; width: 100%; height: calc(100vh - 204px); background-color: rgba(0, 0, 0, 0.6); z-index: 999; } @media screen and (max-width: 1023px) { .menu-item > a { display: flex; align-items: center; justify-content: center; height: 100%; padding: 12px 16px; font-size: 14px; line-height: 20px; text-align: center; } .menu-item.menu-open::after { top: 244px; } } @media screen and (max-width: 500px) { .menu-item > a { font-size: 13px; } } .menu-item > .products-toggle, .menu-item > .mobile-products-toggle { align-items: center; gap: 8px; font-family: var(--font-heading--family, var(--font-body--family)); font-style: var(--font-heading--style, normal); font-weight: var(--font-heading--weight, 600); transition: color 0.3s ease, background-color 0.3s ease; } .menu-item > .products-toggle svg, .menu-item > .mobile-products-toggle svg { width: 20px; height: 20px; transition: transform 0.3s ease; } @media screen and (max-width: 749px) { .menu-item.menu-open::after { display: none; } .menu-item > .products-toggle svg, .menu-item > .mobile-products-toggle svg { width: 16px; height: 16px; } } /* Active state when mega menu is open */ .menu-item.menu-open > .products-toggle, .menu-item.menu-open > .rooms-toggle, .menu-item.menu-open > .new-arrivals-toggle, .menu-item.menu-open > .brands-toggle, .menu-item.menu-open > .products-toggle, .menu-item.menu-open > .rooms-toggle, .menu-item.menu-open > .new-arrivals-toggle, .menu-item.menu-open > .brands-toggle, .menu-item.menu-open > .mobile-products-toggle, .menu-item.menu-open > .mobile-rooms-toggle, .menu-item.menu-open > .mobile-new-arrivals-toggle, .menu-item.menu-open > .mobile-brands-toggle { background-color: var(--accent-color, #e91e63); color: #fff; } .menu-item > .products-toggle { padding-left: 5px; } @media screen and (max-width: 749px) { .menu-item > .products-toggle { padding-left: 16px; } } /* AI Modal Styles */ /* .ai-modal__content { padding: 0; border: var(--style-border-popover, 1px solid #e0e0e0); border-radius: var(--style-border-radius-popover, 8px); background-color: var(--color-background, #ffffff); box-shadow: var(--shadow-popover, 0 4px 20px rgba(0, 0, 0, 0.1)); max-width: 600px; width: 90vw; max-height: 80vh; overflow: hidden; } .ai-modal__content[open] { animation: modalSlideInTop var(--animation-speed, 0.3s) var(--animation-easing, ease-out) forwards; } .ai-modal__content.dialog-closing { animation: modalSlideOutTop var(--animation-speed, 0.3s) var(--animation-easing, ease-out) forwards; } .ai-modal__inner { padding: 2rem; display: flex; flex-direction: column; gap: 1.5rem; } .ai-modal__title { display: flex; align-items: center; gap: 8px; margin: 0; font-weight: 600; color: var(--color-foreground, #333); font-size: 18px; text-align: left; } .ai-modal__subtitle { font-size: 16px; color: var(--color-foreground-secondary, #666); margin: 0; text-align: left; } .ai-modal__body { display: flex; flex-direction: column; gap: 1.5rem; padding-top: 70px; } .ai-modal__input-group { display: flex; flex-direction: column; gap: 0.5rem; } .ai-modal__label { font-weight: 500; color: var(--color-foreground, #333); font-size: 0.9rem; } .ai-modal__input { width: 100%; padding: 0.75rem; border: 1px solid #e5e5e5; border-radius: 6px; font-size: 1rem; font-family: inherit; line-height: 1.4; resize: vertical; background-color: #fff; color: #000; } .ai-modal__input::placeholder { color: var(--color-foreground-secondary, #999); opacity: 0.8; } .ai-modal__actions { display: flex; justify-content: center; gap: 1rem; } .ai-modal__submit { background-color: #c70751; color: white; border: none; padding: 8px 16px; border-radius: 6px; font-size: 14px !important; font-weight: 500; cursor: pointer; transition: all 0.2s ease; display: flex; align-items: center; gap: 8px; width: 100%; justify-content: center; } .ai-modal__submit:active { transform: translateY(0); } .ai-modal__submit svg { width: 16px; height: 16px; flex-shrink: 0; } .ai-modal__close { position: absolute; top: 12px; right: 10px; z-index: 10; } .ai-modal__close:hover { opacity: 1; transform: scale(1.1); } .ai-modal__close:active { transform: scale(0.95); } .ai-modal__sugestions { display: flex; flex-direction: column; gap: 16px; } .ai-modal__sugestions .ai-suggestion { display: flex; align-items: center; gap: 8px; height: 50px; width: 100%; padding: 6px 12px; background: transparent; border: 1px solid #e4e4e4; border-radius: 6px; font-size: 14px; text-align: left; } .ai-modal__sugestions .ai-suggestion p { margin-bottom: -6px; } .ai-modal__sugestions .ai-suggestion svg { width: 24px; height: 24px; } @media screen and (max-width: 749px) { .ai-modal__content { max-height: 100vh; height: 100%; width: 100%; margin: auto; } .ai-modal__inner { padding: 1.5rem; height: 100%; } .ai-modal__header { display: flex; align-items: center; justify-content: center; position: absolute; top: 25px; left: 0; width: 100%; padding-bottom: 16px; border-bottom: 1px solid #e4e4e4; } .ai-modal__subtitle { display: none; } .ai-modal__input { height: auto; } } */ /* Location Modal Styles */ .location-modal__content { padding: 0; border: var(--style-border-popover, 1px solid #e0e0e0); border-radius: var(--style-border-radius-popover, 8px); background-color: var(--color-background, #ffffff); box-shadow: var(--shadow-popover, 0 4px 20px rgba(0, 0, 0, 0.1)); max-width: 900px; width: 95vw; max-height: 90vh; overflow: hidden; } .location-modal__content[open] { animation: modalSlideInTop var(--animation-speed, 0.3s) var(--animation-easing, ease-out) forwards; } .location-modal__content.dialog-closing { animation: modalSlideOutTop var(--animation-speed, 0.3s) var(--animation-easing, ease-out) forwards; } .location-modal__inner { padding: 1.5rem; display: flex; flex-direction: column; height: 100%; overflow-y: auto; } .location-modal__locations { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; } .location-card { display: flex; flex-direction: column; } .location-card__content-top { display: flex; gap: 16px; } .location-card__image { width: 120px; height: 80px; overflow: hidden; border-radius: 6px; flex-shrink: 0; } .location-image { width: 100%; height: 100%; object-fit: cover; background: #f5f5f5; } .location-card__content-bottom { display: flex; flex-direction: column; padding: 0; padding-top: 16px; padding-bottom: 22px; flex: 1; } .location-info { display: flex; gap: 0.75rem; align-items: flex-start; } .location-info svg { color: #c70751; } .location-icon { flex-shrink: 0; margin-top: 2px; } .location-details { flex: 1;flex: 1; display: flex; flex-direction: column; gap: 8px; } .location-name { font-size: 20px; font-weight: 700; color: #111827; margin: 0; } .location-address { font-size: 16px; font-weight: 400; color: #4b5563; margin: 0; } .location-phone { display: flex; align-items: center; gap: 8px; font-size: 16px; color: #c70751; text-decoration: none; font-weight: 500; } .location-phone svg { color: #6b7280; } .location-phone:hover { text-decoration: underline; } .location-hours { flex: 1; } .hours-title { font-size: 16px; font-weight: 600; color: #111827; margin: 0 0 8px 0; } .hours-list { display: flex; flex-direction: column; gap: 4px; } .hours-item { display: flex; justify-content: space-between; font-size: 14px; } .hours-day { color: var(--color-foreground-secondary, #666); font-weight: 500; } .hours-time { color: var(--color-foreground, #333); font-weight: 500; } .location-directions-btn { background-color: var(--accent-color, #c70751); color: white; border: none; padding: 0.75rem 1rem; border-radius: 4px; font-size: 0.95rem; font-weight: 500; cursor: pointer; transition: all 0.2s ease; display: flex; align-items: center; justify-content: center; gap: 0.5rem; width: 100%; } .location-directions-btn:hover { background-color: var(--accent-color-dark, #a1054a); transform: translateY(-1px); box-shadow: 0 4px 12px rgba(199, 7, 81, 0.3); } .location-directions-btn:active { transform: translateY(0); } .location-directions-btn svg { width: 16px; height: 16px; flex-shrink: 0; } .location-modal__close { position: absolute; top: 2px; right: 2px; opacity: 0.7; transition: opacity 0.2s ease, transform 0.15s ease; z-index: 10; padding: 0.5rem; border-radius: 50%; } .location-modal__close:hover { opacity: 1; transform: scale(1.1); } .location-modal__close:active { transform: scale(0.95); } /* Mobile responsiveness for location modal */ @media screen and (max-width: 749px) { .location-modal__content { width: 100vw; max-width: 100%; height: 100vh; max-height: 100%; border-radius: 0; margin: 0; } .location-modal__inner { padding: 8px; height: auto; background-color: #fff; } .location-modal__locations { grid-template-columns: 1fr; gap: 1.5rem; } .location-card__content-top { gap: 16px; } .location-card__content-bottom { padding: 1rem 1.25rem 1.25rem 1.25rem; } .location-card__image { width: 130px; height: 100px; } .location-modal__content[open] { display: flex; align-items: center; justify-content: center; height: fit-content; margin: auto; background: transparent; } } @media screen and (max-width: 480px) { .location-modal__locations { gap: 1rem; } .location-card__content-top { padding: 1rem 1rem 0 1rem; } .location-card__content-bottom { padding: 0.75rem 1rem 1rem 1rem; gap: 1rem; } .hours-item { flex-direction: column; gap: 0.25rem; } } .menu-item.menu-open > .products-toggle svg { transform: rotate(90deg); } /* Mega Menu Styles */ .mega-menu, .brands-dropdown, .rooms-mega-menu, .new-arrivals-mega-menu { position: absolute; top: calc(100% + 1px); left: 0; box-shadow: none; border-radius: 0 0 var(--card-border-radius, 8px) var(--card-border-radius, 8px); opacity: 0; visibility: hidden; transform: translateY(-10px); transition: all 0.3s ease; z-index: 1000; } .menu-item.menu-open .mega-menu { opacity: 1; visibility: visible; transform: translateY(0); } .mega-menu-container { display: flex; height: calc(100vh - 204px); } @media screen and (max-width: 1023px) { .mega-menu, .brands-dropdown, .rooms-mega-menu, .new-arrivals-mega-menu { width: 100%; top: 100%; overflow: hidden; } .mobile-navigation .mobile-mega-menu-container, .mobile-navigation .mobile-brands-dropdown-container, .mobile-navigation .mobile-rooms-mega-menu-container { position: relative; overflow: hidden; } } @media screen and (min-width: 750px) and (max-width: 1380px) { .mega-menu, .brands-dropdown, .rooms-mega-menu, .new-arrivals-mega-menu { margin-top: -1px; } } .category-sidebar { width: 385px; background: #fff; border-right: 1px solid #dee2e6; } @media screen and (min-width: 821px) and (max-width: 1024px) { .category-sidebar, .level-2-section.active, .level-3-section.active { width: 33.3vw; } .menu-item.menu-open .new-arrivals-mega-menu { width: 100%; } } @media screen and (max-width: 1023px) { .category-sidebar { width: 100%; } } @media screen and (max-width: 749px) { .category-sidebar { width: 100%; height: calc(100vh - 245px); position: relative; } } .category-list { display: flex; flex-direction: column; height: 100%; overflow: auto; list-style: none; margin: 0; padding: 0; } @media screen and (max-width: 749px) { .category-list { min-height: unset; max-height: none; height: 100%; width: 100%; overflow: auto; position: absolute; /* top: 106px; */ } .template-product .category-list { padding-bottom: 70px; } } .category-link { display: flex; align-items: center; gap: 12px; color: #495057; text-decoration: none; transition: all 0.3s; cursor: pointer; font-size: 14px; padding: 12px 24px; } @media screen and (max-width: 749px) { .category-link { font-size: 16px; font-weight: 500; } } .category-link svg { flex-shrink: 0; width: 16px; height: 16px; } .category-link svg:last-child { margin-left: auto; } .category-link:hover, .category-link.active { background: #f9fafb; color: #e91e63; } .category-sidebar--search { margin-bottom: 16px; padding: 24px; border-bottom: 1px solid #e5e7eb; } .category-sidebar--search-button { display: flex; justify-content: center; align-items: center; width: 100%; padding: 12px 16px; background-color: rgb(249 250 251); border: 1px solid rgb(229 231 235); border-radius: 5px; position: relative; cursor: pointer; } .category-sidebar--search-button svg { width: 16px; height: 16px; position: absolute; left: 12px; } /* Middle Column - Level 2 */ .level-2-section { padding: 20px; border-right: 1px solid #dee2e6; border-left: 1px solid #dee2e6; background-color: #fafbfc; } .level-2-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 15px; padding-bottom: 8px; } .level-2-title { color: #2c3e50; margin: 0; font-size: 16px; font-weight: 600; } @media screen and (max-width: 749px) { .level-2-title { font-size: 18px; } } .view-all-link { color: #c70751; text-decoration: underline; font-size: 12px; } .level-2-content { display: none; } .level-2-content.active { display: block; overflow: auto; } /* Hide level 2 and 3 sections by default */ @media screen and (min-width: 1024px) { .level-2-section, .level-3-section { display: none; width: 385px; overflow: auto; } } @media screen and (min-width: 750px) and (max-width: 1023px) { .level-1-section { display: block; } .level-2-section, .level-3-section { width: 320px; } .level-2-section:not(.active), .level-3-section:not(.active) { display: none; } /* Mobile navigation override - slide-in/out behavior */ .mobile-navigation .mobile-level-2-section, .mobile-navigation .mobile-level-3-section { position: absolute; top: 0; left: 0; width: 100%; height: calc(100vh - 245px); overflow: auto; transform: translateX(100%); transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); background: white; display: block; } .mobile-navigation .mobile-level-2-section.slide-in, .mobile-navigation .mobile-level-3-section.slide-in { transform: translateX(0); } .mobile-navigation .mobile-level-2-section.slide-out, .mobile-navigation .mobile-level-3-section.slide-out { transform: translateX(-100%); } .mobile-navigation .mobile-category-sidebar { transform: translateX(0); transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); } .mobile-navigation .mobile-category-sidebar.slide-out { transform: translateX(-100%); } .mobile-navigation .mobile-brand-categories-section { position: absolute; top: 0; left: 0; width: 100%; height: calc(100vh - 245px); overflow: auto; transform: translateX(100%); transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); background: white; display: block; } .mobile-navigation .mobile-brand-categories-section.slide-in { transform: translateX(0); } .mobile-navigation .mobile-brands-dropdown { transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); } .mobile-navigation .mobile-brands-dropdown.slide-out { transform: translateX(-100%); } .mobile-navigation .mobile-rooms-level-2-section { position: absolute; top: 0; left: 0; width: 100%; height: calc(100vh - 245px); overflow: auto; transform: translateX(100%); transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); background: white; display: block; visibility: hidden; } .mobile-navigation .mobile-rooms-level-2-section.slide-in { transform: translateX(0); visibility: visible; } .mobile-navigation .mobile-rooms-category-sidebar { transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); } .mobile-navigation .mobile-rooms-category-sidebar.slide-out { transform: translateX(-100%); } .mobile-navigation .mobile-back-button { display: flex; } } /* Show level 2 section when active */ .level-2-section.active { display: block; } /* Show level 3 section when active */ .level-3-section.active { display: block; overflow: auto; } .subcategory-list { display: flex; flex-direction: column; gap: 4px; list-style: none; padding: 0; margin: 0; } .subcategory-link { display: flex; align-items: center; justify-content: space-between; padding: 12px; color: #495057; text-decoration: none; border-radius: 4px; transition: all 0.3s; font-size: 14px; cursor: pointer; } @media screen and (max-width: 749px) { .subcategory-link { font-size: 14px; font-weight: 500; } } .subcategory-link:hover, .subcategory-link.active { background: #f3f4f6; color: #202a37; } .subcategory-link svg { width: 16px; height: 16px; } /* Right Column - Level 3 */ .level-3-section { padding: 20px; background-color: #fff; border-left: 1px solid #dee2e6; } .level-3-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 15px; padding-bottom: 8px; } .level-3-title { color: #2c3e50; margin: 0; font-size: 16px; font-weight: 600; } .level-3-content { display: none; } .level-3-content.active { display: block; } .final-product-list { display: flex; flex-direction: column; gap: 4px; list-style: none; padding: 0; margin: 0; } .final-product-item { margin-bottom: 8px; } .final-product-link { display: block; padding: 12px; color: #495057; text-decoration: none; border-radius: 4px; transition: all .3s; font-size: 14px; cursor: pointer; } @media screen and (max-width: 749px) { .final-product-link { font-size: 14px; font-weight: 500; } } .final-product-link:hover { color: #1f2937; background-color: #f3f4f6; } /* Brands Dropdown Styles */ .brands-menu-item.menu-open .brands-dropdown { opacity: 1; visibility: visible; transform: translateY(0); } .brands-dropdown-container { background: #fff; height: calc(100vh - 204px); display: flex; } /* Left Column: Brands Sidebar */ .brands-sidebar { width: 385px; background: #fff; border-right: 1px solid #dee2e6; } @media screen and (max-width: 1023px) { .brands-sidebar { width: 320px; } } @media screen and (max-width: 820px) { .brands-sidebar { width: 100%; height: calc(100vh - 245px); position: relative; } } .brands-search { padding: 24px; padding-bottom: 0; } .brands-search-input { width: 100%; height: 40px; padding: 0px 40px 0 12px; background-color: transparent; border: 1px solid #e5e5e5; border-radius: 5px; font-size: 14px; transition: all 0.3s; position: relative; } @media screen and (max-width: 749px) { .brands-search-input { font-size: 16px; } } .brands-search-input:focus { outline: 1px solid #000; } .brands-search-input:focus-visible { outline-offset: 2px } .brands-search-input::placeholder { text-align: left; } .brands-search-icon { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); color: #9ca3af; pointer-events: none; z-index: 1; } .brands-search { position: relative; } .brands-list { display: flex; flex-direction: column; list-style: none; height: 100%; width: 100%; margin: 0; overflow: auto; padding: 0 24px; top: 116px; height: calc(100% - 116px); position: absolute; } @media screen and (max-width: 749px) { .brands-list { height: calc(100% - 122px); width: 100%; position: absolute; top: 122px; overflow: auto; } .template-product .brands-list { padding-bottom: 70px; } } .brands-list-title { margin: 0; padding: 16px 24px; color: #0a0a0a; font-size: 16px; font-weight: 600; } @media screen and (max-width: 749px) { .brands-list-title { font-size: 18px; } } .brand-item { display: block; } .brand-item.hidden { display: none; } .brand-link { display: flex; align-items: center; color: #495057; text-decoration: none; transition: all 0.3s; cursor: pointer; font-size: 14px; padding: 12px; gap: 12px; } @media screen and (max-width: 749px) { .brand-link { font-size: 16px; font-weight: 500; } } .brand-link:hover, .brand-link.active { background: #f9fafb; color: #e91e63; } .brand-link svg { width: 16px; height: 16px; margin-left: auto; } .brand-initial { width: 32px; height: 32px; border-radius: 50%; background-color: #e5e7eb; color: #4b5563; display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 600; text-transform: uppercase; flex-shrink: 0; transition: all 0.3s; } /* Right Column: Brand Categories */ .brand-categories-section { width: 385px; padding: 20px; background-color: #fafbfc; flex: 1; border-left: 1px solid #dee2e6; } @media screen and (min-width: 750px) { .brand-categories-section { display: none; } } .brand-categories-section.active { display: block; } .brand-categories-header { display: flex; align-items: center; justify-content: space-between; padding-bottom: 24px; } @media screen and (max-width: 749px) { .brand-categories-header { padding-bottom: 0; } } .brand-categories-header .view-all-link { font-size: 14px; } .brand-categories-title { color: #2c3e50; margin: 0; font-size: 16px; font-weight: 600; } .brand-category-list { display: flex; flex-direction: row; flex-wrap: wrap; gap: 16px; list-style: none; padding: 12px; margin: 0; } .brand-category-list li { flex: 1 1 calc(50% - 16px); } .brand-category-link { display: block; padding: 12px; color: #0A0A0A; text-decoration: none; font-size: 16px; border-radius: 4px; transition: all 0.2s; } .brand-category-link:hover { background: #f3f4f6; color: #202a37; } @media screen and (min-width: 1024px) { .brand-categories-content { display: none; } .brand-categories-content.active { display: block; } } .popular-categories-subtitle { color: #202a37; font-size: 18px; font-weight: 600; padding-bottom: 16px; } .brand-logo { display: flex; align-items: center; } .brand-logo-image { max-width: 100px; max-height: 100px; object-fit: contain; } /* Rooms Mega Menu Styles */ .menu-item.menu-open .rooms-mega-menu { opacity: 1; visibility: visible; transform: translateY(0); } .rooms-mega-menu-container { display: flex; height: calc(100vh - 204px); } /* Left Column - Room Categories */ .rooms-category-sidebar { width: 385px; background: #fff; border-right: 1px solid #dee2e6; } @media screen and (max-width: 1023px) { .rooms-category-sidebar { width: 320px; } } @media screen and (max-width: 820px) { .rooms-category-sidebar { width: 100%; height: calc(100vh - 245px); } } .rooms-category-sidebar--search { margin-bottom: 16px; padding: 24px; border-bottom: 1px solid #e5e7eb; } .rooms-category-sidebar--search-button { display: flex; justify-content: center; align-items: center; width: 100%; padding: 12px 16px; background-color: rgb(249 250 251); border: 1px solid rgb(229 231 235); border-radius: 5px; position: relative; cursor: pointer; } .rooms-category-sidebar--search-button svg { width: 16px; height: 16px; position: absolute; left: 12px; } .rooms-category-list { display: flex; flex-direction: column; max-width: 384px; width: 100%; overflow: auto; list-style: none; margin: 0; padding: 0; position: absolute; /* top: 96px; */ height: 100%; position: absolute; } @media screen and (max-width: 749px) { .rooms-category-list { max-width: 100%; width: 100%; } .template-product .rooms-category-list { padding-bottom: 315px; } } .rooms-category-link { display: flex; align-items: center; gap: 12px; color: #495057; text-decoration: none; transition: all 0.3s; cursor: pointer; font-size: 14px; padding: 12px 24px; } .rooms-category-link svg { flex-shrink: 0; width: 16px; height: 16px; } .rooms-category-link svg:last-child { margin-left: auto; } .rooms-category-link svg:last-child { /* margin-left: auto; */ } .rooms-category-link:hover, .rooms-category-link.active { background: #f9fafb; color: #e91e63; } /* Middle Column - Level 2 */ .rooms-level-2-section { padding: 20px; border-left: 1px solid #dee2e6; background-color: #fafbfc; width: 385px; } @media screen and (min-width: 750px) { .rooms-level-2-section { display: none; } } .rooms-level-2-section.active { display: block; overflow: auto; } @media screen and (max-width: 1023px) { .rooms-level-2-section { width: 320px; } } .rooms-level-2-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 15px; padding-bottom: 8px; } .rooms-level-2-title { color: #2c3e50; margin: 0; font-size: 16px; font-weight: 600; } .rooms-level-2-content { display: none; } .rooms-level-2-content.active { display: block; } .rooms-subcategory-list { display: flex; flex-direction: column; gap: 4px; list-style: none; padding: 0; margin: 0; margin-bottom: 24px; } .rooms-subcategory-link { display: block; padding: 8px 12px; color: #6b7280; text-decoration: none; font-size: 14px; border-radius: 4px; transition: all 0.2s; } @media screen and (max-width: 749px) { .rooms-subcategory-link { font-size: 16px; font-weight: 500; padding: 12px; } } .rooms-subcategory-link:hover { background: #f3f4f6; color: #202a37; } /* New Arrivals Mega Menu Styles */ .menu-item.menu-open .new-arrivals-mega-menu { opacity: 1; visibility: visible; transform: translateY(0); } .new-arrivals-mega-menu-container { display: flex; height: calc(100vh - 204px); } /* Left Column - New Arrivals Categories */ .new-arrivals-category-sidebar { width: 385px; background: #fff; border-right: 1px solid #dee2e6; padding: 24px; } @media screen and (max-width: 1023px) { .new-arrivals-category-sidebar { width: 320px; } } @media screen and (max-width: 749px) { .new-arrivals-category-sidebar { width: 100%; height: calc(100vh - 245px); position: relative; } .template-product .new-arrivals-category-sidebar { padding-bottom: 70px; } } .new-arrivals-title { padding-bottom: 16px; } .new-arrivals-title h3 { color: #2c3e50; margin: 0; font-size: 24px; font-weight: 700; } .new-arrivals-category-list { display: flex; flex-direction: column; gap: 8px; list-style: none; margin: 0; padding: 0; overflow: auto; top: 66px; height: calc(100% - 66px); position: absolute; } @media screen and (max-width: 749px) { .new-arrivals-category-list { height: calc(100% - 96px); width: 100%; position: absolute; top: 80px; overflow: auto; } .template-product .new-arrivals-category-list { height: calc(100% - 160px); } } .new-arrivals-category-link { display: flex; flex-direction: column; padding: 12px; color: #495057; text-decoration: none; border-radius: 6px; transition: all 0.3s; cursor: pointer; } .new-arrivals-category-link:hover { background: #f9fafb; } .category-title { font-size: 16px; font-weight: 500; color: inherit; } .category-subtitle { font-size: 14px; color: #4B5563; font-weight: 400; } /* Right Section - Products and Offers */ .new-arrivals-content-section { display: flex; flex-direction: column; flex: 1; background-color: #fafbfc; border-left: 1px solid #dee2e6; overflow: auto; } @media screen and (max-width: 749px) { .new-arrivals-content-section { display: none; } } /* Products Column */ .new-arrivals-products { display: flex; flex-direction: column; gap: 12px; width: 600px; padding: 24px; } .product-showcase-item { display: flex; align-items: center; gap: 12px; padding: 16px; background-color: #fff; border-radius: 8px; } .product-image-placeholder { width: 48px; border-radius: 8px; } .product-image { width: 80px; height: 80px; object-fit: cover; border-radius: 4px; } .product-name { color: #2c3e50; margin: 0; font-size: 16px; font-weight: 500; } .product-subtitle { color: #6b7280; margin: 0; font-size: 14px; font-weight: 400; } /* Special Offers Column */ .new-arrivals-offers { display: flex;; flex-direction: column; gap: 12px; width: 600px; padding: 20px; } .special-offer-item { background-color: #c70751; color: white; padding: 16px; border-radius: 8px; text-align: left; } .special-offer-item:last-child { background-color: #1f2937; } .offer-title { color: white; margin: 0; font-size: 16px; font-weight: 500; } .offer-subtitle { color: #fff; margin: 0; font-size: 14px; font-weight: 500; opacity: .9; } .offer-button { display: inline-block; background: white; color: #e91e63; margin-top: 8px; padding: 10px 20px; border-radius: 6px; text-decoration: none; font-size: 14px; font-weight: 600; transition: all 0.3s; } .special-offer-item:last-child .offer-button { background-color: #c70751; color: #fff; } .offer-button:hover { background: #f8f9fa; transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); } /* Advertisement placeholders */ .advertisement-container { margin-top: 24px; padding-top: 16px; border-top: 1px solid #e5e7eb; } .advertisement-container:empty { display: none; } .advertisement { display: flex; justify-content: center; align-items: center; min-height: 250px; background: #e9ecef; border-radius: 8px; text-align: center; color: #6c757d; font-size: 12px; } /* Mobile Header Styles - Must come last to override desktop styles */ .mobile-header { display: none; } .mobile-menu-overlay { display: none; } @media (max-width: 1023px) { .mobile-header { display: block; padding: 12px 16px; background: var(--header-bg-color, #2f3c46); color: white; } .mobile-header-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; gap: 12px; } .mobile-left-actions, .mobile-right-actions { display: flex; align-items: center; gap: 0; } .mobile-icon { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 0; position: relative; color: white; text-decoration: none; border-radius: 6px; transition: background-color 0.3s ease; } .mobile-icon svg { width: 24px; height: 24px; } .mobile-icon:hover { background-color: rgba(255, 255, 255, 0.1); } .mobile-logo { display: flex; flex-direction: column; align-items: center; text-decoration: none; color: white; } .mobile-logo img { height: 40px; width: auto; } .mobile-logo-text { font-size: 10px; opacity: 0.8; margin-top: 2px; text-align: center; } .mobile-search { width: 100%; } .mobile-search .search-container { position: relative; display: flex; align-items: center; } .mobile-search .search-input { width: 100%; height: 40px; padding: 8px 48px 8px 12px; border: none; border-radius: 6px; font-size: 14px; outline: none; background-color: #fff; } .mobile-search .search-button { position: absolute; right: 1px; display: flex; align-items: center; justify-content: center; background-color: rgb(47, 60, 70); border: none; border-radius: 0 6px 6px 0; width: 38px; height: 38px; color: white; cursor: pointer; } .header-main { display: none !important; } } @media screen and (max-width: 749px) { .mobile-search { padding: 0 16px; } } /* Image block */ .image-block.image-block-absolute { height: 100%; width: 100%; z-index: -1; bottom: 0; } /* Image block */ /* Footer */ footer { position: relative; } footer .group-block-content { max-width: 1488px; margin: 0 auto; /* padding: 0 24px; */ } footer .menu__heading { padding: 0; font-size: 16px; } footer .menu__heading__default { font-size: 16px; font-weight: 700; } footer .email-signup__heading { padding: 12px 0; } footer .email-signup__form { padding: 2px 0; } footer .email-signup__input { display: flex; align-items: center; padding: 8px 12px; font-size: 14px; background-color: #ffffff1a; border-radius: 6px; } footer .email-signup__input:focus { box-shadow: 0 0 0 3px #fff; outline-color: #000; } footer .email-signup__input::placeholder { color: #9ca3af; } footer .email-signup__button:not(.button-unstyled) { width: 100%; padding: 8px 12px; font-size: 14px; font-weight: 500; color: #fff; text-align: center; background-color: transparent; border: 1px solid #fff; border-radius: 6px; } footer .email-signup__button:not(.button-unstyled):hover { background-color: #fff; color: #c70751; } footer .star-icons { display: flex; flex-direction: row; justify-content: center; align-items: center; } footer .star-icons svg { width: 24px; height: 24px; color: #1f2937; fill: #1f2937; } .footer-utilities { flex-direction: column; gap: 48px; max-width: 1488px; margin: 0 auto; padding: 16px 24px; } .footer-utilities__group.footer-utilities__group--left { order: 1; margin: 0 auto; flex: 0 1; width: auto; color: #d1d5db; font-size: 14px; } .footer-utilities__group.footer-utilities__group--right { flex-direction: column; justify-content: center; align-items: center; flex: 0 1; gap: 12px; width: auto; margin-left: auto; } .footer-utilities__group.footer-utilities__group--right svg { width: 24px; height: 24px; color: #fff; } .footer-utilities__group.footer-utilities__group--right .social-icons__wrapper { gap: 16px; } .footer-utilities__text { margin: 0; font-size: 14px; color: #d1d5db; } @media screen and (max-width: 749px) { .email-signup__input-group { display: flex; flex-direction: row; } footer .email-signup__button:not(.button-unstyled) { flex: 1 1 140px; } .footer-utilities__group.footer-utilities__group--right { margin: 0; } footer .email-signup__input { padding: 6px 12px; } footer .email-signup__button:not(.button-unstyled) { padding: 6px 12px; } } /* Footer */ /* Carousel block */ .carousel-block { position: relative; max-width: 100%; } .carousel-wrapper { display: flex; align-items: center; gap: 16px; } .carousel-container { flex: 1; overflow: hidden; border-radius: 8px; } .carousel-track { display: flex; transition: transform 0.3s ease; } .carousel-item { flex: 0 0 auto; width: 434px; overflow: hidden; } .carousel-item__image { width: 100%; height: auto; display: block; } .carousel-item__content { padding: 0 8px; } .carousel-item__title { margin: 0 0 8px 0; font-size: 18px; font-weight: 600; color: #1f2937; } .carousel-item__text { margin-bottom: 8px; font-size: 14px; line-height: 20px; font-style: italic; color: #1f2937; text-align: center; } .carousel-arrow { position: absolute; z-index: 5; flex: 0 0 auto; width: 30px; height: 30px; background: #ffffff80; border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all 0.2s; color: #1f2937; border: none; bottom: 25px; } .carousel-arrow:hover { background-color: #fff; } .carousel-arrow svg { width: 16px; height: 16px; } .carousel-arrow--prev { left: 8px; } .carousel-arrow--next { right: 8px; } .carousel-arrow:disabled { opacity: 0.4; cursor: not-allowed; } .carousel-item__star-rating { display: flex; flex-direction: row; justify-content: center; align-items: center; } .carousel-item__star-rating svg { width: 12px; height: 12px; color: #1f2937; fill: #1f2937; } .carousel-item__author { margin: 0; text-align: center; color: #1f2937; font-size: 14px; } /* Responsive */ @media (max-width: 768px) { .carousel-item { width: 250px; } .carousel-arrow { width: 30px; height: 30px; } .carousel-wrapper { gap: 12px; } } @media (max-width: 480px) { .carousel-item { width: 100%; } } /* Carousel block */ /* Featured collection block */ .product-list .section--page-width { max-width: 1500px; margin: 0 auto; padding-left: 24px; padding-right: 24px; } @media screen and (max-width: 749px) { .product-list .section--page-width { padding-left: 16px; padding-right: 16px; } } .product-list .resource-list__carousel .slideshow-control[disabled] { display: flex; } .product-list .slideshow-control { opacity: 1; } .product-list .resource-list__carousel slideshow-slides { padding-right: 0; padding-left: 0; } .product-list .resource-list__carousel slideshow-arrows { padding: 0; width: calc(100% + 100px); margin: 0 auto; left: -50px; right: auto; } /* Recently viewed - delivery badges styles */ .product-card__content .delivery-badge-block { display: flex; flex-wrap: wrap; gap: 4px; position: absolute; z-index: 5; padding: 8px; } .product-card__content .delivery-badge { display: inline-flex !important; align-items: center; gap: 4px; padding: 4px 8px; border-radius: 4px; font-size: 12px; background-color: #ffffff; color: #374151; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); } .product-card__content .delivery-badge__image { width: 16px; height: 16px; max-width: 16px; max-height: 16px; object-fit: contain; } .product-card__content .delivery-badge__text { display: inline !important; white-space: nowrap; } /* Recently viewed - review rating styles */ .recent-views-rating.rating-wrapper { display: flex; align-items: center; gap: 8px; } .recent-views-rating .rating { display: flex; align-items: center; gap: 2px; } .recent-views-rating .rating-count { font-size: 12px; color: #6b7280; margin: 0; } /* Hide arrows when items <= columns */ .resource-list__carousel.hide-arrows-desktop slideshow-arrows { display: none; } @media screen and (max-width: 749px) { .product-list .resource-list__carousel slideshow-arrows { display: none; } .resource-list__carousel.hide-arrows-mobile slideshow-arrows { display: none; } .product-list .resource-list__carousel slideshow-slides { display: flex; flex-direction: column; justify-content: center; flex-wrap: wrap; } } .resource-list__carousel .resource-list__slide { /* width: calc(25% - 18px); */ } @media screen and (max-width: 749px) { .resource-list__carousel .resource-list__slide { width: 100%; } } .resource-list__carousel .button-unstyled.slideshow-control.slideshow-control--shape-circle { min-height: 32px; min-width: 32px; width: 32px; height: 32px; color: #000; background-color: #fff; border: 1px solid #e5e5e5; } .resource-list__carousel .button-unstyled.slideshow-control.slideshow-control--shape-circle:hover { background-color: #f5f5f5; } .resource-list__carousel .button-unstyled.slideshow-control.slideshow-control--shape-circle .icon-arrow { width: 16px; height: 16px; } @media screen and (max-width: 749px) { .resource-list__carousel .product-media-container--image { display: none; } .resource-list__carousel .product-media-container--image:first-child { display: flex; } /* .resource-list__carousel .buy-buttons-block { display: none; } */ .resource-list__carousel .product-grid__card.product-grid__card { flex-direction: row; align-items: center; } .resource-list__carousel .product-grid__card .product-list { height: 128px; width: 128px; } /* .resource-list__carousel .product-grid__card.product-grid__card .card-gallery { flex: 0 0 128px; } */ .resource-list__carousel .product-grid__card.product-grid__card .card-gallery .product-media, .resource-list__carousel .product-grid__card.product-grid__card .card-gallery .product-media-container { display: none; } } .product-list-tabs__navigation { display: flex; border-bottom: 1px solid #e5e7eb; } .product-list-tab { background: none; border: none; border-bottom: 2px solid transparent; padding: 12px 16px; cursor: pointer; font-size: 18px; font-weight: 600; color: #4b5563; transition: all 0.3s ease; white-space: nowrap; } .product-list-tab:hover { color: #1f2937; } .product-list-tab.active { color: #c70751; border-bottom-color: #c70751; } .product-list-tabs__content { position: relative; } @media screen and (max-width: 749px) { .product-list-tabs__content, .resource-list__carousel { grid-column: 1 / 4; } } .product-list-tab__panel { display: none; } .product-list-tab__panel.active { display: block; } .carousel-insert-content a { font-size: 16px; font-weight: 700; } .carousel-insert-text strong { font-weight: 800; } @media screen and (max-width: 749px) { .product-list-tabs__navigation { overflow-x: auto; } .product-list-tab { flex-shrink: 0; padding: 10px 16px; font-size: 14px; } .carousel-insert-title { font-size: 20px !important; } .carousel-insert-text { font-size: 30px !important; } .carousel-insert-text-2 { font-size: 12px !important; } } /* Featured collection block */ /* Product card */ .sticky-product-bar__sku { position: relative; display: inline-flex; align-items: center; gap: 4px; background: transparent; border: none; padding: 2px 6px; cursor: pointer; font-size: inherit; font-family: inherit; color: inherit; border-radius: 4px; transition: background-color 0.2s; } .sticky-product-bar__sku:hover { background-color: rgba(0,0,0,0.05); } .sticky-product-bar__sku-value { opacity: 0; max-width: 0; overflow: hidden; transition: opacity .2s, max-width .2s; position: absolute; bottom: 14px; width: 150px; right: 35px; font-size: 9px; box-shadow: 0 2px 5px -4px #000; padding: 5px; } .sticky-product-bar__sku:hover .sticky-product-bar__sku-value { opacity: 1; max-width: 200px; } .sticky-product-bar__sku-copied { display: none; color: #22c55e; font-weight: 500; } .sticky-product-bar__sku.is-copied .sticky-product-bar__sku-label, .sticky-product-bar__sku.is-copied .sticky-product-bar__sku-value { display: none; } .sticky-product-bar__sku.is-copied .sticky-product-bar__sku-copied { display: inline; } .custom-liquid.product-card_sku-ellipsis { height: 20px; margin-top: -10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 90%; font-size: 12px; } .product-card .price { font-weight: 700; } @media screen and (max-width: 749px) { .product-card .price { font-size: 16px; } .product-card .add-to-cart-text svg { max-width: 16px; max-height: 16px; } .product-card .add-to-cart-text__content { display: none; } .product-card .compare-at-price { font-size: 14px; } .product-card .rating-placeholder svg { width: 12px; height: 12px; } } .product-card .buy-buttons-block { margin-top: auto; } .product-card .product-form-buttons button { max-height: 40px; padding: 12px 16px; font-size: 14px; } .rating-placeholder { display: flex; flex-direction: row; justify-content: center; align-items: center; gap: 4px; } .rating-placeholder svg { width: 16px; height: 16px; color: #facc15; fill: #facc15; } .rating-placeholder .rating-count { margin: 0; color: #737373; font-size: 12px; } .product-card.product-card--horizontal { display: flex; max-width: 535px; } .product-card__content .prod-sku { display: none !important; } .product-card.product-card--horizontal .product-card__content { flex-direction: row; width: 100%; } .product-card.product-card--horizontal .card-gallery { flex: 1 0 160px; } @media (max-width: 749px) { .product-card--vertical .card-gallery { height: 100%; overflow: visible; } .product-card--vertical .product-badges.product-badges--top-left { top: 4px; left: 4px; } .product-card.product-card--horizontal { display: flex; max-width: 535px; } .product-card.product-card--horizontal .product-card__content { flex-direction: row; align-items: flex-start; padding: 16px; gap: 16px; } .product-card.product-card--horizontal .product-card__content .card-gallery { margin-bottom: auto; } .product-card.product-card--horizontal .card-gallery { flex: 1 0 123px; } .product-card.product-card--horizontal .product-card__content .rating-placeholder { margin-right: auto; } .product-card.product-card--horizontal .card-gallery { max-width: 111px; max-height: 111px; } } .product-card.product-card--horizontal .product-card__content .card-gallery .product-media { border-radius: 8px; overflow: hidden; } .product-card-link, :not(product-card-link) .product-card { width: auto; } .product-card .quick-add { display: none; } .card-hover-effect-lift .product-card:hover { box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); } @media screen and (min-width: 750px) { .product-card .product-media-container.media-fit.product-media-container--image { min-height: 240px; } .hero__content-wrapper .product-card .product-media-container.media-fit.product-media-container--image, .hero-slideshow .product-card .product-media-container.media-fit.product-media-container--image { min-height: auto; } } .product-list .product-card, .main-collection-grid .product-card { border: 1px solid var(--color-border, #e5e5e5); border-radius: 8px; overflow: hidden; transition: box-shadow 0.2s ease; } .product-card .custom-liquid img{ height: 16px; width: auto; } .product-card .custom-liquid .product-brand-name { height: 16px; font-size: 12px; color: #737373; } /* Product card */ /* Button */ .button.button-with-icon, .button-secondary.button-with-icon { display: flex; align-items: center; justify-content: center; min-width: 40px; min-height: 40px; padding: 8px; } .button.button-with-icon svg, .button-secondary.button-with-icon svg { width: 16px; height: 16px; } .button:not(.button-secondary,.button-unstyled, .button-with-icon) { padding: 10px 40px; font-size: 20px; font-weight: 600; line-height: 1; } add-to-cart-component .button-icon { display: none; } .product-card.product-card--horizontal add-to-cart-component .button-icon { display: block; } .product-card.product-card--horizontal add-to-cart-component .add-to-cart-text__content { display: none; } .product-card.product-card--horizontal .buy-buttons-block { margin-top: 0; } .product-card.product-card--horizontal .add-to-cart-text { min-width: 40px !important; min-height: 40px !important; } .add-to-cart-text.sold-out svg { width: 16px; height: 16px; } .product-card.product-card--horizontal .product-form-buttons button { padding: 0; } .product-card.product-card--horizontal add-to-cart-component svg { width: 16px; height: 16px; } @media screen and (max-width: 749px) { add-to-cart-component, .add-to-cart-text { min-width: 40px !important; min-height: 40px !important; } add-to-cart-component { display: flex; align-items: center; justify-content: center; } .product-card .product-form-buttons button { padding: 0; } add-to-cart-component svg { width: 16px; height: 16px; } add-to-cart-component .button-icon { display: block; } add-to-cart-component .add-to-cart-text__content { display: none; } } /* Button */ /* Collection list */ .ui-test-collection-list .section--full-width { padding-left: 24px; padding-right: 24px; } @media (min-width: 750px) { .product-list .card-gallery { border-bottom-right-radius: 0; border-bottom-left-radius: 0; } } /* Collection list */ /* Collection card */ .collection-card.collection-card--round { transition: all 0.4s ease; } .collection-card.collection-card--round:hover { transform: none; } .collection-card.collection-card--round .collection-card__image { transition: all 0.4s ease; border-radius: 50%; background-color: #fff; } .collection-card.collection-card--round:hover .collection-card__image { background-color: #0000009a; border-radius: 50%; } .collection-card.collection-card--round .collection-card__image .image-block__image { transition: all 0.4s ease; transform: scale(0.8); } .collection-card.collection-card--round:hover .collection-card__image .image-block__image { opacity: .8; transform: scale(1); } .collection-card.collection-card--image-bg .collection-card__content { padding: 0; } .collection-card__inner a { font-size: 16px; font-weight: 600; text-decoration: underline; } /* Collection card */ /* Group */ .group-block--width-page-width { max-width: 1550px; } /* Group */ .brand-logos img { filter: grayscale(1) opacity(0.6); } /* Badge */ .product-badges.product-badges--top-left { margin: 0; top: 12px; left: 12px; } .product-badges__badge { padding: 6px 12px; background-color: #ef4444; font-size: 12px; color: #fff; text-transform: uppercase; line-height: 1; } .product-card.product-card--horizontal .product-badges.product-badges--top-left { left: 185px; bottom: 0; top: calc(100% - 20px); height: 20px; } .product-card.product-card--horizontal .card-gallery { overflow: visible !important; } .product-card.product-card--horizontal .product-badges__badge { padding: 4px 12px; border-radius: 12px; } @media screen and (max-width: 749px) { .product-card.product-card--horizontal .product-badges.product-badges--top-left { left: 0; top: 0; } .product-card_buttons { margin: auto 0; } .product-card_mobile-title .text-block:nth-child(2) { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; } } .product-card_mobile-title .text-block:nth-child(2) p { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } @media screen and (max-width: 400px) { .product-badges__badge { font-size: 10px; } } /* Badge */ /* Delivery Badge */ .delivery-badge { display: flex; justify-content: center; align-items: center; gap: 4px; padding: 4px 8px; border-radius: 6px; line-height: 1; z-index: 1; box-shadow: 0px 2px 6px -3px #0009; /* Colors are set via inline styles from product tags */ /* Fallback colors if no tags specified: */ background: var(--badge-bg, #fff); color: var(--badge-text, #374151); } .delivery-badge__image { width: 16px; height: 16px; } .delivery-badge__text { font-weight: 500; } .delivery-badge-block { display: flex; flex-direction: column; gap: 4px; position: absolute; z-index: 1; } .delivery-badge-block.delivery-badge--top-left { top: 12px; left: 12px; } .delivery-badge-block.delivery-badge--top-right { top: 12px; right: 12px; } .delivery-badge-block.delivery-badge--bottom-left { bottom: 230px; left: 12px; } .delivery-badge-block.delivery-badge--bottom-right { bottom: 230px; right: 12px; } .delivery-badge__image { width: 16px; height: 16px; object-fit: contain; } @media screen and (max-width: 749px) { .delivery-badge--hide-mobile { left: 4px; top: auto; bottom: 4px; box-shadow: 1px 1px 7px -4px #000; } } @media screen and (min-width: 1023px) and (max-width: 1024px) { .delivery-badge-block.delivery-badge--bottom-left { bottom: 300px; } } @media screen and (min-width: 750px) { .delivery-badge--hide-desktop { display: none !important; } } /* Delivery badges inside product-information__media */ .product-information__media { position: relative; } .product-information__media .delivery-badge-block { position: absolute; z-index: 2; } .product-information__media .delivery-badge-block.delivery-badge--bottom-left { bottom: 12px; left: 12px; } .product-information__media .delivery-badge-block.delivery-badge--bottom-right { bottom: 12px; right: 12px; } .product-information__media .delivery-badge-block.delivery-badge--top-left { top: 12px; left: 150px; } .product-information__media .delivery-badge-block.delivery-badge--top-right { top: 12px; right: 12px; } @media screen and (max-width: 749px) { .product-information__media .delivery-badge-block.delivery-badge--top-left { left: 16px; z-index: 1; } .fullwidth-banner p { text-align: center; } .collection-list_overlay .text-block { width: 100%; text-align: left; } .collection-list_overlay p { padding: 0; } .service-options .section-content-wrapper.section-content-wrapper { flex-direction: row; flex-wrap: wrap; padding-top: 80px; } .service-options .layout-panel-flex--row>.group-block--width-fill { flex: calc(47%); } .brand-logos .custom-section-content { width: 100%; overflow: auto; position: relative; height: 150px; } .brand-logos .section-content-wrapper { width: 100%; overflow: auto; position: absolute; } .brand-logos .section-content-wrapper.layout-panel-flex--row>.group-block--width-fill { flex: none; } .collections-grid .resource-list--flex, .collections-grid .resource-list--grid { grid-template-columns: repeat(2,calc(50% - 8px)); } #shopify-section-template--16608037568571__product_list_CWmiQT .section--page-width { padding-right: 0; padding-left: 0; } .brand-logos .layout-panel-flex--row:not(.mobile-column) .image-block { max-height: 35px; width: 75px; } } /* Recent views */ .recent-views-grid { display: flex; gap: var(--resource-list-column-gap); } .recent-views-grid .resource-list__item { width: calc(25% - 18px); } .recent-views-grid .resource-list__item .product-card { width: 100%; } .recent-views-grid .resource-list__item.recent-views-empty-item { width: 100%; } @media screen and (max-width: 749px) { .recent-views-grid { flex-direction: column; } .recent-views-grid .resource-list__item { width: 100%; } .recent-views-grid .card-gallery { display: none; } } /* Recent views */ /* Slide cart */ #sticky-app-client { z-index: 99; } .slide-cart { min-width: 670px; } .fcsb-mini-cart-sidebar:not(.fcsb-preview .fcsb-mini-cart-sidebar) { --webkit-transform-show-left-start: -100%; --webkit-transform-show-right-start: 100%; } /* Slide cart */ /* Wishlist */ .tt-wishlist-details-content .tab-content-inner-wrap { flex-direction: column; flex-wrap: nowrap; gap: 16px; } .tt-wishlist-details-content { padding: 24px 0; } body .tt-container { display: flex; flex-direction: column; gap: 16px; padding: 0; } body .tt-wishlist-details-popup.drawer .tt-wishlist-details-content .tab-content-inner-wrap .tt-product-list { flex-direction: row; justify-content: flex-start; flex-wrap: nowrap; gap: 0; width: 100%; margin: 0; background-color: #f9fafb; } body .tt-wishlist-details-popup.drawer .tt-wishlist-details-content .tab-content-inner-wrap .tt-product-list:nth-child(odd) { background-color: #ffffff; } body .tt-wishlist-details-popup.drawer .tt-wishlist-details-content .tab-content-inner-wrap .tt-product-list:nth-child(even) { background-color: #f5f5f5; } body .tt-wishlist-details-popup.drawer { display: flex !important; } body .tt-wishlist-details-popup.drawer .tt-wishlist-details { max-width: 670px; padding: 24px; transform: translateX(670px); transition: all .4s ease; } body .tt-wishlist-details-popup.drawer.active .tt-wishlist-details { transform: translateX(0); } .tt-wishlist-details-content .tt-image-wrap { width: 128px; height: 128px; border-radius: 6px; overflow: hidden; } @media screen and (max-width: 749px) { .tt-wishlist-details-content .tt-image-wrap { width: 100px; height: 100px; } body .tt-wishlist-details-popup.drawer .tt-wishlist-details { padding: 16px; } } @media screen and (max-width: 400px) { .tt-wishlist-details-content .tt-image-wrap { width: 50px; height: 50px; } } .tt-wishlist-details-popup.drawer .tt-wishlist-details-main .tt-details-title { justify-content: flex-start !important; gap: 16px !important; margin: 0; padding: 0; border: 0; } .tt-wishlist-details-popup.drawer .tt-wishlist-details-main .tt-details-title p { display: flex; justify-content: center; align-items: center; gap: 8px; font-size: 16px; font-weight: 400; line-height: 1; } .tt-wishlist-details-popup.drawer .tt-product-list .tt-product-content .tt-product-title { order: -1; margin: 0; font-size: 14px; font-weight: 600; line-height: 16px; color: #0a0a0a; } .tt-wishlist-details-popup.drawer .tt-product-list .tt-product-content { padding: 0; position: relative; padding: 0 105px 0 16px; flex: 1; } .tt-wishlist-details-popup.drawer .tt-product-list .tt-product-content .tt-product-price-wrap { padding-top: 8px; font-size: 14px; font-weight: 500; color: #0a0a0a } .tt-product-vendor-text { font-size: 12px; color: #737373; } .tt-wishlist-details-popup.drawer .tt-qty-selector { position: absolute; right: 0; top: 0; } .tt-wishlist-details-popup.drawer .tt-qty-input { margin: 0; background-color: transparent; } .tt-wishlist-details-popup.drawer .tt-qty-input .tt-qty-label { display: none; } .tt-wishlist-details-popup.drawer .tt-qty-input .tt-qty-input-inner { border: none; } .tt-wishlist-details-popup.drawer .tt-qty-input .tt-qty-count { width: 28px; height: 28px; padding: 0; border: 1px solid #e5e5e5; border-radius: 6px; } .tt-wishlist-details-popup.drawer .tt-product-list .tt-product-action { width: 130px; position: absolute; right: 12px; bottom: 12px; } @media screen and (max-width: 749px) { .tt-wishlist-details-popup.drawer .tt-product-list .tt-product-action { width: 100%; position: absolute; right: 0; bottom: 10px; padding: 0 10px; } } .tt-wishlist-details-popup.drawer .tt-qty-input .tt-product-qty { font-size: 14px; width: 38px; height: 28px; } .tt-wishlist-details-popup.drawer .tt-product-list .tt-product-action .tt-atc-button-wrap button { display: flex; align-items: center; justify-content: center; width: 90px; height: 38px; padding: 0; margin: 0; font-size: 12px; line-height: 1; border-radius: 6px; } @media screen and (max-width: 749px) { .tt-wishlist-details-popup.drawer .tt-product-list .tt-product-action .tt-atc-button-wrap button { width: calc(100% - 24px); } } .tt-wishlist-details-popup.drawer .tt-details-close { box-shadow: none; background-color: transparent; } .tt-wishlist-details-popup.drawer .tt-details-close svg { width: 16px; height: 16px; } .tt-wishlist-details-popup.drawer .tt-product-list .tt-product-action .tt-product-remove-wishlist { box-shadow: none; background-color: transparent; } .tt-wishlist-details-popup.drawer .tt-product-list .tt-product-action .tt-product-remove-wishlist svg { width: 8px; height: 8px; } .wishlist-action-buttons button { display: flex; align-items: center; justify-content: center; gap: 4px; height: 36px; padding: 0 12px; border: 1px solid #e5e5e5; font-size: 12px; font-weight: 500; color: #0a0a0a; background-color: #fff; border-radius: 6px; cursor: pointer; } .wishlist-action-buttons .wishlist-enquiry-btn { background-color: #2563eb; color: #fff; border-color: #2563eb; } .wishlist-heart-icon { display: flex; color: #c70751; } .wishlist-heart-icon svg { width: 20px; height: 20px; } .wishlist-action-buttons { display: flex; align-items: center; justify-content: center; gap: 8px; } .wishlist-suggested-products, .wishlist-enquiry-form { padding: 16px; border-radius: 8px; background-color: #f9fafb; } .wishlist-enquiry-form { margin-top: 24px; } .wishlist-suggested-products h3, .wishlist-enquiry-form h3 { font-size: 16px; font-weight: 600; color: #0a0a0a; } .enquiry-form { display: flex; flex-wrap: wrap; gap: 16px; } .enquiry-form > div:not(.textarea-field) { flex: 0 0 calc(50% - 8px); } .enquiry-form .textarea-field { flex: 0 0 100%; } .enquiry-form label { display: block; font-size: 14px; font-weight: 500; color: #0a0a0a; } .enquiry-form input, .enquiry-form textarea { width: 100%; padding: 8px 12px; border: 1px solid #e5e5e5; border-radius: 6px; font-size: 14px; box-sizing: border-box; } .enquiry-form input:focus, .enquiry-form textarea:focus { outline: var(--focus-outline-width) solid currentcolor; outline-offset: var(--focus-outline-offset); } .enquiry-form input:hover, .enquiry-form textarea:hover { background-color: #fff; } .enquiry-form input:placeholder, .enquiry-form textarea:placeholder { color: #737373; } .enquiry-form textarea { resize: vertical; min-height: 80px; } .enquiry-form button { height: 40px; width: 100%; background: #c70751; color: #ffffff; border: none; border-radius: 6px; font-size: 14px; font-weight: 500; } .enquiry-form button:disabled { background: #9ca3af; cursor: not-allowed; } .suggested-products-grid { display: flex; gap: 12px; } .suggested-products-grid .suggested-product { max-width: 189px; } .suggested-product-image { width: 189px; height: 189px; border-radius: 6px; overflow: hidden; } .suggested-product-title { margin-top: 8px; font-size: 12px; color: #0a0a0a; font-weight: 500; line-height: 16px; } .suggested-product-price { font-size: 12px; color: #737373; } .enquiry-success-message { display: none; margin-top: 15px; padding: 12px 16px; background-color: #d4edda; color: #155724; border: 1px solid #c3e6cb; border-radius: 6px; font-size: 14px; font-weight: 500; } .enquiry-error-message { display: none; margin-top: 15px; padding: 12px 16px; background-color: #f8d7da; color: #721c24; border: 1px solid #f5c6cb; border-radius: 6px; font-size: 14px; font-weight: 500; } .enquiry-success-message.show { display: block; } .enquiry-error-message.show { display: block; } body .tt-wishlist-plp-btn-main:not(.tt-cart-btn) { position: relative; top: 0; right: 0; } body .tt-wishlist-plp-btn-main:not(.tt-cart-btn) .wishlist-plp-btn-wrap { --button-color: var(--color-secondary-button-text); --button-background-color: var(--color-secondary-button-background); --button-border-color: var(--color-secondary-button-border); --button-border-width: var(--style-border-width-secondary); display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 8px; border-radius: 6px; font-family: var(--button-font-family-secondary); font-weight: var(--button-font-weight-secondary); text-transform: var(--button-text-case-secondary); border-radius: var(--style-border-radius-buttons-secondary); text-align: var(--text-align); color: var(--button-color); background-color: var(--button-background-color); margin: 0; border: 1px solid var(--button-border-color); } body .tt-wishlist-plp-btn-main:not(.tt-cart-btn) .wishlist-plp-btn-wrap:hover { --button-color: var(--color-secondary-button-hover-text); --button-background-color: var(--color-secondary-button-hover-background); --button-border-color: var(--color-secondary-button-hover-border); } body .tt-wishlist-plp-btn-main .wishlist-plp-btn-wrap:hover svg path { fill: var(--button-color); } body .tt-wishlist-plp-btn-main .wishlist-plp-btn-wrap svg, body .tt-wishlist-plp-btn-main:not(.tt-cart-btn) .wishlist-plp-btn-wrap .wishlist-btn-content-span { width: 16px; height: 16px; } @media screen and (min-width: 750px) { body .product-list .tt-wishlist-plp-btn-main:not(.tt-cart-btn), body .main-collection-grid .tt-wishlist-plp-btn-main:not(.tt-cart-btn) { position: absolute; right: -32px; top: 19px; z-index: 100; } body .product-card.product-card--vertical .tt-wishlist-plp-btn-main:not(.tt-cart-btn) .wishlist-plp-btn-wrap, body .main-collection-grid .tt-wishlist-plp-btn-main:not(.tt-cart-btn) .wishlist-plp-btn-wrap { border: 0; padding: 0; width: 16px; height: 16px; } body .product-card.product-card--vertical .tt-wishlist-plp-btn-main:not(.tt-cart-btn) .wishlist-plp-btn-wrap:hover, body .main-collection-grid .tt-wishlist-plp-btn-main:not(.tt-cart-btn) .wishlist-plp-btn-wrap:hover { --button-color: #c70751; --button-background-color: transparent; --button-border-color: #c70751; } } @media screen and (max-width: 749px) { body .tt-container { padding-top: 96px; } .tt-wishlist-details-popup.drawer .tt-wishlist-details-main .tt-details-title { flex-direction: column; align-items: flex-start; width: 100%; position: fixed; top: 0px; left: 0; padding: 16px; z-index: 1; background-color: #fff; } .tt-wishlist-details-popup.drawer .tt-details-close { z-index: 999; } .suggested-product-image { max-width: 100%; height: auto; } .suggested-product { width: calc(33.33% - 8px); } } /* Wishlist */ /* Cart drawer */ .fcsb-mini-cart-main.fcsb-show { padding: 0; } .fcsb-mini-cart-title { margin: 0; padding: 24px; } .fcsb-mini-cart-title .fcsb-container { padding: 0; } .fcsb-mini-cart-title .fcsb-border, .fcsb-mini-cart-title .fcsb-border:empty { display: none; } .fcsb-mini-cart-title svg { width: 20px; height: 20px; color: #c70751; } .fcsb-title { display: flex; gap: 8px; font-size: 18px; } .fcsb-mini-cart-title .fcsb-quantity, .wishlist-count { margin: 0; padding: 3px 9px; background-color: #c70751; border-radius: 45%; font-size: 12px; line-height: 16px; color: #fff; font-weight: 600; } .fcsb-mini-cart-title .fcsb-close-button { margin: 0; padding: 0; width: 16px; height: 16px; position: relative; top: -16px; right: -7px; } .fcsb-mini-cart-product-container-grid.fcsb-compact { padding: 0; grid-column-gap: 0; } .fcsb-mini-cart-product-container-grid.fcsb-compact [data-cl="minicart-product-title"] { max-width: 75%; } .fcsb-mini-cart-products-container { display: flex; flex-direction: column; gap: 16px; padding: 0 24px; padding-top: 16px; overflow: auto; } .fcsb-mini-cart-products-container > div { flex-direction: row; justify-content: flex-start; flex-wrap: nowrap; gap: 0; width: 100%; margin: 0; padding: 12px; background-color: #f9fafb; border-radius: 8px; } .fcsb-mini-cart-products-container > div:nth-child(odd) { background-color: #ffffff; } .fcsb-mini-cart-products-container > div:nth-child(even) { background-color: #f5f5f5; } .fcsb-mini-cart-product-container-grid .fcsb-image { width: 96px; height: 96px; border-radius: 6px; overflow: hidden; } .fcsb-mini-cart-product-container-grid .fcsb-title { order: -1; font-size: 14px; line-height: 20px; font-weight: 600; } .fcsb-mini-cart-product-container-grid .fcsb-price-container { display: flex; flex-direction: row; gap: 8px; order: -1 } .fcsb-price-container .fcsb-price { font-size: 14px; line-height: 20px; font-weight: 500; color: #c70751; } .fcsb-price-container .fcsb-original-price { font-size: 12px; font-weight: 400; text-decoration: line-through; color: #6b7280; } .fcsb-mini-cart-product-container-grid .fcsb-title-variant-discount-error { padding-left: 16px; } .fcsb-mini-cart-product-container-grid .fcsb-original-price.fcsb-show { display: flex; } .fcsb-mini-cart-product-container-grid .fcsb-original-price, .fcsb-mini-cart-product-container-grid .fcsb-price { padding: 0; } .fcsb-mini-cart-product-container-grid.fcsb-compact .fcsb-remove { margin-left: -21px; width: 20px; min-width: 20px; } .fcsb-mini-cart-product-container-grid.fcsb-compact .fcsb-quantity { grid-area: auto; } @media screen and (max-width: 749px) { .fcsb-price-container .fcsb-price { font-size: 12px; } .fcsb-mini-cart-product-container-grid.fcsb-compact { position: relative; } .fcsb-mini-cart-product-container-grid.fcsb-compact .fcsb-quantity { position: absolute; right: 30px; } .fcsb-mini-cart-product-container-grid .fcsb-title-variant-discount-error { padding-bottom: 30px; } .fcsb-mini-cart-product-container-grid .fcsb-title { line-clamp: 1; -webkit-line-clamp: 1; } .fcsb-mini-cart-product-container-grid.fcsb-compact .fcsb-remove { margin: 0; position: absolute; right: 0; bottom: 2px; } } .fcsb-quantity button.fcsb-left, .fcsb-quantity button.fcsb-right { width: 28px; height: 28px; max-width: 28px; max-height: 28px; padding: 0; border: 1px solid #e5e5e5; border-radius: 6px; } .fcsb-quantity input { width: 32px; height: 28px; padding: 0; border: 0; font-size: 14px; background-color: transparent; } .fcsb-recommendations.fcsb-horizontal .fcsb-products .fcsb-product { flex: 1 0 33%; padding: 0; } .fcsb-recommendations.fcsb-horizontal .fcsb-products .fcsb-product .fcsb-image { min-height: 205px; width: 100%; height: 100%; border-radius: 6px; } .fcsb-recommendations.fcsb-horizontal .fcsb-products .fcsb-product .fcsb-add-button { display: none; } .fcsb-mini-cart-sidebar-recommendations { margin: 16px 0; padding: 16px; background-color: #f9fafb; position: sticky; bottom: 0; } .fcsb-mini-cart-sidebar-recommendations .fcsb-title { margin: 0; padding: 0; padding-bottom: 12px; font-size: 16px; font-weight: 600; } .fcsb-mini-cart-sidebar-recommendations .fcsb-products { gap: 12px; padding: 0; } .fcsb-select { display: none; } .fcsb-recommendations .fcsb-product .fcsb-product-title { padding-top: 8px; font-size: 12px; line-height: 1; font-weight: 500; color: #0A0A0A; } .fcsb-recommendations.fcsb-horizontal .fcsb-products .fcsb-product:not(:has(.fcsb-original-price.fcsb-show)) .fcsb-final-price { font-size: 12px; color: #737373; font-weight: 400; } .fcsb-mini-cart-main.fcsb-sticky-footer .fcsb-footer, .fcsb-footer { display: flex; flex-direction: column; width: 100%; margin: 0; padding: 24px; border-top: 1px solid #e5e5e5; box-shadow: none; } .fcsb-mini-cart-total-discount, .fcsb-mini-cart-subtotal { padding: 0; border: 0; } .fcsb-mini-cart-total-discount div:first-child { display: flex; width: 100%; } .fcsb-mini-cart-total-discount span:first-child, .fcsb-mini-cart-subtotal span:first-child { margin-right: auto; } .fcsb-mini-cart-subtotal { order: -1; padding-top: 12px; font-size: 18px; } .fcsb-mini-cart-total-discount { order: -2; font-weight: 400; } .fcsb-mini-cart-shipping { font-size: 12px; color: #737373; font-weight: 400; } .fcsb-mini-cart-button-bar .fcsb-checkout { border-radius: 6px; transition: background-color 0.4s ease; } .fcsb-mini-cart-button-bar .fcsb-checkout:hover { background-color: #15803d; } .fcsb-mini-cart-product-container-grid .fcsb-selling-plans { display: none; } @media screen and (max-width: 749px) { .fcsb-mini-cart-product-container-grid.fcsb-compact [data-cl="minicart-product-title"] { max-width: 100%; } .fcsb-recommendations .fcsb-product .fcsb-product-title { max-height: 33px; } .fcsb-mini-cart-products-container { padding: 0 8px; } .fcsb-mini-cart-title { padding: 16px; } .fcsb-mini-cart-products-container > div { padding: 8px; box-shadow: -5px 5px 10px -5px #0005; } .fcsb-mini-cart-main.fcsb-sticky-footer .fcsb-footer, .fcsb-footer { padding: 16px; } .fcsb-recommendations.fcsb-horizontal .fcsb-products .fcsb-product { flex: 1 33%; gap: 0; } .fcsb-mini-cart-secure-checkout { padding: 0; } .fcsb-mini-cart-secure-checkout .fcsb-secure-checkout-image { height: 22px; width: auto; } .fcsb-mini-cart-subtotal { padding-top: 6px; } } .custom-empty-cart { display: flex; flex-direction: column; align-items: center; justify-content: center; margin-top: 80px; } .custom-empty-cart h4, .custom-empty-cart p { margin: 0; } .custom-empty-cart h4 { font-size: 18px; color: #0A0A0A; font-weight: 600; } .custom-empty-cart p { font-size: 14px; color: #737373; font-weight: 400; } .custom-empty-cart svg { width: 64px; height: 64px; margin-bottom: 16px; color: #d1d5db; } @media (max-height: 1080px) { .fcsb-recommendations.fcsb-horizontal .fcsb-products .fcsb-product .fcsb-image { min-height: 0; max-height: 115px; object-fit: cover; } .fcsb-mini-cart-sidebar-recommendations { padding-bottom: 0; } } @media screen and (min-width: 750px) { .fcsb-mini-cart-sidebar:not(.fcsb-preview .fcsb-mini-cart-sidebar) { --width: 670px; } .fcsb-recommendations.fcsb-horizontal .fcsb-products .fcsb-product .fcsb-image { max-height: 90px; } } @media screen and (max-width: 749px) { .fcsb-recommendations.fcsb-horizontal .fcsb-products .fcsb-product .fcsb-image { max-height: 95px; } .fcsb-recommendations .fcsb-product .fcsb-original-price.fcsb-show { padding-right: 4px; font-size: 10px; line-height: 1.3; } .fcsb-recommendations .fcsb-product .fcsb-final-price { font-size: 10px; line-height: 1.3; } } /* Cart drawer */ /* Wishlist Login Modal */ .wishlist-modal-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); display: flex; align-items: center; justify-content: center; z-index: 10000; opacity: 0; transition: opacity 0.3s ease; } .wishlist-modal-overlay.wishlist-modal-visible { opacity: 1; } .wishlist-modal-content { background: white; padding: 24px; border-radius: 8px; max-width: 400px; width: 90%; text-align: left; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3); transform: scale(0.9); transition: transform 0.3s ease; } .wishlist-modal-content.wishlist-modal-content-visible { transform: scale(1); } .wishlist-modal-title { color: #0A0A0A; font-size: 18px; font-weight: 600; margin: 0; } .wishlist-modal-description { margin: 0; padding-top: 6px; color: #737373; font-size: 14px; font-weight: 400; } .wishlist-modal-buttons { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; margin-bottom: 15px; } .wishlist-modal-login-btn { display: flex; align-items: center; justify-content: center; height: 40px; width: 100%; margin-top: 45px; border-radius: 6px; background-color: #c70751; color: #fff; } .wishlist-modal-cancel { text-align: center; } .wishlist-modal-cancel-btn { background: none; border: none; color: #0a0a0a; cursor: pointer; font-size: 14px; text-decoration: underline; color: #0a0a0a; } /* Wishlist Login Modal */ /* Filtering */ .checkbox__label-text { white-space: nowrap; max-width: 75vw; overflow: auto; } .facets__actions { display: flex !important; justify-content: center; } .facets__see-results { display: none !important; justify-content: center; opacity: 0; transform: translateY(10px); transition: opacity 0.2s ease, transform 0.2s ease; } .facets__see-results.facets__see-results--visible { display: flex !important; opacity: 1; transform: translateY(0); } .facets:not(.facets--drawer) .facets__actions { position: sticky; bottom: 15px; width: 100%; } .facets.facets-controls-wrapper { display: grid; grid-template-columns: 1fr repeat(var(--centered-column-number), minmax(0, calc((var(--page-width) - var(--page-margin) * 2) / var(--centered-column-number)))) 1fr; gap: 0; padding-bottom: 24px; } .facets--filters-title { display: flex; align-items: center; height: 36px; font-size: 18px; } .facets--horizontal .products-count-wrapper { grid-column: 5 / 6; width: 100%; } .sorting-filter { grid-column: 12 / 14; } .sorting-filter accordion-custom { display: flex; align-items: center; } .facets--horizontal .facets__summary { padding: 8px 12px; font-size: 14px; background-color: #fff; border: 1px solid #e5e5e5; border-radius: 6px; } .facets--horizontal .facets__panel { width: 180px; margin-left: auto; } .facets__status:not(:empty) { margin: 0; font-size: 14px; font-weight: 500; } .sorting-filter__options { width: 180px; margin-top: 6px; padding: 4px; border: 1px solid #e5e5e5; border-radius: 6px; } .sorting-filter__option { display: flex; align-items: center; min-width: 0; height: 32px; padding: 0 6px; font-size: 14px; font-weight: 500; border-radius: 6px; } .sorting-filter__option[aria-selected="true"] { background-color: #f9fafb; } .sorting-filter__option svg { width: 18px; height: 18px; } .facets.facets--vertical:not(.facets--drawer) { margin-top: -60px; padding: 24px; background-color: #fff; border-radius: 8px; position: sticky; top: 0; /* max-height: 100vh; */ } .facets:not(.facets--drawer) .facets-remove--mobile-and-vertical { margin: 0; position: absolute; top: 26px; right: 24px; } .facets__summary { padding: 16px 0; font-size: 16px; font-weight: 500; } .facets__summary:hover .facets__label { text-decoration: underline; } .facets__status-wrapper { display: none; } .facets-remove__pill { display: none; } .facets-block-wrapper--vertical { z-index: 3; } .facets:not(.facets--drawer) .facets__clear-all { display: flex; align-items: center; gap: 12px; font-size: 14px; } .facets__filters-wrapper .facets__item:first-child::before { display: none; } .facets__inputs-wrapper:not(:has(.facets__inputs-list)), .facets__inputs-wrapper .facets__inputs-list { gap: 8px; } .facets__inputs-list-item { display: flex; align-items: center; height: 30px; } .checkbox__label { color: #0A0A0A; } .checkbox__label-check { display: flex; justify-content: center; align-items: center; width: 16px; height: 16px; border: 1px solid #171717; border-radius: 4px; } .checkbox__label-check svg { display: none; } .checkbox__input:checked + .checkbox__label .checkbox__label-check { background-color: #171717; } .checkbox__input:checked + .checkbox__label .checkbox__label-check svg { display: block; color: #fff; } .facets__summary .svg-wrapper, .facets__summary .svg-wrapper > svg, .facets__summary svg { width: 16px; height: 16px; } details[open] .facets__summary svg { transform: rotate(180deg); } .facets:not(.facets--drawer) .facets__filters-wrapper { margin: 0; overflow: auto; height: calc(100vh - 166px); } @media (min-width: 750px) { .facets__actions { display: none; } } @media (max-width: 749px) { .facets.facets-controls-wrapper { height: 0px; padding: 0; overflow: visible; z-index: 1; } .sorting-filter { grid-column: 1 / 14; max-width: 260px; padding-right: 16px; position: relative; bottom: -1px; } .facets--horizontal .facets__summary { width: calc(100vw - 180px); height: 40px; } details[open] .sorting-filter__options { position: absolute; z-index: 2; left: 18px; } .sorting-filter .facets__label { display: none; } .facets--horizontal .facets__panel { width: auto; margin-left: 0; } .facets-block-wrapper--vertical+.facets-toggle { justify-content: flex-end; } .facets-toggle__button { padding: 8px 24px; background-color: #0d9488; font-size: 14px; border-radius: 6px; color: #fff; } .filter-count-bubble { padding: 2px 8px; background-color: #fff; color: #000; width: auto; display: flex; align-items: center; justify-content: center; border: 0; aspect-ratio: unset; font-size: 12px; min-height: 20px; border-radius: 30px; } .filter-count-bubble__background { display: none; } .facets--drawer[open] { width: 100%; } /* .button:not(.button-secondary,.button-unstyled,.button-with-icon) { padding: 8px 16px; background-color: transparent; border: 1px solid #c70751; font-size: 14px; border-radius: 6px; line-height: 1.7; font-weight: 500; } */ .facets.facets--drawer .sorting-filter { display: none; } .facets__actions { gap: 0; padding: 16px; background-color: #fff; } .facets__clear-all.active { display: flex; align-items: center; justify-content: center; gap: 8px; background: transparent; border: none; padding: 0; box-shadow: none; color: #c70751; } .facets__clear-all svg { width: 16px; height: 16px; } facet-remove-component { display: flex; align-items: center; order: 1; } } .facets--vertical .facets__inputs-wrapper .facets__inputs-list--swatches { gap: 8px; } .facets--vertical .facets__inputs-wrapper .facets__inputs-list--swatches .variant-option--buttons { padding: 4px; } /* Filtering */ /* Custom slider */ .flow-rate-slider-container { margin: 1rem 0; padding: 1rem; border: 1px solid #e5e7eb; border-radius: 8px; } .flow-rate-slider-container .filter-title { font-weight: 600; margin-bottom: 1rem; } .noUi-connect { background: #171717; border-radius: 10px; } .noUi-horizontal .noUi-handle { width: 19px; height: 19px; border-radius: 50%; background: white; border: 1px solid #171717; right: -10px; top: -5px; } .noUi-horizontal .noUi-handle:after, .noUi-horizontal .noUi-handle:before { display: none; } .converted-to-slider facet-inputs-component { display: none !important; } [class*="-slider-container"].loading { opacity: 0.5; } [class*="-slider-container"] .filter-title { font-weight: 600; margin-bottom: 1rem; font-size: 0.875rem; color: #374151; } [class*="-slider-container"] .range-inputs { display: flex; gap: 1rem; margin-bottom: 1rem; align-items: center; } [class*="-slider-container"] .range-input-group { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; flex: 1; } [class*="-slider-container"] .range-input-group label { height: 16px; min-width: 2rem; font-size: 0.75rem; color: #6b7280; font-weight: 500; } [class*="-slider-container"] .range-input-group input[type="number"] { width: 100%; padding: 7px 12px; border: 1px solid #e5e5e5; border-radius: .375rem; font-size: 14px; line-height: 1; background: #fff; } [class*="-slider-container"] .range-input-group input[type="number"]:focus { outline: none; border-color: #3b82f6; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1); } [class*="-slider-container"] .range-input-group input[type="number"]:hover { border-color: #9ca3af; } .range-controls { padding: 8px; } .range-slider { margin: 22px 10px 10px; height: 10px; background: #e5e7eb; border: none; border-radius: 3px; box-shadow: none; } .range-display { text-align: center; font-weight: 500; color: #374151; font-size: 0.875rem; } .range-display div { display: flex; justify-content: space-between; } .flow-rate-slider-container { margin: 1rem 0; padding: 1rem; border: 1px solid #e5e7eb; border-radius: 8px; background: white; opacity: 1; transition: opacity 0.2s ease; } .flow-rate-slider-container.loading { opacity: 0.5; } .flow-rate-slider-container .filter-title { font-weight: 600; margin-bottom: 1rem; font-size: 0.875rem; color: #374151; } .price-facet { display: none; } /* Custom slider */ /* Product types section */ .collection-product-types__container { max-width: 1440px; margin: 0 auto; padding: 24px 0; position: relative; } .collection-product-types__title { font-size: 1.5rem; font-weight: 600; margin-bottom: 1.5rem; text-align: center; color: rgb(var(--color-foreground)); } .collection-product-types__grid { display: flex; gap: 16px; overflow-x: auto; overflow-y: hidden; scroll-behavior: smooth; scrollbar-width: none; /* Firefox */ -ms-overflow-style: none; /* IE and Edge */ } /* Hide scrollbar for Chrome, Safari and Opera */ .collection-product-types__grid::-webkit-scrollbar { display: none; } /* Navigation arrows */ .collection-product-types__nav { position: absolute; top: 50%; transform: translateY(-50%); width: 40px; height: 40px; background: rgba(255, 255, 255, 0.95); border: 1px solid rgba(0, 0, 0, 0.1); border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all 0.2s ease; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); z-index: 1; } .collection-product-types__nav:hover { background: rgba(255, 255, 255, 1); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); transform: translateY(-50%) scale(1.05); } .collection-product-types__nav--prev { left: -20px; } .collection-product-types__nav--next { right: -20px; } .collection-product-types__nav svg { width: 20px; height: 20px; fill: #1f2937; } .collection-product-types__nav.disabled { opacity: 0.3; cursor: not-allowed; pointer-events: none; } .collection-product-types__item { position: relative; } .collection-product-types__button { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; width: 285px; height: 140px; padding: 0; border-radius: 8px; background-color: transparent; border: none; cursor: pointer; text-decoration: none; } .collection-product-types__button:hover { background-color: transparent; } .collection-product-types__button.active { background-color: transparent; } .collection-product-types__image-wrapper { border-radius: 50%; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); transition: box-shadow 0.2s ease; } .collection-product-types__button:hover .collection-product-types__image-wrapper { box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); } .collection-product-types__image { width: 92px; height: 92px; object-fit: cover; border-radius: 50%; display: block; } .collection-product-types__placeholder { color: rgb(var(--color-foreground), 0.6); } .collection-product-types__content { text-align: center; } .collection-product-types__name { font-size: 14px; font-weight: 500; color: #1f2937; } .collection-product-types__count { font-size: 0.875rem; color: rgb(var(--color-foreground), 0.7); } @media (max-width: 749px) { .collection-product-types__button { justify-content: flex-start; min-height: 120px; height: 100%; width: 80px; padding: 8px; } .collection-product-types__image { width: 60px; height: 60px; } .collection-product-types__name { font-size: 12px; } .collection-product-types__grid { padding: 0 16px; } .collection-product-types__nav { display: none; } } /* Product types section */ /* Collection */ .collection__mobile-ai { display: none; } @media (max-width: 749px) { .collection__mobile-ai { display: flex; } .collection__mobile-ai .custom-section-content { width: 100%; z-index: 2; } .collection__mobile-ai .ai-search-container { background-color: transparent; margin-bottom: 12px; } .main-collection-grid { padding: 14px 16px; } .product-grid { grid-template-columns: 1fr; } .product-grid .card-gallery { display: none; } .product-grid .product-card__link { background-color: #fff; } .collection__mobile-ai .shopify-block.shopify-app-block { width: 100%; } .ai-search-container { height: 70px; margin: 0; padding: 12px 16px; background-color: #fff; box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.05) 0px 1px 2px; } .shopify-section-group-header-group .ai-search-container { height: 0; padding: 0; margin: 0; } .ai-search-trigger { justify-content: flex-start; background-color: #f9fafb; } .collection__mobile-ai.group-block--width-mobile-fill { width: 100vw !important; } #shopify-section-template--16951567843387__section { z-index: 2; } } /* Collection */ /* Search */ .search-modal { /* width: 100%; position: absolute; top: 0; height: 40px; */ } .search-modal__content.dialog-modal { /* max-width: 100%; width: 100%; margin: 0; position: absolute; top: 0; left: 0; */ } .predictive-search { border-radius: 6px; } .search-modal__content.dialog-modal::backdrop { background-color: transparent; backdrop-filter: brightness(1) !important; } .predictive-search-form__header-inner { height: 40px; padding: 0; border-radius: 6px; border: 0; } .predictive-search-form__content { max-height: 65dvh; } .predictive-search-form__content-wrapper { display: none; top: 90%; } .predictive-search__reset-button { position: absolute; right: 40px; } .predictive-search .resource-card__image { aspect-ratio: 4/3; object-fit: contain; } .predictive-search-results__inner { padding-top: 10px; } .predictive-search__search-button { background-color: #c70751; } .predictive-search-results__resource-header, .predictive-search-results__title { font-size: 16px; margin-bottom: 10px; } .predictive-search-results__wrapper { padding-bottom: 16px; } .predictive-search-form__footer { background-color: #fff; /* box-shadow: 0px 11px 20px 0px #000; */ } /* Search */ /* Collections */ .image-block__image { transition: transform 0.4s ease; } .collection-card:hover .image-block__image { transform: scale(1.05); } /* Collection */ /* AI seach */ .ai-search-trigger { width: 100%; border-radius: 6px; padding: 12px 16px; font-size: 14px; font-weight: 400; } .ai-trigger-icon { display: flex; align-items: center; width: 16px; height: 16px; color: #c70751; } @media (max-width: 749px) { .ai-modal-content { width: 100%; border-radius: 0; } } /* AI search */ /* Collection list */ .collection-card { height: 100%; box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05); transition: all .4s ease; border-radius: 8px; } .collection-card:hover { box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); /* transform: translateY(-5px); */ } .collection-card:hover .collection-card__image { background-color: #e8e8e8; } .collection-card .link { display: flex; align-items: center; justify-content: center; text-decoration: none; font-size: 14px; font-weight: 500; gap: 8px; } .collection-card .link .button-icon { width: 16px; height: 16px; } /* Collection list */ ._formContainer_1q1d2_30 { display: none; } /* Cart page */ .cart-title .h2 { font-size: 30px; } .cart-summary-card { display: flex; flex-direction: column; gap: 24px; width: 100%; } h2.cart-summary-card__title { margin: 0; font-size: 20px; font-weight: 600; } .cart-summary-card__totals { display: flex; flex-direction: column; gap: 16px; width: 100%; } .cart-summary-line { display: flex; align-items: flex-start; justify-content: space-between; font-size: 16px; } .cart-summary-line__label { display: inline-flex; align-items: center; } .cart-summary-line__value { font-weight: 600; text-align: right; flex-shrink: 0; } .cart-summary-line.cart-summary-line--total { font-size: 18px; font-weight: 600; } .cart-summary-card__discounts { display: flex; flex-direction: column; gap: var(--gap-2xs); padding: var(--padding-xs); background: rgb(var(--color-foreground-rgb) / 0.04); border-radius: var(--border-radius-sm, var(--border-radius)); } .cart-summary-card__discount-list { display: flex; flex-direction: column; gap: var(--gap-4xs); margin: 0; padding: 0; } .cart-summary-card__discount { display: flex; align-items: center; justify-content: space-between; gap: var(--gap-sm); flex-wrap: wrap; font-size: var(--cart-font-size--xs); } .cart-summary-card__discount-label { display: inline-flex; align-items: center; gap: var(--gap-4xs); } .cart-summary-card__discount-label svg { width: var(--icon-size-sm); height: var(--icon-size-sm); } .cart-summary-card__discount-value { font-weight: var(--font-weight-medium); } .cart-summary-card__savings { margin: 0; font-size: var(--cart-font-size--sm); color: var(--color-primary); } .cart-summary-card__installments, .cart-summary-card__tax { font-size: var(--cart-font-size--xs); color: rgb(var(--color-foreground-rgb) / var(--opacity-subdued-text)); } .cart-summary-card__installments { display: none; } .cart-summary-help { display: inline-flex; align-items: center; justify-content: center; width: 1.25rem; height: 1.25rem; border-radius: 50%; border: 1px solid rgb(var(--color-foreground-rgb) / 0.2); font-size: 0.75rem; font-weight: var(--font-weight-medium); } .cart-summary-card__cta { display: flex; flex-direction: column; gap: var(--gap-sm); } .button--full { width: 100%; } .cart-summary-card__payments { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 8px; } .cart-summary-card__payment-icon { display: inline-flex; align-items: center; justify-content: center; padding: var(--padding-4xs) var(--padding-3xs); border-radius: var(--border-radius-xs, calc(var(--border-radius) / 2)); background: rgb(var(--color-foreground-rgb) / 0.08); } .cart-summary-card__trust { display: flex; flex-direction: column; align-items: center; text-decoration: none; color: inherit; } .cart-summary-card__stars { display: inline-flex; gap: 0.125rem; color: #fdb022; font-size: 1rem; } .cart-summary-card__trust-copy { display: flex; flex-direction: column; } .cart-summary-card__trust-title { margin: 0; font-size: 14px; font-weight: 500; color: #0A0A0A; } .cart-summary-card__trust-subtitle { margin: 0; font-size: 14px; color: #4b5563; } .cart-summary-card__financing { display: grid; gap: var(--gap-sm); } @media screen and (min-width: 750px) { .cart-summary-card__financing { grid-template-columns: 1fr; } } .cart-summary-card__finance { display: flex; flex-direction: column; gap: 4px; align-items: start; padding: 16px; border: 1px solid #e5e5e5; border-radius: 8px; } .cart-summary-card__finance-wrapp { display: flex; gap: 8px; } .cart-summary-card__finance-badge { display: inline-flex; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem; border-radius: 0.75rem; font-weight: var(--font-weight-bold); background: rgb(var(--color-foreground-rgb) / 0.08); } .cart-summary-card__finance-body { font-size: 14px; color: #4b5563; } .cart-summary-card__finance-title { margin: 0; font-size: 16px; color: #0A0A0A; font-weight: 500; } .cart-summary-card__finance-description { margin: 0; font-size: var(--cart-font-size--xs); } .cart-summary-card__finance-link { text-decoration: none; font-size: var(--cart-font-size--xs); font-weight: var(--font-weight-medium); color: var(--color-primary); } .cart-summary-card__actions { display: flex; flex-direction: column; border-block: 1px solid var(--color-border); padding-block: var(--padding-sm); margin: 0; border-bottom: none; padding-bottom: 0; } .cart-actions__divider { border-block-start: 1px solid var(--color-border); } .cart__summary-totals:not(:has(.cart-actions)) { margin-block-start: 0; border-block-start: none; padding-block-start: 0; } .cart__installments { color: var(--color-foreground); } .template-cart .section--page-width { display: block; max-width: 1268px; margin: 0 auto; padding: 0 24px ; } .section--page-width .cart-page:has(.cart__container--extend) { grid-column: 2 / 3; grid-template-columns: 1fr 382px; column-gap: 32px; } @media screen and (max-width: 749px) { .section--page-width .cart-page:has(.cart__container--extend) { display: flex; flex-direction: column; } } .cart-page__summary { margin-left: auto; border-radius: 8px; border-width: 1px; } @media screen and (max-width: 749px) { .cart-page__summary { width: 100%; margin-bottom: 24px; } } .cart__container--extend .cart__summary-inner { grid-row: inherit; height: auto; padding: 24px; border: 1px solid #e5e5e5; border-radius: 8px; background-color: #fff; } .cart-actions { width: 100%; } .cart-items--dividers .cart-items__table-row { margin-bottom: 24px; padding: 24px; background-color: #fff; border: 1px solid #e5e5e5; border-radius: 8px; } @media screen and (max-width: 749px) { .cart-items--dividers .cart-items__table-row { grid-template-columns: clamp(100px, 18cqi, 8rem) minmax(0, 1fr) minmax(var(--cart-item-price-width), auto); } .cart-items__table-row:last-child { margin-bottom: 0; } } .cart-items__table caption, .cart-items__table thead { display: none; } .cart-items__table { border-spacing: 0; } .template-cart .tt-wishlist-plp-btn-main.tt-cart-btn { margin: 0; } @media screen and (max-width: 749px) { .template-cart .tt-wishlist-plp-btn-main.tt-cart-btn, .cart-item-card__action { flex: 0 1 calc(50% - 16px); } } .template-cart .tt-wishlist-plp-btn-main.tt-cart-btn .wishlist-plp-btn-wrap { display: inline-flex; gap: 0; margin: 0; padding: 0; width: auto; height: auto; background: none; border: none; color: #2563eb; font-size: 14px; } .template-cart .tt-wishlist-plp-btn-main.tt-cart-btn .wishlist-plp-btn-wrap:hover { color: #1d4ed8; } .template-cart .tt-wishlist-plp-btn-main.tt-cart-btn .wishlist-btn-content-span { align-items: center; } .template-cart .tt-wishlist-plp-btn-main:not(.tt-cart-btn) .wishlist-plp-btn-wrap { width: auto; height: auto; background-color: transparent; border: none; color: #2563eb; font-size: 14px; } .template-cart .cart-items__quantity .quantity-selector { height: 38px; border-radius: 8px; border-color: #e5e5e5; } .template-cart .quantity-selector .quantity-minus { width: 32px; height: 38px; } .quantity-selector :is(.quantity-minus, .quantity-plus) { width: 32px; height: 38px; } .template-cart .quantity-selector input[type='number'] { display: flex; max-width: none; width: 36px; height: 38px; padding: 0; margin: 0; } .cart-item-card__quantity-control { display: flex; justify-content: space-between; align-items: center; width: 100%; } .discount-details .icon-arrow { width: 16px; height: 16px; } .discount-details[open] .icon-arrow { transform: rotateZ(90deg); } .discount-details .cart-discount__label { font-size: 16px; color: #0A0A0A; } .cart-discount__content { height: auto; } .cart-discount__form { flex-direction: column; } .cart-discount__input , .cart-discount__button { width: 100%; } .cart-discount__input { border-color: #d1d5db; } .discount-details .cart-discount__button { height: 40px; border: 1px solid #e5e5e5; font-size: 14px; font-weight: 400; background-color: transparent; color: #0a0a0a; } .cart-summary-card__finance .cart-summary-card__finance-badge { width: 24px; height: 24px; background-color: #9333ea; font-size: 12px; border-radius: 4px; color: #fff; } .cart-summary-card__finance:first-child .cart-summary-card__finance-badge { background-color: #db2777; } .template-cart .section-resource-list__header, .template-cart .resource-list.resource-list__carousel.cart-not-empty { width: calc(100% - 414px); padding-bottom: 32px; } .template-cart .section-resource-list__header { padding-bottom: 24px; } @media screen and (max-width: 749px) { .template-cart .section-resource-list__header, .template-cart .resource-list.resource-list__carousel.cart-not-empty { width: 100%; } } .cart-item-card__price-current { font-weight: 500; font-size: 18px; } .cart-item-card__price-compare { font-size: 14px; } .wallet-cart-grid { display: none; } .cart-summary__savings { font-size: 14px; color: #16a34a; } .cart-title_empty { display: flex; flex-direction: column; align-items: center; } .cart-title_empty svg { width: 96px; height: 96px; color: #d1d5db; } .cart-title_empty p { margin-bottom: 16px; font-size: 30px; } .cart-title_empty span { font-size: 16px; color: #4b5563; font-weight: 400; } .button.cart-items__empty-button { height: 40px; padding: 8px 16px; font-size: 14px; font-weight: 400; background-color: #c70751; } @media screen and (max-width: 749px) { .template-cart .resource-list__carousel .product-grid__card.product-grid__card { gap: 0; } .template-cart add-to-cart-component .button-icon { display: none; } .template-cart add-to-cart-component .add-to-cart-text__content { display: flex; } body.template-cart .tt-wishlist-plp-btn-main:not(.tt-cart-btn) { position: absolute; top: 10px; right: -10px; } .template-cart .product-card .price { color: #16a34a; } } /* Cart page */ /* Product page */ @media screen and (max-width: 749px) { .main-product--specifications { display: none; } .product-media__drag-zoom-wrapper { --drag-zoom-scale: 1 !important; } } .product-information__grid:not(:has(.product-information__media:empty)).product-information--media-left:has(.media-gallery--extend) { grid-column: 1 / 4; } .template-product { background-color: #f9fafb; } .template-product main { max-width: 1488px; margin: 32px auto; margin-top: 90px; padding: 32px; border-radius: 8px; background-color: #fff; position: relative; } @media screen and (min-width: 820px) and (max-width: 1024px) { .template-product main { max-width: 94vw; width: 100%; margin: 90px auto 16px; } } .product-details { width: 565px; padding: 0 !important; } @media screen and (min-width: 820px) and (max-width: 1024px) { .product-details { max-width: 565px; width: 100%; } .sticky-product-bar.is-visible { left: auto; right: 30px; } .template-product product-price.text-block { flex-direction: column; max-height: 95px; } .template-product .prod-sku { justify-content: flex-start; } .template-product .breadcrumbs { padding: 15px 8px; } } .template-product .product__header .custom-liquid img { max-width: 100px; } .product-information__grid { gap: 48px; } @media screen and (max-width: 749px) { .template-product main { max-width: 100%; margin-top: 55px; padding: 0 16px; border-top: 1px solid #e5e5e5; } .product-details { max-width: 100%; width: 100%; flex-direction: column; } .product-information__grid { gap: 0; } } .product-information__media { padding-right: 0 !important; } .template-product .slideshow-controls__thumbnails-container { top: 32px !important; } .template-product .product-information .slideshow-control { width: 120px; border: 2px solid transparent; border-radius: 8px; outline: none; } .template-product .product-information .slideshow-control[aria-selected="true"] { border-color: #00529b; } .template-product .product-information .slideshow-controls__thumbnails { gap: 12px !important; } .product-spec-details { display: flex; flex-direction: row; flex-wrap: wrap; gap: 24px; } .template-product main > .section-wrapper, .template-product main > .product-list, .template-product main > .product-comparison, .template-product main > .product-recommendations { max-width: 807px; margin-bottom: 25px; } .template-product main > .product-recommendations .product-recommendations::before { content: ""; position: absolute; width: 100%; height: 1px; background-color: #e5e7eb; bottom: 0px; z-index: 1; } @media screen and (max-width: 749px) { .template-product main .product-recommendations .resource-list__carousel slideshow-slides { flex-direction: column; } } .template-product main > .product-list ~ .shopify-section{ max-width: 807px; } .template-product .gpo-app, .template-product .gpo-element, .template-product .gpo-group { margin: 0; } .prod-savings { display: none; margin: 0; font-weight: 600; } .template-product .prod-savings { display: flex; gap: 10px; margin-top: 6px; margin-bottom: 0; } .template-product .prod-savings[hidden] { display: none; } .template-product .prod-savings .prod-savings__content { padding: 2px 10px; border-radius: 30px; font-size: 12px; color: #166534; background-color: #dcfce7; } .prod-sku { display: none; margin: 0; font-weight: 600; } .prod-sku span:first-child { font-weight: 400; } .template-product .prod-sku { display: flex; flex: 0 auto; gap: 10px; margin: 0; padding-top: 6px; font-size: 10px; justify-content: flex-end; } .template-product product-price.text-block { display: flex; flex-direction: row; align-items: center; justify-content: space-between; gap: 12px; max-height: 35px; } @media screen and (min-width: 820px) and (max-width: 1024px) { .template-product product-price.text-block { flex-direction: column; max-height: 95px; } .template-product .prod-sku { justify-content: flex-start; } } @media screen and (max-width: 749px) { .template-product .prod-sku { display: none; } .template-product product-price.text-block { display: none; } .product-comparison { display: none; } } .template-product product-price.text-block > div { display: flex; align-items: center; gap: 12px; max-height: 35px; } .template-product .product-details .price { font-size: 30px; color: #16a34a; font-weight: 600; } .template-product .product-details .compare-at-price { display: flex; padding-top: 5px; font-size: 20px; color: #6b7280; } .template-product .text-block h1 { font-size: 30px; font-weight: 600; white-space: break-spaces; } .jdgm-preview-badge .jdgm-star.jdgm-star { display: inline-flex; width: 16px; height: 16px; } .product_download-specs .group-block-content { flex-direction: row; } .product_download-specs .group-block-content .shopify-app-block, .product_download-specs .group-block-content .button { width: 50%; } .template-product .product_download-specs .group-block-content .wishlist-pdp-btn-wrap, .product_download-specs .group-block-content .button { height: 40px; padding: 0; background: transparent; color: #000; border: 1px solid #e5e5e5; border-radius: 6px; font-size: 14px; font-weight: 400; } .product_download-specs .group-block-content .button:hover { background-color: #f5f5f5; } @media screen and (max-width: 749px) { .product_download-specs .group-block-content .button, .product_download-specs .wishlist-pdp-btn-main .wishlist-pdp-btn-wrap .wishlist-btn-content-span { font-size: 12px; } } .template-product .product_download-specs .group-block-content .wishlist-pdp-btn-wrap { border-color: #00529b; color: #00529b; } .template-product .product_download-specs .group-block-content .wishlist-pdp-btn-wrap:hover { color: #fff; background-color: #00529b; } .product_download-specs .group-block-content .button-icon { order: -1; margin-right: 8px; } .product_download-specs .wishlist-pdp-btn-main.tt-only-icon .wishlist-pdp-btn-wrap .tt-btn-text { display: flex; font-size: 14px; font-weight: 400; } .product_download-specs .wishlist-pdp-btn-main .wishlist-pdp-btn-wrap .wishlist-btn-content-span .wishlist-icon { width: 16px; height: 16px; } .product_download-specs .wishlist-pdp-btn-main .wishlist-pdp-btn-wrap .wishlist-btn-content-span .wishlist-icon svg { width: 16px; height: 16px; } .product_download-specs .wishlist-pdp-btn-main .wishlist-pdp-btn-wrap svg path { fill: #00529b; } .product_download-specs .wishlist-pdp-btn-main .wishlist-pdp-btn-wrap:hover svg path { fill: #fff; } .product_download-specs .wishlist-pdp-btn-main .wishlist-pdp-btn-wrap .wishlist-btn-content-span { gap: 8px; } td.spec-value--boolean { padding: 2px 10px; border-radius: 20px; } td.spec-value--boolean.spec-value--yes { background-color: #00529b; color: #fff; } @media screen and (max-width: 749px) { td.spec-value--boolean.spec-value--yes { margin: auto 0; } } .product-details .quantity-selector { height: 42px; border-color: #e5e5e5; } .product-form-buttons .add-to-cart-button { height: 42px; font-size: 18px; font-weight: 500; } .variant-option__button-label:not(.variant-option__button-label--has-swatch) { height: 40px; min-height: 40px; padding: 0; font-size: 14px; background-color: transparent; border-radius: 8px; border-color: #e5e5e5; } .variant-option__button-label:not(.variant-option__button-label--has-swatch):hover { background-color: #f5f5f5; } .variant-option__button-label:has(:checked) { background-color: #f5f5f5; color: #0A0A0A; border-color: #e5e5e5; } .variant-option__button-label.variant-option__button-label--has-swatch .swatch { border-color: #c70751; } .variant-option__button-label--has-swatch:has(:checked) { outline: 2px solid #c70751; outline-offset: 2px; } .variant-option__button-label--has-swatch.variant-option__button-label:hover { outline: 2px solid #c70751; outline-offset: 2px; } .variant-option__swatch-value { padding-left: 0; margin-top: -4px; } .template-product .section.section-resource-list { --page-margin: 0px; padding: 0; padding-bottom: 40px; } .product_help-buttons--wrapp { background-color: #f9fafb; } .product_help-buttons .button { background-color: transparent; border: 1px solid #e5e5e5; color: #0A0A0A; } .product_help-buttons .button:hover { background-color: #e5e5e5; } .product_help-buttons .button-icon { order: -1; margin-right: 8px; } .text-block--AQUpFcHEwd1Q4K1Fke__text_Hp4gFY { margin-bottom: -20px; } .template-product .details__header { font-size: 16px; color: #0A0A0A; } .template-product .accordion details { border-block-end: 1px solid #e5e5e5 !important; border-block-start: 0 !important; } .template-product .accordion .details__header { padding: 16px 0; } .template-product .accordion accordion-custom:first-child .details { } .template-product .divider__line { border-color: #e5e7eb; } .variant-option__select-wrapper { border-color: #e5e5e5; border-radius: 6px; } .variant-option__select { padding: 8px 12px; font-size: 14px; } variant-picker[data-block-id*="variant_picker_7RV3FA"] { display: none; } @media screen and (max-width: 749px) { variant-picker[data-block-id*="variant_picker_R3rGDr"] { display: none; } variant-picker[data-block-id*="variant_picker_7RV3FA"] { display: flex; } .variant-option--equal-width-buttons { display: flex; flex-wrap: wrap; } .variant-option__button-label:not(.variant-option__button-label--has-swatch) { flex: 0 1 auto; width: auto; min-width: 0; padding: 0 16px; } .product-details .product-form-buttons { display: none; } } .slideshow-controls__counter { display: flex; flex-wrap: wrap; gap: 5px; width: 100%; background-color: transparent; font-size: 14px; color: #4b5563; } .slideshow-controls__counter--bar { flex: 1 100%; height: 4px; border-radius: 6px; background-color: #e5e7eb; position: relative; } .slideshow-controls__counter--bar span { flex: 0 auto; } .slideshow-controls__counter--bar-fill { display: flex; position: absolute; height: 4px; transition: all .4s ease; background-color: #facc15; } .media-fit-cover :is(img, video, iframe, .deferred-media__poster-image) { width: 100%; height: 100%; margin: auto; } .dialog-zoomed-gallery .media-fit-cover :is(img, video, iframe, .deferred-media__poster-image) { width: 95%; height: 95%; max-height: 100vh; max-width: 100vw; object-fit: contain; padding: 24px; } .dialog-zoomed-gallery .product-media { --gallery-aspect-ratio: auto; } @media screen and (max-width: 749px) { .media-fit-cover :is(img, video, iframe, .deferred-media__poster-image) { width: 100%; height: 100%; } .dialog-zoomed-gallery .media-fit-cover :is(img, video, iframe, .deferred-media__poster-image) { width: 90%; height: 90%; object-fit: contain; padding: 16px; } } /* Product page */ /* Sticky bar */ .sticky-product-bar { position: fixed; width: 640px; height: auto; top: 80px; right: 0; left: 850px; margin: 0 auto; z-index: 40; background: #ffffff; box-shadow: 0 -10px 30px rgba(15, 23, 42, 0.18); transform: translateY(-100%); opacity: 0; pointer-events: none; transition: transform 0.25s ease, opacity 0.25s ease; } .sticky-product-bar.is-visible { transform: translateY(0); opacity: 1; pointer-events: auto; top: auto; } .sticky-product-bar__inner { display: flex; flex-direction: column; gap: 12px; padding: 16px 20px; align-items: stretch; } .sticky-product-bar__summary { display: flex; align-items: center; gap: 12px; flex: 1 1 auto; } .sticky-product-bar__media { width: 72px; height: 72px; border-radius: 12px; overflow: hidden; background: #f3f4f6; display: flex; align-items: center; justify-content: center; flex: 0 0 auto; } .sticky-product-bar__image { width: 100%; height: 100%; object-fit: cover; } .sticky-product-bar__image--placeholder { background: repeating-linear-gradient(45deg, #e5e7eb, #e5e7eb 10px, #f3f4f6 10px, #f3f4f6 20px); } .sticky-product-bar__meta { display: flex; flex-direction: column; gap: 4px; min-width: 0; } .sticky-product-bar__title { font-size: 15px; font-weight: 600; color: #111827; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .sticky-product-bar__price { display: inline-flex; align-items: baseline; gap: 8px; font-size: 16px; font-weight: 600; color: #111827; } .sticky-product-bar__price.is-on-sale .sticky-product-bar__price-current { color: #c70751; } .sticky-product-bar__price-compare { font-size: 13px; font-weight: 500; color: #6b7280; text-decoration: line-through; } .sticky-product-bar__sku { display: inline-flex; align-items: center; font-size: 12px; color: #4b5563; padding: 0; } .sticky-product-bar__sku-label { font-size: 12px; font-weight: 500; text-transform: uppercase; letter-spacing: 0.04em; color: #6b7280; } .sticky-product-bar__actions { width: 100%; } .sticky-product-bar__actions .product-form-buttons { margin: 0; } .sticky-product-bar__variants { width: calc(100% - 101px); margin-left: auto; } .sticky-product-bar__variants .variant-picker { margin: 0; } .sticky-product-bar .add-to-cart-text--added, .sticky-product-bar .quantity-selector, .sticky-product-bar .accelerated-checkout-block { display: none; } .sticky-product-bar .sticky-product-bar__summary { width: 100%; } .sticky-product-bar__media { width: 85px; height: 85px; margin: 0; border: 5px solid #f3f4f6; border-radius: 6px; } .sticky-product-bar .variant-picker .variant-option--buttons label:has(.swatch) { max-width: 16px; min-width: 16px; max-height: 16px; min-height: 16px; } .sticky-product-bar .variant-option--equal-width-buttons { display: flex; } .sticky-product-bar .variant-option--swatches .swatch { width: 16px; height: 16px; } .sticky-product-bar .variant-option.variant-option--buttons:not(.variant-option--swatches) .variant-option__button-label { flex: 0 auto; font-size: 12px; padding: 0 10px; } @media screen and (min-width: 750px) { .sticky-product-bar__inner { flex-direction: column; align-items: center; gap: 12px; max-width: var(--grid-desktop-content-max-width, 1200px); margin-inline: auto; } } @media screen and (max-width: 1280px) { .sticky-product-bar { left: auto; } } @media screen and (max-width: 749px) { .sticky-product-bar { max-width: none; bottom: 0; left: 0; right: 0; width: 100vw; } .sticky-product-bar__variants, .sticky-product-bar__media, .sticky-product-bar__title, .sticky-product-bar__sku, .sticky-product-bar__price-compare { display: none; } .sticky-product-bar__inner { flex-direction: row; } .sticky-product-bar__price-current { font-size: 24px; } .sticky-product-bar__inner add-to-cart-component .add-to-cart-text__content { display: flex; } .sticky-product-bar__inner add-to-cart-component .button-icon { display: none; } .sticky-product-bar__inner .product-form-buttons .add-to-cart-button { min-width: 211px; height: 52px; } .sticky-product-bar__inner { padding: 8px; } .product-faqs { padding-left: 0; padding-right: 0; } } /* Sticky bar */ /* Product media */ media-gallery { position: relative; } .product-information__summary--mobile { display: none; } @media screen and (max-width: 749px) { .product-information__summary--mobile { display: flex; flex-direction: column; grid-column: 1 / -1; gap: 8px; padding: 16px; } } .product-information__title { font-size: clamp(1.75rem, 2.4vw, 2.5rem); margin: 0; line-height: 1.2; } .product-information__reviews { display: flex; align-items: center; } .product-information__meta { display: flex; flex-wrap: wrap; gap: 16px; font-size: 0.95rem; color: rgb(var(--color-foreground-rgb) / 0.8); } .product-information__meta > span { display: inline-flex; gap: 6px; } .product-information__meta > span { display: inline-flex; gap: 6px; } media-gallery { position: relative; } .product-media-gallery__cursor-toggle { position: absolute; bottom: 16px; right: 16px; display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; color: #0A0A0A; z-index: 3; background-color: #fff; box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.1) 0px 4px 6px -4px; } .product-media-gallery__cursor-toggle svg { width: 20px; height: 20px; stroke: currentColor; pointer-events: none; } .product-media-gallery__cursor-toggle.is-active svg { transform: scale(1.1); } .product-media-gallery__cursor-toggle .zoom-in { display: flex; } .product-media-gallery__cursor-toggle.is-active .zoom-in { display: none; } .product-media-gallery__cursor-toggle .zoom-out { display: none; } .product-media-gallery__cursor-toggle.is-active .zoom-out { display: flex; } .media-gallery__magnifier-lens { position: absolute; width: 160px; height: 160px; border-radius: 50%; border: 2px solid rgb(var(--color-foreground-rgb) / 0.25); box-shadow: 0 12px 35px rgb(15 23 42 / 0.25), 0 10px 10px rgb(15 23 42 / 0.22); background-color: rgb(var(--color-background-rgb, 255 255 255) / 0.95); background-repeat: no-repeat; background-position: center; pointer-events: none; transform: translate(-50%, -50%); z-index: 4; } .media-gallery--cursor-zoom .product-media-container, .media-gallery--cursor-zoom .product-media-container img { cursor: none; } @media (hover: none) { .media-gallery--cursor-zoom .product-media-container, .media-gallery--cursor-zoom .product-media-container img { cursor: auto; } } @media screen and (max-width: 749px) { .product-media-gallery__cursor-toggle { display: none; } } /* Product media */ /* Judge me */ .jdgm-widget.jdgm-review-widget { border: 1px solid #e5e5e5; border-radius: 8px; } .jdgm-widget:not(.jdgm-review-widget--small, .jdgm-review-widget--medium) .jdgm-row-stars { display: flex; flex-direction: column; flex-wrap: wrap; align-content: start; height: 260px; } .jdgm-widget:not(.jdgm-review-widget--small, .jdgm-review-widget--medium) .jdgm-rev-widg[data-number-of-reviews='0'] .jdgm-row-stars { align-items: center; justify-content: center; flex-wrap: nowrap; } .jdgm-widget:not(.jdgm-review-widget--small, .jdgm-review-widget--medium) .jdgm-rev-widg[data-number-of-reviews='0'] .jdgm-rev-widg__summary-stars { text-align: center; } .jdgm-widget:not(.jdgm-review-widget--small, .jdgm-review-widget--medium) .jdgm-rev-widg[data-number-of-reviews='0'] .jdgm-widget-actions-wrapper { border: 0 !important; } .jdgm-widget:not(.jdgm-review-widget--small,.jdgm-review-widget--medium) :not(.jdgm-revs-tab__content-header)>.jdgm-widget-actions-wrapper { order: -1; flex: 0 0 50%; } .jdgm-rev-widg__summary { order: -2; } .jdgm-write-rev-link.jdgm-write-rev-link { display: flex; align-items: center; justify-content: center; font-size: 14px; height: 42px; border-radius: 6px; } .jdgm-widget:not(.jdgm-review-widget--small,.jdgm-review-widget--medium) .jdgm-rev-widg__title { margin-bottom: 70px; } .template-product .jdgm-widget:not(.jdgm-review-widget--small,.jdgm-review-widget--medium) :not(.jdgm-histogram-wrapper)>.jdgm-histogram { width: calc(70% - 24px); padding-left: 24px; margin-left: 24px; } .template-product .jdgm-histogram__row { display: flex; align-items: center; height: 28px; width: 100%; } .template-product .jdgm-histogram__bar { width: 100%; margin: 0 6px 0 12px; } @media screen and (max-width: 749px) { .template-product .jdgm-row-stars { display: flex; flex-direction: column; } .template-product .jdgm-review-widget--small .jdgm-rev-widg { padding: 24px; } .template-product .jdgm-widget-actions-wrapper { order: -1; width: 70%; margin: 0 auto; } .template-product .jdgm-review-widget--small .jdgm-histogram .jdgm-histogram__bar { width: 100%; } .template-product .jdgm-review-widget--small .jdgm-histogram { padding: 24px 0; } } /* Swatch colors are auto-generated by swatch-color-generator.js */ .rooms-section { padding-block: 40px 60px; } .rooms-grid { display: grid; gap: 24px; } @media screen and (min-width: 990px) { .rooms-grid { grid-template-columns: repeat(auto-fit, minmax(30%, 1fr)); } } .rooms-card { border: 1px solid #e5e7eb; border-radius: 8px; overflow: hidden; background: #fff; display: flex; flex-direction: column; box-shadow: 0 10px 30px rgba(15, 23, 42, 0.08); } .rooms-card__hero { min-height: 255px; background-size: cover; background-position: center; display: flex; align-items: flex-end; background-size: 100%; transition: background-size 0.4s ease; } .rooms-card__hero:hover { background-size: 110%; } .rooms-card__hero-content { color: #fff; padding: 24px; width: 100%; } .rooms-card__icon-title { display: flex; align-items: center; gap: 10px; } .rooms-card__icon { display: inline-flex; width: 32px; height: 32px; align-items: center; justify-content: center; } .rooms-card__icon img { width: 32px; height: 32px; } .rooms-card__title { margin: 0; font-size: 30px; color: #fff; } .rooms-card__subtitle { margin: 8px 0 0; font-size: 16px; color: #f8fafc; } .rooms-card__body { padding: 24px; display: flex; flex-direction: column; gap: 18px; } .rooms-card__products-heading { margin: 0; font-weight: 600; font-size: 16px; } .rooms-card__products-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(30%, 1fr)); gap: 12px; } .rooms-product-chip { border-radius: 8px; display: flex; flex-direction: column; align-items: center; gap: 10px; text-decoration: none; color: inherit; background: #fff; font-size: 12px; color: #374151; } .rooms-product-chip img { width: 100%; height: 100%; min-height: 130px; object-fit: cover; min-height: 130px; border-radius: 8px; background: #fff; border: 1px solid #e5e7eb; } .rooms-card__products-empty { margin: 0; color: #6b7280; } .button:not(.button-secondary,.button-unstyled,.button-with-icon).rooms-card__cta { display: flex; flex-direction: row; justify-content: center; align-items: center; gap: 8px; width: 100%; background-color: #c70751; font-size: 14px; font-weight: 400; } .button:not(.button-secondary,.button-unstyled,.button-with-icon).rooms-card__cta svg { width: 14px; height: 14px; } .section.rooms_renovations h2 { font-size: 36px; } .section.rooms_renovations .button, .section.rooms_renovations .button-secondary { height: 44px; padding: 10px 32px; font-size: 14px; } .section.rooms_renovations .button { background-color: #c70751; color: #fff; } .section.rooms_renovations .button-secondary { background-color: #fff; color: #00529b; } @media screen and (max-width: 749px) { .section.rooms_renovations .button, .section.rooms_renovations .button-secondary { width: 100%; } .room_hero img { width: 48px; } } .room_renovation .group-block { border-color: #e5e5e5; } .room_breadcrumbs { max-width: 1440px; margin: 0 auto; } .product-list .section--page-width.room_collection { max-width: 1488px; } .room_collection > * { grid-column: 1 / 4; } .shopify-section-group-header-group .ai-search-trigger { display: none; } .shopify-section-group-header-group .ai-search-container { margin: 0; } @media screen and (min-width: 820px) { .resource-list--flex .resource-list__item .collection-card__image { flex: 1 0 70%; } .resource-list--flex .resource-list__item .collection-card__inner { height: 100%; } .collection-card__content { flex: 0; } body .tt-wishlist-details-popup.drawer .tt-wishlist-details { width: 100%; } } .product-media-container.media-fit { img { object-fit: contain; } } /* EnquireOnly / In Store Only button */ .enquire-only-button { opacity: 1 !important; cursor: default; } .enquire-only-button:disabled { opacity: 1 !important; background-color: #c70751; color: var(--color-primary-button-text); } .enquire-only-button:disabled:hover { background-color: #c70751; } .quick-add__button--enquire-only { pointer-events: none; }