/* sv-cookies.css — Skanda Vale static site. Authored file, pair of
   sv-style/sv-cookies.js. Replaces the CookieYes banner.

   Deliberately plain: a bar across the foot of the window in the site's
   own colours, with Accept and Reject given EQUAL visual weight. Under
   UK/EU rules refusing must be as easy as agreeing, so neither button is
   styled to be more tempting than the other. */

.sv-cookie-banner {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 99999;
  background: #263238;
  color: #fff;
  box-shadow: 0 -2px 18px rgba(0, 0, 0, .25);
  transform: translateY(100%);
  transition: transform .25s ease;
}

.sv-cookie-banner.sv-cookie-in { transform: translateY(0); }
.sv-cookie-banner.sv-cookie-hidden { transform: translateY(100%); }

.sv-cookie-inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 1.15rem 1.5rem;
  display: flex;
  align-items: center;
  gap: 1.75rem;
  flex-wrap: wrap;
}

.sv-cookie-text {
  margin: 0;
  flex: 1 1 22rem;
  font-size: .95rem;
  line-height: 1.6;
}

.sv-cookie-text a {
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.sv-cookie-actions {
  display: flex;
  gap: .75rem;
  flex: 0 0 auto;
}

.sv-cookie-btn {
  font: inherit;
  font-size: .9rem;
  letter-spacing: .06em;
  text-transform: uppercase;
  cursor: pointer;
  padding: .7em 1.9em;
  border-radius: 2px;
  border: 2px solid #fff;
  background: transparent;
  color: #fff;
  transition: background-color .15s ease, color .15s ease;
}

.sv-cookie-btn:hover,
.sv-cookie-btn:focus-visible {
  background: #fff;
  color: #263238;
}

/* Accept is the solid accent button and reads as the primary action.
   Reject is a white outline button — same size, same padding, same font,
   so it stays a genuine choice. Under UK/EU rules refusing must be as
   easy as accepting: it may be visually quieter, but it must not be
   hidden, shrunk, or made harder to click than Accept.

   !important is needed because the theme sets a background on every
   <button> via ".elementor-kit-5 button", which outranks a single class.
   These selectors only ever match this banner. */
.sv-cookie-banner .sv-cookie-btn{
  border-width:2px !important;
  border-style:solid !important;
  font-weight:600 !important;
}

.sv-cookie-banner .sv-cookie-reject{
  background:transparent !important;
  border-color:#fff !important;
  color:#fff !important;
}

.sv-cookie-banner .sv-cookie-reject:hover,
.sv-cookie-banner .sv-cookie-reject:focus-visible{
  background:#fff !important;
  border-color:#fff !important;
  color:#263238 !important;
}

.sv-cookie-banner .sv-cookie-accept{
  background:#ca4d2a !important;
  border-color:#ca4d2a !important;
  color:#fff !important;
  font-weight:700 !important;
}

.sv-cookie-banner .sv-cookie-accept:hover,
.sv-cookie-banner .sv-cookie-accept:focus-visible{
  background:#b34324 !important;
  border-color:#b34324 !important;
  color:#fff !important;
}

/* keep clear of the scroll-to-top link and the page foot */
.sv-cookie-banner{ padding-bottom:env(safe-area-inset-bottom, 0); }

@media (max-width: 600px) {
  .sv-cookie-inner { padding: 1rem 1.15rem; gap: 1rem; }
  .sv-cookie-actions { width: 100%; }
  .sv-cookie-btn { flex: 1 1 0; padding: .8em 1rem; }
}

@media (prefers-reduced-motion: reduce) {
  .sv-cookie-banner { transition: none; }
}