/*
 * Theme Name: Deli Snacks Theme
 * Author: QStylez
 * Description: A custom theme for Deli Snacks based on Figma designs.
 * Version: 1.2
*/

/* ==========================================================================
   1. Global & Font Styles
   ========================================================================== */

html {
    scroll-behavior: smooth;
}
body {
    background-color: #FAF6F1;
    font-family: 'Termina', sans-serif;
    color: #262626;
    margin: 0;
}
body a {
    color: #262626;
}
html, button, input, select, textarea {
    font-family: 'Termina', sans-serif;
}
.inner {
    max-width: 1920px;
    margin: 0 auto;
    padding: 0 2rem;
}
* {
    box-sizing: border-box;
}
/* ==========================================================================
   2. Header Styles
   ========================================================================== */

.site-header {
    position: relative;
    /* Crucial for positioning the logo */
    background-color: #FAF6F1;
    z-index: 1000;
}
.sticky-header {
    position: sticky;
    top: 0;
    width: 100%;
}
/* --- Top Bar --- */

.top-bar {
    border-bottom: 1px solid #DBD9D7;
}
.top-bar .inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 6rem;
    font-size: 0.75rem;
}
.top-bar-left .opening-hours-message {}
/*
 * 1. Make the opening hours container a flexbox.
 * This will align its children (the new icon and the text) on the same line.
 * `align-items: center` vertically centers the text with the icon.
 */

.opening-hours-message {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    /* Creates space between the icon and the text */
}
/*
 * 2. Create a pseudo-element before the text content.
 * This will serve as the container for our SVG icon.
 */

.opening-hours-message::before {
    content: "";
    /* This is required for the pseudo-element to appear */
    display: inline-block;
    /* Allows setting width and height */
    width: 1rem;
    /* 16px */
    height: 1rem;
    /* 16px */
    flex-shrink: 0;
    /* Prevents the icon from shrinking if space is tight */
    /* * 3. Set the SVG as the background image.
   * The SVG code is URL-encoded to work correctly in CSS.
   * The fill color #821814 is encoded as %23821814.
   */
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M12 1.07191C13.2066 1.7686 14.2104 2.76833 14.9119 3.97215C15.6134 5.17597 15.9883 6.54213 15.9995 7.93538C16.0108 9.32864 15.658 10.7007 14.976 11.9157C14.2941 13.1307 13.3066 14.1465 12.1114 14.8626C10.9162 15.5787 9.55469 15.9702 8.16168 15.9984C6.76866 16.0266 5.39244 15.6904 4.16924 15.0233C2.94605 14.3562 1.9183 13.3811 1.18773 12.1947C0.45717 11.0083 0.0491274 9.65168 0.00400009 8.25911L0 7.99991L0.00400009 7.74071C0.0488026 6.35911 0.450838 5.01268 1.17091 3.83271C1.89098 2.65273 2.90452 1.67948 4.11271 1.00782C5.3209 0.336164 6.68252 -0.0109686 8.0648 0.000264196C9.44709 0.011497 10.8029 0.380712 12 1.07191ZM8 3.19991C7.80405 3.19994 7.61493 3.27188 7.4685 3.40209C7.32207 3.53229 7.22853 3.71171 7.2056 3.90631L7.2 3.99991V7.99991L7.2072 8.10471C7.22544 8.24351 7.27978 8.37509 7.3648 8.48631L7.4344 8.56631L9.8344 10.9663L9.9096 11.0319C10.0499 11.1408 10.2224 11.1998 10.4 11.1998C10.5776 11.1998 10.7501 11.1408 10.8904 11.0319L10.9656 10.9655L11.032 10.8903C11.1409 10.75 11.1999 10.5775 11.1999 10.3999C11.1999 10.2223 11.1409 10.0498 11.032 9.90951L10.9656 9.83431L8.8 7.66791V3.99991L8.7944 3.90631C8.77147 3.71171 8.67793 3.53229 8.5315 3.40209C8.38507 3.27188 8.19595 3.19994 8 3.19991Z" fill="%23821814"/></svg>');
    background-repeat: no-repeat;
    background-size: contain;
}
.top-bar-right {
    display: flex;
    align-items: center;
    gap: 1.5rem;
}
.phone-order {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}
.phone-order-prompt {
    font-weight: 600;
}
.phone-number-link {
    display: block;
    background: #ffffff;
    border-radius: 7.5rem;
    border: 1px solid #dbd9d7;
    padding: 0.8rem 1.5rem;
    text-decoration: none;
    color: #262626;
    font-weight: 600;
    font-size: 0.875rem;
    white-space: nowrap;
}
.phone-number-link:hover {
    border: 1px solid #DBD9D7;
    background: #D9D9D9;
}
.language-switcher {}
/* --- Overlapping Logo --- */

.site-logo-container {
    position: absolute;
    left: 50%;
    /* Position the top of the logo container relative to the top bar's bottom edge */
    top: 0.6875rem;
    /* (6rem top bar height - (10.625rem logo height / 2)) = 0.6875rem */
    transform: translateX(-50%);
}
.site-logo {
    display: block;
    width: 10.625rem;
    /* 170px */
    height: 10.625rem;
    /* 170px */
}
/* Image with 'data' attribute is hidden */

img[data-lazy-src] {
    /* we set the opacity to 0 */
    opacity: 0;
}
/* Image without 'data' attribute is (or becomes) visible */

img.lazyloaded {
    /* prepare the future animation */
    -webkit-transition: opacity .5s linear 0.2s;
    -moz-transition: opacity .5s linear 0.2s;
    transition: opacity .5s linear 0.2s;
    /* we set the opacity to 1 to do the magic */
    opacity: 1;
}
/* ==========================================================================
   3. Main Content & Homepage Layout
   ========================================================================== */

body:not(.woocommerce-page) article.page.type-page {
    width: 100%;
    max-width: 64rem;
    margin: 0 auto;
    padding: 2.5rem 1.5rem;
    padding-bottom: 2.5rem;
}
body:not(.woocommerce-page) article.page.type-page .entry-content>h4 {
    margin: 1rem 0;
}
body:not(.woocommerce-page) article.page.type-page .entry-content>h3:first-child, body:not(.woocommerce-page) article.page.type-page .entry-content>h4:first-child {
    margin-top: 0;
}
body:not(.woocommerce-page) article.page.type-page .entry-content>p:first-child {
    margin-top: 0;
}
body:not(.woocommerce-page) article.page.type-page .entry-content>p:last-child {
    margin-bottom: 0;
}
body:not(.woocommerce-page) article.page.type-page .entry-content p {
    margin: 1.5rem 0;
}
body:not(.woocommerce-page) article.page.type-page h3 {
    margin-top: 2rem;
    margin-bottom: 0;
}
.page-id-48 article.page.type-page, .error404 article.page.type-page {
    text-align: center;
}
.entry-title {
    margin-top: 0;
    margin-bottom: 1.5rem
}
/* --- Hero Section (Full-Width) --- */

.homepage-hero {
    /* This section has a top padding to make space for the overlapping logo */
    margin-bottom: 1rem;
    width: 100%;
    /* Position it behind the header */
    position: relative;
    z-index: 999;
}
.hero-image-container {
    height: 24rem;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
/* --- Two-Column Grid (Below Hero) --- */

.homepage-layout-grid {
    display: grid;
    grid-template-columns: 1fr 26.5rem;
    gap: 0;
    max-width: 100%;
    margin: 0 auto;
}
.homepage-content-column {
    min-width: 0;
}
.sidebar-cart-sticky-container {
    position: sticky;
    top: 0rem;
    height: calc(100vh - 97px);
    background-color: #FAF6F1;
    border-bottom: 1px solid #DBD9D7;
    border-radius: 0 0 0 1rem;
    padding: 2rem 1.5rem;
    padding: 0;
    transition: height .4s;
}
.scrolled-past-header .sidebar-cart-sticky-container {
    height: calc(100vh);
}
/* --- Products World (Inner container for padding) --- */

.product-world-container {
    padding: 0 7rem;
}
/* --- Product Filters, Sections, and Cards --- */

.product-filters-section {
    margin-bottom: 1.25rem;
    padding-bottom: 1.25rem;
}
body .product-list-section:last-child {
    margin-bottom: 0;
}
.product-filters-section .section-title {
    padding-top: 2rem;
    margin-top: 0;
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 2rem;
}
.product-search-container {
    margin-bottom: 1.5rem;
    position: relative;
    z-index: 1
}
#deli-product-results.loading {
    opacity: 0.5;
    transition: opacity 0.3s ease-in-out;
}
.woocommerce-product-search input[type="search"] {
    background: #ffffff;
    border-radius: 4rem;
    border: 1px solid #dbd9d7;
    padding: 1rem 2rem 1rem 3.5rem;
    width: 100%;
    font-size: 1rem;
}
/*
 * Styles for the WooCommerce Product Search Form
 * Based on the provided Figma design.
*/

