.size-btn.active {
    background-color: #0d9488; /* teal-600 */
    color: white;
  }
    
  #addToCartBtn {
    display: inline-flex; /* Make sure it's displayed as an inline-flex element */
    visibility: visible !important; /* Ensure it's visible */
    opacity: 1 !important; /* Ensure it is not hidden with opacity */
    background-color: #0d9488; /* The background color of the button */
    color: white; /* The text color of the button */
    padding: 0.75rem 1.5rem; /* Adjust padding to fit the button size */
    border-radius: 9999px; /* Rounded corners */
    font-size: 1rem; /* Font size */
    font-weight: 600; /* Bold text */
    transition: background-color 0.3s ease, transform 0.3s ease; /* Smooth transition on hover */
    cursor: pointer; /* Change cursor to pointer */
  }

  #addToCartBtn:hover {
    background-color: #0a7f73; /* Darker teal background color on hover */
    transform: scale(1.05); /* Slightly increase button size on hover */
  }

  .tab {
    transition: background-color 0.3s, color 0.3s;
  }

  .tab:hover {
    background-color: #0d9488; /* teal-600 */
    color: white;
  }
  .size-btn.active {
    background-color: #0d9488; /* teal-600 */
    color: white;
  }

/*footer*/
 
  .ink-underline {
    position: relative;
    display: inline-block;
  }
  .ink-underline::after {
    content: "";
    position: absolute;
    left: 50%; bottom: -3px;
    width: 0; height: 2px;
    border-radius: 9999px;
    background: linear-gradient(90deg,#facc15,#fde047,#facc15);
    transform: translateX(-50%);
    transition: width .42s cubic-bezier(.22,1,.36,1), height .42s cubic-bezier(.22,1,.36,1);
  }
  .ink-underline:hover::after,
  .ink-underline:focus-visible::after {
    width: 100%; height: 3px;
  }

  [data-reveal]{opacity:0; will-change:transform,opacity;}
  @keyframes revealLeft {
    from {opacity:0; transform:translateX(-40px);}
    to   {opacity:1; transform:translateX(0);}
  }
  @keyframes revealRight {
    from {opacity:0; transform:translateX(40px);}
    to   {opacity:1; transform:translateX(0);}
  }

  .is-inview[data-reveal="left"]  {animation:revealLeft .7s cubic-bezier(.22,1,.36,1) both}
  .is-inview[data-reveal="right"] {animation:revealRight .7s cubic-bezier(.22,1,.36,1) both}

  .is-inview{animation-delay:var(--rv-delay,0s)}

  @media (prefers-reduced-motion: reduce){
    .ink-underline::after{transition:none}
    [data-reveal]{opacity:1 !important; transform:none !important; animation:none !important}
  }