/* Paraform product panel styles -- single product summary */
html body.single-product .summary.entry-summary {
font-family: "Sora", sans-serif;
color: #1A1414;
display: flex;
flex-direction: column;
gap: 18px;
padding: 0;
}
/* Badge */
html body.single-product .paraform-badge {
display: inline-block;
background: #ECECEA;
color: #1A1414;
font-size: 13px;
font-weight: 500;
padding: 7px 14px;
border-radius: 4px;
align-self: flex-start;
letter-spacing: 0.02em;
margin: 0;
}
/* Title */
html body.single-product .summary .product_title {
font-family: "Sora", sans-serif !important;
font-size: 34px !important;
font-weight: 700 !important;
line-height: 1.15 !important;
color: #0D1B1F !important;
margin: 0 !important;
letter-spacing: -0.01em !important;
}
/* Price */
html body.single-product .summary .price,
html body.single-product .summary .price .amount {
font-family: "Sora", sans-serif !important;
font-size: 26px !important;
font-weight: 600 !important;
color: #0D1B1F !important;
margin: 0 !important;
}
html body.single-product .summary .price .paraform-price-prefix {
display: block;
font-size: 13px !important;
font-weight: 400 !important;
color: #6E6E6E !important;
letter-spacing: 0.02em;
margin-bottom: 2px;
}
/* Product code */
html body.single-product .paraform-product-code {
font-size: 14px;
color: #1A1414;
margin: 0;
}
html body.single-product .paraform-product-code strong {
font-weight: 600;
}
/* Short description (WC excerpt) */
html body.single-product .summary .woocommerce-product-details__short-description {
font-size: 14px;
color: #4A4A4A;
line-height: 1.55;
margin: 0;
}
/* Specs list */
html body.single-product .paraform-specs {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
gap: 10px;
font-size: 14px;
}
html body.single-product .paraform-specs li {
margin: 0;
color: #1A1414;
}
html body.single-product .paraform-specs strong {
font-weight: 600;
}
/* New Quantity + Configure row (our own, outside form.cart) */
html body.single-product .paraform-cart-row {
display: flex;
flex-direction: column;
gap: 8px;
margin: 4px 0 0 0;
}
html body.single-product .paraform-qty-label {
font-size: 14px;
font-weight: 600;
color: #1A1414;
}
html body.single-product .paraform-cart-controls {
display: flex;
align-items: stretch;
gap: 12px;
}
html body.single-product .paraform-qty-wrap {
display: inline-flex;
align-items: center;
border: 1px solid #1A1414;
border-radius: 4px;
overflow: hidden;
height: 48px;
background: #fff;
}
html body.single-product .paraform-qty-wrap .paraform-qty-btn {
background: transparent;
border: 0;
width: 36px;
height: 100%;
font-size: 20px;
line-height: 1;
color: #1A1414;
cursor: pointer;
padding: 0;
}
html body.single-product .paraform-qty-wrap .paraform-qty-btn:hover {
background: #F2EFEC;
}
html body.single-product .paraform-qty-wrap .paraform-qty-input {
width: 40px;
height: 100%;
border: 0;
background: transparent;
text-align: center;
font-family: "Sora", sans-serif;
font-size: 16px;
color: #1A1414;
appearance: textfield;
-moz-appearance: textfield;
}
html body.single-product .paraform-qty-wrap .paraform-qty-input::-webkit-outer-spin-button,
html body.single-product .paraform-qty-wrap .paraform-qty-input::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
html body.single-product .paraform-configure-btn {
background: #0D1B1F;
color: #FFFFFF !important;
border: 0;
border-radius: 4px;
padding: 0 36px;
height: 48px;
line-height: 48px;
font-family: "Sora", sans-serif;
font-size: 15px;
font-weight: 500;
letter-spacing: 0.02em;
text-decoration: none !important;
display: inline-flex;
align-items: center;
justify-content: center;
flex: 1;
cursor: pointer;
}
html body.single-product .paraform-configure-btn:hover {
background: #1A2F35;
}
/* Secondary actions: custom order + designer link */
html body.single-product .paraform-secondary-actions {
display: flex;
flex-direction: column;
gap: 14px;
margin-top: 4px;
}
html body.single-product .paraform-add-to-cart {
background: transparent;
color: #0D1B1F !important;
border: 1px solid #0D1B1F;
border-radius: 4px;
padding: 0 32px;
height: 48px;
line-height: 48px;
font-family: "Sora", sans-serif;
font-size: 15px;
font-weight: 500;
letter-spacing: 0.02em;
cursor: pointer;
width: 100%;
text-align: center;
text-decoration: none !important;
display: block;
box-sizing: border-box;
}
html body.single-product .paraform-add-to-cart:hover {
background: #0D1B1F;
color: #FFFFFF !important;
}
html body.single-product .paraform-designer-link {
font-size: 13px;
color: #1A1414;
margin: 0;
}
html body.single-product .paraform-designer-link a {
color: #1A1414;
text-decoration: underline;
margin-left: 6px;
}
/* Product tabs (Description / Features / Assembly details / Shipping and payment) */
html body.single-product .woocommerce-tabs.wc-tabs-wrapper {
margin-top: 60px;
}
html body.single-product .woocommerce-tabs ul.tabs.wc-tabs {
list-style: none !important;
display: flex !important;
flex-wrap: wrap;
gap: 32px;
margin: 0 !important;
padding: 0 0 0 0 !important;
border-bottom: 1px solid #E5E2DE !important;
}
html body.single-product .woocommerce-tabs ul.tabs.wc-tabs::before,
html body.single-product .woocommerce-tabs ul.tabs.wc-tabs::after {
display: none !important;
}
html body.single-product .woocommerce-tabs ul.tabs.wc-tabs li {
margin: 0 !important;
padding: 0 !important;
background: transparent !important;
border: 0 !important;
border-radius: 0 !important;
box-shadow: none !important;
}
html body.single-product .woocommerce-tabs ul.tabs.wc-tabs li::before,
html body.single-product .woocommerce-tabs ul.tabs.wc-tabs li::after {
display: none !important;
}
html body.single-product .woocommerce-tabs ul.tabs.wc-tabs li a {
font-family: "Sora", sans-serif !important;
font-size: 16px !important;
font-weight: 600 !important;
color: #1A1414 !important;
padding: 14px 0 14px 0 !important;
display: inline-block;
border-bottom: 2px solid transparent !important;
margin-bottom: -1px !important;
text-decoration: none !important;
background: transparent !important;
text-shadow: none !important;
}
html body.single-product .woocommerce-tabs ul.tabs.wc-tabs li.active a {
border-bottom-color: #1A1414 !important;
}
html body.single-product .woocommerce-tabs ul.tabs.wc-tabs li a:hover {
color: #0D1B1F !important;
}
/* Tab panel content */
html body.single-product .woocommerce-tabs .woocommerce-Tabs-panel {
padding-top: 28px !important;
font-family: "Sora", sans-serif !important;
font-size: 14px;
line-height: 1.6;
color: #1A1414;
}
html body.single-product .woocommerce-tabs .woocommerce-Tabs-panel h2 {
display: none;
}
html body.single-product .paraform-tab-list {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
gap: 10px;
}
html body.single-product .paraform-tab-list li strong {
font-weight: 600;
}
/* Features property table */
html body.single-product .paraform-features-table {
width: 100%;
border-collapse: collapse;
font-family: "Sora", sans-serif;
font-size: 14px;
color: #1A1414;
margin: 0 0 28px 0;
}
html body.single-product .paraform-features-table th,
html body.single-product .paraform-features-table td {
text-align: left;
padding: 12px 16px;
border-bottom: 1px solid #E5E2DE;
vertical-align: top;
}
html body.single-product .paraform-features-table th {
font-weight: 600;
background: #F7F5F2;
border-bottom-color: #1A1414;
}
html body.single-product .paraform-features-table tr:last-child td {
border-bottom: 0;
}
/* Tab body headings and lists (covers Description, Features, Assembly, Shipping) */
html body.single-product .woocommerce-Tabs-panel h3,
html body.single-product .woocommerce-Tabs-panel h4,
html body.single-product .paraform-tab-body h3 {
font-family: "Sora", sans-serif !important;
font-size: 18px !important;
font-weight: 700 !important;
color: #1A1414 !important;
margin: 24px 0 12px 0 !important;
letter-spacing: -0.005em !important;
}
html body.single-product .woocommerce-Tabs-panel h3:first-child,
html body.single-product .paraform-tab-body h3:first-child {
margin-top: 0 !important;
}
html body.single-product .paraform-tab-body ul {
padding-left: 22px;
margin: 0 0 16px 0;
}
html body.single-product .paraform-tab-body ul li {
margin-bottom: 6px;
}
html body.single-product .paraform-tab-body p {
margin: 0 0 14px 0;
}
/* === Shop loop: custom sort dropdown === */
/* Hide native select while the custom widget drives it */
.woocommerce form.woocommerce-ordering select.orderby[aria-hidden="true"] {
display: none !important;
}
.paraform-sort {
position: relative;
display: inline-block;
font-family: "Sora", sans-serif;
width: 280px;
color: #1A1414;
}
/* Closed-state trigger -- mirrors the previous native-select look */
.paraform-sort-button {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
width: 100%;
height: 41px;
padding: 0 25px;
background: #fff;
border: 1px solid #DDDDDD;
border-radius: 0;
color: #1A1414;
font-family: "Sora", sans-serif;
font-size: 14px;
font-weight: 500;
line-height: 1.2;
text-align: left;
cursor: pointer;
transition: border-color .15s ease;
}
.paraform-sort-button:hover { border-color: #BBBBBB; }
.paraform-sort-button:focus { outline: none; border-color: #1A1414; }
.paraform-sort.is-open .paraform-sort-button { border-color: #1A1414; }
.paraform-sort-label {
flex: 1;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.paraform-sort-caret {
flex-shrink: 0;
width: 8px;
height: 8px;
border-right: 1.5px solid #1A1414;
border-bottom: 1.5px solid #1A1414;
transform: rotate(45deg) translate(-2px, -2px);
transition: transform .2s ease;
}
.paraform-sort.is-open .paraform-sort-caret {
transform: rotate(-135deg) translate(-2px, -2px);
}
/* Open panel -- same shape language as the closed button */
.paraform-sort-panel {
position: absolute;
top: calc(100% + 6px);
left: 0;
right: 0;
max-height: 360px;
overflow-y: auto;
padding: 0;
background: #FFFFFF;
border: 1px solid #DDDDDD;
border-radius: 0;
box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
z-index: 60;
}
.paraform-sort-option {
padding: 16px 20px;
border-radius: 0;
font-family: "Sora", sans-serif;
font-size: 14px;
font-weight: 500;
color: #1A1414;
cursor: pointer;
user-select: none;
position: relative;
outline: none;
transition: background-color .12s ease;
}
.paraform-sort-option:hover,
.paraform-sort-option:focus {
background: #F4F4F2;
}
.paraform-sort-option.is-selected {
background: #EEF2FF;
padding-right: 48px;
}
.paraform-sort-option.is-selected::after {
content: "";
position: absolute;
top: 50%;
right: 20px;
width: 12px;
height: 6px;
border-left: 2px solid #1A1414;
border-bottom: 2px solid #1A1414;
transform: translateY(-70%) rotate(-45deg);
}
/* Scrollbar styling for the panel */
.paraform-sort-panel::-webkit-scrollbar { width: 6px; }
.paraform-sort-panel::-webkit-scrollbar-thumb { background: #D8D8D6; border-radius: 3px; }
.paraform-sort-panel::-webkit-scrollbar-track { background: transparent; }
/* === Elementor offcanvas mini-cart === */
.elementor-menu-cart__container .elementor-menu-cart__main {
font-family: "Sora", sans-serif !important;
color: #1A1414;
width: min(440px, 100vw) !important;
max-width: 440px !important;
padding: 0 !important;
background: #FFFFFF !important;
display: flex !important;
flex-direction: column;
}
/* "Cart" title at the top, generous padding */
.elementor-menu-cart__container .elementor-menu-cart__main::before {
content: "Cart";
display: block;
font-family: "Sora", sans-serif;
font-size: 30px;
font-weight: 600;
color: #1A1414;
padding: 28px 30px 18px;
letter-spacing: -0.01em;
line-height: 1;
flex: 0 0 auto;
}
/* Close button -- crisp X at top-right, in line with the title */
.elementor-menu-cart__container .elementor-menu-cart__close-button {
position: absolute !important;
top: 30px !important;
right: 30px !important;
width: 22px !important;
height: 22px !important;
background: transparent !important;
border: 0 !important;
cursor: pointer;
color: transparent !important;
font-size: 0 !important;
line-height: 0 !important;
z-index: 2;
}
.elementor-menu-cart__container .elementor-menu-cart__close-button::before,
.elementor-menu-cart__container .elementor-menu-cart__close-button::after {
content: "";
position: absolute;
top: 50%;
left: 0;
right: 0;
height: 1.5px;
background: #1A1414;
transform-origin: center;
}
.elementor-menu-cart__container .elementor-menu-cart__close-button::before { transform: translateY(-50%) rotate(45deg); }
.elementor-menu-cart__container .elementor-menu-cart__close-button::after { transform: translateY(-50%) rotate(-45deg); }
.elementor-menu-cart__container .elementor-menu-cart__close-button > * { display: none !important; }
/* Content wrapper -- column layout, scrolling list, sticky footer */
.elementor-menu-cart__container .widget_shopping_cart_content {
flex: 1 1 auto;
display: flex;
flex-direction: column;
min-height: 0;
padding: 0;
}
.elementor-menu-cart__container .elementor-menu-cart__products {
flex: 1 1 auto;
overflow-y: auto;
margin: 0 !important;
padding: 0 30px !important;
list-style: none;
}
/* Each cart row -- image | content; content has name/price on top, qty + trash on bottom */
.elementor-menu-cart__container .elementor-menu-cart__product.cart_item {
display: grid !important;
grid-template-columns: 140px 1fr auto;
grid-template-rows: auto auto 1fr auto;
column-gap: 20px;
row-gap: 6px;
padding: 22px 0 !important;
margin: 0 !important;
border-bottom: 1px solid #EFEDEA !important;
background: transparent !important;
min-height: 140px;
}
/* Cart page rows -- 2 columns only (image | content). Price goes inline below name. */
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-items__row {
grid-template-columns: 220px 1fr !important;
}
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-item__total {
display: none !important;
}
/* Restore the inline price below the name -- I previously hid it; un-hide for cart page */
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-item__product .wc-block-components-product-price,
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-item__prices {
display: block !important;
margin-top: 6px;
font-family: "Sora", sans-serif;
}
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-item__product .wc-block-components-product-price__value {
font-size: 15px !important;
font-weight: 500 !important;
color: #1A1414 !important;
}
.elementor-menu-cart__container .elementor-menu-cart__product.cart_item:last-child {
border-bottom: 0 !important;
}
/* Thumbnail */
.elementor-menu-cart__container .elementor-menu-cart__product-image {
grid-column: 1;
grid-row: 1 / span 4;
width: 140px;
height: 140px;
background: #F4F2EE;
overflow: hidden;
border-radius: 0;
}
.elementor-menu-cart__container .elementor-menu-cart__product-image a,
.elementor-menu-cart__container .elementor-menu-cart__product-image img {
width: 100% !important;
height: 100% !important;
display: block !important;
}
.elementor-menu-cart__container .elementor-menu-cart__product-image img {
object-fit: cover !important;
object-position: center !important;
}
/* Name (row 1, top) */
.elementor-menu-cart__container .elementor-menu-cart__product-name {
grid-column: 2 / span 2;
grid-row: 1;
padding: 0 !important;
margin: 0 !important;
}
.elementor-menu-cart__container .elementor-menu-cart__product-name a {
font-family: "Sora", sans-serif !important;
font-size: 14px !important;
font-weight: 700 !important;
color: #1A1414 !important;
text-transform: uppercase;
letter-spacing: 0.06em;
text-decoration: none !important;
line-height: 1.3;
}
/* Qty +/- widget (bottom-left of the row) */
.elementor-menu-cart__container .paraform-cart-qty-wrap {
grid-column: 2;
grid-row: 4;
align-self: end;
justify-self: start;
margin: 0;
display: inline-flex;
align-items: center;
width: -moz-fit-content;
width: fit-content;
height: 34px;
background: #FFFFFF;
border: 1px solid #DDDDDD;
border-radius: 0;
overflow: hidden;
transition: border-color .15s ease;
}
.elementor-menu-cart__container .paraform-cart-qty-wrap:hover { border-color: #BBBBBB; }
.elementor-menu-cart__container .paraform-cart-qty-wrap.is-busy { opacity: 0.55; pointer-events: none; }
.elementor-menu-cart__container .paraform-cart-qty-btn {
width: 32px;
height: 100%;
background: transparent;
border: 0;
padding: 0;
font-family: "Sora", sans-serif;
font-size: 18px;
line-height: 1;
color: #1A1414;
cursor: pointer;
transition: background-color .12s ease;
}
.elementor-menu-cart__container .paraform-cart-qty-btn:hover { background: #F4F2EE; }
.elementor-menu-cart__container .paraform-cart-qty-btn[disabled] { color: #BBBBBB; cursor: not-allowed; }
.elementor-menu-cart__container .paraform-cart-qty-btn[disabled]:hover { background: transparent; }
.elementor-menu-cart__container .paraform-cart-qty-value {
min-width: 36px;
text-align: center;
font-family: "Sora", sans-serif;
font-size: 14px;
font-weight: 500;
color: #1A1414;
line-height: 1;
user-select: none;
}
/* Price -- just below the name, normal size */
.elementor-menu-cart__container .elementor-menu-cart__product-price {
grid-column: 2 / span 2;
grid-row: 2;
padding: 0 !important;
margin: 0 !important;
}
.elementor-menu-cart__container .elementor-menu-cart__product-price .quantity {
font-family: "Sora", sans-serif !important;
color: #1A1414 !important;
display: inline-flex !important;
align-items: baseline;
}
.elementor-menu-cart__container .elementor-menu-cart__product-price .woocommerce-Price-amount,
.elementor-menu-cart__container .elementor-menu-cart__product-price .woocommerce-Price-amount bdi {
color: #1A1414 !important;
font-weight: 500 !important;
font-size: 14px !important;
line-height: 1.3 !important;
}
.elementor-menu-cart__container .elementor-menu-cart__product-price .woocommerce-Price-currencySymbol {
font-size: 14px !important;
font-weight: 500 !important;
}
/* Remove -- trash icon at bottom-right of the info column */
/* Elementor renders the visible × on the PARENT .product-remove div via ::before / ::after lines + border;
the inner children are display:none. We restyle the parent to be a trash icon. */
.elementor-menu-cart__container .elementor-menu-cart__product-remove {
grid-column: 3;
grid-row: 4;
align-self: end;
justify-self: end;
width: 26px !important;
height: 26px !important;
padding: 0 !important;
margin: 0 !important;
border: 0 !important;
border-radius: 0 !important;
background-color: transparent !important;
background-image: url('data:image/svg+xml;utf8,') !important;
background-repeat: no-repeat !important;
background-position: center !important;
background-size: 22px 22px !important;
box-shadow: none !important;
cursor: pointer !important;
transition: opacity .15s ease;
}
/* Kill Elementor's X-lines drawn via pseudo-elements on the parent */
.elementor-menu-cart__container .elementor-menu-cart__product-remove::before,
.elementor-menu-cart__container .elementor-menu-cart__product-remove::after {
content: none !important;
display: none !important;
background: none !important;
border: 0 !important;
transform: none !important;
}
.elementor-menu-cart__container .elementor-menu-cart__product-remove:hover {
opacity: 0.55;
}
/* Keep the underlying hidden but clickable -- size to the parent and overlay transparent */
.elementor-menu-cart__container .elementor-menu-cart__product-remove a {
position: absolute !important;
inset: 0 !important;
width: 100% !important;
height: 100% !important;
display: block !important;
background: transparent !important;
border: 0 !important;
color: transparent !important;
font-size: 0 !important;
text-indent: 0 !important;
box-shadow: none !important;
}
.elementor-menu-cart__container .elementor-menu-cart__product-remove a + a {
display: none !important;
}
.elementor-menu-cart__container .elementor-menu-cart__product-remove a::before,
.elementor-menu-cart__container .elementor-menu-cart__product-remove a::after {
content: none !important;
display: none !important;
}
/* The parent must be position:relative for the overlay */
.elementor-menu-cart__container .elementor-menu-cart__product-remove {
position: relative !important;
}
/* Subtotal */
.elementor-menu-cart__container .elementor-menu-cart__subtotal {
flex: 0 0 auto;
padding: 22px 30px !important;
border-top: 1px solid #EFEDEA !important;
background: #FFFFFF !important;
display: flex !important;
align-items: baseline;
justify-content: space-between;
margin: 0 !important;
}
.elementor-menu-cart__container .elementor-menu-cart__subtotal strong {
font-family: "Sora", sans-serif !important;
font-size: 13px !important;
font-weight: 600 !important;
color: #1A1414 !important;
text-transform: uppercase;
letter-spacing: 0.08em !important;
}
.elementor-menu-cart__container .elementor-menu-cart__subtotal .woocommerce-Price-amount,
.elementor-menu-cart__container .elementor-menu-cart__subtotal .woocommerce-Price-amount bdi {
font-family: "Sora", sans-serif !important;
font-size: 16px !important;
font-weight: 600 !important;
color: #1A1414 !important;
}
/* Footer buttons -- full-width dark Checkout, small underlined View cart link */
.elementor-menu-cart__container .elementor-menu-cart__footer-buttons {
flex: 0 0 auto;
display: flex !important;
flex-direction: column !important;
gap: 10px !important;
padding: 0 30px 30px !important;
background: #FFFFFF !important;
align-items: stretch !important;
}
.elementor-menu-cart__container .elementor-menu-cart__footer-buttons .elementor-button {
margin: 0 !important;
width: 100% !important;
box-sizing: border-box !important;
}
.elementor-menu-cart__container .elementor-menu-cart__footer-buttons .elementor-button--checkout {
background: #1A1414 !important;
color: #FFFFFF !important;
border: 0 !important;
border-radius: 0 !important;
padding: 18px 24px !important;
font-family: "Sora", sans-serif !important;
font-size: 13px !important;
font-weight: 600 !important;
text-transform: uppercase !important;
letter-spacing: 0.1em !important;
text-align: center !important;
text-decoration: none !important;
order: 1;
transition: background-color .15s ease;
}
.elementor-menu-cart__container .elementor-menu-cart__footer-buttons .elementor-button--checkout:hover {
background: #2B2424 !important;
}
html body header.elementor-location-header .elementor-menu-cart__container .elementor-menu-cart__footer-buttons .elementor-button--checkout .elementor-button-text {
color: #FFFFFF !important;
display: inline-block !important;
font-family: "Sora", sans-serif !important;
font-size: 13px !important;
font-weight: 600 !important;
text-transform: uppercase !important;
letter-spacing: 0.1em !important;
visibility: visible !important;
opacity: 1 !important;
}
.elementor-menu-cart__container .elementor-menu-cart__footer-buttons .elementor-button--view-cart {
background: transparent !important;
color: #1A1414 !important;
border: 0 !important;
padding: 4px 0 !important;
text-align: center !important;
order: 2;
}
html body header.elementor-location-header .elementor-menu-cart__container .elementor-menu-cart__footer-buttons .elementor-button--view-cart .elementor-button-text {
color: #1A1414 !important;
display: inline-block !important;
font-family: "Sora", sans-serif !important;
font-size: 13px !important;
font-weight: 500 !important;
text-decoration: underline !important;
text-transform: none !important;
letter-spacing: 0 !important;
visibility: visible !important;
opacity: 1 !important;
}
/* Make checkout button a proper flex container so its label centers correctly */
.elementor-menu-cart__container .elementor-menu-cart__footer-buttons .elementor-button--checkout {
display: flex !important;
align-items: center !important;
justify-content: center !important;
min-height: 52px !important;
}
.elementor-menu-cart__container .elementor-menu-cart__footer-buttons .elementor-button--view-cart {
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
/* Empty cart state */
.elementor-menu-cart__container .woocommerce-mini-cart__empty-message {
padding: 0 30px;
font-family: "Sora", sans-serif;
font-size: 14px;
color: #6E6E6E;
margin: 0;
}
.elementor-menu-cart__container .woocommerce-mini-cart__buttons.buttons {
padding: 24px 30px 30px;
}
/* Mini-cart scrollbar */
.elementor-menu-cart__container .elementor-menu-cart__products::-webkit-scrollbar { width: 6px; }
.elementor-menu-cart__container .elementor-menu-cart__products::-webkit-scrollbar-thumb { background: #D8D8D6; border-radius: 3px; }
.elementor-menu-cart__container .elementor-menu-cart__products::-webkit-scrollbar-track { background: transparent; }
/* ============================================================
Cart page (/cart/) -- WC Blocks Cart Block
============================================================ */
/* Push the cart page content below the fixed header */
body.woocommerce-cart #primary,
body.woocommerce-cart .site-main,
body.woocommerce-cart .content-area {
padding-top: 80px;
}
/* Empty cart: drop the top padding (no row content to clear the header for) */
body.woocommerce-cart:has(.wp-block-woocommerce-empty-cart-block) #primary,
body.woocommerce-cart:has(.wp-block-woocommerce-empty-cart-block) .site-main,
body.woocommerce-cart:has(.wp-block-woocommerce-empty-cart-block) .content-area,
body.woocommerce-cart:has(.wp-block-woocommerce-empty-cart-block) #content.site-content,
body.woocommerce-cart:has(.wp-block-woocommerce-empty-cart-block) article.posts-entry {
padding-top: 0 !important;
}
body.woocommerce-cart:not(.page-id-20):has(.wp-block-woocommerce-empty-cart-block) .entry-title,
body.woocommerce-cart:not(.page-id-20):has(.wp-block-woocommerce-empty-cart-block) .page-title {
margin-top: 0 !important;
padding-top: 30px !important; /* a little clearance below the fixed header */
}
/* Page title */
body.woocommerce-cart .entry-title,
body.woocommerce-cart .page-title,
body.woocommerce-cart .woocommerce-products-header__title {
font-family: "Sora", sans-serif !important;
font-size: 56px !important;
font-weight: 600 !important;
color: #1A1414 !important;
margin: 0 0 48px 0 !important;
letter-spacing: -0.015em;
line-height: 1.05;
}
/* Sidebar layout */
body.woocommerce-cart .wp-block-woocommerce-cart {
font-family: "Sora", sans-serif;
color: #1A1414;
}
@media (min-width: 1000px) {
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-components-sidebar-layout {
display: grid !important;
grid-template-columns: minmax(0, 1fr) 360px !important;
gap: 64px !important;
flex-wrap: nowrap !important;
}
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart__main,
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart__sidebar {
width: auto !important;
max-width: none !important;
padding-left: 0 !important;
padding-right: 0 !important;
flex: none !important;
}
}
/* Hide the WC table header row "Product / Details / Total" */
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-items__header {
display: none !important;
}
/* Cart items table */
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-items {
border: 0 !important;
background: transparent !important;
}
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-items__row {
display: grid !important;
grid-template-columns: 220px 1fr auto;
grid-template-rows: auto auto 1fr auto;
column-gap: 32px;
row-gap: 8px;
padding: 32px 0 !important;
border: 0 !important;
border-bottom: 1px solid #EFEDEA !important;
background: transparent !important;
}
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-items__row::before,
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-items__row::after {
display: none !important;
}
/* Remove the faint line above the image / name cells (WC Blocks puts border-top on each td) */
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-items__row > td,
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-items__row > th {
border-top: 0 !important;
}
/* Thumbnail */
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-item__image {
grid-column: 1 !important;
grid-row: 1 / span 4 !important;
width: 220px !important;
height: 220px !important;
padding: 0 !important;
background: #F4F2EE;
}
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-item__image a,
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-item__image img {
width: 100% !important;
height: 100% !important;
display: block !important;
max-width: none !important;
}
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-item__image img {
object-fit: cover !important;
object-position: center !important;
}
/* Product cell -- stretch to full row height and flex internally so qty + trash sit at the bottom */
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-item__product {
grid-column: 2 !important;
grid-row: 1 / span 4 !important;
padding: 0 !important;
align-self: stretch !important;
vertical-align: top !important;
height: 100%;
}
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-item__wrap {
display: grid !important;
grid-template-columns: 1fr auto;
grid-template-rows: auto auto 1fr auto;
column-gap: 16px;
height: 100%;
padding: 0 !important;
}
/* Name top-left, inline price top-right on the same row */
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-item__wrap .wc-block-components-product-name {
grid-column: 1;
grid-row: 1;
}
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-item__wrap .wc-block-cart-item__prices,
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-item__wrap .wc-block-components-product-price {
grid-column: 2;
grid-row: 1;
margin-top: 0 !important;
text-align: right;
justify-self: end;
align-self: baseline;
}
/* Dimensions go on row 2 (just under the name) */
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-item__wrap .paraform-cart-dimensions {
grid-column: 1 / span 2;
grid-row: 2;
}
/* Qty / trash row spans the full bottom */
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-item__wrap .wc-block-cart-item__quantity {
grid-column: 1 / span 2;
grid-row: 4;
align-self: end;
}
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-components-product-name {
font-family: "Sora", sans-serif !important;
font-size: 15px !important;
font-weight: 700 !important;
color: #1A1414 !important;
text-transform: uppercase;
letter-spacing: 0.06em;
text-decoration: none !important;
line-height: 1.3;
display: block;
margin-bottom: 6px;
}
/* Hide product description / metadata in cart rows -- reference doesn't show it */
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-components-product-metadata,
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-components-product-metadata__description {
display: none !important;
}
/* (Inline price visibility is handled earlier -- shown below the name on the cart page) */
/* Qty + remove row (sits inside the product cell, naturally at the bottom via flex justify-content) */
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-item__quantity {
display: flex !important;
flex-direction: row !important;
align-items: center;
justify-content: space-between !important;
gap: 16px;
padding: 0 !important;
margin: 0 !important;
width: 100%;
}
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-components-quantity-selector {
width: -moz-fit-content;
width: fit-content;
height: 40px;
border: 1px solid #DDDDDD !important;
border-radius: 0 !important;
background: #fff;
overflow: hidden;
}
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-components-quantity-selector__input {
font-family: "Sora", sans-serif !important;
font-size: 14px !important;
font-weight: 500 !important;
color: #1A1414 !important;
min-width: 40px;
border: 0 !important;
}
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-components-quantity-selector__button {
width: 36px;
height: 100%;
color: #1A1414 !important;
border: 0 !important;
background: transparent !important;
font-size: 18px !important;
border-radius: 0 !important;
transition: background-color .12s ease;
}
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-components-quantity-selector__button:hover {
background: #F4F2EE !important;
}
/* Total cell (price + remove) -- top-right of row */
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-item__total {
grid-column: 3 !important;
grid-row: 1 !important;
padding: 0 !important;
text-align: right !important;
align-self: start;
}
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-item__total-price-and-sale-badge-wrapper {
display: block;
text-align: right;
}
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-item__total .wc-block-components-product-price__value,
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-item__total .wc-block-components-product-price {
font-family: "Sora", sans-serif !important;
font-size: 16px !important;
font-weight: 600 !important;
color: #1A1414 !important;
white-space: nowrap;
}
/* Remove link -- already has SVG inside, just restyle it to a trash icon look */
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-item__remove-link {
width: 28px !important;
height: 28px !important;
padding: 0 !important;
background: transparent !important;
border: 0 !important;
color: #1A1414 !important;
cursor: pointer;
flex-shrink: 0;
transition: opacity .15s ease;
}
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-item__remove-link svg {
width: 26px;
height: 26px;
fill: #1A1414;
}
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-item__remove-link:hover { opacity: 0.6; }
/* ============================================================
Cart page sidebar -- CUSTOM ORDER SUMMARY
(Replaces the WC Blocks default sidebar contents)
============================================================ */
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart__sidebar {
background: transparent !important;
padding: 32px 0 0 0 !important;
border: 0 !important;
}
/* Remove the line above the cart items table -- there's nothing above it */
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-items {
border-top: 0 !important;
}
/* Hide every WC Blocks default child -- our custom takes over */
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart__sidebar > *:not(.paraform-cart-sidebar) {
display: none !important;
}
.paraform-cart-sidebar {
font-family: "Sora", sans-serif;
color: #1A1414;
}
.paraform-cart-sidebar__title {
font-family: "Sora", sans-serif;
font-size: 13px;
font-weight: 600;
color: #1A1414;
letter-spacing: 0.12em;
text-transform: uppercase;
margin: 0;
padding: 0 0 14px 0;
border-top: 0;
border-bottom: 1px solid #D8D5D0;
}
.paraform-cart-sidebar__row {
display: flex;
align-items: baseline;
justify-content: space-between;
padding: 14px 0;
border-bottom: 1px solid #D8D5D0;
gap: 16px;
margin: 0;
}
/* Items + BENEFIT + SHIPPING are one visual group -- no dividers between them, lighter font weight */
.paraform-cart-sidebar__row--group {
border-bottom: 0;
}
.paraform-cart-sidebar__row--group .paraform-cart-sidebar__label,
.paraform-cart-sidebar__row--group .paraform-cart-sidebar__value {
font-weight: 400 !important;
}
.paraform-cart-sidebar__row--group-end {
border-bottom: 0 !important;
}
/* TOTAL sits in its own section -- bolder dividers above and below */
.paraform-cart-sidebar__row--total {
border-top: 1px solid #1A1414;
border-bottom: 1px solid #1A1414;
padding: 18px 0;
}
/* Inline quantity multiplier (×N) */
.paraform-cart-sidebar__qty {
font-weight: 500;
color: #6E6E6E;
margin-left: 4px;
letter-spacing: 0.04em;
}
.paraform-cart-sidebar__row .paraform-cart-sidebar__label {
font-family: "Sora", sans-serif;
font-size: 13px;
font-weight: 600;
letter-spacing: 0.08em;
text-transform: uppercase;
color: #1A1414;
}
.paraform-cart-sidebar__row .paraform-cart-sidebar__value {
font-family: "Sora", sans-serif;
font-size: 13px;
font-weight: 500;
color: #1A1414;
white-space: nowrap;
}
.paraform-cart-sidebar__row .paraform-cart-sidebar__value--placeholder {
color: #8a8a8a;
font-weight: 400;
font-style: italic;
}
.paraform-cart-sidebar__row--total {
padding: 18px 0;
}
.paraform-cart-sidebar__row--total .paraform-cart-sidebar__label,
.paraform-cart-sidebar__row--total .paraform-cart-sidebar__value {
font-size: 14px;
font-weight: 600;
}
.paraform-cart-sidebar__row--coupon {
/* Outlined box that visually separates the coupon entry from the totals above */
align-items: center;
padding: 14px 18px !important;
margin-top: 24px;
border: 1px solid #D8D5D0 !important;
border-bottom: 1px solid #D8D5D0 !important;
transition: border-color .15s ease;
}
.paraform-cart-sidebar__row--coupon:hover,
.paraform-cart-sidebar__row--coupon:focus-within {
border-color: #1A1414 !important;
}
.paraform-cart-sidebar__coupon-input,
body.woocommerce-cart input.paraform-cart-sidebar__coupon-input {
flex: 1;
min-width: 0;
background: transparent !important;
background-color: transparent !important;
border: 0 !important;
border-radius: 0 !important;
box-shadow: none !important;
padding: 0 !important;
margin: 0 !important;
font-family: "Sora", sans-serif !important;
font-size: 13px !important;
font-weight: 600 !important;
letter-spacing: 0.08em !important;
text-transform: uppercase !important;
color: #1A1414 !important;
outline: none !important;
appearance: none;
-webkit-appearance: none;
}
body.woocommerce-cart input.paraform-cart-sidebar__coupon-input:focus,
body.woocommerce-cart input.paraform-cart-sidebar__coupon-input:hover {
border: 0 !important;
box-shadow: none !important;
outline: none !important;
}
.paraform-cart-sidebar__coupon-input::placeholder,
body.woocommerce-cart input.paraform-cart-sidebar__coupon-input::placeholder {
color: #C6C4C0 !important;
opacity: 1 !important;
font-weight: 600 !important;
letter-spacing: 0.08em !important;
text-transform: uppercase !important;
}
/* Dimensions row -- hidden per latest spec */
body.woocommerce-cart .wp-block-woocommerce-cart .paraform-cart-dimensions {
display: none !important;
}
.paraform-cart-sidebar__coupon-input::placeholder {
color: #1A1414;
opacity: 1;
font-weight: 600;
letter-spacing: 0.08em;
text-transform: uppercase;
}
.paraform-cart-sidebar__apply {
background: transparent;
border: 0;
padding: 0;
font-family: "Sora", sans-serif;
font-size: 13px;
font-weight: 600;
letter-spacing: 0.1em;
text-transform: uppercase;
color: #1A1414;
cursor: pointer;
transition: opacity .15s ease;
}
.paraform-cart-sidebar__apply:hover { opacity: 0.55; }
.paraform-cart-sidebar__apply[disabled] { opacity: 0.4; cursor: progress; }
.paraform-cart-sidebar__checkout {
display: block;
width: 100%;
box-sizing: border-box;
margin-top: 28px;
padding: 22px 24px;
background: #1A1414;
color: #FFFFFF !important;
font-family: "Sora", sans-serif;
font-size: 13px;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.1em;
text-align: center;
text-decoration: none !important;
border: 0;
cursor: pointer;
transition: background-color .15s ease;
}
.paraform-cart-sidebar__checkout:hover {
background: #2B2424;
color: #FFFFFF !important;
}
/* ============================================================
"Add Ons" section (injected via the_content filter)
============================================================ */
body.woocommerce-cart .paraform-cart-addons {
margin-top: 100px;
padding-top: 60px;
border-top: 1px solid #EFEDEA;
}
/* ============================================================
Empty cart state
============================================================ */
/* Centre the entire empty-cart panel and trim the default "New in store" grid */
body.woocommerce-cart .wp-block-woocommerce-empty-cart-block {
text-align: center;
padding: 80px 20px 120px;
font-family: "Sora", sans-serif;
color: #1A1414;
}
body.woocommerce-cart .wp-block-woocommerce-empty-cart-block .wc-block-cart__empty-cart__title {
font-family: "Sora", sans-serif !important;
font-size: 15px !important;
font-weight: 500 !important;
color: #1A1414 !important;
margin: 18px 0 6px 0 !important;
letter-spacing: 0.02em;
text-transform: none;
}
/* Override WC Blocks' default sad-face mask icon with a clean outlined cart icon */
body.woocommerce-cart .wp-block-woocommerce-empty-cart-block .wc-block-cart__empty-cart__title.with-empty-cart-icon::before,
html body.woocommerce-cart .wp-block-woocommerce-empty-cart-block .wc-block-cart__empty-cart__title.with-empty-cart-icon::before {
content: "" !important;
width: 60px !important;
height: 60px !important;
display: block !important;
margin: 0 auto 14px !important;
background: transparent !important;
background-color: transparent !important;
background-image: url('data:image/svg+xml;utf8,') !important;
background-repeat: no-repeat !important;
background-position: center !important;
background-size: contain !important;
-webkit-mask: none !important;
mask: none !important;
-webkit-mask-image: none !important;
mask-image: none !important;
}
body.woocommerce-cart .wp-block-woocommerce-empty-cart-block .paraform-empty-cart-link {
font-family: "Sora", sans-serif;
font-size: 14px;
font-weight: 500;
color: #A0A0A0;
margin: 0 0 0 0;
letter-spacing: 0.02em;
}
body.woocommerce-cart .wp-block-woocommerce-empty-cart-block .paraform-empty-cart-link a {
color: #A0A0A0 !important;
text-decoration: underline;
}
body.woocommerce-cart .wp-block-woocommerce-empty-cart-block .paraform-empty-cart-link a:hover {
opacity: 0.6;
}
/* Hide the WC Blocks default "New in store" heading, separator, and product grid -- keep the empty state minimal */
body.woocommerce-cart .wp-block-woocommerce-empty-cart-block > .wp-block-separator,
body.woocommerce-cart .wp-block-woocommerce-empty-cart-block > h2:not(.wc-block-cart__empty-cart__title),
body.woocommerce-cart .wp-block-woocommerce-empty-cart-block > [data-block-name="woocommerce/product-new"],
body.woocommerce-cart .wp-block-woocommerce-empty-cart-block .wc-block-grid {
display: none !important;
}
/* Also hide my Add Ons section when the cart is empty (no items to recommend additions for) */
body.woocommerce-cart:has(.wp-block-woocommerce-empty-cart-block) .paraform-cart-addons {
display: none !important;
}
body.woocommerce-cart .paraform-cart-addons__title {
font-family: "Sora", sans-serif;
font-size: 36px;
font-weight: 600;
color: #1A1414;
margin: 0 0 32px 0;
letter-spacing: -0.01em;
}
/* The shortcode renders the same .woocommerce ul.products grid as /shop/,
so existing shop-loop styles (badges, layout) apply automatically. */
/* ============================================================
Cart page -- responsive breakpoints
============================================================ */
/* Tablet & mobile: stack the 2-column layout */
@media (max-width: 999px) {
body.woocommerce-cart .entry-title,
body.woocommerce-cart .page-title {
font-size: 40px !important;
margin-bottom: 28px !important;
}
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-components-sidebar-layout {
display: block !important;
grid-template-columns: none !important;
gap: 0 !important;
}
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart__main,
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart__sidebar {
width: 100% !important;
max-width: none !important;
padding-left: 0 !important;
padding-right: 0 !important;
}
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart__sidebar {
padding-top: 40px !important;
margin-top: 24px;
border-top: 0 !important;
}
body.woocommerce-cart .paraform-cart-addons {
margin-top: 60px;
padding-top: 40px;
}
body.woocommerce-cart .paraform-cart-addons__title {
font-size: 28px;
margin-bottom: 24px;
}
}
/* Mobile: compress cart row */
@media (max-width: 600px) {
body.woocommerce-cart .entry-title,
body.woocommerce-cart .page-title {
font-size: 32px !important;
margin-bottom: 20px !important;
}
body.woocommerce-cart #primary,
body.woocommerce-cart .site-main,
body.woocommerce-cart .content-area {
padding-top: 40px;
}
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-items__row {
grid-template-columns: 100px 1fr !important;
column-gap: 16px !important;
padding: 20px 0 !important;
min-height: 0 !important;
}
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-item__image {
width: 100px !important;
height: 100px !important;
grid-row: 1 / span 4 !important;
}
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-components-product-name {
font-size: 13px !important;
letter-spacing: 0.04em;
}
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-item__product .wc-block-components-product-price__value {
font-size: 13px !important;
}
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-components-quantity-selector {
height: 34px;
}
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-components-quantity-selector__button {
width: 30px;
}
/* Sidebar: tighter padding */
body.woocommerce-cart .paraform-cart-sidebar__row {
padding: 10px 0;
}
body.woocommerce-cart .paraform-cart-sidebar__row--total {
padding: 14px 0;
}
body.woocommerce-cart .paraform-cart-sidebar__checkout {
padding: 18px 20px;
}
body.woocommerce-cart .paraform-cart-sidebar__row--coupon {
padding: 12px 14px !important;
}
/* Add Ons: 2 columns on mobile */
body.woocommerce-cart .paraform-cart-addons .woocommerce ul.products {
grid-template-columns: repeat(2, 1fr) !important;
gap: 16px !important;
}
body.woocommerce-cart .paraform-cart-addons .woocommerce ul.products li.product {
width: auto !important;
margin: 0 !important;
}
}
/* Very small phones: minor extra trims */
@media (max-width: 380px) {
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-items__row {
grid-template-columns: 80px 1fr !important;
column-gap: 12px !important;
}
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-cart-item__image {
width: 80px !important;
height: 80px !important;
}
body.woocommerce-cart .paraform-cart-sidebar__label,
body.woocommerce-cart .paraform-cart-sidebar__value {
font-size: 12px !important;
}
}
/* ============================================================
Checkout page (/checkout/) -- WC Blocks Checkout
============================================================ */
/* Beat theme rule `body:not(.home) #main { padding-top: 80px !important }` -- /checkout/ resolves to page-id-20 when empty (body.woocommerce-cart) and page-id-21 with items (body.woocommerce-checkout) */
html body.page-id-20 #main,
html body.page-id-20 #primary,
html body.page-id-20 #content,
html body.page-id-20 #content.site-content,
html body.page-id-20 .site-main,
html body.page-id-20 .site-content,
html body.page-id-20 .content-area,
html body.page-id-20 .entry-content,
html body.page-id-20 .entry-header,
html body.page-id-20 article.posts-entry,
html body.page-id-21 #main,
html body.page-id-21 #primary,
html body.page-id-21 #content,
html body.page-id-21 #content.site-content,
html body.page-id-21 .site-main,
html body.page-id-21 .site-content,
html body.page-id-21 .content-area,
html body.page-id-21 .entry-content,
html body.page-id-21 .entry-header,
html body.page-id-21 article.posts-entry,
html body.woocommerce-checkout #main,
html body.woocommerce-checkout #primary,
html body.woocommerce-checkout #content,
html body.woocommerce-checkout #content.site-content,
html body.woocommerce-checkout .site-main,
html body.woocommerce-checkout .site-content,
html body.woocommerce-checkout .content-area,
html body.woocommerce-checkout .entry-content,
html body.woocommerce-checkout .entry-header,
html body.woocommerce-checkout article.posts-entry {
padding-top: 0 !important;
margin-top: 0 !important;
}
/* But push the main content down enough to clear the ~80px fixed Elementor header. Use #main.site-main so this beats the comprehensive #main 0px rule above on specificity. */
html body.page-id-20 #main.site-main,
html body.page-id-21 #main.site-main,
html body.woocommerce-checkout #main.site-main {
padding-top: 128px !important;
}
html body.page-id-20 .entry-title,
html body.page-id-20 .page-title,
html body.page-id-21 .entry-title,
html body.page-id-21 .page-title,
html body.woocommerce-checkout .entry-title,
html body.woocommerce-checkout .page-title {
padding-top: 0 !important;
margin-top: 0 !important;
}
/* Page title */
body.woocommerce-checkout .entry-title,
body.woocommerce-checkout .page-title {
font-family: "Sora", sans-serif !important;
font-size: 56px !important;
font-weight: 600 !important;
color: #1A1414 !important;
margin: 0 0 24px 0 !important;
letter-spacing: -0.015em;
line-height: 1.05;
}
/* Layout root */
body.woocommerce-checkout .wp-block-woocommerce-checkout {
font-family: "Sora", sans-serif;
color: #1A1414;
}
/* Section headings (Contact information, Billing address, Payment options) */
body.woocommerce-checkout .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-contact-information-block h2,
body.woocommerce-checkout .wp-block-woocommerce-checkout-fields-block h2,
body.woocommerce-checkout .wp-block-woocommerce-checkout .wc-block-components-checkout-step__heading,
body.woocommerce-checkout .wp-block-woocommerce-checkout .wc-block-checkout__form h2 {
font-family: "Sora", sans-serif !important;
font-size: 14px !important;
font-weight: 600 !important;
color: #1A1414 !important;
text-transform: uppercase !important;
letter-spacing: 0.1em !important;
margin: 12px 0 16px 0 !important;
}
/* Inputs / selects */
body.woocommerce-checkout .wc-block-components-text-input input,
body.woocommerce-checkout .wc-block-components-select select,
body.woocommerce-checkout .wp-block-woocommerce-checkout input[type="text"],
body.woocommerce-checkout .wp-block-woocommerce-checkout input[type="email"],
body.woocommerce-checkout .wp-block-woocommerce-checkout input[type="tel"] {
font-family: "Sora", sans-serif !important;
font-size: 14px !important;
font-weight: 500 !important;
color: #1A1414 !important;
border: 1px solid #D8D5D0 !important;
border-radius: 0 !important;
background: #FFFFFF !important;
}
body.woocommerce-checkout .wc-block-components-text-input:focus-within,
body.woocommerce-checkout .wc-block-components-select:focus-within {
border-color: #1A1414 !important;
}
body.woocommerce-checkout .wc-block-components-text-input label,
body.woocommerce-checkout .wc-block-components-select label {
font-family: "Sora", sans-serif !important;
color: #6E6E6E !important;
font-size: 13px !important;
font-weight: 500 !important;
}
/* Place Order button */
body.woocommerce-checkout .wc-block-components-checkout-place-order-button,
body.woocommerce-checkout .wc-block-components-button.wp-element-button.wc-block-components-checkout-place-order-button {
background: #1A1414 !important;
color: #FFFFFF !important;
border: 0 !important;
border-radius: 0 !important;
padding: 20px 36px !important;
font-family: "Sora", sans-serif !important;
font-size: 13px !important;
font-weight: 600 !important;
text-transform: uppercase !important;
letter-spacing: 0.1em !important;
text-decoration: none !important;
transition: background-color .15s ease;
}
body.woocommerce-checkout .wc-block-components-checkout-place-order-button:hover {
background: #2B2424 !important;
}
body.woocommerce-checkout .wc-block-components-checkout-place-order-button span {
color: #FFFFFF !important;
font-family: "Sora", sans-serif !important;
text-transform: uppercase !important;
letter-spacing: 0.1em !important;
}
/* Return to Cart link */
body.woocommerce-checkout .wc-block-components-checkout-return-to-cart-button,
body.woocommerce-checkout a.wc-block-components-checkout-return-to-cart-button {
font-family: "Sora", sans-serif !important;
font-size: 13px !important;
font-weight: 500 !important;
color: #6E6E6E !important;
text-decoration: none !important;
letter-spacing: 0.02em;
}
body.woocommerce-checkout .wc-block-components-checkout-return-to-cart-button:hover {
color: #1A1414 !important;
}
/* Order summary sidebar -- mirror cart's Order Summary look. Push sticky offset below fixed header. */
body.woocommerce-checkout .wp-block-woocommerce-checkout-totals-block {
background: transparent !important;
padding: 0 !important;
border: 0 !important;
top: 120px !important;
}
body.woocommerce-checkout .wc-block-components-totals-wrapper,
body.woocommerce-checkout .wc-block-components-order-summary-item,
body.woocommerce-checkout .wc-block-components-totals-item {
border-top: 0 !important;
box-shadow: none !important;
}
body.woocommerce-checkout .wc-block-components-order-summary__title-text,
body.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-block .wc-block-components-totals-item__label,
body.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-block h2 {
font-family: "Sora", sans-serif !important;
font-size: 13px !important;
font-weight: 600 !important;
color: #1A1414 !important;
text-transform: uppercase !important;
letter-spacing: 0.1em !important;
}
body.woocommerce-checkout .wc-block-components-order-summary-item__description {
display: none !important;
}
body.woocommerce-checkout .wc-block-components-order-summary-item__title {
font-family: "Sora", sans-serif !important;
font-size: 13px !important;
font-weight: 500 !important;
color: #1A1414 !important;
}
body.woocommerce-checkout .wc-block-components-totals-item__label {
font-family: "Sora", sans-serif !important;
font-size: 13px !important;
font-weight: 500 !important;
letter-spacing: 0.04em !important;
color: #1A1414 !important;
}
body.woocommerce-checkout .wc-block-components-totals-item__value {
font-family: "Sora", sans-serif !important;
font-size: 13px !important;
font-weight: 500 !important;
color: #1A1414 !important;
}
body.woocommerce-checkout .wc-block-components-totals-footer-item {
border-top: 0 !important;
border-bottom: 0 !important;
padding: 0 !important;
margin: 0 !important;
}
body.woocommerce-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__label {
font-size: 14px !important;
font-weight: 600 !important;
text-transform: uppercase !important;
letter-spacing: 0.1em !important;
}
body.woocommerce-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
font-size: 16px !important;
font-weight: 600 !important;
}
/* Coupon code panel - match cart's outlined box */
body.woocommerce-checkout .wc-block-components-totals-coupon {
border: 1px solid #D8D5D0 !important;
padding: 12px 16px !important;
margin-top: 18px !important;
}
body.woocommerce-checkout .wc-block-components-totals-coupon .wc-block-components-panel__button {
font-family: "Sora", sans-serif !important;
font-size: 13px !important;
font-weight: 600 !important;
color: #1A1414 !important;
text-transform: uppercase !important;
letter-spacing: 0.08em !important;
background: transparent !important;
border: 0 !important;
padding: 0 !important;
}
/* Payment options - cleaner radio cards */
body.woocommerce-checkout .wc-block-components-payment-method {
border: 1px solid #D8D5D0 !important;
border-radius: 0 !important;
padding: 14px 16px !important;
margin-bottom: 8px !important;
}
body.woocommerce-checkout .wc-block-components-payment-method__label,
body.woocommerce-checkout .wc-block-components-payment-method label {
font-family: "Sora", sans-serif !important;
font-size: 14px !important;
font-weight: 500 !important;
color: #1A1414 !important;
}
/* Hide gateway brand icon (YooMoney etc.) anywhere inside payment method card */
body.woocommerce-checkout .wc-block-components-payment-method img,
body.woocommerce-checkout .wc-block-components-payment-method svg,
body.woocommerce-checkout .wc-block-components-payment-method__icon,
body.woocommerce-checkout .wc-block-components-payment-method-label__icon,
body.woocommerce-checkout .wc-block-components-payment-method-icons,
body.woocommerce-checkout .wc-block-components-payment-method-icons__icon,
body.woocommerce-checkout .payment_method_yookassa img,
body.woocommerce-checkout .payment_method_yookassa svg,
body.woocommerce-checkout label[for*="payment-method"] img,
body.woocommerce-checkout label[for*="payment-method"] svg {
display: none !important;
}
/* ---------- Sidebar reordering ----------
React renders an extra wrapper inside the block:
.wp-block-woocommerce-checkout-order-summary-block
.wc-block-components-checkout-order-summary__title (hidden)
.wc-block-components-checkout-order-summary__content (flex column, reorder here)
.wp-block-woocommerce-checkout-order-summary-cart-items-block
.wp-block-woocommerce-checkout-order-summary-coupon-form-block
.wp-block-woocommerce-checkout-order-summary-totals-block (Subtotal/Shipping/.../TOTAL footer)
Desired visual order: totals block -> coupon -> items
*/
body.woocommerce-checkout .wc-block-components-checkout-order-summary__title {
display: none !important;
}
body.woocommerce-checkout .wc-block-components-checkout-order-summary__content {
display: flex !important;
flex-direction: column !important;
}
/* totals-block wraps Subtotal/Fee/Discount/Shipping/Taxes */
body.woocommerce-checkout .wc-block-components-checkout-order-summary__content > .wp-block-woocommerce-checkout-order-summary-totals-block { order: 1 !important; }
/* The standalone TOTAL line lives in its own .wc-block-components-totals-wrapper -- target via :has(footer-item) */
body.woocommerce-checkout .wc-block-components-checkout-order-summary__content > .wc-block-components-totals-wrapper:has(.wc-block-components-totals-footer-item) { order: 2 !important; }
body.woocommerce-checkout .wc-block-components-checkout-order-summary__content > .wp-block-woocommerce-checkout-order-summary-coupon-form-block { order: 3 !important; }
body.woocommerce-checkout .wc-block-components-checkout-order-summary__content > .wp-block-woocommerce-checkout-order-summary-cart-items-block { order: 4 !important; }
/* Hide empty gift-card blocks + trailing slot-wrapper */
body.woocommerce-checkout .wc-block-components-checkout-order-summary__content > .wp-block-woocommerce-checkout-order-summary-gift-card-form-block:empty,
body.woocommerce-checkout .wc-block-components-checkout-order-summary__content > .wp-block-woocommerce-checkout-order-summary-gift-card-totals-block:empty,
body.woocommerce-checkout .wc-block-components-checkout-order-summary__content > .wc-block-components-totals-wrapper.slot-wrapper {
display: none !important;
}
body.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-block > h2,
body.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-block > .wp-block-heading,
body.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-block > .wc-block-components-title,
body.woocommerce-checkout .wc-block-components-order-summary__title,
body.woocommerce-checkout .wc-block-components-checkout-order-summary__title {
display: none !important;
}
/* Row spacing + single border-bottom on each totals row (Subtotal/Shipping/Discount...). Top border lives only on subtotal as the section opener. */
body.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-subtotal-block,
body.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-fee-block,
body.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-discount-block,
body.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-shipping-block,
body.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-taxes-block {
padding: 16px 0 !important;
margin: 0 !important;
border: 0 !important;
}
body.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-subtotal-block {
border-top: 1px solid #E6E3DE !important;
}
/* Hide truly always-empty fee/discount/taxes blocks. Shipping kept visible (JS injects placeholder). */
body.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-fee-block:empty,
body.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-discount-block:empty,
body.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-taxes-block:empty {
display: none !important;
}
/* Shipping description (method name) on its own line, smaller + uppercase */
body.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-shipping-block .wc-block-components-totals-item__description,
body.woocommerce-checkout .paraform-shipping-placeholder .wc-block-components-totals-item__description {
display: block !important;
flex-basis: 100% !important;
width: 100% !important;
font-family: "Sora", sans-serif !important;
font-size: 11px !important;
font-weight: 500 !important;
letter-spacing: 0.14em !important;
text-transform: uppercase !important;
color: #6E6E6E !important;
margin-top: 4px !important;
}
body.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-shipping-block .wc-block-components-totals-item {
flex-wrap: wrap !important;
}
/* Make each totals row a clean label/value flex row */
body.woocommerce-checkout .wp-block-woocommerce-checkout-totals-block .wc-block-components-totals-item {
display: flex !important;
justify-content: space-between !important;
align-items: baseline !important;
padding: 0 !important;
margin: 0 !important;
background: transparent !important;
}
body.woocommerce-checkout .wp-block-woocommerce-checkout-totals-block .wc-block-components-totals-item__label {
font-family: "Sora", sans-serif !important;
font-size: 13px !important;
font-weight: 600 !important;
letter-spacing: 0.12em !important;
text-transform: uppercase !important;
color: #1A1414 !important;
}
body.woocommerce-checkout .wp-block-woocommerce-checkout-totals-block .wc-block-components-totals-item__value {
font-family: "Sora", sans-serif !important;
font-size: 13px !important;
font-weight: 500 !important;
color: #1A1414 !important;
}
/* Shipping rate/method description line */
body.woocommerce-checkout .wc-block-components-totals-shipping__via,
body.woocommerce-checkout .wc-block-components-totals-item__description {
font-family: "Sora", sans-serif !important;
font-size: 11px !important;
font-weight: 500 !important;
letter-spacing: 0.1em !important;
text-transform: uppercase !important;
color: #6E6E6E !important;
margin-top: 4px !important;
flex-basis: 100% !important;
}
/* TOTAL block: same thin grey rhythm as other rows */
body.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-totals-block {
padding: 0 !important;
margin: 0 !important;
border: 0 !important;
background: transparent !important;
}
body.woocommerce-checkout .wc-block-components-totals-wrapper:has(.wc-block-components-totals-footer-item) {
padding: 16px 0 4px 0 !important;
margin: 0 !important;
border: 0 !important;
border-top: 1px solid #E6E3DE !important;
background: transparent !important;
}
body.woocommerce-checkout .wc-block-components-totals-footer-item {
display: flex !important;
flex-direction: row !important;
justify-content: space-between !important;
align-items: center !important;
gap: 16px !important;
padding: 0 16px !important;
margin: 0 !important;
border: 0 !important;
}
body.woocommerce-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__label {
text-align: left !important;
flex: 0 0 auto !important;
}
body.woocommerce-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
text-align: right !important;
margin-left: auto !important;
font-variant-numeric: tabular-nums !important;
flex: 0 0 auto !important;
}
/* Last totals row gets a bottom border so the section closes cleanly above the standalone TOTAL wrapper */
body.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-totals-block > *:last-child {
border-bottom: 0 !important;
}
body.woocommerce-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__label {
font-size: 14px !important;
font-weight: 600 !important;
letter-spacing: 0.14em !important;
}
body.woocommerce-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
font-size: 14px !important;
font-weight: 600 !important;
}
/* Coupon row: outlined box matching cart sidebar */
body.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-coupon-form-block {
border: 0 !important;
padding: 0 !important;
margin: 24px 0 0 0 !important;
background: transparent !important;
}
body.woocommerce-checkout .wc-block-components-totals-coupon {
border: 1px solid #D8D5D0 !important;
padding: 14px 18px !important;
margin: 0 !important;
background: transparent !important;
transition: border-color .15s ease !important;
}
body.woocommerce-checkout .wc-block-components-totals-coupon:hover,
body.woocommerce-checkout .wc-block-components-totals-coupon:focus-within {
border-color: #1A1414 !important;
}
/* Auto-expanded inline form -- the WC toggle button is hidden, the form acts as a real input + APPLY */
body.woocommerce-checkout .wc-block-components-totals-coupon .wc-block-components-panel__button {
display: none !important;
}
body.woocommerce-checkout .wc-block-components-totals-coupon .wc-block-components-panel,
body.woocommerce-checkout .wc-block-components-totals-coupon .wc-block-components-panel__content {
padding: 0 !important;
margin: 0 !important;
display: block !important;
overflow: visible !important;
max-height: none !important;
visibility: visible !important;
}
body.woocommerce-checkout .wc-block-components-totals-coupon__content {
padding: 0 !important;
margin: 0 !important;
}
body.woocommerce-checkout .wc-block-components-totals-coupon__form {
display: flex !important;
align-items: center !important;
gap: 12px !important;
padding: 0 !important;
margin: 0 !important;
background: transparent !important;
}
body.woocommerce-checkout .wc-block-components-totals-coupon__input {
flex: 1 1 auto !important;
background: transparent !important;
border: 0 !important;
padding: 0 !important;
margin: 0 !important;
min-height: 0 !important;
height: auto !important;
box-shadow: none !important;
}
body.woocommerce-checkout .wc-block-components-totals-coupon__input input,
html body.woocommerce-checkout .wc-block-components-totals-coupon__input input[type="text"] {
background: transparent !important;
border: 0 !important;
padding: 0 !important;
margin: 0 !important;
width: 100% !important;
height: auto !important;
min-height: 0 !important;
font-family: "Sora", sans-serif !important;
font-size: 13px !important;
font-weight: 600 !important;
letter-spacing: 0.08em !important;
text-transform: uppercase !important;
color: #1A1414 !important;
outline: none !important;
box-shadow: none !important;
}
body.woocommerce-checkout .wc-block-components-totals-coupon__input input::placeholder {
color: #C6C4C0 !important;
font-family: "Sora", sans-serif !important;
font-size: 13px !important;
font-weight: 600 !important;
letter-spacing: 0.08em !important;
text-transform: uppercase !important;
opacity: 1 !important;
}
/* Hide the floating-label text -- the placeholder is the only affordance */
body.woocommerce-checkout .wc-block-components-totals-coupon__input label {
display: none !important;
}
body.woocommerce-checkout .wc-block-components-totals-coupon__button {
background: transparent !important;
border: 0 !important;
padding: 0 !important;
margin: 0 !important;
min-width: 0 !important;
min-height: 0 !important;
height: auto !important;
box-shadow: none !important;
cursor: pointer !important;
font-family: "Sora", sans-serif !important;
font-size: 13px !important;
font-weight: 600 !important;
letter-spacing: 0.1em !important;
text-transform: uppercase !important;
color: #1A1414 !important;
flex: 0 0 auto !important;
}
body.woocommerce-checkout .wc-block-components-totals-coupon__button .wc-block-components-button__text {
color: inherit !important;
font: inherit !important;
letter-spacing: inherit !important;
text-transform: inherit !important;
}
body.woocommerce-checkout .wc-block-components-totals-coupon__button[disabled],
body.woocommerce-checkout .wc-block-components-totals-coupon__button[aria-disabled="true"] {
color: #C6C4C0 !important;
}
/* Cart page: hide the WC Blocks "Add coupons" panel -- paraform sidebar already has its own inline COUPON CODE input above */
body.woocommerce-cart .wc-block-components-totals-coupon,
body.woocommerce-cart .wp-block-woocommerce-cart-order-summary-coupon-form-block {
display: none !important;
}
/* Items list at bottom: big square image left, content right */
body.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-block {
padding-top: 0 !important;
border: 0 !important;
background: transparent !important;
}
/* Clearance between coupon box and first item card */
body.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-cart-items-block {
padding-top: 32px !important;
margin-top: 16px !important;
}
body.woocommerce-checkout .wc-block-components-order-summary {
background: transparent !important;
padding: 0 !important;
border: 0 !important;
box-shadow: none !important;
}
/* ---------- Item card -- editorial hierarchy ----------
Grid keeps the price baseline-aligned with the image bottom.
Right column: NAME -> QTY (small caps) -> [flex spacer] -> PRICE. */
body.woocommerce-checkout .wc-block-components-order-summary .wc-block-components-order-summary-item {
display: grid !important;
grid-template-columns: 210px 1fr !important;
grid-template-rows: auto 1fr auto !important;
grid-template-areas:
"img desc"
"img spacer"
"img price" !important;
column-gap: 28px !important;
align-items: start !important;
min-height: 210px !important;
padding: 0 0 28px 0 !important;
margin: 0 0 28px 0 !important;
overflow: visible !important;
border: 0 !important;
border-bottom: 1px solid #E6E3DE !important;
background: transparent !important;
}
body.woocommerce-checkout .wc-block-components-order-summary .wc-block-components-order-summary-item:last-child {
border-bottom: 0 !important;
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
body.woocommerce-checkout .wc-block-components-order-summary-item__image {
grid-area: img !important;
float: none !important;
width: 210px !important;
height: 210px !important;
max-width: 210px !important;
max-height: 210px !important;
min-width: 210px !important;
margin: 0 !important;
background: #F4F2EE !important;
position: relative !important;
display: block !important;
overflow: hidden !important;
}
html body.woocommerce-checkout .wc-block-components-order-summary-item__image img {
width: 210px !important;
height: 210px !important;
max-width: 210px !important;
max-height: 210px !important;
min-width: 210px !important;
min-height: 210px !important;
object-fit: contain !important;
display: block !important;
}
body.woocommerce-checkout .wc-block-components-order-summary-item__quantity {
display: none !important;
}
body.woocommerce-checkout .wc-block-components-order-summary-item__description {
grid-area: desc !important;
align-self: start !important;
display: block !important;
width: auto !important;
max-width: none !important;
overflow: visible !important;
padding: 0 !important;
margin: 0 !important;
}
body.woocommerce-checkout .wc-block-components-order-summary-item__total-price {
grid-area: price !important;
align-self: end !important;
display: block !important;
width: auto !important;
max-width: none !important;
overflow: visible !important;
margin: 0 !important;
padding: 0 !important;
text-align: left !important;
}
body.woocommerce-checkout .wc-block-components-order-summary-item .screen-reader-text {
display: none !important;
}
body.woocommerce-checkout .wc-block-cart-item__prices,
body.woocommerce-checkout .wc-block-components-product-metadata,
body.woocommerce-checkout .wc-block-components-product-details,
body.woocommerce-checkout .wc-block-components-order-summary-item__individual-prices {
display: none !important;
}
/* Typography: name -- generous tracking, refined uppercase */
body.woocommerce-checkout .wc-block-components-order-summary-item__header,
body.woocommerce-checkout .wc-block-components-order-summary-item__title,
body.woocommerce-checkout .wc-block-components-product-name {
font-family: "Sora", sans-serif !important;
font-size: 14px !important;
font-weight: 600 !important;
letter-spacing: 0.09em !important;
text-transform: uppercase !important;
line-height: 1.55 !important;
color: #1A1414 !important;
margin: 0 0 10px 0 !important;
}
/* Typography: QTY -- light grey, wider tracking, smaller -- recedes as meta */
body.woocommerce-checkout .paraform-checkout-item-qty {
font-family: "Sora", sans-serif !important;
font-size: 11px !important;
font-weight: 500 !important;
letter-spacing: 0.24em !important;
text-transform: uppercase !important;
color: #8B8987 !important;
margin: 0 !important;
display: block !important;
}
/* Typography: price -- tabular numbers, anchored to image baseline */
body.woocommerce-checkout .wc-block-components-order-summary-item__total-price,
body.woocommerce-checkout .wc-block-components-order-summary-item__total-price .wc-block-formatted-money-amount,
body.woocommerce-checkout .wc-block-components-order-summary-item__total-price .wc-block-components-product-price {
font-family: "Sora", sans-serif !important;
font-size: 16px !important;
font-weight: 500 !important;
color: #1A1414 !important;
letter-spacing: 0.02em !important;
font-variant-numeric: tabular-nums !important;
margin: 0 !important;
text-align: left !important;
display: block !important;
}
body.woocommerce-checkout .wc-block-components-order-summary-item__total-price .wc-block-cart-item__total-price-and-sale-badge-wrapper {
display: block !important;
text-align: left !important;
}
/* Narrow desktop / tablet range: sidebar gets cramped at 1000-1280px and product name overflows. Shrink image + reduce letter-spacing so CIRCLE CLOCK doesn't break char-by-char. */
@media (min-width: 1000px) and (max-width: 1280px) {
body.woocommerce-checkout .wc-block-components-order-summary .wc-block-components-order-summary-item {
grid-template-columns: 140px 1fr !important;
column-gap: 20px !important;
min-height: 140px !important;
}
body.woocommerce-checkout .wc-block-components-order-summary-item__image,
html body.woocommerce-checkout .wc-block-components-order-summary-item__image img {
width: 140px !important;
height: 140px !important;
max-width: 140px !important;
min-width: 140px !important;
max-height: 140px !important;
min-height: 140px !important;
}
body.woocommerce-checkout .wc-block-components-order-summary-item__description .wc-block-components-product-name,
body.woocommerce-checkout .wc-block-components-order-summary-item__description a {
font-size: 12px !important;
letter-spacing: 0.05em !important;
}
}
/* Responsive -- below 1000px stack to single column: form on top, order summary below */
@media (max-width: 999px) {
body.woocommerce-checkout .entry-title,
body.woocommerce-checkout .page-title {
font-size: 40px !important;
margin-bottom: 24px !important;
}
body.woocommerce-checkout .wp-block-woocommerce-checkout,
body.woocommerce-checkout .wp-block-woocommerce-checkout .wc-block-checkout {
display: block !important;
grid-template-columns: 1fr !important;
gap: 0 !important;
}
body.woocommerce-checkout .wp-block-woocommerce-checkout-fields-block,
body.woocommerce-checkout .wp-block-woocommerce-checkout-totals-block {
width: 100% !important;
max-width: none !important;
flex: none !important;
padding: 0 !important;
margin: 0 0 32px 0 !important;
}
/* WC Blocks clones the order summary inline above Place Order on mobile -- hide the duplicate sidebar to avoid double rendering */
body.woocommerce-checkout .wp-block-woocommerce-checkout-totals-block {
display: none !important;
}
body.woocommerce-checkout .wc-block-components-order-summary .wc-block-components-order-summary-item {
grid-template-columns: 160px 1fr !important;
column-gap: 22px !important;
min-height: 160px !important;
}
body.woocommerce-checkout .wc-block-components-order-summary-item__image,
html body.woocommerce-checkout .wc-block-components-order-summary-item__image img {
width: 160px !important;
height: 160px !important;
max-width: 160px !important;
min-width: 160px !important;
max-height: 160px !important;
min-height: 160px !important;
}
}
@media (max-width: 600px) {
body.woocommerce-checkout .entry-title,
body.woocommerce-checkout .page-title {
font-size: 32px !important;
}
body.woocommerce-checkout #primary,
body.woocommerce-checkout .site-main,
body.woocommerce-checkout .content-area {
padding-top: 40px;
}
body.woocommerce-checkout .wc-block-components-order-summary .wc-block-components-order-summary-item {
grid-template-columns: 120px 1fr !important;
column-gap: 18px !important;
min-height: 120px !important;
}
body.woocommerce-checkout .wc-block-components-order-summary-item__image,
html body.woocommerce-checkout .wc-block-components-order-summary-item__image img {
width: 120px !important;
height: 120px !important;
max-width: 120px !important;
min-width: 120px !important;
max-height: 120px !important;
min-height: 120px !important;
}
}
/* Shop page (page-id-19) product price -- 3-line stack matching category pages: product name (h2 above), then "PRICING STARTS FROM" (small, uppercase, muted), then the amount (bigger, dark). */
body.page-id-19 ul.products li.product .price,
body.woocommerce-cart ul.products li.product .price,
body.woocommerce.post-type-archive-product ul.products li.product .price {
display: block !important;
margin: 0 !important;
padding: 0 !important;
font-family: "Sora", sans-serif !important;
font-size: 10px !important;
font-weight: 400 !important;
letter-spacing: 0.16em !important;
text-transform: uppercase !important;
text-align: center !important;
color: #8a7b7b !important;
line-height: 1.4 !important;
white-space: normal !important;
}
body.page-id-19 ul.products li.product .price::before,
body.page-id-1580 ul.products li.product .price::before,
body.page-id-1647 ul.products li.product .price::before,
body.page-id-1654 ul.products li.product .price::before,
body.page-id-1661 ul.products li.product .price::before,
body.woocommerce-cart ul.products li.product .price::before,
body.woocommerce.post-type-archive-product ul.products li.product .price::before,
.woocommerce ul.products li.product .price::before,
ul.products li.product .price::before {
content: "Starts From " !important;
display: block !important;
font-family: "Sora", sans-serif !important;
font-size: 0.8em !important;
font-weight: 400 !important;
letter-spacing: 0.18em !important;
text-transform: uppercase !important;
color: #555 !important;
margin: 0 0 .2rem 0 !important;
}
body.page-id-19 ul.products li.product .price .woocommerce-Price-amount,
body.woocommerce-cart ul.products li.product .price .woocommerce-Price-amount,
body.woocommerce.post-type-archive-product ul.products li.product .price .woocommerce-Price-amount {
display: block !important;
font-family: "Sora", sans-serif !important;
font-size: 1.8em !important;
font-weight: 400 !important;
letter-spacing: normal !important;
text-transform: none !important;
color: #1A1414 !important;
}
body.page-id-19 ul.products li.product .price .woocommerce-Price-currencySymbol,
body.woocommerce-cart ul.products li.product .price .woocommerce-Price-currencySymbol,
body.woocommerce.post-type-archive-product ul.products li.product .price .woocommerce-Price-currencySymbol {
font: inherit !important;
color: inherit !important;
}
/* Hide the theme's category chip ::before on the product cards (user did not add it). Currently applied to cart-page Add Ons; this matches user's request and doesn't affect Elementor-rendered category pages (their cards use a different rendering path). */
body.woocommerce-cart ul.products li.product::before {
content: none !important;
display: none !important;
}
/* Remove list bullets ("dots") on the Add Ons product grid */
body.woocommerce-cart ul.products,
body.woocommerce-cart ul.products li.product {
list-style: none !important;
list-style-type: none !important;
}
body.woocommerce-cart ul.products li.product::marker {
content: '' !important;
}
/* Header EN/RU lang toggle -- zero customizer's 3% margin-bottom (computes to ~41.5px and pushes the chip above baseline). Selector mirrors customizer's specificity with an extra class to win the cascade. */
html body header.elementor-location-header .elementor-element-6d1f894 .elementor-element.elementor-element-b1d70a4e,
html body header.elementor-location-header .elementor-element-51261eaa .elementor-element.elementor-element-b1d70a4e {
margin-top: 0 !important;
margin-bottom: 0 !important;
align-self: center !important;
}
/* "Where Our Products Are Used" section -- in the 2-column desktop layout (>1024px), right-align the nav arrows within the text column so the next-arrow lines up with the heading's text right edge (the "Are" word). The exact pixel offset is then refined by JS (alignProductsNavToHeadingText) which measures the heading line. In stacked/column layout (<=1024px), the customizer's center-alignment is left intact. */
@media (min-width: 1600px) {
body .elementor-1580 .elementor-element-b05f437 .paraform-products-nav-wrap,
body .elementor-1647 .elementor-element-3863ac15 .paraform-products-nav-wrap,
body .elementor-1654 .elementor-element-55bd13c8 .paraform-products-nav-wrap,
body .elementor-1661 .elementor-element-32993739 .paraform-products-nav-wrap {
justify-content: flex-end !important;
text-align: right !important;
}
body .elementor-1580 .elementor-element-b05f437 .paraform-products-nav-wrap .paraform-products-nav,
body .elementor-1647 .elementor-element-3863ac15 .paraform-products-nav-wrap .paraform-products-nav,
body .elementor-1654 .elementor-element-55bd13c8 .paraform-products-nav-wrap .paraform-products-nav,
body .elementor-1661 .elementor-element-32993739 .paraform-products-nav-wrap .paraform-products-nav {
margin-left: auto !important;
margin-right: 0 !important;
}
}
/* ============================================================================
CONTACT PAGE -- page-id-1464
Two-column hero: left = heading + description + 3 icon-box info blocks (3-col grid below),
right = form inside a clean white card.
Below: map section, light cream framing.
Brand palette: cream #F4F2EE, ink #1A1414, hairline #E6E3DE. Sora throughout.
============================================================================ */
html body.page-id-1464 { background: #F4F2EE; }
/* ---------- HERO CONTAINER (1ce6cb5e, DOM id #main-contact).
Customizer chain `html body.page-id-1464 .elementor-1464 .elementor-element.elementor-element-1ce6cb5e`
(0,4,3) and an `:first-child { padding-top: 0 !important }` rule (0,3,2) both
override plain class selectors. Using the actual ID `#main-contact` gives an
ID-anchored chain that wins. */
html body.page-id-1464 .elementor-1464 #main-contact.elementor-element-1ce6cb5e {
padding: 160px 0 64px 0 !important;
margin-bottom: 0 !important;
background: #F4F2EE !important;
}
body.page-id-1464 .elementor-element-1ce6cb5e > .e-con-inner {
display: grid !important;
grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr) !important;
column-gap: 80px !important;
row-gap: 0 !important;
max-width: 1280px !important;
padding: 0 64px !important;
margin: 0 auto !important;
align-items: stretch !important;
}
/* Beat Elementor's --width on both columns so they fill the grid track */
body.page-id-1464 .elementor-element-4486223,
body.page-id-1464 .elementor-element-7bb7a9f2 {
width: 100% !important;
max-width: 100% !important;
--width: 100% !important;
flex: 1 1 auto !important;
}
/* ---------- LEFT COLUMN (4486223) -- flex column, content stacks
vertically: heading, description, then the 3-info-block rectangle.
padding-top matches the form card's padding-top (48px) so that the
left-column heading and the card pseudo "Get in Touch" start at the
same y-coordinate. */
body.page-id-1464 .elementor-element-4486223 {
display: flex !important;
flex-direction: column !important;
padding: 48px 0 0 0 !important;
gap: 0 !important;
}
/* Heading "Contact Us" / "Talk to Our Team" */
body.page-id-1464 .elementor-element-7dddc298 { margin: 0 0 24px 0 !important; }
body.page-id-1464 .elementor-element-7dddc298 .elementor-heading-title {
font-family: "Sora", sans-serif !important;
font-size: clamp(40px, 4.6vw, 64px) !important;
font-weight: 600 !important;
line-height: 1.05 !important;
letter-spacing: -0.025em !important;
color: #1A1414 !important;
margin: 0 !important;
}
/* Description block */
body.page-id-1464 .elementor-element-7254a265 { margin: 0 0 24px 0 !important; }
body.page-id-1464 .elementor-element-7254a265 h3,
body.page-id-1464 .elementor-element-7254a265 .elementor-heading-title,
body.page-id-1464 .elementor-element-7254a265 p,
body.page-id-1464 .elementor-element-7254a265 .elementor-widget-container > * {
font-family: "Sora", sans-serif !important;
font-size: 15px !important;
font-weight: 400 !important;
line-height: 1.6 !important;
letter-spacing: 0 !important;
color: #6B6663 !important;
margin: 0 !important;
text-transform: none !important;
}
/* ---------- INFO BLOCKS (7fe264e) -- by JS this container is moved
OUT of leftCol to be a sibling of the hero, sitting below it as a
standalone vertical column of 3 blocks. Selector targets the moved
location (direct child of the page elementor wrapper). */
body.page-id-1464 .elementor.elementor-1464 > .elementor-element-7fe264e {
width: 100% !important;
max-width: 1280px !important;
--width: 100% !important;
margin: 0 auto !important;
padding: 56px 64px 80px 64px !important;
box-sizing: border-box !important;
display: grid !important;
grid-template-columns: minmax(0, 1fr) !important;
grid-auto-rows: auto !important;
row-gap: 0 !important;
column-gap: 0 !important;
border: none !important;
}
body.page-id-1464 .elementor.elementor-1464 > .elementor-element-7fe264e .elementor-widget-icon-box {
padding: 24px 0 !important;
border-top: 1px solid #E6E3DE !important;
width: 100% !important;
max-width: 100% !important;
--width: 100% !important;
}
body.page-id-1464 .elementor.elementor-1464 > .elementor-element-7fe264e .elementor-widget-icon-box:last-child {
border-bottom: 1px solid #E6E3DE !important;
}
/* ---------- MAP MOVED INTO LEFTCOL (by JS) -- styled to fill the
space below the 3-info-block row so leftCol total height matches
the form card on the right, forming a rectangle. */
body.page-id-1464 .elementor-element-4486223 .elementor-element-2959b484 {
margin-top: 40px !important;
width: 100% !important;
max-width: 100% !important;
--width: 100% !important;
flex: 1 1 auto !important;
}
body.page-id-1464 .elementor-element-4486223 .elementor-element-2959b484 .elementor-custom-embed,
body.page-id-1464 .elementor-element-4486223 .elementor-element-2959b484 .elementor-custom-embed iframe {
width: 100% !important;
height: 100% !important;
min-height: 220px !important;
border: 1px solid #E6E3DE !important;
display: block !important;
filter: grayscale(0.15) contrast(1.02);
}
/* Hide the original standalone map section since the map has been moved into leftCol */
body.page-id-1464 .elementor-element-44d0c08a { display: none !important; }
body.page-id-1464 .elementor-element-7fe264e .elementor-widget-icon-box {
width: 100% !important;
max-width: 100% !important;
--width: 100% !important;
}
body.page-id-1464 .elementor-element-7fe264e .elementor-icon-box-wrapper {
display: flex !important;
flex-direction: column !important;
text-align: left !important;
align-items: flex-start !important;
gap: 6px !important;
}
/* Hide the icon, we want clean label-over-value */
body.page-id-1464 .elementor-element-7fe264e .elementor-icon-box-icon { display: none !important; }
body.page-id-1464 .elementor-element-7fe264e .elementor-icon-box-content {
display: flex !important;
flex-direction: column !important;
gap: 6px !important;
}
/* Title text (small uppercase label) */
body.page-id-1464 .elementor-element-7fe264e .elementor-icon-box-title,
body.page-id-1464 .elementor-element-7fe264e .elementor-icon-box-title * {
font-family: "Sora", sans-serif !important;
font-size: 11px !important;
font-weight: 600 !important;
letter-spacing: 0.14em !important;
text-transform: uppercase !important;
color: #1A1414 !important;
margin: 0 !important;
line-height: 1.4 !important;
}
/* Description text (the actual contact data) */
body.page-id-1464 .elementor-element-7fe264e .elementor-icon-box-description {
font-family: "Sora", sans-serif !important;
font-size: 14px !important;
font-weight: 400 !important;
line-height: 1.5 !important;
letter-spacing: 0 !important;
color: #1A1414 !important;
margin: 0 !important;
word-break: break-word !important;
overflow-wrap: anywhere !important;
}
/* ---------- RIGHT COLUMN (7bb7a9f2) -- the form card.
margin-top: 48px so the card's TOP EDGE sits at y=208, the same y
as the left-column heading "Talk to Our Team" (which starts after
leftCol's 48px padding-top). Aligns the card box with the heading. */
body.page-id-1464 .elementor-element-7bb7a9f2 {
background: #FFFFFF !important;
padding: 48px !important;
margin-top: 48px !important;
border: 1px solid #E6E3DE !important;
border-radius: 0 !important;
position: relative !important;
display: flex !important;
flex-direction: column !important;
}
/* Card header pseudo: "Get in Touch" + subline. Both placed before the form via flex order.
Customizer applies `position: absolute; top: 0; height: 100%` to ::before via a generic
`.elementor-element::before` decorator rule -- we have to neutralize those explicitly. */
body.page-id-1464 .elementor-element-7bb7a9f2::before {
content: 'Get in Touch' !important;
display: block !important;
position: static !important;
top: auto !important;
left: auto !important;
right: auto !important;
bottom: auto !important;
height: auto !important;
width: 100% !important;
background: none !important;
font-family: "Sora", sans-serif !important;
font-size: 26px !important;
font-weight: 600 !important;
line-height: 1.2 !important;
letter-spacing: -0.015em !important;
color: #1A1414 !important;
margin: 0 0 6px 0 !important;
padding: 0 !important;
order: 1 !important;
text-align: left !important;
align-self: flex-start !important;
transform: none !important;
}
body.page-id-1464 .elementor-element-7bb7a9f2::after {
content: 'You can reach us anytime.' !important;
display: block !important;
position: static !important;
top: auto !important;
left: auto !important;
right: auto !important;
bottom: auto !important;
height: auto !important;
width: 100% !important;
background: none !important;
font-family: "Sora", sans-serif !important;
font-size: 13px !important;
font-weight: 400 !important;
line-height: 1.5 !important;
color: #6B6663 !important;
margin: 0 0 28px 0 !important;
padding: 0 !important;
order: 2 !important;
text-align: left !important;
align-self: flex-start !important;
transform: none !important;
}
/* Form widget itself: place after both pseudos and let it fill card width */
body.page-id-1464 .elementor-element-7bb7a9f2 > .elementor-widget-form,
body.page-id-1464 .elementor-element-7bb7a9f2 > .e-con-inner,
body.page-id-1464 .elementor-element-7bb7a9f2 .elementor-element {
order: 3;
}
body.page-id-1464 .elementor-element-16daec91 {
width: 100% !important;
max-width: 100% !important;
--width: 100% !important;
flex: 1 1 auto !important;
}
/* Form -- the grid wrapper */
body.page-id-1464 form.elementor-form .elementor-form-fields-wrapper {
display: grid !important;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
column-gap: 16px !important;
row-gap: 16px !important;
margin: 0 !important;
}
/* Each field group occupies a column slot */
body.page-id-1464 form.elementor-form .elementor-field-group {
width: 100% !important;
max-width: 100% !important;
padding: 0 !important;
margin: 0 !important;
flex-basis: auto !important;
}
/* Name (text) + Phone (tel) sit side-by-side on row 1.
Everything else spans both columns. */
body.page-id-1464 form.elementor-form .elementor-field-type-email,
body.page-id-1464 form.elementor-form .elementor-field-type-select,
body.page-id-1464 form.elementor-form .elementor-field-type-textarea,
body.page-id-1464 form.elementor-form .elementor-field-type-submit {
grid-column: 1 / -1 !important;
}
/* Labels */
body.page-id-1464 form.elementor-form .elementor-field-label {
font-family: "Sora", sans-serif !important;
font-size: 11px !important;
font-weight: 600 !important;
letter-spacing: 0.12em !important;
text-transform: uppercase !important;
color: #6B6663 !important;
margin: 0 0 8px 0 !important;
display: block !important;
}
/* Inputs / textarea / select */
body.page-id-1464 form.elementor-form input[type="text"],
body.page-id-1464 form.elementor-form input[type="tel"],
body.page-id-1464 form.elementor-form input[type="email"],
body.page-id-1464 form.elementor-form select,
body.page-id-1464 form.elementor-form textarea {
font-family: "Sora", sans-serif !important;
font-size: 14px !important;
font-weight: 400 !important;
color: #1A1414 !important;
background: #FAF9F7 !important;
border: 1px solid #E6E3DE !important;
border-radius: 0 !important;
padding: 14px 16px !important;
width: 100% !important;
line-height: 1.4 !important;
box-shadow: none !important;
transition: border-color 0.18s ease, background 0.18s ease;
}
body.page-id-1464 form.elementor-form input::placeholder,
body.page-id-1464 form.elementor-form textarea::placeholder {
color: #A8A4A0 !important;
opacity: 1 !important;
}
body.page-id-1464 form.elementor-form input:focus,
body.page-id-1464 form.elementor-form select:focus,
body.page-id-1464 form.elementor-form textarea:focus {
border-color: #1A1414 !important;
background: #FFFFFF !important;
outline: none !important;
}
body.page-id-1464 form.elementor-form textarea {
min-height: 120px !important;
resize: vertical !important;
}
/* Select arrow */
body.page-id-1464 form.elementor-form select {
appearance: none !important;
-webkit-appearance: none !important;
background-image: url("data:image/svg+xml;utf8,") !important;
background-repeat: no-repeat !important;
background-position: right 16px center !important;
background-size: 12px 8px !important;
background-color: #FAF9F7 !important;
padding-right: 40px !important;
}
/* Submit button */
body.page-id-1464 form.elementor-form .elementor-field-type-submit {
margin-top: 8px !important;
}
body.page-id-1464 form.elementor-form button[type="submit"],
body.page-id-1464 form.elementor-form .elementor-button {
width: 100% !important;
font-family: "Sora", sans-serif !important;
font-size: 13px !important;
font-weight: 600 !important;
letter-spacing: 0.18em !important;
text-transform: uppercase !important;
color: #F4F2EE !important;
background: #1A1414 !important;
border: 1px solid #1A1414 !important;
border-radius: 0 !important;
padding: 18px 24px !important;
cursor: pointer !important;
transition: background 0.18s ease, color 0.18s ease, transform 0.18s ease !important;
box-shadow: none !important;
}
body.page-id-1464 form.elementor-form button[type="submit"]:hover,
body.page-id-1464 form.elementor-form .elementor-button:hover {
background: #F4F2EE !important;
color: #1A1414 !important;
}
/* Submit button text content (it includes a span.elementor-button-content-wrapper) */
body.page-id-1464 form.elementor-form .elementor-button-text {
font-family: "Sora", sans-serif !important;
letter-spacing: 0.18em !important;
}
/* ---------- RESPONSIVE ---------- */
@media (max-width: 1024px) {
body.page-id-1464 .elementor-element-1ce6cb5e > .e-con-inner {
grid-template-columns: 1fr !important;
row-gap: 48px !important;
padding: 0 40px !important;
}
body.page-id-1464 .elementor-element-44d0c08a > .e-con-inner {
padding: 0 40px !important;
}
}
@media (max-width: 767px) {
body.page-id-1464 .elementor-element-1ce6cb5e {
padding: 32px 0 48px 0 !important;
}
body.page-id-1464 .elementor-element-1ce6cb5e > .e-con-inner {
padding: 0 24px !important;
row-gap: 32px !important;
}
body.page-id-1464 .elementor-element-7dddc298 .elementor-heading-title {
font-size: 36px !important;
}
body.page-id-1464 .elementor-element-7fe264e {
grid-template-columns: 1fr !important;
row-gap: 24px !important;
column-gap: 0 !important;
padding-top: 24px !important;
}
body.page-id-1464 .elementor-element-7bb7a9f2 {
padding: 32px 24px !important;
}
body.page-id-1464 form.elementor-form .elementor-form-fields-wrapper {
grid-template-columns: 1fr !important;
}
body.page-id-1464 .elementor-element-44d0c08a {
padding: 48px 0 64px 0 !important;
}
body.page-id-1464 .elementor-element-44d0c08a > .e-con-inner {
padding: 0 24px !important;
}
body.page-id-1464 .elementor-element-2959b484 .elementor-custom-embed iframe {
height: 320px !important;
}
}