/* Updated Button Styles - Consistent Red Color Variations Only */

/* Main button styles - keeping red theme */
.btn {
  display: inline-block;
  background: var(--gradient-primary);
  color: var(--off-white);
  padding: 1.2rem 3rem;
  border: none;
  cursor: pointer;
  transition: all 0.3s ease;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 2px;
  font-size: 1.4rem;
  position: relative;
  overflow: hidden;
  z-index: 1;
  border-radius: 4px;
  box-shadow: 0 4px 15px rgba(138, 15, 30, 0.3);
}

.btn:hover:before {
  left: 0;
}

.btn:hover {
  /* Keep text white instead of changing to dark */
  color: var(--off-white);
  transform: translateY(-3px);
  /* Updated shadow to darker red */
  box-shadow: 0 6px 20px rgba(107, 12, 23, 0.6);
}

/* FIXED: All wine card buttons now use consistent red hover */
.wine-card .btn {
  width: 100%;
  text-align: center;
  padding: 1rem 1.5rem;
  font-size: 1.3rem;
  margin-top: 1rem;
  background: linear-gradient(
    135deg,
    rgba(138, 15, 30, 0.9) 0%,
    rgba(183, 42, 56, 0.9) 100%
  );
  border: 1px solid rgba(212, 161, 82, 0.2);
  display: block;
}

.wine-card .btn.view-details {
  width: 100%;
  display: block;
  transition: all 0.3s ease;
  cursor: pointer;
}

/* FIXED: Removed the gold hover effect and made it consistent red */
.wine-card .btn:hover {
  background: linear-gradient(
    135deg,
    rgba(107, 12, 23, 0.95) 0%,
    rgba(138, 15, 30, 0.95) 100%
  );
  color: var(--off-white);
  letter-spacing: 2.5px;
}

/* FIXED: Enhanced view-details button styling - consistent red theme */
.wine-card .btn.view-details {
  width: 100%;
  display: block;
  text-align: center;
  padding: 1.2rem 1.5rem;
  font-size: 1.4rem;
  background: linear-gradient(
    135deg,
    rgba(138, 15, 30, 0.95) 0%,
    rgba(183, 42, 56, 0.95) 100%
  );
  border: 1px solid rgba(212, 161, 82, 0.3);
  color: var(--off-white);
  cursor: pointer;
  position: relative;
  z-index: 2;
  border-radius: 5px;
  text-transform: uppercase;
  letter-spacing: 2px;
  font-weight: 500;
  transition: all 0.3s ease;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
  margin-top: 1rem;
  margin-bottom: 0.5rem;
  overflow: hidden;
}

/* FIXED: Consistent red hover effect for all view-details buttons */
.wine-card .btn.view-details:hover {
  background: linear-gradient(
    135deg,
    rgba(107, 12, 23, 0.95) 0%,
    rgba(138, 15, 30, 0.95) 100%
  );
  color: var(--off-white);
  transform: translateY(-3px);
  box-shadow: 0 8px 20px rgba(107, 12, 23, 0.6);
  letter-spacing: 2.5px;
}

/* Button shine effect - keeping it neutral */
.wine-card .btn.view-details:before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.15),
    transparent
  );
  transition: 0.6s;
  z-index: 1;
}

.wine-card .btn.view-details:hover:before {
  left: 100%;
}

/* FIXED: Updated theme variables for button gradients - staying in red family */
:root {
  --btn-gradient: linear-gradient(
    135deg,
    rgba(138, 15, 30, 0.95) 0%,
    rgba(183, 42, 56, 0.95) 100%
  );
  --btn-hover-gradient: linear-gradient(
    135deg,
    rgba(107, 12, 23, 0.95) 0%,
    rgba(138, 15, 30, 0.95) 100%
  );
}

