/* 1. Font Face Definitions */
@font-face {
   font-family: "Pontiac";
   src: url("/wp-content/themes/ciyo/webfonts/pontiac_black-webfont.woff2") format("woff2"), url("/wp-content/themes/ciyo/webfonts/pontiac_black-webfont.woff") format("woff");
   font-weight: 900;
   font-style: normal;
}

@font-face {
   font-family: "Pontiac";
   src: url("/wp-content/themes/ciyo/webfonts/pontiac_black_italic-webfont.woff2") format("woff2"), url("/wp-content/themes/ciyo/webfonts/pontiac_black_italic-webfont.woff") format("woff");
   font-weight: 900;
   font-style: italic;
}

@font-face {
   font-family: "Pontiac";
   src: url("/wp-content/themes/ciyo/webfonts/pontiac_bold-webfont.woff2") format("woff2"), url("/wp-content/themes/ciyo/webfonts/pontiac_bold-webfont.woff") format("woff");
   font-weight: bold;
   font-style: normal;
}

@font-face {
   font-family: "Pontiac";
   src: url("/wp-content/themes/ciyo/webfonts/pontiac_bold_italic-webfont.woff2") format("woff2"), url("/wp-content/themes/ciyo/webfonts/pontiac_bold_italic-webfont.woff") format("woff");
   font-weight: bold;
   font-style: italic;
}

@font-face {
   font-family: "Pontiac";
   src: url("/wp-content/themes/ciyo/webfonts/pontiac_regular-webfont.woff2") format("woff2"), url("/wp-content/themes/ciyo/webfonts/pontiac_regular-webfont.woff") format("woff");
   font-weight: normal;
   font-style: normal;
}

@font-face {
   font-family: "Pontiac";
   src: url("/wp-content/themes/ciyo/webfonts/pontiac_regular_italic-webfont.woff2") format("woff2"), url("/wp-content/themes/ciyo/webfonts/pontiac_regular_italic-webfont.woff") format("woff");
   font-weight: normal;
   font-style: italic;
}

@font-face {
   font-family: "Pontiac";
   src: url("/wp-content/themes/ciyo/webfonts/pontiac_light-webfont.woff2") format("woff2"), url("/wp-content/themes/ciyo/webfonts/pontiac_light-webfont.woff") format("woff");
   font-weight: 300;
   font-style: normal;
}

@font-face {
   font-family: "Pontiac";
   src: url("/wp-content/themes/ciyo/webfonts/pontiac_light_italic-webfont.woff2") format("woff2"), url("/wp-content/themes/ciyo/webfonts/pontiac_light_italic-webfont.woff") format("woff");
   font-weight: 300;
   font-style: italic;
}

/* 3. Base Styles and Typography */
body {
   font-family: "Pontiac", sans-serif;
   margin: 0;
}

input {
   font-family: "pontiac";
}

address {
   font-style: normal;
}

button.show-password-input {
   display: none;
}

ins {
   text-decoration: none;
}

.price del,
.price del span,
.price del bdi {
   color: #b5b5b5;
}

.strike,
.strike * {
   text-decoration: none !important;
}

.strike {
   position: relative;
   display: inline-block;
   color: #888;
}

.strike::after {
   content: "";
   position: absolute;
   top: 50%;
   left: 0;
   width: 100%;
   height: 2px;
   background-color: currentColor;
   transform: translateY(-50%);
   pointer-events: none;
}

/* explore part */
.product-slider__slide .product-name h4 {
   font-size: 1.5rem;
   font-weight: 500;
   color: #000;
   line-height: 1.2;
   margin: 0.5rem 0 0.25rem;
}

h1.front-page-title {
    text-align: center;
}

ul.wc_payment_methods.payment_methods.methods li {
   list-style-type: none;
}

.product-slider__slide .product-image {
   margin-bottom: 0.5rem;
}

.product-slider__slide .product-image img {
   display: block;
   width: 100%;
   transition: transform 0.3s ease;
   object-fit: cover;
}
.product-slider__slide .product-image img:hover {
   transform: scale(1.05);
}


@media (max-width: 991px) {
   .col-xxl-6.col-xl-6.col-lg-6.col-md-12.col-sm-12 {
      margin-top: 1rem;
   }
}
:root {
   --ratio: 1.25; /* kisebb szorzó = kisebb különbségek a headingek közt */

   /* h5 - kisebb minimum és maximum */
   --h5-min: 1rem;
   --h5-max: 1.5rem;
   --h5: clamp(var(--h5-min), calc(0.9rem + 1.2vw), var(--h5-max));

   --h4: calc(var(--h5) * var(--ratio));
   --h3: calc(var(--h4) * var(--ratio));
   --h2: calc(var(--h3) * var(--ratio));
   --h1: calc(var(--h2) * var(--ratio));
}

/* ==============================
   Fluid / Responsive Headings
============================== */
h1 {
   font-size: clamp(1.5rem, 4vw, var(--h1));
}
h2 {
   font-size: clamp(1.4rem, 3.5vw, var(--h2));
}
h3 {
   font-size: clamp(1.3rem, 3vw, var(--h3));
}
h4 {
   font-size: clamp(1.15rem, 2.5vw, var(--h4));
}
h5 {
   font-size: clamp(1rem, 2vw, var(--h5));
}

/* Desktop override */
:root {
   --h5: 1.4rem;
}
@media (max-width: 1200px) {
   :root {
      --h5: 1.2rem;
   }
}
@media (max-width: 768px) {
   :root {
      --h5: 1rem;
   }
}

/* ==============================
   Fluid / Responsive Headings
============================== */
h1 {
   /* min 2rem, ideal 5vw, max var(--h1) */
   font-size: clamp(2rem, 5vw, var(--h1));
   line-height: 1.2;
   margin-bottom: 0.5em;
   font-weight: 500;
   margin-top: 2rem;
}

h2 {
   /* min 1.75rem, ideal 4vw, max var(--h2) */
   font-size: clamp(1.75rem, 4vw, var(--h2));
   line-height: 1.3;
   margin-bottom: 0.6em;
}

h3 {
   /* min 1.5rem, ideal 3vw, max var(--h3) */
   font-size: clamp(1.5rem, 3vw, var(--h3));
   line-height: 1.3;
   margin-bottom: 0.7em;
}

h4 {
   /* min 1.25rem, ideal 2.5vw, max var(--h4) */
   font-size: clamp(1.25rem, 2.5vw, var(--h4));
   line-height: 1.4;
   margin-bottom: 0.8em;
}

h5 {
   /* min 1rem, ideal 2vw, max var(--h5) */
   font-size: clamp(1rem, 2vw, var(--h5));
   line-height: 1.4;
   margin-bottom: 0.9em;
   margin-top: 0;
}

/* (desktop) */
:root {
   --h5: 1.6rem;
}
@media (max-width: 1200px) {
   :root {
      --h5: 1.4rem;
   }
}
@media (max-width: 768px) {
   :root {
      --h5: 1.2rem;
   }
}

a {
   text-decoration: none;
   color: #111;
}

a.button {
   background-color: #000000;
   color: #fff;
   font-size: 1rem;
   text-align: center;
   text-decoration: none;
   text-transform: uppercase;
   padding: 1rem 2rem;
   border: 2px solid;
}
a.button.discover {
   float: right;
}


a.button:hover {
   background: #fff;
   color: #000;
   transition: 0.3s;
}

@media (min-width: 992px) {
   .outer-header.container {
      padding-left: 15px;
      padding-right: 15px;
      margin: 0 auto;
   }
}

div#banner-bar {
   background: #333;
}

.banners.container {
   text-align: center;
}

.banner-item {
   color: #fff;
}

.u-column1.col-1.woocommerce-Address,
.u-column2.col-2.woocommerce-Address,
div#customer_details .col-1,
div#customer_details .col-2,
div#customer_login .col-1,
div#customer_login .col-2,
.col2-set .col-1,
.col2-set .col-2 {
   max-width: 48%;
}

.csomagajanlo,
.package-contents,
.tags {
   padding-left: 0;
}

/* 5. Upsell Popup Styles */
#upsell-popup-container {
   display: none;
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background: rgba(0, 0, 0, 0.6);
   z-index: 9999;
   display: flex;
   align-items: center;
   justify-content: center;
   padding: 1rem;
}

#upsell-popup-container.active {
   display: flex;
}

#upsell-popup {
   background: #fff;
   max-width: 600px;
   width: 100%;
   overflow: hidden;
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.popup-content {
   position: relative;
   padding: 1.5rem;
   display: flex;
   flex-wrap: wrap;
   gap: 1rem;
}

.close-popup {
   position: absolute;
   top: 0.5rem;
   right: 0.75rem;
   font-size: 1.5rem;
   cursor: pointer;
   line-height: 1;
   color: #333;
}

.popup-content h3 {
   flex: 1 1 100%;
   margin-bottom: 1rem;
   font-size: 1.5rem;
   text-align: center;
   text-transform: uppercase;
}

.upsell-item {
   flex: 1 1 calc(50% - 1rem);
   text-align: center;
   padding: 1rem;
   display: flex;
   flex-direction: column;
   justify-content: space-between;
}

.upsell-item img {
   max-width: 100%;
   height: auto;
   margin-bottom: 0.5rem;
}

.upsell-item p {
   flex: 1 1 auto;
   margin: 0.5rem 0;
}

.upsell-item .price {
   font-weight: bold;
   margin-bottom: 0.75rem;
}

.upsell-item .button {
   text-transform: uppercase;
   background: transparent;
   border: 2px solid #000;
   border-radius: 0;
   padding: 0.75em 1.5em;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   transition: background 0.2s, color 0.2s;
   color: #111;
   font-size: 1rem;
   cursor: pointer;
   font-family: "Pontiac";
}

bdi {
   color: #111;
}

div#inner-content {
   margin-bottom: 5rem;
}

.woocommerce span.price del,
.woocommerce span.price del * {
   color: #888 !important;
}

a.woocommerce-button.button.view {
   transition: 0.3s;
   border: 2px solid #111;
   color: #fff;
   padding: 1rem;
}
a.woocommerce-button.button.view:hover {
   background: #fff;
   transition: 0.3s;
   color: #111;
}

.woocommerce span.price del {
   text-decoration: line-through solid #888 !important;
   text-decoration-color: #888 !important;
}

button.woocommerce-Button.button {
   background-color: #000000;
   color: #fff;
   font-size: 1rem;
   text-align: center;
   text-decoration: none;
   text-transform: uppercase;
   padding: 1rem 2.3rem;
   font-family: "pontiac";
   cursor: pointer;
}

button.woocommerce-Button.button:hover {
   background: #fff;
   color: #000;
   transition: 0.3s;
}

ul.woocommerce-error {
   background: #ffd4d4;
   background-color: rgba(255, 0, 0, 0.1);
   color: #a00;
   padding: 1em 1.5em;
   backdrop-filter: blur(6px);
   -webkit-backdrop-filter: blur(6px);
   box-shadow: 0 0 10px rgba(255, 0, 0, 0.15);
   margin-bottom: 1.5rem;
}

.woocommerce-info {
   background-color: #e8f2f7;
   border: none;
   color: #264653;
   padding: 1rem;
   margin-bottom: 1.5rem;
   box-shadow: 0 0 10px rgb(164 170 198 / 15%);
}

.woocommerce-info a {
   text-decoration: underline;
}

ul.woocommerce-error li {
   list-style-type: none;
}

/* woocommerce user page */

