/* MusicAid Portal theme — "Sunrise Stage".
 *
 * Warm, brand-forward skin over Bootstrap 5.3, derived from the logo:
 * red-orange #E8492B (actions), amber #F6A122 (header keyline),
 * charcoal #2A2422 (ink), warm paper #FBF6EF (ground).
 * Loaded after bootstrap.min.css; overrides Bootstrap's CSS variables,
 * so there is no build step and no new dependency.
 */

:root {
  --bs-body-bg: #fbf6ef;
  --bs-body-color: #2a2422;
  --bs-secondary-color: #8a7f76;          /* muted text */
  --bs-border-color: #efe5d8;
  --bs-light-rgb: 251, 246, 239;          /* .bg-light -> warm paper */

  --bs-primary: #e8492b;
  --bs-primary-rgb: 232, 73, 43;
  --bs-link-color: #c73a1f;
  --bs-link-color-rgb: 199, 58, 31;
  --bs-link-hover-color: #a93318;
  --bs-link-hover-color-rgb: 169, 51, 24;

  --bs-border-radius: 0.65rem;
  --bs-border-radius-sm: 0.5rem;
  --bs-border-radius-lg: 0.9rem;
  --bs-box-shadow-sm: 0 2px 8px rgba(190, 120, 60, 0.12);

  --bs-focus-ring-color: rgba(232, 73, 43, 0.25);
}

/* Header: white bar with an amber "stage lip" keyline. */
.navbar {
  border-bottom: 3px solid #f6a122;
  box-shadow: 0 2px 8px rgba(190, 120, 60, 0.1);
}

/* "Member Portal" lockup: small uppercase label behind a thin rule, so it
   reads as the product suffix instead of competing with the logo wordmark. */
.navbar-brand .brand-sub {
  font-size: 0.85rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: #8a7f76;
  border-left: 1px solid #e5d9c9;
  padding-left: 0.7rem;
  margin-top: 0.15rem; /* optical alignment with the wordmark */
}

/* Actions in brand red-orange. */
.btn-primary {
  --bs-btn-bg: #e8492b;
  --bs-btn-border-color: #e8492b;
  --bs-btn-hover-bg: #d13e23;
  --bs-btn-hover-border-color: #d13e23;
  --bs-btn-active-bg: #bc381f;
  --bs-btn-active-border-color: #bc381f;
  --bs-btn-disabled-bg: #e8492b;
  --bs-btn-disabled-border-color: #e8492b;
}
.btn-outline-primary {
  --bs-btn-color: #c73a1f;
  --bs-btn-border-color: #e8492b;
  --bs-btn-hover-bg: #e8492b;
  --bs-btn-hover-border-color: #e8492b;
  --bs-btn-active-bg: #bc381f;
  --bs-btn-active-border-color: #bc381f;
}

/* Cards: soft corners, warm hairline, warm shadow. */
.card {
  --bs-card-border-color: #efe5d8;
}

/* Tables: warm hairlines, quiet uppercase headers. */
.table {
  --bs-table-border-color: #efe5d8;
}
.table thead th {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #8a7f76;
  font-weight: 600;
}

/* Required-field indicator (rendered by the render_field macro). */
.required-mark {
  color: #e8492b;
  margin-left: 0.15rem;
  font-weight: 700;
}

/* Inline help icon that opens a popover (render_field's `help` option). */
.btn-help {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.05rem;
  height: 1.05rem;
  margin-left: 0.35rem;
  padding: 0;
  border: 1px solid #d9c9b4;
  border-radius: 50%;
  background: #ffffff;
  color: #8a7f76;
  font-size: 0.7rem;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  vertical-align: text-top;
}
.btn-help:hover,
.btn-help:focus {
  border-color: #e8492b;
  color: #e8492b;
}
.btn-help:focus-visible {
  outline: 2px solid rgba(232, 73, 43, 0.4);
  outline-offset: 1px;
}

/* Inputs sit on white (like cards) so they stand out from the warm paper
   ground — Bootstrap 5.3 otherwise gives them the page background. */
:root {
  --bs-form-control-bg: #ffffff;
  --bs-form-control-disabled-bg: #f3ece2;
}
.form-control,
.form-select,
.form-check-input {
  background-color: #ffffff;
}
.form-control:disabled,
.form-select:disabled {
  background-color: #f3ece2;
}

/* Form focus ring in brand color instead of Bootstrap blue. */
.form-control:focus,
.form-select:focus,
.form-check-input:focus {
  background-color: #ffffff; /* Bootstrap re-applies the body bg on focus */
  border-color: #edae9c;
  box-shadow: 0 0 0 0.25rem rgba(232, 73, 43, 0.18);
}
.form-check-input:checked {
  background-color: #e8492b;
  border-color: #e8492b;
}

/* Pagination + nav pills pick up the brand automatically via
   --bs-primary-rgb / link colors above. */