/* 1. Target the overall form container for positioning */

.woocommerce-product-search {
    position: relative;
    display: flex;
    width: 100%;
}
/* 2. Hide the default search button, as it's not in the Figma design.
   The search will be triggered by your AJAX script as the user types. */

.woocommerce-product-search button[type="submit"] {
    display: none;
}
/* 3. Style the search input field to perfectly match the Figma appearance */

body .woocommerce-product-search .search-field {
    /* --- Box Model and Appearance --- */
    background: #ffffff;
    border-radius: 4rem;
    border: 1px solid #dbd9d7;
    width: 100%;
    flex-grow: 1;
    /* --- Font Styling --- */
    font-size: 1rem;
    font-weight: 400;
    color: #262626;
    /* This is the color of the text the user types */
    line-height: 1;
    /* Ensures vertical alignment */
    /* --- Icon and Padding --- */
    /* The search icon from Figma is added as a background image */
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none"><path d="M20.6667 18.6667H19.6133L19.24 18.3067C20.5919 16.7388 21.3349 14.737 21.3333 12.6667C21.3333 10.9526 20.825 9.27696 19.8727 7.85173C18.9204 6.4265 17.5669 5.31567 15.9833 4.65971C14.3996 4.00376 12.6571 3.83213 10.9759 4.16653C9.29472 4.50094 7.75047 5.32636 6.53841 6.53841C5.32636 7.75047 4.50094 9.29472 4.16653 10.9759C3.83213 12.6571 4.00376 14.3996 4.65971 15.9833C5.31567 17.5669 6.4265 18.9204 7.85173 19.8727C9.27696 20.825 10.9526 21.3333 12.6667 21.3333C14.8133 21.3333 16.7867 20.5467 18.3067 19.24L18.6667 19.6133V20.6667L25.3333 27.32L27.32 25.3333L20.6667 18.6667ZM12.6667 18.6667C9.34667 18.6667 6.66667 15.9867 6.66667 12.6667C6.66667 9.34667 9.34667 6.66667 12.6667 6.66667C15.9867 6.66667 18.6667 9.34667 18.6667 12.6667C18.6667 15.9867 15.9867 18.6667 12.6667 18.6667Z" fill="%23F9B206"/></svg>');
    background-repeat: no-repeat;
    background-position: left 1.5rem center;
    background-size: 2rem 2rem;
    /* Padding: top/bottom | right | left */
    /* The left padding is larger to create space for the icon */
    padding: 1rem 2rem 1rem 4.5rem;
    /* --- Reset default browser styles --- */
    -webkit-appearance: none;
    appearance: none;
}
/* 4. Style the placeholder text to match Figma */

.woocommerce-product-search .search-field::placeholder {
    color: #6b787c;
    opacity: 1;
    /* Override browser defaults */
}
/* 5. (Optional) Add a focus style for better UX */

.woocommerce-product-search .search-field:focus {
    outline: none;
    border-color: #F9B206;
    box-shadow: 0 0 0 3px rgba(249, 178, 6, 0.2);
    border-color: #DBD9D7;
    box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.20);
}
/* === START OF MODIFIED CATEGORY NAVIGATION STYLES === */

.product-categories-nav-parent {
    position: relative;
    /* Context for the absolutely positioned arrows */
}
.product-categories-nav {
    display: flex;
    align-items: center;
}
.category-list-wrapper {
    overflow-x: scroll;
    scrollbar-width: none;
    -ms-overflow-style: none;
    flex: 1;
    position: relative;
    /* Context for the fade pseudo-elements */
    border-radius: 4rem;
    margin-right: 4rem;
}
.category-list-wrapper::-webkit-scrollbar {
    display: none;
}
/* Fades for left and right of category list */

.product-categories-nav-parent::before, .product-categories-nav-parent::after {
    content: '';
    position: absolute;
    top: 0;
    height: 100%;
    width: 7.8125rem;
    /* 125px */
    pointer-events: none;
    z-index: 1;
    transition: opacity 0.2s ease-in-out;
}
.product-categories-nav-parent::after {
    width: 15rem;
}
/* Left fade (starts hidden) */