.woocommerce-MyAccount-navigation ul {
   display: flex;
   gap: 2rem;
   list-style: none;
   margin: 0 0 2rem;
   padding: 0;
   justify-content: center;
}
@media (max-width: 484px) {
   .woocommerce-MyAccount-navigation ul {
      gap: .8rem;
   }
   .woocommerce-MyAccount-navigation ul li a {
      font-size: .8rem;
   }
   nav.woocommerce-MyAccount-navigation {
       max-width: 355px;
       margin: auto;
       padding-left: 15px;
       padding-right: 15px;
   }
}

@media (max-width: 375px) {
   .woocommerce-MyAccount-navigation ul li a {
      font-size: .75rem;
   }
   nav.woocommerce-MyAccount-navigation {
       max-width: 320px;
       margin: auto;
       padding-left: 15px;
       padding-right: 15px;
   }
}

.woocommerce-MyAccount-navigation li {
   margin: 0;
}

.woocommerce-MyAccount-navigation a {
   display: inline-block;
   text-transform: uppercase;
   font-weight: 600;
   font-size: 0.9rem;
   color: #333;
   padding: 0.5rem 0;
   position: relative;
   transition: color 0.3s;
}

.woocommerce-MyAccount-navigation a:hover,
.woocommerce-MyAccount-navigation .is-active a {
   color: #000000;
}

.woocommerce-MyAccount-navigation a::after {
   content: "";
   position: absolute;
   bottom: 0;
   left: 0;
   width: 0;
   height: 2px;
   background: #000000;
   transition: width 0.3s ease;
}
.woocommerce-MyAccount-navigation a:hover::after,
.woocommerce-MyAccount-navigation .is-active a::after {
   width: 100%;
}

.woocommerce-MyAccount-content {
   min-height: 50vh;
}

.woocommerce-MyAccount-content .addresses {
   display: flex;
   flex-wrap: wrap;
   gap: 2rem;
   margin-bottom: 2rem;
}
.woocommerce-MyAccount-content .addresses .woocommerce-Address {
   flex: 1 1 calc(50% - 2rem);
   box-sizing: border-box;
}

@media (max-width: 768px) {
   .woocommerce-MyAccount-content .addresses .woocommerce-Address {
      flex: 1 1 100%;
   }
}

/* container responsive settings */

.col-xxl-6.col-xl-6.col-lg-6.col-md-12.col-sm-12.image-container {
    display: flex;
    align-items: center;
}

.col-xxl-6.col-xl-6.col-lg-6.col-md-12.col-sm-12.introduce-text p {
    margin-top: -.4rem;
    font-size: 1.5rem;
}


.col-xxl-6.col-xl-6.col-lg-6.col-md-12.col-sm-12.image-container .front-page-img {
    height: 85%;
    margin: auto;
    width: 100%;
    object-fit: cover;
    margin-top: 0;
}

/* 6. Home Section, Video Landing, and Inner Content */
@media (max-width: 1440px) {
   section.page-content.clearfix {
      max-width: 1299px;
      margin: auto;
   }
}

div#content-second {
   background-color: #000000;
}

div#content-second h4.icon-title {
   color: #ffffff;
   text-align: center;
}

div#icon-container h4 {
   color: #fff;
   text-align: center;
}

h2.subtitle {
    font-size: 1.8rem;
}

.icon-img {
   width: 300px;
   height: auto;
   max-width: 300px;
   max-height: 300px;
   object-fit: cover;
   display: block;
   margin-left: auto;
   margin-right: auto;
}

.icon-box {
   display: flex;
   flex-direction: row;
   align-items: center;
   text-align: left;
}

.icon-box.text-center {
   text-align: left;
}

.icon-box .icon-title {
   flex: 1;
   margin: 0;
}

.icon-box .icon-img {
   margin: 0 0 0 1rem;
   max-width: 30%;
   height: auto;
   margin-bottom: 0;
}

@media (max-width: 768px) {
   .icon-box {
      flex-direction: column;
      text-align: center;
   }
   .icon-box .icon-img {
      margin: 1rem auto 0;
      max-width: 50%;
   }
}

.hero-slider__slide.testimonial {
   height: fit-content;
}

#testimonials-slider .hero-slider__slide .slide-content {
   display: grid;
   grid-template-columns: 1fr 2fr;
   column-gap: 30px;
   padding: 20px;
}

#testimonials-slider .product-image img {
   width: 100%;
   height: auto;
   object-fit: cover;
}

#testimonials-slider .review-content {
   display: flex;
   flex-direction: column;
}

#testimonials-slider .slider-main-title {
   margin: 0 0 1rem;
   line-height: 1.4;
   text-align: left;
}

#testimonials-slider .review-content .user-info {
   display: flex;
   align-items: center;
   margin-top: auto;
   justify-content: center;
}

#testimonials-slider .user-photo {
   max-width: 120px;
   height: 120px;
   border-radius: 50%;
   object-fit: cover;
   margin-right: 35px;
}

#testimonials-slider .user-name {
   margin: 0;
   font-size: 1.8rem;
   font-weight: 500;
   font-style: italic;
}

ul#shipping_method {
   list-style-type: none;
   padding-left: 0;
}

ul#shipping_method li {
   padding: 0;
}

section#testimonials-slider h2,
section#testimonials-slider h4 {
   color: #000;
}

section#testimonials-slider span.hero-slider__button {
   position: absolute;
   bottom: 30px;
}

section#testimonials-slider .hero-slider__button--prev {
   left: 0;
}

section#testimonials-slider .hero-slider__button--next {
   right: 0;
}

@media (max-width: 991x) {
   #testimonials-slider .slider-main-title {
      font-size: 18px !important;
   }
}
@media (max-width: 768px) {
   /* 1 column instead of 2 */
   #testimonials-slider .hero-slider__slide .slide-content {
      display: grid;
      grid-template-columns: 1fr;
      row-gap: 20px;
      column-gap: 0;
      /* (keep your existing padding or adjust here if you like) */
   }

   #testimonials-slider .product-image,
   #testimonials-slider .review-content {
      width: 100%;
   }

   #testimonials-slider .review-content .user-info {
      display: flex;
      flex-direction: column;
      align-items: center;
      margin-top: 0;
   }

   #testimonials-slider .user-photo {
      margin: 0 0 10px;
   }

   #testimonials-slider .slider-main-title {
      text-align: center;
   }
}

/* 7. Newsletter Button Styles */
.button.newsletter {
   display: inline-flex;
   align-items: center;
   padding: 0.8rem 1.5rem;
   border: 2px solid #fff;
   background: transparent;
   color: #fff;
   text-transform: uppercase;
   font-size: clamp(1rem, 2.5vw, 2rem);
   text-decoration: none;
}

.button.newsletter i {
   font-size: 2.5rem;
   margin-right: 0.75rem;
}

h1.product_title.entry-title {
   margin-top: 0;
}

ul#menu-lablec-menu li a {
   position: relative;
   display: inline-block;
   text-decoration: none;
   color: inherit;
   padding-bottom: 0.25rem;
   transition: color 0.2s ease;
}

ul#menu-lablec-menu li a::after {
   content: "";
   position: absolute;
   bottom: 0;
   left: 0;
   height: 2px;
   width: 0;
   background-color: #ffffff;
   transition: width 0.3s ease;
}

ul#menu-lablec-menu li a:hover::after {
   width: 100%;
}

.button.newsletter .newsletter-icon {
   width: 1.5rem;
   height: 1.5rem;
   margin-right: 0.75rem;
}

@media (max-width: 500px) {
   .col-xxl-4.col-xl-4.col-lg-4.col-md-12.col-sm-12.left {
      justify-content: center;
      display: flex;
      transition: 0.3s;
   }
   .col-xxl-4.col-xl-4.col-lg-4.col-md-12.col-sm-12.right {
      justify-content: center;
      margin-top: 5rem;
      transition: 0.3s;
   }
}

/* 8. Shop Element Rules: Featured Items, Product Grid, and Cards */
:root {
   --secondary-color: #f5f5f5;
   --text-color: #333;
   --bg-color: #fff;
   --radius: 0.5rem;
   --transition: 0.3s ease;
}

.featured-items,
.featured-items * {
   box-sizing: border-box;
   margin: 0;
   padding: 0;
   text-decoration: none;
}

h1.second-h1 {
    text-align: center;
    margin-bottom: 2.5rem;
}

.featured-items {
   padding: 2rem 1rem;
}

.featured-items h2 {
   margin-bottom: 1.5rem;
   color: var(--text-color);
   text-align: center;
}

form.woocommerce-ordering {
   margin-bottom: 2rem;
}

.woocommerce.columns-4 .products {
   display: grid;
   grid-gap: 1.5rem;
   list-style: none;
}

.products .product {
   background-color: var(--bg-color);
   overflow: hidden;
   transition: transform var(--transition), box-shadow var(--transition);
   display: flex;
   flex-direction: column;
   /* max-width: 75%; */
}

/* --- PRODUCT FLIP --- */

.product-image-flip {
   perspective: 1000px;
   position: relative;
   overflow: hidden;
   width: 100%;
   aspect-ratio: 1;
}

.flip-container {
   position: relative;
   width: 100%;
   height: auto;
}

.flipper {
   transition: transform 0.6s;
   transform-style: preserve-3d;
   position: relative;
}

.flip-container:hover .flipper {
   transform: rotateY(180deg);
}

.front,
.back {
   backface-visibility: hidden;
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
}

.product-image-flip img {
   width: 100%;
}

.front {
   z-index: 2;
}

.back {
   transform: rotateY(180deg);
}
header.page-header {
   text-align: center;
   text-transform: uppercase;
}

.woocommerce-loop-product__title {
   font-size: 1.125rem;
   font-weight: 600;
   color: var(--text-color);
   padding: 1rem;
   flex-grow: 1;
}

.star-rating {
   margin-bottom: 0.5rem;
   color: #000000;
}

.price {
   font-size: 2rem;
   font-weight: 500;
}

@media (min-width: 480px) {
   .price {
      font-size: 2.5rem;
   }
}

@media (min-width: 768px) {
   .price {
      font-size: 3rem;
   }
}

@media (min-width: 1200px) {
   .price {
      font-size: 3.5rem;
   }
}

/* Responsive, fluid price font-size */
.price .woocommerce-Price-amount {
   line-height: 1.2;
}

.button.add_to_cart_button {
   display: block;
   text-align: center;
   padding: 0.75rem;
   margin: 0 1rem 1rem;
   background-color: var(--primary-color);
   color: #fff;
   text-decoration: none;
   border-radius: var(--radius);
   transition: background-color var(--transition);
}

.button.add_to_cart_button:hover {
   background-color: darken(var(--primary-color), 10%);
}

/* 9. Product Flip Effects */
/* (Covered in Shop Element Rules) */

/* 10. Product Page Layout and Thumbnails */
ul.products li.product {
   text-align: center;
}

ul.products li.product a.button,
a.button.wc-backward,
.filter-product-container a.button.ajax_add_to_cart,
a.read-more {
   text-transform: uppercase;
   background: transparent;
   border: 2px solid #000;
   border-radius: 0;
   padding: 0.75em 1.5em;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   transition: background 0.2s, color 0.2s;
   color: #111;
}
ul.products li.product a.button,
a.button.wc-backward,
.filter-product-container a.button.ajax_add_to_cart::after,
.upsell-item .button::after {
   font-family: "Font Awesome 6 Free";
   font-weight: 900;
   content: "\f290";
   margin-left: 0.5em;
   display: inline-block;
   vertical-align: middle;
}

ul.products li.product a.button,
a.button.wc-backward,
.filter-product-container a.button.ajax_add_to_cart {
   font-family: "pontiac";
   font-weight: 500;
}

