/*
Theme Name: Woodgrain
Template: kadence
Version: 1.0.0
*/

/* Theme customization starts here
-------------------------------------------------------------- */
.site-header-item {
  display: flex;
  align-items: flex-end !important;
}

.product-archive-hero-section .entry-hero-container-inner {
  background-image: url('https://multiplatform.net/wp-content/uploads/2026/02/ChatGPT-Image-Feb-12-2026-10_59_20-PM-e1770972680506.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  background-attachment: fixed;
}


.entry-hero-container-inner .entry-header {
  min-height: 339px !important;
 
}

.entry-header h1 {

  color: #fff !important;
}

p.price {
  font-size: 1.25em;
	color:#b19f7a
}

/* Mouse Scroll Icon */

/* Floating Mouse Scroll Icon */
.mouse-scroll {
  position: fixed;
  right: 39px;
  bottom: 40px;
  z-index: 9999;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

.mouse-scroll.hidden {
  opacity: 0;
  visibility: hidden;
}

.mouse {
  width: 25px;
  height: 50px;
  border: 2px solid #fff;
  border-radius: 50px;
  position: relative;
}

.wheel {
  width: 7px;
  height: 7px;
  background: #fff;
  border-radius: 3px;
  position: absolute;
  top: 10px;
  left: 49%;
  transform: translateX(-50%);
  animation: scroll-down 2.2s infinite;
}

@keyframes scroll-down {
  0%   { top: 10px; opacity: 1; }
  80%  { top: 30px; opacity: 0; }
  81%  { top: 10px; opacity: 1; } /* jump back to top instantly */
  100% { top: 10px; opacity: 1; }
}

.homebuttonR, .homebuttonL {width:100%}
.homebuttonR.wp-block-buttons.is-content-justification-left {
  justify-content: center;
}
.homebuttonL.wp-block-buttons.is-content-justification-left {
  justify-content: center;
}

/* Stack quantity and cart vertically */
.variations_button {
    display: flex;
    flex-direction: column;
    gap: 10px; /* spacing between quantity and button */
}

/* Full width for quantity and button */
.variations_button .quantity,
.variations_button .single_add_to_cart_button {
    width: 100%;
    display: block;
}

/* Style quantity input container */
.variations_button .quantity {
    display: flex;
    width: 100%;
    border: 1px solid #ccc; /* optional: border for full-width container */
    border-radius: 4px;
    overflow: hidden;
}

/* Make the input field stretch */
.variations_button .quantity input[type="number"] {
    flex: 1; /* input takes remaining space */
    padding: 10px;
    border: none;
    text-align: center;
}

/* Style +/- buttons */
.variations_button .quantity input[type="button"] {
    width: 40px; /* fixed width for buttons */
    background: #eee;
    border: none;
    cursor: pointer;
    font-weight: bold;
}

/* Optional: hover effect for +/- buttons */
.variations_button .quantity input[type="button"]:hover {
    background: #ddd;
}

/* Make Add to Cart button full width */
.variations_button .single_add_to_cart_button {
    width: 100%;
    text-align: center;
    padding: 12px;
    font-size: 16px;
}


/* header toggle burgermenu */
/* Always keep container centered (no snapping) */
.site-header-item-navgation-popup-toggle {
    display: flex;
    align-items: center;
    height: 100%;
}

/* Inner container stays consistent */
.mobile-toggle-open-container {
    display: flex;
    align-items: center;
    height: 100%;
}

/* Animate the actual button */
#mobile-toggle {
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Default (before sticky) = visually TOP */
.kadence-sticky-header.item-at-start #mobile-toggle {
    transform: translateY(-20px); /* adjust this */
}

/* Sticky active = CENTER */
.kadence-sticky-header.item-is-stuck #mobile-toggle {
    transform: translateY(0);
}

/* Container setup */
#mobile-toggle {
    position: relative;
}

/* Ensure proper positioning */
#mobile-toggle {
    position: relative;
}

/* BOTH icons animate smoothly */
#mobile-toggle::before,
#mobile-toggle .kadence-svg-iconset {
transition: 
    opacity 0.50s cubic-bezier(0.4, 0, 0.2, 1),
    transform 0.50s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Hide Kadence default icon initially */
#mobile-toggle .kadence-svg-iconset {
    opacity: 0;
    transform: scale(0.8);
}

/* Your custom icon */
#mobile-toggle::before {
    content: "";
    position: absolute;
    inset: 0;

    background-image: url('/wp-content/themes/woodgrain-child/assets/img/burger-menu-standard.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 30px 30px;

    opacity: 1;
    transform: scale(1);

    filter: none !important;
}
/* 🔥 HOVER + ACTIVE (MENU OPEN) STATE */

/* Show Kadence icon */
#mobile-toggle:hover .kadence-svg-iconset,
#mobile-toggle[aria-expanded="true"] .kadence-svg-iconset {
    opacity: 1;
    transform: scale(1) rotate(0deg);
}

/* Hide + animate your icon */
#mobile-toggle:hover::before,
#mobile-toggle[aria-expanded="true"]::before {
    opacity: 0;
    transform: scale(0.8) rotate(-10deg);
}

html {
    scroll-behavior: smooth;
}

body {
    overflow-y: scroll;
}