/* Light accordion with burnt orange accents */
.accordion.accordion-dark {
  /* If you're on Bootstrap 5.2+ these vars will be picked up automatically */
  --bs-accordion-bg: var(--surface-color); /* panel bg */
  --bs-accordion-color: var(--color-gray-dark); /* body text */
  --bs-accordion-border-color: var(--accent-color); /* accent border */
  --bs-accordion-btn-bg: var(--surface-color); /* header bg */
  --bs-accordion-btn-color: var(--color-gray-dark); /* header text */
  --bs-accordion-active-bg: color-mix(
    in srgb,
    var(--accent-color),
    var(--color-white) 85%
  ); /* open header bg */
  --bs-accordion-active-color: var(--color-gray-dark); /* open header text */
}

/* Fallbacks + extras for consistent look across Bootstrap versions */
.accordion.accordion-dark .accordion-item {
  background-color: var(--surface-color);
  color: var(--color-gray-dark);
  border: 1px solid var(--accent-color);
}

.accordion.accordion-dark .accordion-button {
  background-color: var(--surface-color);
  color: var(--color-gray-dark);
}

.accordion.accordion-dark .accordion-button:not(.collapsed) {
  background-color: color-mix(
    in srgb,
    var(--accent-color),
    var(--color-white) 85%
  );
  color: var(--color-gray-dark);
  border-bottom: 1px solid var(--accent-color);
  box-shadow: inset 0 -1px 0 color-mix(
      in srgb,
      var(--accent-color),
      transparent 45%
    );
}

.accordion.accordion-dark .accordion-collapse {
  border-top: 1px solid var(--accent-color);
}

.accordion.accordion-dark .accordion-body {
  color: var(--color-gray-dark);
}

/* Focus state (keyboard + a11y) */
.accordion.accordion-dark .accordion-button:focus {
  border-color: var(--accent-color);
  box-shadow: 0 0 0 0.25rem rgba(182, 90, 54, 0.25);
}

/* Make the chevron icon light on dark */
.accordion.accordion-dark .accordion-button::after {
  filter: none;
}

/* Keep thumbs nicely cropped */
.object-fit-cover {
  object-fit: cover;
}

/* Optional: subtle hover lift */
.gallery-thumb {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.gallery-link:hover .gallery-thumb {
  transform: translateY(-2px);
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}

.gradient-custom {
  background: radial-gradient(
        70% 90% at 20% 0%,
        color-mix(in srgb, var(--accent-color), transparent 20%) 0%,
        transparent 60%
      ),
    radial-gradient(
        90% 90% at 80% 20%,
        color-mix(in srgb, var(--accent-hover-color), var(--color-white) 40%) 0%,
        transparent 60%
      ),
    linear-gradient(145deg, var(--color-white), var(--color-gray-light));
  background-blend-mode: multiply, screen, normal;
}

.carousel-indicators {
  border-radius: 50%;
  width: 10px;
  height: 10px;
}

.review-container {
  display: grid;
  grid-template-columns: auto auto auto;
  gap: 24px;
}

.review-card {
  border: 1px solid var(--accent-color);
  background: var(--color-white);
  color: var(--color-gray-dark);
  border-radius: 24px;
  align-items: center;
  text-align: center;
  justify-content: center;
  padding: 24px;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  transform-origin: center center;
}

.review-card:hover {
  transform: scale(1.03);
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}

.accordion-item {
  color: var(--bs-accordion-color);
  background-color: var(--bs-accordion-bg);
  border: var(--bs-accordion-border-width) solid var(--accent-color);
}