[data-theme="light"] {
  /* Light theme button gradients - staying in red family */
  --btn-gradient: linear-gradient(
    135deg,
    rgba(158, 19, 37, 0.95) 0%,
    rgba(201, 26, 48, 0.95) 100%
  );
  --btn-hover-gradient: linear-gradient(
    135deg,
    rgba(107, 12, 23, 0.95) 0%,
    rgba(138, 15, 30, 0.95) 100%
  );
}

/* Outline button styles - keep original behavior */
.btn-outline {
  background: transparent !important;
  border: 1px solid var(--accent) !important;
  color: var(--accent) !important;
  box-shadow: 0 2px 8px rgba(212, 161, 82, 0.2) !important;
}

.btn-outline:before {
  background: var(--gradient-accent) !important;
}

.btn-outline:hover {
  background: var(--gradient-accent) !important;
  color: var(--dark-bg) !important;
  border-color: var(--accent-light) !important;
  box-shadow: 0 4px 15px rgba(212, 161, 82, 0.4) !important;
}

/* Specific styling for "Inquire About Availability" buttons */
.modal-details .btn,
a[href="#contact"].btn {
  background: transparent !important;
  border: 1px solid var(--accent) !important;
  color: var(--accent) !important;
  box-shadow: 0 2px 8px rgba(212, 161, 82, 0.2) !important;
}

.modal-details .btn:before,
a[href="#contact"].btn:before {
  background: var(--gradient-accent) !important;
}

.modal-details .btn:hover,
a[href="#contact"].btn:hover {
  background: var(--gradient-accent) !important;
  color: var(--dark-bg) !important;
  border-color: var(--accent-light) !important;
  box-shadow: 0 4px 15px rgba(212, 161, 82, 0.4) !important;
}

/* CTA buttons in hero sections - only solid buttons */
.hero .btn:not(.btn-outline),
.wines-hero .btn:not(.btn-outline),
.gallery-hero .btn:not(.btn-outline),
.about-cta .btn:not(.btn-outline),
.gallery-cta .btn:not(.btn-outline) {
  background: linear-gradient(135deg, #8a0f1e 0%, #b72a38 100%);
  box-shadow: 0 5px 15px rgba(138, 15, 30, 0.4);
}

.hero .btn:not(.btn-outline):hover,
.wines-hero .btn:not(.btn-outline):hover,
.gallery-hero .btn:not(.btn-outline):hover,
.about-cta .btn:not(.btn-outline):hover,
.gallery-cta .btn:not(.btn-outline):hover {
  background: linear-gradient(135deg, #6b0c17 0%, #8a0f1e 100%);
  color: var(--off-white);
  box-shadow: 0 8px 25px rgba(107, 12, 23, 0.6);
}

/* Ensure testimonial navigation buttons stay red */
.testimonial-prev,
.testimonial-next {
  background: linear-gradient(
    135deg,
    rgba(138, 15, 30, 0.8) 0%,
    rgba(183, 42, 56, 0.8) 100%
  );
}

.testimonial-prev:hover,
.testimonial-next:hover {
  background: linear-gradient(
    135deg,
    rgba(107, 12, 23, 0.8) 0%,
    rgba(138, 15, 30, 0.8) 100%
  );
}

/* Filter buttons active state */
.filter-btn.active,
.category-tab.active {
  background: linear-gradient(
    135deg,
    rgba(138, 15, 30, 0.8) 0%,
    rgba(183, 42, 56, 0.8) 100%
  );
  color: var(--off-white);
  border-color: transparent;
  box-shadow: 0 5px 15px rgba(138, 15, 30, 0.3);
}

/* Gallery modal navigation */
.gallery-modal-prev:hover,
.gallery-modal-next:hover {
  background-color: rgba(138, 15, 30, 0.8);
  color: var(--off-white);
  transform: scale(1.1);
}

/* Theme toggle button */
.theme-toggle {
  background: var(--gradient-primary);
  box-shadow: 0 5px 15px var(--card-shadow-hover);
}

.theme-toggle:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 25px rgba(138, 15, 30, 0.4);
}