ul.products li.product a.button:hover,
.filter-product-container a.button.ajax_add_to_cart:hover,
.upsell-item .button:hover,
a.button:hover,
a.read-more:hover {
   background: #000;
   color: #fff;
}

.woocommerce .products .star-rating {
   margin: 0 0 0.5em;
   float: none;
   margin: auto;
}

.woocommerce ul.products li.product .price {
   display: block;
   font-weight: 400;
   margin-bottom: 0.5em;
   font-size: 1.5rem;
   margin-top: 1.5rem;
   color: #111;
}

.woocommerce ul.products li.product .star-rating {
   font-size: 0.857em;
   color: #111;
}

.star-rating {
   display: inline-block;
   position: relative;
   font-size: 1.5rem;
   line-height: 1;
   text-decoration: none;
}

.star-rating::before {
   color: #ccc;
   position: relative;
   font-size: 1.5em;
}

.star-rating span {
   display: block;
   position: absolute;
   top: 0;
   left: 0;
   height: 100%;
   overflow: hidden;
   white-space: nowrap;
}

.star-rating span::before {
   color: #000000;
   font-size: 1.5em;
}

ul.products.columns-4 {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   gap: 1rem;
   margin: 0;
   padding: 0;
   list-style: none;
}

.star-rating {
   font-family: "Font Awesome 6 Free";
   font-weight: 900;
}
.star-rating::before {
   content: "\f005\f005\f005\f005\f005";
   color: #ccc;
   display: inline-block;
}
.star-rating span {
   display: inline-block;
   position: absolute;
   top: 0;
   left: 0;
   height: 100%;
   overflow: hidden;
}
.star-rating span::before {
   content: "\f005\f005\f005\f005\f005";
   color: #000000;
   display: inline-block;
}

ul.products.columns-4 li.product {
   margin: 0;
   box-sizing: border-box;
}

@media (max-width: 1024px) {
   ul.products.columns-4 {
      grid-template-columns: repeat(2, 1fr);
   }
}

@media (max-width: 768px) {
   ul.products.columns-4 {
      grid-template-columns: repeat(2, 1fr);
   }
}

@media (max-width: 480px) {
   ul.products.columns-4 {
      grid-template-columns: 1fr;
   }
}

ul.products.columns-4 li.product {
   display: flex;
   flex-direction: column;
}

ul.products.columns-4 li.product .woocommerce-LoopProduct-link {
   display: flex;
   flex-direction: column;
   flex: 1 0 auto;
}

ul.products.columns-4 li.product .button.add_to_cart_button {
   margin-top: auto;
   align-self: center;
   width: 80%;
   max-width: 240px;
   box-sizing: border-box;
}

.woocommerce span.price del {
   color: #888 !important;
   text-decoration: line-through solid #888 !important;
   text-decoration-color: #888 !important;
}

.woocommerce span.price ins {
   color: inherit !important;
   text-decoration: none !important;
}

.button.add_to_cart_button::before {
   content: none;
}

/* cart logo after text */
.button.add_to_cart_button::after {
   font-family: "Font Awesome 6 Free";
   font-weight: 900;
   content: "\f290";
   margin-left: 0.5em;
   display: inline-block;
   vertical-align: middle;
}

/* 11. Product Page Layout (Gallery and Summary) */

span.onsale {
   position: absolute;
   width: 100%;
   z-index: 1;
   text-align: center;
   padding: 0.8rem;
   background: #d2b4b4;
   color: #fff;
   font-weight: 200;
   font-size: 1.2rem;
   left: 0;
}

.woocommerce div.product {
   display: flex;
   flex-wrap: wrap;
   align-items: flex-start;
   margin-bottom: 2em;
   box-sizing: border-box;
}

.woocommerce div.product .summary {
   flex: 0 0 50%;
   max-width: 50%;
   padding-left: 1em;
   box-sizing: border-box;
}

/* Sticky at viewport widths of 1100px and above.*/
@media (min-width: 1100px) {
   .woocommerce div.product {
      position: relative;
   }

   .woocommerce div.product .woocommerce-product-gallery {
      flex: 0 0 50%;
      position: -webkit-sticky;
      position: sticky;
      top: 20px;
   }
}

/* below 1099px go back to the normal flow */

@media (max-width: 1099px) {
   .woocommerce div.product .woocommerce-product-gallery {
      position: relative;
      width: 100%;
      flex: 0 0 100%;
      max-width: 100%;
   }
   .woocommerce div.product {
      flex-direction: column;
   }
   .woocommerce div.product .woocommerce-product-gallery,
   .woocommerce div.product .summary {
      flex: 0 0 100%;
      max-width: 100%;
      padding: 0;
   }
}

.product-thumbnail img {
   display: block;
   margin: 0 auto 0.5rem;
   max-width: 150px;
   height: auto;
}

@media (min-width: 768px) {
   .product-thumbnail img {
      width: 100px;
   }
}

.woocommerce-product-gallery__wrapper {
   white-space: nowrap;
   overflow-x: auto;
   padding-bottom: 2rem;
}

.woocommerce-product-gallery__wrapper {
   display: flex;
   flex-wrap: wrap;
}

.woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image:not(:first-child) {
   display: inline-block;
   width: 100px;
   height: 100px;
   margin-right: 15px;
   vertical-align: top;
   margin-top: 10px;
}

.woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image:not(:first-child) img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   transition: transform 0.3s ease;
}

@media screen and (max-width: 480px) {
   .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image:not(:first-child) {
      width: 70px;
      height: 70px;
      margin-right: 8px;
   }
}

.csomagajanlo {
   background-color: #f7f7f7;
   padding: 2rem;
   margin: 2rem 0;
   border-radius: 0.25rem;
}

.csomagajanlo > h3 {
   font-size: 1.5rem;
   font-weight: 600;
   margin: 0 0 1rem;
}

.csomagajanlo-inner {
   display: flex;
   flex-direction: column;
   align-items: center;
   gap: 1.5rem;
}

@media (min-width: 768px) {
   .csomagajanlo-inner {
      flex-direction: row;
      align-items: flex-start;
   }
}

.csomagajanlo-inner a img {
   display: block;
   width: 45%;
   height: auto;
   object-fit: cover;
   box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
}

.csomagajanlo-inner a h4 {
   font-weight: 600;
   margin: 0 0 0.5rem;
   text-decoration: none;
   color: inherit;
   width: 50%;
}

.csomagajanlo-inner a p {
   font-size: 1.5rem;
}

.csomagajanlo-inner a {
   display: flex;
   flex-wrap: wrap;
   gap: 2rem;
}

.csomagajanlo-inner a h4 {
   font-size: 2rem;
}

.selected-review p {
   position: relative;
   font-style: italic;
   font-size: 1.1em;
   line-height: 1.5;
   padding: 1em 2em;
   margin: 0;
   color: #333;
}

.selected-review p::before,
.selected-review p::after {
   font-size: 2em;
   color: #aaa;
   font-family: serif;
   position: absolute;
}

.selected-review p::before {
   content: "“";
   top: 0;
   left: 0.2em;
}

.selected-review p::after {
   content: "”";
   bottom: 0;
   right: 0.2em;
}

/* -------------------------------
   Remove Woo hover effect inside .csomagajanlo
---------------------------------*/
.csomagajanlo a {
   cursor: pointer !important;
   color: inherit !important;
   text-decoration: none !important;
   position: static !important;
}

.csomagajanlo a::after,
.csomagajanlo a:hover::after {
   content: none !important;
   display: none !important;
   width: 0 !important;
}

/* 12. Cart Styles: Layout, Tables, and Quantity Controls */
.woocommerce.empty {
   min-height: 50vh;
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
}

.wc-empty-cart-message {
   width: 100%;
   display: block;
   text-align: center;
}

.cart-empty.woocommerce-info {
   font-size: 2rem;
}

.woocommerce-cart-two-column {
   display: block;
   margin: 0 auto;
   padding: 1rem;
}

.cart-left,
.cart-right {
   width: 100%;
}

@media (min-width: 768px) {
   .woocommerce-cart-two-column {
      display: flex;
      align-items: flex-start;
      gap: 2rem;
   }
   .cart-left {
      width: 65%;
      overflow-x: auto;
   }
   .cart-right {
      width: 35%;
   }
}

.csomagajanlo {
   background-color: #f5f5f5;
   padding: 2rem 1rem;
}
.csomagajanlo h3 {
   font-size: 2rem;
   font-weight: 700;
   text-transform: uppercase;
   margin: 0 0 1.5rem;
}

.package-recommendation-inner {
   display: flex;
   align-items: center;
   gap: 2rem;
}

.package-image {
   flex: 0 0 auto;
}
.package-image img {
   display: block;
   max-width: 100%;
   box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
}

.package-details {
   flex: 1 1 auto;
   text-align: left;
}
.package-details h4 {
   font-size: 1.5rem;
   font-weight: 700;
   margin: 0 0 1rem;
   text-transform: capitalize;
}
.package-contents p {
   margin: 0 0 0.5rem;
   font-weight: 600;
}
.package-contents ul {
   margin: 0 0 1.25rem 1.5rem;
   padding: 0;
}
.package-contents ul li {
   margin-bottom: 0.5rem;
   line-height: 1.4;
}

.package-details a {
    margin-top: -.6rem;
}

.package-contents ul li a {
    font-weight: 100;
    padding: 0;
}

.package-details > p {
   margin: 1rem 0;
}
.package-details .strike {
   text-decoration: line-through;
   opacity: 0.6;
   margin-right: 1rem;
}
.package-details .amount {
   font-size: 1.5rem;
   font-weight: 700;
}
.package-details .single_add_to_cart_button {
   display: inline-block;
   margin-top: 1rem;
   padding: 0.75rem 1.5rem;
   background-color: #000;
   color: #fff;
   text-transform: uppercase;
   font-size: 1rem;
   letter-spacing: 0.05em;
   border: none;
   cursor: pointer;
   transition: opacity 0.2s ease;
}
.package-details .single_add_to_cart_button:hover {
   opacity: 0.8;
}

@media (max-width: 768px) {
   .package-recommendation-inner {
      flex-direction: column;
      text-align: center;
   }
   .package-image {
      margin-bottom: 1.5rem;
   }
   .package-details h4 {
      margin-top: 0;
   }
   .package-details .package-contents ul {
      margin-left: 0;
      display: inline-block;
   }
}

.package-recommendation-inner {
   display: flex;
   flex-wrap: wrap;
   gap: 2rem;
   align-items: flex-start;
}
.package-image {
   flex: 0 1 100%;
   max-width: 40%;
   min-width: 200px;
   margin-top: 0;
}

.package-image img {
   width: 100%;
   height: auto;
   display: block;
}

.package-details {
   flex: 1 1 300px;
   min-width: 220px;
   text-align: left;
}

@media (max-width: 768px) {
   .package-recommendation-inner {
      flex-direction: column;
      text-align: center;
   }
   .package-image,
   .package-details {
      flex: 1 1 100%;
      max-width: 100%;
      min-width: 0;
   }
   .package-image {
      margin-bottom: 1.5rem;
   }
   .package-details .package-contents ul {
      margin-left: 0;
      display: inline-block;
   }
}

.shop_table {
   width: 100%;
   border-collapse: collapse;
}
.shop_table th,
.shop_table td {
   padding: 0.75rem 0.5rem;
   vertical-align: middle;
   text-align: left;
   text-transform: uppercase;
}
.shop_table thead {
   border-bottom: 2px solid #ddd;
   border-top: 2px solid #ddd;
}

td.product-name {
   display: flex;
   align-items: center;
}

