/*
Theme Name: Muse Atelier Custom
Author: NovusStudio
Author URI: https://www.novusstudio.gr
Description: Custom theme
Version: 1.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: muse-atelier-custom
*/

@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap');

/* ======================================
   00. CSS VARIABLES
====================================== */

:root {
    --clr-primary: #262626;
    --clr-secondary: #6f5d4f;
    --clr-accent: #7d8f78;
    --clr-bg: #ffffff;
    --clr-bg-alt: #f7f5f2;
    --clr-border: #e5e1da;
    --clr-success: #7d8f78;
    --clr-error: #b3413a;

    --ff-logo: "Bebas Neue", sans-serif;
    --ff-heading: "Poppins", serif;
    --ff-body: "Poppins", sans-serif;

    --fs-xs: 0.75rem;
    --fs-sm: 0.875rem;
    --fs-md: 1rem;
    --fs-lg: 1.125rem;
    --fs-xl: 1.5rem;
    --fs-2xl: 2rem;
    --fs-3xl: 2.5rem;
    --fs-4xl: 3.5rem;

    --fw-r: 400;
    --fw-m: 500;
    --fw-sb: 600;
    --fw-b: 700;

    --lh-tight: 1.2;
    --lh-normal: 1.6;
    --lh-relaxed: 1.8;

    --ls-tight: -0.02em;
    --ls-normal: 0;
    --ls-wide: 0.05em;

    --container-width: 1440px;
    --spacing-xs: 8px;
    --spacing-sm: 16px;
    --spacing-md: 24px;
    --spacing-lg: 48px;
    --spacing-xl: 80px;

    --border-r-sm: 4px;
    --border-r-md: 8px;

    --transition: 0.3s ease-in-out;
}

/* ======================================
   01. RESET & GENERAL
====================================== */

*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--ff-body) !important;
    color: var(--clr-primary);
    background-color: var(--clr-bg);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

a {
    color: inherit;
    text-decoration: none;
    transition: color var(--transition);
}

ul,
ol {
    list-style: none;
    margin-bottom: var(--spacing-sm);
}

button,
input,
select,
textarea {
    font-family: inherit;
    font-size: inherit;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--ff-heading);
    line-height: var(--lh-tight);
    font-weight: var(--fw-m);
}

h1 {
    font-size: var(--fs-3xl);
    font-weight: var(--fw-b);
}

h2 {
    font-size: var(--fs-2xl);
}

h3 {
    font-size: var(--fs-xl);
}

h4 {
    font-size: var(--fs-lg);
    margin-bottom: var(--spacing-sm);
}

h5,
h6 {
    font-size: var(--fs-md);
}

p,
li,
blockquote,
label,
input,
textarea,
select {
    font-family: var(--ff-body);
    font-size: var(--fs-sm);
    font-weight: 300;
    line-height: var(--lh-normal);
}

small {
    font-size: var(--fs-sm);
}

.page-content p,
.entry-content p {
    margin-bottom: var(--spacing-md);
}

/* ======================================
   02. LAYOUT / CONTAINER
====================================== */

.container {
    width: 100%;
    max-width: var(--container-width);
    margin-inline: auto;
    padding-inline: var(--spacing-md);
}

.site {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.site-content {
    flex: 1;
}

.site-main {
    padding-block: var(--spacing-lg);
}

.home .site-main,
.single-product .site-main {
    padding-top: 0;
}

/* ======================================
   03. HEADER & NAVIGATION
====================================== */

.top-bar {
    background-color: var(--clr-primary);
    color: #ffffff;
    text-align: center;
    padding: var(--spacing-xs) var(--spacing-md);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-sm);
    font-size: var(--fs-sm);
    flex-wrap: wrap;
}

.top-bar__code {
    background-color: transparent;
    border: 1px dashed rgba(255, 255, 255, 0.6);
    color: #ffffff;
    padding: 2px 10px;
    border-radius: var(--border-r-sm);
    cursor: pointer;
    font-weight: var(--fw-sb);
    letter-spacing: var(--ls-wide);
    transition: background-color var(--transition);
}

.top-bar__code:hover {
    background-color: rgba(255, 255, 255, 0.15);
}

.top-bar__code.copied::after {
    content: "\2713";
}

.site-header {
    border-bottom: 1px solid var(--clr-border);
    position: sticky;
    top: 0;
    background-color: var(--clr-bg);
    z-index: 100;
}

.site-header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-block: var(--spacing-md);
}

.site-logo img {
    max-height: 60px;
    width: auto;
    height: auto;
    max-width: 200px;
}

.site-title {
    font-family: var(--ff-logo);
    font-size: var(--fs-2xl);
    font-weight: var(--fw-b);
    color: var(--clr-primary);
    text-transform: uppercase;
    letter-spacing: var(--ls-wide);
    line-height: 1;
}

.site-title:hover {
    color: var(--clr-secondary);
}

.main-navigation {
    display: flex;
}

.main-navigation ul.menu {
    display: flex;
    gap: var(--spacing-md);
    margin-bottom: 0;
}

.main-navigation .menu-item a {
    font-weight: var(--fw-r);
    padding: var(--spacing-sm) 0;
    text-transform: uppercase;
    letter-spacing: var(--ls-wide);
    font-size: var(--fs-sm);
}

.menu-toggle {
    display: none;
    background-color: transparent;
    border: none;
    cursor: pointer;
}

@media (max-width: 768px) {
    .main-navigation {
        display: none;
    }

    .menu-toggle {
        display: block;
    }

    .main-navigation.is-open {
        display: flex;
        flex-direction: column;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background-color: var(--clr-bg);
        padding: var(--spacing-md);
        border-top: 1px solid var(--clr-border);
    }
}

/* --- Header actions (account, cart, search) --- */

.header-actions {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: var(--spacing-sm);
}

.header-account-icon {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.header-cart-icon {
    background-color: transparent;
    border: none;
    padding: 0;
    cursor: pointer;
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    appearance: none;
    -webkit-appearance: none;
    font: inherit;
}

.header-actions img {
    width: 26px;
    height: 26px;
    max-width: none;
}

.cart-count {
    position: absolute;
    top: -6px;
    right: -8px;
    background-color: var(--clr-accent);
    color: #ffffff;
    font-size: var(--fs-xs);
    font-weight: var(--fw-sb);
    line-height: 1;
    border-radius: 50%;
    min-width: 16px;
    height: 16px;
    padding: 0 3px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.header-search-icon {
    background-color: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    appearance: none;
    -webkit-appearance: none;
}

/* --- Header search overlay --- */

.header-search-form {
    position: fixed;
    inset: 0;
    background-color: var(--clr-bg-alt);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 999;
    padding: var(--spacing-md);
}

.header-search-form[hidden] {
    display: none;
}

.header-search-form .search-form {
    display: flex;
    align-items: center;
    flex: 1;
    width: 100%;
    max-width: 600px;
    gap: var(--spacing-xs);
}

.header-search-form .search-form label {
    flex: 1;
    display: flex;
    align-items: center;
}

.header-search-form input[type="search"] {
    flex: 1;
    width: 100%;
    padding: var(--spacing-sm) var(--spacing-md);
    font-size: var(--fs-xl);
    border: none;
    border-bottom: 2px solid var(--clr-primary);
    background-color: transparent;
    outline: none;
}

.header-search-close {
    position: absolute;
    top: var(--spacing-md);
    right: var(--spacing-md);
    background-color: transparent;
    background-image: none;
    border: none;
    outline: none;
    box-shadow: none;
    cursor: pointer;
    font-size: var(--fs-2xl);
    line-height: 1;
    color: var(--clr-primary);
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    padding: var(--spacing-xs);
    margin: 0;
}

.header-search-form .search-form button,
.header-search-form .search-form input[type="submit"] {
    align-self: center;
    background-color: var(--clr-primary);
    color: #ffffff;
    border: none;
    padding: var(--spacing-sm) var(--spacing-md);
    cursor: pointer;
    font-family: var(--ff-body);
    font-size: var(--fs-md);
    border-radius: 0;
    appearance: none;
    -webkit-appearance: none;
    transition: background-color var(--transition);
}

.header-search-form .search-form button:hover,
.header-search-form .search-form input[type="submit"]:hover {
    background-color: var(--clr-secondary);
}

/* ======================================
   04. FOOTER
====================================== */

.site-footer {
    background-color: var(--clr-primary);
    color: #ffffff;
    padding-block: var(--spacing-lg);
}

.site-footer__columns {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--spacing-md);
}

.footer-logo {
    font-family: var(--ff-logo);
    font-size: var(--fs-xl);
    font-weight: var(--fw-b);
    color: #ffffff;
    text-transform: uppercase;
    letter-spacing: var(--ls-wide);
    line-height: 1;
    margin-bottom: var(--spacing-sm);
}

.footer-logo-img {
    max-height: 40px;
    margin-bottom: var(--spacing-sm);
}

.footer-logo-img img {
    max-height: 40px;
    width: auto;
    height: auto;
    max-width: 200px;
    filter: brightness(0) invert(1);
}

.footer-tagline {
    font-size: var(--fs-xs);
    color: rgba(255, 255, 255, 0.7);
    line-height: var(--lh-normal);
}

.footer-social {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    margin-top: var(--spacing-md);
}

.footer-social a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    opacity: 0.8;
    transition: opacity var(--transition);
}

