:root {
  --docbest-bg: #F4F9F8;
  --docbest-surface: #FFFFFF;
  --docbest-tone: #0D8A72;
  --docbest-tone-hover: #096856;
  --docbest-ink: #1A2B27;
  --docbest-muted: #5C706B;
  --docbest-accent: #E8F5F2;
  --docbest-gradient: linear-gradient(135deg, #0D8A72 0%, #15A085 100%);
  --font-display: 'Oswald', sans-serif;
  --font-body: 'Open Sans', sans-serif;
}

/* Preset A - Header accent bottom border */
.docbest-top-bar {
  border-bottom: 4px solid var(--docbest-tone);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
}

/* Deep Shadow Style for main containers */
.docbest-sheet {
  box-shadow: 0 18px 40px -10px rgba(13, 138, 114, 0.12), 0 8px 20px -6px rgba(0, 0, 0, 0.06);
}

/* Gallery Radio Switch logic */
.docbest-radio-trigger {
  display: none;
}

.docbest-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
  pointer-events: none;
}

#gal-pic-1:checked ~ .docbest-slides-container .slide-1,
#gal-pic-2:checked ~ .docbest-slides-container .slide-2,
#gal-pic-3:checked ~ .docbest-slides-container .slide-3,
#gal-pic-4:checked ~ .docbest-slides-container .slide-4 {
  opacity: 1;
  pointer-events: auto;
  z-index: 2;
}

/* Thumbnail highlight */
.docbest-thumb-item {
  cursor: pointer;
  border: 2px solid transparent;
  border-radius: 12px;
  padding: 2px;
  background-color: #FAFAFA;
  transition: all 0.2s ease;
}

.docbest-thumb-item:hover {
  border-color: var(--docbest-muted);
}

#gal-pic-1:checked ~ .docbest-thumb-strip label[for="gal-pic-1"],
#gal-pic-2:checked ~ .docbest-thumb-strip label[for="gal-pic-2"],
#gal-pic-3:checked ~ .docbest-thumb-strip label[for="gal-pic-3"],
#gal-pic-4:checked ~ .docbest-thumb-strip label[for="gal-pic-4"] {
  border-color: var(--docbest-tone);
  background-color: var(--docbest-accent);
}

/* Preset A - CTA Pill button with hover shadow */
.docbest-buy-action {
  background: var(--docbest-gradient);
  color: #FFFFFF;
  border-radius: 999px;
  box-shadow: 0 10px 25px -5px rgba(13, 138, 114, 0.4);
}

.docbest-buy-action:hover {
  background: var(--docbest-tone-hover);
  box-shadow: 0 15px 35px -5px rgba(13, 138, 114, 0.6);
  transform: translateY(-2px);
}

/* Preset A - Reviews with Left Accent Border 4px */
.docbest-opinion-item {
  border-left: 4px solid var(--docbest-tone);
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03);
}