.product-name a img {
   display: block;
   margin: 0 auto 0.5rem;
   max-width: 150px;
   height: auto;
}

td.product-name a:last-child {
   margin-left: 3rem;
}

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

.woocommerce-orders-table__cell-order-actions {
   display: flex;
   flex-direction: column;
   gap: 2rem;
}

.woocommerce-orders-table__cell-order-actions .woocommerce-button {
   display: block;
   margin: 0;
   color: #fff;
}

.woocommerce-orders-table__cell-order-actions .woocommerce-button:hover {
   background:#fff;
}

.woocommerce div.quantity {
   margin: auto;
   justify-content: center;
}

.woocommerce .quantity button.minus,
.woocommerce .quantity button.plus {
   width: 3rem;
   height: 3rem;
   background: #f5f5f5;
   border: none;
   font-size: 1.2rem;
   color: #333;
   cursor: pointer;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   user-select: none;
}
.woocommerce .quantity button.minus {
   margin-right: 0.5rem;
}
.woocommerce .quantity button.plus {
   margin-left: 0.5rem;
}

.woocommerce .quantity .qty {
   width: 3rem;
   height: 3rem;
   text-align: center;
   font-size: 1rem;
   border: none;
   padding: 0;
   margin: 0;
   background: none;
}

/* 13. Cart Sidebar and Totals */
.cart-collaterals {
   background: #fafafa;
   padding: 1rem;
   border: 1px solid #eee;
   border-radius: 4px;
}
.cart-collaterals h2 {
   margin-top: 0;
   font-size: 1.2rem;
   border-bottom: 1px solid #ddd;
   padding-bottom: 0.5rem;
}

.cart-right .shop_table {
   width: 100% !important;
   table-layout: fixed;
   border-collapse: collapse;
}
.cart-right .shop_table th,
.cart-right .shop_table td {
   /* padding: 0.5rem 0.75rem; */
   border: none;
   vertical-align: middle;
}
.cart-right .shop_table th {
   text-align: left;
   width: 50%;
   font-weight: 600;
}
.cart-right .shop_table td {
   text-align: right;
}

.cart_totals table {
   width: 100%;
   border-collapse: collapse;
   margin-top: 1rem;
}
.cart_totals th,
.cart_totals td {
   padding: 0.5rem 0;
}
.cart_totals tr:not(.order-total) th {
   font-weight: normal;
}
.cart_totals tr.order-total th,
.cart_totals tr.order-total td {
   font-weight: bold;
   /* font-size: 1.1rem; */
}

.cart-right {
   background: #fff;
   padding: 2rem;
   border-radius: 8px;
   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);
   display: flex;
   flex-direction: column;
   gap: 1.5rem;
}

.cart-right h2 {
   font-size: 1.75rem;
   text-transform: uppercase;
   text-align: center;
   margin: 0;
   color: #111;
}

p.woocommerce-shipping-destination {
   margin-top: 0;
}
tr.order-total td {
   display: flex;
   align-items: center;
}

small.includes_tax {
   margin-top: 1.2rem;
}

.cart-right .cart_totals tr {
   display: flex;
   justify-content: space-between;
   align-items: center;
   /* padding: 0.5rem 0; */
}

.cart-right .cart_totals tr.shipping td {
   display: flex;
   flex-direction: column;
   align-items: flex-end;
   gap: 0.25rem;
}
.cart-right .cart_totals tr.shipping li {
   list-style: none;
   width: 100%;
   display: flex;
   justify-content: space-between;
   padding-left: 1rem;
   display: inline;
}
.cart-right .cart_totals tr.shipping th {
   text-align: left;
}

.coupon-sidebar {
   border: 2px solid #000;
   padding: 1rem 1.5rem;
   text-transform: uppercase;
}
.coupon-sidebar .input-text {
   width: 100%;
   border: none;
   outline: none;
   font-size: 1rem;
   text-transform: uppercase;
   border-bottom: 1px solid black;
}
.coupon-sidebar .apply-coupon-button {
   /* hidden if needed */
}

.cart-right .divider {
   height: 4px;
   background: #000;
   border: none;
   margin: 0;
}

.woocommerce .wc-proceed-to-checkout .checkout-button,
.cart-left .button,
.coupon-sidebar .apply-coupon-button {
   display: block;
   width: 100%;
   padding: 1rem;
   background: #000;
   color: #fff;
   text-transform: uppercase;
   font-size: 1rem;
   text-align: center;
   border: none;
   transition: opacity 0.3s ease;
   margin-top: auto;
   font-family: "Pontiac";
   border: 1px solid #000;
}
.woocommerce .wc-proceed-to-checkout .checkout-button:hover {
   opacity: 0.8;
}

.cart-right .button,
.cart-left .button {
   width: 100%;
   margin-top: 0.5rem;
   cursor: pointer;
}

.woocommerce a {
   color: #111;
   font-weight: 600;
   position: relative;
}

button.single_add_to_cart_button.button.alt.package-recommendation {
    background: #fff;
    color: #111;
}

button.single_add_to_cart_button.button.alt.package-recommendation:hover {
    background: #000000;
    color: #ffffff;
    transition:.3s;
}

.woocommerce a {
   position: relative;
   display: inline-block;
   text-decoration: none;
   padding-bottom: 1rem;
   transition: color 0.2s ease;
}
/*
.woocommerce a::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  height: 2px;
  width: 0;
  background-color: #000;    
  transition: width 0.3s ease;
}
*/

.woocommerce a:hover {
   color: #000;
}

a.button.wc-backward {
   color: #000;
   background: #ffffff;
}

a.button.wc-backward:hover {
   color: #ffffff;
   background: #111;
}

.woocommerce a:hover::after {
   /* width: 100%; */
}

/* WooCommerce product image sale badge positioning */
.woocommerce-product-gallery__image {
   display: flex;
   justify-content: center;
   align-items: center;
   position: relative;
   width: 100%;
}

.woocommerce-product-gallery__image > a {
   flex: 1;
   display: block;
   width: 100%;
}

.woocommerce-product-gallery__image > a img {
   display: block;
   width: 100%;
   height: auto;
}

.woocommerce-product-gallery__image .onsale {
   position: absolute;
   top: 0.5rem;
   right: 0.5rem;
   background-color: rgba(255, 192, 203, 0.8);
   color: #ffffff;
   font-weight: bold;
   font-size: 1rem;
   padding: 0.25em 0.6em;
   border-radius: 0.25rem;
   text-transform: uppercase;
   line-height: 1;
   white-space: nowrap;
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
   pointer-events: none;
   z-index: 10;
}


th.product-quantity {
    display: block;
    margin-left: 25px;
}

@media (max-width: 480px) {
   .woocommerce-product-gallery__image .onsale {
      top: 0.3rem;
      right: 0.3rem;
      font-size: 0.9rem;
      padding: 0.2em 0.5em;
   }
}

@media (max-width: 768px) {
   .cart-right {
      padding: 1rem;
   }
   .cart-right .cart_totals tr {
      flex-wrap: wrap;
   }
}


@media (max-width: 998px) {

   body.woocommerce-account table.account-orders-table {
     width: 100%;
     display: block;
     overflow-x: auto;       
     -webkit-overflow-scrolling: touch;
     table-layout: auto;
   }
   
   body.woocommerce-account table.account-orders-table thead,
   body.woocommerce-account table.account-orders-table tbody,
   body.woocommerce-account table.account-orders-table tr {
     display: block;
     width: 100%;
   }
   

   body.woocommerce-account table.account-orders-table tr {
   }
   
   body.woocommerce-account table.account-orders-table th,
   body.woocommerce-account table.account-orders-table td {
     display: block;
     white-space: nowrap;
     padding: 0.2rem 1rem;
   }

   body.woocommerce-account table.account-orders-table thead {
      display: none;
   }
   
   body.woocommerce-account table.account-orders-table td.woocommerce-orders-table__cell-order-actions {
     padding-bottom: 1rem;
   }
   .shop_table thead {
      display: none;
   }
   .shop_table tbody tr {
      border-bottom: 1px solid #eee;
      margin-bottom: 1rem;
   }
   .shop_table tbody tr td {
      justify-content: space-between;
      flex-direction: column;
      align-items: baseline;
   }

   th.product-quantity {
    margin-left: 0;
   }

   .product-name a img {
      max-width: 100%;
   }
   .shop_table tbody tr td[data-title]::before {
      content: attr(data-title) ": ";
      flex: 1;
      font-weight: 600;
      display: none;
   }
   .shop_table tbody tr td:last-child {
      justify-content: flex-end;
      margin: auto;
   }
   td.product-name a:last-child {
      margin-left: 0;
   }
   .woocommerce-cart-two-column .cart-left .product-name img {
      display: none;
   }
   .woocommerce-cart-two-column .cart-left .quantity .minus,
   .woocommerce-cart-two-column .cart-left .quantity .plus {
      display: none !important;
   }
   .woocommerce-cart-two-column .cart-left .shop_table_responsive thead {
      display: table-header-group;
   }

   .woocommerce-cart-two-column .cart-left .quantity input.qty {
      width: 3.5rem;
      margin: 0 auto;
      text-align: right;
   }

.woocommerce-cart-two-column .cart-left .product-quantity {
  text-align: center;
  vertical-align: middle;
}
.woocommerce-cart-two-column .cart-left .quantity input.qty {
     display: inline-block;     
     margin: 0 auto;       
     width: 3.5rem;             
     padding: 0.4rem;         
     text-align: center;      
     background-color: #fff;  
     border: 1px solid #ddd;    
     
     box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1); 
   }
}

@media(max-width: 512px) {
   td.product-name {
    font-size: .9rem;
   }
   .woocommerce-cart-two-column .cart-left .quantity input.qty {
    font-size: .9rem;
   }
}

.cart_totals h2 {
   font-size: 1.2rem;
   text-align: center;
   font-weight: 400;
   margin-top: -1rem;
}

/* 14. Checkout Styles */
.account-forms {
   display: flex;
   gap: 2rem;
   flex-wrap: wrap;
   margin-bottom: 2rem;
}

.account-column {
   flex: 1 1 45%;
   max-width: 45%;
   background: #fff;
   padding: 2rem;
   border-radius: 8px;
   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);
}

.account-column__title {
   text-transform: uppercase;
   font-size: 1.5rem;
   letter-spacing: 0.05em;
   margin-bottom: 1.5rem;
   text-align: center;
   color: #2c3e50;
}


#billing_state_field {
  display: block;
}

#billing_state_field label {
  display: block;
  margin-bottom: 0.5rem;
}

#billing_state_field .woocommerce-input-wrapper {
  display: block;
}

#billing_state_field .woocommerce-input-wrapper select {
  margin-left:0
}

.form-row {
   margin-bottom: 1.25rem;
}
.form-row--wide {
   width: 100%;
}

.input-text {
   width: 100%;
   padding: 0.75rem 1rem;
   font-size: 1rem;
   border: 1px solid #ccc;
   transition: border-color 0.2s ease;
   font-family: "Pontiac";
}
.input-text:focus {
   outline: none;
   border: 1px solid rgb(255 255 255 / 60%);
   box-shadow: 0 0 8px rgba(0, 0, 0, 0.4), 0 0 12px rgba(0, 0, 0, 0.2);

   backdrop-filter: blur(4px);
   -webkit-backdrop-filter: blur(4px);
   transition: 0.3s;
}

.form-checkbox {
   display: flex;
   align-items: center;
   gap: 0.5rem;
   font-size: 0.95rem;
   color: #333;
}
.form-checkbox input[type="checkbox"] {
   width: 1rem;
   height: 1rem;
}

.lost_password {
   text-align: right;
   margin-top: 0.5rem;
}

