:root{
  --bg: var(--ananke-bg, #0f1115);
  --panel: var(--ananke-panel, #151821);
  --text: var(--ananke-text, #eef3ff);
  --muted: var(--ananke-muted, #a9b4cf);
  --ring: var(--ananke-ring, #2c3756);
  --link: var(--ananke-link, #9ecbff);
  --accent: var(--ananke-accent, #c8a34e);
}

html, body { background: var(--bg); color: var(--text); }

a { color: var(--link); }

header, .site-header, nav.navbar, .ananke-header { background: var(--panel); border-bottom: 1px solid var(--ring); }

footer { color: var(--muted); }

/* Simple card grid used on homepage content */
.grid-cards .cards{ display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px; }
.grid-cards .card{ display: block; background: var(--panel); border: 1px solid var(--ring); border-radius: 14px; padding: 16px 14px; text-decoration: none; color: inherit; }
.grid-cards .card:hover{ border-color: var(--ring-hover, #3c4a75); }
.grid-cards .thumb{ aspect-ratio: 3/4; background:#0b0d12; display:grid; place-items:center; border-radius:10px; overflow:hidden; margin-bottom:10px }
.grid-cards .thumb img{ max-width:100%; max-height:100%; display:block }
.grid-cards .muted{ color: var(--muted); }

/* Optional buttons/links accents */
.button, .btn, .ananke-button{ background: var(--card, #1b1f2a); border:1px solid var(--ring); color:#fff; }
.button:hover, .btn:hover, .ananke-button:hover { border-color: var(--ring-hover, #3c4a75); }

/* CloudyForms JS widget — iframe mode (panel wrapper on lodge pages) */
.cf-embed-panel {
  background: var(--panel);
  border: 1px solid var(--ring);
  border-radius: 14px;
  padding: 1.25rem 1.5rem 1.5rem;
  margin-top: 1.5rem;
}
.cf-embed-panel iframe {
  width: 100%;
  border: none;
  display: block;
  min-height: 480px;
}
.cf-embed-fallback {
  margin-top: 0.75rem;
  font-size: 0.875rem;
  color: var(--muted);
}

/* CloudyForms headless embed — for simple forms only (headless="true") */
[data-cloudyform] form { margin-top: 1.5rem; }
[data-cloudyform] .cf-field { margin-bottom: 1.25rem; }
[data-cloudyform] label,
[data-cloudyform] .cf-label { display: block; font-weight: 600; margin-bottom: 0.35rem; color: var(--text); }
[data-cloudyform] input,
[data-cloudyform] select,
[data-cloudyform] textarea {
  width: 100%;
  padding: 0.65rem 0.75rem;
  background: var(--panel);
  border: 1px solid var(--ring);
  border-radius: 8px;
  color: var(--text);
  font: inherit;
}
[data-cloudyform] input:focus,
[data-cloudyform] select:focus,
[data-cloudyform] textarea:focus {
  outline: none;
  border-color: var(--accent);
}
[data-cloudyform] button[type="submit"],
[data-cloudyform] input[type="submit"] {
  background: var(--accent);
  border: 1px solid var(--accent);
  border-radius: 8px;
  color: #0f1115;
  cursor: pointer;
  font-weight: 600;
  padding: 0.65rem 1.25rem;
}
[data-cloudyform] button[type="submit"]:hover,
[data-cloudyform] input[type="submit"]:hover {
  filter: brightness(1.08);
}
[data-cloudyform] [data-cf-success] { color: #7dd87d; margin-top: 1rem; }
[data-cloudyform] .cf-error,
[data-cloudyform] [data-cf-error] { color: #f87171; font-size: 0.875rem; }
