/* Shared, accessible feedback for member and operator screens. */
.input-hint {
  margin: 0; color: #b5b5b5; font-size: .8125rem; line-height: 1.65;
  word-break: keep-all; overflow-wrap: anywhere;
}
.input-feedback {
  position: relative; margin: 0; padding: 12px 14px 12px 40px;
  border: 1px solid rgba(255, 157, 139, .24); border-radius: 12px;
  background: rgba(255, 157, 139, .07); color: #ffb4a5;
  font-size: .875rem; line-height: 1.6; word-break: keep-all; overflow-wrap: anywhere;
  animation: feedback-in 160ms ease-out;
}
.input-feedback::before {
  content: '!'; position: absolute; top: 14px; left: 14px;
  display: grid; place-items: center; width: 17px; height: 17px;
  border: 1.5px solid currentColor; border-radius: 50%; font-size: 11px; font-weight: 800;
}
.input-feedback p { margin: 0; }
.input-feedback p + p { margin-top: 6px; }
.dashboard--operator .input-feedback { margin-top: 10px; }
.input-feedback[hidden], .notice[hidden], .notice-stack[hidden] { display: none !important; }
.input-field[aria-invalid="true"], .signup-step .input-field[aria-invalid="true"] { border-color: #ed9987; }
.input-field[aria-invalid="true"]:focus {
  border-color: #ffb4a5; box-shadow: 0 0 0 3px rgba(255, 157, 139, .12); outline: none;
}
.input-field { scroll-margin-block: 100px; }
.notice-stack { display: grid; gap: 12px; margin: 0 0 24px; min-width: 0; }
.notice {
  --notice-color: #b8d8ff; --notice-line: rgba(184, 216, 255, .22);
  display: flex; align-items: flex-start; gap: 12px; padding: 17px;
  border: 1px solid var(--notice-line); border-radius: 16px; background: #242626;
  color: #f5f5f5; font-size: .875rem; line-height: 1.65;
  animation: feedback-in 180ms ease-out;
}
.notice--success { --notice-color: #c3ff17; --notice-line: rgba(195, 255, 23, .22); background: #25291b; }
.notice--error, .notice--warning { --notice-color: #ffb4a5; --notice-line: rgba(255, 157, 139, .24); background: #302523; }
.notice__icon {
  display: grid; place-items: center; flex: 0 0 26px; height: 26px;
  border: 1px solid var(--notice-line); border-radius: 50%; color: var(--notice-color); font-weight: 700;
}
.notice__content { flex: 1; min-width: 0; word-break: keep-all; overflow-wrap: anywhere; }
.notice__content > strong { display: block; margin-bottom: 3px; color: var(--notice-color); font-weight: 700; }
.notice__content p { margin: 0; color: #e0dddd; }
.notice__close {
  display: grid; place-items: center; flex: 0 0 32px; height: 32px; margin: -3px -5px -3px 0;
  padding: 0; border: 0; border-radius: 8px; background: transparent; color: #bbb; font: inherit; font-size: 23px; cursor: pointer;
}
.notice__close:hover { background: rgba(255, 255, 255, .08); color: #fff; }
.notice__close:focus-visible, .confirm-dialog button:focus-visible { outline: 2px solid #c3ff17; outline-offset: 3px; }
.notice-stack--floating {
  position: fixed; z-index: 110; top: calc(88px + env(safe-area-inset-top, 0px));
  right: 24px; width: min(440px, calc(100% - 32px)); max-height: calc(100dvh - 130px); overflow-y: auto;
  box-shadow: 0 16px 45px rgba(0, 0, 0, .25);
}
.copy-feedback { margin-top: 12px; font-size: .875rem; line-height: 1.6; color: #c3ff17; }
.copy-feedback.is-error { color: #ffb4a5; }
.confirm-dialog {
  width: min(440px, calc(100% - 32px)); max-height: calc(100dvh - 48px); margin: auto; padding: 28px;
  border: 1px solid #424242; border-radius: 24px; background: #202020; color: #f5f5f5;
  box-shadow: 0 24px 80px rgba(0, 0, 0, .45); font-family: inherit;
}
.confirm-dialog::backdrop { background: rgba(0, 0, 0, .65); backdrop-filter: blur(4px); }
.confirm-dialog[open] { animation: feedback-in 180ms ease-out; }
.confirm-dialog__icon {
  display: grid; place-items: center; width: 40px; height: 40px; margin-bottom: 20px;
  border-radius: 14px; background: rgba(195, 255, 23, .12); color: #c3ff17; font-size: 21px; font-weight: 700;
}
.confirm-dialog h2 { margin: 0 0 12px; font-size: 1.35rem; line-height: 1.4; }
.confirm-dialog > p { margin: 0; color: #c0c0c0; font-size: .9375rem; line-height: 1.75; word-break: keep-all; }
.confirm-dialog__actions { display: flex; gap: 10px; margin-top: 26px; }
.confirm-dialog button {
  flex: 1; min-height: 48px; padding: 10px 12px; border: 1px solid #505050; border-radius: 12px;
  font: inherit; font-size: .875rem; font-weight: 700; cursor: pointer;
}
.confirm-dialog__cancel { background: transparent; color: #eee; }
.confirm-dialog .confirm-dialog__accept { border-color: #c3ff17; background: #c3ff17; color: #151515; }
@keyframes feedback-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 600px) {
  .notice-stack--floating { top: calc(64px + env(safe-area-inset-top, 0px)); right: 16px; }
  .notice { padding: 14px; gap: 10px; }
  .confirm-dialog { padding: 24px; }
  .confirm-dialog__actions { flex-direction: column-reverse; }
}
@media (prefers-reduced-motion: reduce) {
  .input-feedback, .notice, .confirm-dialog[open] { animation: none; }
}