.product-categories-nav-parent::before {
    left: 0;
    background: linear-gradient(-90deg, rgba(250, 246, 241, 0.00) 0%, #FAF6F1 79.71%);
    opacity: 0;
}
/* Right fade (starts visible) */

.product-categories-nav-parent::after {
    right: 0;
    background: linear-gradient(90deg, rgba(250, 246, 241, 0.00) 0%, #FAF6F1 79.71%);
    opacity: 1;
}
/* JS-controlled states for fades */

.product-categories-nav-parent.is-scrolling::before {
    opacity: 1;
    /* Show left fade when scrolling */
}
.product-categories-nav-parent.is-at-end::after {
    opacity: 0;
    /* Hide right fade when at the end */
}
.category-list {
    display: flex;
    gap: 0.5rem;
    list-style: none;
    padding: 0.25rem 0;
    margin: 0;
}
.category-item a {
    display: block;
    padding: 0.875rem 1rem;
    border-radius: 4rem;
    border: 1px solid #dbd9d7;
    background-color: #fff;
    color: #262626;
    text-decoration: none;
    font-weight: 600;
    font-size: 0.875rem;
    white-space: nowrap;
}
.category-item.active a {
    background-color: #F9B206;
    border-color: #F9B206;
}
.category-item a:hover {
    border-radius: 4rem;
    border: 1px solid #DBD9D7;
    background: #D9D9D9;
}
.category-nav-arrows {
    /* This container just groups buttons in the DOM, no style needed */
}
/* Styles for the category navigation arrows */

.product-categories-nav .arrow-prev, .product-categories-nav .arrow-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: #fff;
    border: 1px solid #dbd9d7;
    border-radius: 50%;
    width: 3rem;
    height: 3rem;
    cursor: pointer;
    font-size: 0;
    background-repeat: no-repeat;
    background-position: center;
    z-index: 2;
    /* Position above the fades */
}
.product-categories-nav .arrow-prev {
    left: 0rem;
}
.product-categories-nav .arrow-next {
    right: 3.5rem;
}
.product-categories-nav button:hover {
    background-color: #DBD9D7;
}
.product-categories-nav button.arrow-prev, .carousel-nav button.arrow-prev {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="18" viewBox="0 0 10 18" fill="none"><path d="M10 16.5289L8.51274 18L0.412043 9.98258C0.281464 9.85411 0.177835 9.70134 0.10712 9.53307C0.0364044 9.3648 -8.0292e-07 9.18434 -7.86987e-07 9.00208C-7.71054e-07 8.81983 0.0364045 8.63937 0.10712 8.4711C0.177835 8.30282 0.281464 8.15006 0.412044 8.02159L8.51275 7.44208e-07L9.9986 1.47109L2.39552 9L10 16.5289Z" fill="black"/></svg>');
}
.product-categories-nav button.arrow-next, .carousel-nav button.arrow-next {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="18" viewBox="0 0 10 18" fill="none"><path d="M0 1.47109L1.48725 0L9.58796 8.01742C9.71853 8.14589 9.82216 8.29866 9.89288 8.46693C9.96359 8.6352 10 8.81566 10 8.99792C10 9.18017 9.96359 9.36063 9.89288 9.5289C9.82216 9.69718 9.71853 9.84994 9.58796 9.97841L1.48725 18L0.0014019 16.5289L7.60448 9L0 1.47109Z" fill="black"/></svg>');
}
.deli-category-modal-trigger {
    display: flex;
    width: 3rem;
    height: 3rem;
    padding: 0.5rem 1rem;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 0.5rem;
    border-radius: 50rem;
    border: 1px solid #DBD9D7;
    background-color: #FFF;
    cursor: pointer;
    z-index: 1;
    position: relative;
}
.deli-category-modal-trigger:hover {
    background-color: #DBD9D7;
}
.category-nav-controls {
    z-index: 2;
}
.deli-product-modal-image.placeholder-image {
    background-image: url(https://delisnacks.nl/wp-content/uploads/woocommerce-placeholder.webp);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    background-color: #f5f8f7;
}
/* === END OF MODIFIED CATEGORY NAVIGATION STYLES === */

/* Styles for featured product carousel navigation */

.carousel-nav {
    display: flex;
    flex-direction: row;
    gap: 0.5rem;
    align-items: center;
    justify-content: flex-end;
}
.carousel-nav button {
    background-color: #fff;
    border: 1px solid #dbd9d7;
    border-radius: 50%;
    width: 3rem;
    height: 3rem;
    cursor: pointer;
    font-size: 0;
    padding: 0;
    background-repeat: no-repeat;
    background-position: center;
}
.carousel-nav button:hover {
    background-color: #dbd9d7;
}
/* Disabled state for ALL carousel buttons */

.product-categories-nav button.disabled, .carousel-nav button.disabled {
    opacity: 0.25;
}
.category-nav-arrows .arrow-next.disabled {
    opacity: 0;
}
.product-carousel-section, .product-list-section {
    margin-bottom: 2.5rem;
}
.section-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
}
.section-header .section-title {
    font-size: 1.5rem;
    font-weight: 700;
    margin: 0;
}
ul.products {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
}
.products-carousel-wrapper {
    position: relative;
    overflow: hidden;
}
/* Right fade effect for featured products */

.products-carousel-parent {
    position: relative;
}
/* Existing CSS for the fade gradient */

.products-carousel-parent::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 7.8125rem;
    height: 100%;
    background: linear-gradient(90deg, rgba(250, 246, 241, 0.00) 0%, #FAF6F1 79.71%);
    pointer-events: none;
    z-index: 1;
    opacity: 1;
    transition: opacity 0.3s ease;
}
.products-carousel-parent::before {
    content: '';
    position: absolute;
    top: 0;
    left: -1rem;
    width: 7.8125rem;
    height: 100%;
    background: linear-gradient(-90deg, rgba(250, 246, 241, 0.00) 0%, #FAF6F1 79.71%);
    pointer-events: none;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s ease;
}
.products-carousel-parent.hide-fade-gradient::before, .products-carousel-parent.slide-right-action::before, .products-carousel-parent.slide-right::before {
    opacity: 1;
}
/* Hide the fade gradient when at the end */

.products-carousel-parent.hide-fade-gradient::after {
    opacity: 0;
}
ul.products-carousel {
    display: flex;
    gap: 1rem;
}
ul.products-list {
    grid-template-columns: 1fr;
    gap: 1rem;
}
/* Styles for Featured Product Card */

li.product-card {
    background: #ffffff;
    border-radius: 1rem;
    border: 1px solid #dbd9d7;
    padding: 1rem;
    cursor: pointer;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    min-width: 30rem;
    list-style: none;
    -webkit-box-shadow: 0 0 1px 0 rgba(0, 0, 0, .12), 0 1px 5px 0 rgba(0, 0, 0, .04), 0 0 4px 0 rgba(0, 0, 0, .1);
    box-shadow: 0 0 1px 0 rgba(0, 0, 0, .12), 0 1px 5px 0 rgba(0, 0, 0, .04), 0 0 4px 0 rgba(0, 0, 0, .1);
    box-shadow: unset;
}
li.product-card:hover {
    background-color: #f5f3f1;
    background-color: #fff;
    box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.20);
}
li.product-card:active {
    background-color: #dcd4cd;
    background-color: #f5f3f1;
}
.product-card-content {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 1.25rem;
    flex-grow: 1;
    overflow: hidden;
}
.product-card .product-image {
    width: 10.9375rem;
    height: 8.4375rem;
    border-radius: 1rem;
    overflow: hidden;
    flex-shrink: 0;
}
.product-card .product-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.product-card .product-details {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
    align-items: flex-start;
}
.product-card .product-text {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
.product-card .product-category {
    font-size: 0.75rem;
    color: #262626;
}
.product-card .product-category a {
    color: inherit;
    text-decoration: none;
}
.product-card .woocommerce-loop-product__title {
    font-size: 1.125rem;
    font-weight: 600;
    margin: 0;
    line-height: 100%;
}
.product-card .woocommerce-loop-product__title a {
    color: inherit;
    text-decoration: none;
}
.product-card .price-wrapper .price {
    font-size: 0.75rem;
    font-weight: 600;
    color: #262626;
}
.product-card .product-add-to-cart {
    flex-shrink: 0;
    margin-left: 1rem;
}
.product-card .product-add-to-cart .add_to_cart_button, .products-carousel .product-add-to-cart button {
    background-image: url('data:image/svg+xml,<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="0.5" y="0.5" width="39" height="39" rx="19.5" fill="white" stroke="%23DBD9D7"/><path d="M20 12.5V27.5M12.5 20H27.5" stroke="%23F9B206" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>');
    background-color: transparent;
    border: none;
    width: 2.5rem;
    height: 2.5rem;
    background-repeat: no-repeat;
    background-size: contain;
    font-size: 0;
    padding: 0;
    cursor: pointer;
    display: flex;
}
.product-card .add_to_cart_button:hover {}
.product-card .add_to_cart_button::after {
    display: none !important;
}
.product-card .added_to_cart.wc-forward, .product-list-item .added_to_cart.wc-forward {
    display: none;
}
/* Styles for Product List Item */

.product-list-item {
    background-color: #ffffff;
    border-radius: 1rem;
    border: 1px solid #dbd9d7;
    padding: 1.5rem;
    cursor: pointer;
    -webkit-box-shadow: 0 0 1px 0 rgba(0, 0, 0, .12), 0 1px 5px 0 rgba(0, 0, 0, .04), 0 0 4px 0 rgba(0, 0, 0, .1);
    box-shadow: 0 0 1px 0 rgba(0, 0, 0, .12), 0 1px 5px 0 rgba(0, 0, 0, .04), 0 0 4px 0 rgba(0, 0, 0, .1);
    box-shadow: unset;
}
.product-list-item:hover {
    background-color: #f5f3f1;
    background-color: #fff;
    box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.20);
}
.product-list-item:active {
    background-color: #dcd4cd;
    background-color: #f5f3f1;
}
.product-item-content {
    display: flex;
    gap: 2.5rem;
    align-items: flex-start;
}
.product-text-details {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.product-list-item .product-title-wrapper {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}
.product-list-item .woocommerce-loop-product__title {
    font-size: 1.125rem;
    line-height: 100%;
    font-weight: 600;
    margin: 0;
}
.product-list-item .woocommerce-loop-product__title a {
    color: #262626;
    text-decoration: none;
}
.product-list-item .price {
    font-size: 0.75rem;
    line-height: 100%;
    font-weight: 600;
    color: #262626;
}
.product-list-item .description-wrapper {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.product-list-item .product-description, .product-list-item .nutritional-information {
    font-size: 0.75rem;
    line-height: 180%;
    font-weight: 400;
    color: #262626;
}
.product-list-item .nutritional-information {
    margin: 0;
}
.product-list-item .product-add-to-cart .button {
    background: #ffffff;
    border-radius: 3rem;
    border: 1px solid #dbd9d7;
    padding: 0.8125rem;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: #262626;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 100%;
    text-decoration: none;
    cursor: pointer;
}
.product-list-item .product-image {
    width: 10.9375rem;
    height: 8.4375rem;
    border-radius: 1rem;
    flex-shrink: 0;
    overflow: hidden;
}
.product-list-item .product-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    background: #d9d9d9;
}
.product-list-item .product-add-to-cart .button svg path {
    stroke: #f9b206;
}
.product-attributes-list {
    font-size: 0.75rem;
    font-weight: 400;
    text-transform: lowercase;
}
/* ==========================================================================
   4. Footer Styles (Reworked based on Figma)
   ========================================================================== */

.site-footer {
    padding: 2.5rem 1rem;
    background-color: #FAF6F1;
}
.site-footer .inner {
    padding: 0;
}
/* This is the main container inside the footer's .inner div */

.footer-main-content {
    border-radius: 2.5rem;
    /* 40px */
    border: 1px solid #dbd9d7;
    padding: 2.5rem;
    /* 48px 64px */
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.footer-logo .home-link {
    display: block;
}
.footer-logo img {
    width: 6.875rem;
    /* 110px */
    height: 6.875rem;
    /* 110px */
    display: block;
}
/* Navigation menu styling */

.footer-navigation .footer-menu-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    /* Allows items to wrap on smaller screens */
    gap: 1.5rem;
    /* 45px */
    align-items: center;
}
.footer-navigation .footer-menu-list li {
    padding: 0;
    margin: 0;
}
.footer-navigation .footer-menu-list a {
    text-decoration: none;
    color: #262626;
    /* Note: Font from Figma is Proxima Nova. Ensure it is loaded by the theme to render correctly. */
    font-size: 0.75rem;
    /* 16px */
    /* 19.6px */
    font-weight: 400;
}
.footer-navigation .footer-menu-list a:hover {
    text-decoration: underline;
}
.footer-navigation .footer-menu-list {
    font-size: 0.75rem;
    font-weight: 400;
}
/* Responsive adjustments for the footer */

@media (max-width: 1024px) {
    .footer-main-content {
        flex-direction: column;
        gap: 2rem;
        padding: 2rem 1.5rem;
    }
    .footer-navigation .footer-menu-list {
        flex-direction: column;
        gap: 1.5rem;
    }
}
/* ==========================================================================
   6. WooCommerce Checkout Page Styles (Figma Design)
   ========================================================================== */

/* --- General Checkout Layout --- */

.woocommerce-checkout {}
.woocommerce-checkout .entry-title {
    display: none;
    /* Hide the default "Afrekenen" title */
}
/* --- Continue Shopping Button --- */

.deli-continue-shopping-wrapper {
    margin-bottom: 2rem;
}
.deli-button-secondary {
    background: #f4f4f4;
    border-radius: 7.5rem;
    padding: 1.0625rem 1.5rem;
    color: #262626;
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 600;
    /* Demi is often mapped to 600 */
    display: inline-block;
    border: 1px solid #dbd9d7;
    transition: background-color 0.3s ease;
}
.deli-button-secondary:hover {
    background: #e9e9e9;
}
/* --- Main Two-Column Layout --- */

.deli-checkout-layout {
    display: grid;
    grid-template-columns: 1fr 26.5rem;
    /* Main content and sidebar */
    gap: 2rem;
    align-items: flex-start;
}
@media (max-width: 992px) {
    .deli-checkout-layout {
        grid-template-columns: 1fr;
        /* Stack columns on smaller screens */
    }
    .deli-checkout-sidebar {
        grid-row: 1;
        /* Move sidebar to the top on mobile */
    }
}
/* --- Form Containers (White Boxes) --- */

.deli-checkout-box {
    background: #ffffff;
    border-radius: 1.5rem;
    border: 1px solid #dbd9d7;
    padding: 2rem 1.5rem;
    margin-bottom: 0;
}
#deli-bestelgegevens-box {
    margin-bottom: 0;
}
body .iconic-wds-fields {
    margin: 0;
    display: block !important;
    margin-bottom: 1.5rem
}
.iconic-wds-fields__fields>div {
    margin-bottom: 1.5rem;
}
.iconic-wds-fields__fields>div:last-child {
    margin-bottom: 0;
}
body .deli-checkout-box .iconic-wds-fields .woocommerce-error {
    margin-bottom: 0;
}
.woocommerce-checkout .woocommerce-error {
    gap: 0.5rem;
    display: flex;
    flex-direction: column;
}
/* --- Section Titles (e.g., "Adresgegevens") --- */

.woocommerce-billing-fields>h3, #ship-to-different-address, #bestelgegevens-title {
    color: #262626;
    font-size: 1.25rem;
    font-weight: 700;
    margin-top: 0;
    margin-bottom: 1.5rem;
}
.woocommerce-billing-fields h3.iconic-wds-fields__title {
    display: none;
}
/* --- Form Field Styling --- */

