:root {
  --refresh-bg: #F4F9F9; /* Very soft health green/blue tint */
  --refresh-surface: #FFFFFF;
  --refresh-surface-alt: #F8FAFA; /* Slightly darker than surface for reviews per Preset B */
  --refresh-tone: #2E8B57; /* Sea green, evoking health and nature */
  --refresh-tone-hover: #246B43;
  --refresh-ink: #2C3E50; /* Dark slate for high readability */
  --refresh-gradient: linear-gradient(135deg, #E6F4F1 0%, #CDE8E3 100%);
  --font-display: 'Playfair Display', serif;
  --font-body: 'Mulish', sans-serif;
}

/* Base resets handled by Tailwind, custom overrides here */
html, body {
    margin: 0;
    padding: 0;
    width: 100%;
}

/* Custom CTA Button Styling to handle internal hover state */
.optive-btn-main {
    background-color: var(--refresh-tone);
    color: #FFFFFF;
    text-decoration: none;
}

.optive-btn-main:hover {
    background-color: var(--refresh-tone-hover);
    transform: translateY(-1px);
    box-shadow: 0 6px 10px -1px rgba(0, 0, 0, 0.15), 0 2px 4px -1px rgba(0, 0, 0, 0.05);
}

/* --- CSS-Only Gallery Logic --- */

/* Ensure z-index layering for slides */
.optive-slide {
    z-index: 1;
}

/* Logic: When radio is checked, find sibling tree and show respective image */
#view-1:checked ~ .optive-gallery-layout .optive-lens-area .s-1,
#view-2:checked ~ .optive-gallery-layout .optive-lens-area .s-2,
#view-3:checked ~ .optive-gallery-layout .optive-lens-area .s-3,
#view-4:checked ~ .optive-gallery-layout .optive-lens-area .s-4 {
    opacity: 1;
    z-index: 10;
}

/* Logic: Highlight active thumbnail (desktop and mobile) */
#view-1:checked ~ .optive-gallery-layout .optive-side-nav .t-1,
#view-1:checked ~ .optive-gallery-layout .optive-bottom-nav .t-1,
#view-2:checked ~ .optive-gallery-layout .optive-side-nav .t-2,
#view-2:checked ~ .optive-gallery-layout .optive-bottom-nav .t-2,
#view-3:checked ~ .optive-gallery-layout .optive-side-nav .t-3,
#view-3:checked ~ .optive-gallery-layout .optive-bottom-nav .t-3,
#view-4:checked ~ .optive-gallery-layout .optive-side-nav .t-4,
#view-4:checked ~ .optive-gallery-layout .optive-bottom-nav .t-4 {
    border-color: var(--refresh-tone);
}

/* Subtle hover effects on thumbnails */
.optive-thumb-node:hover {
    opacity: 0.85;
}

/* Hide scrollbar for mobile thumbs loop */
.optive-bottom-nav::-webkit-scrollbar {
    display: none;
}
.optive-bottom-nav {
    -ms-overflow-style: none;
    scrollbar-width: none;
}