:root {
  --nutripack-bg: #F7F7F7;
  --nutripack-surface: #FFFFFF;
  --nutripack-tone: #7EAA92;
  --nutripack-tone-hover: #5C8970;
  --nutripack-ink: #2D3748;
  --nutripack-gradient: linear-gradient(135deg, #7EAA92, #9ED2B6);
  
  --font-display: 'Fjalla One', sans-serif;
  --font-body: 'Inter', sans-serif;
  
  --radius-soft: 16px;
}

/* Hidden inputs for gallery functionality */
.hidden-radio {
    display: none;
}

/* Base thumb styles for preset B (border approach) */
.thumb-trigger {
    border: 2px solid transparent;
    box-sizing: border-box;
}

/* Gallery logic */
#pic-1:checked ~ .gallery-layout-hub .main-display-window .slide-1,
#pic-2:checked ~ .gallery-layout-hub .main-display-window .slide-2,
#pic-3:checked ~ .gallery-layout-hub .main-display-window .slide-3,
#pic-4:checked ~ .gallery-layout-hub .main-display-window .slide-4 {
    opacity: 1;
    z-index: 10;
}

#pic-1:checked ~ .gallery-layout-hub .thumb-selector-strip .thumb-1,
#pic-2:checked ~ .gallery-layout-hub .thumb-selector-strip .thumb-2,
#pic-3:checked ~ .gallery-layout-hub .thumb-selector-strip .thumb-3,
#pic-4:checked ~ .gallery-layout-hub .thumb-selector-strip .thumb-4 {
    border-color: var(--nutripack-tone);
}

/* CTA Interaction */
.action-link-button:hover {
    background-color: var(--nutripack-tone-hover) !important;
    transform: translateY(-1px);
}

/* Hide scrollbar for thumbs on mobile if needed */
.thumb-selector-strip::-webkit-scrollbar {
    display: none;
}
.thumb-selector-strip {
    -ms-overflow-style: none;  
    scrollbar-width: none;  
}