.col-xxl-6.col-xl-6.col-lg-6.col-md-12.col-sm-12 img {
   margin-top: 1.5rem;
}

/* --------------------------------------
   LOST PASSWORD LINK: underline-hover
-------------------------------------- */

div#mlb2-25865645 {
   max-width: 800px;
   margin: auto;
}

.lost_password a,
.ml-form-embedPermissionsContent.default.privacy-policy a {
   position: relative;
   display: inline-block;
   color: #000000;
   text-decoration: none;
   padding-bottom: 0.25rem;
   transition: color 0.2s ease;
   cursor: pointer;
}

.lost_password a::after,
.ml-form-embedPermissionsContent.default.privacy-policy a::after {
   content: "";
   position: absolute;
   bottom: 0;
   left: 0;
   height: 2px;
   width: 0;
   background-color: #000;
   transition: width 0.3s ease;
}

.lost_password a:hover,
.ml-form-embedPermissionsContent.default.privacy-policy a:hover {
   color: #000;
}

.lost_password a:hover::after,
.ml-form-embedPermissionsContent.default.privacy-policy a:hover::after {
   width: 100%;
}

.button--primary {
   display: block;
   width: 100%;
   padding: 0.85rem;
   background-color: #000;
   color: #fff;
   text-transform: uppercase;
   font-size: 1rem;
   border: 2px solid #000;
   cursor: pointer;
   transition: opacity 0.3s ease;
   margin-top: 0.5rem;
   font-family: "Pontiac";
}
.button--primary:hover,
.ml-form-embedContainer .primary:hover {
   background: #fff;
   color: #000;
   transition: 0.3s;
}

.price-shipping {
   display: flex;
   align-items: center;
   flex-wrap: wrap;
}

p.shipping-time {
   flex: 1;
   font-size: 1.5rem;
   font-weight: 100;
}

p.shipping-time i {
   margin-right: 1rem;
}

/* 15. Full-Width Checkout Components */
.woocommerce form.checkout {
   width: 100% !important;
   max-width: none !important;
   margin: 0 !important;
   padding: 0 !important;
}

.coupon-toggle-wrapper,
.coupon-form {
   width: 100%;
   max-width: none;
   margin: 0 0 2rem;
}

.checkout-columns {
   width: 100% !important;
   max-width: none !important;
   margin: 0 0 2rem;
   padding: 0;
   display: block;
}

.checkout-column h3,
.order-review__heading {
   text-transform: uppercase;
   font-size: 1.25rem;
   letter-spacing: 0.05em;
   margin-bottom: 1rem;
   color: #2c3e50;
}

@media (min-width: 769px) {
   .checkout-columns {
      display: flex;
      gap: 2rem;
   }
   .checkout-column {
      flex: 0 0 50%;
      max-width: 50%;
      background: #fff;
      padding: 1.5rem;
      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
   }
}

.coupon-form .input-text {
   padding: 12px 16px;
   border: none;
   outline: none;
   background-color: rgba(255, 255, 255, 0.1);
   color: #000000;
   font-size: 16px;
   width: 100%;
   border-bottom: 1px solid;
   transition: 0.3s;
}

.coupon-form .input-text::placeholder {
   color: rgb(0 0 0 / 60%);
}

.coupon-form .input-text:focus {
   box-shadow: 0 0 15px rgb(245 249 245), 0 0 25px rgb(245 249 245), 0 0 0px rgb(255 255 255);
   background-color: rgba(255, 255, 255, 0.15);
   transition: 0.3s;
   border-bottom: 1px solid #d8d8d8;
}

/* 16. Order Confirmation Styles */

.woocommerce-notice--success {
   background-color: rgba(152, 210, 220, 0.25);
   border-left: 4px solid rgba(168, 197, 201, 0.6);
   padding: 1rem 1.5rem;
   font-size: 1rem;
   color: #2c3e50;
   margin-bottom: 1.5rem;

   backdrop-filter: blur(6px);
   -webkit-backdrop-filter: blur(6px);
   box-shadow: 0 0 12px rgba(0, 0, 0, 0.05);
}
.woocommerce-order-overview {
   list-style: none;
   background: #fff;
   padding: 1.5rem;
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}
.woocommerce-order-overview li {
   margin-bottom: 0.75rem;
   font-size: 0.95rem;
}
.woocommerce-order-overview li strong {
   float: right;
   color: #333;
}
.woocommerce-order-overview li:last-child {
   margin-bottom: 0;
}

.woocommerce-order-details {
   flex: 1 1 50%;
   background: #fff;
   padding: 1.5rem;
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}
.woocommerce-table--order-details {
   width: 100%;
   border-collapse: collapse;
}
.woocommerce-table--order-details th,
.woocommerce-table--order-details td {
   padding: 0.75rem 0;
   border-bottom: 1px solid #e5e5e5;
}
.woocommerce-table--order-details thead th {
   text-transform: uppercase;
   font-weight: 600;
   font-size: 0.95rem;
   text-align: left;
}
.woocommerce-table--order-details tfoot th {
   font-weight: 700;
}

.order_actions .woocommerce-button,
.woocommerce-order-details__title + .woocommerce-table--order-details .view {
   display: inline-block;
   margin-top: 1rem;
   background: #000;
   color: #fff !important;
   padding: 0.6rem 1.2rem;
   text-transform: uppercase;
   transition: opacity 0.3s ease;
}
.order_actions .woocommerce-button:hover,
.woocommerce-order-details__title + .woocommerce-table--order-details .view:hover {
   opacity: 0.8;
}

.woocommerce-customer-details .addresses {
   flex: 1 1 100%;
   display: flex;
   gap: 2rem;
   margin-top: 1.5rem;
}
.woocommerce-column {
   flex: 1 1 45%;
   max-width: 45%;
   background: #fff;
   padding: 1.5rem;
   border-radius: 8px;
}
.woocommerce-column__title {
   text-transform: uppercase;
   font-size: 1.1rem;
   margin-bottom: 1rem;
   color: #2c3e50;
}
.woocommerce-column address {
   font-size: 0.95rem;
   line-height: 1.4;
}
.woocommerce-customer-details--phone,
.woocommerce-customer-details--email {
   margin-top: 0.5rem;
   font-size: 0.95rem;
}
/* 17. Product Details Table */
table.product-details {
   width: 100% !important;
   table-layout: fixed !important;
   margin: 1.5em 0;
}
table.product-details tr {
   display: table-row !important;
   background-color: #f7f7f7 !important;
}
table.product-details td {
   display: table-cell !important;
   padding: 12px 16px !important;
   border: none !important;
}
table.product-details td:first-child {
   width: 30% !important;
   font-weight: 600;
}

.woocommerce div.product form.cart {
   margin-top: 1.5em;
   display: flex;
}

@media (max-width: 480px) {
  .product-details td {
    font-size: 13px;
    padding: 5px 6px;
    word-break: break-word;
  }
   table.product-details td:first-child {
    width: 38%!important;
  }
}

.woocommerce div.product form.cart .quantity .minus,
.woocommerce div.product form.cart .quantity .plus {
   width: 3em;
   height: 3em;
   background-color: #f2f2f2;
   border: none;
   font-size: 1.5rem;
   line-height: 1;
   text-align: center;
   cursor: pointer;
}

.woocommerce div.product form.cart .quantity input.qty {
   width: 3em;
   height: 3em;
   margin: 0 0.5em;
   padding: 0;
   background-color: #f2f2f2;
   border: none;
   text-align: center;
   font-size: 1rem;
}

.single_add_to_cart_button,
.woocommerce button.single_add_to_cart_button {
   background-color: #000;
   color: #fff;
   text-transform: uppercase;
   font-weight: 500;
   font-size: 1.4rem;
   border: 2px solid #000;
   padding: 0 2em;
   height: 3em;
   line-height: 2em;
   cursor: pointer;
   transition: opacity 0.2s;
   font-family: "Pontiac";
   flex: 2;
   position: relative;
}

.single_add_to_cart_button,
.woocommerce button.single_add_to_cart_button:hover {
   background: #fff;
   color: #000;
   transition: 0.3s;
}

.single_add_to_cart_button,
.woocommerce button.single_add_to_cart_button::after {
   font-family: "Font Awesome 6 Free";
   font-weight: 900;
   content: "\f290";
   margin-left: 0.5em;
   display: inline-block;
   vertical-align: middle;
}

.single_add_to_cart_button:hover {
   opacity: 0.8;
}

.woocommerce div.product form.cart .quantity .minus,
.woocommerce div.product form.cart .quantity .plus {
   display: inline-flex !important;
   align-items: center !important;
   justify-content: center !important;
   width: 3em !important;
   height: 3em !important;
   background-color: #f7f7f7 !important;
   border: none !important;
   font-size: 1.5em !important;
   cursor: pointer !important;
}
.woocommerce div.product form.cart .quantity input.qty {
   width: 2.5em !important;
   text-align: center !important;
   margin: 0 0.5em !important;
   padding: 0.5em !important;
   border: none !important;
   background-color: transparent !important;
}

/* 1. Quantity field + +/- gombok */
.woocommerce div.product form.cart .quantity {
   display: inline-flex !important;
   align-items: center;
   flex: 2;
}
.woocommerce div.product form.cart .quantity .minus,
.woocommerce div.product form.cart .quantity .plus {
   display: inline-flex !important;
   align-items: center !important;
   justify-content: center !important;
   width: 3em !important;
   height: 3em !important;
   background-color: #f7f7f7 !important;
   border: none !important;
   font-size: 1.5em !important;
   cursor: pointer !important;
}
.woocommerce div.product form.cart .quantity input.qty {
   width: 2.5em !important;
   text-align: center !important;
   margin: 0 0.5em !important;
   padding: 0.5em !important;
   border: none !important;
   background-color: transparent !important;
}

.woocommerce-checkout-review-order-table {
   width: 100%;
   border-collapse: collapse;
   margin-bottom: 20px;
}
.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td {
   text-align: left;
   padding: 12px 0;
   font-size: 16px;
   border: none;
}
.woocommerce-checkout-review-order-table thead th {
   font-weight: 600;
   font-size: 18px;
   border-bottom: 1px solid #ddd;
}
.woocommerce-checkout-review-order-table tfoot th,
.woocommerce-checkout-review-order-table tfoot td {
   font-weight: bold;
   font-size: 18px;
}
.woocommerce-checkout-review-order-table .order-total td {
   font-size: 20px;
}
.woocommerce-checkout-review-order-table .includes_tax {
   display: block;
   font-size: 12px;
   color: #777;
   margin-top: 5px;
}

/* 3. Place order gomb */
#place_order,
.checkout-button.button.alt {
   width: fit-content;
   background-color: #000;
   color: #fff;
   font-weight: bold;
   font-size: 15px;
   text-transform: uppercase;
   padding: 14px 20px;
   border: none;
   border-radius: 0;
   transition: background-color 0.3s ease;
   font-family: "pontiac";
   cursor: pointer;
}

select.custom-phone-select,
input.custom-phone-number,
select#billing_state {
   box-sizing: border-box;
   font-size: 1rem;
   line-height: 1.5;
   padding: 0.5rem 0.75rem;
   height: 2.5rem;
   vertical-align: middle;
   border: 1px solid #ccc;
}

select#billing_state {
   margin-left: 1rem;
}

select.custom-phone-select,
select#billing_state {
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
   background-image: url("data:image/svg+xml;charset=…");
   background-repeat: no-repeat;
   background-position: center right 0.5rem;
   width: 100%;
}

