/* Shared design tokens: a Teams-like purple palette on top of Bootstrap 5.3 */
:root {
  --brand: #5b5fc7; --brand-hover: #4f52b2; --brand-pressed: #444791; --brand-soft: #e8ebfa; --brand-light: #7f85f5;
  --ink: #242424; --ink-2: #424242; --muted: #616161; --line: #e0e0e0; --canvas: #f5f5f5; --surface: #ffffff;
  --radius: 8px; --shadow: 0 1.6px 3.6px rgba(0,0,0,.13), 0 .3px .9px rgba(0,0,0,.11);
  --bs-primary: var(--brand); --bs-primary-rgb: 91,95,199; --bs-link-color: var(--brand); --bs-link-hover-color: var(--brand-hover);
  --bs-link-color-rgb: 91,95,199; --bs-body-font-family: "Segoe UI", "Segoe UI Web (West European)", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", Arial, sans-serif;
  --bs-body-font-size: .9375rem; --bs-border-radius: var(--radius); --bs-focus-ring-color: rgba(91,95,199,.35);
}
.btn-primary { --bs-btn-bg: var(--brand); --bs-btn-border-color: var(--brand); --bs-btn-hover-bg: var(--brand-hover);
  --bs-btn-hover-border-color: var(--brand-hover); --bs-btn-active-bg: var(--brand-pressed); --bs-btn-active-border-color: var(--brand-pressed);
  --bs-btn-disabled-bg: #c7c7c7; --bs-btn-disabled-border-color: #c7c7c7; font-weight: 600; }
.btn-outline-primary { --bs-btn-color: var(--brand); --bs-btn-border-color: var(--brand); --bs-btn-hover-bg: var(--brand);
  --bs-btn-hover-border-color: var(--brand); --bs-btn-active-bg: var(--brand-pressed); font-weight: 600; }
.btn { border-radius: 4px; }
.form-control:focus, .form-select:focus { border-color: var(--brand); box-shadow: 0 0 0 .2rem rgba(91,95,199,.2); }
.form-check-input:checked { background-color: var(--brand); border-color: var(--brand); }
.form-range::-webkit-slider-thumb { background: var(--brand); }
.text-brand { color: var(--brand) !important; }
.brand-mark { width: 32px; height: 32px; border-radius: 6px; background: var(--brand); color: #fff; display: inline-grid;
  place-items: center; font-size: 1.05rem; flex: none; }

/* ---------- dark theme (admin panel; the call page has its own palette in call.css) ---------- */
[data-bs-theme="dark"] {
  --brand-soft: #2f3166; --brand-pressed: #c5c8ff; --brand-light: #8f94f7;
  --ink: #f0f0f0; --ink-2: #d6d6d6; --muted: #a8a8a8; --line: #3a3a3a; --canvas: #1b1b1f; --surface: #26262b;
  --shadow: 0 1px 2px rgba(0,0,0,.5), 0 2px 8px rgba(0,0,0,.35);
  --bs-body-bg: #1b1b1f; --bs-body-color: #f0f0f0; --bs-secondary-color: #a8a8a8; --bs-tertiary-bg: #2e2e34;
  --bs-border-color: #3a3a3a; --bs-link-color: #9ea2ff; --bs-link-hover-color: #c5c8ff; --bs-link-color-rgb: 158,162,255;
}
/* Bootstrap's "light" colours stay light in dark mode: make light badges / buttons follow the theme */
[data-bs-theme="dark"] .text-bg-light { background-color: var(--bs-tertiary-bg) !important; color: var(--bs-body-color) !important; }
[data-bs-theme="dark"] .text-bg-dark { background-color: #4a4a54 !important; color: #fff !important; }
[data-bs-theme="dark"] .btn-light { --bs-btn-bg: #34343b; --bs-btn-border-color: #44444c; --bs-btn-color: #f0f0f0;
  --bs-btn-hover-bg: #3e3e46; --bs-btn-hover-border-color: #50505a; --bs-btn-hover-color: #fff; --bs-btn-active-bg: #46464f; }
[data-bs-theme="dark"] .btn-primary { --bs-btn-disabled-bg: #3e3e46; --bs-btn-disabled-border-color: #3e3e46; --bs-btn-disabled-color: #9a9a9a;
  --bs-btn-active-bg: #444791; --bs-btn-active-border-color: #444791; }
[data-bs-theme="dark"] .btn-outline-primary { --bs-btn-color: #9ea2ff; --bs-btn-border-color: #6a6fd6; --bs-btn-active-bg: #444791; }
[data-bs-theme="dark"] .text-brand { color: var(--brand-light) !important; }

/* ---------- smooth, light interactions (no libraries) ---------- */
body { transition: background-color .2s ease, color .2s ease; }
.btn, .form-control, .form-select, .form-check-input, .badge, .dropdown-item, .nav-link {
  transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease, transform .15s ease; }
.btn:active:not(:disabled) { transform: translateY(1px); }
.btn-primary:hover:not(:disabled) { box-shadow: 0 2px 8px rgba(91,95,199,.35); }
:focus-visible { outline: 2px solid var(--brand-light, #7f85f5); outline-offset: 2px; }
.btn:focus-visible, .form-control:focus-visible, .form-select:focus-visible { outline: 0; }
.dropdown-menu { border-radius: var(--radius); border-color: var(--line); box-shadow: 0 8px 24px rgba(0,0,0,.14); padding: .35rem;
  animation: pop-in .14s ease-out; }
.dropdown-item { border-radius: 5px; }
.toast { border-radius: var(--radius); box-shadow: 0 8px 24px rgba(0,0,0,.18); animation: pop-in .18s ease-out; }
@keyframes pop-in { from { opacity: 0; transform: translateY(4px) scale(.98); } to { opacity: 1; transform: none; } }

/* ---------- modals and the confirmation dialog (replaces the browser's confirm / prompt) ---------- */
.modal-content { border: 0; border-radius: 12px; box-shadow: 0 18px 48px rgba(0,0,0,.28); }
.modal-header, .modal-footer { border-color: var(--line); }
.modal-backdrop.show { opacity: .45; }
.modal.fade .modal-dialog { transform: translateY(10px) scale(.98); transition: transform .18s ease-out; }
.modal.show .modal-dialog { transform: none; }
.dlg .modal-content { padding: .4rem .25rem .2rem; }
.dlg .modal-body { display: flex; gap: .9rem; align-items: flex-start; padding: 1.1rem 1.25rem .6rem; }
.dlg-icon { width: 40px; height: 40px; flex: none; border-radius: 50%; display: grid; place-items: center; font-size: 1.15rem;
  background: var(--brand-soft); color: var(--brand); }
.dlg.danger .dlg-icon { background: rgba(196,49,75,.12); color: #c4314b; }
[data-bs-theme="dark"] .dlg.danger .dlg-icon { background: rgba(241,112,123,.16); color: #f1707b; }
.dlg-title { font-size: 1.02rem; font-weight: 700; margin: .1rem 0 .3rem; }
.dlg-text { color: var(--muted); font-size: .9rem; margin: 0; white-space: pre-line; }
.dlg .modal-footer { border-top: 0; padding: .4rem 1.25rem 1rem; gap: .4rem; }
.dlg .modal-footer > * { margin: 0; }
.dlg .btn { min-width: 88px; }
.btn-danger { font-weight: 600; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