.woocommerce-checkout .form-row {
    padding: 0;
    margin: 0 0 1rem 0;
    display: flex;
    flex-direction: column;
}
.woocommerce-checkout .form-row label {
    color: #000000;
    font-size: 0.75rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    line-height: 1.5;
}
.woocommerce-checkout .form-row label .required {
    color: #f9b206;
    /* Use theme color for asterisk */
    text-decoration: none;
    border: none;
}
.woocommerce-checkout .input-text, .woocommerce-checkout textarea, .woocommerce-checkout select {
    background: #ffffff;
    border-radius: 0.625rem !important;
    border: 1px solid #dbd9d7 !important;
    padding: 1rem !important;
    font-size: 0.875rem !important;
    color: #262626 !important;
    width: 100%;
    height: auto;
    box-shadow: none !important;
    outline: none !important;
    transition: border-color 0.3s ease;
}
.woocommerce-checkout .input-text:focus, .woocommerce-checkout textarea:focus, .woocommerce-checkout select:focus {
    border-color: #f9b206 !important;
}
.woocommerce-checkout .input-text::placeholder, .woocommerce-checkout textarea::placeholder {
    color: #6b787c;
    opacity: 1;
}
/* Specific field layout adjustments */

.woocommerce-billing-fields__field-wrapper, .woocommerce-shipping-fields__field-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 0 1rem;
    /* Column gap */
}
.woocommerce-billing-fields__field-wrapper .form-row, .woocommerce-shipping-fields__field-wrapper .form-row {
    margin-bottom: 1rem;
}
.form-row-first {
    width: calc(50% - 0.5rem);
    clear: both;
}
.form-row-last {
    width: calc(50% - 0.5rem);
}
.form-row-wide {
    width: 100%;
    clear: both;
}
/* --- Order Notes & Delivery Moment --- */

#order_comments_field, .deli-delivery-moment-field {
    width: 100%;
}
textarea#order_comments {
    height: 8rem;
    resize: none;
}
/* --- Order Review Sidebar --- */

#deli-order-review-box {
    position: sticky;
    top: 8.5rem;
    /* Adjust based on your sticky header height */
}
#order_review_heading {
    font-size: 1.25rem;
    margin-bottom: 1.5rem;
}
.woocommerce-checkout-review-order-table {
    width: 100%;
    border-collapse: collapse;
}
.woocommerce-checkout-review-order-table thead, .woocommerce-checkout-review-order-table .cart-subtotal, .woocommerce-checkout-review-order-table .shipping, .woocommerce-checkout-review-order-table .order-total th {
    display: none;
    /* Hide table headers and specific labels to match Figma */
}
.woocommerce-checkout-review-order-table tbody, .woocommerce-checkout-review-order-table tfoot {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}
.woocommerce-checkout-review-order-table tr {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0;
    border: none;
}
.woocommerce-checkout-review-order-table .cart_item td {
    border: none;
    padding: 0;
    font-size: 0.875rem;
    color: #262626;
}
.cart_item .product-name {
    text-align: left;
}
.cart_item .product-total {
    text-align: right;
}
.woocommerce-checkout-review-order-table tfoot tr {
    font-size: 0.875rem;
}
.woocommerce-checkout-review-order-table tfoot .order-total td, .woocommerce-checkout-review-order-table tfoot .order-total th {
    font-weight: 700;
}
.woocommerce-checkout-review-order-table td, .woocommerce-checkout-review-order-table th {
    padding: 0;
    border: none;
    background: none;
    text-align: left;
}
/* Add the divider line */

.woocommerce-checkout-review-order-table .cart-subtotal {
    padding-top: 1.5rem;
    border-top: 1px solid #dbd9d7;
}
/* --- Payment Methods --- */

#payment {
    background: transparent;
    border-radius: 0;
}
#payment ul.payment_methods {
    padding: 0;
    border: none;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-bottom: 1.5rem;
}
#payment li.wc_payment_method {
    background: none;
}
#payment li.wc_payment_method label {
    font-size: 0.875rem;
    font-weight: 600;
    color: #000;
}
#payment .payment_box {
    display: none;
    /* Hide the description box for a cleaner look */
}
/* Custom Radio Buttons */

#payment .input-radio {
    -webkit-appearance: none;
    appearance: none;
    background-color: #fff;
    margin: 0;
    font: inherit;
    color: currentColor;
    width: 1.5rem;
    height: 1.5rem;
    border: 1px solid #666;
    border-radius: 50%;
    transform: translateY(0.15em);
    display: grid;
    place-content: center;
    margin-right: 1rem;
}
#payment .input-radio::before {
    content: "";
    width: 0.625rem;
    height: 0.625rem;
    border-radius: 50%;
    transform: scale(0);
    transition: 120ms transform ease-in-out;
    background-color: #fff;
}
#payment .input-radio:checked {
    background-color: #f9b206;
    border-color: #f9b206;
}
#payment .input-radio:checked::before {
    transform: scale(1);
}
.woocommerce-checkout .entry-content {
    padding: 2.5rem 1.5rem;
    width: 100%;
    margin: 0 auto;
    max-width: 69.6875rem;
}
/* --- Place Order Button --- */

