/* part135sms.com — Anonymous Reporting Tool pop-up (CI build only, loaded by views/site/_report_tool.php)
   The app sends the company look-up as Bootstrap 4 modal markup (events/verify_company).
   Bootstrap's own CSS would restyle the whole page, so this file has only the pieces that
   markup uses, drawn with the site's colour tokens (works in light and dark mode). */

body.modal-open { overflow: hidden; }
.modal { position: fixed; inset: 0; z-index: 1050; display: none; overflow-x: hidden; overflow-y: auto; outline: 0; }
.modal-open .modal { overflow-x: hidden; overflow-y: auto; }
.fade { transition: opacity .15s linear; }
.fade:not(.show) { opacity: 0; }
.modal.fade .modal-dialog { transition: transform .25s ease-out; transform: translateY(-40px); }
.modal.show .modal-dialog { transform: none; }
@media (prefers-reduced-motion: reduce) { .fade, .modal.fade .modal-dialog { transition: none; } }
.modal-backdrop { position: fixed; inset: 0; z-index: 1040; background: #071020; }
.modal-backdrop.fade { opacity: 0; }
.modal-backdrop.show { opacity: .6; }

.modal-dialog { position: relative; width: auto; margin: 16px; pointer-events: none; }
.modal-dialog-centered { display: flex; align-items: center; min-height: calc(100% - 32px); }
@media (min-width: 576px) {
  .modal-dialog { max-width: 560px; margin: 1.75rem auto; }
  .modal-dialog-centered { min-height: calc(100% - 3.5rem); }
}
.modal-content {
  position: relative; display: flex; flex-direction: column; width: 100%; pointer-events: auto;
  background: var(--surface); color: var(--ink); border: 1px solid var(--line); border-radius: 14px;
  box-shadow: var(--shadow); outline: 0; overflow: hidden;
}
.modal .modal-header {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 14px 18px; background: var(--band); color: var(--band-ink);
}
.modal .modal-title { margin: 0; font-family: var(--font-display); font-size: 1.25rem; font-weight: 700; line-height: 1.2; }
.modal .modal-header .close { all: unset; cursor: pointer; font-size: 1.6rem; line-height: 1; padding: 0 4px; color: inherit; }
.modal .modal-header .close:focus-visible { outline: 2px solid var(--amber); }
.modal .modal-body { padding: 18px; }
.modal .modal-body h2 { font-size: 1.3rem; margin: 0 0 14px; color: var(--ink); }

/* intro text the pop-up styles inline for a light page; restate it with the site tokens */
#mdEdit .anon-intro { font-size: .92rem; line-height: 1.5; color: var(--ink); margin-bottom: 14px; }
#mdEdit .anon-intro p { margin: 0 0 8px; }
#mdEdit .anon-intro .anon-begin { padding: 8px 10px; background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--radius-sm); color: var(--ink); }
#mdEdit .anon-intro .anon-note { color: var(--muted); }

/* grid and form pieces */
.modal .row { display: flex; flex-wrap: wrap; margin: 0 -8px; }
.modal [class*="col-"] { position: relative; width: 100%; padding: 0 8px; }
.modal .col-12, .modal .col-sm-12 { flex: 0 0 100%; max-width: 100%; }
@media (min-width: 576px) {
  .modal .col-sm-3 { flex: 0 0 25%; max-width: 25%; }
  .modal .col-sm-9 { flex: 0 0 75%; max-width: 75%; }
}
.modal .form-group { margin-bottom: 12px; }
.modal .mb-0 { margin-bottom: 0; }
.modal .mt-2 { margin-top: 8px; }
.modal .control-label { font-size: .9rem; font-weight: 600; padding-top: 10px; margin: 0; }
.modal .form-control {
  display: block; width: 100%; min-width: 0; font: inherit; font-size: 1rem; color: var(--ink);
  background: var(--bg); border: 1.5px solid var(--line); border-radius: var(--radius-sm); padding: 10px 12px;
}
.modal .form-control:focus { outline: none; border-color: var(--link); box-shadow: 0 0 0 3px color-mix(in srgb, var(--link) 22%, transparent); }
.modal .error { display: block; color: var(--risk-5); font-size: .85rem; margin-top: 4px; }
.modal .btn-success, .modal .btn-primary { background: var(--navy); color: var(--on-navy); }
.modal .btn-success:hover, .modal .btn-primary:hover { filter: brightness(1.08); }
.modal .btn-danger { background: var(--risk-5); color: #fff; }
#Warning .modal-body > div { display: flex; flex-wrap: wrap; gap: 10px; }
@media (max-width: 575px) { .modal .control-label { padding-top: 0; margin-bottom: 4px; } }

/* SweetAlert messages sit above the pop-up */
.sweet-overlay { z-index: 1060 !important; }
.sweet-alert { z-index: 1070 !important; font-family: var(--font-body) !important; }