/* ──────────────────────────────────────
   Custom Properties
   ────────────────────────────────────── */
:root {
  --brand:      #ce0b1e;
  --step-done:  #5c5765;
  --step-text:  #303030;
  --navy:       #41444d;
  --form-color: #41444d;
}

/* ──────────────────────────────────────
   Global Helpers
   ────────────────────────────────────── */
.text-navy  { color: var(--navy) !important; }
.bg-navy    { background-color: var(--navy) !important; }
.btn-navy   { background-color: #303030; color: #fff; border: 2px solid #303030; border-radius: 0; transition: background .2s, box-shadow .2s, border-color .2s; }
.btn-navy:hover { background-color: #000; color: #fff; border-color: #000; box-shadow: none; }
.btn-navy:focus,
.btn-navy:focus-visible { background-color: #303030; color: #fff; border-color: #303030; outline: none !important; box-shadow: 0 0 0 2px #fff, 0 0 0 4px #000 !important; }
.btn-navy:active,
.btn-navy:active:focus { background-color: #5C5C5C; color: #fff; border-color: #5C5C5C; box-shadow: none !important; outline: none !important; }
.btn-navy:disabled,
.btn-navy[disabled] { background-color: #303030; color: #fff; border-color: #303030; opacity: 0.4; }

/* Payment locator link button — same appearance as btn-navy */
.btn-navy-link,
.btn-navy-link:link,
.btn-navy-link:visited   { background-color: #303030; color: #fff; border: 2px solid #303030; border-radius: 0; transition: background .2s, box-shadow .2s, border-color .2s; text-decoration: none; }
.btn-navy-link:hover     { background-color: #000; color: #fff; border-color: #000; text-decoration: none; box-shadow: none; }
.btn-navy-link:focus,
.btn-navy-link:focus-visible { background-color: #303030; color: #fff; border-color: #303030; outline: none !important; box-shadow: 0 0 0 2px #fff, 0 0 0 4px #000 !important; }
.btn-navy-link:active,
.btn-navy-link:active:focus { background-color: #5C5C5C; color: #fff; border-color: #5C5C5C; box-shadow: none !important; outline: none !important; }
.btn-navy-link:disabled,
.btn-navy-link[disabled]    { background-color: #303030; color: #fff; border-color: #303030; opacity: 0.4; }

/* Back button (btn-link) */
.btn-link.text-navy { transition: color .2s, box-shadow .2s; }
.btn-link.text-navy:hover { color: #32353c !important; }
.btn-link.text-navy:active { color: #282a2f !important; }
.btn-link.text-navy:focus-visible {
  outline: none !important;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px #000;
  border-radius: .375rem;
}

body {
  font-family: 'Effra', 'Segoe UI', Roboto, Arial, sans-serif;
  font-weight: 400;
  background: #f4f6f9;
  color: var(--step-text);
}

/* ──────────────────────────────────────
   Accessibility
   ────────────────────────────────────── */
.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 9999;
  background: var(--brand);
  color: #fff;
  padding: 8px 16px;
  font-weight: 700;
  border-radius: 0 0 4px 0;
  text-decoration: none;
}
.skip-link:focus {
  left: 0;
}
*:focus-visible {
  outline: none !important;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px #000;
}

/* ──────────────────────────────────────
   Form Controls
   ────────────────────────────────────── */
.form-control,
.form-select,
textarea.form-control {
  color: var(--form-color);
  border-color: var(--form-color);
}
.form-control:focus,
.form-select:focus,
textarea.form-control:focus,
.form-control:active,
.form-select:active,
textarea.form-control:active {
  color: var(--form-color);
  border-color: var(--navy);
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px #000;
  outline: none;
}
.form-control:focus-visible,
.form-select:focus-visible,
textarea.form-control:focus-visible {
  outline: none !important;
}
.form-control::placeholder {
  color: rgba(65,68,77,.5);
}
.form-label {
  color: var(--form-color);
}
.input-group-text {
  color: var(--form-color);
  border-color: var(--form-color);
}

/* Checkboxes */
.form-check-input {
  border-color: var(--navy);
}
.form-check-input:checked {
  background-color: var(--navy);
  border-color: var(--navy);
}
.form-check-input:focus,
.form-check-input:focus-visible {
  border-color: var(--navy);
  outline: none !important;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px #000;
}

/* Links — Effra Medium, underlined */
a {
  color: #303030;
  font-weight: 500;
  text-decoration: underline;
  transition: color .15s, background-color .15s;
  padding: 1px 3px;
  margin: 0 -3px;
  border-radius: 2px;
}
a:hover {
  color: #000;
  background-color: #ECECEC;
  text-decoration: underline;
}
a:active {
  color: #fff !important;
  background-color: #5C5C5C;
  text-decoration: underline;
}
a:focus-visible {
  outline: none !important;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px #000;
  border-radius: 2px;
}

/* ── Suppress inline-link fill inside dark/inverted containers ── */
.btn a:hover,
nav a:hover,
.navbar a:hover,
footer a:hover,
.payment-footer-top a:hover {
  background-color: transparent;
}

/* ──────────────────────────────────────
   Spacing Utilities
   ────────────────────────────────────── */
.p-12 { padding: 12px !important; }

/* ──────────────────────────────────────
   Validation Summary
   ────────────────────────────────────── */
#validation-summary {
  margin-left: 0.7rem !important;
  margin-right: 0.7rem !important;
}
#validation-summary ul {
  padding-left: 0.7rem;
  margin-bottom: 0;
}

/* ──────────────────────────────────────
   Custom Radio — uor-radio
   ────────────────────────────────────── */
.uor-radio {
  appearance: none;
  -webkit-appearance: none;
  width: 24px;
  height: 24px;
  min-width: 24px;
  border: 2px solid var(--navy);
  border-radius: 50%;
  background-color: #fff;
  cursor: pointer;
  transition: background-color .15s, box-shadow .15s;
  margin-top: .15em;
}

/* Hover — light blue fill, border stays */
.uor-radio:hover {
  background-color: #d6eaf8;
  box-shadow: none;
}

/* Focus — outer concentric ring, no fill change */
.uor-radio:focus,
.uor-radio:focus-visible {
  background-color: #fff;
  outline: none !important;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px #000 !important;
}

/* Selected — small inner dot, white fill */
.uor-radio:checked {
  background-color: #fff;
  background-image: radial-gradient(circle, var(--navy) 35%, transparent 36%);
  border-color: var(--navy);
  box-shadow: none;
}

/* Selected + Focus — dot AND outer ring */
.uor-radio:checked:focus,
.uor-radio:checked:focus-visible {
  background-color: #fff;
  background-image: radial-gradient(circle, var(--navy) 35%, transparent 36%);
  border-color: var(--navy);
  outline: none !important;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px #000 !important;
}

/* Disabled */
.uor-radio:disabled {
  border-color: #adb5bd;
  background-color: #f8f9fa;
  cursor: not-allowed;
}
.uor-radio:disabled + .form-check-label,
.uor-radio:disabled ~ .uor-radio-label {
  color: #adb5bd;
  cursor: not-allowed;
}

.uor-radio-label {
  font-size: 1rem;
  color: var(--step-text);
  cursor: pointer;
  padding-left: .5rem;
}