select[name="billing_phone_area_code"],
input[name="billing_phone_number"],
select#billing_state {
   box-sizing: border-box;
   font-size: 1rem;
   line-height: 1.5;
   padding: 0.5rem 0.75rem;
   height: 2.5rem;
   vertical-align: middle;
   border: 1px solid #ccc;
}

select[name$="_area_code"],
input[name$="_phone_number"] {
   box-sizing: border-box;
   font-size: 1rem;
   line-height: 1.5;
   padding: 0.5rem 0.75rem;
   height: 2.5rem;
   vertical-align: middle;
   border: 1px solid #ccc;
}

@media (max-width: 768px) {
   .woocommerce div.product form.cart .quantity .minus,
   .woocommerce div.product form.cart .quantity .plus {
      width: 2.5em !important;
      height: 2.5em !important;
      font-size: 1.25em !important;
   }
   .woocommerce div.product form.cart .quantity input.qty {
      width: 2em !important;
      margin: 0 0.4em !important;
      padding: 0.4em !important;
   }
   .single_add_to_cart_button,
   .woocommerce button.single_add_to_cart_button {
      font-size: 1rem;
   }
   p.shipping-time {
      font-size: 1.5rem;
      font-weight: 100;
   }
   .woocommerce .woocommerce-order {
      display: block;
   }
   .woocommerce-order-overview,
   .woocommerce-order-details {
      width: 100%;
      max-width: 100%;
      margin-bottom: 1.5rem;
   }
   .woocommerce-customer-details .addresses {
      display: block;
   }
   .woocommerce-column {
      width: 100%;
      max-width: 100%;
      margin-bottom: 1.5rem;
   }
   .checkout-column {
      width: 100% !important;
      max-width: 100% !important;
      margin-bottom: 2rem;
   }
   .coupon-form .form-row-first,
   .coupon-form .form-row-last {
      display: block;
      width: 100%;
      margin-right: 0;
   }
   .account-column {
      flex: 1 1 100%;
      max-width: 100%;
   }
   .account-column form {
      width: 100%;
   }
   .woocommerce-checkout-review-order-table th,
   .woocommerce-checkout-review-order-table td {
      font-size: 14px;
      padding: 10px 0;
   }
   .woocommerce-checkout-review-order-table thead th {
      font-size: 16px;
   }
   .woocommerce-checkout-review-order-table tfoot th,
   .woocommerce-checkout-review-order-table tfoot td {
      font-size: 16px;
   }
   .woocommerce-checkout-review-order-table .order-total td {
      font-size: 18px;
   }
   .woocommerce-checkout-review-order-table .includes_tax {
      font-size: 11px;
   }

   #place_order,
   .checkout-button.button.alt {
      font-size: 14px;
      padding: 12px 18px;
   }
}

@media (max-width: 550px) {
   .price-shipping {
      flex-wrap: wrap;
   }
   p.shipping-time {
      width: 100%;
      margin: auto;
      text-align: center;
   }
   .price {
      width: 100%;
      margin: 0;
      text-align: center;
   }
}

/* 480px */
@media (max-width: 480px) {
   .woocommerce div.product form.cart .quantity .minus,
   .woocommerce div.product form.cart .quantity .plus {
      width: 2em !important;
      height: 2em !important;
      font-size: 1.1em !important;
   }
   .woocommerce div.product form.cart .quantity input.qty {
      width: 1.8em !important;
      margin: 0 0.3em !important;
      padding: 0.3em !important;
   }

   .woocommerce-checkout-review-order-table th,
   .woocommerce-checkout-review-order-table td {
      font-size: 12px;
      padding: 8px 0;
   }
   .woocommerce-checkout-review-order-table thead th {
      font-size: 14px;
   }
   .woocommerce-checkout-review-order-table tfoot th,
   .woocommerce-checkout-review-order-table tfoot td {
      font-size: 14px;
   }
   .woocommerce-checkout-review-order-table .order-total td {
      font-size: 16px;
   }
   .woocommerce-checkout-review-order-table .includes_tax {
      font-size: 10px;
   }

   #place_order,
   .checkout-button.button.alt {
      font-size: 13px;
      padding: 10px 16px;
   }
}

.woocommerce-checkout-review-order-table {
   width: 100%;
   border-collapse: collapse;
   margin-bottom: 20px;
}

.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td {
   text-align: left;
   padding: 12px 0;
   font-size: 16px;
   border: none;
}

.woocommerce-checkout-review-order-table thead th {
   font-weight: 600;
   font-size: 18px;
   border-bottom: 1px solid #ddd;
}

.woocommerce-checkout-review-order-table tfoot th,
.woocommerce-checkout-review-order-table tfoot td {
   font-weight: bold;
   font-size: 18px;
}

.woocommerce-checkout-review-order-table .order-total td {
   font-size: 20px;
}

.woocommerce-checkout-review-order-table .includes_tax {
   display: block;
   font-size: 12px;
   color: #777;
   margin-top: 5px;
}

#place_order,
.checkout-button.button.alt {
   width: 100%;
   background-color: #000000;
   color: white;
   font-weight: bold;
   font-size: 15px;
   text-transform: uppercase;
   padding: 14px 20px;
   border: none;
   border-radius: 0;
   transition: background-color 0.3s ease;
   font-family: "pontiac";
   cursor: pointer;
   border: 1px solid #111;
}

#place_order:hover,
.checkout-button.button.alt:hover,
.cart-right .button:hover,
.cart-left .button:hover,
#discount-button a:hover {
   background-color: #ffffff;
   color: #111;
   transition: 0.2s;
   border-color: #111;
}

a.button.wc-forward {
   color: #fff;
}

.woocommerce-shipping-totals td {
   font-size: 14px;
   color: #222;
}

.woocommerce-shipping-methods label {
   font-weight: bold;
}

.woocommerce-privacy-policy-text {
   font-size: 13px;
   color: #555;
   margin-bottom: 15px;
}

@media screen and (max-width: 600px) {
   .woocommerce-checkout-review-order-table th,
   .woocommerce-checkout-review-order-table td {
      font-size: 15px;
   }

   #place_order,
   .checkout-button.button.alt {
      font-size: 14px;
      padding: 12px;
   }
}

.woocommerce-message:focus {
   outline: none !important;
   box-shadow: none !important;
}

.woocommerce-message {
   background-color: rgb(89 196 89 / 18%);
   color: #2d552d;
   font-size: 15px;
   margin-bottom: 2rem;
   backdrop-filter: blur(6px);
   -webkit-backdrop-filter: blur(6px);
   box-shadow: 0 0 10px rgba(0, 100, 0, 0.1);
   padding: 1em 1.5em;
   display: flex;
   align-items: center;
   justify-content: space-between;
}

ul.tabs.wc-tabs {
   padding-left: 0;
}

ul.tabs.wc-tabs li {
   display: inline;
   font-size: 1.5rem;
}

ul.tabs.wc-tabs li a {
   font-weight: 100;
   margin-right: 1rem;
}

/* 18. Variations Table Styles */
:root {
   --text-color: #333;
   --border-color: #000;
   --bg-color: #fff;
   --gap: 0.5rem;
   --transition: 0.2s ease;
}

.single-product .variations {
   width: 50%;
   background: #f7f7f7;
   margin-bottom: var(--gap);
   border-radius: 0;
}

.single-product .variations tr {
   display: flex;
   align-items: center;
   padding: var(--gap) var(--gap);
   border-bottom: 1px solid var(--border-color);
}

.single-product .variations tr:last-child {
   border-bottom: none;
}

.single-product .variations th.label {
   flex: 0 0 auto;
   margin-right: var(--gap);
}

.single-product .variations th.label label {
   font-size: 1rem;
   font-weight: 600;
   color: var(--text-color);
   margin: 0;
}

.single-product .variations td.value {
   flex: 1 1 auto;
   position: relative;
   display: flex;
   align-items: center;
   gap: var(--gap);
}

.single-product .variations select {
   flex: 1 1 auto;
   padding: 0.5rem 0.75rem;
   font-size: 1rem;
   color: var(--text-color);
   background: var(--bg-color);
   border: 1px solid var(--border-color);
   border-radius: 0;
   appearance: auto;
   -webkit-appearance: auto;
   -moz-appearance: auto;
   cursor: pointer;
   transition: border-color var(--transition), box-shadow var(--transition);
}

.single-product .variations select:hover,
.single-product .variations select:focus {
   border-color: var(--border-color);
   outline: none;
   box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.1);
}

.single-product .variations .reset_variations {
   flex: 0 0 auto;
   font-size: 0.9rem;
   color: var(--border-color);
   text-decoration: none;
   background: transparent;
   padding: 0.4rem 0.8rem;
   border: 1px solid var(--border-color);
   border-radius: 0;
   transition: background var(--transition), color var(--transition);
}

.single-product .variations .reset_variations:hover {
   background: var(--border-color);
   color: var(--bg-color);
   text-decoration: none;
}

@media (max-width: 480px) {
   .single-product .variations tr {
      flex-direction: column;
      align-items: flex-start;
   }
   .single-product .variations td.value {
      margin-top: var(--gap);
   }
   .single-product .variations th.label {
      margin-right: 0;
   }
}

/* 19. Lightbox (Magnific Popup) Styles */
.mfp-wrap {
   background: rgba(0, 0, 0, 0.8);
   opacity: 0;
   animation: overlayFadeIn 0.3s forwards;
   display: flex;
   align-items: center;
   justify-content: center;
   height: 100%;
   position: absolute;
   z-index: 199;
   width: 100%;
}

.mfp-container {
   position: relative;
   max-width: 90%;
   max-height: 90%;
   overflow: hidden;
   box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
   background: #000;
}

.mfp-img {
   display: block;
   max-width: 100%;
   max-height: 100%;
   transform: scale(0.8);
   opacity: 0;
   animation: imageZoomIn 0.4s 0.1s forwards;
}

.mfp-close {
   position: absolute;
   top: 12px;
   right: 12px;
   width: 32px;
   height: 32px;
   background: rgba(255, 255, 255, 0.9);
   border: none;
   border-radius: 50%;
   color: #333;
   font-size: 22px;
   line-height: 32px;
   text-align: center;
   cursor: pointer;
   transition: background 0.2s, transform 0.2s;
   box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
   z-index: 10;
}

.mfp-close:hover,
.mfp-close:focus {
   background: #fff;
   transform: scale(1.1);
   color: #111;
}

.mfp-bottom-bar {
   position: absolute;
   left: 0;
   bottom: -60px;
   width: 100%;
   background: rgba(0, 0, 0, 0.6);
   color: #fff;
   padding: 10px 16px;
   box-sizing: border-box;
   display: flex;
   justify-content: space-between;
   align-items: center;
   animation: bottomBarSlideUp 0.3s 0.5s forwards;
}

.mfp-title {
   font-size: 1rem;
   font-weight: 500;
   text-shadow: 0 1px 3px rgba(0, 0, 0, 0.7);
}

.mfp-counter {
   font-size: 0.9rem;
   opacity: 0.8;
}

.mfp-preloader {
   opacity: 0;
   display: none !important;
}

@keyframes overlayFadeIn {
   to {
      opacity: 1;
   }
}

@keyframes imageZoomIn {
   to {
      transform: scale(1);
      opacity: 1;
   }
}

@keyframes bottomBarSlideUp {
   to {
      bottom: 0;
   }
}

.mfp-wrap.mfp-removing {
   animation: overlayFadeOut 0.3s forwards;
}

@keyframes overlayFadeOut {
   to {
      opacity: 0;
   }
}

.mfp-wrap.mfp-removing .mfp-img {
   animation: imageZoomOut 0.3s forwards;
}