.footer-social a:hover {
    opacity: 1;
}

.footer-social img {
    width: 20px;
    height: 20px;
    max-width: none;
    filter: brightness(0) invert(1);
}

.footer-col .widget-title {
    font-family: var(--ff-heading);
    font-size: var(--fs-md);
    font-weight: var(--fw-sb);
    text-transform: uppercase;
    letter-spacing: var(--ls-wide);
    margin-bottom: var(--spacing-sm);
}

.footer-col .menu {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
}

.footer-col .menu a,
.footer-col a {
    font-size: var(--fs-sm);
    color: rgba(255, 255, 255, 0.7);
    transition: color var(--transition);
}

.footer-col .menu a:hover,
.footer-col a:hover {
    color: #ffffff;
}

.footer-col p {
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: var(--spacing-xs);
    font-size: var(--fs-sm);
    transition: color var(--transition);
}

.footer-col p:hover {
    color: #ffffff;
}

.site-footer__bottom {
    margin-top: var(--spacing-lg);
    padding-top: var(--spacing-sm);
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--spacing-sm);
}

.footer-bottom-menu {
    display: flex;
    gap: var(--spacing-md);
}

.footer-bottom-menu li:not(:last-child)::after {
    content: "\007C";
    margin-left: var(--spacing-md);
    color: rgba(255, 255, 255, 0.3);
}

.footer-bottom-menu a {
    font-size: var(--fs-xs);
    color: rgba(255, 255, 255, 0.7);
    transition: color var(--transition);
}

.footer-bottom-menu a:hover {
    color: #ffffff;
}

.site-footer__copyright,
.site-footer__credit {
    font-size: var(--fs-xs);
    color: rgba(255, 255, 255, 0.7);
}

.site-footer__credit a {
    color: rgba(255, 255, 255, 0.9);
    text-decoration: underline;
}

.site-footer__credit a:hover {
    color: #ffffff;
}

.site-footer__heart {
    color: var(--clr-accent);
}

.footer-col__toggle {
    display: none;
}

@media (max-width: 768px) {
    .site-footer__columns {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .footer-col--collapsible {
        border-bottom: 1px solid rgba(255, 255, 255, 0.15);
        position: relative;
    }

    .footer-col--collapsible .widget-title {
        display: none;
    }

    .footer-col__toggle-title {
        font-family: var(--ff-heading);
        text-transform: uppercase;
        letter-spacing: var(--ls-wide);
    }

    .footer-col__toggle {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        background: none;
        border: none;
        color: #ffffff;
        font-family: var(--ff-heading);
        font-size: var(--fs-md);
        text-transform: uppercase;
        letter-spacing: var(--ls-wide);
        padding: var(--spacing-sm) 0;
        cursor: pointer;
    }

    .footer-col__toggle-icon {
        font-size: var(--fs-lg);
        transition: transform var(--transition);
    }

    .footer-col--collapsible.is-open .footer-col__toggle-icon {
        transform: rotate(45deg);
    }

    .footer-col--collapsible .footer-col__content {
        display: none;
        padding-bottom: var(--spacing-md);
    }

    .footer-col--collapsible.is-open .footer-col__content {
        display: block;
    }
}

/* ======================================
   05. QUANTITY STEPPER (shared component)
====================================== */

.quantity-stepper {
    display: flex;
    align-items: center;
    border: 1px solid var(--clr-primary);
    overflow: hidden;
    width: fit-content;
}

.quantity-stepper__btn {
    background-color: var(--clr-bg);
    border: none;
    width: 36px;
    height: 40px;
    font-size: var(--fs-md);
    color: var(--clr-primary);
    cursor: pointer;
}

.quantity-stepper .qty {
    background-color: var(--clr-bg);
    color: var(--clr-primary);
    width: 50px;
    height: 40px;
    border: none;
    text-align: center;
    font-family: var(--ff-body);
    font-size: var(--fs-sm);
    -moz-appearance: textfield;
}

.quantity-stepper .qty::-webkit-outer-spin-button,
.quantity-stepper .qty::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* ======================================
   06. SINGLE PRODUCT PAGE
====================================== */

.custom-product {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-xl);
    padding-block: var(--spacing-xl);
    align-items: start;
}

/* --- Gallery --- */

.custom-product-gallery {
    display: flex;
    flex-direction: row-reverse;
    gap: var(--spacing-sm);
}

.custom-product-gallery__main {
    flex: 1;
    height: 600px;
}

.custom-product-gallery__main img.custom-product-gallery__main-image {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.custom-product-gallery__thumbs {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
    width: 80px;
}

.custom-product-gallery__thumbs img.attachment-thumbnail {
    width: 100%;
    height: 90px;
    padding: 0;
    border: 1px solid transparent;
    background: none;
    cursor: pointer;
    overflow: hidden;
    transition: border-color var(--transition);
}

.custom-product-gallery__thumb img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.custom-product-gallery__thumb.is-active,
.custom-product-gallery__thumb:hover {
    border-color: var(--clr-accent);
}

@media (max-width: 768px) {
    .custom-product {
        grid-template-columns: 1fr;
        gap: var(--spacing-lg);
    }

    .custom-product-gallery {
        flex-direction: column;
    }

    .custom-product-gallery__thumbs {
        flex-direction: row;
        width: auto;
    }

    .custom-product-gallery__thumb {
        width: 70px;
        flex-shrink: 0;
    }
}

/* --- Info block --- */

.custom-product__title {
    font-family: var(--ff-heading);
    font-size: var(--fs-2xl);
    font-weight: var(--fw-m);
    color: var(--clr-primary);
}

.custom-product__subtitle {
    font-family: var(--ff-body);
    font-size: var(--fs-md);
    color: var(--clr-secondary);
    margin-top: var(--spacing-xs);
}

.custom-product__sku {
    font-size: var(--fs-xs);
    color: var(--clr-primary);
    margin-top: var(--spacing-xs);
}

.custom-product__price {
    margin-top: var(--spacing-sm);
}

.custom-product__price .price {
    font-family: var(--ff-heading);
    font-size: var(--fs-xl);
    font-weight: var(--fw-b);
    color: var(--clr-primary);
}

.custom-product__price .price del {
    color: var(--clr-secondary);
    opacity: 0.6;
    margin-right: var(--spacing-xs);
    font-weight: var(--fw-r);
}

.custom-product__price .price ins {
    color: var(--clr-accent);
    text-decoration: none;
}

.custom-product__vat-note {
    font-size: var(--fs-xs);
    color: var(--clr-secondary);
    margin-top: var(--spacing-xs);
}

.custom-product__short-description {
    margin-top: var(--spacing-md);
    font-size: var(--fs-md);
    color: var(--clr-primary);
    line-height: var(--lh-normal);
}

.custom-product__short-secription p {
    margin-bottom: var(--spacing-sm);
}

.custom-product__add-to-cart {
    margin-top: var(--spacing-md);
}

.woo-selected-variation-item-name {
    display: none;
}

/* --- Variations table --- */

table.variations th.label {
    display: block;
    text-align: left;
    padding-bottom: var(--spacing-xs);
    font-family: var(--ff-body);
    font-size: var(--fs-xs);
    font-weight: var(--fw-m);
    color: var(--clr-primary);
    border: none;
}

.woocommerce table.variations th.label label,
table.variations th.label label {
    font-size: var(--fs-xs) !important;
}

table.variations td.value {
    display: block;
    padding: 0;
    border: none;
}

table.variations,
table.variations tbody,
table.variations tr {
    display: block;
    width: 100%;
}

table.variations tr:not(:last-child) {
    margin-bottom: var(--spacing-md);
}

.variable-items-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-xs);
}