.woocommerce-checkout .place-order {
    padding: 0;
    margin: 0;
}
#place_order {
    background: #f9b206 !important;
    border-radius: 7.5rem !important;
    padding: 1.0625rem 1.5rem !important;
    color: #262626 !important;
    font-size: 0.875rem !important;
    font-weight: 600 !important;
    width: 100%;
    line-height: 1.5;
    text-align: center;
}
#place_order:hover {
    background: #E6A200 !important;
}
/* Privacy policy text */

.woocommerce-terms-and-conditions-wrapper {
    margin-bottom: 1.5rem;
}
.woocommerce-privacy-policy-text p {
    font-size: 0.75rem;
    color: #6b787c;
}
/* ==========================================================================
   FINAL CSS for Deli Snacks Checkout Page
   ========================================================================== */

/* --- HIDE UNWANTED DEFAULT ELEMENTS --- */

.woocommerce-checkout .entry-title, .woocommerce-form-coupon-toggle, .checkout_coupon, #ship-to-different-address {
    display: none !important;
}
/* --- General Checkout Layout --- */

.deli-continue-shopping-wrapper {
    margin-bottom: 2rem;
}
.deli-button-secondary {
    background: #f4f4f4;
    border-radius: 7.5rem;
    padding: 1.0625rem 1.5rem;
    color: #262626;
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 600;
    display: inline-block;
    border: 1px solid #dbd9d7;
}
/* --- Main Two-Column Grid --- */

.deli-checkout-layout {
    display: grid;
    grid-template-columns: 1fr 26.5rem;
    gap: 2rem;
    align-items: flex-start;
}
.deli-checkout-main {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
@media (max-width: 992px) {
    .deli-checkout-layout {
        grid-template-columns: 1fr;
    }
    .deli-checkout-sidebar {
        grid-row: 1;
    }
}
/* --- Form Containers (White Boxes) --- */

.deli-checkout-box {
    background: #ffffff;
    border-radius: 1.5rem;
    border: 1px solid #dbd9d7;
    padding: 2rem 1.5rem;
}
/* --- Section Titles --- */

.deli-checkout-box>h3 {
    color: #262626;
    font-size: 1.25rem;
    margin: 0 0 1.5rem 0;
}
/* --- General Form Field Styling --- */

.woocommerce-checkout .site #primary .form-row {
    padding: 0;
    margin: 0;
}
.woocommerce-checkout .site #primary #deli-bestelgegevens-box .form-row {
    margin: 0 0 1.5rem 0;
}
.woocommerce-checkout .site #primary #deli-bestelgegevens-box .form-row:last-child {
    margin-bottom: 0;
}
.woocommerce-checkout .form-row label {
    color: #000000;
    font-size: 0.75rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    display: block;
}
.woocommerce-checkout .form-row label .required {
    color: #f9b206;
    text-decoration: none;
}
.woocommerce-checkout .input-text, .woocommerce-checkout select {
    border-radius: 0.625rem !important;
    border: 1px solid #dbd9d7 !important;
    padding: 1rem !important;
    font-size: 0.875rem !important;
    color: #262626 !important;
    width: 100%;
    box-shadow: none !important;
    outline: none !important;
}
.woocommerce-checkout textarea.input-text {
    height: 8rem;
}
.woocommerce-checkout .input-text:focus, .woocommerce-checkout select:focus {
    border-color: #f9b206 !important;
}
.woocommerce-checkout ::placeholder {
    color: #6b787c;
    opacity: 1;
}
body .input-text.hasDatepicker {
    cursor: pointer;
}
/* --- 3-Column Address Field Layout --- */

.woocommerce-billing-fields__field-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem 1rem;
}
body .site #primary .form-row-first {
    width: calc(50% - 0.5rem);
}
body .site #primary .form-row-last {
    width: calc(50% - 0.5rem);
}
body .site #primary .form-row-wide {
    width: 100%;
}
body .site #primary .deli-address-postcode {
    width: calc(35% - 0.67rem);
}
body .site #primary .deli-address-housenr {
    width: calc(20% - 0.67rem);
}
body .site #primary .deli-address-street {
    width: calc(45% - 0.67rem);
}
/* --- Custom Payment Methods --- */

.deli-payment-methods-container {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.deli-payment-method {
    border: 1px solid transparent;
    border-radius: 0.75rem;
    padding: 0.5rem;
    transition: border-color 0.3s ease, background-color 0.3s ease;
}
body .deli-payment-method {
    padding: 0;
}
.shipping-method-flat_rate-1 {}
.shipping-method-free_shipping-2 {}
.totals-row.shipping .deli-shipping-method input {
    display: none;
}
body .woocommerce-shipping-methods li {
    margin: 0;
}
.deli-payment-method .input-radio {
    display: none;
}
.deli-shipping-method-unselected {
    display: none;
}
/* --- Minimum Order Notice --- */

.deli-minimum-order-notice {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.5rem;
    margin-top: 1rem;
    /* Space between button and notice */
}
.deli-notice-text {
    color: #262626;
    font-size: 0.75rem;
    line-height: 120%;
    font-weight: 500;
}
.deli-notice-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 14px;
    height: 14px;
}
.deli-notice-icon svg {
    width: 100%;
    height: 100%;
}
body .site .deli-payment-method .deli-payment-label {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin: 0;
    cursor: pointer;
}
.deli-payment-label .deli-radiobutton {
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    border: 1px solid #666;
    display: grid;
    place-content: center;
    flex-shrink: 0;
    transition: all 0.2s ease;
}
.deli-payment-label .deli-radiobutton::before {
    content: '';
    display: block;
    width: 0.625rem;
    height: 0.625rem;
    border-radius: 50%;
    background: #fff;
    transform: scale(0);
    transition: transform 0.2s ease;
}
.input-radio:checked+.deli-payment-label .deli-radiobutton {
    background: #0080FF;
    border-color: #0080FF;
}
.input-radio:checked+.deli-payment-label .deli-radiobutton::before {
    transform: scale(1);
}
.deli-payment-label .deli-payment-title {
    font-size: 0.75rem;
}
.deli-payment-icon-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3.25rem;
    height: 2.5rem;
}
.no-icon .deli-payment-icon-wrapper {
    background-image: url(https://delisnacks.nl/wp-content/uploads/2025/07/Deli_Snacks_Logo.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain
}
.deli-payment-icon-wrapper img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}
.deli-payment-method .payment_box {
    padding-left: 3.5rem;
    padding-top: 1rem;
    padding-right: 1rem;
    background-color: transparent !important;
    box-shadow: none !important;
    border: none !important;
    display: none !important;
}
.deli-payment-method .payment_box p {
    font-size: 0.8rem;
    color: #666;
    margin: 0;
}
.deli-payment-method .payment_box .form-row {
    padding: 0;
    margin-bottom: 0.5rem;
}
/* --- Place Order Button & Terms --- */

#deli-bestelgegevens-box .place-order {
    padding-top: 1.5rem;
    margin: 0;
}
#place_order {
    width: 100%;
}
/* --- Custom Order Summary Sidebar (from review-order.php) --- */

#deli-order-review-box {
    position: sticky;
    top: 2rem;
}
.deli-order-summary-wrapper {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    font-size: 0.75rem;
}
.deli-order-summary-wrapper h3 {
    color: #262626;
    font-size: 1.25rem;
    margin: 0 0 1.5rem 0;
    margin: 0
}
.totals-row.shipping .value {}
.deli-order-summary-products {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}
.deli-summary-product-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}
.deli-summary-product-row {
    border-bottom: 1px solid #DBD9D7;
    padding-bottom: 1.5rem;
}
.deli-summary-product-row:last-child {
    border-bottom: unset;
    padding-bottom: 0;
}
.deli-summary-product-name {
    color: #262626;
    font-size: 0.75rem;
    font-weight: 600;
}
.deli-summary-product-name .product-quantity {}
.deli-summary-product-name .product-name {
    text-decoration: underline;
}
.deli-summary-product-name .product-name+.cart-item__addons {
    margin-top: 1rem;
}
.deli-summary-product-total {
    color: #262626;
    font-size: 0.75rem;
    text-decoration: underline;
}
.deli-order-summary-totals {
    border-top: 1px solid #dbd9d7;
    padding-top: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}
.deli-summary-totals-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.deli-summary-label {
    color: #262626;
}
.deli-summary-value {
    color: #262626;
}
.order-total .deli-summary-label, .order-total .deli-summary-value .woocommerce-Price-amount {
    font-size: 1rem;
}
.order-total small.includes_tax {
    display: none;
}
.woocommerce-NoticeGroup.woocommerce-NoticeGroup-checkout {
    font-size: small;
}
/* ==========================================================================
   Deli Snacks SEMANTIC Sidebar Cart Styles
   ========================================================================== */