@keyframes imageZoomOut {
   to {
      transform: scale(0.8);
      opacity: 0;
   }
}

.mfp-wrap.mfp-removing .mfp-bottom-bar {
   animation: bottomBarSlideDown 0.3s forwards;
}

@keyframes bottomBarSlideDown {
   to {
      bottom: -60px;
   }
}

.mfp-wrap.mfp-ready .mfp-preloader {
   display: none !important;
}

/* 20. Review Form and Footer Styles */
#review_form_wrapper {
   padding: 2rem 1rem;
}

@media (max-width: 768px) {
   #review_form_wrapper {
      padding: 1.5rem 1rem;
   }
}

#review_form {
   max-width: 100%;
   margin-left: auto;
   margin-right: auto;
}

.comment-respond {
   background-color: #fff;
   padding: 2rem;
   border-radius: 0.25rem;
   box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
}

@media (max-width: 768px) {
   .comment-respond {
      padding: 1.5rem;
   }
}

.comment-reply-title {
   font-size: 1.75rem;
   font-weight: 500;
   text-transform: uppercase;
   margin-bottom: 1rem;
   color: #2c3e50;
}

.comment-reply-title small a {
   font-size: 0.875rem;
   text-transform: none;
}
.comment-reply-title small a:hover {
   text-decoration: underline;
}

.comment-form-rating {
   margin-bottom: 1.5rem;
}

.comment-form-rating label {
   display: block;
   font-size: 1rem;
   font-weight: 600;
   margin-bottom: 0.5rem;
   color: #333;
}

.comment-form-rating .stars {
   display: flex;
   gap: 0.5rem;
}

.comment-form-rating .stars a {
   display: inline-block;
   font-size: 2rem;
   color: #ccc;
   text-decoration: none;
   transition: color 0.2s ease;
}

.comment-form-rating .stars a:hover,
.comment-form-rating .stars a[aria-checked="true"] {
   cursor: pointer;
}

.comment-form-rating select {
   display: none !important;
}

.comment-form-comment {
   margin-bottom: 1.5rem;
}

.comment-form-comment label {
   display: block;
   font-size: 1rem;
   font-weight: 600;
   margin-bottom: 0.5rem;
   color: #333;
}

.comment-form-comment textarea {
   width: 100%;
   padding: 0.75rem 1rem;
   font-size: 1rem;
   border: 1px solid #ccc;
   resize: vertical;
   min-height: 150px;
   transition: border-color 0.2s ease, box-shadow 0.2s ease;
   font-family: "Pontiac";
}

.comment-form-comment textarea:focus {
   outline: none;
   border-color: #000000;
   box-shadow: 0 0 0 2px rgba(52, 152, 219, 0.2);
}

.form-submit {
   text-align: right;
}

.form-submit .submit {
   background-color: #000;
   color: #fff;
   text-transform: uppercase;
   font-size: 1rem;
   font-weight: 600;
   padding: 0.75rem 1.5rem;
   border: 2px solid;
   transition: background-color 0.2s ease;
   cursor: pointer;
   font-family: "Pontiac";
}

.form-submit .submit:hover {
   background-color: #ffffff;
   color: #000000;
   transition: 0.3s;
}

input[type="hidden"] {
   display: none;
}

@media (max-width: 768px) {
   .comment-form-rating .stars a {
      font-size: 1.75rem;
   }

   .comment-form-comment textarea {
      min-height: 120px;
   }

   .form-submit {
      text-align: center;
   }
}

footer#colophon {
   background: #111;
   display: flex;
}

.footer-flex {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   justify-content: space-between;
   margin: 2rem 0;
}

.footer-flex__item {
   flex: 1 1 100%;
   text-align: center;
   padding: 0.5rem;
}

ul#menu-lablec-menu li {
   display: flex;
   text-align: left;
}

ul#menu-lablec-menu li a {
   color: #fff;
   text-decoration: none;
   font-size: 1.6rem;
   text-transform: uppercase;
   line-height: 2;
}

.footer-flex__item--right img {
   max-width: 250px;
}

@media (min-width: 768px) {
   .footer-flex__item {
      flex: 0 1 calc(33.333% - 1rem);
   }
   .footer-flex__item--left {
      text-align: left;
   }
   .footer-flex__item--center {
      text-align: left;
   }
   .footer-flex__item--right {
      text-align: right;
   }
}

.footer-flex .button.newsletter {
   display: inline-flex;
   align-items: center;
   gap: 0.5rem;
   padding: 0.75rem 1.5rem;
   border-radius: 0;
   background: #111;
   border: 2px solid #fff;
   color: #fff;
}

.footer-flex .button.newsletter:hover {
   background: #fff;
   transition: 0.3s;
   color: #000;
}

/* 21. Toast Notification Container */
#ciyo-add-to-cart-toast {
   position: fixed;
   bottom: 2rem;
   left: 50%;
   transform: translateX(-50%) translateY(100%);
   background-color: #333;
   color: #fff;
   padding: 1rem 1.5rem;
   border-radius: 0.5rem;
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
   opacity: 0;
   z-index: 9999;
   font-size: 1rem;
   font-weight: 500;
   pointer-events: none;
   transition: transform 0.4s ease, opacity 0.4s ease;
}

#ciyo-add-to-cart-toast.show {
   transform: translateX(-50%) translateY(0);
   opacity: 1;
}

@media (max-width: 768px) {
   #ciyo-add-to-cart-toast {
      width: 90%;
      padding: 0.75rem 1rem;
      font-size: 0.95rem;
   }
   #ciyo-add-to-cart-toast.show {
      transform: translateX(-50%) translateY(0);
   }
}

/* --- kacsalla --- */

/* --- LANDING ---*/

.video-container {
   width: 100%;
   height: 60vh;
   overflow: hidden;
   position: relative;
}
.video-container video {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   min-width: 100%;
   min-height: 100%;
   object-fit: cover;
   pointer-events: none;
   width: 100%;
}
div#videotext {
   position: relative;
   top: 30%;
   left: 50%;
}
#videotext {
   position: absolute;
   top: 20%;
   left: 50%;
   transform: translateX(-50%);
   width: 100vw;
   max-width: 90%;
   padding: 0 1rem;
   display: flex;
   flex-direction: column;
}
#videotext h2 {
   margin: 0.3em 0;
   font-size: clamp(1rem, 4vw, 4rem);
   line-height: 1.2;
   word-wrap: break-word;
   hyphens: auto;
   white-space: normal;
}
#videotext h2:last-child {
   align-self: flex-end;
   text-align: right;
   font-size: clamp(1rem, 2.5vw, 4rem);
}
img.mobile-image {
   display: none;
}
@media (max-width: 991px) {
   img.mobile-image {
      display: block;
   }
   img.desktop-image {
      display: none;
   }
}

/* --- FILTERS --- */

span.tag {
   background: #000;
   border-radius: 5px;
   color: #fff;
   padding: 5px 10px;
   margin-left: 17px;
   display: inline-block;
   margin-bottom: 17px;
}

.tags > a.button {
   display: block;
   margin-top: 1rem;
}

.col-md-6.col-12.tags h4 {
   margin-top: 0;
   margin-left: 15px;
   margin-top: 15px;
}
li.ingredient {
   list-style: none;
}

.ingredient h3 i.fa-caret-down {
   display: none;
}
.ingredient-content h3 {
   margin: 0.25rem 0;
}
ul.filter-products li {
   list-style: none;
}
.filter-product-container {
   display: flex;
   flex-wrap: wrap;
}

.filter-product-container .product-title {
   flex: 1; /* text-align: center; */
}
.filter-product-container .product-button {
   /* width: 35%; */
}

.product-title > p.price {
   margin-left: 15px;
   margin-top: 0;
}

.filter-product-container .product-title p.price {
   font-size: 1rem;
}

@media (max-width: 1145px) {
   .filter-product-container .product-title {
      text-align: center;
   }
}
/* --- PRODUCT TABS --- */

ul.tabs.wc-tabs li a[aria-selected="false"] {
}

ul.tabs.wc-tabs li a[aria-selected="true"] {
   text-decoration: underline;
}

/* --- ETC --- */

span.strike {
   text-decoration: line-through;
}
#discount-button {
   margin: 0;
   bottom: 2rem;
   right: 2rem;
   position: fixed;
   z-index: 9999;
}
#discount-button a {
   background-color: #000000;
   color: #fff;
   display: block;
   font-size: 1rem;
   text-align: center;
   text-decoration: none;
   text-transform: uppercase;
   padding: 1rem 2rem;
   border: 2px solid #ffffff;
}

#discount-button .fas {
   line-height: 1.675em;
}
/* --- ICONS --- */
.icon-wrapper {
   background-color: #000000;
   margin-bottom: 2rem;
}
.icon-wrapper h4.icon-title {
   color: #ffffff;
   text-align: center;
}

/* --- FEDEZD FEL --- */

.productlink.col-md-6.col-12.d-flex.align-items-center.justify-content-md-end.justify-content-start {
   justify-content: flex-start;
}

.filter-item {
   margin: auto;
   text-align: center;
   height: 12rem;
   background-size: cover;
   background-position: center;
}
.filter-item a {
   display: block;
   height: 100%;
   padding: 2rem;
   background-color: rgba(0, 0, 0, 0.3);
}
.filter-item a h3 {
   margin: 0;
   height: 100%;
   color: #ffffff;
}
.filter-item a h3 span {
   font-size: 1.5rem;
}

.productname.col-12 {
   display: flex;
   align-items: center;
}

.productname.col-12 h2 {
    font-size: 2.8rem;
}

.productname.col-12 a.button {
   flex: 2;
   margin-left: 10.2rem;
}

@media (max-width: 767px) {
   .productname.col-12 {
      display: flex;
      flex-direction: column;
   }
   .productname.col-12 a.button {
      margin-left: 0;
   }
}

/* --- FEDEZD FEL kategoriak --- */

/* --- FILTER PRODUCTS CONTENT v2 --- */

.ingredient h3 i.fa-caret-right {
   display: inline-block;
   transition: transform 0.3s ease;
   margin-left: 5px;
}
.ingredient.open h3 i.fa-caret-right {
   transform: rotate(90deg);
}

.ingredient-content-hidden {
   max-height: 0;
   overflow: hidden;
   transition: max-height 0.4s ease;
}
.ingredient.open .ingredient-content-hidden {
   padding: 0 15px;
}
.ingredient h3 {
   cursor: pointer;
}

ul.filter-products {
   padding-left: 0;
   margin-left: 0;
   list-style: none;
   /* margin-left: 15px; */
}

.ingredients-container ul.ingredients {
   padding-left: 0;
}

ul.col-12.row.filter-products li {
   padding-left: 0;
}

ul.filter-products > li {
   display: flex;
   padding: 0;
}

.filter-product-container {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   gap: 1rem;
   padding: 1rem;
   border: 1px solid #ddd;
   background-color: #fff;
   width: 100%;
   min-height: 120px;
}

.product-image {
   flex: 0 0 120px;
}

.product-title {
   flex: 1 1 auto;
   min-width: 0;
   display: flex;
   flex-direction: column;
   justify-content: center;
}

.product-button {
   flex: 0 0 auto;
   white-space: nowrap;
}

@media (max-width: 992px) {
   .filter-product-container {
      flex-direction: row;
      padding-left: 1rem;
   }

   .product-button {
      flex-basis: 100%;
      text-align: right;
      margin-top: 0.5rem;
   }

   .product-button .button {
      width: auto;
   }
}