.variable-items-wrapper:has(.button-variable-item:only-child) .button-variable-item {
    cursor: default;
}

.button-variable-items-wrapper .button-variable-item {
    border: 1px solid var(--clr-primary);
    border-radius: 0;
    padding: var(--spacing-xs) var(--spacing-sm);
    font-family: var(--ff-body);
    font-size: var(--fs-sm);
    color: var(--clr-primary);
    background-color: transparent;
    cursor: pointer;
    transition: all var(--transition);
}

.button-variable-items-wrapper .button-variable-item:hover {
    border-color: var(--clr-accent);
}

.button-variable-items-wrapper .button-variable-item.selected {
    background-color: var(--clr-primary);
    border-color: var(--clr-primary);
    color: #ffffff;
}

.button-variable-item.disabled {
    opacity: 0.4 !important;
    cursor: not-allowed !important;
    pointer-events: none !important;
    position: relative !important;
}

.button-variable-item.disabled::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 2px;
    right: 2px;
    height: 1px;
    background-color: var(--clr-primary);
    transform: rotate(-35deg);
}

.button-variable-item.disabled:hover {
    border-color: var(--clr-primary) !important;
}

.single_variation .woocommerce-variation-price {
    display: none;
}

.reset_variations {
    display: none !important;
}

.stock {
    display: block;
    margin-top: var(--spacing-sm);
    font-size: var(--fs-xs);
    color: var(--clr-secondary);
}

.woocommerce-variation-add-to-cart {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    flex-wrap: wrap;
    margin-top: var(--spacing-md);
}

.woocommerce-variation-add-to-cart .quantity {
    margin: 0;
}

.single_add_to_cart_button {
    background-color: var(--clr-primary) !important;
    color: #ffffff !important;
    border: none !important;
    padding: var(--spacing-sm) var(--spacing-lg) !important;
    text-transform: uppercase !important;
    letter-spacing: var(--ls-wide) !important;
    font-family: var(--ff-body) !important;
    font-weight: var(--fw-sb) !important;
    font-size: var(--fs-sm) !important;
    border-radius: 0 !important;
    cursor: pointer !important;
    transition: background-color var(--transition) !important;
    flex: 1 !important;
    text-align: center !important;
}

.single_add_to_cart_button:hover {
    background-color: var(--clr-secondary) !important;
}

.single_add_to_cart_button.disabled {
    opacity: 0.5 !important;
    cursor: not-allowed !important;
}

/* --- Color swatches --- */

.color-variable-items-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-xs);
}

.color-variable-item {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 2px solid transparent;
    cursor: pointer;
    overflow: hidden;
}

.color-variable-item .variable-item-contents,
.color-variable-item .variable-item-span-color {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

.color-variable-item.selected,
.color-variable-item:hover {
    border-color: var(--clr-accent);
}

.color-siblings {
    margin-top: var(--spacing-md);
    margin-bottom: var(--spacing-md);
}

.color-siblings__label {
    display: block;
    font-size: var(--fs-xs);
    color: var(--clr-secondary);
    margin-bottom: var(--spacing-xs);
}

.color-siblings__swatches {
    display: flex;
    gap: var(--spacing-xs);
}

.color-siblings__swatch {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 1px solid var(--clr-border);
    cursor: pointer;
    display: inline-block;
}

.color-siblings__swatch--active {
    border: 2px solid var(--clr-accent);
    cursor: default;
}

.color-siblings__swatch:not(.color-siblings__swatch--active):hover {
    border-color: var(--clr-accent);
}

/* --- Product tabs (accordion) --- */

.custom-product-tabs {
    margin-top: var(--spacing-lg);
    padding-bottom: var(--spacing-md);
    border-top: 1px solid var(--clr-border);
}

.custom-product-tabs .woocommerce-tabs ul.tabs {
    display: none;
}

.custom-product-tabs .woocommerce-tabs .panel {
    display: none !important;
    padding: var(--spacing-sm) 0;
    font-size: var(--fs-sm);
    color: var(--clr-primary);
    line-height: var(--lh-normal);
}

.custom-product-tabs .woocommerce-tabs .panel h2 {
    display: none;
}

.product-accordion-item {
    border-bottom: 1px solid var(--clr-border);
}

.product-accordion-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    background: none;
    border: none;
    padding: var(--spacing-sm) 0;
    cursor: pointer;
    font-family: var(--ff-heading);
    font-size: var(--fs-sm);
    text-transform: uppercase;
    letter-spacing: var(--ls-wide);
    color: var(--clr-primary);
    text-align: left;
}

.product-accordion-icon {
    font-size: var(--fs-md);
    transition: transform var(--transition);
}

.product-accordion-item.is-open .product-accordion-icon {
    transform: rotate(45deg);
}

.custom-product-tabs .woocommerce-tabs .product-accordion-item.is-open .panel {
    display: block !important;
}

/* --- Size guide & care guide content --- */

.size-guide-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: var(--spacing-sm);
}

.size-guide-table th,
.size-guide-table td {
    padding: var(--spacing-xs) var(--spacing-sm);
    text-align: left;
    border-bottom: 1px solid var(--clr-border);
    font-size: var(--fs-sm);
}

.size-guide-table th {
    font-family: var(--ff-heading);
    font-weight: var(--fw-sb);
    color: var(--clr-primary);
}

.size-guide-note {
    margin-top: var(--spacing-sm);
    font-size: var(--fs-xs);
    color: var(--clr-secondary);
}

.care-guide-list {
    margin-top: var(--spacing-sm);
    padding-left: var(--spacing-md);
}

.care-guide-list li {
    list-style: disc;
    margin-bottom: var(--spacing-xs);
    font-size: var(--fs-sm);
    color: var(--clr-primary);
}

/* --- Reviews --- */

#reviews .woocommerce-Reviews-title {
    font-family: var(--ff-heading);
    font-size: var(--fs-lg);
    color: var(--clr-primary);
    margin-bottom: var(--spacing-md);
}

#reviews .commentlist {
    padding: 0;
}

#reviews .comment {
    padding: var(--spacing-md) 0;
    border-bottom: 1px solid var(--clr-border);
}

#reviews .comment_container {
    display: flex;
    gap: var(--spacing-sm);
}

#reviews .avatar {
    border-radius: 50%;
    width: 48px;
    height: 48px;
}

#reviews .comment-text {
    flex: 1;
}

#reviews .star-rating {
    color: var(--clr-accent);
    font-size: var(--fs-sm);
}

#reviews .comment-text p.meta {
    font-size: var(--fs-xs);
    color: var(--clr-secondary);
    margin-bottom: var(--spacing-xs);
}

#reviews .comment-text .description p {
    font-size: var(--fs-sm);
    color: var(--clr-primary);
    line-height: var(--lh-normal);
}

#reviews #review_form_wrapper {
    margin-top: var(--spacing-lg);
}

#reviews .comment-reply-title {
    font-family: var(--ff-heading);
    font-size: var(--fs-md);
    color: var(--clr-primary);
    display: block;
    margin-bottom: var(--spacing-sm);
}

#reviews .comment-form-rating label,
#reviews .comment-form-comment label {
    display: block;
    font-size: var(--fs-sm);
    color: var(--clr-primary);
    margin-bottom: var(--spacing-xs);
}

#reviews .comment-form-rating p.stars a {
    color: var(--clr-accent);
}

#reviews #comment {
    width: 100%;
    padding: var(--spacing-sm);
    border: 1px solid var(--clr-border);
    font-family: var(--ff-body);
    font-size: var(--fs-sm);
    resize: vertical;
}

#reviews .form-submit input#submit {
    background-color: var(--clr-primary);
    color: #ffffff;
    border: none;
    border-radius: 0;
    padding: var(--spacing-sm) var(--spacing-lg);
    text-transform: uppercase;
    letter-spacing: var(--ls-wide);
    font-family: var(--ff-body);
    font-weight: var(--fw-sb);
    font-size: var(--fs-sm);
    cursor: pointer;
    transition: background-color var(--transition);
    margin-top: var(--spacing-sm);
}

