/* Site UI shared by both sites, on top of each site's theme. Store pages use _content/J613.Store.UI/store.css. */

:root {
  --j613-accent: #1b9ce3;
  --j613-danger: #b42318;
  --j613-muted: #6b7280;
  --j613-soft: #f6f8fa;
  --j613-border: #e3e6ea;
  --j613-radius: 10px;
}

/* ── Accessibility ─────────────────────────────────── */
.skip-link {
  position: absolute;
  left: 1rem;
  top: -100px;
  z-index: 2000;
  background: #fff;
  color: #000;
  padding: 0.6rem 1rem;
  border-radius: 6px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
}

.skip-link:focus {
  top: 1rem;
}

main:focus {
  outline: none;
}

/* ── Forms on site pages ───────────────────────────── */
/* The theme sizes .form-control; match the selects to it (the arrow stays Bootstrap's) */
.form-select {
  height: 52px;
  font-size: 18px;
  color: #000;
  border-radius: 0;
  box-shadow: none;
  border: 1px solid rgba(0, 0, 0, 0.1);
}

.form-select:focus {
  border-color: #000;
  box-shadow: none;
}

.form-label {
  font-weight: 500;
  margin-bottom: 0.3rem;
}

/* ── Form pages (donations, registration) ──────────── */
.donate-card,
.form-card {
  background: #fff;
  border: 1px solid var(--j613-border);
  border-radius: var(--j613-radius);
  padding: 1.5rem 1.25rem;
  box-shadow: 0 2px 12px rgba(16, 24, 40, 0.06);
}

@media (min-width: 768px) {
  .donate-card,
  .form-card {
    padding: 2rem 2.25rem;
  }
}

.donate-fieldset,
.form-section {
  border: 0;
  padding: 0;
  margin: 0 0 1.75rem;
  min-width: 0;
}

.donate-fieldset legend,
.form-section > legend {
  font-size: 1.1rem;
  font-weight: 600;
  margin-bottom: 0.75rem;
  padding-bottom: 0.4rem;
  border-bottom: 1px solid var(--j613-border);
  width: 100%;
}

.donate-required,
.form-required {
  color: var(--j613-danger);
}

.donate-amounts {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}

.donate-amounts .btn {
  min-width: 4.75rem;
}

.donate-summary {
  background: var(--j613-soft);
  border-radius: 6px;
  padding: 0.75rem 1rem;
  font-size: 0.95rem;
}

.donate-aside,
.form-aside {
  background: var(--j613-soft);
  border-radius: var(--j613-radius);
  padding: 1.5rem;
}

.donate-aside h2,
.form-aside h2 {
  font-size: 1.15rem;
  margin-bottom: 0.75rem;
}

.donate-aside + .donate-aside,
.form-aside + .form-aside {
  margin-top: 1rem;
}

/* ── Home ──────────────────────────────────────────── */
.intro-video {
  border-radius: var(--j613-radius);
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(16, 24, 40, 0.15);
}

/* ── Parsha ────────────────────────────────────────── */
.parsha-article {
  max-width: 820px;
  margin: 0 auto;
  font-size: 1.05rem;
  line-height: 1.8;
}

.parsha-article img {
  max-width: 100%;
  height: auto;
}

/* ── Admin ─────────────────────────────────────────── */
.admin-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
}

.admin-toolbar .form-control {
  max-width: 320px;
  height: 42px;
  font-size: 1rem;
}