/* Custom CSS Variables - HEALTH Theme */
:root {
    --omega-bg: #F0FDF4; /* Very light fresh green/mint tint */
    --omega-surface: #FFFFFF;
    --omega-accent: #059669; /* Health green */
    --omega-accent-hover: #047857;
    --omega-text-main: #1F2937;
    --omega-fade: #E5E7EB;
    
    /* Randomly selected variables from prompt request */
    --font-display: 'Merriweather', serif; /* font-heading */
    --font-body: 'Open Sans', sans-serif; /* font-text */
    --omega-radius: 16px; /* soft */
    --omega-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); /* raised */
}

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Base resets & typography */
h1, h2, h3 {
    text-transform: none; /* heading-case: normal */
}

/* Gallery Logic (No JS) */
.omega-pic-item {
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease-in-out;
}

/* Show active main image */
#omega-img-1:checked ~ .omega-main-viewport .img-1,
#omega-img-2:checked ~ .omega-main-viewport .img-2,
#omega-img-3:checked ~ .omega-main-viewport .img-3,
#omega-img-4:checked ~ .omega-main-viewport .img-4 {
    opacity: 1;
    pointer-events: auto;
}

/* Style active thumbnail */
#omega-img-1:checked ~ .omega-thumb-bar .thumb-1,
#omega-img-2:checked ~ .omega-thumb-bar .thumb-2,
#omega-img-3:checked ~ .omega-thumb-bar .thumb-3,
#omega-img-4:checked ~ .omega-thumb-bar .thumb-4 {
    border-color: var(--omega-accent);
    opacity: 1;
}

/* Inactive thumbnails slight transparency */
.omega-thumb-label {
    opacity: 0.7;
    transition: all 0.2s ease;
}
.omega-thumb-label:hover {
    opacity: 1;
}

/* Custom scrollbar for thumbnails */
.omega-thumb-bar::-webkit-scrollbar {
    height: 6px;
}
.omega-thumb-bar::-webkit-scrollbar-track {
    background: var(--omega-fade);
    border-radius: 10px;
}
.omega-thumb-bar::-webkit-scrollbar-thumb {
    background: var(--omega-accent);
    border-radius: 10px;
}

/* CTA Interactions */
.omega-action-trigger {
    box-shadow: var(--omega-shadow);
}
.omega-action-trigger:hover {
    background-color: var(--omega-accent-hover) !important;
    transform: translateY(-2px);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}