#reviews .form-submit input#submit:hover {
    background-color: var(--clr-secondary);
}

#reviews .woocommerce-noreviews {
    font-size: var(--fs-sm);
    color: var(--clr-secondary);
}

/* --- Related products --- */

.custom-product-related {
    margin-top: var(--spacing-xl);
    padding-top: var(--spacing-lg);
    border-top: 1px solid var(--clr-border);
}

.custom-product-related h2 {
    font-family: var(--ff-heading);
    font-size: var(--fs-xl);
    margin-bottom: var(--spacing-md);
}

.custom-product-related ul.products li.product .button {
    display: none !important;
}

.custom-product-related ul.products li.product .product-sizes {
    display: none !important;
}

.custom-product-related ul.products li.product .star-rating {
    display: none !important;
}

.custom-product-related ul.products li.product .price ins {
    text-decoration: none !important;
}

.custom-product-related ul.products li.product .woocommerce-loop-product__title {
    font-size: var(--fs-sm) !important;
    text-transform: uppercase;
}

/* --- Sale badge --- */

span.onsale {
    background-color: var(--clr-accent) !important;
    color: #ffffff !important;
    font-family: var(--ff-body) !important;
    font-weight: var(--fw-sb) !important;
    font-size: var(--fs-xs) !important;
    padding: 4px 10px !important;
    border-radius: 0 !important;
    position: absolute !important;
    top: var(--spacing-sm) !important;
    left: var(--spacing-sm) !important;
    right: auto !important;
    z-index: 1 !important;
    min-height: auto !important;
    width: auto !important;
    height: auto !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
}

/* ======================================
   07. BREADCRUMBS
====================================== */

.custom-breadcrumbs span,
.woocommerce-breadcrumb {
    font-size: var(--fs-xs);
    color: var(--clr-secondary);
    margin-bottom: var(--spacing-md);
}

.custom-breadcrumbs a,
.woocommerce-breadcrumb a {
    color: var(--clr-secondary);
}

.custom-breadcrumbs a:hover,
.woocommerce-breadcrumb a:hover {
    color: var(--clr-primary);
}

.custom-breadcrumbs__sep {
    margin: 0 4px;
    color: var(--clr-border);
}

.custom-breadcrumbs__current {
    color: var(--clr-primary);
}

.custom-breadcrumbs a,
.custom-breadcrumbs span {
    font-size: var(--fs-xs);
}

.container > .woocommerce-breadcrumb {
    margin-top: var(--spacing-md);
    margin-bottom: 0;
}

.container > .woocommerce-breadcrumb + .custom-product {
    padding-top: var(--spacing-md);
}

/* ======================================
   08. SHOP SIDEBAR & FILTERS
====================================== */

.woocommerce-page-wrapper {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: var(--spacing-xl);
    align-items: start;
}

.woocommerce-page-wrapper .site-main {
    order: 2;
}

.woocommerce-page-wrapper #sidebar {
    order: 1;
}

#sidebar {
    background: none;
    padding-top: var(--spacing-lg);
}

#sidebar > ul {
    padding: 0;
    margin: 0;
}

.wc-block-product-filters {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-lg);
}

.wc-block-product-filters__open-overlay {
    display: none;
}

.wc-block-product-filters__overlay,
.wc-block-product-filters__overlay-wrapper {
    position: static;
}

.wc-block-product-filters__overlay-dialog {
    position: static;
    box-shadow: none;
    background: none;
}

.wc-block-product-filters__overlay-header,
.wc-block-product-filters__overlay-footer {
    display: none;
}

.wc-block-product-filters__overlay-content > h2 {
    display: none;
}

.wc-block-product-filters__overlay-content h3 {
    font-family: var(--ff-heading);
    font-size: var(--fs-md);
    text-transform: uppercase;
    letter-spacing: var(--ls-wide);
    color: var(--clr-primary);
    margin-bottom: var(--spacing-sm) !important;
}

.wc-block-product-filters__overlay-content > div {
    margin-bottom: var(--spacing-lg);
    padding-bottom: var(--spacing-md);
    border-bottom: 1px solid var(--clr-border);
}

.wc-block-product-filter-price-slider__range {
    background-color: var(--clr-border);
}

.wc-block-product-filter-price-slider__range .range-bar {
    background-color: var(--clr-accent);
}

.wc-block-product-filter-price-slider__left,
.wc-block-product-filter-price-slider__right {
    margin-top: var(--spacing-sm);
}

.wc-block-product-filter-price-slider input[type="text"] {
    border: 1px solid var(--clr-border);
    padding: var(--spacing-xs) var(--spacing-sm);
    font-size: var(--fs-sm);
    width: 70px;
}

.wc-block-product-filter-chips__items {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-xs);
}

.wc-block-product-filter-chips__item {
    border: 1px solid var(--clr-border) !important;
    background-color: transparent !important;
    padding: var(--spacing-xs) var(--spacing-sm) !important;
    font-family: var(--ff-body) !important;
    font-size: var(--fs-sm) !important;
    color: var(--clr-primary) !important;
    cursor: pointer;
    border-radius: 0 !important;
}

.wc-block-product-filter-chips__item[aria-checked="true"] {
    background-color: var(--clr-primary) !important;
    border-color: var(--clr-primary) !important;
    color: #ffffff !important;
}

.wc-block-product-filter-chips__count {
    opacity: 0.6;
    font-size: var(--fs-xs);
}

.wc-block-product-filters__apply {
    background-color: var(--clr-primary);
    color: #ffffff;
    border: none;
    padding: var(--spacing-sm) var(--spacing-md);
    text-transform: uppercase;
    letter-spacing: var(--ls-wide);
    font-size: var(--fs-sm);
    cursor: pointer;
}

@media (max-width: 768px) {
    .woocommerce-page-wrapper {
        grid-template-columns: 1fr;
        gap: var(--spacing-md);
    }

    .wc-block-product-filters__open-overlay {
        display: flex;
        align-items: center;
        gap: var(--spacing-xs);
        background: none;
        border: 1px solid var(--clr-border);
        padding: var(--spacing-sm) var(--spacing-md);
        cursor: pointer;
        margin-bottom: var(--spacing-md);
    }

    .wc-block-product-filters__overlay {
        position: fixed;
        inset: 0;
        z-index: 999;
        display: none;
    }

    .is-overlay-opened .wc-block-product-filters__overlay {
        display: block;
        background-color: var(--clr-bg);
    }

    .wc-block-product-filters__overlay-header,
    .wc-block-product-filters__overlay-footer {
        display: flex;
    }
}

/* ======================================
   09. SHOP PAGE — HEADER, ORDERING, PAGINATION
====================================== */

.woocommerce-products-header,
.woocommerce-notices-wrapper {
    display: none !important;
}

.woocommerce-ordering {
    margin-bottom: var(--spacing-lg);
    position: relative;
    display: inline-block;
}

.woocommerce-ordering::after {
    content: "\25BE";
    position: absolute;
    right: var(--spacing-xs);
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    color: var(--clr-primary);
    font-size: var(--fs-sm);
}

.woocommerce-ordering .orderby {
    padding: var(--spacing-xs) var(--spacing-sm) var(--spacing-xs) var(--spacing-xs);
    border: none;
    background-color: transparent;
    background-image: none;
    font-family: var(--ff-body);
    font-size: var(--fs-sm);
    color: var(--clr-primary);
    cursor: pointer;
    border-radius: 0;
    appearance: none;
    -webkit-appearance: none;
}

.woocommerce-ordering .orderby:focus {
    outline: none;
}

.woocommerce-result-count {
    font-size: var(--fs-sm);
    color: var(--clr-secondary);
    margin-bottom: var(--spacing-sm);
}

.woocommerce ul.products li.product .product-sizes,
.woocommerce ul.products li.product .add_to_cart_button {
    display: none !important;
}

.woocommerce-pagination {
    margin-top: var(--spacing-xl);
}

.woocommerce nav.woocommerce-pagination ul {
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: var(--spacing-sm) !important;
    white-space: normal !important;
}