/* --- Main Cart Container --- */

.deli-cart-sidebar {
    background: #faf6f1;
    border-left: 1px solid #efedea;
    border-bottom: 1px solid #efedea;
    border-radius: 0 0 0 1rem;
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
}
/* --- Cart Body (Scrollable Area) --- */

.deli-cart__body {
    flex-grow: 1;
    overflow-y: auto;
    padding: 2rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 2rem;
}
.deli-cart__closed-message {
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}
/* --- Cart Header & Delivery Toggle --- */

.deli-cart__header {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}
.deli-cart__title {
    color: #262626;
    font-size: 1.5rem;
    margin: 0;
}
.deli-cart__delivery-toggle {
    background: #ffffff;
    border-radius: 4.5rem;
    border: 1px solid #efedea;
    padding: 0.5rem;
    display: flex;
    gap: 0.5rem;
    width: 100%;
}
.toggle-option {
    flex: 1;
    border-radius: 7.5rem;
    padding: 1.0625rem 1.5rem;
    text-align: center;
    border: none;
    cursor: pointer;
    font-size: 0.875rem;
    color: #262626;
    font-weight: 600;
    background: #faf6f1;
    /* Inactive state */
}
.toggle-option.is-active {
    background: #f9b206;
    /* Active state */
}
.toggle-option:hover {
    background: #E6E6E6;
}
.toggle-option.is-active:hover {
    background: #E6A200;
}
/* --- Cart Item List --- */

.deli-cart__items {
    display: flex;
    flex-direction: column;
}
.cart-item {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}
.cart-item:first-child {
    padding-top: 0;
}
.cart-item:last-of-type {
    padding-bottom: 0;
}
.cart-item__main-info {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}
.cart-item__details {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    flex: 1;
}
.cart-item__name {
    color: #262626;
    font-size: 0.75rem;
    font-weight: 600;
    text-decoration: underline;
}
.cart-item__price {
    color: #262626;
    font-size: 0.75rem;
}
.cart-item__addons {
    display: flex;
    gap: 0.625rem;
    flex-direction: column;
}
.cart-item__addon {
    font-size: 0.625rem;
    font-weight: 500;
    line-height: 100%;
    /* 0.625rem */
}
.cart-item dl.variation {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
    font-size: 0.625rem;
    color: #262626;
}
dl.variation dt, dl.variation dd {
    margin: 0;
    padding: 0;
    line-height: 1.2;
}
dl.variation dt {
    display: none;
}
.cart-item__actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.cart-item__add-comment {
    color: #262626;
    font-size: 0.75rem;
    text-decoration: underline;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}
.cart-item__quantity {
    background: #ffffff;
    border-radius: 6.5rem;
    padding: 0.875rem 1.375rem;
    display: flex;
    align-items: center;
    gap: 1rem;
}
.quantity-button {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    font-size: 1.25rem;
    line-height: 1;
    color: #262626;
    width: 1rem;
    height: 1rem;
    display: flex;
    align-items: center;
}
.quantity-button:hover {
    opacity: 0.8;
}
.quantity-display {
    font-size: 1rem;
    font-weight: 600;
    width: 1rem;
    text-align: center;
    color: #262626;
}
/* --- Divider --- */

.deli-cart__divider {
    border: none;
    border-top: 1px solid #efedea;
    margin: 0;
    margin: 1.5rem 0;
}
.deli-cart__totals .deli-cart__divider {
    margin: 0;
}
.cart-item:last-of-type>.deli-cart__divider {
    display: none;
}
/* --- Recommendations (Cross-sells) --- */

.deli-cart__cross-sells {
    background: #ffffff;
    border-radius: 1rem;
    padding: 1.5rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}
.cross-sells__title {
    font-size: 0.875rem;
    color: #262626;
    margin: 0;
}
.cross-sells__items {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.cross-sell-item {
    background: #efedea;
    border-radius: 1rem;
    padding: 1rem;
    display: flex;
    gap: 1rem;
    align-items: flex-start;
}
.cross-sell-item__details {
    flex: 1;
    display: flex;
    justify-content: space-between;
}
.cross-sell-item__info {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}
.cross-sell-item__name, .cross-sell-item__price, .cross-sell-item__description {
    font-size: 0.625rem;
    line-height: 1.2;
    color: #262626;
    margin: 0;
}
a.cross-sell-item__add-button {
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="12" y1="5" x2="12" y2="19"></line><line x1="5" y1="12" x2="19" y2="12"></line></svg>') center no-repeat;
    background-size: 60%;
    border-radius: 50%;
    width: 2rem;
    height: 2rem;
    border: 1px solid #FFF;
    text-indent: -9999px;
}
/* --- Footer (Totals & Checkout) --- */

.deli-cart__footer {
    background: #faf6f1;
    padding: 2rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
    box-shadow: 0rem -0.75rem 1.25rem 0rem rgba(0, 0, 0, 0.05);
    z-index: 10;
    flex-shrink: 0;
    opacity: 1;
    transition: opacity .4s;
}
.sidebar-cart-sticky-container.empty-cart .deli-cart__footer {
    opacity: 0;
}
.deli-cart__totals {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}
.totals-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.totals-row.order-total {
    border-top: 1px solid #DBD9D7;
    padding-top: 1.5rem;
    font-weight: bold;
}
.totals-row__label, .totals-row__value {
    font-size: 0.75rem;
    color: #262626;
}
.totals-row--grand-total .totals-row__label, .totals-row--grand-total .totals-row__value {}
.deli-cart__checkout-action .checkout-button {
    display: block;
    background: #f9b206;
    border-radius: 7.5rem;
    padding: 1.0625rem 1.5rem;
    text-decoration: none;
    text-align: center;
    font-weight: 600
}
.checkout-button__text {
    color: #262626;
    font-size: 0.875rem;
}
.deli-cart__checkout-action .checkout-button:hover {
    background: #E6A200;
}
/* --- Empty Cart Message --- */

.deli-cart__empty-message {
    text-align: center;
    padding: 4rem 0;
}
.deli-cart__empty-message .prompt {
    font-size: 1.5rem;
    font-weight: 700;
    color: #262626;
    margin-bottom: 0.5rem;
}
.deli-cart__empty-message .empty-message {
    font-size: 1rem;
    color: #262626;
}
.icon-container {
    margin-bottom: 1rem
}
/* * By default, the shipping and subtotal values are transparent.
 * We target the subtotal by selecting the first totals row.
 */

.totals-row__value.shipping-cost-value {
    opacity: 0;
    transition: opacity 0.1s ease-in-out;
    height: 17px;
    overflow: hidden;
}
/* * When JS confirms the prices are loaded, this class is added to fade them in.
 * This rule now applies to both the subtotal and the shipping value.
 */

.totals-row__value.shipping-cost-value.is-loaded, .deli-cart-sidebar .totals-row__value.shipping-cost-value {
    opacity: 1;
}
/* ==========================================================================
   5. Responsive Styles (Mobile First)
   ========================================================================== */

@media (max-width: 1200px) {
    .product-world-container {
        padding: 0 1rem;
    }
}
@media (max-width: 1024px) {
    .inner, .homepage-layout-grid, .site-footer {
        padding-left: 1rem;
        padding-right: 1rem;
    }
    .top-bar .inner {
        flex-direction: column;
        height: auto;
        padding: 1rem 0;
        gap: 1rem;
    }
    .site-logo-container {
        position: static;
        transform: none;
        text-align: center;
        padding-bottom: 1rem;
        order: -1;
    }
    .site-logo {
        width: 8rem;
        height: 8rem;
        margin: 0 auto;
    }
    .top-bar-right {
        flex-direction: column;
        gap: 1rem;
    }
    .homepage-layout-grid {
        grid-template-columns: 1fr;
    }
    .homepage-sidebar-column {
        display: none;
    }
    .hero-image-container {
        height: 20rem;
    }
    .product-card {
        min-width: 0;
        flex-direction: column;
        align-items: flex-start;
    }
    .product-card .product-image {
        width: 100%;
        height: 12rem;
    }
    /* MODIFIED RESPONSIVE STYLES */
    .product-item-content {
        flex-direction: column;
    }
    .product-list-item .product-image {
        order: -1;
        width: 100%;
        height: 12rem;
    }
    .product-list-item .product-add-to-cart {
        align-self: flex-start;
    }
    /* END MODIFIED RESPONSIVE STYLES */
    .site-footer .inner {
        flex-direction: column;
        gap: 2rem;
        padding: 0;
    }
    .footer-links ul {
        flex-direction: column;
        align-items: center;
        gap: 1.5rem;
    }
}
@media (min-width: 1180px) {
    .deli-checkout-sidebar {
        position: sticky;
        top: 2rem;
    }
    body:not(.woocommerce-page) article.page.type-page {
        width: 100%;
        max-width: 64rem;
        margin: 0 auto;
        padding: 5rem 1.5rem;
        padding-bottom: 2.5rem;
        padding-top: 10rem;
    }
}
@media (min-width: 1280px) {
    .footer-navigation .footer-menu-list {
        gap: 1rem 2.8125rem;
    }
    .product-world-container {
        padding: 0 1rem;
    }
}
@media (min-width: 1600px) {
    .footer-main-content {
        padding: 3rem 4rem;
    }
    .product-world-container {
        padding: 0 7rem;
    }
    .site-footer {
        padding: 2.5rem 7rem;
    }
}
/* ==========================================================================
   7. Dynamic Modal Styles
   ========================================================================== */

/* --- Modal Container & Overlay --- */

.deli-modal-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.3s ease, visibility 0s 0.3s;
}
.deli-modal-container.is-visible {
    visibility: visible;
    opacity: 1;
    transition: opacity 0.3s ease;
}
.deli-modal-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    cursor: pointer;
}
/* --- Body Lock --- */

