/* Safety modal and form styles */
:root {
  --brand-blue: #1e3a8a;
  --brand-blue-hover: #1a357b;
  --modal-radius: 16px;
}

.safety-modal { position: fixed; inset: 0; z-index: 1000; display: none; }
.safety-modal--open { display: block; }

.safety-modal__backdrop {
  position: absolute; inset: 0;
  background: rgba(17, 24, 39, 0.55);
  backdrop-filter: blur(2px);
}

.safety-modal__dialog {
  position: relative;
  margin: 6vh auto;
  max-width: 760px;
  width: calc(100% - 32px);
  background: #fff;
  border-radius: var(--modal-radius);
  box-shadow: 0 20px 60px rgba(0,0,0,0.25);
  padding: 36px;
}

@media (min-width: 768px) {
  .safety-modal__dialog { margin: 10vh auto; padding: 40px; }
}

.safety-modal__close {
  position: absolute; top: 10px; right: 12px;
  background: transparent; border: none; font-size: 28px; line-height: 1;
  color: #6b7280; cursor: pointer; transition: color .2s ease;
}
.safety-modal__close:hover { color: #111827; }

.safety-modal__title {
  margin: 0 0 18px;
  font-size: 26px;
  line-height: 1.2;
  color: #111827;
  text-align: center;
}

/* Inputs */
.safety-form { display: block !important; }
.safety-form .form-group { margin-bottom: 16px; }
.safety-form .form-input {
  width: 100%;
  padding: 16px 18px;
  font-size: 19px;
  color: #111827;
  background: #fff;
  border: 1px solid #d1d5db;
  border-radius: 12px;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.safety-form textarea.form-input { min-height: 160px; resize: vertical; }
.safety-form .form-input::placeholder { color: #9ca3af; }
.safety-form .form-input:focus {
  outline: none;
  border-color: var(--brand-blue) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand-blue) 30%, transparent) !important;
}

/* Buttons inside modal */
.safety-form .btn {
  width: 100%;
  border-radius: 12px;
  padding: 16px 20px;
  font-size: 19px;
  transition: background-color .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.safety-form .btn.btn--brand {
  background: var(--brand-blue);
  border-color: var(--brand-blue);
}
.safety-form .btn.btn--brand:hover {
  background: var(--brand-blue-hover);
  border-color: var(--brand-blue-hover);
  box-shadow: 0 6px 18px color-mix(in srgb, var(--brand-blue) 35%, transparent);
}

/* BIG trigger button; remove legacy animations/effects */
#show-safety-form.btn,
#show-safety-form.btn:visited {
  background: var(--brand-blue) !important;
  border-color: var(--brand-blue) !important;
  padding: 30px 50px;
  font-size: 23px;
  border-radius: 9999px;
  line-height: 1.1;
  background-image: none !important;
  box-shadow: none !important;
  animation: none !important;
  transform: none !important;
  transition: background-color .2s ease, border-color .2s ease;
}
#show-safety-form.btn::before,
#show-safety-form.btn::after { content: none !important; display: none !important; }
#show-safety-form.btn:hover {
  background: var(--brand-blue-hover) !important;
  border-color: var(--brand-blue-hover) !important;
}

/* Success text */
.safety-success { display: none; margin-top: 12px; color: var(--brand-blue); text-align: center; font-size: 16px; }
.safety-success--visible { display: block; }