.woocommerce nav.woocommerce-pagination ul li {
    border-right: none !important;
    float: none !important;
    display: flex !important;
    margin: 0 !important;
    padding: 0 !important;
}

.woocommerce-pagination ul.page-numbers li a.page-numbers,
.woocommerce-pagination ul.page-numbers li span.page-numbers {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 36px !important;
    height: 36px !important;
    padding: 0 var(--spacing-xs) !important;
    border: none !important;
    background: none !important;
    box-shadow: none !important;
    font-family: var(--ff-body) !important;
    font-size: var(--fs-sm) !important;
    color: var(--clr-primary) !important;
    text-align: center !important;
    line-height: 1 !important;
    transition: color var(--transition) !important;
}

.woocommerce-pagination ul.page-numbers li a.page-numbers:hover {
    color: var(--clr-secondary) !important;
}

.woocommerce-pagination ul.page-numbers li span.page-numbers.current {
    font-weight: var(--fw-sb) !important;
}

/* ======================================
   10. PRODUCT COLLECTION BLOCKS (Home carousels)
====================================== */

.wp-block-woocommerce-product-collection h2.wp-block-heading {
    font-family: var(--ff-heading);
    font-size: var(--fs-xl);
    color: var(--clr-primary);
    text-transform: none;
    margin-bottom: var(--spacing-md);
}

.wc-block-product-template {
    gap: var(--spacing-sm);
}

.wc-block-components-product-image {
    aspect-ratio: 4 / 5.5 !important;
}

.wc-block-components-product-image img {
    aspect-ratio: 3 / 5.5 !important;
    object-fit: cover !important;
    width: 100% !important;
    height: 100% !important;
    border-radius: 0;
}

.wp-block-post-title {
    text-align: left !important;
}

.wp-block-post-title a,
.wc-block-product-template .wp-block-post-title a {
    font-family: var(--ff-heading) !important;
    font-size: var(--fs-sm) !important;
    font-weight: var(--fw-sb) !important;
    color: var(--clr-primary) !important;
    text-transform: uppercase !important;
}

.wc-block-components-product-price {
    text-align: left !important;
}

.wc-block-components-product-price .woocommerce-Price-amount {
    font-family: var(--ff-body) !important;
    font-size: var(--fs-md) !important;
    font-weight: var(--fw-r) !important;
    color: var(--clr-accent) !important;
}

.wc-block-components-product-price .woocommerce-Price-amount ins {
    text-decoration: none !important;
}

/* Κρύψιμο add-to-cart & μεγεθών σε product collection blocks */
.wc-block-components-product-button,
.wc-block-product-template .product-sizes,
.wc-block-product-template .star-rating {
    display: none !important;
}

.wc-block-components-product-sale-badge {
    background-color: var(--clr-accent) !important;
    color: #ffffff !important;
    border-radius: 0 !important;
    font-family: var(--ff-body) !important;
    font-weight: var(--fw-sb) !important;
    font-size: var(--fs-xs) !important;
    text-transform: uppercase !important;
    letter-spacing: var(--ls-wide) !important;
    padding: 4px 10px !important;
}

.wc-block-next-previous-buttons__button {
    background-color: transparent !important;
    border: 1px solid var(--clr-border) !important;
    border-radius: 0 !important;
    color: var(--clr-primary) !important;
}

.wc-block-next-previous-buttons__button:hover {
    border-color: var(--clr-primary) !important;
}

.wc-block-product-template.is-product-collection-layout-carousel .wc-block-product {
    flex: 0 0 calc(25% - var(--spacing-md) * 3 / 4);
    max-width: calc(25% - var(--spacing-md) * 3 / 4);
}

/* --- Star rating (native WooCommerce "star" font, kept for shop/related use) --- */

.wc-block-product-template .star-rating {
    overflow: hidden !important;
    position: relative !important;
    height: 1em !important;
    line-height: 1em !important;
    width: 5.3em !important;
    font-family: star !important;
    font-weight: 400 !important;
    margin-bottom: var(--spacing-xs) !important;
}

.wc-block-product-template .star-rating::before {
    content: "\53\53\53\53\53" !important;
    color: #e6e6e6 !important;
    float: left !important;
    top: 0 !important;
    left: 0 !important;
    position: absolute !important;
}

.wc-block-product-template .star-rating span {
    overflow: hidden !important;
    float: left !important;
    top: 0 !important;
    left: 0 !important;
    position: absolute !important;
    padding-top: 1.5em !important;
}

.wc-block-product-template .star-rating span::before {
    content: "\53\53\53\53\53" !important;
    top: 0 !important;
    position: absolute !important;
    left: 0 !important;
    color: var(--clr-accent) !important;
}

/* --- New Arrivals / hand-picked collection: responsive columns --- */

.wc-block-product-template__responsive.columns-5 {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-md);
}

.wc-block-product-template__responsive.columns-5 .wc-block-product {
    flex: 0 0 calc(20% - var(--spacing-md) * 4 / 5);
    max-width: calc(20% - var(--spacing-md) * 4 / 5);
}

@media (max-width: 1200px) {
    .wc-block-product-template__responsive.columns-5 .wc-block-product {
        flex: 0 0 calc(33.333% - var(--spacing-md) * 2 / 3);
        max-width: calc(33.333% - var(--spacing-md) * 2 / 3);
    }
}

@media (max-width: 768px) {
    .wc-block-product-template__responsive.columns-5 .wc-block-product {
        flex: 0 0 calc(50% - var(--spacing-md) / 2);
        max-width: calc(50% - var(--spacing-md) / 2);
    }
}

@media (max-width: 480px) {
    .wc-block-product-template__responsive.columns-5 .wc-block-product {
        flex: 0 0 100%;
        max-width: 100%;
    }
}

/* --- Featured Showcase (large carousel variant) --- */

.featured-showcase .wc-block-product-template .wc-block-product {
    flex: 0 0 calc(33.333% - var(--spacing-md) * 2 / 3) !important;
    max-width: calc(33.333% - var(--spacing-md) * 2 / 3) !important;
}

.featured-showcase .wc-block-components-product-image {
    height: 420px !important;
}

.featured-showcase .wc-block-components-product-image img {
    height: 100% !important;
    width: 100% !important;
    object-fit: cover !important;
}

.featured-showcase .wp-block-post-title a {
    font-size: var(--fs-lg) !important;
}

/* --- "Δες περισσότερα" style buttons (Gutenbee) --- */

.gutenbee-block-button-link {
    display: inline-flex;
    align-items: center;
    gap: var(--spacing-xs);
}

.gutenbee-block-button-link::after {
    content: "\2192";
}

/* ======================================
   11. NEWSLETTER
====================================== */

.newsletter-section {
    background-color: var(--clr-primary);
    padding-block: var(--spacing-xl);
    border-top: 1px solid var(--clr-border);
    border-bottom: 1px solid var(--clr-border);
}

.newsletter-section__inner {
    max-width: 500px;
    margin-inline: auto;
    text-align: center;
}

.newsletter-section__title {
    font-family: var(--ff-heading);
    font-size: var(--fs-2xl);
    color: #ffffff;
    margin-bottom: var(--spacing-sm);
}

.newsletter-section__text {
    font-size: var(--fs-md);
    color: #ffffff;
    margin-bottom: var(--spacing-md);
}

.newsletter-form {
    display: flex;
    gap: var(--spacing-xs);
}

.newsletter-form__input {
    flex: 1;
    padding: var(--spacing-sm) var(--spacing-md);
    border: 1px solid var(--clr-border);
    font-family: var(--ff-body);
    font-size: var(--fs-sm);
    background-color: var(--clr-bg-alt);
}

.newsletter-form__input:focus {
    outline: none;
    border-color: var(--clr-primary);
}

.newsletter-form__button {
    background-color: var(--clr-accent);
    color: #ffffff;
    border: none;
    padding: var(--spacing-sm) var(--spacing-lg);
    text-transform: uppercase;
    letter-spacing: var(--ls-wide);
    font-family: var(--ff-body);
    font-weight: var(--fw-sb);
    font-size: var(--fs-sm);
    cursor: pointer;
    transition: background-color var(--transition);
    white-space: nowrap;
}

.newsletter-form__button:hover {
    background-color: var(--clr-secondary);
}