body.deli-modal-open {
    overflow: hidden;
}
/* --- Modal Dialog Box --- */

.deli-modal-dialog {
    background: #FAF6F1;
    border-radius: 1rem;
    border: 1px solid #dbd9d7;
    width: 90%;
    max-width: 28rem;
    /* Approx 448px */
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    position: relative;
    z-index: 1;
    transform: scale(0.95);
    transition: transform 0.3s ease;
}
.deli-modal-container.is-visible .deli-modal-dialog {
    transform: scale(1);
}
/* --- Modal Header --- */

.deli-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem;
    border-bottom: 1px solid #efedea;
    flex-shrink: 0;
}
.deli-product-modal .deli-modal-header {
    position: absolute;
    padding: 0;
    width: 100%;
    border: 0;
    justify-content: flex-end;
    right: 3rem;
    top: 3rem;
}
.deli-product-modal .deli-modal-content-wrapper {
    padding-top: 1.5rem;
}
.deli-product-modal .deli-modal-header .deli-modal-title {
    display: none;
}
.deli-modal-title {
    font-size: 1.25rem;
    font-weight: 700;
    margin: 0;
}
.deli-modal-close:hover {
    opacity: 0.8;
}
.deli-modal-close {
    background-color: transparent;
    border: none;
    width: 2.5rem;
    /* 40px */
    height: 2.5rem;
    /* 40px */
    font-size: 0;
    /* Hide text character */
    cursor: pointer;
    padding: 0;
    background-image: url('data:image/svg+xml,%3Csvg width="40" height="41" viewBox="0 0 40 41" fill="none" xmlns="http://www.w3.org/2000/svg"%3E%3Crect x="0.5" y="0.78418" width="39" height="39" rx="19.5" fill="white"/%3E%3Crect x="0.5" y="0.78418" width="39" height="39" rx="19.5" stroke="%23DBD9D7"/%3E%3Cpath d="M25.3033 14.9808L14.6967 25.5874M14.6967 14.9808L25.3033 25.5874" stroke="%23F9B206" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/%3E%3C/svg%3E');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    transition: transform 0.2s ease;
}
body .deli-cart__close-btn {
    background-color: transparent;
    border: none;
    width: 2.5rem;
    /* 40px */
    height: 2.5rem;
    /* 40px */
    font-size: 0;
    /* Hide text character */
    cursor: pointer;
    padding: 0;
    background-image: url('data:image/svg+xml,%3Csvg width="40" height="41" viewBox="0 0 40 41" fill="none" xmlns="http://www.w3.org/2000/svg"%3E%3Crect x="0.5" y="0.78418" width="39" height="39" rx="19.5" fill="white"/%3E%3Crect x="0.5" y="0.78418" width="39" height="39" rx="19.5" stroke="%23DBD9D7"/%3E%3Cpath d="M25.3033 14.9808L14.6967 25.5874M14.6967 14.9808L25.3033 25.5874" stroke="%23F9B206" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/%3E%3C/svg%3E');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    transition: transform 0.2s ease;
}
/* --- Modal Content --- */

.deli-modal-content-wrapper {
    overflow-y: auto;
    padding: 0.5rem 1.5rem 1.5rem 1.5rem;
}
/* Styling for the category list inside the modal */

.deli-modal-content .category-list {
    list-style: none;
    padding: 0;
    margin: 0;
    flex-direction: column;
}
.deli-modal-content .category-item {
    border-bottom: 1px solid #efedea;
}
.deli-modal-content .category-item:last-child {
    border-bottom: none;
}
.deli-modal-content .category-item a {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 0.5rem;
    text-decoration: none;
    border-radius: 0.5rem;
    transition: background-color 0.2s ease;
    color: #262626;
    font-size: 0.875rem;
    line-height: 150%;
    white-space: wrap;
    background-color: #fff;
    border-color: #dbd9d7;
}
.deli-modal-content .category-item a:hover {
    background-color: #f5f3f1;
}
/* Add a placeholder for an image, similar to Figma */

.deli-modal-content .category-item a::before {
    content: '';
    display: block;
    width: 3.5rem;
    height: 3.5rem;
    background-color: #d9d9d9;
    border-radius: 0.75rem;
    flex-shrink: 0;
    /* In a real scenario, you would fetch and display the category thumbnail here */
}
/* ==========================================================================
   8. Product Detail Modal Styles
   ========================================================================== */

/* --- Loading State --- */

.deli-modal-content.loading {
    display: block;
    align-items: center;
    justify-content: center;
    min-height: 200px;
}
.modal-spinner {
    border: 4px solid rgba(0, 0, 0, 0.1);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 2.5rem;
    border-left-color: #F9B206;
    animation: spin 1s ease infinite;
}
@keyframes spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
/* --- Main Modal Content Layout --- */

.deli-product-modal-content {
    display: flex;
    flex-direction: column;
}
.deli-product-modal-image {
    width: 100%;
    height: 22rem;
    height: 12rem;
    background-color: #d9d9d9;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 1rem;
    margin-bottom: 1.5rem;
}
.deli-product-modal-details {
    padding: 0 0;
    display: flex;
    flex-direction: column;
}
.product-info .product-title {
    font-size: 1.125rem;
    font-weight: 600;
    margin: 0 0 0.75rem 0;
}
.product-info .product-price {
    font-size: 0.75rem;
    font-weight: 600;
    margin-bottom: 1.5rem;
}
.product-info .product-description {
    font-size: 0.75rem;
    line-height: 150%;
    color: #262626;
}
.deli-product-modal-details .product-info .product-price, .deli-product-modal-details .product-info .product-price+.product-description {
    margin-bottom: 1rem;
}
/* --- Addons Section --- */

.deli-product-modal-addons {
    background: #ffffff;
    border-radius: 1rem;
    padding: 1.5rem 1rem;
}
.addons-header {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 1.5rem;
}
.addons-title {
    font-size: 0.875rem;
    font-weight: 600;
}
.addons-optional {
    font-size: 0.75rem;
}
.addons-list {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.addon-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
}
.addon-checkbox-wrapper {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}
.addon-item input[type="checkbox"] {
    display: none;
    /* Hide the default checkbox */
}
.addon-item .custom-checkbox {
    display: inline-block;
    width: 1.25rem;
    height: 1.25rem;
    border: 1px solid #dbd9d7;
    border-radius: 0.25rem;
    background-color: #fff;
    transition: all 0.2s ease;
}
.addon-item input[type="checkbox"]:checked+.custom-checkbox {
    background-color: #F9B206;
    border-color: #F9B206;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="white"><path d="M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z"/></svg>');
    background-size: 80%;
    background-repeat: no-repeat;
    background-position: center;
}
.addon-name, .addon-price {
    font-size: 0.625rem;
    line-height: 100%;
    font-weight: 500;
}
.addon-price {
    font-weight: 600
}
/* --- Modal Footer --- */

