/* 1. Register the Light Font */
@font-face {
    font-family: 'Century Gothic Light';
    src: url('font/CenturyGothicPaneuropean-Light.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
/* space-grotesk-regular for menu */
/* space-grotesk-600 for menu */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 600;
  /* Corrected folder name 'font' and removed the extra dot */
  src: url('font/space-grotesk-v22-latin-600.woff2') format('woff2'); 
}

/* Apply to your Menu - Combined for better performance */
.primary-menu-container a, 
.main-navigation a, 
nav a {
    font-family: 'Space Grotesk', sans-serif !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    font-size: 13px;
}
.primary-menu-container a {
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.2px; /* This "breath" makes it look high-end */
    font-size: 13px; /* Slightly smaller size looks better with bold fonts */
}


/* space-grotesk-regular for menu */




/*
 Theme Name:   Minimalio Child
 Template:     minimalio
*/

/* 1. Force Title Visibility */
.single-product h1.product_title {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    margin-top: 0 !important;
    margin-bottom: 10px !important;
    font-size: 32px !important;
    line-height: 1.2 !important;
    color: #000 !important;
}

/* 2. Create the "Lite Space" for the zoom icon */
.woocommerce-product-gallery__trigger {
    top: 15px !important; 
    right: 15px !important;
}

/* 3. Space between main image and thumbnails */
.flex-control-nav.flex-control-thumbs {
    margin-top: 20px !important;
}

/* 4. Ensure the price doesn't hug the title too closely */
.single-product p.price {
    margin-top: 10px !important;
    margin-bottom: 25px !important;
}

/* 2. Apply Century Gothic Light to the Titles */
h1, h2, h3, .product_title, .entry-title {
    font-family: 'Century Gothic Light', sans-serif !important;
    font-weight: 300 !important;
    letter-spacing: 0.04em !important;
    text-transform: none;
}
/* Force 3:2 Aspect Ratio on Shop Thumbnails */

/* 1. FORCE 3:2 ONLY ON MAIN PRODUCT GALLERY SLIDER */
.single-product .woocommerce-product-gallery .flex-viewport,
.single-product .woocommerce-product-gallery .flex-viewport img {
    aspect-ratio: 3 / 2 !important;
    height: auto !important;
    object-fit: cover !important;
}

/* 2. FORCE 3:2 ON THE MAIN THUMBNAIL TRACK (the small dots/images below main) */
.single-product .flex-control-thumbs img {
    aspect-ratio: 3 / 2 !important;
    object-fit: cover !important;
    opacity: 1 !important; /* Keeps them bright */
}

/* 3. SAFETY RESET: Ensure Related/Sidebar/Grid products stay square or original */
.products .product img, 
.related.products img, 
.upsells.products img,
.widget_products img {
    aspect-ratio: 3/2 !important; /* Or change to unset if you want natural size */
    height: auto !important;
    object-fit: contain !important;
}

/* Reviews */
/* 1. Force yellow if the stars are an Icon Font */
.woocommerce .star-rating,
.woocommerce .star-rating span,
.woocommerce .star-rating::before,
.woocommerce .star-rating span::before {
    color: #ffb703 !important;
}

/* 2. Force yellow if the theme renders stars as SVGs */
.woocommerce .star-rating svg,
.woocommerce .star-rating svg path,
.woocommerce .star-rating span svg {
    fill: #ffb703 !important;
    stroke: #ffb703 !important;
}
/* End  Reviews */