.newsletter-form__message {
    margin-top: var(--spacing-md);
    font-size: var(--spacing-sm);
    color: var(--clr-accent);
}

.newsletter-form__message--success {
    color: var(--clr-accent);
    font-weight: var(--fw-sb);
}

@media (max-width: 576px) {
    .newsletter-form {
        flex-direction: column;
    }
}

/* ======================================
   12. CART DRAWER (slide-in)
====================================== */

.cart-drawer {
    position: fixed;
    inset: 0;
    z-index: 1000;
}

.cart-drawer[hidden] {
    display: none;
}

.cart-drawer__overlay {
    position: absolute;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    opacity: 0;
    transition: opacity var(--transition);
}

.cart-drawer.is-open .cart-drawer__overlay {
    opacity: 1;
}

.cart-drawer__panel {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 100%;
    max-width: 420px;
    background-color: var(--clr-bg-alt);
    display: flex;
    flex-direction: column;
    transform: translateX(100%);
    transition: transform var(--transition);
}

.cart-drawer.is-open .cart-drawer__panel {
    transform: translateX(0);
}

.cart-drawer__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--spacing-md);
    border-bottom: 1px solid var(--clr-border);
}

.cart-drawer__title {
    font-family: var(--ff-heading);
    font-size: var(--fs-lg);
    color: var(--clr-primary);
}

.cart-drawer__close {
    background: none;
    border: none;
    font-size: var(--fs-2xl);
    line-height: 1;
    color: var(--clr-primary);
    cursor: pointer;
    padding: 0;
}

.cart-drawer__body {
    flex: 1;
    overflow-y: auto;
    padding: var(--spacing-md);
}

/* --- Mini cart contents --- */

.cart-drawer__body .woocommerce-mini-cart {
    padding: 0;
    margin: 0;
}

.cart-drawer__body .woocommerce-mini-cart-item {
    display: flex;
    flex-direction: column;
    padding-block: var(--spacing-sm);
    border-bottom: 1px solid var(--clr-border);
    position: relative;
}

.cart-drawer__body .woocommerce-mini-cart-item a:not(.remove) {
    display: flex !important;
    align-items: flex-start !important;
    gap: var(--spacing-sm) !important;
    text-decoration: none !important;
}

.cart-drawer__body .woocommerce-mini-cart-item a:not(.remove) img {
    width: 70px !important;
    height: 90px !important;
    object-fit: cover !important;
    flex-shrink: 0 !important;
}

.cart-drawer__body .woocommerce-mini-cart-item a.remove {
    position: absolute;
    top: var(--spacing-sm);
    right: 0;
    color: var(--clr-secondary) !important;
    font-size: var(--fs-lg);
    text-decoration: none !important;
    width: auto !important;
    height: auto !important;
    background: none !important;
}

.cart-drawer__body .woocommerce-mini-cart-item .quantity {
    display: block;
    margin-top: var(--spacing-xs);
    padding-left: calc(70px + var(--spacing-sm));
    font-size: var(--fs-xs);
    color: var(--clr-secondary);
}

.cart-drawer__body .total {
    margin-top: var(--spacing-md);
    padding-top: var(--spacing-md);
    border-top: 1px solid var(--clr-border);
    font-family: var(--ff-heading);
    font-size: var(--fs-lg);
    font-weight: var(--fw-b);
    color: var(--clr-primary);
}

.cart-drawer__body .woocommerce-mini-cart__buttons {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
    margin-top: var(--spacing-md);
}

.cart-drawer__body .woocommerce-mini-cart__buttons a {
    display: block;
    text-align: center;
    padding: var(--spacing-sm) var(--spacing-md);
    text-transform: uppercase;
    letter-spacing: var(--ls-wide);
    font-family: var(--ff-body);
    font-weight: var(--fw-sb);
    font-size: var(--fs-sm);
}

.cart-drawer__body .woocommerce-mini-cart__buttons a.wc-forward:first-child {
    background-color: transparent;
    border: 1px solid var(--clr-primary);
    color: var(--clr-primary);
}

.cart-drawer__body .woocommerce-mini-cart__buttons a.checkout {
    background-color: var(--clr-primary);
    color: #ffffff;
    border: none;
}

.cart-drawer__body .woocommerce-mini-cart__empty-message {
    text-align: center;
    color: var(--clr-secondary);
    padding-block: var(--spacing-xl);
}

.cart-drawer__body .woocommerce-mini-cart-item.mini_cart_item_removing {
    position: relative;
}

.cart-drawer__body mark.count,
.cart-drawer__body .blockUI.blockOverlay {
    background-color: rgba(239, 235, 228, 0.8) !important;
}

.cart-drawer__body .blockUI.blockOverlay::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    width: 20px !important;
    height: 20px !important;
    margin: -10px 0 0 -10px !important;
    border: 2px solid var(--clr-border) !important;
    border-top-color: var(--clr-primary) !important;
    border-radius: 50% !important;
    animation: cart-spin 0.6s linear infinite !important;
}

@keyframes cart-spin {
    to {
        transform: rotate(360deg);
    }
}

/* ======================================
   13. CART PAGE (Block-based)
====================================== */

.wp-block-woocommerce-cart {
    margin-top: var(--spacing-lg);
}

.wp-block-woocommerce-cart.alignwide {
    max-width: var(--container-width) !important;
    margin-inline: auto !important;
    padding-inline: var(--spacing-md) !important;
}

.woocommerce-cart .page-title {
    display: none !important;
}

div[data-block-name="woocommerce/cart"] .wc-block-components-sidebar-layout {
    display: grid !important;
    grid-template-columns: 1fr 460px !important;
    gap: var(--spacing-xl) !important;
    align-items: start !important;
}

.wc-block-cart-items__header {
    border-bottom: 1px solid var(--clr-border);
}

.wc-block-cart-items__header th {
    padding-bottom: var(--spacing-sm);
}

.wc-block-cart-items__header th span {
    font-family: var(--ff-body);
    font-size: var(--fs-xs);
    text-transform: uppercase;
    letter-spacing: var(--ls-wide);
    color: var(--clr-secondary);
    font-weight: var(--fw-r);
}

.wc-block-cart-items__row {
    border-bottom: 1px solid var(--clr-border);
}

.wc-block-cart-items__row td {
    padding-block: var(--spacing-md);
    vertical-align: top;
}

.wc-block-cart-item__image img {
    width: 90px !important;
    height: 110px !important;
    object-fit: cover !important;
}

.wc-block-components-product-name {
    font-family: var(--ff-body);
    font-size: var(--fs-md);
    color: var(--clr-primary) !important;
    text-decoration: none !important;
}

.wc-block-cart-item__prices .wc-block-components-product-price__value {
    font-family: var(--ff-body);
    font-size: var(--fs-sm);
    color: var(--clr-secondary);
}

.wc-block-components-product-details {
    margin-top: var(--spacing-xs);
    font-size: var(--fs-xs);
    color: var(--clr-secondary);
}

.wc-block-components-product-details__name {
    font-weight: var(--fw-m);
}

/* --- Cart line item: quantity + remove, stacked together --- */

.wc-block-cart-item__quantity {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--spacing-xs);
    margin-top: var(--spacing-md);
}

.wc-block-components-quantity-selector {
    display: flex;
    align-items: center;
    border: 1px solid var(--clr-primary);
    width: fit-content;
    margin-top: 0;
}

.wc-block-components-quantity-selector__input {
    background-color: var(--clr-bg);
    color: var(--clr-primary);
    border: none;
    width: 40px;
    height: 36px;
    text-align: center;
    font-family: var(--ff-body);
    font-size: var(--fs-sm);
    order: 2;
}

.wc-block-components-quantity-selector__button {
    background-color: var(--clr-bg);
    border: none;
    width: 32px;
    height: 36px;
    font-size: var(--fs-md);
    color: var(--clr-primary);
    cursor: pointer;
}

.wc-block-components-quantity-selector__button--minus {
    order: 1;
}

.wc-block-components-quantity-selector__button--plus {
    order: 3;
}

.wc-block-cart-item__remove-link {
    order: 2;
    background: none !important;
    border: none !important;
    color: var(--clr-secondary) !important;
    cursor: pointer;
    padding: 0 !important;
    margin-top: 0;
}

.wc-block-cart-item__remove-link svg {
    fill: var(--clr-secondary);
    width: 20px;
    height: 20px;
}