.deli-product-modal-footer {
    background: #faf6f1;
    border-radius: 0 0 1rem 1rem;
    padding: 1rem;
    margin: 1.5rem -1.5rem -1.5rem -1.5rem;
    /* Extend to edges */
    display: flex;
    gap: 1rem;
    align-items: center;
    box-shadow: 0 -4px 28px rgba(0, 0, 0, 0.08);
}
.quantity-selector {
    background: #ffffff;
    border-radius: 6.5rem;
    padding: 0.875rem 1.375rem;
    display: flex;
    align-items: center;
    gap: 1rem;
}
.quantity-selector .quantity-button {
    background: none;
    border: none;
    font-size: 1.5rem;
    cursor: pointer;
    color: #262626;
    padding: 0;
    width: 1rem;
    height: 1rem;
    line-height: 1;
}
.quantity-selector .quantity-button:hover {
    opacity: 0.8;
}
.quantity-selector .quantity-input {
    border: none;
    text-align: center;
    font-size: 1rem;
    font-weight: 600;
    width: 2rem;
    background: transparent;
    -moz-appearance: textfield;
}
.deli-product-modal-footer .quantity-button svg {
    pointer-events: none;
}
.deli-product-modal-footer .quantity-selector .quantity-input {
    width: 1rem;
}
.quantity-selector .quantity-input::-webkit-outer-spin-button, .quantity-selector .quantity-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.deli-modal-add-to-cart-button {
    flex-grow: 1;
    background-color: #f9b206;
    border-radius: 7.5rem;
    padding: 1.0625rem 1.5rem;
    border: none;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.5rem;
    color: #262626;
    font-size: 0.875rem;
    font-weight: 600;
}
.deli-modal-add-to-cart-button:hover {
    background-color: #E6A200;
}
.deli-modal-add-to-cart-button.loading {
    opacity: 0.7;
    cursor: wait;
}
@media (min-width: 1025px) {
    .product-filters-section {
        position: sticky;
        top: 0;
        background: #faf6f1;
        z-index: 2;
    }
    .scrolled-past-header .product-filters-section {
        border-bottom: 1px solid #efedea;
    }
    .scrolled-past-header .product-filters-section:before {
        position: absolute;
        width: 1.5rem;
        left: -1.5rem;
        top: 0;
        height: 100%;
        background-color: #faf6f1;
        pointer-events: none;
        content: "";
    }
    .scrolled-past-header .product-filters-section:after {
        position: absolute;
        width: 1.5rem;
        right: -1.5rem;
        top: 0;
        height: 100%;
        background-color: #faf6f1;
        pointer-events: none;
        content: "";
    }
    .footer-logo {
        margin-right: 2.5rem
    }
    .products-carousel-wrapper {
        padding: 1rem;
        transform: translatex(-1rem);
    }
    .product-carousel-section .section-header {
        margin-bottom: 1rem;
    }
    html {
        scroll-padding-top: 17.375rem;
    }
}
/* ==========================================================================
   9. WooCommerce - Order Received (Thank You) Page Styles
   ========================================================================== */

/* --- General Layout & Container --- */

body.woocommerce-order-received .entry-header {
    display: none;
    /* Hide the default "Bestelling ontvangen" title */
}
body.woocommerce-order-received .entry-content {
    max-width: 56rem;
    /* 896px, centers the content nicely */
    margin: 0 auto;
    padding: 2.5rem 1rem;
}
/* --- Thank You Message & Order Overview --- */

body.woocommerce-order-received .woocommerce-order {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}
/* Style the main "Thank You" notice as a header box */

body.woocommerce-order-received .woocommerce-notice--success {
    background-color: #ffffff;
    border-top: none;
    border-radius: 1.5rem;
    padding: 2rem 1.5rem;
    border: 1px solid #dbd9d7;
    color: #262626;
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.4;
    text-align: center;
    margin: 0 !important;
}
body.woocommerce-order-received .woocommerce-notice--success::before {
    display: none;
    /* Hide the default checkmark icon */
}
body.woocommerce-order-received .woocommerce-info::before {
    display: none;
}
body.woocommerce-order-received .woocommerce-order-details>p:first-child {
    margin-top: 0;
}
body.woocommerce-order-received .woocommerce-info {
    text-align: center;
}
body.woocommerce-order-received .top-bar .inner {
    opacity: 0;
}
/* --- Order Overview List (Order #, Date, Total) --- */

body.woocommerce-order-received .woocommerce-order-overview {
    list-style: none;
    margin: 0;
    padding: 1.5rem;
    background-color: #ffffff;
    border: 1px solid #dbd9d7;
    border-radius: 1.5rem;
    display: flex;
    justify-content: space-between;
    text-align: center;
    gap: 1rem;
}
body.woocommerce-order-received .woocommerce-order-overview li {
    padding: 0;
    margin: 0;
    border: none;
    color: #262626;
    font-size: 0.875rem;
    line-height: 1.5;
}
body.woocommerce-order-received .woocommerce-order-overview li strong {
    font-weight: 600;
    display: block;
    font-size: 0.875rem;
    margin-top: 0.25rem;
}
body.woocommerce-order-received .woocommerce-order-overview:before, body.woocommerce-order-received .woocommerce-order-overview:after {
    display: none;
}
/* --- Order Details & Customer Details Sections --- */

body.woocommerce-order-received .woocommerce-order-details, body.woocommerce-order-received .woocommerce-customer-details {
    background: #ffffff;
    border-radius: 1.5rem;
    border: 1px solid #dbd9d7;
    padding: 2rem 1.5rem;
    margin-bottom: 0;
}
body.woocommerce-order-received .woocommerce-order-details__title, body.woocommerce-order-received .woocommerce-column__title {
    color: #262626;
    font-size: 1.25rem;
    font-weight: 700;
    margin: 0 0 1.5rem 0;
    border-bottom: 0;
}
/* --- Order Details Table Styling --- */

body.woocommerce-order-received .shop_table {
    width: 100%;
    border-collapse: collapse;
    background: none;
    border: none;
    font-size: 0.875rem;
}
body.woocommerce-order-received .shop_table thead {
    display: none;
    /* Hide the "Product" and "Total" headers */
}
body.woocommerce-order-received .shop_table tbody, body.woocommerce-order-received .shop_table tfoot {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
body.woocommerce-order-received .shop_table tr {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: none;
    padding: 0;
}
body.woocommerce-order-received .shop_table td, body.woocommerce-order-received .shop_table th {
    padding: 0;
    border: none;
    text-align: left;
    background: none;
}
/* Product row */

body.woocommerce-order-received .shop_table .order_item td {
    font-size: 0.875rem;
}
body.woocommerce-order-received .shop_table .order_item .product-name a {
    font-weight: 600;
    color: #262626;
    text-decoration: none;
}
body.woocommerce-order-received .shop_table .order_item .product-quantity {
    color: #6b787c;
}
/* Totals rows (Subtotal, Shipping, etc.) */

body.woocommerce-order-received .shop_table tfoot th {
    font-weight: 400;
    color: #262626;
    border: 0;
}
body.woocommerce-order-received .shop_table tfoot td {
    font-weight: 600;
    color: #262626;
    border: 0;
}
body.woocommerce-order-received .woocommerce-table__line-item.order_item {}
body.woocommerce-order-received .shop_table tfoot {
    padding-top: 1.5rem;
    margin-top: 1.5rem;
    border-top: 1px solid #dbd9d7;
}
body.woocommerce-order-received .shop_table .order-total th, body.woocommerce-order-received .shop_table .order-total td .woocommerce-Price-amount {
    font-size: 1.125rem;
    font-weight: 700;
}
body.woocommerce-order-received .shop_table small.includes_tax {
    display: none;
}
/* --- Customer Details / Address --- */

body.woocommerce-order-received .woocommerce-customer-details address {
    font-style: normal;
    font-size: 0.875rem;
    line-height: 1.6;
    border: none;
    padding: 0;
}
body.woocommerce-order-received .woocommerce-customer-details .woocommerce-customer-details--email {
    margin-top: 1rem;
    font-weight: 600;
}
.mobile-break {
    display: none;
}
/* ==========================================================================
   10. Custom CTA Button
   ========================================================================== */

.cta-btn {
    display: inline-block;
    background-color: #f9b206;
    border-radius: 7.5rem;
    padding: 1.0625rem 1.5rem;
    color: #262626;
    font-family: 'Termina', sans-serif;
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.5;
    text-align: center;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: background-color 0.3s ease;
}
.cta-btn:hover {
    background-color: #E6A200;
    color: #262626;
}
/* --- Responsive Adjustments --- */

@media (min-width: 1024px) {
    body.woocommerce-order-received .entry-content {
        padding-top: 7.5rem;
    }
}