/**
 * GEOMIN branding overrides for Cocoon A11y (self-hosted).
 * Keeps the launcher clear of sticky/footer UI and aligns accents with brand colors.
 */
:root {
  --geomin-a11y-navy: #134069;
  --geomin-a11y-orange: #FE9A0D;
  --geomin-a11y-dark: #082744;
}

/* Bottom-right launcher with safe spacing on all viewports */
#cocoon-a11y-btn {
  bottom: 24px !important;
  right: 24px !important;
  left: auto !important;
  top: auto !important;
  box-shadow: 0 8px 24px rgba(8, 39, 68, 0.35) !important;
  border: 2px solid rgba(255, 255, 255, 0.85) !important;
}

#cocoon-a11y-btn:hover,
#cocoon-a11y-btn:focus-visible {
  box-shadow: 0 10px 28px rgba(8, 39, 68, 0.45) !important;
}

/* Navy launcher needs a light icon for contrast */
#cocoon-a11y-btn svg {
  fill: #ffffff !important;
}

/* Panel sits above site chrome but remains usable on small screens */
#cocoon-a11y-panel {
  max-height: min(78vh, 640px) !important;
  border-radius: 12px !important;
  box-shadow: 0 16px 40px rgba(8, 39, 68, 0.28) !important;
}

#cocoon-a11y-panel .a11y-hdr {
  background: var(--geomin-a11y-navy) !important;
}

#cocoon-a11y-panel .a11y-sec {
  color: var(--geomin-a11y-orange) !important;
}

#cocoon-a11y-panel .a11y-i:hover,
#cocoon-a11y-panel .a11y-i.on {
  border-color: var(--geomin-a11y-navy) !important;
  background: rgba(19, 64, 105, 0.08) !important;
}

#cocoon-a11y-panel .a11y-rst {
  background: var(--geomin-a11y-navy) !important;
  color: #ffffff !important;
}

/* Keep promotional footer out of the GEOMIN UI chrome */
#cocoon-a11y-panel .a11y-ft {
  display: none !important;
}

/* Avoid covering Bootstrap modals' close affordance awkwardly on phones */
@media (max-width: 575.98px) {
  #cocoon-a11y-btn {
    bottom: 16px !important;
    right: 16px !important;
    width: 48px !important;
    height: 48px !important;
  }

  #cocoon-a11y-panel {
    width: calc(100vw - 24px) !important;
    max-width: 360px !important;
    right: 12px !important;
    bottom: 76px !important;
  }
}

/* Reduce chance of overlapping sticky bottom CTAs on tablets */
@media (min-width: 576px) and (max-width: 991.98px) {
  #cocoon-a11y-btn {
    bottom: 20px !important;
    right: 20px !important;
  }
}