.wc-block-cart-item__remove-link:hover svg {
    fill: var(--clr-error);
}

.wc-block-cart-item__total .wc-block-components-product-price__value {
    font-family: var(--ff-body);
    font-size: var(--fs-md);
    color: var(--clr-primary);
}

.wc-block-cart__main,
.wc-block-cart__sidebar {
    width: auto !important;
    max-width: none !important;
    flex-basis: auto !important;
}

.wc-block-cart__totals-title {
    font-family: var(--ff-heading);
    font-size: var(--fs-xl);
    color: var(--clr-primary);
    margin-bottom: var(--spacing-md);
}

.wc-block-components-totals-coupon {
    border: none !important;
    padding: 0 !important;
    margin-bottom: var(--spacing-md);
}

.wc-block-components-panel__button {
    font-family: var(--ff-body);
    font-size: var(--fs-sm);
    color: var(--clr-secondary);
    text-transform: uppercase;
    letter-spacing: var(--ls-wide);
}

.wc-block-components-totals-item__label {
    font-family: var(--ff-body);
    font-size: var(--fs-sm);
    color: var(--clr-primary);
}

.wc-block-components-totals-item {
    padding-block: var(--spacing-sm);
    border-bottom: 1px solid var(--clr-border);
}

.wc-block-components-totals-footer-item {
    border-bottom: none !important;
}

.wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
.wc-block-components-totals-footer-item-tax-value {
    font-family: var(--ff-heading) !important;
    font-size: var(--fs-lg) !important;
    font-weight: var(--fw-b) !important;
    color: var(--clr-primary) !important;
}

.wc-block-cart__submit-button {
    background-color: var(--clr-primary) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 0 !important;
    padding: var(--spacing-sm) var(--spacing-lg) !important;
    text-transform: uppercase !important;
    letter-spacing: var(--ls-wide) !important;
    font-family: var(--ff-body) !important;
    font-weight: var(--fw-sb) !important;
    font-size: var(--fs-sm) !important;
    width: 100% !important;
    text-align: center !important;
    transition: background-color var(--transition) !important;
}

.wc-block-cart__submit-button:hover {
    background-color: var(--clr-secondary) !important;
}

@media (max-width: 900px) {
    div[data-block-name="woocommerce/cart"] .wc-block-components-sidebar-layout {
        grid-template-columns: 1fr !important;
    }
}

/* ======================================
   14. CHECKOUT PAGE (Block-based)
====================================== */

.wp-block-woocommerce-checkout.alignwide {
    max-width: var(--container-width) !important;
    margin-inline: auto !important;
    padding-inline: var(--spacing-md) !important;
    margin-top: var(--spacing-lg);
}

.woocommerce-checkout .page-title {
    display: none !important;
}

.wc-block-checkout .wc-block-components-sidebar-layout {
    display: grid !important;
    grid-template-columns: 1fr 600px !important;
    gap: var(--spacing-xl) !important;
    align-items: start !important;
}

.wc-block-checkout__main,
.wc-block-checkout__sidebar {
    width: auto !important;
    max-width: none !important;
    flex-basis: auto !important;
}

.wc-block-components-checkout-step {
    border-bottom: 1px solid var(--clr-border);
    padding-bottom: var(--spacing-lg);
    margin-bottom: var(--spacing-lg);
}

.wc-block-components-checkout-step__title {
    font-family: var(--ff-heading);
    font-size: var(--fs-lg);
    color: var(--clr-primary);
    font-weight: var(--fw-sb);
}

/* --- Floating labels on text inputs --- */

.wc-block-components-text-input {
    position: relative !important;
}

.wc-block-components-text-input input {
    border: 1px solid var(--clr-border) !important;
    background-color: var(--clr-bg) !important;
    font-family: var(--ff-body) !important;
    font-size: var(--fs-sm) !important;
    padding: var(--spacing-sm) var(--spacing-md) !important;
    border-radius: 0 !important;
    height: 48px !important;
    box-sizing: border-box !important;
}

.wc-block-components-text-input input:focus {
    border-color: var(--clr-primary) !important;
    box-shadow: none !important;
}

.wc-block-components-text-input label {
    position: absolute !important;
    top: 50% !important;
    left: var(--spacing-md) !important;
    transform: translateY(-50%) !important;
    transition: all var(--transition) !important;
    pointer-events: none !important;
    background-color: transparent !important;
    font-family: var(--ff-body) !important;
    font-size: var(--fs-sm) !important;
    color: var(--clr-secondary) !important;
}

.wc-block-components-text-input input:focus + label,
.wc-block-components-text-input.is-active label {
    top: 0 !important;
    transform: translateY(-50%) !important;
    font-size: var(--fs-xs) !important;
    background-color: var(--clr-bg) !important;
    padding: 0 4px !important;
    left: 8px !important;
}

/* --- Select dropdowns (country, region) --- */

.wc-blocks-components-select__container {
    position: relative !important;
    display: block !important;
}

.wc-blocks-components-select__label {
    position: absolute !important;
    top: -8px !important;
    left: 12px !important;
    background-color: var(--clr-bg-alt) !important;
    padding: 0 4px !important;
    font-size: var(--fs-xs) !important;
    color: var(--clr-secondary) !important;
    z-index: 2 !important;
    pointer-events: none !important;
    line-height: 1 !important;
}

.wc-blocks-components-select__select {
    border: 1px solid var(--clr-border) !important;
    background-color: var(--clr-bg) !important;
    font-family: var(--ff-body) !important;
    font-size: var(--fs-sm) !important;
    padding: var(--spacing-sm) var(--spacing-md) !important;
    padding-top: var(--spacing-sm) !important;
    padding-bottom: var(--spacing-sm) !important;
    border-radius: 0 !important;
    height: auto !important;
    min-height: 48px !important;
    line-height: 1.4 !important;
    box-sizing: border-box !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    width: 100% !important;
    display: block !important;
}

.wc-blocks-components-select__expand {
    position: absolute !important;
    top: 50% !important;
    right: 12px !important;
    transform: translateY(-50%) !important;
    pointer-events: none !important;
}

/* --- Shipping / payment radio options --- */

/*.wc-block-components-radio-control {*/
/*    display: flex !important;*/
/*    flex-direction: column !important;*/
/*    gap: var(--spacing-sm) !important;*/
/*}*/

/*.wc-block-components-radio-control__option {*/
/*    display: flex !important;*/
/*    align-items: center !important;*/
/*    gap: var(--spacing-sm) !important;*/
/*    position: relative !important;*/
/*    border: none !important;*/
/*    border-radius: 0 !important;*/
/*    padding: var(--spacing-md) !important;*/
/*}*/

/*.wc-block-components-radio-control__input {*/
/*    position: static !important;*/
/*    flex-shrink: 0 !important;*/
/*    width: 18px !important;*/
/*    height: 18px !important;*/
/*    margin: 0 !important;*/
/*}*/

.wc-block-components-radio-control__option-layout {
    /*flex: 1 !important;*/
    margin-left: var(--spacing-md);
}

.wc-block-components-radio-control__secondary-label {
    margin-right: var(--spacing-md);
}

.wc-block-components-payment-method-label {
    font-family: var(--ff-body);
    font-size: var(--fs-sm);
    color: var(--clr-primary);
    margin-left: var(--spacing-md);
}

.wc-block-components-radio-control-accordion-content {
    border-top: none !important;
    font-size: var(--fs-xs) !important;
    color: var(--clr-primary) !important;
}

.wc-block-components-radio-control-accordion-option {
    border-bottom: none !important;
    margin: 0 !important;
}

.wc-block-checkout__terms {
    font-size: var(--fs-xs);
    color: var(--clr-secondary);
}

.wc-block-components-checkout-place-order-button {
    background-color: var(--clr-primary) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 0 !important;
    padding: var(--spacing-sm) var(--spacing-lg) !important;
    text-transform: uppercase !important;
    letter-spacing: var(--ls-wide) !important;
    font-family: var(--ff-body) !important;
    font-weight: var(--fw-sb) !important;
    font-size: var(--fs-sm) !important;
    transition: background-color var(--transition) !important;
}

.wc-block-components-checkout-place-order-button:hover {
    background-color: var(--clr-secondary) !important;
}

/* --- Order summary sidebar --- */

