/* ==========================================================================
   ISI error messages - "scaffold tag": errors look like the red inspection
   tag hung on a scaffold (punched eyelet, red DANGER band, steel body).
   Loaded last on the dashboard (layouts/sections/css), the login pages,
   the website (front/default/layout) and the user portal (user/layout).
   Covers: toastr error/warning toasts, SweetAlert2 error popups (and warning
   popups without a Cancel button), field errors and .alert-danger boxes.
   ========================================================================== */
:root {
  --ise-red: #d7262e;
  --ise-red-deep: #a8161d;
  --ise-ink: #0c1b33;
  --ise-steel: #c9d1da;
  --ise-paper: #fff;
  --ise-text: #22324a;
  --ise-field: #c41e26;
  --ise-font: "Archivo", "Helvetica Neue", Arial, sans-serif;
}
body.dark-only { --ise-paper: #0d1b30; --ise-text: #dfe5ec; --ise-field: #ff6b70; }

/* ---------- toasts ---------- */
#toast-container > .toast.toast-error,
#toast-container > .toast.toast-warning {
  position: relative; width: 340px; max-width: calc(100vw - 24px); overflow: hidden;
  padding: 44px 18px 16px 18px !important; opacity: 1 !important;
  background: var(--ise-paper) !important; background-image: none !important; color: var(--ise-text) !important;
  border: 1px solid var(--ise-steel); border-radius: 4px 4px 14px 14px !important;
  box-shadow: 0 22px 44px -22px rgba(12, 27, 51, .55), 0 2px 6px rgba(12, 27, 51, .08) !important;
  font-family: var(--ise-font);
}
#toast-container > .toast.toast-error::before,
#toast-container > .toast.toast-warning::before {
  content: "DANGER"; position: absolute; inset: 0 0 auto 0; height: 30px; padding-inline-start: 44px;
  display: flex; align-items: center; font: 800 12px/1 var(--ise-font); letter-spacing: .32em; color: #fff;
  background: repeating-linear-gradient(-45deg, var(--ise-red) 0 14px, var(--ise-red-deep) 14px 18px);
}
#toast-container > .toast.toast-warning::before { content: "CAUTION"; color: #1a1300;
  background: repeating-linear-gradient(-45deg, #f6b51e 0 14px, #d99a07 14px 18px); }
#toast-container > .toast.toast-error::after,
#toast-container > .toast.toast-warning::after {
  content: ""; position: absolute; top: 8px; inset-inline-start: 16px; width: 14px; height: 14px; border-radius: 50%;
  background: var(--ise-paper); box-shadow: inset 0 0 0 3px var(--ise-steel);
}
#toast-container > .toast-error .toast-title,
#toast-container > .toast-warning .toast-title { font: 800 15px/1.2 var(--ise-font); text-transform: uppercase; letter-spacing: .04em; color: var(--ise-ink); margin-bottom: 4px; }
body.dark-only #toast-container > .toast-error .toast-title { color: #fff; }
#toast-container > .toast-error .toast-message,
#toast-container > .toast-warning .toast-message { font-size: 13.5px; line-height: 1.5; color: inherit; }
#toast-container > .toast-error .toast-close-button,
#toast-container > .toast-warning .toast-close-button { position: absolute; top: 6px; inset-inline-end: 10px; color: #fff; opacity: .9; text-shadow: none; font-size: 20px; }
#toast-container > .toast-warning .toast-close-button { color: #1a1300; }
#toast-container > .toast-error .toast-progress { background: var(--ise-red); opacity: 1; height: 3px; }
#toast-container > .toast-warning .toast-progress { background: #f6b51e; opacity: 1; height: 3px; }

