/* ============================================================================
   ep-overrides.css - changes asked for after the client's HTML, kept apart
   so source/easy-pest.html stays exactly as delivered. Loaded after the
   page's own styles (scripts/prepare.mjs adds the <link>).
   ========================================================================== */

/* Scrolling popups (the pest picker, the booking / enquiry popups, the
   mobile menu): the browser's own scrollbar - a white track, a grey slab and
   square arrow buttons - sat on the edge of the rounded card and broke its
   corners. Here it is a slim pill in the site's red on a clear track, held
   inside the card: the track stops short of the rounded corners, and the
   thumb is inset from the edge. */
.pk-box, .box, #mmenu {
  scrollbar-gutter: auto;
}
.pk-box::-webkit-scrollbar, .box::-webkit-scrollbar, #mmenu::-webkit-scrollbar {
  width: 12px;
  background: transparent;
}
.pk-box::-webkit-scrollbar-track, .box::-webkit-scrollbar-track, #mmenu::-webkit-scrollbar-track {
  background: transparent;
  margin: 38px 0;            /* clear of the rounded corners */
}
.pk-box::-webkit-scrollbar-thumb, .box::-webkit-scrollbar-thumb, #mmenu::-webkit-scrollbar-thumb {
  background: rgba(187, 43, 41, .32);
  border: 4px solid transparent;   /* inset from the card's edge */
  background-clip: padding-box;
  border-radius: 999px;
  min-height: 48px;
}
.pk-box::-webkit-scrollbar-thumb:hover, .box::-webkit-scrollbar-thumb:hover, #mmenu::-webkit-scrollbar-thumb:hover {
  background-color: rgba(187, 43, 41, .55);
}
.pk-box::-webkit-scrollbar-button, .box::-webkit-scrollbar-button, #mmenu::-webkit-scrollbar-button,
.pk-box::-webkit-scrollbar-corner, .box::-webkit-scrollbar-corner, #mmenu::-webkit-scrollbar-corner {
  display: none; width: 0; height: 0; background: transparent;
}
/* Firefox has no pill shape to draw; a thin bar in the same red, no track. */
@supports (-moz-appearance: none) {
  .pk-box, .box, #mmenu { scrollbar-width: thin; scrollbar-color: rgba(187, 43, 41, .45) transparent; }
}

/* No "Admin" button in the footer: visitors have no reason to see it. The
   owner opens the admin at yourdomain.com/admin. (The page's own rule is
   display:inline-flex !important, so this one needs the id to win.) */
#toAdmin.adm-link { display: none !important; }

/* Production: the admin's yellow "Demo view" banner never shows (signed-out
   visitors get the Admin login screen instead - see ep-shim.js). */
#demoBar.demo-bar { display: none !important; }