.wc-block-checkout__sidebar {
    background-color: var(--clr-bg);
    padding: var(--spacing-md);
}

.wc-block-components-checkout-order-summary__title-text,
.wc-block-components-checkout-order-summary__title-price {
    font-family: var(--ff-heading);
    font-size: var(--fs-xl);
    color: var(--clr-primary);
}

.wc-block-components-checkout-order-summary__title-price {
    font-weight: var(--fw-b);
}

.wc-block-components-order-summary-item__image {
    position: relative;
}

.wc-block-components-order-summary-item__image img {
    width: 48px !important;
    height: 48px !important;
    object-fit: cover !important;
}

.wc-block-components-order-summary-item__quantity {
    position: absolute;
    top: -8px;
    right: -8px;
    background-color: var(--clr-primary) !important;
    color: #ffffff;
    font-size: var(--fs-xs);
    font-weight: var(--fw-sb);
    line-height: 1;
    border-radius: 50%;
    min-width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
}

.wp-block-woocommerce-checkout-order-summary-block {
    border: none;
    border-radius: 0;
}

@media (max-width: 900px) {
    .wc-block-checkout .wc-block-components-sidebar-layout {
        grid-template-columns: 1fr !important;
    }
}

/* ======================================
   15. MY ACCOUNT — LOGIN / REGISTER (Tabs)
====================================== */

#customer_login.u-columns.col2-set {
    display: block !important;
    max-width: 480px;
    margin-inline: auto !important;
    margin-bottom: var(--spacing-xl) !important;
}

#customer_login.u-columns.col2-set .col-1,
#customer_login.u-columns.col2-set .col-2 {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
    position: static !important;
}

.account-tabs {
    display: flex;
    gap: var(--spacing-md);
    border-bottom: 1px solid var(--clr-border);
    margin-bottom: var(--spacing-lg);
}

.account-tabs__tab {
    background: none;
    border: none;
    padding: var(--spacing-sm) 0;
    font-family: var(--ff-heading);
    font-size: var(--fs-md);
    text-transform: uppercase;
    letter-spacing: var(--ls-wide);
    color: var(--clr-secondary);
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    transition: color var(--transition), border-color var(--transition);
}

.account-tabs__tab.is-active {
    color: var(--clr-primary);
    border-bottom-color: var(--clr-primary);
}

.account-panel {
    display: none !important;
}

.account-panel.is-active {
    display: block !important;
}

#customer_login h2 {
    display: none;
}

#customer_login .woocommerce-form-row {
    max-width: 100% !important;
    box-sizing: border-box !important;
}

#customer_login .woocommerce-form-row label {
    display: block;
    font-family: var(--ff-body);
    font-size: var(--fs-sm);
    color: var(--clr-secondary);
    margin-bottom: var(--spacing-xs);
}

#customer_login .woocommerce-Input {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    padding: var(--spacing-sm) var(--spacing-md);
    border: 1px solid var(--clr-border);
    background-color: var(--clr-bg-alt);
    font-family: var(--ff-body);
    font-size: var(--fs-sm);
}

#customer_login .woocommerce-Input:focus {
    outline: none;
    border-color: var(--clr-primary);
}

#customer_login .password-input {
    position: relative;
    display: block;
    width: 100%;
}

#customer_login .password-input input {
    width: 100%;
}

#customer_login .show-password-input {
    position: absolute;
    top: 50%;
    right: var(--spacing-sm);
    transform: translateY(-50%);
    background: none;
    border: none;
    cursor: pointer;
}

#customer_login .woocommerce-form-login__rememberme {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    font-size: var(--fs-sm);
    color: var(--clr-secondary);
    margin-bottom: var(--spacing-sm);
}

#customer_login button[type="submit"] {
    background-color: var(--clr-primary);
    color: #ffffff;
    border: none;
    padding: var(--spacing-sm) var(--spacing-lg);
    text-transform: uppercase;
    letter-spacing: var(--ls-wide);
    font-family: var(--ff-body);
    font-weight: var(--fw-sb);
    font-size: var(--fs-sm);
    cursor: pointer;
    transition: background-color var(--transition);
}

#customer_login button[type="submit"]:hover {
    background-color: var(--clr-secondary);
}

#customer_login .woocommerce-LostPassword {
    margin-top: var(--spacing-sm);
    font-size: var(--fs-sm);
}

#customer_login .woocommerce-LostPassword a {
    color: var(--clr-secondary);
    text-decoration: underline;
}

#customer_login .woocommerce-privacy-policy-text {
    font-size: var(--fs-xs);
    color: var(--clr-secondary);
    margin: var(--spacing-md) 0;
}

#customer_login .woocommerce-privacy-policy-text a {
    color: var(--clr-primary);
    text-decoration: underline;
}

.woocommerce-account .page-title,
.woocommerce-account .woocommerce-breadcrumb,
.woocommerce-account .custom-breadcrumbs {
    display: none !important;
}

/* --- My Account dashboard container --- */

.woocommerce-account .entry-content > .woocommerce {
    max-width: var(--container-width);
    margin-inline: auto;
    padding-inline: var(--spacing-md);
}

/* ======================================
   16. CONTACT PAGE
====================================== */

.contact-form-wrapper {
    max-width: 800px;
}

.contact-form {
    background-color: transparent;
    padding: 0;
}

.contact-form__row {
    margin-bottom: var(--spacing-md);
}

.contact-form__row label {
    display: block;
    font-size: var(--fs-sm);
    color: var(--clr-primary);
    margin-bottom: var(--spacing-xs);
}

.contact-form__row input,
.contact-form__row textarea {
    width: 100%;
    padding: var(--spacing-sm) var(--spacing-md);
    border: 1px solid var(--clr-border);
    background-color: var(--clr-bg);
    font-family: var(--ff-body);
    font-size: var(--fs-sm);
    box-sizing: border-box;
}

.contact-form__row input:focus,
.contact-form__row textarea:focus {
    outline: none;
    border-color: var(--clr-primary);
}

.contact-form__row textarea {
    resize: vertical;
}

.contact-form button[type="submit"] {
    background-color: var(--clr-primary);
    color: #ffffff;
    border: none;
    padding: var(--spacing-sm) var(--spacing-lg);
    text-transform: uppercase;
    letter-spacing: var(--ls-wide);
    font-family: var(--ff-body);
    font-weight: var(--fw-sb);
    font-size: var(--fs-sm);
    cursor: pointer;
    transition: background-color var(--transition);
}

.contact-form button[type="submit"]:hover {
    background-color: var(--clr-secondary);
}

.contact-form__message {
    margin-bottom: var(--spacing-md);
    padding: var(--spacing-sm) var(--spacing-md);
    font-size: var(--fs-sm);
}

.contact-form__message--success {
    background-color: var(--clr-accent);
    color: #ffffff;
}

/* ======================================
   17. GENERIC "CUSTOM PAGE" LAYOUT
   (Privacy / Terms / Returns / About / Contact)
====================================== */

.custom-page .entry-content ul li,
.custom-page .entry-content ol li {
    list-style: disc;
    margin-left: var(--spacing-md);
}

.custom-page .page-header,
.custom-page .custom-breadcrumbs,
.custom-page .contact-page__title,
.custom-page .contact-page__intro {
    text-align: center;
    margin-bottom: var(--spacing-lg);
}

.custom-page .custom-breadcrumbs {
    justify-content: center;
}

.custom-page .page-title {
    font-size: var(--fs-2xl);
    margin-top: var(--spacing-sm);
}

.custom-page .contact-page__intro {
    margin-inline: auto;
}

.custom-page .contact-page__grid,
.custom-page .contact-info-item,
.custom-page .contact-form {
    text-align: left;
}

/* ======================================
   18. THANK YOU / ORDER RECEIVED PAGE
====================================== */

.woocommerce-order {
    max-width: var(--container-width) !important;
    margin-inline: auto !important;
    padding-inline: var(--spacing-md) !important;
    padding-block: var(--spacing-xl) !important;
}

.woocommerce-order-details__title,
.woocommerce-column__title {
    font-size: var(--fs-lg);
    margin-bottom: var(--spacing-md);
}

.wc-block-components-radio-control__option {
    border: none !important;
    border-radius: 0 !important;
    padding: var(--spacing-md) !important;
}