/*
 * Band Site theme — base (custom_726).
 * Colours and fonts are the band site's own settings, set as --bs-* on :root
 * by the band_sites module; the values after each comma are the Wicked
 * Messengers' look, used only if a setting is missing.
 */
:root {
  --bt-bg: var(--bs-bg, #0a0a0a);
  --bt-medium: color-mix(in srgb, var(--bt-bg) 92%, #fff);
  --bt-card: var(--bs-card, #1a1a1a);
  --bt-border: var(--bs-border, #2a2a2a);
  --bt-border-strong: color-mix(in srgb, var(--bt-border) 80%, #fff);
  --bt-text: var(--bs-text, #e8e8e8);
  --bt-muted: var(--bs-muted, #b0b0b0);
  --bt-faint: color-mix(in srgb, var(--bt-muted) 60%, var(--bt-bg));
  --bt-accent: var(--bs-accent, #e8c760);
  --bt-accent-hover: var(--bs-accent-hover, #f4d03f);
  --bt-on-accent: #000;
  --bt-serif: var(--bs-serif, "Crimson Pro", Georgia, serif);
  --bt-sans: var(--bs-sans, "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
  --bt-max: 1200px;
  --bt-pad: 20px;
  --bt-ease: .3s ease;
  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background-color: var(--bt-bg);
  color: var(--bt-muted);
  font-family: var(--bt-sans);
  font-size: 16px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--bt-serif);
  color: var(--bt-text);
  font-weight: 600;
  line-height: 1.3;
  margin: 0 0 1rem;
}
h1 { font-size: 2.5rem; letter-spacing: -.02em; }
h2 { font-size: 2rem; letter-spacing: -.01em; }
h3 { font-size: 1.5rem; }
h4 { font-size: 1.25rem; }

p { margin: 0 0 1.5rem; }

a {
  color: var(--bt-text);
  text-decoration: none;
  transition: color var(--bt-ease);
}
a:hover, a:focus-visible { color: var(--bt-accent); }
:focus-visible { outline: 2px solid var(--bt-accent); outline-offset: 2px; }

img, video, iframe { max-width: 100%; }
img { height: auto; }

hr { border: 0; border-top: 1px solid var(--bt-border); margin: 2rem 0; }

table { width: 100%; border-collapse: collapse; margin: 0 0 1.5rem; }
th, td { padding: .5rem .6rem; border-bottom: 1px solid var(--bt-border); text-align: left; vertical-align: top; }
th { color: var(--bt-text); font-weight: 600; }

blockquote {
  margin: 0 0 1.5rem;
  padding: .25rem 0 .25rem 1.25rem;
  border-left: 3px solid var(--bt-accent);
  font-family: var(--bt-serif);
  font-style: italic;
  font-size: 1.15rem;
  color: var(--bt-text);
}

.visually-hidden {
  position: absolute !important;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
  width: 1px;
  height: 1px;
  word-wrap: normal;
}
.visually-hidden.focusable:active,
.visually-hidden.focusable:focus-within,
.visually-hidden.focusable:focus {
  position: static !important;
  overflow: visible;
  clip: auto;
  width: auto;
  height: auto;
}
.skip-link.focusable:focus {
  position: absolute !important;
  top: 8px;
  left: 8px;
  z-index: 2000;
  padding: .5rem 1rem;
  background: var(--bt-accent);
  color: var(--bt-on-accent);
  border-radius: 4px;
}
.hidden, [hidden] { display: none !important; }

/* ── forms: contact and booking webforms, the signup ── */
form .form-item, form .js-form-item { margin: 0 0 1.1rem; }
label, .form-item__label, legend {
  display: block;
  margin: 0 0 .35rem;
  color: var(--bt-text);
  font-weight: 500;
  font-size: .95rem;
}
fieldset { border: 1px solid var(--bt-border); border-radius: 6px; padding: 1rem; margin: 0 0 1.25rem; }
input[type="text"], input[type="email"], input[type="tel"], input[type="url"], input[type="number"],
input[type="date"], input[type="time"], input[type="search"], input[type="password"], select, textarea {
  width: 100%;
  max-width: 40rem;
  padding: .7rem .8rem;
  background: var(--bt-bg);
  color: var(--bt-text);
  border: 1px solid var(--bt-border-strong);
  border-radius: 4px;
  font: inherit;
}
input:focus, select:focus, textarea:focus { border-color: var(--bt-accent); outline: none; box-shadow: 0 0 0 2px color-mix(in srgb, var(--bt-accent) 35%, transparent); }
input[type="checkbox"], input[type="radio"] { accent-color: var(--bt-accent); }
.form-type-checkbox label, .form-type-radio label, .js-form-type-checkbox label, .js-form-type-radio label { display: inline; font-weight: 400; }
.description, .form-item__description { font-size: .85rem; color: var(--bt-faint); margin-top: .3rem; }
.form-required::after { content: " *"; color: var(--bt-accent); }
input[type="submit"], button.button, .button, .form-submit {
  display: inline-block;
  padding: .7rem 1.8rem;
  background: var(--bt-accent);
  color: var(--bt-on-accent);
  border: 0;
  border-radius: 4px;
  font: inherit;
  font-weight: 700;
  font-size: .9rem;
  text-transform: uppercase;
  letter-spacing: .1em;
  cursor: pointer;
  transition: background-color var(--bt-ease), transform var(--bt-ease);
}
input[type="submit"]:hover, button.button:hover, .button:hover, .form-submit:hover { background: var(--bt-accent-hover); color: var(--bt-on-accent); transform: translateY(-1px); }
.form-item--error-message, .form-item--error .description { color: #ff8a80; }
input.error, textarea.error, select.error { border-color: #ff8a80; }

/* ── status messages ── */
.messages, [data-drupal-messages] > div {
  margin: 0 0 1.25rem;
  padding: .9rem 1.1rem;
  border: 1px solid var(--bt-border);
  border-left: 4px solid var(--bt-accent);
  border-radius: 6px;
  background: var(--bt-card);
  color: var(--bt-text);
}
.messages--error { border-left-color: #e05d5d; }
.messages--warning { border-left-color: #d9822b; }
.messages ul { margin: 0; padding-left: 1.2rem; }

/* ── pager (Archives) ── */
.pager { margin: 2rem 0 0; }
.pager__items { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem; margin: 0; padding: 0; }
.pager__item a, .pager__item.is-active {
  display: inline-block;
  min-width: 2.4rem;
  padding: .35rem .7rem;
  border: 1px solid var(--bt-border);
  border-radius: 4px;
  text-align: center;
}
.pager__item.is-active { border-color: var(--bt-accent); color: var(--bt-accent); }