@media (max-width: 768px) {
   .filter-product-container {
      /* flex-direction: column; */
      align-items: stretch;
      min-height: unset;
   }

   .product-image {
      width: 100%;
      margin: 0 auto 1rem;
   }

   .product-title {
      width: 100%;
      margin-bottom: 1rem;
   }

   .product-button {
      width: 100%;
      text-align: center;
   }

   .product-button .button {
      width: 100%;
   }
}

ul.filter-products > li {
   padding-left: 0.5rem;
   padding-right: 0.5rem;
}

ul.ingredients {
   padding-left: 0;
}

.effects-wrapper .tags {
   display: flex;
   flex-wrap: wrap;
   gap: 0.5rem 1rem;
   margin: 0 -0.5rem;
   padding-left: 0;
}

.effects-wrapper .tag {
   background: #000;
   color: #fff;
   margin: 0.25rem 0.5rem;
   display: inline-block;
   font-size: 0.95rem;
   white-space: nowrap;
}

.product-content-wrapper {
   display: flex;
   gap: 2rem;
   flex-wrap: wrap;
   align-items: flex-start;
}
@media (max-width: 576px) {
   .product-content-wrapper {
      flex-direction: column;
   }
}

.effects-cta {
    text-align: center;
    font-weight: 600;
    font-size: 1.2rem;
    margin-top: 4rem;
}

.ingredient-content-hidden {
   max-height: 0;
   overflow: hidden;
   opacity: 0;
   transition: max-height 0.4s ease, opacity 0.3s ease 0.1s;
   /* margin-top: 1rem; */
   /* margin-bottom: 1rem; */
}
.ingredient.open .ingredient-content-hidden {
   opacity: 1;
}

section#product-data {
   /* margin-left: 15px; */
}

.description {
   /* margin-left: 15px; */
}

.ingredient-content.row.open {
   margin-top: 1rem;
}

.ingredient-content.row.open h3 {
   margin-bottom: 1rem;
}

.ingredient h3 {
   cursor: pointer;
   font-size: 1.5rem;
}

/* csak ez marad meg: */

/* BLOG */

#main.row {
   display: flex !important;
   flex-wrap: wrap;
   justify-content: space-between;
   margin: 0 -1rem;
}

#main.row > article {
   flex: 1 1 calc(50% - 2rem);
   margin: 0 1rem 2rem;
   max-width: calc(50% - 2rem);
}

@media (max-width: 767px) {
   #main.row > article {
      flex: 1 1 100%;
      max-width: 100%;
   }
}

#main.row > article {
   background: #fff;
   box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
   overflow: hidden;
   display: flex;
   flex-direction: column;
   transition: transform 0.2s ease, box-shadow 0.2s ease;
}

#main.row > article:hover {
   transform: translateY(-4px);
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

#main .entry-header a img {
   display: block;
   width: 100%;
   height: 250px;
   object-fit: cover;
}

#main .entry-header {
   padding: 2rem 1.5rem 0;
}
#main .entry-title {
   font-size: 1.5rem;
   margin: 0 0 0.5rem;
   margin-top: 2rem;
}
#main .entry-title a {
   color: #222;
   text-decoration: none;
}
#main .entry-title a:hover {
   color: #6c27b3;
}

#main .entry-content {
   flex: 1;
   padding: 0 1.5rem 1.5rem;
   font-size: 1rem;
   line-height: 1.6;
   color: #444;
}

#main .entry-content a.more-link {
   display: inline-block;
   margin-top: 1rem;
   font-size: 0.875rem;
   font-weight: 600;
   text-transform: uppercase;
   color: #6c27b3;
   text-decoration: none;
}
#main .entry-content a.more-link:hover {
   text-decoration: underline;
}

a.read-more {
   display: block;
   max-width: fit-content;
   margin-top: 1rem;
}

.gallery {
   display: flex;
   flex-wrap: wrap;
   gap: 10px;
   justify-content: center;
   margin-bottom: 30px;
}

.gallery-item {
   flex: 1 1 calc(25% - 10px);
   /box-sizing: border-box;
}

.gallery-item .gallery-icon {
   width: 100%;
   overflow: hidden;
}

.gallery-item img {
   width: 100%;
   height: auto;
   display: block;
}

@media (max-width: 992px) {
   .gallery-item {
      flex: 1 1 calc(33.333% - 10px);
   }
}

@media (max-width: 768px) {
   .gallery-item {
      flex: 1 1 calc(50% - 10px);
   }
}

@media (max-width: 480px) {
   .gallery-item {
      flex: 1 1 100%;
   }
}

.entry-header img.wp-post-image {
   width: 100%;
   max-width: 100%;
   height: auto;
   display: block;
   margin: 0 auto 30px;
   max-height: 100%;
   object-fit: contain;
}

/* Gallery caption overlay */

.gallery-item {
   position: relative;
   overflow: hidden;
}

.gallery-item img {
   display: block;
   width: 100%;
   height: auto;
}

.gallery-caption {
   position: absolute;
   bottom: 0;
   left: 0;
   width: 100%;
   background: rgba(0, 0, 0, 0.6);
   color: #fff;
   padding: 8px 10px;
   font-size: 0.9em;
   text-align: center;
   opacity: 0;
   transform: translateY(100%);
   transition: opacity 0.3s ease, transform 0.3s ease;
}

.gallery-item:hover .gallery-caption {
   opacity: 1;
   transform: translateY(0);
}

/* FELIRATKOZAS */

.ml-form-embedContainer .form-control {
   width: 100%;
   padding: 0.75rem 1rem;
   line-height: 1.5;
   color: #333;
   background-color: #fff;
   border: 1px solid #ddd;
   border-radius: 0;
   box-shadow: none;
   transition: border-color 0.2s ease-in-out;
   margin-top: 0.25rem;
   font-size: inherit;
}

.ml-form-embedContainer .form-control:focus {
   outline: none;
   border-color: #999;
}

.ml-form-embedContainer label {
   display: block;
   font-weight: 500;
   color: #444;
   margin-bottom: 0.25rem;
}

.custom-checkbox .custom-control {
   display: inline-flex;
   align-items: center;
   margin-bottom: 0.5rem;
}

.custom-checkbox .custom-control-label {
   margin-left: 0.5rem;
   display: inline-block;
}

.custom-checkbox .custom-control-input {
   margin: 0;
}

.ml-form-embedContainer .ml-form-fieldRow {
   margin-bottom: 1.5rem;
}

.ml-form-embedContainer .primary {
   display: inline-block;
   background-color: #000;
   color: #fff;
   font-size: 1rem;
   font-weight: 600;
   text-transform: uppercase;
   padding: 1rem 2.3rem;
   border: none;
   cursor: pointer;
   transition: background-color 0.2s ease-in-out;
   font-family: "Pontiac";
   border: 2px solid;
}

.ml-form-embedContainer .custom-checkbox,
.ml-form-embedContainer .custom-radio {
   margin-bottom: 0.5rem;
}

.ml-form-embedContainer .ml-form-embedPermissions p,
.ml-form-embedContainer .ml-form-embedContent p {
   color: #111;
   margin-top: 0.5rem;
}

section.productfilter.by-ingredients.page-content.clearfix .description {
   padding-left: 0;
}

form.ml-block-form {
   margin-bottom: 5rem;
}

section.productfilter.by-ingredients.page-content.clearfix ul.filter-product-container {
   padding-left: 15px;
}

section.productfilter.by-ingredients.page-content.clearfix .col-12.row.filter-products {
   margin-left: 15px;
}

ul.ingredients h2 {
   margin-left: 15px;
}

/* foxpost */

a#vp-woo-pont-show-map {
   font-size: 0.8rem;
   border: 2px solid;
   padding: 0.5rem;
   color: #b70100;
}

.description p {
   margin-left: 15px;
}

a#vp-woo-pont-show-map:hover {
   background: #b70100;
   color: #fff;
   transition: 0.3s;
}

/* 404  */
.error-404.not-found.text-center {
   width: 100%;
   margin: 0 auto;
   padding: 1rem;
   min-height: 50vh;
}

.error-404.not-found.text-center h1,
.error-404.not-found.text-center p {
   max-width: 800px;
   margin: 1rem auto;
}

@media (min-width: 576px) {
   .error-404.not-found.text-center {
      max-width: 540px;
      padding: 1.5rem;
   }
}

@media (min-width: 768px) {
   .error-404.not-found.text-center {
      max-width: 720px;
      padding: 2rem;
   }
}

@media (min-width: 992px) {
   .error-404.not-found.text-center {
      max-width: 960px;
      padding: 2.5rem;
   }
}

@media (min-width: 1200px) {
   .error-404.not-found.text-center {
      max-width: 1140px;
      padding: 3rem;
   }
}

@media (min-width: 1400px) {
   .error-404.not-found.text-center {
      max-width: 1320px;
      padding: 3.5rem;
   }
}

@media (min-width: 1600px) {
   .error-404.not-found.text-center {
      max-width: 1600px;
      padding: 4rem;
   }
}

.inner-content.error {
   max-width: 800px;
   margin: auto;
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
}

a.button.error {
   margin-top: 5rem;
   background: #fff;
   color: #111;
}

a.button.error:hover {
   background: #000000;
   color: #ffffff;
   transition: 0.2s;
}

h1.rolunk-heading {
    text-align: center;
    text-transform: uppercase;
}
/* cf */

.wpcf7-form .wpcf7-form-control {
  width: 100%;
  padding: 0.75rem 1rem;
  font-size: 1rem;
  line-height: 1.5;
  color: #333;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 0;       
  box-shadow: none;
  transition: border-color .2s ease-in-out;
  margin-top: .25rem;    
  box-sizing: border-box;
}


.wpcf7-form .wpcf7-form-control:focus {
  outline: none;
  border-color: #999;
}

.wpcf7-form label {
  display: block;
  font-weight: 500;
  font-size: .9rem;
  color: #444;
  margin-bottom: .25rem;
}

.wpcf7-form p {
  margin-bottom: 1.5rem;
}

.wpcf7-form .wpcf7-textarea {
  resize: vertical;
}

.wpcf7-form .wpcf7-submit {
    background-color: #000000;
    color: #fff;
    display: block;
    font-size: 1rem;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    padding: 1rem 2rem;
    border: 2px solid #ffffff;
	font-family:"Pontiac";
}

.wpcf7-form .wpcf7-submit:hover {
  background-color: #ffffff;
    color: #111;
    transition: 0.2s;
    border-color: #111;
    cursor: pointer;
}


.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.payment-required .wpcf7-response-output {
    background: #ffd4d4;
    background-color: rgba(255, 0, 0, 0.1);
    color: #a00;
    padding: 1em 1.5em;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    box-shadow: 0 0 10px rgba(255, 0, 0, 0.15);
    margin-bottom: 1.5rem;
    border: none !important;
}

.wpcf7 form .wpcf7-response-output {
	margin: 2em 0.5em 1em;
	padding: 0.2em 1em;
	border: 2px solid #00a0d2; /* Blue */
	background: #00BCD4;
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	box-shadow: 0 0 10px #00BCD4;
	color: #fff;
	border: none!Important;
	padding: 1em 1.5em;
}


.wpcf7-form .wpcf7-list-item {
  margin-bottom: .5rem;
}

div#wpcf7-f487-p38-o1 {
    max-width: 800px;
    margin: auto;
}

img.barion {
    max-width: 84%;
    margin: auto;
    display: block;
}
.vp-woo-pont-shipping-method-icons {
	display: none;
}
.woocommerce-cart ul#shipping_method li {
    margin-bottom: 12px;
    display: inline-block;
}
.woocommerce-checkout ul#shipping_method li {
    margin-bottom: 12px;
    display: block;
}

a.showcoupon {
    padding-bottom: 0;
}