/* FirHub UI feedback v1.0 — shared light/dark, desktop/mobile styling.
 * Neutral, accessible surfaces; tone shown by a narrow indicator and symbol.
 */
:root {
  --fh-surface: #fff;
  --fh-text: #1b2736;
  --fh-muted: #516174;
  --fh-border: #e1e7ee;
  --fh-shadow: 0 16px 48px rgba(18,35,58,.14);
  --fh-accent: #1769d2;
}
html[data-bs-theme="dark"], html[data-capacity-theme="black"], .dark {
  --fh-surface: #191f29;
  --fh-text: #eff3f8;
  --fh-muted: #bac7d7;
  --fh-border: #384454;
  --fh-shadow: 0 18px 50px rgba(0,0,0,.5);
  --fh-accent: #92bfff;
}
.fh-toast-region {
  position: fixed;
  top: max(84px, env(safe-area-inset-top));
  right: max(16px, env(safe-area-inset-right));
  z-index: 5000;
  width: min(420px, calc(100vw - 32px));
  display: flex;
  flex-direction: column;
  gap: 10px;
  pointer-events: none;
}
.fh-notice {
  --fh-tone: #2b6cc7;
  box-sizing: border-box;
  display:flex;
  align-items:flex-start;
  gap:12px;
  position:relative;
  background:var(--fh-surface);
  color:var(--fh-text);
  border:1px solid var(--fh-border);
  border-left:4px solid var(--fh-tone);
  border-radius:12px;
  padding:16px;
  line-height:1.45;
  overflow-wrap:anywhere;
  text-align:left;
}
.fh-notice--success { --fh-tone:#228452; }
.fh-notice--info { --fh-tone:#2471c5; }
.fh-notice--warning { --fh-tone:#b97811; }
.fh-notice--error { --fh-tone:#bf3d43; }
.fh-notice--access { --fh-tone:#97631b; }
.fh-toast {box-shadow:var(--fh-shadow);pointer-events:auto;padding-right:42px;animation:fh-enter .18s ease-out both;}
.fh-inline {width:100%;box-shadow:none;}
.fh-symbol {
  width:32px;height:32px;flex:0 0 32px;
  border:1px solid currentColor;border-radius:50%;
  display:grid;place-items:center;
  color:var(--fh-tone);font-size:17px;font-weight:800;
}
.fh-notice-main {flex:1 1 auto;min-width:0;}
.fh-notice-title {font-size:1rem;font-weight:750;letter-spacing:-.01em;}
.fh-notice-message {margin:5px 0 0;color:var(--fh-text);font-size:.94rem;}
.fh-notice-hint {margin:8px 0 0;color:var(--fh-muted);font-size:.87rem;}
.fh-notice-action {display:inline-block;margin-top:10px;font-weight:750;color:var(--fh-accent);text-decoration:underline;text-underline-offset:3px;}
.fh-close {
  position:absolute;right:8px;top:7px;width:30px;height:30px;
  display:grid;place-items:center;
  background:transparent;border:0;border-radius:8px;
  color:var(--fh-muted);font-size:23px;line-height:1;cursor:pointer;
}
.fh-close:hover {background:rgba(110,122,142,.12);}
.fh-notice :focus-visible, .fh-btn:focus-visible {
  outline:3px solid var(--fh-accent);outline-offset:3px;
}
.fh-modal-backdrop {
  position:fixed;inset:0;z-index:6000;
  display:grid;place-items:center;
  background:rgba(12,21,35,.58);
  padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right))
          max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));
  overflow-y:auto;
}
.fh-dialog {
  width:min(480px,100%);
  box-sizing:border-box;
  max-height:min(90vh,760px);
  overflow-y:auto;
  background:var(--fh-surface);
  color:var(--fh-text);
  border:1px solid var(--fh-border);
  border-radius:18px;
  padding:24px;
  box-shadow:0 25px 70px rgba(0,0,0,.24);
}
.fh-dialog-head {display:flex;gap:14px;align-items:center;}
.fh-dialog-head .fh-symbol {width:42px;height:42px;flex-basis:42px;font-size:22px;}
.fh-dialog-title {margin:0;font-size:1.24rem;line-height:1.25;font-weight:780;}
.fh-dialog-message {margin:16px 0 0;line-height:1.58;font-size:.99rem;}
.fh-dialog-hint {margin:10px 0 0;line-height:1.5;color:var(--fh-muted);font-size:.88rem;}
.fh-dialog-actions {display:flex;gap:10px;justify-content:flex-end;margin-top:24px;flex-wrap:wrap;}
.fh-btn {font:inherit;font-size:.93rem;font-weight:700;border-radius:9px;border:1px solid transparent;padding:10px 16px;min-height:42px;cursor:pointer;}
.fh-btn-secondary {background:var(--fh-surface);border-color:var(--fh-border);color:var(--fh-text);}
.fh-btn-primary {background:#206bc4;color:#fff;}
.fh-btn-danger {background:#ba3947;color:#fff;}
.fh-btn:hover {filter:brightness(.94);}
@keyframes fh-enter {from{opacity:0;transform:translateY(-8px)} to{opacity:1;transform:translateY(0)}}
@media(max-width:575.98px) {
  .fh-toast-region {width:auto;left:12px;right:12px;top:auto;bottom:max(12px,env(safe-area-inset-bottom));}
  .fh-dialog {padding:20px 16px;border-radius:14px;}
  .fh-dialog-actions {flex-direction:column-reverse;}
  .fh-dialog-actions .fh-btn {width:100%;}
}
@media(prefers-reduced-motion:reduce) {
  .fh-toast {animation:none;}
}
@media print {
  .fh-toast-region,.fh-modal-backdrop {display:none!important;}
}