/* ---------- popups ---------- */
.swal2-popup.swal2-icon-error,
.swal2-popup.swal2-icon-warning:has(.swal2-cancel[style*="none"]) {
  padding-top: 46px !important; border-radius: 6px 6px 18px 18px !important; overflow: hidden; font-family: var(--ise-font);
  border: 1px solid var(--ise-steel); box-shadow: 0 40px 80px -30px rgba(12, 27, 51, .6) !important;
}
.swal2-popup.swal2-icon-error::before,
.swal2-popup.swal2-icon-warning:has(.swal2-cancel[style*="none"])::before {
  content: "DANGER  \2014   DO NOT PROCEED"; position: absolute; inset: 0 0 auto 0; height: 34px; display: grid; place-items: center;
  font: 800 12px/1 var(--ise-font); letter-spacing: .3em; color: #fff; white-space: pre;
  background: repeating-linear-gradient(-45deg, var(--ise-red) 0 16px, var(--ise-red-deep) 16px 21px);
}
.swal2-popup.swal2-icon-warning:has(.swal2-cancel[style*="none"])::before { content: "CAUTION  \2014   CHECK THIS"; color: #1a1300;
  background: repeating-linear-gradient(-45deg, #f6b51e 0 16px, #d99a07 16px 21px); }
.swal2-popup.swal2-icon-error .swal2-title,
.swal2-popup.swal2-icon-warning:has(.swal2-cancel[style*="none"]) .swal2-title { font: 800 22px/1.2 var(--ise-font) !important; text-transform: uppercase; letter-spacing: .03em; }
.swal2-popup.swal2-icon-error .swal2-icon.swal2-error { border-radius: 10px; border-width: 3px; border-color: var(--ise-red) !important; transform: rotate(45deg); }
.swal2-popup.swal2-icon-error .swal2-icon.swal2-error .swal2-x-mark { transform: rotate(-45deg); }
.swal2-popup.swal2-icon-error .swal2-icon.swal2-error [class^=swal2-x-mark-line] { background-color: var(--ise-red) !important; }
.swal2-popup.swal2-icon-error .swal2-confirm,
.swal2-popup.swal2-icon-warning:has(.swal2-cancel[style*="none"]) .swal2-confirm {
  background: var(--ise-ink) !important; border: 0 !important; border-radius: 4px !important; color: #fff !important;
  padding: 11px 28px !important; font: 700 13px/1 var(--ise-font) !important; letter-spacing: .14em; text-transform: uppercase;
  box-shadow: inset 0 -3px 0 var(--ise-red) !important;
}

/* ---------- field errors ---------- */
.invalid-feedback, p.text-danger:not(:empty), small.text-danger:not(:empty), label.error, .isi-cform__err:not(:empty) {
  position: relative; margin-top: 6px; padding-inline-start: 20px;
  color: var(--ise-field) !important; font: 600 12.5px/1.45 var(--ise-font); letter-spacing: .01em;
}
.invalid-feedback::before, p.text-danger:not(:empty)::before, small.text-danger:not(:empty)::before, label.error::before, .isi-cform__err:not(:empty)::before {
  content: ""; position: absolute; inset-inline-start: 0; top: .2em; width: 12px; height: 14px; border-radius: 2px 2px 3px 3px;
  background: radial-gradient(circle at 50% 3.5px, var(--ise-paper) 1.6px, transparent 2px), var(--ise-red);
}
.form-control.is-invalid, .form-select.is-invalid, .was-validated .form-control:invalid {
  border-color: var(--ise-red) !important; background-image: none !important;
  box-shadow: inset 3px 0 0 var(--ise-red) !important;
}
[dir="rtl"] .form-control.is-invalid, [dir="rtl"] .form-select.is-invalid { box-shadow: inset -3px 0 0 var(--ise-red) !important; }

/* ---------- boxed alerts ---------- */
.alert.alert-danger {
  position: relative; padding: 14px 16px 14px 56px; padding-inline-start: 56px; padding-inline-end: 16px;
  color: var(--ise-text) !important; background: var(--ise-paper) !important; font-family: var(--ise-font);
  border: 1px solid var(--ise-steel) !important; border-inline-start: 0 !important; border-radius: 6px !important;
  box-shadow: 0 10px 24px -18px rgba(12, 27, 51, .5);
}
.alert.alert-danger::before {
  content: "!"; position: absolute; inset-block: 0; inset-inline-start: 0; width: 40px; display: grid; place-items: center;
  border-radius: 6px 0 0 6px; color: #fff; font: 800 18px/1 var(--ise-font);
  background: radial-gradient(circle at 50% 12px, var(--ise-paper) 3.5px, transparent 4px), repeating-linear-gradient(-45deg, var(--ise-red) 0 8px, var(--ise-red-deep) 8px 11px);
}
[dir="rtl"] .alert.alert-danger::before { border-radius: 0 6px 6px 0; }