/* AUTO-GENERATED from resources/css/app.css -- edit resources/css/**, then rebuild. */
@layer base, layout, components, pages, utilities;

@layer base {
/* ---- base/variables.css ---- */
/* Auto-generated during CSS architecture refactor — see CHANGES for details. */
:root {
  --primary: #16A34A;
  --primary-dark: #14532D;
  --primary-light: #DCFCE7;
  --primary-700: #15803D;
  --primary-900: #052E16;
  --bg: #F3F7F4;
  --surface: #FFFFFF;
  --surface-soft: #F8FBF9;
  --white: #FFFFFF;
  --text: #17231B;
  --text-strong: #0F1F14;
  --text-muted: #66756B;
  --border: #DDE7E0;
  --border-strong: #C8D8CD;
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius: 18px;
  --radius-lg: 24px;
  --shadow-xs: 0 1px 2px rgba(15, 46, 25, .05);
  --shadow-sm: 0 8px 22px rgba(15, 46, 25, .07);
  --shadow: 0 14px 36px rgba(15, 46, 25, .09);
  --shadow-lg: 0 24px 60px rgba(15, 46, 25, .13);
  --focus-ring: 0 0 0 4px rgba(22, 163, 74, .16);
  --control-height: 48px;
  --control-height-sm: 38px;
  --control-height-lg: 54px;
  --success: #16A34A;
  --success-dark: #15803D;
  --danger: #DC2626;
  --danger-dark: #B91C1C;
  --warning: #D97706;
  --warning-dark: #B45309;
  --info: #0F766E;
  --info-dark: #115E59;
  --neutral: #64748B;
  --neutral-dark: #334155;
  --dark: #1F2937;
  --row-hover: #F0FDF4;
  --sidebar-muted: #BBF7D0;
  --neutral-light: #F1F5F2;
  --neutral-dark: #374151;

  /* ============================================================
   * Bootstrap-removal tokens (Phase 1 — added, nothing above changed).
   * These intentionally mirror Bootstrap 5.3's own default values so that
   * existing Bootstrap class usage (.btn-success, .text-danger, .gap-2,
   * .g-3, .fw-bold, .shadow-sm, etc.) renders pixel-identical once its CSS
   * is reimplemented locally in later phases. Do not "improve" these
   * values — matching Bootstrap's current output is the goal, not
   * redesigning the palette.
   * ============================================================ */

  /* Contextual colors (Bootstrap defaults) */
  --bs-primary: #0d6efd;
  --bs-primary-rgb: 13, 110, 253;
  --bs-secondary: #6c757d;
  --bs-secondary-rgb: 108, 117, 125;
  --bs-success: #198754;
  --bs-success-rgb: 25, 135, 84;
  --bs-danger: #dc3545;
  --bs-danger-rgb: 220, 53, 69;
  --bs-warning: #ffc107;
  --bs-warning-rgb: 255, 193, 7;
  --bs-info: #0dcaf0;
  --bs-info-rgb: 13, 202, 240;
  --bs-light: #f8f9fa;
  --bs-light-rgb: 248, 249, 250;
  --bs-dark: #212529;
  --bs-dark-rgb: 33, 37, 41;
  --bs-white: #ffffff;
  --bs-muted: #6c757d;
  --bs-border-color: #dee2e6;
  --bs-link-color: #0d6efd;

  /* Border radius (Bootstrap defaults) */
  --bs-radius: 0.375rem;
  --bs-radius-sm: 0.25rem;
  --bs-radius-lg: 0.5rem;
  --bs-radius-pill: 50rem;

  /* Box shadow (Bootstrap defaults) */
  --bs-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
  --bs-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  --bs-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);

  /* Font weight (Bootstrap defaults) */
  --bs-fw-normal: 400;
  --bs-fw-semibold: 600;
  --bs-fw-bold: 700;

  /* Spacer scale — powers gap, grid-gutter and spacing utility classes.
     Matches Bootstrap's spacer multiplier values. */
  --bs-spacer-0: 0;
  --bs-spacer-1: 0.25rem;
  --bs-spacer-2: 0.5rem;
  --bs-spacer-3: 1rem;
  --bs-spacer-4: 1.5rem;
  --bs-spacer-5: 3rem;

  /* Grid */
  --grid-columns: 12;
  --grid-gutter-x: 1.5rem;
  --grid-gutter-y: 0;

  /* Breakpoints — reference only. CSS custom properties cannot be used
     inside @media conditions, so grid breakpoint/responsive files hard-code these
     same pixel values directly. Keep every file in sync if these ever change:
     sm: 576px   md: 768px   lg: 992px   xl: 1200px   xxl: 1400px */
}

/* ---- base/reset.css ---- */
/* Auto-generated during CSS architecture refactor — see CHANGES for details. */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

a {
  text-decoration: none;
}

img {
  max-width: 100%;
}

/* ============================================================
 * Bootstrap Reboot-equivalent rules (Phase 1 — Bootstrap removal).
 * The three rules above already zero out margin/padding more thoroughly
 * than Bootstrap's own Reboot does, so they are left exactly as-is.
 * Everything below replaces specific Reboot behaviors the app currently
 * gets "for free" from Bootstrap's CSS (loaded before this file), so
 * removing the Bootstrap CDN later causes no visible change.
 * ============================================================ */

html {
  -webkit-text-size-adjust: 100%;
  line-height: 1.5;
}

/* Bootstrap Reboot sets plain links to the theme's primary blue by default.
   Any link in the app without a more specific color rule is currently
   rendering this color — preserved here so it doesn't silently change. */
a {
  color: var(--bs-link-color);
}

a:hover {
  color: var(--bs-link-color);
}

table {
  border-collapse: collapse;
  caption-side: bottom;
}

img,
svg {
  vertical-align: middle;
}

button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  color: inherit;
}

button {
  cursor: pointer;
  background-color: transparent;
  border: 0;
}

[role="button"] {
  cursor: pointer;
}

fieldset {
  border: 0;
}

legend {
  float: left;
  width: 100%;
}

/* ---- base/typography.css ---- */
/* Auto-generated during CSS architecture refactor — see CHANGES for details. */
body {
  background: var(--bg);
  color: var(--text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  /* Safety net for mobile: stops the whole page from gaining a horizontal
     scrollbar if any element ever slightly overflows the viewport. Doesn't
     affect intentionally-scrollable elements like .table-responsive, which
     manage their own overflow independently. */
  overflow-x: hidden;
  line-height: 1.55;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

.abit-title {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: clamp(1.25rem, 2vw, 1.6rem);
  font-weight: 780;
  margin-bottom: 20px;
  color: var(--text-strong);
  letter-spacing: -.025em;
}

.abit-title i {
  color: var(--primary-dark);
  font-size: 20px;
}

/* ---- components/page-header.css ---- */
/* ============================================================
 * PageHeader.vue
 * .abit-title remains a shared typography primitive.
 * ============================================================ */
.abit-title-icon {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  flex: 0 0 auto;
  border-radius: 12px;
  color: var(--primary-dark);
  background: var(--primary-light);
}

.abit-page-heading { min-width: 0; }
.abit-page-subtitle {
  max-width: 760px;
  margin: 6px 0 0 50px;
  color: var(--text-muted);
  font-size: .86rem;
  line-height: 1.5;
}
.abit-page-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.abit-section-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 18px;
  flex-wrap: wrap;
  gap: 15px;
}

/* ---- base/icons.css ---- */
/*
 * ABIT icons — Bootstrap Icons CDN replacement (Phase 4).
 *
 * Same "bi bi-{name}" class names as before, so no Blade view changes.
 * Each icon's actual artwork (fetched from the official open-source
 * twbs/icons repository — MIT licensed, same source Bootstrap Icons itself
 * ships from) is embedded as a CSS mask, so it renders in `currentColor`
 * and resizes with font-size, exactly like the icon font it replaces.
 * Only the 99 icons this app actually uses are included (not the full
 * ~2,000-icon set), so this file is smaller than the font it replaces.
 */

.bi {
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: -0.125em;
  background-color: currentColor;
  -webkit-mask-image: var(--bi-svg);
  mask-image: var(--bi-svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-position: center;
  mask-position: center;
}

.bi-arrow-counterclockwise { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath fill-rule='evenodd' d='M8 3a5 5 0 1 1-4.546 2.914.5.5 0 0 0-.908-.417A6 6 0 1 0 8 2z'/%3E %3Cpath d='M8 4.466V.534a.25.25 0 0 0-.41-.192L5.23 2.308a.25.25 0 0 0 0 .384l2.36 1.966A.25.25 0 0 0 8 4.466'/%3E %3C/svg%3E"); }
.bi-arrow-down-up { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath fill-rule='evenodd' d='M11.5 15a.5.5 0 0 0 .5-.5V2.707l3.146 3.147a.5.5 0 0 0 .708-.708l-4-4a.5.5 0 0 0-.708 0l-4 4a.5.5 0 1 0 .708.708L11 2.707V14.5a.5.5 0 0 0 .5.5m-7-14a.5.5 0 0 1 .5.5v11.793l3.146-3.147a.5.5 0 0 1 .708.708l-4 4a.5.5 0 0 1-.708 0l-4-4a.5.5 0 0 1 .708-.708L4 13.293V1.5a.5.5 0 0 1 .5-.5'/%3E %3C/svg%3E"); }
.bi-arrow-left { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath fill-rule='evenodd' d='M15 8a.5.5 0 0 0-.5-.5H2.707l3.147-3.146a.5.5 0 1 0-.708-.708l-4 4a.5.5 0 0 0 0 .708l4 4a.5.5 0 0 0 .708-.708L2.707 8.5H14.5A.5.5 0 0 0 15 8'/%3E %3C/svg%3E"); }
.bi-arrow-repeat { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M11.534 7h3.932a.25.25 0 0 1 .192.41l-1.966 2.36a.25.25 0 0 1-.384 0l-1.966-2.36a.25.25 0 0 1 .192-.41m-11 2h3.932a.25.25 0 0 0 .192-.41L2.692 6.23a.25.25 0 0 0-.384 0L.342 8.59A.25.25 0 0 0 .534 9'/%3E %3Cpath fill-rule='evenodd' d='M8 3c-1.552 0-2.94.707-3.857 1.818a.5.5 0 1 1-.771-.636A6.002 6.002 0 0 1 13.917 7H12.9A5 5 0 0 0 8 3M3.1 9a5.002 5.002 0 0 0 8.757 2.182.5.5 0 1 1 .771.636A6.002 6.002 0 0 1 2.083 9z'/%3E %3C/svg%3E"); }
.bi-bar-chart { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M4 11H2v3h2zm5-4H7v7h2zm5-5v12h-2V2zm-2-1a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h2a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1zM6 7a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v7a1 1 0 0 1-1 1H7a1 1 0 0 1-1-1zm-5 4a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1z'/%3E %3C/svg%3E"); }
.bi-bar-chart-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M1 11a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1zm5-4a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v7a1 1 0 0 1-1 1H7a1 1 0 0 1-1-1zm5-5a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1h-2a1 1 0 0 1-1-1z'/%3E %3C/svg%3E"); }
.bi-bar-chart-line { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M11 2a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v12h.5a.5.5 0 0 1 0 1H.5a.5.5 0 0 1 0-1H1v-3a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v3h1V7a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v7h1zm1 12h2V2h-2zm-3 0V7H7v7zm-5 0v-3H2v3z'/%3E %3C/svg%3E"); }
.bi-bar-chart-line-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M11 2a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v12h.5a.5.5 0 0 1 0 1H.5a.5.5 0 0 1 0-1H1v-3a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v3h1V7a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v7h1z'/%3E %3C/svg%3E"); }
.bi-bell-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M8 16a2 2 0 0 0 2-2H6a2 2 0 0 0 2 2m.995-14.901a1 1 0 1 0-1.99 0A5 5 0 0 0 3 6c0 1.098-.5 6-2 7h14c-1.5-1-2-5.902-2-7 0-2.42-1.72-4.44-4.005-4.901'/%3E %3C/svg%3E"); }
.bi-box-arrow-in-right { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath fill-rule='evenodd' d='M6 3.5a.5.5 0 0 1 .5-.5h8a.5.5 0 0 1 .5.5v9a.5.5 0 0 1-.5.5h-8a.5.5 0 0 1-.5-.5v-2a.5.5 0 0 0-1 0v2A1.5 1.5 0 0 0 6.5 14h8a1.5 1.5 0 0 0 1.5-1.5v-9A1.5 1.5 0 0 0 14.5 2h-8A1.5 1.5 0 0 0 5 3.5v2a.5.5 0 0 0 1 0z'/%3E %3Cpath fill-rule='evenodd' d='M11.854 8.354a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5H1.5a.5.5 0 0 0 0 1h8.793l-2.147 2.146a.5.5 0 0 0 .708.708z'/%3E %3C/svg%3E"); }
.bi-box-arrow-right { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath fill-rule='evenodd' d='M10 12.5a.5.5 0 0 1-.5.5h-8a.5.5 0 0 1-.5-.5v-9a.5.5 0 0 1 .5-.5h8a.5.5 0 0 1 .5.5v2a.5.5 0 0 0 1 0v-2A1.5 1.5 0 0 0 9.5 2h-8A1.5 1.5 0 0 0 0 3.5v9A1.5 1.5 0 0 0 1.5 14h8a1.5 1.5 0 0 0 1.5-1.5v-2a.5.5 0 0 0-1 0z'/%3E %3Cpath fill-rule='evenodd' d='M15.854 8.354a.5.5 0 0 0 0-.708l-3-3a.5.5 0 0 0-.708.708L14.293 7.5H5.5a.5.5 0 0 0 0 1h8.793l-2.147 2.146a.5.5 0 0 0 .708.708z'/%3E %3C/svg%3E"); }
.bi-box-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath fill-rule='evenodd' d='M15.528 2.973a.75.75 0 0 1 .472.696v8.662a.75.75 0 0 1-.472.696l-7.25 2.9a.75.75 0 0 1-.557 0l-7.25-2.9A.75.75 0 0 1 0 12.331V3.669a.75.75 0 0 1 .471-.696L7.443.184l.004-.001.274-.11a.75.75 0 0 1 .558 0l.274.11.004.001zm-1.374.527L8 5.962 1.846 3.5 1 3.839v.4l6.5 2.6v7.922l.5.2.5-.2V6.84l6.5-2.6v-.4l-.846-.339Z'/%3E %3C/svg%3E"); }
.bi-briefcase { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M6.5 1A1.5 1.5 0 0 0 5 2.5V3H1.5A1.5 1.5 0 0 0 0 4.5v8A1.5 1.5 0 0 0 1.5 14h13a1.5 1.5 0 0 0 1.5-1.5v-8A1.5 1.5 0 0 0 14.5 3H11v-.5A1.5 1.5 0 0 0 9.5 1zm0 1h3a.5.5 0 0 1 .5.5V3H6v-.5a.5.5 0 0 1 .5-.5m1.886 6.914L15 7.151V12.5a.5.5 0 0 1-.5.5h-13a.5.5 0 0 1-.5-.5V7.15l6.614 1.764a1.5 1.5 0 0 0 .772 0M1.5 4h13a.5.5 0 0 1 .5.5v1.616L8.129 7.948a.5.5 0 0 1-.258 0L1 6.116V4.5a.5.5 0 0 1 .5-.5'/%3E %3C/svg%3E"); }
.bi-briefcase-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M6.5 1A1.5 1.5 0 0 0 5 2.5V3H1.5A1.5 1.5 0 0 0 0 4.5v1.384l7.614 2.03a1.5 1.5 0 0 0 .772 0L16 5.884V4.5A1.5 1.5 0 0 0 14.5 3H11v-.5A1.5 1.5 0 0 0 9.5 1zm0 1h3a.5.5 0 0 1 .5.5V3H6v-.5a.5.5 0 0 1 .5-.5'/%3E %3Cpath d='M0 12.5A1.5 1.5 0 0 0 1.5 14h13a1.5 1.5 0 0 0 1.5-1.5V6.85L8.129 8.947a.5.5 0 0 1-.258 0L0 6.85z'/%3E %3C/svg%3E"); }
.bi-building { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M4 2.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5zm3 0a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5zm3.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5zM4 5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5zM7.5 5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5zm2.5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5zM4.5 8a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5zm2.5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5zm3.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5z'/%3E %3Cpath d='M2 1a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1zm11 0H3v14h3v-2.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 .5.5V15h3z'/%3E %3C/svg%3E"); }
.bi-building-fill-lock { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M2 1a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7.764a3 3 0 0 0-4.989 2.497 2 2 0 0 0-.743.739H6.5a.5.5 0 0 0-.5.5V16H3a1 1 0 0 1-1-1zm2 1.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5m3 0v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5m3.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5zM4 5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5M7.5 5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5zm2.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5M4.5 8a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5zm2.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5'/%3E %3Cpath d='M9 13a1 1 0 0 1 1-1v-1a2 2 0 1 1 4 0v1a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1h-4a1 1 0 0 1-1-1zm3-3a1 1 0 0 0-1 1v1h2v-1a1 1 0 0 0-1-1'/%3E %3C/svg%3E"); }
.bi-bullseye { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14m0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16'/%3E %3Cpath d='M8 13A5 5 0 1 1 8 3a5 5 0 0 1 0 10m0 1A6 6 0 1 0 8 2a6 6 0 0 0 0 12'/%3E %3Cpath d='M8 11a3 3 0 1 1 0-6 3 3 0 0 1 0 6m0 1a4 4 0 1 0 0-8 4 4 0 0 0 0 8'/%3E %3Cpath d='M9.5 8a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0'/%3E %3C/svg%3E"); }
.bi-calendar-check { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M10.854 7.146a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708 0l-1.5-1.5a.5.5 0 1 1 .708-.708L7.5 9.793l2.646-2.647a.5.5 0 0 1 .708 0'/%3E %3Cpath d='M3.5 0a.5.5 0 0 1 .5.5V1h8V.5a.5.5 0 0 1 1 0V1h1a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2h1V.5a.5.5 0 0 1 .5-.5M1 4v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V4z'/%3E %3C/svg%3E"); }
.bi-calendar-event { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M11 6.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5z'/%3E %3Cpath d='M3.5 0a.5.5 0 0 1 .5.5V1h8V.5a.5.5 0 0 1 1 0V1h1a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2h1V.5a.5.5 0 0 1 .5-.5M1 4v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V4z'/%3E %3C/svg%3E"); }
.bi-calendar-week-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M4 .5a.5.5 0 0 0-1 0V1H2a2 2 0 0 0-2 2v1h16V3a2 2 0 0 0-2-2h-1V.5a.5.5 0 0 0-1 0V1H4zM16 14V5H0v9a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2M9.5 7h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1a.5.5 0 0 1 .5-.5m3 0h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1a.5.5 0 0 1 .5-.5M2 10.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5zm3.5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1a.5.5 0 0 1 .5-.5'/%3E %3C/svg%3E"); }
.bi-calendar3 { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M14 0H2a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2M1 3.857C1 3.384 1.448 3 2 3h12c.552 0 1 .384 1 .857v10.286c0 .473-.448.857-1 .857H2c-.552 0-1-.384-1-.857z'/%3E %3Cpath d='M6.5 7a1 1 0 1 0 0-2 1 1 0 0 0 0 2m3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2m3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2m-9 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2m3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2m3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2m3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2m-9 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2m3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2m3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2'/%3E %3C/svg%3E"); }
.bi-camera { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M15 12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1h1.172a3 3 0 0 0 2.12-.879l.83-.828A1 1 0 0 1 6.827 3h2.344a1 1 0 0 1 .707.293l.828.828A3 3 0 0 0 12.828 5H14a1 1 0 0 1 1 1zM2 4a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2h-1.172a2 2 0 0 1-1.414-.586l-.828-.828A2 2 0 0 0 9.172 2H6.828a2 2 0 0 0-1.414.586l-.828.828A2 2 0 0 1 3.172 4z'/%3E %3Cpath d='M8 11a2.5 2.5 0 1 1 0-5 2.5 2.5 0 0 1 0 5m0 1a3.5 3.5 0 1 0 0-7 3.5 3.5 0 0 0 0 7M3 6.5a.5.5 0 1 1-1 0 .5.5 0 0 1 1 0'/%3E %3C/svg%3E"); }
.bi-camera-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M10.5 8.5a2.5 2.5 0 1 1-5 0 2.5 2.5 0 0 1 5 0'/%3E %3Cpath d='M2 4a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2h-1.172a2 2 0 0 1-1.414-.586l-.828-.828A2 2 0 0 0 9.172 2H6.828a2 2 0 0 0-1.414.586l-.828.828A2 2 0 0 1 3.172 4zm.5 2a.5.5 0 1 1 0-1 .5.5 0 0 1 0 1m9 2.5a3.5 3.5 0 1 1-7 0 3.5 3.5 0 0 1 7 0'/%3E %3C/svg%3E"); }
.bi-cash-coin { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath fill-rule='evenodd' d='M11 15a4 4 0 1 0 0-8 4 4 0 0 0 0 8m5-4a5 5 0 1 1-10 0 5 5 0 0 1 10 0'/%3E %3Cpath d='M9.438 11.944c.047.596.518 1.06 1.363 1.116v.44h.375v-.443c.875-.061 1.386-.529 1.386-1.207 0-.618-.39-.936-1.09-1.1l-.296-.07v-1.2c.376.043.614.248.671.532h.658c-.047-.575-.54-1.024-1.329-1.073V8.5h-.375v.45c-.747.073-1.255.522-1.255 1.158 0 .562.378.92 1.007 1.066l.248.061v1.272c-.384-.058-.639-.27-.696-.563h-.668zm1.36-1.354c-.369-.085-.569-.26-.569-.522 0-.294.216-.514.572-.578v1.1zm.432.746c.449.104.655.272.655.569 0 .339-.257.571-.709.614v-1.195z'/%3E %3Cpath d='M1 0a1 1 0 0 0-1 1v8a1 1 0 0 0 1 1h4.083q.088-.517.258-1H3a2 2 0 0 0-2-2V3a2 2 0 0 0 2-2h10a2 2 0 0 0 2 2v3.528c.38.34.717.728 1 1.154V1a1 1 0 0 0-1-1z'/%3E %3Cpath d='M9.998 5.083 10 5a2 2 0 1 0-3.132 1.65 6 6 0 0 1 3.13-1.567'/%3E %3C/svg%3E"); }
.bi-cash-stack { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M1 3a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1zm7 8a2 2 0 1 0 0-4 2 2 0 0 0 0 4'/%3E %3Cpath d='M0 5a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v8a1 1 0 0 1-1 1H1a1 1 0 0 1-1-1zm3 0a2 2 0 0 1-2 2v4a2 2 0 0 1 2 2h10a2 2 0 0 1 2-2V7a2 2 0 0 1-2-2z'/%3E %3C/svg%3E"); }
.bi-chat-dots-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M16 8c0 3.866-3.582 7-8 7a9 9 0 0 1-2.347-.306c-.584.296-1.925.864-4.181 1.234-.2.032-.352-.176-.273-.362.354-.836.674-1.95.77-2.966C.744 11.37 0 9.76 0 8c0-3.866 3.582-7 8-7s8 3.134 8 7M5 8a1 1 0 1 0-2 0 1 1 0 0 0 2 0m4 0a1 1 0 1 0-2 0 1 1 0 0 0 2 0m3 1a1 1 0 1 0 0-2 1 1 0 0 0 0 2'/%3E %3C/svg%3E"); }
.bi-check-circle { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14m0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16'/%3E %3Cpath d='m10.97 4.97-.02.022-3.473 4.425-2.093-2.094a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-1.071-1.05'/%3E %3C/svg%3E"); }
.bi-check-circle-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0m-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z'/%3E %3C/svg%3E"); }
.bi-check2-all { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M12.354 4.354a.5.5 0 0 0-.708-.708L5 10.293 1.854 7.146a.5.5 0 1 0-.708.708l3.5 3.5a.5.5 0 0 0 .708 0zm-4.208 7-.896-.897.707-.707.543.543 6.646-6.647a.5.5 0 0 1 .708.708l-7 7a.5.5 0 0 1-.708 0'/%3E %3Cpath d='m5.354 7.146.896.897-.707.707-.897-.896a.5.5 0 1 1 .708-.708'/%3E %3C/svg%3E"); }
.bi-chevron-down { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708'/%3E %3C/svg%3E"); }
.bi-clipboard-data { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M4 11a1 1 0 1 1 2 0v1a1 1 0 1 1-2 0zm6-4a1 1 0 1 1 2 0v5a1 1 0 1 1-2 0zM7 9a1 1 0 0 1 2 0v3a1 1 0 1 1-2 0z'/%3E %3Cpath d='M4 1.5H3a2 2 0 0 0-2 2V14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V3.5a2 2 0 0 0-2-2h-1v1h1a1 1 0 0 1 1 1V14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V3.5a1 1 0 0 1 1-1h1z'/%3E %3Cpath d='M9.5 1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-3a.5.5 0 0 1-.5-.5v-1a.5.5 0 0 1 .5-.5zm-3-1A1.5 1.5 0 0 0 5 1.5v1A1.5 1.5 0 0 0 6.5 4h3A1.5 1.5 0 0 0 11 2.5v-1A1.5 1.5 0 0 0 9.5 0z'/%3E %3C/svg%3E"); }
.bi-clock-history { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M8.515 1.019A7 7 0 0 0 8 1V0a8 8 0 0 1 .589.022zm2.004.45a7 7 0 0 0-.985-.299l.219-.976q.576.129 1.126.342zm1.37.71a7 7 0 0 0-.439-.27l.493-.87a8 8 0 0 1 .979.654l-.615.789a7 7 0 0 0-.418-.302zm1.834 1.79a7 7 0 0 0-.653-.796l.724-.69q.406.429.747.91zm.744 1.352a7 7 0 0 0-.214-.468l.893-.45a8 8 0 0 1 .45 1.088l-.95.313a7 7 0 0 0-.179-.483m.53 2.507a7 7 0 0 0-.1-1.025l.985-.17q.1.58.116 1.17zm-.131 1.538q.05-.254.081-.51l.993.123a8 8 0 0 1-.23 1.155l-.964-.267q.069-.247.12-.501m-.952 2.379q.276-.436.486-.908l.914.405q-.24.54-.555 1.038zm-.964 1.205q.183-.183.35-.378l.758.653a8 8 0 0 1-.401.432z'/%3E %3Cpath d='M8 1a7 7 0 1 0 4.95 11.95l.707.707A8.001 8.001 0 1 1 8 0z'/%3E %3Cpath d='M7.5 3a.5.5 0 0 1 .5.5v5.21l3.248 1.856a.5.5 0 0 1-.496.868l-3.5-2A.5.5 0 0 1 7 9V3.5a.5.5 0 0 1 .5-.5'/%3E %3C/svg%3E"); }
.bi-cloud-download { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M4.406 1.342A5.53 5.53 0 0 1 8 0c2.69 0 4.923 2 5.166 4.579C14.758 4.804 16 6.137 16 7.773 16 9.569 14.502 11 12.687 11H10a.5.5 0 0 1 0-1h2.688C13.979 10 15 8.988 15 7.773c0-1.216-1.02-2.228-2.313-2.228h-.5v-.5C12.188 2.825 10.328 1 8 1a4.53 4.53 0 0 0-2.941 1.1c-.757.652-1.153 1.438-1.153 2.055v.448l-.445.049C2.064 4.805 1 5.952 1 7.318 1 8.785 2.23 10 3.781 10H6a.5.5 0 0 1 0 1H3.781C1.708 11 0 9.366 0 7.318c0-1.763 1.266-3.223 2.942-3.593.143-.863.698-1.723 1.464-2.383'/%3E %3Cpath d='M7.646 15.854a.5.5 0 0 0 .708 0l3-3a.5.5 0 0 0-.708-.708L8.5 14.293V5.5a.5.5 0 0 0-1 0v8.793l-2.146-2.147a.5.5 0 0 0-.708.708z'/%3E %3C/svg%3E"); }
.bi-collection { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M2.5 3.5a.5.5 0 0 1 0-1h11a.5.5 0 0 1 0 1zm2-2a.5.5 0 0 1 0-1h7a.5.5 0 0 1 0 1zM0 13a1.5 1.5 0 0 0 1.5 1.5h13A1.5 1.5 0 0 0 16 13V6a1.5 1.5 0 0 0-1.5-1.5h-13A1.5 1.5 0 0 0 0 6zm1.5.5A.5.5 0 0 1 1 13V6a.5.5 0 0 1 .5-.5h13a.5.5 0 0 1 .5.5v7a.5.5 0 0 1-.5.5z'/%3E %3C/svg%3E"); }
.bi-columns-gap { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M6 1v3H1V1zM1 0a1 1 0 0 0-1 1v3a1 1 0 0 0 1 1h5a1 1 0 0 0 1-1V1a1 1 0 0 0-1-1zm14 12v3h-5v-3zm-5-1a1 1 0 0 0-1 1v3a1 1 0 0 0 1 1h5a1 1 0 0 0 1-1v-3a1 1 0 0 0-1-1zM6 8v7H1V8zM1 7a1 1 0 0 0-1 1v7a1 1 0 0 0 1 1h5a1 1 0 0 0 1-1V8a1 1 0 0 0-1-1zm14-6v7h-5V1zm-5-1a1 1 0 0 0-1 1v7a1 1 0 0 0 1 1h5a1 1 0 0 0 1-1V1a1 1 0 0 0-1-1z'/%3E %3C/svg%3E"); }
.bi-cursor-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M14.082 2.182a.5.5 0 0 1 .103.557L8.528 15.467a.5.5 0 0 1-.917-.007L5.57 10.694.803 8.652a.5.5 0 0 1-.006-.916l12.728-5.657a.5.5 0 0 1 .556.103z'/%3E %3C/svg%3E"); }
.bi-envelope-open-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M8.941.435a2 2 0 0 0-1.882 0l-6 3.2A2 2 0 0 0 0 5.4v.314l6.709 3.932L8 8.928l1.291.718L16 5.714V5.4a2 2 0 0 0-1.059-1.765zM16 6.873l-5.693 3.337L16 13.372v-6.5Zm-.059 7.611L8 10.072.059 14.484A2 2 0 0 0 2 16h12a2 2 0 0 0 1.941-1.516M0 13.373l5.693-3.163L0 6.873z'/%3E %3C/svg%3E"); }
.bi-exclamation-triangle { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M7.938 2.016A.13.13 0 0 1 8.002 2a.13.13 0 0 1 .063.016.15.15 0 0 1 .054.057l6.857 11.667c.036.06.035.124.002.183a.2.2 0 0 1-.054.06.1.1 0 0 1-.066.017H1.146a.1.1 0 0 1-.066-.017.2.2 0 0 1-.054-.06.18.18 0 0 1 .002-.183L7.884 2.073a.15.15 0 0 1 .054-.057m1.044-.45a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767z'/%3E %3Cpath d='M7.002 12a1 1 0 1 1 2 0 1 1 0 0 1-2 0M7.1 5.995a.905.905 0 1 1 1.8 0l-.35 3.507a.552.552 0 0 1-1.1 0z'/%3E %3C/svg%3E"); }
.bi-exclamation-triangle-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M8.982 1.566a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767zM8 5c.535 0 .954.462.9.995l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 5.995A.905.905 0 0 1 8 5m.002 6a1 1 0 1 1 0 2 1 1 0 0 1 0-2'/%3E %3C/svg%3E"); }
.bi-eye { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M16 8s-3-5.5-8-5.5S0 8 0 8s3 5.5 8 5.5S16 8 16 8M1.173 8a13 13 0 0 1 1.66-2.043C4.12 4.668 5.88 3.5 8 3.5s3.879 1.168 5.168 2.457A13 13 0 0 1 14.828 8q-.086.13-.195.288c-.335.48-.83 1.12-1.465 1.755C11.879 11.332 10.119 12.5 8 12.5s-3.879-1.168-5.168-2.457A13 13 0 0 1 1.172 8z'/%3E %3Cpath d='M8 5.5a2.5 2.5 0 1 0 0 5 2.5 2.5 0 0 0 0-5M4.5 8a3.5 3.5 0 1 1 7 0 3.5 3.5 0 0 1-7 0'/%3E %3C/svg%3E"); }
.bi-eye-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M10.5 8a2.5 2.5 0 1 1-5 0 2.5 2.5 0 0 1 5 0'/%3E %3Cpath d='M0 8s3-5.5 8-5.5S16 8 16 8s-3 5.5-8 5.5S0 8 0 8m8 3.5a3.5 3.5 0 1 0 0-7 3.5 3.5 0 0 0 0 7'/%3E %3C/svg%3E"); }
.bi-file-earmark-bar-graph { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M10 13.5a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-6a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5zm-2.5.5a.5.5 0 0 1-.5-.5v-4a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v4a.5.5 0 0 1-.5.5zm-3 0a.5.5 0 0 1-.5-.5v-2a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-.5.5z'/%3E %3Cpath d='M14 14V4.5L9.5 0H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2M9.5 3A1.5 1.5 0 0 0 11 4.5h2V14a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h5.5z'/%3E %3C/svg%3E"); }
.bi-file-earmark-bar-graph-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M9.293 0H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V4.707A1 1 0 0 0 13.707 4L10 .293A1 1 0 0 0 9.293 0M9.5 3.5v-2l3 3h-2a1 1 0 0 1-1-1m.5 10v-6a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v6a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5m-2.5.5a.5.5 0 0 1-.5-.5v-4a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v4a.5.5 0 0 1-.5.5zm-3 0a.5.5 0 0 1-.5-.5v-2a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-.5.5z'/%3E %3C/svg%3E"); }
.bi-file-earmark-pdf { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M14 14V4.5L9.5 0H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2M9.5 3A1.5 1.5 0 0 0 11 4.5h2V14a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h5.5z'/%3E %3Cpath d='M4.603 14.087a.8.8 0 0 1-.438-.42c-.195-.388-.13-.776.08-1.102.198-.307.526-.568.897-.787a7.7 7.7 0 0 1 1.482-.645 20 20 0 0 0 1.062-2.227 7.3 7.3 0 0 1-.43-1.295c-.086-.4-.119-.796-.046-1.136.075-.354.274-.672.65-.823.192-.077.4-.12.602-.077a.7.7 0 0 1 .477.365c.088.164.12.356.127.538.007.188-.012.396-.047.614-.084.51-.27 1.134-.52 1.794a11 11 0 0 0 .98 1.686 5.8 5.8 0 0 1 1.334.05c.364.066.734.195.96.465.12.144.193.32.2.518.007.192-.047.382-.138.563a1.04 1.04 0 0 1-.354.416.86.86 0 0 1-.51.138c-.331-.014-.654-.196-.933-.417a5.7 5.7 0 0 1-.911-.95 11.7 11.7 0 0 0-1.997.406 11.3 11.3 0 0 1-1.02 1.51c-.292.35-.609.656-.927.787a.8.8 0 0 1-.58.029m1.379-1.901q-.25.115-.459.238c-.328.194-.541.383-.647.547-.094.145-.096.25-.04.361q.016.032.026.044l.035-.012c.137-.056.355-.235.635-.572a8 8 0 0 0 .45-.606m1.64-1.33a13 13 0 0 1 1.01-.193 12 12 0 0 1-.51-.858 21 21 0 0 1-.5 1.05zm2.446.45q.226.245.435.41c.24.19.407.253.498.256a.1.1 0 0 0 .07-.015.3.3 0 0 0 .094-.125.44.44 0 0 0 .059-.2.1.1 0 0 0-.026-.063c-.052-.062-.2-.152-.518-.209a4 4 0 0 0-.612-.053zM8.078 7.8a7 7 0 0 0 .2-.828q.046-.282.038-.465a.6.6 0 0 0-.032-.198.5.5 0 0 0-.145.04c-.087.035-.158.106-.196.283-.04.192-.03.469.046.822q.036.167.09.346z'/%3E %3C/svg%3E"); }
.bi-file-earmark-plus { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M8 6.5a.5.5 0 0 1 .5.5v1.5H10a.5.5 0 0 1 0 1H8.5V11a.5.5 0 0 1-1 0V9.5H6a.5.5 0 0 1 0-1h1.5V7a.5.5 0 0 1 .5-.5'/%3E %3Cpath d='M14 4.5V14a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V2a2 2 0 0 1 2-2h5.5zm-3 0A1.5 1.5 0 0 1 9.5 3V1H4a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V4.5z'/%3E %3C/svg%3E"); }
.bi-file-earmark-plus-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M9.293 0H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V4.707A1 1 0 0 0 13.707 4L10 .293A1 1 0 0 0 9.293 0M9.5 3.5v-2l3 3h-2a1 1 0 0 1-1-1M8.5 7v1.5H10a.5.5 0 0 1 0 1H8.5V11a.5.5 0 0 1-1 0V9.5H6a.5.5 0 0 1 0-1h1.5V7a.5.5 0 0 1 1 0'/%3E %3C/svg%3E"); }
.bi-file-earmark-text { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M5.5 7a.5.5 0 0 0 0 1h5a.5.5 0 0 0 0-1zM5 9.5a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5m0 2a.5.5 0 0 1 .5-.5h2a.5.5 0 0 1 0 1h-2a.5.5 0 0 1-.5-.5'/%3E %3Cpath d='M9.5 0H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V4.5zm0 1v2A1.5 1.5 0 0 0 11 4.5h2V14a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1z'/%3E %3C/svg%3E"); }
.bi-file-earmark-text-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M9.293 0H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V4.707A1 1 0 0 0 13.707 4L10 .293A1 1 0 0 0 9.293 0M9.5 3.5v-2l3 3h-2a1 1 0 0 1-1-1M4.5 9a.5.5 0 0 1 0-1h7a.5.5 0 0 1 0 1zM4 10.5a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5m.5 2.5a.5.5 0 0 1 0-1h4a.5.5 0 0 1 0 1z'/%3E %3C/svg%3E"); }
.bi-funnel { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M1.5 1.5A.5.5 0 0 1 2 1h12a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-.128.334L10 8.692V13.5a.5.5 0 0 1-.342.474l-3 1A.5.5 0 0 1 6 14.5V8.692L1.628 3.834A.5.5 0 0 1 1.5 3.5zm1 .5v1.308l4.372 4.858A.5.5 0 0 1 7 8.5v5.306l2-.666V8.5a.5.5 0 0 1 .128-.334L13.5 3.308V2z'/%3E %3C/svg%3E"); }
.bi-gear { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M8 4.754a3.246 3.246 0 1 0 0 6.492 3.246 3.246 0 0 0 0-6.492M5.754 8a2.246 2.246 0 1 1 4.492 0 2.246 2.246 0 0 1-4.492 0'/%3E %3Cpath d='M9.796 1.343c-.527-1.79-3.065-1.79-3.592 0l-.094.319a.873.873 0 0 1-1.255.52l-.292-.16c-1.64-.892-3.433.902-2.54 2.541l.159.292a.873.873 0 0 1-.52 1.255l-.319.094c-1.79.527-1.79 3.065 0 3.592l.319.094a.873.873 0 0 1 .52 1.255l-.16.292c-.892 1.64.901 3.434 2.541 2.54l.292-.159a.873.873 0 0 1 1.255.52l.094.319c.527 1.79 3.065 1.79 3.592 0l.094-.319a.873.873 0 0 1 1.255-.52l.292.16c1.64.893 3.434-.902 2.54-2.541l-.159-.292a.873.873 0 0 1 .52-1.255l.319-.094c1.79-.527 1.79-3.065 0-3.592l-.319-.094a.873.873 0 0 1-.52-1.255l.16-.292c.893-1.64-.902-3.433-2.541-2.54l-.292.159a.873.873 0 0 1-1.255-.52zm-2.633.283c.246-.835 1.428-.835 1.674 0l.094.319a1.873 1.873 0 0 0 2.693 1.115l.291-.16c.764-.415 1.6.42 1.184 1.185l-.159.292a1.873 1.873 0 0 0 1.116 2.692l.318.094c.835.246.835 1.428 0 1.674l-.319.094a1.873 1.873 0 0 0-1.115 2.693l.16.291c.415.764-.42 1.6-1.185 1.184l-.291-.159a1.873 1.873 0 0 0-2.693 1.116l-.094.318c-.246.835-1.428.835-1.674 0l-.094-.319a1.873 1.873 0 0 0-2.692-1.115l-.292.16c-.764.415-1.6-.42-1.184-1.185l.159-.291A1.873 1.873 0 0 0 1.945 8.93l-.319-.094c-.835-.246-.835-1.428 0-1.674l.319-.094A1.873 1.873 0 0 0 3.06 4.377l-.16-.292c-.415-.764.42-1.6 1.185-1.184l.292.159a1.873 1.873 0 0 0 2.692-1.115z'/%3E %3C/svg%3E"); }
.bi-gear-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M9.405 1.05c-.413-1.4-2.397-1.4-2.81 0l-.1.34a1.464 1.464 0 0 1-2.105.872l-.31-.17c-1.283-.698-2.686.705-1.987 1.987l.169.311c.446.82.023 1.841-.872 2.105l-.34.1c-1.4.413-1.4 2.397 0 2.81l.34.1a1.464 1.464 0 0 1 .872 2.105l-.17.31c-.698 1.283.705 2.686 1.987 1.987l.311-.169a1.464 1.464 0 0 1 2.105.872l.1.34c.413 1.4 2.397 1.4 2.81 0l.1-.34a1.464 1.464 0 0 1 2.105-.872l.31.17c1.283.698 2.686-.705 1.987-1.987l-.169-.311a1.464 1.464 0 0 1 .872-2.105l.34-.1c1.4-.413 1.4-2.397 0-2.81l-.34-.1a1.464 1.464 0 0 1-.872-2.105l.17-.31c.698-1.283-.705-2.686-1.987-1.987l-.311.169a1.464 1.464 0 0 1-2.105-.872zM8 10.93a2.929 2.929 0 1 1 0-5.86 2.929 2.929 0 0 1 0 5.858z'/%3E %3C/svg%3E"); }
.bi-geo-alt-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M8 16s6-5.686 6-10A6 6 0 0 0 2 6c0 4.314 6 10 6 10m0-7a3 3 0 1 1 0-6 3 3 0 0 1 0 6'/%3E %3C/svg%3E"); }
.bi-globe2 { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8m7.5-6.923c-.67.204-1.335.82-1.887 1.855q-.215.403-.395.872c.705.157 1.472.257 2.282.287zM4.249 3.539q.214-.577.481-1.078a7 7 0 0 1 .597-.933A7 7 0 0 0 3.051 3.05q.544.277 1.198.49zM3.509 7.5c.036-1.07.188-2.087.436-3.008a9 9 0 0 1-1.565-.667A6.96 6.96 0 0 0 1.018 7.5zm1.4-2.741a12.3 12.3 0 0 0-.4 2.741H7.5V5.091c-.91-.03-1.783-.145-2.591-.332M8.5 5.09V7.5h2.99a12.3 12.3 0 0 0-.399-2.741c-.808.187-1.681.301-2.591.332zM4.51 8.5c.035.987.176 1.914.399 2.741A13.6 13.6 0 0 1 7.5 10.91V8.5zm3.99 0v2.409c.91.03 1.783.145 2.591.332.223-.827.364-1.754.4-2.741zm-3.282 3.696q.18.469.395.872c.552 1.035 1.218 1.65 1.887 1.855V11.91c-.81.03-1.577.13-2.282.287zm.11 2.276a7 7 0 0 1-.598-.933 9 9 0 0 1-.481-1.079 8.4 8.4 0 0 0-1.198.49 7 7 0 0 0 2.276 1.522zm-1.383-2.964A13.4 13.4 0 0 1 3.508 8.5h-2.49a6.96 6.96 0 0 0 1.362 3.675c.47-.258.995-.482 1.565-.667m6.728 2.964a7 7 0 0 0 2.275-1.521 8.4 8.4 0 0 0-1.197-.49 9 9 0 0 1-.481 1.078 7 7 0 0 1-.597.933M8.5 11.909v3.014c.67-.204 1.335-.82 1.887-1.855q.216-.403.395-.872A12.6 12.6 0 0 0 8.5 11.91zm3.555-.401c.57.185 1.095.409 1.565.667A6.96 6.96 0 0 0 14.982 8.5h-2.49a13.4 13.4 0 0 1-.437 3.008M14.982 7.5a6.96 6.96 0 0 0-1.362-3.675c-.47.258-.995.482-1.565.667.248.92.4 1.938.437 3.008zM11.27 2.461q.266.502.482 1.078a8.4 8.4 0 0 0 1.196-.49 7 7 0 0 0-2.275-1.52c.218.283.418.597.597.932m-.488 1.343a8 8 0 0 0-.395-.872C9.835 1.897 9.17 1.282 8.5 1.077V4.09c.81-.03 1.577-.13 2.282-.287z'/%3E %3C/svg%3E"); }
.bi-graph-up-arrow { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath fill-rule='evenodd' d='M0 0h1v15h15v1H0zm10 3.5a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 .5.5v4a.5.5 0 0 1-1 0V4.9l-3.613 4.417a.5.5 0 0 1-.74.037L7.06 6.767l-3.656 5.027a.5.5 0 0 1-.808-.588l4-5.5a.5.5 0 0 1 .758-.06l2.609 2.61L13.445 4H10.5a.5.5 0 0 1-.5-.5'/%3E %3C/svg%3E"); }
.bi-hdd-network { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M4.5 5a.5.5 0 1 0 0-1 .5.5 0 0 0 0 1M3 4.5a.5.5 0 1 1-1 0 .5.5 0 0 1 1 0'/%3E %3Cpath d='M0 4a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v1a2 2 0 0 1-2 2H8.5v3a1.5 1.5 0 0 1 1.5 1.5h5.5a.5.5 0 0 1 0 1H10A1.5 1.5 0 0 1 8.5 14h-1A1.5 1.5 0 0 1 6 12.5H.5a.5.5 0 0 1 0-1H6A1.5 1.5 0 0 1 7.5 10V7H2a2 2 0 0 1-2-2zm1 0v1a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V4a1 1 0 0 0-1-1H2a1 1 0 0 0-1 1m6 7.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5'/%3E %3C/svg%3E"); }
.bi-headset { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M8 1a5 5 0 0 0-5 5v1h1a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V6a6 6 0 1 1 12 0v6a2.5 2.5 0 0 1-2.5 2.5H9.366a1 1 0 0 1-.866.5h-1a1 1 0 1 1 0-2h1a1 1 0 0 1 .866.5H11.5A1.5 1.5 0 0 0 13 12h-1a1 1 0 0 1-1-1V8a1 1 0 0 1 1-1h1V6a5 5 0 0 0-5-5'/%3E %3C/svg%3E"); }
.bi-hourglass-split { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M2.5 15a.5.5 0 1 1 0-1h1v-1a4.5 4.5 0 0 1 2.557-4.06c.29-.139.443-.377.443-.59v-.7c0-.213-.154-.451-.443-.59A4.5 4.5 0 0 1 3.5 3V2h-1a.5.5 0 0 1 0-1h11a.5.5 0 0 1 0 1h-1v1a4.5 4.5 0 0 1-2.557 4.06c-.29.139-.443.377-.443.59v.7c0 .213.154.451.443.59A4.5 4.5 0 0 1 12.5 13v1h1a.5.5 0 0 1 0 1zm2-13v1c0 .537.12 1.045.337 1.5h6.326c.216-.455.337-.963.337-1.5V2zm3 6.35c0 .701-.478 1.236-1.011 1.492A3.5 3.5 0 0 0 4.5 13s.866-1.299 3-1.48zm1 0v3.17c2.134.181 3 1.48 3 1.48a3.5 3.5 0 0 0-1.989-3.158C8.978 9.586 8.5 9.052 8.5 8.351z'/%3E %3C/svg%3E"); }
.bi-info-circle { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14m0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16'/%3E %3Cpath d='m8.93 6.588-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.808 1.319.545 0 1.178-.252 1.465-.598l.088-.416c-.2.176-.492.246-.686.246-.275 0-.375-.193-.304-.533zM9 4.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0'/%3E %3C/svg%3E"); }
.bi-info-circle-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16m.93-9.412-1 4.705c-.07.34.029.533.304.533.194 0 .487-.07.686-.246l-.088.416c-.287.346-.92.598-1.465.598-.703 0-1.002-.422-.808-1.319l.738-3.468c.064-.293.006-.399-.287-.47l-.451-.081.082-.381 2.29-.287zM8 5.5a1 1 0 1 1 0-2 1 1 0 0 1 0 2'/%3E %3C/svg%3E"); }
.bi-journal-text { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M5 10.5a.5.5 0 0 1 .5-.5h2a.5.5 0 0 1 0 1h-2a.5.5 0 0 1-.5-.5m0-2a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5m0-2a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5m0-2a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5'/%3E %3Cpath d='M3 0h10a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2v-1h1v1a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1v1H1V2a2 2 0 0 1 2-2'/%3E %3Cpath d='M1 5v-.5a.5.5 0 0 1 1 0V5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1zm0 3v-.5a.5.5 0 0 1 1 0V8h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1zm0 3v-.5a.5.5 0 0 1 1 0v.5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1z'/%3E %3C/svg%3E"); }
.bi-link-45deg { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M4.715 6.542 3.343 7.914a3 3 0 1 0 4.243 4.243l1.828-1.829A3 3 0 0 0 8.586 5.5L8 6.086a1 1 0 0 0-.154.199 2 2 0 0 1 .861 3.337L6.88 11.45a2 2 0 1 1-2.83-2.83l.793-.792a4 4 0 0 1-.128-1.287z'/%3E %3Cpath d='M6.586 4.672A3 3 0 0 0 7.414 9.5l.775-.776a2 2 0 0 1-.896-3.346L9.12 3.55a2 2 0 1 1 2.83 2.83l-.793.792c.112.42.155.855.128 1.287l1.372-1.372a3 3 0 1 0-4.243-4.243z'/%3E %3C/svg%3E"); }
.bi-list { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath fill-rule='evenodd' d='M2.5 12a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5m0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5m0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5'/%3E %3C/svg%3E"); }
.bi-list-ul { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath fill-rule='evenodd' d='M5 11.5a.5.5 0 0 1 .5-.5h9a.5.5 0 0 1 0 1h-9a.5.5 0 0 1-.5-.5m0-4a.5.5 0 0 1 .5-.5h9a.5.5 0 0 1 0 1h-9a.5.5 0 0 1-.5-.5m0-4a.5.5 0 0 1 .5-.5h9a.5.5 0 0 1 0 1h-9a.5.5 0 0 1-.5-.5m-3 1a1 1 0 1 0 0-2 1 1 0 0 0 0 2m0 4a1 1 0 1 0 0-2 1 1 0 0 0 0 2m0 4a1 1 0 1 0 0-2 1 1 0 0 0 0 2'/%3E %3C/svg%3E"); }
.bi-key-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M3 8a5 5 0 1 1 9.584 2H15a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1h-1a1 1 0 0 1-1-1v-1h-1v1a1 1 0 0 1-1 1H9.583A5.001 5.001 0 0 1 3 8m2-2a2 2 0 1 0 0 4 2 2 0 0 0 0-4'/%3E %3C/svg%3E"); }
.bi-lock-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath fill-rule='evenodd' d='M8 0a4 4 0 0 1 4 4v2.05a2.5 2.5 0 0 1 2 2.45v5a2.5 2.5 0 0 1-2.5 2.5h-7A2.5 2.5 0 0 1 2 13.5v-5a2.5 2.5 0 0 1 2-2.45V4a4 4 0 0 1 4-4m0 1a3 3 0 0 0-3 3v2h6V4a3 3 0 0 0-3-3'/%3E %3C/svg%3E"); }
.bi-paperclip { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M4.5 3a2.5 2.5 0 0 1 5 0v9a1.5 1.5 0 0 1-3 0V5a.5.5 0 0 1 1 0v7a.5.5 0 0 0 1 0V3a1.5 1.5 0 1 0-3 0v9a2.5 2.5 0 0 0 5 0V5a.5.5 0 0 1 1 0v7a3.5 3.5 0 1 1-7 0z'/%3E %3C/svg%3E"); }
.bi-pencil-square { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M15.502 1.94a.5.5 0 0 1 0 .706L14.459 3.69l-2-2L13.502.646a.5.5 0 0 1 .707 0l1.293 1.293zm-1.75 2.456-2-2L4.939 9.21a.5.5 0 0 0-.121.196l-.805 2.414a.25.25 0 0 0 .316.316l2.414-.805a.5.5 0 0 0 .196-.12l6.813-6.814z'/%3E %3Cpath fill-rule='evenodd' d='M1 13.5A1.5 1.5 0 0 0 2.5 15h11a1.5 1.5 0 0 0 1.5-1.5v-6a.5.5 0 0 0-1 0v6a.5.5 0 0 1-.5.5h-11a.5.5 0 0 1-.5-.5v-11a.5.5 0 0 1 .5-.5H9a.5.5 0 0 0 0-1H2.5A1.5 1.5 0 0 0 1 2.5z'/%3E %3C/svg%3E"); }
.bi-people { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M15 14s1 0 1-1-1-4-5-4-5 3-5 4 1 1 1 1zm-7.978-1L7 12.996c.001-.264.167-1.03.76-1.72C8.312 10.629 9.282 10 11 10c1.717 0 2.687.63 3.24 1.276.593.69.758 1.457.76 1.72l-.008.002-.014.002zM11 7a2 2 0 1 0 0-4 2 2 0 0 0 0 4m3-2a3 3 0 1 1-6 0 3 3 0 0 1 6 0M6.936 9.28a6 6 0 0 0-1.23-.247A7 7 0 0 0 5 9c-4 0-5 3-5 4q0 1 1 1h4.216A2.24 2.24 0 0 1 5 13c0-1.01.377-2.042 1.09-2.904.243-.294.526-.569.846-.816M4.92 10A5.5 5.5 0 0 0 4 13H1c0-.26.164-1.03.76-1.724.545-.636 1.492-1.256 3.16-1.275ZM1.5 5.5a3 3 0 1 1 6 0 3 3 0 0 1-6 0m3-2a2 2 0 1 0 0 4 2 2 0 0 0 0-4'/%3E %3C/svg%3E"); }
.bi-people-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M7 14s-1 0-1-1 1-4 5-4 5 3 5 4-1 1-1 1zm4-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6m-5.784 6A2.24 2.24 0 0 1 5 13c0-1.355.68-2.75 1.936-3.72A6.3 6.3 0 0 0 5 9c-4 0-5 3-5 4s1 1 1 1zM4.5 8a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5'/%3E %3C/svg%3E"); }
.bi-percent { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M13.442 2.558a.625.625 0 0 1 0 .884l-10 10a.625.625 0 1 1-.884-.884l10-10a.625.625 0 0 1 .884 0M4.5 6a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3m0 1a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5m7 6a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3m0 1a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5'/%3E %3C/svg%3E"); }
.bi-person { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M8 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6m2-3a2 2 0 1 1-4 0 2 2 0 0 1 4 0m4 8c0 1-1 1-1 1H3s-1 0-1-1 1-4 6-4 6 3 6 4m-1-.004c-.001-.246-.154-.986-.832-1.664C11.516 10.68 10.289 10 8 10s-3.516.68-4.168 1.332c-.678.678-.83 1.418-.832 1.664z'/%3E %3C/svg%3E"); }
.bi-person-badge-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M2 2a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2zm4.5 0a.5.5 0 0 0 0 1h3a.5.5 0 0 0 0-1zM8 11a3 3 0 1 0 0-6 3 3 0 0 0 0 6m5 2.755C12.146 12.825 10.623 12 8 12s-4.146.826-5 1.755V14a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1z'/%3E %3C/svg%3E"); }
.bi-person-check-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath fill-rule='evenodd' d='M15.854 5.146a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708 0l-1.5-1.5a.5.5 0 0 1 .708-.708L12.5 7.793l2.646-2.647a.5.5 0 0 1 .708 0'/%3E %3Cpath d='M1 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6'/%3E %3C/svg%3E"); }
.bi-person-gear { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M11 5a3 3 0 1 1-6 0 3 3 0 0 1 6 0M8 7a2 2 0 1 0 0-4 2 2 0 0 0 0 4m.256 7a4.5 4.5 0 0 1-.229-1.004H3c.001-.246.154-.986.832-1.664C4.484 10.68 5.711 10 8 10q.39 0 .74.025c.226-.341.496-.65.804-.918Q8.844 9.002 8 9c-5 0-6 3-6 4s1 1 1 1zm3.63-4.54c.18-.613 1.048-.613 1.229 0l.043.148a.64.64 0 0 0 .921.382l.136-.074c.561-.306 1.175.308.87.869l-.075.136a.64.64 0 0 0 .382.92l.149.045c.612.18.612 1.048 0 1.229l-.15.043a.64.64 0 0 0-.38.921l.074.136c.305.561-.309 1.175-.87.87l-.136-.075a.64.64 0 0 0-.92.382l-.045.149c-.18.612-1.048.612-1.229 0l-.043-.15a.64.64 0 0 0-.921-.38l-.136.074c-.561.305-1.175-.309-.87-.87l.075-.136a.64.64 0 0 0-.382-.92l-.148-.045c-.613-.18-.613-1.048 0-1.229l.148-.043a.64.64 0 0 0 .382-.921l-.074-.136c-.306-.561.308-1.175.869-.87l.136.075a.64.64 0 0 0 .92-.382zM14 12.5a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0'/%3E %3C/svg%3E"); }
.bi-person-plus-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M1 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6'/%3E %3Cpath fill-rule='evenodd' d='M13.5 5a.5.5 0 0 1 .5.5V7h1.5a.5.5 0 0 1 0 1H14v1.5a.5.5 0 0 1-1 0V8h-1.5a.5.5 0 0 1 0-1H13V5.5a.5.5 0 0 1 .5-.5'/%3E %3C/svg%3E"); }
.bi-person-vcard { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M5 8a2 2 0 1 0 0-4 2 2 0 0 0 0 4m4-2.5a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 0 1h-4a.5.5 0 0 1-.5-.5M9 8a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 0 1h-4A.5.5 0 0 1 9 8m1 2.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5'/%3E %3Cpath d='M2 2a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2zM1 4a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v8a1 1 0 0 1-1 1H8.96q.04-.245.04-.5C9 10.567 7.21 9 5 9c-2.086 0-3.8 1.398-3.984 3.181A1 1 0 0 1 1 12z'/%3E %3C/svg%3E"); }
.bi-person-vcard-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M0 4a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2zm9 1.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 0-1h-4a.5.5 0 0 0-.5.5M9 8a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 0-1h-4A.5.5 0 0 0 9 8m1 2.5a.5.5 0 0 0 .5.5h3a.5.5 0 0 0 0-1h-3a.5.5 0 0 0-.5.5m-1 2C9 10.567 7.21 9 5 9c-2.086 0-3.8 1.398-3.984 3.181A1 1 0 0 0 2 13h6.96q.04-.245.04-.5M7 6a2 2 0 1 0-4 0 2 2 0 0 0 4 0'/%3E %3C/svg%3E"); }
.bi-plus-circle { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14m0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16'/%3E %3Cpath d='M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4'/%3E %3C/svg%3E"); }
.bi-receipt { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M1.92.506a.5.5 0 0 1 .434.14L3 1.293l.646-.647a.5.5 0 0 1 .708 0L5 1.293l.646-.647a.5.5 0 0 1 .708 0L7 1.293l.646-.647a.5.5 0 0 1 .708 0L9 1.293l.646-.647a.5.5 0 0 1 .708 0l.646.647.646-.647a.5.5 0 0 1 .708 0l.646.647.646-.647a.5.5 0 0 1 .801.13l.5 1A.5.5 0 0 1 15 2v12a.5.5 0 0 1-.053.224l-.5 1a.5.5 0 0 1-.8.13L13 14.707l-.646.647a.5.5 0 0 1-.708 0L11 14.707l-.646.647a.5.5 0 0 1-.708 0L9 14.707l-.646.647a.5.5 0 0 1-.708 0L7 14.707l-.646.647a.5.5 0 0 1-.708 0L5 14.707l-.646.647a.5.5 0 0 1-.708 0L3 14.707l-.646.647a.5.5 0 0 1-.801-.13l-.5-1A.5.5 0 0 1 1 14V2a.5.5 0 0 1 .053-.224l.5-1a.5.5 0 0 1 .367-.27m.217 1.338L2 2.118v11.764l.137.274.51-.51a.5.5 0 0 1 .707 0l.646.647.646-.646a.5.5 0 0 1 .708 0l.646.646.646-.646a.5.5 0 0 1 .708 0l.646.646.646-.646a.5.5 0 0 1 .708 0l.646.646.646-.646a.5.5 0 0 1 .708 0l.646.646.646-.646a.5.5 0 0 1 .708 0l.509.509.137-.274V2.118l-.137-.274-.51.51a.5.5 0 0 1-.707 0L12 1.707l-.646.647a.5.5 0 0 1-.708 0L10 1.707l-.646.647a.5.5 0 0 1-.708 0L8 1.707l-.646.647a.5.5 0 0 1-.708 0L6 1.707l-.646.647a.5.5 0 0 1-.708 0L4 1.707l-.646.647a.5.5 0 0 1-.708 0z'/%3E %3Cpath d='M3 4.5a.5.5 0 0 1 .5-.5h6a.5.5 0 1 1 0 1h-6a.5.5 0 0 1-.5-.5m0 2a.5.5 0 0 1 .5-.5h6a.5.5 0 1 1 0 1h-6a.5.5 0 0 1-.5-.5m0 2a.5.5 0 0 1 .5-.5h6a.5.5 0 1 1 0 1h-6a.5.5 0 0 1-.5-.5m0 2a.5.5 0 0 1 .5-.5h6a.5.5 0 0 1 0 1h-6a.5.5 0 0 1-.5-.5m8-6a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 0 1h-1a.5.5 0 0 1-.5-.5m0 2a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 0 1h-1a.5.5 0 0 1-.5-.5m0 2a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 0 1h-1a.5.5 0 0 1-.5-.5m0 2a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 0 1h-1a.5.5 0 0 1-.5-.5'/%3E %3C/svg%3E"); }
.bi-reply-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M5.921 11.9 1.353 8.62a.72.72 0 0 1 0-1.238L5.921 4.1A.716.716 0 0 1 7 4.719V6c1.5 0 6 0 7 8-2.5-4.5-7-4-7-4v1.281c0 .56-.606.898-1.079.62z'/%3E %3C/svg%3E"); }
.bi-robot { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M6 12.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5M3 8.062C3 6.76 4.235 5.765 5.53 5.886a26.6 26.6 0 0 0 4.94 0C11.765 5.765 13 6.76 13 8.062v1.157a.93.93 0 0 1-.765.935c-.845.147-2.34.346-4.235.346s-3.39-.2-4.235-.346A.93.93 0 0 1 3 9.219zm4.542-.827a.25.25 0 0 0-.217.068l-.92.9a25 25 0 0 1-1.871-.183.25.25 0 0 0-.068.495c.55.076 1.232.149 2.02.193a.25.25 0 0 0 .189-.071l.754-.736.847 1.71a.25.25 0 0 0 .404.062l.932-.97a25 25 0 0 0 1.922-.188.25.25 0 0 0-.068-.495c-.538.074-1.207.145-1.98.189a.25.25 0 0 0-.166.076l-.754.785-.842-1.7a.25.25 0 0 0-.182-.135'/%3E %3Cpath d='M8.5 1.866a1 1 0 1 0-1 0V3h-2A4.5 4.5 0 0 0 1 7.5V8a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1v1a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2v-1a1 1 0 0 0 1-1V9a1 1 0 0 0-1-1v-.5A4.5 4.5 0 0 0 10.5 3h-2zM14 7.5V13a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V7.5A3.5 3.5 0 0 1 5.5 4h5A3.5 3.5 0 0 1 14 7.5'/%3E %3C/svg%3E"); }
.bi-save { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M2 1a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H9.5a1 1 0 0 0-1 1v7.293l2.646-2.647a.5.5 0 0 1 .708.708l-3.5 3.5a.5.5 0 0 1-.708 0l-3.5-3.5a.5.5 0 1 1 .708-.708L7.5 9.293V2a2 2 0 0 1 2-2H14a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V2a2 2 0 0 1 2-2h2.5a.5.5 0 0 1 0 1z'/%3E %3C/svg%3E"); }
.bi-search { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001q.044.06.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1 1 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0'/%3E %3C/svg%3E"); }
.bi-send-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M15.964.686a.5.5 0 0 0-.65-.65L.767 5.855H.766l-.452.18a.5.5 0 0 0-.082.887l.41.26.001.002 4.995 3.178 3.178 4.995.002.002.26.41a.5.5 0 0 0 .886-.083zm-1.833 1.89L6.637 10.07l-.215-.338a.5.5 0 0 0-.154-.154l-.338-.215 7.494-7.494 1.178-.471z'/%3E %3C/svg%3E"); }
.bi-share { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M13.5 1a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3M11 2.5a2.5 2.5 0 1 1 .603 1.628l-6.718 3.12a2.5 2.5 0 0 1 0 1.504l6.718 3.12a2.5 2.5 0 1 1-.488.876l-6.718-3.12a2.5 2.5 0 1 1 0-3.256l6.718-3.12A2.5 2.5 0 0 1 11 2.5m-8.5 4a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3m11 5.5a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3'/%3E %3C/svg%3E"); }
.bi-share-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M11 2.5a2.5 2.5 0 1 1 .603 1.628l-6.718 3.12a2.5 2.5 0 0 1 0 1.504l6.718 3.12a2.5 2.5 0 1 1-.488.876l-6.718-3.12a2.5 2.5 0 1 1 0-3.256l6.718-3.12A2.5 2.5 0 0 1 11 2.5'/%3E %3C/svg%3E"); }
.bi-shield-check { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M5.338 1.59a61 61 0 0 0-2.837.856.48.48 0 0 0-.328.39c-.554 4.157.726 7.19 2.253 9.188a10.7 10.7 0 0 0 2.287 2.233c.346.244.652.42.893.533q.18.085.293.118a1 1 0 0 0 .101.025 1 1 0 0 0 .1-.025q.114-.034.294-.118c.24-.113.547-.29.893-.533a10.7 10.7 0 0 0 2.287-2.233c1.527-1.997 2.807-5.031 2.253-9.188a.48.48 0 0 0-.328-.39c-.651-.213-1.75-.56-2.837-.855C9.552 1.29 8.531 1.067 8 1.067c-.53 0-1.552.223-2.662.524zM5.072.56C6.157.265 7.31 0 8 0s1.843.265 2.928.56c1.11.3 2.229.655 2.887.87a1.54 1.54 0 0 1 1.044 1.262c.596 4.477-.787 7.795-2.465 9.99a11.8 11.8 0 0 1-2.517 2.453 7 7 0 0 1-1.048.625c-.28.132-.581.24-.829.24s-.548-.108-.829-.24a7 7 0 0 1-1.048-.625 11.8 11.8 0 0 1-2.517-2.453C1.928 10.487.545 7.169 1.141 2.692A1.54 1.54 0 0 1 2.185 1.43 63 63 0 0 1 5.072.56'/%3E %3Cpath d='M10.854 5.146a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708 0l-1.5-1.5a.5.5 0 1 1 .708-.708L7.5 7.793l2.646-2.647a.5.5 0 0 1 .708 0'/%3E %3C/svg%3E"); }
.bi-signpost-split-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M7 16h2V6h5a1 1 0 0 0 .8-.4l.975-1.3a.5.5 0 0 0 0-.6L14.8 2.4A1 1 0 0 0 14 2H9v-.586a1 1 0 0 0-2 0V7H2a1 1 0 0 0-.8.4L.225 8.7a.5.5 0 0 0 0 .6l.975 1.3a1 1 0 0 0 .8.4h5z'/%3E %3C/svg%3E"); }
.bi-sliders { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath fill-rule='evenodd' d='M11.5 2a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3M9.05 3a2.5 2.5 0 0 1 4.9 0H16v1h-2.05a2.5 2.5 0 0 1-4.9 0H0V3zM4.5 7a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3M2.05 8a2.5 2.5 0 0 1 4.9 0H16v1H6.95a2.5 2.5 0 0 1-4.9 0H0V8zm9.45 4a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3m-2.45 1a2.5 2.5 0 0 1 4.9 0H16v1h-2.05a2.5 2.5 0 0 1-4.9 0H0v-1z'/%3E %3C/svg%3E"); }
.bi-sort-down { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M3.5 2.5a.5.5 0 0 0-1 0v8.793l-1.146-1.147a.5.5 0 0 0-.708.708l2 1.999.007.007a.497.497 0 0 0 .7-.006l2-2a.5.5 0 0 0-.707-.708L3.5 11.293zm3.5 1a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5M7.5 6a.5.5 0 0 0 0 1h5a.5.5 0 0 0 0-1zm0 3a.5.5 0 0 0 0 1h3a.5.5 0 0 0 0-1zm0 3a.5.5 0 0 0 0 1h1a.5.5 0 0 0 0-1z'/%3E %3C/svg%3E"); }
.bi-sort-up { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M3.5 12.5a.5.5 0 0 1-1 0V3.707L1.354 4.854a.5.5 0 1 1-.708-.708l2-1.999.007-.007a.5.5 0 0 1 .7.006l2 2a.5.5 0 1 1-.707.708L3.5 3.707zm3.5-9a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5M7.5 6a.5.5 0 0 0 0 1h5a.5.5 0 0 0 0-1zm0 3a.5.5 0 0 0 0 1h3a.5.5 0 0 0 0-1zm0 3a.5.5 0 0 0 0 1h1a.5.5 0 0 0 0-1z'/%3E %3C/svg%3E"); }
.bi-speedometer2 { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M8 4a.5.5 0 0 1 .5.5V6a.5.5 0 0 1-1 0V4.5A.5.5 0 0 1 8 4M3.732 5.732a.5.5 0 0 1 .707 0l.915.914a.5.5 0 1 1-.708.708l-.914-.915a.5.5 0 0 1 0-.707M2 10a.5.5 0 0 1 .5-.5h1.586a.5.5 0 0 1 0 1H2.5A.5.5 0 0 1 2 10m9.5 0a.5.5 0 0 1 .5-.5h1.5a.5.5 0 0 1 0 1H12a.5.5 0 0 1-.5-.5m.754-4.246a.39.39 0 0 0-.527-.02L7.547 9.31a.91.91 0 1 0 1.302 1.258l3.434-4.297a.39.39 0 0 0-.029-.518z'/%3E %3Cpath fill-rule='evenodd' d='M0 10a8 8 0 1 1 15.547 2.661c-.442 1.253-1.845 1.602-2.932 1.25C11.309 13.488 9.475 13 8 13c-1.474 0-3.31.488-4.615.911-1.087.352-2.49.003-2.932-1.25A8 8 0 0 1 0 10m8-7a7 7 0 0 0-6.603 9.329c.203.575.923.876 1.68.63C4.397 12.533 6.358 12 8 12s3.604.532 4.923.96c.757.245 1.477-.056 1.68-.631A7 7 0 0 0 8 3'/%3E %3C/svg%3E"); }
.bi-ticket-detailed-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M0 4.5A1.5 1.5 0 0 1 1.5 3h13A1.5 1.5 0 0 1 16 4.5V6a.5.5 0 0 1-.5.5 1.5 1.5 0 0 0 0 3 .5.5 0 0 1 .5.5v1.5a1.5 1.5 0 0 1-1.5 1.5h-13A1.5 1.5 0 0 1 0 11.5V10a.5.5 0 0 1 .5-.5 1.5 1.5 0 1 0 0-3A.5.5 0 0 1 0 6zm4 1a.5.5 0 0 0 .5.5h7a.5.5 0 0 0 0-1h-7a.5.5 0 0 0-.5.5m0 5a.5.5 0 0 0 .5.5h7a.5.5 0 0 0 0-1h-7a.5.5 0 0 0-.5.5M4 8a1 1 0 0 0 1 1h6a1 1 0 1 0 0-2H5a1 1 0 0 0-1 1'/%3E %3C/svg%3E"); }
.bi-ticket-perforated-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M0 4.5A1.5 1.5 0 0 1 1.5 3h13A1.5 1.5 0 0 1 16 4.5V6a.5.5 0 0 1-.5.5 1.5 1.5 0 0 0 0 3 .5.5 0 0 1 .5.5v1.5a1.5 1.5 0 0 1-1.5 1.5h-13A1.5 1.5 0 0 1 0 11.5V10a.5.5 0 0 1 .5-.5 1.5 1.5 0 1 0 0-3A.5.5 0 0 1 0 6zm4-1v1h1v-1zm1 3v-1H4v1zm7 0v-1h-1v1zm-1-2h1v-1h-1zm-6 3H4v1h1zm7 1v-1h-1v1zm-7 1H4v1h1zm7 1v-1h-1v1zm-8 1v1h1v-1zm7 1h1v-1h-1z'/%3E %3C/svg%3E"); }
.bi-trash { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M5.5 5.5A.5.5 0 0 1 6 6v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5m2.5 0a.5.5 0 0 1 .5.5v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5m3 .5a.5.5 0 0 0-1 0v6a.5.5 0 0 0 1 0z'/%3E %3Cpath d='M14.5 3a1 1 0 0 1-1 1H13v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V4h-.5a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1H6a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1h3.5a1 1 0 0 1 1 1zM4.118 4 4 4.059V13a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V4.059L11.882 4zM2.5 3h11V2h-11z'/%3E %3C/svg%3E"); }
.bi-trophy { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M2.5.5A.5.5 0 0 1 3 0h10a.5.5 0 0 1 .5.5q0 .807-.034 1.536a3 3 0 1 1-1.133 5.89c-.79 1.865-1.878 2.777-2.833 3.011v2.173l1.425.356c.194.048.377.135.537.255L13.3 15.1a.5.5 0 0 1-.3.9H3a.5.5 0 0 1-.3-.9l1.838-1.379c.16-.12.343-.207.537-.255L6.5 13.11v-2.173c-.955-.234-2.043-1.146-2.833-3.012a3 3 0 1 1-1.132-5.89A33 33 0 0 1 2.5.5m.099 2.54a2 2 0 0 0 .72 3.935c-.333-1.05-.588-2.346-.72-3.935m10.083 3.935a2 2 0 0 0 .72-3.935c-.133 1.59-.388 2.885-.72 3.935M3.504 1q.01.775.056 1.469c.13 2.028.457 3.546.87 4.667C5.294 9.48 6.484 10 7 10a.5.5 0 0 1 .5.5v2.61a1 1 0 0 1-.757.97l-1.426.356a.5.5 0 0 0-.179.085L4.5 15h7l-.638-.479a.5.5 0 0 0-.18-.085l-1.425-.356a1 1 0 0 1-.757-.97V10.5A.5.5 0 0 1 9 10c.516 0 1.706-.52 2.57-2.864.413-1.12.74-2.64.87-4.667q.045-.694.056-1.469z'/%3E %3C/svg%3E"); }
.bi-wallet2 { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M12.136.326A1.5 1.5 0 0 1 14 1.78V3h.5A1.5 1.5 0 0 1 16 4.5v9a1.5 1.5 0 0 1-1.5 1.5h-13A1.5 1.5 0 0 1 0 13.5v-9a1.5 1.5 0 0 1 1.432-1.499zM5.562 3H13V1.78a.5.5 0 0 0-.621-.484zM1.5 4a.5.5 0 0 0-.5.5v9a.5.5 0 0 0 .5.5h13a.5.5 0 0 0 .5-.5v-9a.5.5 0 0 0-.5-.5z'/%3E %3C/svg%3E"); }
.bi-window-stack { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M4.5 6a.5.5 0 1 0 0-1 .5.5 0 0 0 0 1M6 6a.5.5 0 1 0 0-1 .5.5 0 0 0 0 1m2-.5a.5.5 0 1 1-1 0 .5.5 0 0 1 1 0'/%3E %3Cpath d='M12 1a2 2 0 0 1 2 2 2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2 2 2 0 0 1-2-2V3a2 2 0 0 1 2-2zM2 12V5a2 2 0 0 1 2-2h9a1 1 0 0 0-1-1H2a1 1 0 0 0-1 1v8a1 1 0 0 0 1 1m1-4v5a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1V8zm12-1V5a1 1 0 0 0-1-1H4a1 1 0 0 0-1 1v2z'/%3E %3C/svg%3E"); }
.bi-x-circle { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14m0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16'/%3E %3Cpath d='M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708'/%3E %3C/svg%3E"); }
.bi-x-circle-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0M5.354 4.646a.5.5 0 1 0-.708.708L7.293 8l-2.647 2.646a.5.5 0 0 0 .708.708L8 8.707l2.646 2.647a.5.5 0 0 0 .708-.708L8.707 8l2.647-2.646a.5.5 0 0 0-.708-.708L8 7.293z'/%3E %3C/svg%3E"); }

/* Static Blade icon coverage added after the Inertia migration audit. */
.bi-folder2-open { --bi-svg: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20width=%2216%22%20height=%2216%22%20fill=%22currentColor%22%20class=%22bi%20bi-folder2-open%22%20viewBox=%220%200%2016%2016%22%3E%20%3Cpath%20d=%22M1%203.5A1.5%201.5%200%200%201%202.5%202h2.764c.958%200%201.76.56%202.311%201.184C7.985%203.648%208.48%204%209%204h4.5A1.5%201.5%200%200%201%2015%205.5v.64c.57.265.94.876.856%201.546l-.64%205.124A2.5%202.5%200%200%201%2012.733%2015H3.266a2.5%202.5%200%200%201-2.481-2.19l-.64-5.124A1.5%201.5%200%200%201%201%206.14zM2%206h12v-.5a.5.5%200%200%200-.5-.5H9c-.964%200-1.71-.629-2.174-1.154C6.374%203.334%205.82%203%205.264%203H2.5a.5.5%200%200%200-.5.5zm-.367%201a.5.5%200%200%200-.496.562l.64%205.124A1.5%201.5%200%200%200%203.266%2014h9.468a1.5%201.5%200%200%200%201.489-1.314l.64-5.124A.5.5%200%200%200%2014.367%207z%22/%3E%20%3C/svg%3E"); }
.bi-activity { --bi-svg: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20width=%2216%22%20height=%2216%22%20fill=%22currentColor%22%20class=%22bi%20bi-activity%22%20viewBox=%220%200%2016%2016%22%3E%20%3Cpath%20fill-rule=%22evenodd%22%20d=%22M6%202a.5.5%200%200%201%20.47.33L10%2012.036l1.53-4.208A.5.5%200%200%201%2012%207.5h3.5a.5.5%200%200%201%200%201h-3.15l-1.88%205.17a.5.5%200%200%201-.94%200L6%203.964%204.47%208.171A.5.5%200%200%201%204%208.5H.5a.5.5%200%200%201%200-1h3.15l1.88-5.17A.5.5%200%200%201%206%202%22/%3E%20%3C/svg%3E"); }
.bi-file-earmark-pdf-fill { --bi-svg: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20width=%2216%22%20height=%2216%22%20fill=%22currentColor%22%20class=%22bi%20bi-file-earmark-pdf-fill%22%20viewBox=%220%200%2016%2016%22%3E%20%3Cpath%20d=%22M5.523%2012.424q.21-.124.459-.238a8%208%200%200%201-.45.606c-.28.337-.498.516-.635.572l-.035.012a.3.3%200%200%201-.026-.044c-.056-.11-.054-.216.04-.36.106-.165.319-.354.647-.548m2.455-1.647q-.178.037-.356.078a21%2021%200%200%200%20.5-1.05%2012%2012%200%200%200%20.51.858q-.326.048-.654.114m2.525.939a4%204%200%200%201-.435-.41q.344.007.612.054c.317.057.466.147.518.209a.1.1%200%200%201%20.026.064.44.44%200%200%201-.06.2.3.3%200%200%201-.094.124.1.1%200%200%201-.069.015c-.09-.003-.258-.066-.498-.256M8.278%206.97c-.04.244-.108.524-.2.829a5%205%200%200%201-.089-.346c-.076-.353-.087-.63-.046-.822.038-.177.11-.248.196-.283a.5.5%200%200%201%20.145-.04c.013.03.028.092.032.198q.008.183-.038.465z%22/%3E%20%3Cpath%20fill-rule=%22evenodd%22%20d=%22M4%200h5.293A1%201%200%200%201%2010%20.293L13.707%204a1%201%200%200%201%20.293.707V14a2%202%200%200%201-2%202H4a2%202%200%200%201-2-2V2a2%202%200%200%201%202-2m5.5%201.5v2a1%201%200%200%200%201%201h2zM4.165%2013.668c.09.18.23.343.438.419.207.075.412.04.58-.03.318-.13.635-.436.926-.786.333-.401.683-.927%201.021-1.51a11.7%2011.7%200%200%201%201.997-.406c.3.383.61.713.91.95.28.22.603.403.934.417a.86.86%200%200%200%20.51-.138c.155-.101.27-.247.354-.416.09-.181.145-.37.138-.563a.84.84%200%200%200-.2-.518c-.226-.27-.596-.4-.96-.465a5.8%205.8%200%200%200-1.335-.05%2011%2011%200%200%201-.98-1.686c.25-.66.437-1.284.52-1.794.036-.218.055-.426.048-.614a1.24%201.24%200%200%200-.127-.538.7.7%200%200%200-.477-.365c-.202-.043-.41%200-.601.077-.377.15-.576.47-.651.823-.073.34-.04.736.046%201.136.088.406.238.848.43%201.295a20%2020%200%200%201-1.062%202.227%207.7%207.7%200%200%200-1.482.645c-.37.22-.699.48-.897.787-.21.326-.275.714-.08%201.103%22/%3E%20%3C/svg%3E"); }
.bi-download { --bi-svg: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20width=%2216%22%20height=%2216%22%20fill=%22currentColor%22%20class=%22bi%20bi-download%22%20viewBox=%220%200%2016%2016%22%3E%20%3Cpath%20d=%22M.5%209.9a.5.5%200%200%201%20.5.5v2.5a1%201%200%200%200%201%201h12a1%201%200%200%200%201-1v-2.5a.5.5%200%200%201%201%200v2.5a2%202%200%200%201-2%202H2a2%202%200%200%201-2-2v-2.5a.5.5%200%200%201%20.5-.5%22/%3E%20%3Cpath%20d=%22M7.646%2011.854a.5.5%200%200%200%20.708%200l3-3a.5.5%200%200%200-.708-.708L8.5%2010.293V1.5a.5.5%200%200%200-1%200v8.793L5.354%208.146a.5.5%200%201%200-.708.708z%22/%3E%20%3C/svg%3E"); }
.bi-upload { --bi-svg: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20width=%2216%22%20height=%2216%22%20fill=%22currentColor%22%20class=%22bi%20bi-upload%22%20viewBox=%220%200%2016%2016%22%3E%20%3Cpath%20d=%22M.5%209.9a.5.5%200%200%201%20.5.5v2.5a1%201%200%200%200%201%201h12a1%201%200%200%200%201-1v-2.5a.5.5%200%200%201%201%200v2.5a2%202%200%200%201-2%202H2a2%202%200%200%201-2-2v-2.5a.5.5%200%200%201%20.5-.5%22/%3E%20%3Cpath%20d=%22M7.646%201.146a.5.5%200%200%201%20.708%200l3%203a.5.5%200%200%201-.708.708L8.5%202.707V11.5a.5.5%200%200%201-1%200V2.707L5.354%204.854a.5.5%200%201%201-.708-.708z%22/%3E%20%3C/svg%3E"); }
.bi-person-check { --bi-svg: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20width=%2216%22%20height=%2216%22%20fill=%22currentColor%22%20class=%22bi%20bi-person-check%22%20viewBox=%220%200%2016%2016%22%3E%20%3Cpath%20d=%22M12.5%2016a3.5%203.5%200%201%200%200-7%203.5%203.5%200%200%200%200%207m1.679-4.493-1.335%202.226a.75.75%200%200%201-1.174.144l-.774-.773a.5.5%200%200%201%20.708-.708l.547.548%201.17-1.951a.5.5%200%201%201%20.858.514M11%205a3%203%200%201%201-6%200%203%203%200%200%201%206%200M8%207a2%202%200%201%200%200-4%202%202%200%200%200%200%204%22/%3E%20%3Cpath%20d=%22M8.256%2014a4.5%204.5%200%200%201-.229-1.004H3c.001-.246.154-.986.832-1.664C4.484%2010.68%205.711%2010%208%2010q.39%200%20.74.025c.226-.341.496-.65.804-.918Q8.844%209.002%208%209c-5%200-6%203-6%204s1%201%201%201z%22/%3E%20%3C/svg%3E"); }
.bi-calendar-plus-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M10.854 7.146a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708 0l-1.5-1.5a.5.5 0 1 1 .708-.708L7.5 9.793l2.646-2.647a.5.5 0 0 1 .708 0'/%3E %3Cpath d='M3.5 0a.5.5 0 0 1 .5.5V1h8V.5a.5.5 0 0 1 1 0V1h1a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2h1V.5a.5.5 0 0 1 .5-.5M1 4v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V4z'/%3E %3C/svg%3E"); }
.bi-person-lines-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M0 4a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2zm9 1.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 0-1h-4a.5.5 0 0 0-.5.5M9 8a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 0-1h-4A.5.5 0 0 0 9 8m1 2.5a.5.5 0 0 0 .5.5h3a.5.5 0 0 0 0-1h-3a.5.5 0 0 0-.5.5m-1 2C9 10.567 7.21 9 5 9c-2.086 0-3.8 1.398-3.984 3.181A1 1 0 0 0 2 13h6.96q.04-.245.04-.5M7 6a2 2 0 1 0-4 0 2 2 0 0 0 4 0'/%3E %3C/svg%3E"); }
.bi-send { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M15.964.686a.5.5 0 0 0-.65-.65L.767 5.855H.766l-.452.18a.5.5 0 0 0-.082.887l.41.26.001.002 4.995 3.178 3.178 4.995.002.002.26.41a.5.5 0 0 0 .886-.083zm-1.833 1.89L6.637 10.07l-.215-.338a.5.5 0 0 0-.154-.154l-.338-.215 7.494-7.494 1.178-.471z'/%3E %3C/svg%3E"); }
.bi-calendar-plus { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M11 6.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5z'/%3E %3Cpath d='M3.5 0a.5.5 0 0 1 .5.5V1h8V.5a.5.5 0 0 1 1 0V1h1a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2h1V.5a.5.5 0 0 1 .5-.5M1 4v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V4z'/%3E %3C/svg%3E"); }
.bi-bell { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M8 16a2 2 0 0 0 2-2H6a2 2 0 0 0 2 2m.995-14.901a1 1 0 1 0-1.99 0A5 5 0 0 0 3 6c0 1.098-.5 6-2 7h14c-1.5-1-2-5.902-2-7 0-2.42-1.72-4.44-4.005-4.901'/%3E %3C/svg%3E"); }
.bi-pencil { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M15.502 1.94a.5.5 0 0 1 0 .706L14.459 3.69l-2-2L13.502.646a.5.5 0 0 1 .707 0l1.293 1.293zm-1.75 2.456-2-2L4.939 9.21a.5.5 0 0 0-.121.196l-.805 2.414a.25.25 0 0 0 .316.316l2.414-.805a.5.5 0 0 0 .196-.12l6.813-6.814z'/%3E %3Cpath fill-rule='evenodd' d='M1 13.5A1.5 1.5 0 0 0 2.5 15h11a1.5 1.5 0 0 0 1.5-1.5v-6a.5.5 0 0 0-1 0v6a.5.5 0 0 1-.5.5h-11a.5.5 0 0 1-.5-.5v-11a.5.5 0 0 1 .5-.5H9a.5.5 0 0 0 0-1H2.5A1.5 1.5 0 0 0 1 2.5z'/%3E %3C/svg%3E"); }
.bi-kanban-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M4 11a1 1 0 1 1 2 0v1a1 1 0 1 1-2 0zm6-4a1 1 0 1 1 2 0v5a1 1 0 1 1-2 0zM7 9a1 1 0 0 1 2 0v3a1 1 0 1 1-2 0z'/%3E %3Cpath d='M4 1.5H3a2 2 0 0 0-2 2V14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V3.5a2 2 0 0 0-2-2h-1v1h1a1 1 0 0 1 1 1V14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V3.5a1 1 0 0 1 1-1h1z'/%3E %3Cpath d='M9.5 1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-3a.5.5 0 0 1-.5-.5v-1a.5.5 0 0 1 .5-.5zm-3-1A1.5 1.5 0 0 0 5 1.5v1A1.5 1.5 0 0 0 6.5 4h3A1.5 1.5 0 0 0 11 2.5v-1A1.5 1.5 0 0 0 9.5 0z'/%3E %3C/svg%3E"); }
.bi-diagram-3-fill { --bi-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E %3Cpath d='M7 16h2V6h5a1 1 0 0 0 .8-.4l.975-1.3a.5.5 0 0 0 0-.6L14.8 2.4A1 1 0 0 0 14 2H9v-.586a1 1 0 0 0-2 0V7H2a1 1 0 0 0-.8.4L.225 8.7a.5.5 0 0 0 0 .6l.975 1.3a1 1 0 0 0 .8.4h5z'/%3E %3C/svg%3E"); }

/* ---- base/grid-foundation.css ---- */
/**
 * Modernized Grid System
 * Base grid foundation
 */

/* 1. CSS Variables - control the site layout from one place */
:root {
  --grid-columns: 12;
  --grid-gutter: 1.5rem; /* 24px */
  
  /* Container max-width */
  --container-sm: 540px;
  --container-md: 720px;
  --container-lg: 960px;
  --container-xl: 1140px;
  --container-xxl: 1320px;
}

/* 2. Box sizing reset */
*, *::before, *::after {
  box-sizing: border-box;
}

/* 3. Container system */
.container, .container-fluid {
  width: 100%;
  padding-right: calc(var(--grid-gutter) * 0.5);
  padding-left: calc(var(--grid-gutter) * 0.5);
  margin-right: auto;
  margin-left: auto;
}

/* 4. Row and common column properties to reduce repetition */
.row {
  display: flex;
  flex-wrap: wrap;
  row-gap: var(--grid-gutter);
  margin-right: calc(var(--grid-gutter) * -0.5);
  margin-left: calc(var(--grid-gutter) * -0.5);
}

/* Define common styles for all columns once */
.row > * {
  flex-shrink: 0;
  width: 100%;
  max-width: 100%;
  padding-right: calc(var(--grid-gutter) * 0.5);
  padding-left: calc(var(--grid-gutter) * 0.5);
}

/* 5. Default mobile-first columns (Extra Small - xs) */
.col { flex: 1 0 0%; }
.col-auto { flex: 0 0 auto; width: auto; }
.col-1  { flex: 0 0 auto; width: 8.33333333%; }
.col-2  { flex: 0 0 auto; width: 16.66666667%; }
.col-3  { flex: 0 0 auto; width: 25%; }
.col-4  { flex: 0 0 auto; width: 33.33333333%; }
.col-5  { flex: 0 0 auto; width: 41.66666667%; }
.col-6  { flex: 0 0 auto; width: 50%; }
.col-7  { flex: 0 0 auto; width: 58.33333333%; }
.col-8  { flex: 0 0 auto; width: 66.66666667%; }
.col-9  { flex: 0 0 auto; width: 75%; }
.col-10 { flex: 0 0 auto; width: 83.33333333%; }
.col-11 { flex: 0 0 auto; width: 91.66666667%; }
.col-12 { flex: 0 0 auto; width: 100%; }

/* ---- base/grid-breakpoints.css ---- */
/* ==========================================================================
   Responsive Media Queries
   ========================================================================== */

/* Small Devices (sm) >= 576px */
@media (min-width: 576px) {
  .container { max-width: var(--container-sm); }
  
  .col-sm { flex: 1 0 0%; }
  .col-sm-auto { flex: 0 0 auto; width: auto; }
  .col-sm-1  { width: 8.33333333%; }
  .col-sm-2  { width: 16.66666667%; }
  .col-sm-3  { width: 25%; }
  .col-sm-4  { width: 33.33333333%; }
  .col-sm-5  { width: 41.66666667%; }
  .col-sm-6  { width: 50%; }
  .col-sm-7  { width: 58.33333333%; }
  .col-sm-8  { width: 66.66666667%; }
  .col-sm-9  { width: 75%; }
  .col-sm-10 { width: 83.33333333%; }
  .col-sm-11 { width: 91.66666667%; }
  .col-sm-12 { width: 100%; }
}

/* Medium Devices (md) >= 768px */
@media (min-width: 768px) {
  .container { max-width: var(--container-md); }
  
  .col-md { flex: 1 0 0%; }
  .col-md-auto { flex: 0 0 auto; width: auto; }
  .col-md-1  { width: 8.33333333%; }
  .col-md-2  { width: 16.66666667%; }
  .col-md-3  { width: 25%; }
  .col-md-4  { width: 33.33333333%; }
  .col-md-5  { width: 41.66666667%; }
  .col-md-6  { width: 50%; }
  .col-md-7  { width: 58.33333333%; }
  .col-md-8  { width: 66.66666667%; }
  .col-md-9  { width: 75%; }
  .col-md-10 { width: 83.33333333%; }
  .col-md-11 { width: 91.66666667%; }
  .col-md-12 { width: 100%; }
}

/* Large Devices (lg) >= 992px */
@media (min-width: 992px) {
  .container { max-width: var(--container-lg); }
  
  .col-lg { flex: 1 0 0%; }
  .col-lg-auto { flex: 0 0 auto; width: auto; }
  .col-lg-1  { width: 8.33333333%; }
  .col-lg-2  { width: 16.66666667%; }
  .col-lg-3  { width: 25%; }
  .col-lg-4  { width: 33.33333333%; }
  .col-lg-5  { width: 41.66666667%; }
  .col-lg-6  { width: 50%; }
  .col-lg-7  { width: 58.33333333%; }
  .col-lg-8  { width: 66.66666667%; }
  .col-lg-9  { width: 75%; }
  .col-lg-10 { width: 83.33333333%; }
  .col-lg-11 { width: 91.66666667%; }
  .col-lg-12 { width: 100%; }

  .align-items-lg-start  { align-items: flex-start; }
  .align-items-lg-center { align-items: center; }
  .align-items-lg-end    { align-items: flex-end; }
}

/* Extra Large Devices (xl) >= 1200px */
@media (min-width: 1200px) {
  .container { max-width: var(--container-xl); }
  
  .col-xl { flex: 1 0 0%; }
  .col-xl-auto { flex: 0 0 auto; width: auto; }
  .col-xl-1  { width: 8.33333333%; }
  .col-xl-2  { width: 16.66666667%; }
  .col-xl-3  { width: 25%; }
  .col-xl-4  { width: 33.33333333%; }
  .col-xl-5  { width: 41.66666667%; }
  .col-xl-6  { width: 50%; }
  .col-xl-7  { width: 58.33333333%; }
  .col-xl-8  { width: 66.66666667%; }
  .col-xl-9  { width: 75%; }
  .col-xl-10 { width: 83.33333333%; }
  .col-xl-11 { width: 91.66666667%; }
  .col-xl-12 { width: 100%; }
}

/* Extra Extra Large Devices (xxl) >= 1400px */
@media (min-width: 1400px) {
  .container { max-width: var(--container-xxl); }
  
  .col-xxl { flex: 1 0 0%; }
  .col-xxl-auto { flex: 0 0 auto; width: auto; }
  .col-xxl-1  { width: 8.33333333%; }
  .col-xxl-2  { width: 16.66666667%; }
  .col-xxl-3  { width: 25%; }
  .col-xxl-4  { width: 33.33333333%; }
  .col-xxl-5  { width: 41.66666667%; }
  .col-xxl-6  { width: 50%; }
  .col-xxl-7  { width: 58.33333333%; }
  .col-xxl-8  { width: 66.66666667%; }
  .col-xxl-9  { width: 75%; }
  .col-xxl-10 { width: 83.33333333%; }
  .col-xxl-11 { width: 91.66666667%; }
  .col-xxl-12 { width: 100%; }
}

/* ---- base/grid-utilities.css ---- */
/* 7. Gutter override — .row already uses its own calc() with
   --grid-gutter, so changing that variable locally is enough;
   there is no need to duplicate the .row margin/padding rule */
.g-0 { --grid-gutter: 0; }
.g-1 { --grid-gutter: .25rem; }
.g-2 { --grid-gutter: .5rem; }
.g-3 { --grid-gutter: 1rem; }
.g-4 { --grid-gutter: 1.5rem; }
.g-5 { --grid-gutter: 3rem; }

/* 8. Offset — start after leaving column space */
.offset-1  { margin-left: 8.33333333%; }
.offset-2  { margin-left: 16.66666667%; }
.offset-3  { margin-left: 25%; }
.offset-4  { margin-left: 33.33333333%; }
.offset-5  { margin-left: 41.66666667%; }
.offset-6  { margin-left: 50%; }
.offset-7  { margin-left: 58.33333333%; }
.offset-8  { margin-left: 66.66666667%; }
.offset-9  { margin-left: 75%; }
.offset-10 { margin-left: 83.33333333%; }
.offset-11 { margin-left: 91.66666667%; }

/* 9. Order — separate visual order from DOM order */
.order-first { order: -1; }
.order-last  { order: 6; }
.order-0 { order: 0; }
.order-1 { order: 1; }
.order-2 { order: 2; }
.order-3 { order: 3; }
.order-4 { order: 4; }
.order-5 { order: 5; }

/* 10. Row-cols — fixed number of equal-width items per row */
.row-cols-1 > * { width: 100%; }
.row-cols-2 > * { width: 50%; }
.row-cols-3 > * { width: 33.33333333%; }
.row-cols-4 > * { width: 25%; }
.row-cols-5 > * { width: 20%; }
.row-cols-6 > * { width: 16.66666667%; }

/* 6. Bonus: modern CSS Grid layout utility for quickly building galleries or card grids */
.grid-auto-fit {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: var(--grid-gutter);
}

}

@layer layout {
/* ---- layout/navbar.css ---- */
.topbar {
  position: sticky;
  top: 10px;
  z-index: 1010;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  min-height: 66px;
  margin-bottom: 18px;
  padding: 10px 14px;
  background: rgba(255, 255, 255, .92);
  border: 1px solid rgba(221, 231, 224, .88);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
  backdrop-filter: blur(16px);
}
.topbar-start,
.topbar-actions,
.topbar-user-trigger {
  display: flex;
  align-items: center;
}
.topbar-start { min-width: 0; gap: 13px; }
.topbar-title-block { min-width: 0; }
.topbar h2 {
  margin: 0;
  color: var(--text-strong);
  font-size: clamp(1.05rem, 1.8vw, 1.3rem);
  font-weight: 750;
  line-height: 1.2;
  overflow-wrap: anywhere;
}
.topbar small { display: block; margin-top: 2px; color: var(--text-muted); font-size: 11px; }
.topbar-actions { min-width: 0; justify-content: flex-end; gap: 10px; }

.sidebar-toggle-btn,
.topbar-icon-btn {
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--border);
  border-radius: 13px;
  color: var(--primary-dark);
  background: var(--surface-soft);
  font-size: 19px;
  transition: background-color .18s ease, border-color .18s ease, transform .18s ease;
}
.sidebar-toggle-btn { display: none; }
.topbar-icon-btn { display: flex; }
.sidebar-toggle-btn:hover,
.topbar-icon-btn:hover { border-color: #bbf7d0; background: var(--primary-light); transform: translateY(-1px); }
.sidebar-toggle-btn:focus-visible,
.topbar-icon-btn:focus-visible,
.topbar-user-trigger:focus-visible,
.global-client-btn:focus-visible { outline: none; box-shadow: var(--focus-ring); }

.global-client-selector { min-width: 0; }
.global-client-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  max-width: 230px;
  padding: 8px 13px;
  color: var(--primary-dark);
  border: 1px solid #cce6d3;
  border-radius: 13px;
  background: var(--primary-light);
  font-size: 13px;
  font-weight: 650;
}
.global-client-btn .gcs-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.global-client-btn .bi-chevron-down { margin-left: auto; font-size: 10px; opacity: .7; }

.gcs-menu { width: min(340px, calc(100vw - 28px)); padding: 12px; }
.gcs-search-input { margin-bottom: 8px; }
.gcs-results {
  max-height: min(320px, calc(100vh - 190px));
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
  scrollbar-gutter: stable;
}
.gcs-empty { padding: 10px 8px; }
.gcs-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  padding: 9px 10px;
  text-align: left;
  border: none;
  border-radius: 10px;
  background: none;
}
.gcs-item:hover,
.gcs-item.is-active { background: var(--row-hover); }
.gcs-item-name { color: var(--text); font-size: 14px; font-weight: 650; }
.gcs-item-website { color: var(--text-muted); font-size: 12px; overflow-wrap: anywhere; }
.gcs-footer { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--border); }
.gcs-clear-btn { padding: 5px 6px; color: var(--danger); border: none; background: none; font-size: 13px; }

.topbar-user { cursor: pointer; }
.topbar-user-trigger {
  gap: 8px;
  min-height: 44px;
  max-width: 290px;
  padding: 4px 7px 4px 5px;
  color: var(--text);
  border: 1px solid transparent;
  border-radius: 14px;
  background: transparent;
  font-weight: 650;
}
.topbar-user-trigger:hover { border-color: var(--border); background: var(--surface-soft); }
.topbar-user-name { min-width: 0; max-width: 110px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.topbar-user-chevron { color: var(--text-muted); font-size: 10px; }

.global-role-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.4;
  white-space: nowrap;
}
.global-role-chip--super-admin { color: var(--primary-dark); background: var(--primary-light); }
.global-role-chip--admin { color: #075985; background: #e0f2fe; }
.global-role-chip--regular { color: var(--neutral-dark); background: var(--neutral-light); }
.global-role-chip--client { color: #92400e; background: #fef3c7; }

/* ---- layout/sidebar.css ---- */
.sidebar-backdrop {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(5, 25, 12, .56);
  backdrop-filter: blur(3px);
  z-index: 1030;
}
.sidebar-backdrop.show { display: block; }

.sidebar {
  position: fixed;
  z-index: 1040;
  inset: 0 auto 0 0;
  width: 256px;
  height: 100dvh;
  padding: 14px 12px 18px;
  overflow-y: auto;
  overscroll-behavior: contain;
  color: var(--white);
  background:
    radial-gradient(circle at 15% -5%, rgba(134, 239, 172, .2), transparent 27%),
    linear-gradient(180deg, #14532d 0%, #0b3c21 54%, #062d18 100%);
  box-shadow: 12px 0 34px rgba(5, 46, 22, .15);
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, .25) transparent;
}

.sidebar-logo {
  position: relative;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 11px;
  text-align: left;
  padding: 7px 7px 15px;
  margin-bottom: 10px;
  border-bottom: 1px solid rgba(255, 255, 255, .1);
}
.logo-icon {
  width: 48px;
  height: 48px;
  flex: 0 0 auto;
  margin: 0;
  padding: 5px;
  border-radius: 14px;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 12px 24px rgba(0, 0, 0, .14);
}
.sidebar-logo h3 { margin: 0; color: var(--white); font-size: 14px; line-height: 1.25; }
.sidebar-logo small { display: block; margin-top: 3px; color: var(--sidebar-muted); font-size: 9.5px; line-height: 1.35; }
.sidebar-mobile-close {
  display: none;
  position: absolute;
  top: 0;
  right: 0;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 11px;
  color: var(--white);
  background: rgba(255, 255, 255, .1);
}

.sidebar-menu { display: flex; flex-direction: column; gap: 4px; }
.sidebar-menu > a,
.sidebar-menu > .collapse > a {
  min-width: 0;
}
.sidebar-menu a {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 9px 11px;
  border-radius: 10px;
  color: rgba(255, 255, 255, .88);
  transition: color .18s ease, background-color .18s ease, transform .18s ease;
  font-weight: 620;
  font-size: 13.5px;
}
.sidebar-menu a > span { min-width: 0; overflow-wrap: anywhere; }
.sidebar-menu a i { width: 20px; flex: 0 0 auto; text-align: center; font-size: 16px; }
.sidebar-menu a .submenu-chevron { width: auto; margin-left: auto; font-size: 11px; transition: transform .2s ease; }
.sidebar-menu a[aria-expanded="true"] .submenu-chevron { transform: rotate(180deg); }
.sidebar-menu a:hover {
  color: var(--white);
  background: rgba(255, 255, 255, .11);
}
.sidebar-menu a.active {
  position: relative;
  color: var(--primary-dark);
  background: var(--white);
  box-shadow: 0 7px 18px rgba(0, 0, 0, .11);
}
.sidebar-menu > a.active::before {
  content: "";
  position: absolute;
  left: -5px;
  top: 50%;
  width: 3px;
  height: 20px;
  border-radius: 999px;
  background: #86efac;
  transform: translateY(-50%);
}
.sidebar-menu > .collapse {
  margin: 2px 0 7px 18px;
  padding-left: 9px;
  border-left: 1px solid rgba(255, 255, 255, .14);
}
.sidebar-submenu-link {
  padding: 8px 10px !important;
  border-radius: 10px !important;
  color: rgba(255, 255, 255, .74) !important;
  font-weight: 520 !important;
  font-size: 12.5px !important;
}
.sidebar-submenu-link i { font-size: 13px !important; }
.sidebar-submenu-link.active,
.sidebar-submenu-link:hover {
  color: var(--white) !important;
  background: rgba(255, 255, 255, .11) !important;
  box-shadow: none !important;
}

.sidebar-logout-btn {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  margin-top: 12px;
  padding: 11px 13px;
  color: #fecaca;
  border: 1px solid rgba(254, 202, 202, .14);
  border-radius: 12px;
  background: rgba(127, 29, 29, .16);
  font-size: 14px;
  font-weight: 650;
  text-align: left;
}
.sidebar-logout-btn:hover { color: var(--white); background: rgba(185, 28, 28, .32); }
.sidebar-logout-btn:focus-visible,
.sidebar-menu a:focus-visible,
.sidebar-mobile-close:focus-visible { outline: 2px solid #86efac; outline-offset: 2px; }

@media (max-width: 991.98px) {
  body.sidebar-open { overflow: hidden; }
}

/* ---- layout/footer.css ---- */
/* Auto-generated during CSS architecture refactor — see CHANGES for details. */
.abit-footer {
  text-align: center;
  padding: 18px 25px;
  margin-top: 10px;
  color: var(--text-muted);
  font-size: 13px;
}

/* ---- layout/dashboard.css ---- */
.main {
  min-height: 100vh;
  margin-left: 256px;
  padding: 18px clamp(18px, 2.2vw, 32px) 24px;
  transition: margin-left .25s ease;
}
.content {
  width: 100%;
  max-width: 1600px;
  min-height: calc(100vh - 180px);
  margin: 0 auto;
}
.content:focus { outline: none; }

/* ---- components/skip-link.css ---- */
/* Keyboard-accessible skip link. Kept in the layout cascade layer for legacy parity. */
.skip-link {
  position: fixed;
  z-index: 2000;
  top: 10px;
  left: 10px;
  padding: 10px 14px;
  color: var(--white);
  border-radius: 10px;
  background: var(--primary-dark);
  transform: translateY(-150%);
}
.skip-link:focus { transform: translateY(0); }

}

@layer components {
/* ---- components/buttons.css ---- */
/* ============================================================
 * Shared button system
 * ============================================================ */
.btn {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  min-height: var(--control-height, 48px);
  max-width: 100%;
  padding: .625rem 1.1rem;
  color: var(--text-strong);
  background: transparent;
  border: 1px solid transparent;
  border-radius: var(--radius-md, 14px);
  box-shadow: none;
  font: inherit;
  font-size: .925rem;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  white-space: normal;
  overflow-wrap: anywhere;
  cursor: pointer;
  user-select: none;
  transition:
    color .18s ease,
    background-color .18s ease,
    border-color .18s ease,
    box-shadow .18s ease,
    transform .18s ease;
}

.btn > i,
.btn > .bi {
  flex: 0 0 auto;
  line-height: 1;
}

.btn:hover {
  text-decoration: none;
  transform: translateY(-1px);
}

.btn:active:not(:disabled):not(.disabled) {
  transform: translateY(0);
}

.btn:focus { outline: 0; }
.btn:focus-visible { box-shadow: var(--focus-ring); }

.btn:disabled,
.btn.disabled {
  opacity: .58;
  pointer-events: none;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}

.btn-sm {
  min-height: var(--control-height-sm, 38px);
  padding: .45rem .8rem;
  border-radius: var(--radius-sm, 10px);
  font-size: .82rem;
}

.btn-lg {
  min-height: var(--control-height-lg, 54px);
  padding: .8rem 1.35rem;
  border-radius: var(--radius, 18px);
  font-size: 1rem;
}

/* ---- components/button-solid.css ---- */
/* ============================================================
 * Solid button tones
 * ============================================================ */
.btn-primary,
.btn-success,
.abit-btn-success {
  --btn-bg: var(--primary);
  --btn-hover-bg: var(--primary-700);
  --btn-border: var(--primary);
  --btn-color: var(--white);
  --btn-shadow: 0 8px 18px rgba(22, 163, 74, .18);
}

.btn-secondary {
  --btn-bg: var(--neutral);
  --btn-hover-bg: var(--neutral-dark);
  --btn-border: var(--neutral);
  --btn-color: var(--white);
  --btn-shadow: 0 8px 18px rgba(51, 65, 85, .14);
}

.btn-danger {
  --btn-bg: var(--danger);
  --btn-hover-bg: var(--danger-dark);
  --btn-border: var(--danger);
  --btn-color: var(--white);
  --btn-shadow: 0 8px 18px rgba(220, 38, 38, .16);
}

.btn-warning {
  --btn-bg: var(--warning);
  --btn-hover-bg: var(--warning-dark);
  --btn-border: var(--warning);
  --btn-color: var(--white);
  --btn-shadow: 0 8px 18px rgba(217, 119, 6, .16);
}

.btn-info {
  --btn-bg: var(--info);
  --btn-hover-bg: var(--info-dark);
  --btn-border: var(--info);
  --btn-color: var(--white);
  --btn-shadow: 0 8px 18px rgba(15, 118, 110, .16);
}

.btn-dark {
  --btn-bg: var(--dark);
  --btn-hover-bg: #111827;
  --btn-border: var(--dark);
  --btn-color: var(--white);
  --btn-shadow: 0 8px 18px rgba(17, 24, 39, .16);
}

.btn-light {
  --btn-bg: var(--surface-soft);
  --btn-hover-bg: var(--primary-light);
  --btn-border: var(--border);
  --btn-color: var(--text-strong);
  --btn-shadow: var(--shadow-xs);
}

.btn-primary,
.btn-secondary,
.btn-success,
.btn-danger,
.btn-warning,
.btn-info,
.btn-light,
.btn-dark,
.abit-btn-success {
  color: var(--btn-color);
  background: var(--btn-bg);
  border-color: var(--btn-border);
  box-shadow: var(--btn-shadow);
}

.btn-primary:hover,
.btn-secondary:hover,
.btn-success:hover,
.btn-danger:hover,
.btn-warning:hover,
.btn-info:hover,
.btn-light:hover,
.btn-dark:hover,
.abit-btn-success:hover {
  color: var(--btn-color);
  background: var(--btn-hover-bg);
  border-color: var(--btn-hover-bg);
  box-shadow: var(--btn-shadow), 0 4px 10px rgba(15, 46, 25, .08);
}

/* ---- components/button-outline.css ---- */
/* ============================================================
 * Outline button tones
 * ============================================================ */
.btn-outline-primary,
.btn-outline-success {
  --outline-color: var(--primary);
  --outline-hover: var(--primary-light);
  --outline-hover-color: var(--primary-dark);
}

.btn-outline-secondary {
  --outline-color: var(--border-strong);
  --outline-hover: var(--surface-soft);
  --outline-hover-color: var(--primary-dark);
  color: var(--text-muted);
}

.btn-outline-danger {
  --outline-color: var(--danger);
  --outline-hover: #FEF2F2;
  --outline-hover-color: var(--danger-dark);
}

.btn-outline-warning {
  --outline-color: var(--warning);
  --outline-hover: #FFFBEB;
  --outline-hover-color: var(--warning-dark);
}

.btn-outline-info {
  --outline-color: var(--info);
  --outline-hover: #F0FDFA;
  --outline-hover-color: var(--info-dark);
}

.btn-outline-dark {
  --outline-color: var(--dark);
  --outline-hover: #F3F4F6;
  --outline-hover-color: var(--dark);
}

.btn-outline-light {
  --outline-color: var(--border);
  --outline-hover: var(--surface-soft);
  --outline-hover-color: var(--text-strong);
}

.btn-outline-primary,
.btn-outline-secondary,
.btn-outline-success,
.btn-outline-danger,
.btn-outline-warning,
.btn-outline-info,
.btn-outline-light,
.btn-outline-dark {
  color: var(--outline-hover-color, var(--outline-color));
  background: var(--surface);
  border-color: var(--outline-color);
  box-shadow: var(--shadow-xs);
}

.btn-outline-primary:hover,
.btn-outline-secondary:hover,
.btn-outline-success:hover,
.btn-outline-danger:hover,
.btn-outline-warning:hover,
.btn-outline-info:hover,
.btn-outline-light:hover,
.btn-outline-dark:hover {
  color: var(--outline-hover-color, var(--outline-color));
  background: var(--outline-hover);
  border-color: var(--outline-color);
  box-shadow: 0 6px 16px rgba(15, 46, 25, .08);
}

/* ---- components/button-group-toggle.css ---- */
/* ============================================================
 * Button groups and toggles
 * ============================================================ */
.btn-check {
  position: absolute;
  clip: rect(0, 0, 0, 0);
  pointer-events: none;
}

.btn-check:focus-visible + .btn { box-shadow: var(--focus-ring); }

.btn-check:checked + .btn-outline-primary,
.btn-check:checked + .btn-outline-success {
  color: var(--white);
  background: var(--primary);
  border-color: var(--primary);
}

.btn-check:checked + .btn-outline-secondary {
  color: var(--primary-dark);
  background: var(--primary-light);
  border-color: var(--primary);
}

.btn-check:checked + .btn-outline-danger {
  color: var(--white);
  background: var(--danger);
  border-color: var(--danger);
}

.btn-group {
  position: relative;
  display: inline-flex;
  align-items: stretch;
  max-width: 100%;
  vertical-align: middle;
}

.btn-group > .btn {
  position: relative;
  flex: 1 1 auto;
}

.btn-group > .btn:not(:first-child) {
  margin-left: -1px;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.btn-group > .btn:not(:last-child) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

/* ---- components/close-button.css ---- */
/* ============================================================
 * Close and icon-only action buttons
 * ============================================================ */
.btn-close {
  box-sizing: content-box;
  width: 1em;
  height: 1em;
  padding: .45em;
  color: var(--text-strong);
  background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%2317231b'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e") center / 1em auto no-repeat;
  border: 0;
  border-radius: var(--radius-sm);
  opacity: .58;
  cursor: pointer;
  transition: opacity .18s ease, background-color .18s ease, box-shadow .18s ease;
}

.btn-close:hover {
  opacity: 1;
  background-color: var(--surface-soft);
}

.btn-close:focus-visible {
  outline: none;
  opacity: 1;
  box-shadow: var(--focus-ring);
}

/* ---- components/action-buttons.css ---- */
/* Shared compact edit/delete action buttons. */
.abit-action-btn {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 2px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow-xs);
  text-decoration: none;
  cursor: pointer;
  transition: color .18s ease, background-color .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.abit-action-btn:hover { transform: translateY(-1px); }
.abit-action-btn:focus-visible { outline: none; box-shadow: var(--focus-ring); }

.edit-btn {
  color: var(--warning-dark);
  background: #FFFBEB;
  border-color: #FDE68A;
}

.edit-btn:hover {
  color: var(--white);
  background: var(--warning);
  border-color: var(--warning);
}

.delete-btn {
  color: var(--danger-dark);
  background: #FEF2F2;
  border-color: #FECACA;
}

.delete-btn:hover {
  color: var(--white);
  background: var(--danger);
  border-color: var(--danger);
}

/* ---- components/button-responsive.css ---- */
/* Responsive and reduced-motion behavior for shared buttons. */
@media (max-width: 575.98px) {
  .btn:not(.btn-sm):not(.abit-action-btn) {
    min-height: 46px;
  }

  .btn-group {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .btn,
  .abit-action-btn {
    transition: none;
  }
}

/* ---- components/card-shell.css ---- */
/* ============================================================
 * Legacy/performance/comparison/native card compatibility
 * ============================================================ */
.performance-card,
.comparison-card,
.card {
  background: var(--surface, var(--white));
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

@media (hover: hover) and (pointer: fine) {
  .comparison-card:hover,
  .performance-card:hover {
    border-color: var(--border-strong);
    box-shadow: var(--shadow);
    transform: translateY(-2px);
  }
}

/* ---- components/performance-card.css ---- */
/* Performance cards */
.performance-card {
  overflow: hidden;
  height: 100%;
}

.performance-header {
  background: linear-gradient(135deg, var(--primary-700), var(--primary));
  color: var(--white);
  padding: 17px 18px;
  text-align: center;
  font-size: 17px;
  font-weight: 700;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}

.performance-body { padding: 20px; }

.metric-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 11px 0;
  border-bottom: 1px solid var(--border);
}
.metric-row:last-child { border-bottom: none; }
.metric-row span { color: var(--text-muted); font-weight: 550; }
.metric-row strong { color: var(--text-strong); font-size: 16px; text-align: right; }

/* ---- components/comparison-card.css ---- */
/* Comparison cards */
.comparison-card {
  overflow: hidden;
  height: 100%;
}

.comparison-card-header {
  background: linear-gradient(135deg, var(--primary-700), var(--primary));
  color: var(--white);
  padding: 15px;
  text-align: center;
  font-size: 17px;
  font-weight: 700;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}
.comparison-card-body { padding: clamp(10px, 1vw, 16px); }

/* ---- components/cards.css ---- */
/* Native card compatibility */
.card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  background-clip: border-box;
}
.card-body { flex: 1 1 auto; padding: 1rem; }
.card-header {
  padding: .75rem 1rem;
  background-color: var(--surface-soft);
  border-bottom: 1px solid var(--border);
}
.card-header:first-child { border-radius: calc(var(--radius) - 1px) calc(var(--radius) - 1px) 0 0; }
.card-footer {
  padding: .75rem 1rem;
  background-color: var(--surface-soft);
  border-top: 1px solid var(--border);
}
.card-title { margin-bottom: .5rem; }
.card-text:last-child { margin-bottom: 0; }

/* ---- components/app-card.css ---- */
/* ============================================================
 * AppCard.vue / generic .abit-card surface
 * ============================================================ */
.abit-card {
  background: var(--surface, var(--white));
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

@media (hover: hover) and (pointer: fine) {
  .abit-card:hover {
    border-color: var(--border-strong);
    box-shadow: var(--shadow);
    transform: translateY(-2px);
  }
}

.abit-card {
  padding: 24px;
  margin-bottom: 24px;
}

/* ---- components/kpi-card.css ---- */
/* ============================================================
 * KpiCard.vue / Blade x-kpi-card
 * ============================================================ */
.abit-kpi-card {
  background: var(--surface, var(--white));
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

/* KPI cards */
.abit-kpi-card {
  --kpi-accent: var(--primary);
  --kpi-accent-dark: var(--primary-dark);
  --kpi-soft: var(--primary-light);
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 132px;
  padding: 22px;
  display: flex;
  align-items: center;
  gap: 16px;
}

.abit-kpi-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: var(--kpi-accent);
}

.abit-kpi-card::after {
  content: "";
  position: absolute;
  z-index: -1;
  width: 110px;
  height: 110px;
  right: -48px;
  bottom: -55px;
  border-radius: 50%;
  background: var(--kpi-soft);
  opacity: .75;
}

@media (hover: hover) and (pointer: fine) {
  .abit-kpi-card:hover {
    border-color: color-mix(in srgb, var(--kpi-accent) 28%, var(--border));
    box-shadow: var(--shadow);
    transform: translateY(-3px);
  }
}

.kpi-icon {
  width: 54px;
  height: 54px;
  border-radius: 16px;
  background: var(--kpi-soft);
  color: var(--kpi-accent-dark);
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 24px;
  flex: 0 0 auto;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--kpi-accent) 12%, transparent);
}

.kpi-content {
  flex: 1;
  min-width: 0;
}

.kpi-content small {
  display: block;
  color: var(--text-muted);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: .045em;
  text-transform: uppercase;
}

.kpi-content h2 {
  margin-top: 7px;
  margin-bottom: 0;
  color: var(--text-strong);
  font-size: clamp(1.3rem, 1.8vw, 1.65rem);
  line-height: 1.1;
  font-weight: 750;
  letter-spacing: -.03em;
  overflow-wrap: anywhere;
}

.kpi-currency {
  display: inline-block;
  margin-right: .28em;
  font-size: .3em;
  font-weight: 400;
  letter-spacing: 0;
  vertical-align: baseline;
}

.kpi-content a {
  display: block;
  margin-top: 8px;
  color: var(--kpi-accent-dark);
  font-weight: 650;
  overflow-wrap: anywhere;
}

.kpi-tone--blue { --kpi-accent: #2563EB; --kpi-accent-dark: #1E40AF; --kpi-soft: #DBEAFE; }
.kpi-tone--violet { --kpi-accent: #7C3AED; --kpi-accent-dark: #5B21B6; --kpi-soft: #EDE9FE; }
.kpi-tone--amber { --kpi-accent: #D97706; --kpi-accent-dark: #92400E; --kpi-soft: #FEF3C7; }
.kpi-tone--rose { --kpi-accent: #E11D48; --kpi-accent-dark: #9F1239; --kpi-soft: #FFE4E6; }
.kpi-tone--cyan { --kpi-accent: #0891B2; --kpi-accent-dark: #155E75; --kpi-soft: #CFFAFE; }
.kpi-tone--indigo { --kpi-accent: #4F46E5; --kpi-accent-dark: #3730A3; --kpi-soft: #E0E7FF; }
.kpi-tone--slate { --kpi-accent: #64748B; --kpi-accent-dark: #334155; --kpi-soft: #E2E8F0; }
.kpi-tone--emerald,
.kpi-tone--primary { --kpi-accent: var(--primary); --kpi-accent-dark: var(--primary-dark); --kpi-soft: var(--primary-light); }

/* ---- components/stat-card.css ---- */
/* ============================================================
 * StatCard.vue / shared interactive stat/filter card
 * ============================================================ */
.app-stat-card {
  display: flex;
  align-items: center;
  gap: 13px;
  min-width: 0;
  min-height: 104px;
  padding: 16px;
  color: var(--text);
  text-align: left;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: var(--surface);
  box-shadow: var(--shadow-xs);
  cursor: pointer;
  transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease, transform .18s ease;
}

.app-stat-card:hover {
  border-color: #bbd8c3;
  box-shadow: var(--shadow-sm);
  transform: translateY(-1px);
}

.app-stat-card:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring), var(--shadow-sm);
}

.app-stat-card.is-active {
  border-color: rgba(22, 163, 74, .48);
  background: linear-gradient(135deg, #f0fdf4 0%, #ffffff 80%);
  box-shadow: inset 0 0 0 1px rgba(22, 163, 74, .08), var(--shadow-sm);
}

.app-stat-card__icon {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  flex: 0 0 auto;
  border-radius: 14px;
  color: var(--primary-dark);
  background: var(--primary-light);
  font-size: 20px;
}

.app-stat-card__copy {
  display: grid;
  min-width: 0;
}

.app-stat-card__copy strong {
  color: var(--text-strong);
  font-size: 1.25rem;
  font-weight: 780;
  line-height: 1.05;
  letter-spacing: -.025em;
}

.app-stat-card__copy > span {
  margin-top: 4px;
  color: var(--text-strong);
  font-size: .88rem;
  font-weight: 700;
}

.app-stat-card__copy small {
  margin-top: 2px;
  color: var(--text-muted);
  font-size: .73rem;
}

@media (max-width: 767.98px) {
  .app-stat-card {
    min-height: 90px;
    padding: 13px;
  }

  .app-stat-card__icon {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    font-size: 17px;
  }

  .app-stat-card__copy strong { font-size: 1.1rem; }
  .app-stat-card__copy small { display: none; }
}

@media (max-width: 479.98px) {
  .app-stat-card {
    gap: 9px;
    padding: 11px;
  }

  .app-stat-card__copy > span { font-size: .76rem; }
}

/* ---- components/pagination.css ---- */
/* ============================================================
 * Pagination.vue
 * ============================================================ */

.app-pagination-shell {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}
.app-pagination-meta {
  margin: 0;
  color: var(--text-muted);
  font-size: .76rem;
  font-weight: 550;
}
.app-pagination-meta strong { color: var(--text-strong); font-weight: 720; }

.pagination {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .35rem;
  padding-left: 0;
  margin: 0;
  list-style: none;
}

.pagination .page-item {
  margin: 0;
  list-style: none;
}

.pagination .page-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .3rem;
  min-width: 2.25rem;
  min-height: 2.25rem;
  padding: .4rem .65rem;
  border: 1px solid var(--border);
  border-radius: .55rem;
  text-decoration: none;
  line-height: 1;
  color: var(--primary-dark);
  border-color: var(--border);
  background: var(--surface);
  box-shadow: none;
}

.pagination .page-item.active .page-link {
  background-color: var(--primary);
  border-color: var(--primary);
  color: var(--white);
}

.pagination .page-link:hover {
  background-color: var(--primary-light);
  border-color: var(--border-strong);
  color: var(--primary-dark);
}

.pagination .page-link:focus {
  box-shadow: var(--focus-ring);
}

.pagination .page-item.disabled .page-link {
  opacity: .45;
  pointer-events: none;
}

.app-pagination-ellipsis {
  border-color: transparent !important;
  background: transparent !important;
}

@media (max-width: 575.98px) {
  .app-pagination {
    gap: .25rem;
  }

  .app-pagination-nav-text {
    display: none;
  }
}

/* ---- components/table-shell.css ---- */
/* ============================================================
 * Shared table shell
 * ============================================================ */
.table-responsive {
  position: relative;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-xs);
  scrollbar-width: thin;
  scrollbar-color: var(--border-strong) transparent;
}

.table-responsive::-webkit-scrollbar {
  height: 9px;
}

.table-responsive::-webkit-scrollbar-track {
  background: transparent;
}

.table-responsive::-webkit-scrollbar-thumb {
  background: var(--border-strong);
  border: 2px solid var(--surface);
  border-radius: 999px;
}

.table-responsive:focus-within {
  border-color: rgba(22, 163, 74, .45);
  box-shadow: var(--focus-ring), var(--shadow-xs);
}

.table-responsive > table {
  margin-bottom: 0;
}

.comparison-table,
.abit-table,
.table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}

/* ---- components/table-core.css ---- */
/* ============================================================
 * Primary application tables
 * ============================================================ */
.abit-table,
.table:not(.table-borderless) {
  background: var(--surface);
  color: var(--text);
  font-size: .9rem;
  line-height: 1.45;
}

.abit-table thead,
.table:not(.table-borderless) > thead,
.table:not(.table-borderless) > thead.table-light {
  background: #f6f9f7;
}

.abit-table thead th,
.table:not(.table-borderless) > thead > tr > th,
.table:not(.table-borderless) > thead.table-light > tr > th {
  position: sticky;
  top: 0;
  z-index: 2;
  padding: .68rem .8rem;
  background: #f6f9f7;
  color: #536158;
  border: 0;
  border-bottom: 1px solid var(--border);
  font-size: .72rem;
  font-weight: 760;
  letter-spacing: .045em;
  text-transform: uppercase;
  line-height: 1.25;
  text-align: left;
  vertical-align: middle;
  white-space: nowrap;
}

.abit-table thead th + th,
.table:not(.table-borderless) > thead > tr > th + th {
  border-left: 0;
}

.abit-table tbody td,
.table:not(.table-borderless) > tbody > tr > td {
  padding: .68rem .8rem;
  color: var(--text);
  background: var(--surface);
  border: 0;
  border-bottom: 1px solid #e8efea;
  vertical-align: middle;
}

.abit-table tbody tr:nth-child(even) td,
.table:not(.table-borderless) > tbody > tr:nth-child(even) > td {
  background: var(--surface-soft);
}

.abit-table tbody tr,
.table:not(.table-borderless) > tbody > tr {
  transition: background-color .18s ease, box-shadow .18s ease;
}

.abit-table tbody tr:hover td,
.table:not(.table-borderless) > tbody > tr:hover > td {
  background: var(--row-hover);
}

.abit-table tbody tr:hover td:first-child,
.table:not(.table-borderless) > tbody > tr:hover > td:first-child {
  box-shadow: inset 3px 0 0 var(--primary);
}

.abit-table tbody tr:last-child td,
.table:not(.table-borderless) > tbody > tr:last-child > td {
  border-bottom: 0;
}

.abit-table tbody td:first-child,
.table:not(.table-borderless) > tbody > tr > td:first-child {
  color: var(--text-strong);
  font-weight: 600;
}

.abit-table a:not(.btn):not(.abit-action-btn),
.table:not(.table-borderless) a:not(.btn):not(.abit-action-btn) {
  color: var(--primary-700);
  font-weight: 600;
  text-decoration: none;
}

.abit-table a:not(.btn):not(.abit-action-btn):hover,
.table:not(.table-borderless) a:not(.btn):not(.abit-action-btn):hover {
  color: var(--primary-dark);
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ---- components/table-compat.css ---- */
/* Keep existing Bootstrap-style table helpers compatible with the new shell. */
.table {
  margin-bottom: 1rem;
  vertical-align: top;
}

.table > thead {
  vertical-align: bottom;
}

.table > :not(caption) > * > * {
  vertical-align: inherit;
}

.table-bordered > :not(caption) > * > * {
  border-right: 1px solid #e8efea;
}

.table-bordered > :not(caption) > * > *:last-child {
  border-right: 0;
}

.table-sm > :not(caption) > * > * {
  padding: .68rem .75rem;
}

.table-light {
  background: transparent;
  color: inherit;
}

.table-borderless > :not(caption) > * > * {
  border: 0;
}

.table caption,
.abit-table caption {
  padding: .75rem 1rem;
  color: var(--text-muted);
  font-size: .84rem;
  text-align: left;
}

/* ---- components/table-empty-state.css ---- */
/* Empty states inside table bodies */
.abit-table tbody td.text-center.text-muted,
.table:not(.table-borderless) tbody td.text-center.text-muted {
  padding-block: 2rem;
  color: var(--text-muted);
  font-weight: 500;
}

/* ---- components/comparison-table.css ---- */
/* ============================================================
 * Historical comparison tables
 * ============================================================ */
.comparison-section,
.comparison-wrapper,
.comparison-grid-item,
.comparison-card,
.comparison-card-body {
  min-width: 0;
}

.comparison-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 24rem), 1fr));
  gap: 1.5rem;
}

.comparison-table-shell {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: var(--surface);
  scrollbar-width: thin;
  scrollbar-color: var(--border-strong) transparent;
  -webkit-overflow-scrolling: touch;
}

.comparison-table-shell::-webkit-scrollbar { height: 7px; }
.comparison-table-shell::-webkit-scrollbar-track { background: transparent; }
.comparison-table-shell::-webkit-scrollbar-thumb {
  background: var(--border-strong);
  border: 2px solid var(--surface);
  border-radius: 999px;
}

.comparison-table-shell:focus-visible {
  outline: none;
  border-color: var(--primary);
  box-shadow: var(--focus-ring);
}

.comparison-table {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
  background: var(--surface);
  font-size: clamp(.76rem, .72rem + .12vw, .875rem);
  font-variant-numeric: tabular-nums;
}

.comparison-col-metric { width: 31%; }
.comparison-col-value { width: 24%; }
.comparison-col-growth { width: 21%; }

.comparison-table thead th {
  padding: .78rem .4rem;
  color: var(--primary-dark);
  background: var(--primary-light);
  border: 0;
  border-bottom: 2px solid var(--border-success-accent, #BBF7D0);
  font-size: .78rem;
  font-weight: 750;
  line-height: 1.25;
  text-align: center;
  vertical-align: middle;
  white-space: normal;
  overflow-wrap: anywhere;
}

.comparison-table thead th + th {
  border-left: 1px solid rgba(20, 83, 45, .08);
}

.comparison-table thead th:first-child {
  border-top-left-radius: calc(var(--radius-md) - 1px);
}

.comparison-table thead th:last-child {
  border-top-right-radius: calc(var(--radius-md) - 1px);
}

.comparison-column-label {
  display: block;
}


.comparison-table tbody th,
.comparison-table tbody td {
  padding: .78rem .45rem;
  color: var(--text);
  background: var(--surface);
  border: 0;
  border-bottom: 1px solid #E8EFEA;
  line-height: 1.35;
  text-align: center;
  vertical-align: middle;
}

.comparison-table tbody tr:nth-child(even) > * {
  background: var(--surface-soft);
}

.comparison-table tbody tr:hover > * {
  background: var(--row-hover);
}

.comparison-table tbody tr:last-child > * {
  border-bottom: 0;
}

.metric-name {
  color: var(--primary-dark) !important;
  font-weight: 750;
  text-align: left !important;
  white-space: normal;
  overflow-wrap: anywhere;
}

.comparison-value,
.growth-cell {
  white-space: nowrap;
}

.growth-up,
.growth-down,
.growth-neutral {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .16rem;
  font-weight: 750;
  line-height: 1.2;
}

.growth-up { color: var(--primary); }
.growth-down { color: var(--danger); }
.growth-neutral { color: var(--text-muted); }

@media (max-width: 767.98px) {
  .comparison-grid { gap: 1rem; }
}

@media (max-width: 419.98px) {
  .comparison-table {
    font-size: .73rem;
  }

  .comparison-table thead th,
  .comparison-table tbody th,
  .comparison-table tbody td {
    padding-inline: .18rem;
  }

  .comparison-value,
  .growth-cell {
    white-space: normal;
    overflow-wrap: anywhere;
  }
}

/* ---- components/table-responsive.css ---- */
@media (max-width: 767.98px) {
  .table-responsive > .abit-table,
  .table-responsive > .table:not(.table-borderless),
  .table-responsive > .comparison-table {
    min-width: 640px;
  }

  .abit-table thead th,
  .table:not(.table-borderless) > thead > tr > th,
  .abit-table tbody td,
  .table:not(.table-borderless) > tbody > tr > td {
    padding-inline: .8rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .abit-table tbody tr,
  .table:not(.table-borderless) > tbody > tr {
    transition: none;
  }
}

/* ---- components/sortable-table.css ---- */
/* Shared sortable-table indicator. */
.sort-icon {
  font-size: 11px;
}

/* ---- components/detail-table.css ---- */
/* Shared label/value detail table sizing. */
.app-detail-table td:first-child,
.detail-table td:first-child { min-width: 140px; }

@media (max-width: 575.98px) {
  .app-detail-table td:first-child,
  .detail-table td:first-child { min-width: 105px; }
}

/* ---- components/audit-change-detail.css ---- */
/* Shared audit/history change-detail table content. */
.audit-changes-detail {
  font-size: 0.78125rem;
  line-height: 1.6;
  color: var(--text-muted, #6b7280);
  word-break: break-word;
}

/* ---- components/data-table.css ---- */
/* ============================================================
 * DataTable.vue state styles
 * Core table primitives remain in tables.css because Blade tables share them.
 * ============================================================ */
.table-responsive.is-table-loading { cursor: progress; }
.table-responsive.is-table-loading tbody { opacity: .68; }
.app-table-empty-cell { padding: 0 !important; }

/* ---- components/form-labels.css ---- */
/* ============================================================
 * Labels, hints and validation text
 * ============================================================ */
.form-label {
  display: inline-block;
  margin-bottom: .45rem;
  color: var(--text-strong);
  font-size: .875rem;
  font-weight: 700;
  line-height: 1.35;
}

.form-text {
  display: block;
  margin-top: .4rem;
  color: var(--text-muted);
  font-size: .8rem;
  line-height: 1.45;
}

.invalid-feedback,
.valid-feedback {
  display: none;
  width: 100%;
  margin-top: .4rem;
  font-size: .8rem;
  font-weight: 600;
}

.invalid-feedback { color: var(--danger); }
.valid-feedback { color: var(--primary-700); }

.was-validated :invalid ~ .invalid-feedback,
.is-invalid ~ .invalid-feedback,
.was-validated :valid ~ .valid-feedback,
.is-valid ~ .valid-feedback {
  display: block;
}

/* ---- components/form-fields.css ---- */
/* ============================================================
 * Inputs, selects and textareas
 * ============================================================ */
.form-control,
.form-select {
  display: block;
  width: 100%;
  min-width: 0;
  min-height: var(--control-height, 48px);
  padding: .7rem .95rem;
  color: var(--text);
  background-color: var(--surface);
  background-clip: padding-box;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-md);
  box-shadow: inset 0 1px 2px rgba(15, 46, 25, .025);
  font: inherit;
  font-size: .925rem;
  font-weight: 500;
  line-height: 1.4;
  transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}

input.form-control,
select.form-select {
  height: var(--control-height, 48px);
}

textarea.form-control {
  min-height: 118px;
  height: auto;
  line-height: 1.55;
  resize: vertical;
}

.form-select {
  appearance: none;
  padding-right: 2.75rem;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%2314532d' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right .95rem center;
  background-size: 13px 10px;
}

.form-select[multiple],
.form-select[size]:not([size="1"]) {
  height: auto;
  min-height: 124px;
  padding-right: .95rem;
  background-image: none;
}

/* ---- components/code-field.css ---- */
/* Monospace field for copyable code/embed snippets. */
.abit-code-field {
    font-family: monospace;
    font-size: 12px;
}

/* ---- components/form-control-state.css ---- */
/* Remaining shared form controls, checks, groups, validation, and responsive rules. */
.form-control:hover:not(:disabled):not([readonly]),
.form-select:hover:not(:disabled) {
  border-color: color-mix(in srgb, var(--primary) 46%, var(--border-strong));
}

.form-control:focus,
.form-select:focus {
  color: var(--text-strong);
  background-color: var(--surface);
  border-color: var(--primary);
  outline: 0;
  box-shadow: var(--focus-ring);
}

.form-control::placeholder {
  color: #8A988F;
  opacity: 1;
}

.form-control[readonly] {
  color: var(--text-muted);
  background: var(--surface-soft);
  border-color: var(--border);
  cursor: default;
}

.form-control:disabled,
.form-select:disabled {
  color: #7A897F;
  background-color: var(--neutral-light);
  border-color: var(--border);
  opacity: 1;
  cursor: not-allowed;
}

.form-control.is-invalid,
.form-select.is-invalid,
.was-validated .form-control:invalid,
.was-validated .form-select:invalid {
  border-color: var(--danger);
  box-shadow: 0 0 0 3px rgba(220, 38, 38, .1);
}

.form-control.is-valid,
.form-select.is-valid,
.was-validated .form-control:valid,
.was-validated .form-select:valid {
  border-color: var(--primary);
}

/* ---- components/form-control-variants.css ---- */
.form-control-sm,
.form-select-sm {
  min-height: var(--control-height-sm, 38px);
  height: var(--control-height-sm, 38px);
  padding: .45rem .7rem;
  border-radius: var(--radius-sm);
  font-size: .82rem;
}

.form-control-lg,
.form-select-lg {
  min-height: var(--control-height-lg, 54px);
  height: var(--control-height-lg, 54px);
  padding: .8rem 1rem;
  font-size: 1rem;
}

.form-control[type="file"] {
  height: auto;
  padding: .48rem;
  line-height: 1.5;
}

.form-control[type="file"]::file-selector-button {
  min-height: 34px;
  margin: -.2rem .75rem -.2rem -.2rem;
  padding: .4rem .75rem;
  color: var(--primary-dark);
  background: var(--primary-light);
  border: 0;
  border-radius: 8px;
  font: inherit;
  font-size: .82rem;
  font-weight: 700;
  cursor: pointer;
}

.form-control[type="color"] {
  width: 64px;
  padding: .35rem;
}

.form-control-plaintext {
  display: block;
  width: 100%;
  min-height: var(--control-height, 48px);
  padding: .7rem 0;
  color: var(--text);
  background: transparent;
  border: solid transparent;
  border-width: 1px 0;
  line-height: 1.4;
}

/* ---- components/form-check.css ---- */
/* ============================================================
 * Checkboxes, radios and switches
 * ============================================================ */
.form-check {
  display: block;
  min-height: 1.5rem;
  padding-left: 1.75rem;
  margin-bottom: .25rem;
}

.form-check-input {
  appearance: none;
  width: 1.15rem;
  height: 1.15rem;
  margin-top: .16rem;
  margin-left: -1.75rem;
  vertical-align: top;
  background-color: var(--surface);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  border: 1px solid var(--border-strong);
  border-radius: .32rem;
  box-shadow: var(--shadow-xs);
  cursor: pointer;
  transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
}

.form-check-input[type="radio"] { border-radius: 50%; }

.form-check-input:hover:not(:disabled) {
  border-color: var(--primary);
}

.form-check-input:focus-visible {
  outline: none;
  border-color: var(--primary);
  box-shadow: var(--focus-ring);
}

.form-check-input:checked {
  background-color: var(--primary);
  border-color: var(--primary);
}

.form-check-input:checked[type="checkbox"] {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.4' d='m3.5 8.5 3 3 6-7'/%3e%3c/svg%3e");
}

.form-check-input:checked[type="radio"] {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e");
}

.form-check-input:disabled {
  opacity: .55;
  cursor: not-allowed;
}

.form-check-label {
  color: var(--text);
  font-size: .9rem;
  line-height: 1.45;
  cursor: pointer;
}

.form-check-input:disabled ~ .form-check-label {
  color: var(--text-muted);
  cursor: not-allowed;
}

.form-switch {
  padding-left: 3rem;
}

.form-switch .form-check-input {
  width: 2.35rem;
  margin-left: -3rem;
  border-radius: 999px;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23a3afa7'/%3e%3c/svg%3e");
  background-position: left center;
  background-size: contain;
  transition: background-position .18s ease, background-color .18s ease, border-color .18s ease;
}

.form-switch .form-check-input:checked {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
  background-position: right center;
}

/* ---- components/input-group.css ---- */
/* ============================================================
 * Input groups
 * ============================================================ */
.input-group {
  position: relative;
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  width: 100%;
}

.input-group > .form-control,
.input-group > .form-select {
  position: relative;
  flex: 1 1 auto;
  width: 1%;
  min-width: 0;
}

.input-group-text {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: var(--control-height, 48px);
  padding: .65rem .9rem;
  color: var(--primary-dark);
  background: var(--primary-light);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-md);
  font-size: .9rem;
  font-weight: 650;
  line-height: 1;
  white-space: nowrap;
}

.input-group > :not(:first-child) {
  margin-left: -1px;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.input-group > :not(:last-child) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.input-group:focus-within .input-group-text {
  border-color: var(--primary);
}

/* ---- components/form-mobile.css ---- */
@media (max-width: 575.98px) {
  .form-control,
  .form-select {
    font-size: 16px; /* Prevents mobile browser zoom on focus. */
  }
}

/* ---- components/notes-box.css ---- */
/* Shared read-only notes/content area sizing. */
.app-notes-box,
.client-notes-box {
  min-height: 80px;
  resize: vertical;
}

/* ---- components/modal-shell.css ---- */
/**
 * Native Bootstrap modal shell replacement.
 * Same class names as Bootstrap, paired with resources/js/abit-ui.js.
 */
.modal {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1055;
  display: none;
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  outline: 0;
}

.modal.show {
  display: block;
}

/* ---- components/modal-dialog.css ---- */
.modal-dialog {
  position: relative;
  width: auto;
  margin: 1.75rem auto;
  max-width: 500px;
  pointer-events: none;
}

.modal-content {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  pointer-events: auto;
  background-color: var(--white);
  border-radius: var(--bs-radius-lg);
  box-shadow: var(--bs-shadow-lg);
  outline: 0;
}

.modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem;
  border-bottom: 1px solid var(--bs-border-color);
  border-top-left-radius: var(--bs-radius-lg);
  border-top-right-radius: var(--bs-radius-lg);
}

.modal-title {
  margin: 0;
  font-size: 1.25rem;
}

.modal-body {
  position: relative;
  flex: 1 1 auto;
  padding: 1rem;
}

.modal-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem;
  padding: 0.75rem;
  border-top: 1px solid var(--bs-border-color);
  border-bottom-left-radius: var(--bs-radius-lg);
  border-bottom-right-radius: var(--bs-radius-lg);
}

/* ---- components/modal-backdrop.css ---- */
.modal-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1050;
  width: 100%;
  height: 100%;
  background-color: #000;
  opacity: 0.5;
}

body.modal-open {
  overflow: hidden;
}

/* ---- components/modal-responsive.css ---- */
@media (min-width: 576px) {
  .modal-dialog { max-width: 500px; }
}

/* ---- components/alert-base.css ---- */
/** Native Bootstrap-compatible alert structure. */
.alert {
  position: relative;
  padding: 1rem;
  margin-bottom: 1rem;
  border: 1px solid transparent;
  border-radius: var(--bs-radius);
}

.alert-heading { color: inherit; }
.alert-link { font-weight: 700; }

.alert-dismissible { padding-right: 3rem; }
.alert-dismissible .btn-close {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  padding: 1.25rem 1rem;
}

/* ---- components/alert-variants.css ---- */
/* Bootstrap 5.3-compatible alert tone variants. */
.alert-primary { color: #084298; background-color: #cfe2ff; border-color: #b6d4fe; }
.alert-secondary { color: #41464b; background-color: #e2e3e5; border-color: #d3d6d8; }
.alert-success { color: #0a3622; background-color: #d1e7dd; border-color: #a3cfbb; }
.alert-danger { color: #58151c; background-color: #f8d7da; border-color: #f1aeb5; }
.alert-warning { color: #664d03; background-color: #fff3cd; border-color: #ffe69c; }
.alert-info { color: #055160; background-color: #cff4fc; border-color: #9eeaf9; }
.alert-light { color: #636464; background-color: #fefefe; border-color: #fdfdfe; }
.alert-dark { color: #141619; background-color: #d3d3d4; border-color: #bcbebf; }

/* ---- components/custom-badge.css ---- */
.custom-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 6px 14px;
    min-height: 30px;
    font-size: .8125rem;
    font-weight: 600;
    border-radius: 999px;
    white-space: nowrap;
    vertical-align: middle;
    box-sizing: border-box;
    transition: all .2s ease;
}

.custom-badge i {
  font-size: 1.1em;
  display:inline-flex;
  align-items:center;
}

/* ---- components/role-badge.css ---- */
.badge-regular {
  background-color: var(--info-light, #e0f2fe);
  color: var(--info-dark, #075985);
}

.badge-client {
  background-color: var(--brand-light, #dbeafe);
  color: var(--brand-dark, #1e40af);
}

.badge-super-admin {
  background-color: var(--danger-light, #fee2e2);
  color: var(--danger-dark, #b91c1c);
}

.badge-active {
  background-color: var(--primary-light, #dcfce7);
  color: var(--primary-dark, #15803d);
}

.badge-secondary {
  background-color: var(--neutral-light, #f3f4f6);
  color: var(--neutral-dark, #374151);
}

.badge-marketing-manager {
  background-color: var(--primary);
  color: var(--white);
}

.badge-marketing-executive {
  background-color: var(--primary-light);
  color: var(--primary-dark);
}

/* ---- components/legacy-badge.css ---- */
/* ============================================================
   Older badge system (pre-dates .custom-badge above) — still the
   only styling for badges on 6 other views (profile, snapshots,
   backlinks, domains, social-media, contents). Restored here after
   being accidentally dropped when this file was rewritten; the
   plan is to migrate these onto .custom-badge in a dedicated pass,
   not leave them unstyled in the meantime.
   ============================================================ */
.abit-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--primary-light);
  color: var(--primary-dark);
  padding: 10px 18px;
  border-radius: 30px;
  font-weight: 600;
  font-size: 14px;
}

.abit-badge i {
  font-size: 16px;
}

/* ---- components/native-badge.css ---- */
/* Native Bootstrap-shaped .badge, combined with the bg-* utility classes
   already in utilities/utility-colors.css, matching how Blade uses them
   (e.g. class="badge bg-success") — this is the base for 45 usages
   across 19 other views. */
.badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 0.4em 0.85em;
  font-size: 0.75em;
  font-weight: 700;
  line-height: 1;
  color: #fff;
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  border-radius: 50rem;
}

.badge:empty { display: none; }

.badge.bg-success {
  background-color: var(--primary-light) !important;
  color: var(--primary-dark) !important;
}

.badge.bg-secondary {
  background-color: var(--neutral-light) !important;
  color: var(--neutral-dark) !important;
}

.badge.bg-info {
  background-color: #e0f2fe !important;
  color: #075985 !important;
}

.badge.bg-danger {
  background-color: #fee2e2 !important;
  color: #b91c1c !important;
}

.badge.bg-primary {
  background-color: #dbeafe !important;
  color: #1e40af !important;
}

.badge.bg-warning {
  background-color: #fef9c3 !important;
  color: #854d0e !important;
}

/* ---- components/dropdown.css ---- */
/*
 * ABIT dropdown — Bootstrap Dropdown CSS replacement (Phase 3).
 * Same class names as Bootstrap, paired with resources/js/abit-ui.js for
 * the show/hide behavior. See app.blade.php for how the two connect.
 */

.dropdown {
  position: relative;
}

.dropdown-menu {
  position: absolute;
  z-index: 1000;
  display: none;
  min-width: 10rem;
  margin-top: 0.125rem;
  padding: 0.5rem 0;
  font-size: 1rem;
  color: var(--text);
  text-align: left;
  list-style: none;
  background-color: var(--white);
  background-clip: padding-box;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow);
  top: 100%;
  left: 0;
}

.dropdown-menu.show {
  display: block;
}

.dropdown-menu-end {
  left: auto;
  right: 0;
}

.dropdown-item {
  display: block;
  width: 100%;
  padding: .5rem .85rem;
  clear: both;
  font-weight: 400;
  color: var(--text);
  text-align: inherit;
  white-space: nowrap;
  background-color: transparent;
  border: 0;
}

.dropdown-item:hover,
.dropdown-item:focus {
  color: var(--text);
  background-color: var(--row-hover);
}

.dropdown-item-text {
  display: block;
  padding: 0.25rem 1rem;
  color: var(--text);
}

.dropdown-header {
  display: block;
  padding: 0.5rem 1rem;
  margin-bottom: 0;
  font-size: 0.875rem;
  color: var(--text-muted);
  white-space: nowrap;
}

/* ---- components/notification-dropdown.css ---- */
.notification-menu {
  min-width: 320px;
  max-height: 400px;
  overflow-y: auto;
}

.notification-menu .dropdown-item {
  white-space: normal;
}

.notification-badge {
  font-size: 10px;
}

.notification-time {
  font-size: 11px;
}

/* ---- components/dropdown-divider.css ---- */
.dropdown-divider {
  height: 0;
  margin: 0.5rem 0;
  overflow: hidden;
  border-top: 1px solid var(--bs-border-color);
}

/* ---- components/three-dot-menu.css ---- */
/* ThreeDotMenu.vue + legacy row-action menu contract. */
.app-actions-cell {
  width: 58px;
  min-width: 58px;
  text-align: center;
  white-space: nowrap;
}

.app-row-actions {
  display: inline-flex;
  justify-content: center;
}

.app-row-actions-toggle {
  width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  color: var(--text-muted);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 9px;
  box-shadow: var(--shadow-xs);
  font: inherit;
  font-size: 1.35rem;
  font-weight: 800;
  line-height: 1;
  cursor: pointer;
}

.app-row-actions-toggle:hover,
.app-row-actions-toggle:focus-visible {
  color: var(--primary-dark);
  background: var(--primary-light);
  border-color: var(--border-strong);
}

.app-row-actions-toggle:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}

.app-row-actions-menu {
  min-width: 180px;
  z-index: 3000;
  padding: .35rem;
}

.app-row-action-form {
  display: block;
  width: 100%;
  margin: 0;
}

.app-row-action-item {
  display: flex;
  align-items: center;
  gap: .6rem;
  width: 100%;
  min-height: 36px;
  margin: 0;
  padding: .5rem .65rem;
  color: var(--text);
  border-radius: 8px;
  font-size: .84rem;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none;
  cursor: pointer;
}

.app-row-action-item > .bi {
  width: 18px;
  flex: 0 0 18px;
}

.app-row-action-item:hover,
.app-row-action-item:focus {
  color: var(--primary-dark);
  background: var(--row-hover);
  text-decoration: none;
}

.app-row-action-form .app-row-action-item {
  border: 0;
  background-color: transparent;
  text-align: left;
}

.app-row-action-form .app-row-action-item:hover,
.app-row-action-form .app-row-action-item:focus {
  background: var(--row-hover);
}

.app-actions-heading {
  width: 58px !important;
  min-width: 58px;
  text-align: center !important;
}

/* ---- components/nav-core.css ---- */
.nav {
  display: flex;
  flex-wrap: wrap;
  padding-left: 0;
  margin-bottom: 0;
  list-style: none;
}

.nav-item {
  display: block;
}

.nav-link {
  display: block;
  padding: 0.5rem 1rem;
  color: var(--primary);
  text-decoration: none;
  border: 1px solid transparent;
  background: none;
  cursor: pointer;
  transition: color 0.2s ease, border-color 0.2s ease;
}

.nav-link:hover,
.nav-link:focus {
  color: color-mix(in srgb, var(--primary) 85%, black);
}

.nav-link.disabled {
  color: var(--text-muted);
  pointer-events: none;
}

/* ---- components/nav-tabs.css ---- */
.nav-tabs {
  border-bottom: 1px solid var(--border);
}

.nav-tabs .nav-link {
  margin-bottom: -1px;
  border: 1px solid transparent;
  border-top-left-radius: var(--radius, 14px);
  border-top-right-radius: var(--radius, 14px);
  color: var(--text-muted);
}

.nav-tabs .nav-link:hover,
.nav-tabs .nav-link:focus {
  border-color: var(--border) var(--border) transparent;
}

.nav-tabs .nav-link.active {
  color: var(--text);
  background-color: var(--white);
  border-color: var(--border) var(--border) var(--white);
}

/* ---- components/tab-content.css ---- */
.tab-content > .tab-pane {
  display: none;
}

.tab-content > .tab-pane.active {
  display: block;
}

/* ---- components/collapse.css ---- */
/* ============================================================
 * 2. Collapse Component (Driven by JavaScript toggles)
 * ============================================================ */
.collapse:not(.show) {
  display: none;
}

.collapsing {
  display: block;
  height: 0;
  overflow: hidden;
  transition: height 0.35s ease;
}

/* ---- components/list-group.css ---- */
/* ============================================================
 * 3. List Group Component (Used in tickets/notifications)
 * ============================================================ */
.list-group {
  display: flex;
  flex-direction: column;
  padding-left: 0;
  margin-bottom: 0;
  border-radius: var(--radius, 14px);
}

.list-group-item {
  position: relative;
  display: block;
  padding: 0.75rem 1.25rem; /* Slightly increased padding for better readability */
  color: var(--text);
  background-color: var(--white);
  border: 1px solid var(--border);
  transition: background-color 0.2s ease;
}

/* First and Last Items Border Radius Inheritance Fix */
.list-group-item:first-child {
  border-top-left-radius: inherit;
  border-top-right-radius: inherit;
}

.list-group-item:last-child {
  border-bottom-left-radius: inherit;
  border-bottom-right-radius: inherit;
}

/* Duplicate border overlapping handle */
.list-group-item + .list-group-item {
  border-top-width: 0;
}

/* Flush Variant (Edge-to-edge list layout) */
.list-group-flush {
  border-radius: 0;
}

.list-group-flush > .list-group-item {
  border-width: 0 0 1px;
  border-radius: 0;
}

.list-group-flush > .list-group-item:last-child {
  border-bottom-width: 0;
}

/* ---- components/tabs.css ---- */
/* ============================================================
 * Shared pill-style tab strip
 *
 * .abit-dashboard-tabs is retained as a compatibility selector so the
 * Dashboard template can stay untouched. New pages can opt into
 * .app-tab-strip without creating page-specific tab CSS.
 * ============================================================ */
.app-tab-strip,
.abit-dashboard-tabs {
  flex-wrap: nowrap;
  gap: 5px;
  overflow-x: auto;
  padding: 5px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--surface-soft);
  scrollbar-width: none;
}

.app-tab-strip::-webkit-scrollbar,
.abit-dashboard-tabs::-webkit-scrollbar { display: none; }

.app-tab-strip .nav-item,
.abit-dashboard-tabs .nav-item { flex: 0 0 auto; }

.app-tab-strip .nav-link,
.abit-dashboard-tabs .nav-link {
  min-height: 42px;
  padding: 9px 15px;
  color: var(--text-muted);
  border: 0;
  border-radius: 10px;
  background: transparent;
  font-weight: 650;
  white-space: nowrap;
  transition: color .2s ease, background-color .2s ease, box-shadow .2s ease;
}

.app-tab-strip .nav-link i,
.abit-dashboard-tabs .nav-link i { margin-right: 6px; }

.app-tab-strip .nav-link:hover,
.abit-dashboard-tabs .nav-link:hover {
  color: var(--primary-dark);
  background: var(--primary-light);
}

.app-tab-strip .nav-link:focus-visible,
.abit-dashboard-tabs .nav-link:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}

.app-tab-strip .nav-link.active,
.abit-dashboard-tabs .nav-link.active {
  color: var(--primary-dark);
  background: var(--white);
  box-shadow: var(--shadow-xs);
}

/* ---- components/client-summary.css ---- */
/* ============================================================
 * Shared client summary / identity card
 *
 * Dashboard-prefixed selectors are kept for backward compatibility.
 * The app-client-* aliases allow the same visual component to be reused
 * elsewhere without duplicating the CSS.
 * ============================================================ */
.app-client-summary-card,
.dashboard-client-card {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(120deg, rgba(220, 252, 231, .76), rgba(255, 255, 255, .94) 46%),
    var(--white);
}

.app-client-summary-card::after,
.dashboard-client-card::after {
  content: "";
  position: absolute;
  width: 180px;
  height: 180px;
  right: -80px;
  top: -105px;
  border-radius: 50%;
  background: rgba(34, 197, 94, .1);
}

.app-client-summary,
.dashboard-client-summary {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 17px;
}

.app-client-summary__copy,
.dashboard-client-copy {
  flex: 1;
  min-width: 0;
}


.app-client-summary__copy h4,
.dashboard-client-copy h4 {
  color: var(--text-strong);
  font-size: clamp(1.2rem, 2vw, 1.55rem);
  overflow-wrap: anywhere;
}

.app-client-summary__meta,
.dashboard-client-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  color: var(--text-muted);
  font-size: 13px;
}

.app-client-summary__meta a,
.dashboard-client-meta a {
  color: var(--text-muted);
  overflow-wrap: anywhere;
}

.app-client-summary__meta a:hover,
.dashboard-client-meta a:hover { color: var(--primary-dark); }

.app-client-summary__badges,
.dashboard-client-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

@media (max-width: 767.98px) {
  .app-client-summary,
  .dashboard-client-summary {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .app-client-summary__badges,
  .dashboard-client-badges {
    width: 100%;
    justify-content: flex-start;
    padding-left: 73px;
  }
}

@media (max-width: 575.98px) {
  .app-client-summary,
  .dashboard-client-summary {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
  }

  .app-client-summary__badges,
  .dashboard-client-badges {
    grid-column: 1 / -1;
    width: auto;
    padding-left: 0;
  }
}

/* ---- components/section-heading.css ---- */
/* ============================================================
 * Shared section heading / eyebrow + total badge
 * ============================================================ */
.app-section-heading,
.dashboard-section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin: 30px 0 14px;
}


.app-section-heading h3,
.dashboard-section-heading h3 {
  margin: 0;
  color: var(--text-strong);
  font-size: 19px;
}

.app-section-total,
.dashboard-section-total {
  padding: 6px 10px;
  color: var(--text-muted);
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface);
  font-size: 11px;
  font-weight: 650;
}

@media (max-width: 575.98px) {
  .app-section-heading,
  .dashboard-section-heading { align-items: center; }
}

/* ---- components/eyebrow.css ---- */
/* ============================================================
 * Shared compact eyebrow / overline label
 * ============================================================ */
.app-eyebrow,
.dashboard-client-eyebrow,
.dashboard-section-eyebrow {
  display: block;
  margin-bottom: 4px;
  color: var(--primary-700);
  font-size: 10px;
  font-weight: 750;
  letter-spacing: .08em;
  text-transform: uppercase;
}

/* ---- components/avatar.css ---- */
/*
 * Avatar component (resources/views/components/avatar.blade.php).
 * --avatar-size/--avatar-bg/--avatar-font-size are set inline per instance
 * since this component is reused at many different pixel sizes (20-140px)
 * across the app -- a fixed class can't express an arbitrary numeric prop,
 * so a CSS custom property is the standard way to bridge a per-instance
 * value into an otherwise shared stylesheet rule.
 */
.abit-avatar {
  width: var(--avatar-size);
  height: var(--avatar-size);
  overflow: hidden;
  background-color: var(--avatar-bg);
}

.abit-avatar-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.abit-avatar-initials {
  font-size: var(--avatar-font-size);
  line-height: 1;
}

/* User/profile avatar presentation shared across Blade and Vue screens. */
.abit-avatar-frame {
  border: 3px solid #eee;
}

.profile-photo-preview {
  object-fit: cover;
}

/* ---- components/brand-logo.css ---- */
/*
 * Brand logo component (resources/views/components/brand-logo.blade.php).
 * --logo-size/--logo-font-size are set inline per instance since this
 * component is reused at different pixel sizes (sidebar: 70px, login: 46px).
 */
.abit-brand-logo {
  width: var(--logo-size);
  height: var(--logo-size);
  object-fit: contain;
}

.abit-brand-logo-fallback {
  width: var(--logo-size);
  height: var(--logo-size);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--logo-font-size);
}

/* ---- components/client-logo.css ---- */
/*
 * Client logo component (resources/views/components/client-logo.blade.php).
 * --logo-size/--logo-bg/--logo-icon-size are set inline per instance since
 * this component is reused at different pixel sizes (32-64px) across the app.
 */
.abit-client-logo {
  width: var(--logo-size);
  height: var(--logo-size);
  overflow: hidden;
  background-color: var(--logo-bg);
}

.abit-client-logo-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.abit-client-logo-icon {
  font-size: var(--logo-icon-size);
}

/* ---- components/search-control.css ---- */
/* ============================================================
 * Shared filter controls
 * Search fields, segmented filters, labels and active-filter chips.
 * Page files should own only placement/width around these controls.
 * ============================================================ */
.app-search-control {
  position: relative;
  flex: 1 1 auto;
  min-width: 0;
}

.app-search-control > i {
  position: absolute;
  top: 50%;
  left: 14px;
  color: #839087;
  transform: translateY(-50%);
  pointer-events: none;
}

.app-search-control input {
  width: 100%;
  height: 42px;
  padding: 0 42px 0 39px;
  color: var(--text);
  border: 1px solid var(--border-strong);
  border-radius: 12px;
  background: var(--surface-soft);
  font: inherit;
  font-size: .86rem;
  outline: none;
  transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.app-search-control input:focus {
  border-color: var(--primary);
  background: var(--surface);
  box-shadow: var(--focus-ring);
}

.app-search-control input::placeholder { color: #89968d; }

.app-search-control__clear {
  position: absolute;
  top: 50%;
  right: 8px;
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  padding: 0;
  color: var(--text-muted);
  border: 0;
  border-radius: 8px;
  background: transparent;
  transform: translateY(-50%);
}

.app-search-control__clear:hover {
  color: var(--danger);
  background: #fff1f2;
}

/* ---- components/filter-label.css ---- */
.app-filter-label {
  color: var(--text-muted);
  font-size: .7rem;
  font-weight: 750;
  letter-spacing: .04em;
  text-transform: uppercase;
}

/* ---- components/segmented-control.css ---- */
.app-segmented-control {
  display: flex;
  align-items: center;
  gap: 3px;
  max-width: 100%;
  padding: 3px;
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface-soft);
  scrollbar-width: none;
}

.app-segmented-control::-webkit-scrollbar { display: none; }

.app-segmented-control__item {
  min-height: 34px;
  padding: 6px 10px;
  flex: 0 0 auto;
  color: var(--text-muted);
  border: 0;
  border-radius: 9px;
  background: transparent;
  font-size: .76rem;
  font-weight: 700;
  white-space: nowrap;
}

.app-segmented-control__item:hover {
  color: var(--text-strong);
  background: #edf4ef;
}

.app-segmented-control__item.is-active {
  color: var(--primary-dark);
  background: var(--surface);
  box-shadow: 0 1px 4px rgba(15, 46, 25, .1);
}

.app-segmented-control__item:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}

/* ---- components/filter-chip.css ---- */
.app-filter-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 29px;
  padding: 4px 9px;
  color: var(--primary-dark);
  border: 1px solid #cde8d4;
  border-radius: 999px;
  background: #f0fdf4;
  font-size: .73rem;
  font-weight: 650;
}

.app-filter-chip:hover {
  border-color: #9fd5ad;
  background: #dcfce7;
}

.app-filter-clear {
  padding: 4px 2px;
  color: var(--text-muted);
  border: 0;
  background: transparent;
  font-size: .75rem;
  font-weight: 700;
}

.app-filter-clear:hover { color: var(--danger); }

/* ---- components/filter-panel.css ---- */
/* Shared filter panel used for date/range controls and contextual help. */
.app-filter-panel,
.live-filter {
  margin-bottom: 24px;
  padding: 20px;
  background: linear-gradient(135deg, var(--surface-soft), var(--row-hover));
  border: 1px solid var(--border);
  border-radius: var(--radius);
}

.app-filter-note,
.filter-note {
  min-height: 52px;
  display: flex;
  align-items: center;
  padding: 13px;
  color: var(--primary-dark);
  border: 1px solid #cce6d3;
  border-radius: 13px;
  background: var(--primary-light);
  font-size: 13px;
}

/* ---- components/disclosure.css ---- */
/* ============================================================
 * Shared compact disclosure/details control
 * ============================================================ */
.app-disclosure summary {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 30px;
  padding: 4px 8px;
  color: var(--primary-dark);
  border: 1px solid #d5e8da;
  border-radius: 9px;
  background: #f7fcf8;
  font-size: .73rem;
  font-weight: 700;
  cursor: pointer;
  user-select: none;
  list-style: none;
}

.app-disclosure summary::-webkit-details-marker { display: none; }

.app-disclosure summary::marker { content: ""; }

.app-disclosure summary::after {
  content: "+";
  margin-left: 2px;
  color: var(--text-muted);
  font-weight: 800;
}

.app-disclosure[open] summary::after { content: "−"; }

.app-disclosure summary:hover {
  border-color: #b5d9be;
  background: var(--primary-light);
}

.app-disclosure__list {
  margin: 7px 0 0;
  padding: 8px 8px 8px 24px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface);
  box-shadow: var(--shadow-xs);
  color: var(--text-muted);
  font-size: .72rem;
}

.app-disclosure__list li + li { margin-top: .25rem; }
/* Lightweight disclosure trigger for compact details controls that keep their existing typography. */
.app-disclosure-trigger {
  cursor: pointer;
}

/* ---- components/empty-state.css ---- */
/* ============================================================
 * Shared empty state
 * ============================================================ */
.app-empty-state {
  display: grid;
  justify-items: center;
  max-width: 420px;
  margin: 0 auto;
  padding: 34px 16px;
  text-align: center;
}

.app-empty-state__icon {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  margin-bottom: 10px;
  color: var(--primary-dark);
  border-radius: 14px;
  background: var(--primary-light);
  font-size: 20px;
}

.app-empty-state strong {
  color: var(--text-strong);
  font-size: .92rem;
}

.app-empty-state p {
  margin: 5px 0 12px;
  color: var(--text-muted);
  font-size: .78rem;
  font-weight: 500;
}

/* Large icon compatibility used by legacy/summary empty states. */
.app-empty-state-icon--large,
.empty-state-icon {
  color: var(--primary);
  font-size: 48px;
  opacity: .45;
}

/* ---- components/loaders.css ---- */
/* ============================================================
 * Shared indeterminate loading bar
 * Parent container should provide positioning context when needed.
 * ============================================================ */
.app-loading-bar {
  position: absolute;
  z-index: 6;
  inset: 0 0 auto;
  height: 3px;
  overflow: hidden;
  background: rgba(22, 163, 74, .08);
}

.app-loading-bar > span {
  display: block;
  width: 38%;
  height: 100%;
  background: linear-gradient(90deg, transparent, var(--primary), transparent);
  animation: app-loading-slide 1s ease-in-out infinite;
}

@keyframes app-loading-slide {
  from { transform: translateX(-110%); }
  to { transform: translateX(300%); }
}

/* Shared inline spinner for refresh/check actions. */
.abit-spin {
  display: inline-block;
  animation: abit-vue-spin 0.8s linear infinite;
}

@keyframes abit-vue-spin {
  to { transform: rotate(360deg); }
}

/* ---- components/google-calendar.css ---- */
/* ============================================================
 * GoogleCalendarPanel component
 * ============================================================ */
.calendar-integration-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: var(--surface);
  box-shadow: var(--shadow-xs);
}

.calendar-integration-card.is-connected {
  border-color: #cde8d4;
  background: linear-gradient(90deg, #f6fff8 0%, var(--surface) 38%);
}

.calendar-integration-icon {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 13px;
  color: var(--primary-dark);
  background: var(--primary-light);
  font-size: 18px;
}

.calendar-integration-copy { min-width: 0; }

.calendar-integration-title-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.calendar-integration-title-row strong {
  color: var(--text-strong);
  font-size: .91rem;
}

.calendar-integration-copy p {
  margin: 3px 0 0;
  color: var(--text-muted);
  font-size: .78rem;
  line-height: 1.45;
}

.calendar-connection-status {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 7px;
  border-radius: 999px;
  color: #475569;
  background: #f1f5f9;
  font-size: .67rem;
  font-weight: 700;
}

.calendar-connection-status > span {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #94a3b8;
}

.calendar-connection-status.is-connected {
  color: #166534;
  background: #dcfce7;
}

.calendar-connection-status.is-connected > span { background: #22c55e; }

.calendar-connection-status.is-error {
  color: #991b1b;
  background: #fee2e2;
}

.calendar-connection-status.is-error > span { background: #ef4444; }

.calendar-integration-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 7px;
}

@media (max-width: 767.98px) {
  .calendar-integration-card {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
  }

  .calendar-integration-actions {
    grid-column: 1 / -1;
    justify-content: stretch;
  }

  .calendar-integration-actions .btn { flex: 1 1 auto; }
}

/* ---- components/ticket-metrics.css ---- */
/* ============================================================
 * Ticket metrics
 * Time cells, elapsed/resolution chips and SLA state indicators.
 * Shared by ticket list, dashboard, detail and preview surfaces.
 * ============================================================ */
.ticket-time-cell {
  min-width: 150px;
}

.ticket-time-cell small {
  display: block;
  margin-top: 4px;
  color: var(--muted, #64748b);
  font-size: 11px;
  line-height: 1.35;
  white-space: nowrap;
}

.ticket-time-primary {
  display: inline-flex;
  align-items: center;
  font-weight: 700;
  color: #123524;
  white-space: nowrap;
}

.ticket-duration-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
  padding: 5px 9px;
  border: 1px solid transparent;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.15;
  white-space: nowrap;
}

.ticket-duration-chip.is-complete {
  color: #08783c;
  background: #e7f8ed;
  border-color: #b9e8c9;
}

.ticket-duration-chip.is-running {
  color: #8a5a00;
  background: #fff7dd;
  border-color: #f3d88a;
}

.ticket-duration-chip.is-neutral {
  color: #334155;
  background: #f1f5f9;
  border-color: #dbe3ec;
}

.ticket-sla-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  max-width: 100%;
  padding: 5px 9px;
  color: var(--neutral-dark);
  background: #f1f5f9;
  border: 1px solid #dbe3ec;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.15;
  white-space: nowrap;
}

.ticket-sla-chip.is-on-track,
.ticket-sla-chip.is-met {
  color: #08783c;
  background: #e7f8ed;
  border-color: #b9e8c9;
}

.ticket-sla-chip.is-due-soon {
  color: #8a5a00;
  background: #fff7dd;
  border-color: #f3d88a;
}

.ticket-sla-chip.is-overdue,
.ticket-sla-chip.is-late {
  color: #b42318;
  background: #fff0ee;
  border-color: #f4b8b2;
}

.ticket-unassigned-label {
  color: #9a3412;
  font-size: 12px;
  font-weight: 800;
}

@media (max-width: 575.98px) {
  .ticket-duration-chip {
    white-space: normal;
  }
}

/* ---- components/ticket-filters.css ---- */
/* ============================================================
 * Ticket filter controls
 * Quick-filter navigation and the advanced filter panel surface.
 * ============================================================ */
.ticket-quick-filters {
  display: flex;
  gap: 10px;
  margin-bottom: 16px;
  padding-bottom: 2px;
  overflow-x: auto;
  scrollbar-width: thin;
}

.ticket-filter-chip {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 8px 12px;
  color: var(--text-muted);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 999px;
  box-shadow: var(--shadow-xs);
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  transition: border-color .16s ease, background-color .16s ease, color .16s ease, transform .16s ease;
}

.ticket-filter-chip:hover,
.ticket-filter-chip:focus-visible {
  color: var(--primary-dark);
  background: var(--surface-soft);
  border-color: #a9d8b8;
  text-decoration: none;
  transform: translateY(-1px);
}

.ticket-filter-chip:focus-visible {
  outline: 0;
  box-shadow: var(--focus-ring);
}

.ticket-filter-chip strong {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  height: 24px;
  padding: 0 7px;
  color: var(--primary-dark);
  background: var(--primary-light);
  border-radius: 999px;
  font-size: 12px;
}

.ticket-filter-chip.is-active {
  color: var(--white);
  background: var(--primary-dark);
  border-color: var(--primary-dark);
  box-shadow: 0 8px 18px rgba(20, 83, 45, .16);
}

.ticket-filter-chip.is-active strong {
  color: var(--primary-dark);
  background: var(--white);
}

.ticket-filter-chip.has-alert:not(.is-active) {
  color: #9a3412;
  background: #fff7ed;
  border-color: #fed7aa;
}

.ticket-filter-form {
  padding: 16px;
  background: var(--surface-soft);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
}

@media (max-width: 767.98px) {
  .ticket-filter-form {
    padding: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ticket-filter-chip {
    transition: none;
  }
}

/* ---- components/ticket-table.css ---- */
/* ============================================================
 * Ticket table presentation
 * Ticket-specific cells and row actions; page files own placement.
 * ============================================================ */
.ticket-management-table {
  min-width: 1320px;
}

.ticket-management-table th:last-child,
.ticket-management-table td:last-child {
  min-width: 150px;
}

.ticket-subject-preview {
  appearance: none;
  max-width: 290px;
  padding: 0;
  color: var(--primary-dark);
  background: transparent;
  border: 0;
  font: inherit;
  font-weight: 750;
  line-height: 1.35;
  text-align: left;
  cursor: pointer;
}

.ticket-subject-preview:hover {
  color: var(--primary);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ticket-subject-preview:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 3px;
  border-radius: 4px;
}

.ticket-priority-sla {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 7px;
  min-width: 125px;
}

/* ---- components/ticket-preview.css ---- */
/* ============================================================
 * Ticket preview drawer
 * Visual contract for resources/js/Components/TicketPreviewDrawer.vue.
 * ============================================================ */
body.ticket-preview-open {
  overflow: hidden;
}

.ticket-preview-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1080;
  background: rgba(15, 31, 20, .42);
  opacity: 0;
  transition: opacity .18s ease;
}

.ticket-preview-backdrop.is-open {
  opacity: 1;
}

.ticket-preview-drawer {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 1081;
  display: flex;
  flex-direction: column;
  width: min(440px, 100vw);
  height: 100dvh;
  color: var(--text);
  background: var(--surface);
  box-shadow: -20px 0 60px rgba(15, 46, 25, .18);
  transform: translateX(102%);
  transition: transform .18s ease;
}

.ticket-preview-drawer.is-open {
  transform: translateX(0);
}

.ticket-preview-header,
.ticket-preview-footer {
  flex: 0 0 auto;
  padding: 20px;
  border-color: var(--border);
}

.ticket-preview-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid var(--border);
}

.ticket-preview-header h2 {
  margin: 5px 0 0;
  color: var(--text-strong);
  font-size: 20px;
  line-height: 1.3;
}

.ticket-preview-number {
  color: var(--primary);
  font-size: 12px;
  font-weight: 850;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.ticket-preview-close {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  color: var(--text-muted);
  background: var(--surface-soft);
  border: 1px solid var(--border);
  border-radius: 11px;
  cursor: pointer;
}

.ticket-preview-close:hover {
  color: var(--danger);
  border-color: #fecaca;
}

.ticket-preview-body {
  flex: 1 1 auto;
  padding: 20px;
  overflow-y: auto;
}

.ticket-preview-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 20px;
}

.ticket-preview-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 0 0 22px;
}

.ticket-preview-meta div {
  min-width: 0;
  padding: 12px;
  background: var(--surface-soft);
  border: 1px solid var(--border);
  border-radius: 12px;
}

.ticket-preview-meta dt,
.ticket-preview-description > span {
  margin-bottom: 4px;
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.ticket-preview-meta dd {
  margin: 0;
  color: var(--text-strong);
  font-size: 13px;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.ticket-preview-description {
  padding: 16px;
  background: #fbfdfb;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
}

.ticket-preview-description p {
  margin: 8px 0 0;
  line-height: 1.65;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.ticket-preview-footer {
  border-top: 1px solid var(--border);
}

@media (max-width: 767.98px) {
  .ticket-preview-meta {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ticket-preview-backdrop,
  .ticket-preview-drawer {
    transition: none;
  }
}

/* ---- components/ticket-composer.css ---- */
/* ============================================================
 * Ticket reply / internal-note composer surfaces.
 * ============================================================ */
.ticket-composer {
  padding: 16px;
  background: #f4fbf6;
  border: 1px solid #cce9d4;
  border-radius: var(--radius-md);
}

.ticket-composer.is-internal {
  background: #f8fafc;
  border-color: #dbe3ec;
}

.ticket-composer-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 12px;
}

.ticket-composer-heading strong,
.ticket-composer-heading small {
  display: block;
}

.ticket-composer-heading strong {
  color: var(--text-strong);
}

.ticket-composer-heading small {
  margin-top: 2px;
  color: var(--text-muted);
}

.ticket-composer-type {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 6px;
  padding: 5px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.ticket-composer-type.is-public {
  color: #08783c;
  background: #dcfce7;
}

.ticket-composer-type.is-private {
  color: #475569;
  background: #e2e8f0;
}

.ticket-composer-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  margin-top: 10px;
}

@media (max-width: 767.98px) {
  .ticket-composer-heading,
  .ticket-composer-actions {
    grid-template-columns: 1fr;
  }

  .ticket-composer-heading {
    flex-direction: column;
  }

  .ticket-composer-actions .btn {
    width: 100%;
  }
}

/* ---- components/schedule-timeline.css ---- */
/* ============================================================
 * Schedule Timeline component
 * Reusable timeline presentation used by schedule surfaces.
 * ============================================================ */

.mkt-timeline-group-label {
  font-weight: 600;
  color: var(--text-muted);
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: .04em;
  margin: 16px 0 8px;
}

.mkt-timeline-group-label:first-child {
  margin-top: 0;
}

.mkt-timeline-item {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--white);
  margin-bottom: 10px;
}

.mkt-timeline-item:last-child {
  margin-bottom: 0;
}

.mkt-timeline-time {
  flex: 0 0 76px;
  font-weight: 600;
  color: var(--primary-dark);
  font-size: 13px;
  padding-top: 6px;
}

.mkt-timeline-icon {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background: var(--primary-light);
  color: var(--primary-dark);
  font-size: 15px;
}

.mkt-timeline-icon.is-meeting {
  background: #DBEAFE;
  color: #1E40AF;
}

.mkt-timeline-icon.is-followup {
  background: #FEF3C7;
  color: #92400E;
}

.mkt-timeline-body {
  flex: 1;
  min-width: 0;
}

.mkt-timeline-title {
  font-weight: 600;
  color: var(--text);
}

.mkt-timeline-subtitle {
  font-size: 13px;
  color: var(--text-muted);
  margin-top: 2px;
}

.mkt-timeline-meta {
  font-size: 12px;
  color: var(--text-muted);
  margin-top: 4px;
}

.mkt-timeline-empty {
  text-align: center;
  padding: 28px 12px;
  color: var(--text-muted);
}
@media (max-width: 767px) {
  .mkt-timeline-time {
    flex-basis: 58px;
    font-size: 12px;
  }
}

/* ---- components/schedule-legend.css ---- */
/* ============================================================
 * Schedule Legend component
 * Reusable visit/meeting/follow-up legend presentation.
 * ============================================================ */

.mkt-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 16px;
}

.mkt-legend-item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--text-muted);
}

.mkt-legend-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: inline-block;
  background: var(--primary);
}

.mkt-legend-dot.is-meeting {
  background: #1E40AF;
}

.mkt-legend-dot.is-followup {
  background: #92400E;
}

/* ---- components/login-brand.css ---- */
/* Login/auth brand presentation. Page composition lives in layout/auth-page.css. */
.login-brand-panel {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: clamp(34px, 5vw, 64px);
  color: var(--white);
  background: linear-gradient(145deg, #052e16 0%, #14532d 47%, #15803d 100%);
}

.login-brand-panel::before,
.login-brand-panel::after {
  content: "";
  position: absolute;
  z-index: -1;
  border-radius: 50%;
  background: rgba(255, 255, 255, .08);
}
.login-brand-panel::before { width: 330px; height: 330px; top: -160px; right: -125px; }
.login-brand-panel::after { width: 270px; height: 270px; bottom: -145px; left: -95px; }

.login-brand-heading,
.login-mobile-brand {
  display: flex;
  align-items: center;
  gap: 14px;
}

.login-brand-mark {
  flex: 0 0 auto;
  padding: 7px;
  border-radius: 17px;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 14px 30px rgba(0, 0, 0, .15);
}

.login-company-name {
  color: inherit;
  font-size: 18px;
  font-weight: 750;
  line-height: 1.2;
}
.login-company-tagline {
  margin-top: 3px;
  color: rgba(255, 255, 255, .72);
  font-size: 12px;
  font-weight: 550;
}

.login-brand-copy { max-width: 560px; margin: 58px 0; }
.login-eyebrow,
.login-secure-badge {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .035em;
  text-transform: uppercase;
}
.login-eyebrow {
  padding: 8px 12px;
  background: rgba(255, 255, 255, .11);
  border: 1px solid rgba(255, 255, 255, .14);
}
.login-brand-copy h1 {
  max-width: 520px;
  margin: 22px 0 16px;
  color: var(--white);
  font-size: clamp(2.05rem, 4vw, 3.25rem);
  line-height: 1.08;
  letter-spacing: -.045em;
}
.login-brand-copy p {
  max-width: 500px;
  margin: 0;
  color: rgba(255, 255, 255, .76);
  font-size: 16px;
  line-height: 1.75;
}

.login-feature-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.login-feature {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 12px;
  border: 1px solid rgba(255, 255, 255, .13);
  border-radius: 15px;
  background: rgba(255, 255, 255, .08);
  font-size: 12px;
  font-weight: 650;
}
.login-feature i { font-size: 17px; color: #86efac; }

.login-mobile-brand { color: var(--text-strong); }
.login-mobile-brand .login-company-tagline { color: var(--text-muted); }

/* ---- components/login-form.css ---- */
/* Login/auth form presentation. Page composition lives in layout/auth-page.css. */
.login-form-header { margin-bottom: 28px; }
.login-secure-badge {
  padding: 7px 10px;
  color: var(--primary-dark);
  background: var(--primary-light);
}
.login-form-header h2 {
  margin: 16px 0 7px;
  color: var(--text-strong);
  font-size: clamp(1.9rem, 3vw, 2.35rem);
  line-height: 1.15;
  letter-spacing: -.035em;
}
.login-form-header p { margin: 0; color: var(--text-muted); }
.login-alert { margin-bottom: 18px; border-radius: 13px; }
.login-form { display: grid; gap: 19px; }
.login-field { min-width: 0; }
.login-input-wrap { position: relative; }
.login-input-wrap > .bi {
  position: absolute;
  z-index: 1;
  left: 17px;
  top: 50%;
  transform: translateY(-50%);
  color: #809087;
  font-size: 17px;
  pointer-events: none;
}
.login-input {
  height: 56px;
  padding-left: 48px;
  border-radius: 15px;
  background: var(--surface-soft);
  border-color: var(--border);
}
.login-input:hover { border-color: var(--border-strong); }
.login-password-input { padding-right: 52px; }
.login-password-toggle {
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  color: var(--text-muted);
}
.login-password-toggle:hover { color: var(--primary-dark); background: var(--primary-light); }
.login-password-toggle:focus-visible { outline: none; box-shadow: var(--focus-ring); }

.btn-login {
  min-height: 56px;
  margin-top: 2px;
  padding: 12px 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  color: var(--white);
  background: linear-gradient(135deg, var(--primary-700), var(--primary));
  border: 0;
  border-radius: 15px;
  box-shadow: 0 12px 24px rgba(22, 163, 74, .22);
  font-weight: 700;
}
.btn-login:hover {
  color: var(--white);
  background: linear-gradient(135deg, var(--primary-dark), var(--primary-700));
  box-shadow: 0 16px 30px rgba(22, 163, 74, .28);
  transform: translateY(-1px);
}
.btn-login i { transition: transform .2s ease; }
.btn-login:hover i { transform: translateX(3px); }

.login-security-note {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid var(--border);
  color: var(--text-muted);
  font-size: 12px;
  line-height: 1.55;
}
.login-security-note i { margin-top: 2px; color: var(--primary); }

}

@layer pages {
/* ---- layout/snapshots-page.css ---- */
/* Snapshots page-specific layout. */
.snapshot-control {
  display: grid;
  grid-template-columns: 2fr auto 1fr;
  gap: 20px;
  align-items: end;
}


/* === Responsive Fixes === */

@media (max-width: 768px) {
  .snapshot-control {
    grid-template-columns: 1fr; 
    gap: 15px;
    align-items: stretch;
  }
}

/* ---- pages/tickets.css ---- */
/* Ticket timeline visual treatment. Structural sizing lives in layout/tickets-timeline.css. */
.ticket-timeline-item {
  background-color: var(--white);
  border-bottom: 1px solid #e5e5e5;
}

.ticket-timeline-item:nth-child(odd) {
  background-color: #eef8ef;
}

/* ---- layout/tickets-timeline.css ---- */
/* Ticket timeline structural sizing and spacing. Visual row treatment remains page-owned. */
.ticket-timeline-meta {
  min-width: 190px;
  max-width: 220px;
}

.ticket-timeline-note-spaced {
  margin-top: 3.2em;
}

/* ---- layout/auth-page.css ---- */
/* Login page structural composition. Visual treatment remains in pages/auth.css. */
body.login-body {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: clamp(16px, 3vw, 38px);
}

.login-shell {
  width: min(1080px, 100%);
  min-height: 650px;
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(390px, .9fr);
  overflow: hidden;
}

.login-form-panel {
  display: grid;
  align-items: center;
  padding: clamp(30px, 5vw, 64px);
}

.login-form-wrap { width: min(390px, 100%); margin: 0 auto; }
.login-mobile-brand { display: none; margin-bottom: 34px; }

@media (max-width: 899.98px) {
  .login-shell { grid-template-columns: 1fr; min-height: auto; max-width: 560px; }
  .login-brand-panel { display: none; }
  .login-form-panel { min-height: 620px; }
  .login-mobile-brand { display: flex; }
}

@media (max-width: 575.98px) {
  body.login-body { padding: 0; place-items: stretch; }
  .login-shell { width: 100%; min-height: 100vh; }
  .login-form-panel { min-height: 100vh; align-items: start; padding: 28px 20px 34px; }
  .login-form-wrap { margin-top: max(12px, env(safe-area-inset-top)); }
  .login-mobile-brand { margin-bottom: 42px; }
}

/* ---- pages/auth.css ---- */
/* Login page visual treatment. Structural composition lives in layout/auth-page.css. */
body.login-body {
  background:
    radial-gradient(circle at 12% 18%, rgba(34, 197, 94, .18), transparent 32%),
    radial-gradient(circle at 92% 80%, rgba(14, 165, 233, .12), transparent 28%),
    linear-gradient(135deg, #edf8f0 0%, #f8fbf9 48%, #edf4f0 100%);
}

.login-shell {
  background: var(--surface);
  border: 1px solid rgba(255, 255, 255, .72);
  border-radius: 30px;
  box-shadow: 0 32px 90px rgba(13, 58, 29, .18);
}

.login-form-panel {
  background: var(--surface);
}

@media (max-width: 575.98px) {
  body.login-body { background: var(--surface); }
  .login-shell { border: 0; border-radius: 0; box-shadow: none; }
}

/* ---- layout/audit-log-table.css ---- */
/* Audit Log page layout only. Change-detail presentation lives in components/audit-change-detail.css. */
.audit-changes-col {
  min-width: 260px;
}

@media (max-width: 480px) {
  .audit-changes-col {
    min-width: 180px;
  }
}

/* ---- layout/users-table.css ---- */
/* Users table profile-cell composition. Typography/color remain page-owned. */
.user-profile-cell {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

/* ---- pages/users.css ---- */
/* Users-list-specific typography/color. Structural profile-cell composition lives in layout/users-table.css. */
.user-profile-cell {
  font-size: 14px;
  font-weight: 500;
  color: #1f2937;
  vertical-align: middle;
}

/* ---- layout/marketing-modal.css ---- */
/* Marketing Visit/Meeting modal width override. */
.mkt-modal-lg .modal-dialog {
  max-width: 720px;
}

/* ---- components/meeting-list-heading.css ---- */
/* Meetings result/list heading presentation. */
.meetings-list-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 17px 20px 13px;
}

.meetings-list-heading h3 {
  margin: 0;
  color: var(--text-strong);
  font-size: .97rem;
  font-weight: 760;
}

.meetings-list-heading p {
  margin: 3px 0 0;
  color: var(--text-muted);
  font-size: .76rem;
}

.meeting-result-count {
  flex: 0 0 auto;
  padding: 5px 9px;
  color: var(--text-muted);
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface-soft);
  font-size: .72rem;
  font-weight: 700;
}

@media (max-width: 767.98px) {
  .meetings-list-heading { padding: 15px 16px 10px; }
  .meetings-list-heading p { display: none; }
}

/* ---- components/meeting-table-content.css ---- */
/* Meetings desktop table content presentation. */
.meetings-table { min-width: 980px; }
.meetings-table tbody td { padding-top: .78rem; padding-bottom: .78rem; }
.meeting-primary-cell { min-width: 260px; }

.meeting-title-line {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
}

.meeting-title-line strong {
  color: var(--text-strong);
  font-size: .9rem;
  font-weight: 720;
}

.meeting-title-line .badge { font-size: .62rem; }

.meeting-secondary-line {
  margin-top: 3px;
  color: var(--text-muted);
  font-size: .73rem;
  font-weight: 600;
}

.meeting-description {
  max-width: 430px;
  margin-top: 5px;
  color: #55645b;
  font-size: .76rem;
  font-weight: 450;
  line-height: 1.42;
}

/* ---- components/meeting-details.css ---- */
/* Meeting schedule, location, attendee, and action presentation. */
.meeting-schedule {
  display: flex;
  align-items: flex-start;
  gap: 9px;
}

.meeting-schedule-icon {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  flex: 0 0 auto;
  border-radius: 9px;
  color: var(--primary-dark);
  background: var(--primary-light);
  font-size: 13px;
}

.meeting-schedule strong,
.meeting-location-block strong {
  display: block;
  color: var(--text-strong);
  font-size: .79rem;
  font-weight: 700;
}

.meeting-schedule span:not(.meeting-schedule-icon),
.meeting-location-block > span {
  display: block;
  margin-top: 2px;
  color: var(--text-muted);
  font-size: .73rem;
  font-weight: 500;
  line-height: 1.35;
}

.meeting-location-block > span i {
  margin-right: 4px;
  color: var(--primary);
}

.meeting-muted-value {
  color: #8a978e;
  font-size: .74rem;
  font-weight: 500;
}

.meeting-mini-note {
  margin-top: 4px;
  color: var(--text-muted);
  font-size: .67rem;
}

.meeting-join-btn {
  min-width: 82px;
  justify-content: center;
}

.meeting-attendees { max-width: 240px; }

/* ---- components/meeting-mobile-card.css ---- */
/* Meetings mobile card presentation. */
@media (max-width: 767.98px) {
  .meeting-mobile-card {
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--surface);
    box-shadow: var(--shadow-xs);
  }

  .meeting-mobile-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
  }

  .meeting-mobile-card h3 {
    margin: 0;
    color: var(--text-strong);
    font-size: .94rem;
    font-weight: 750;
    line-height: 1.35;
  }

  .meeting-mobile-type {
    margin: 3px 0 0;
    color: var(--text-muted);
    font-size: .72rem;
    font-weight: 600;
  }

  .meeting-mobile-description {
    margin: 8px 0 0;
    color: #536158;
    font-size: .77rem;
    line-height: 1.45;
  }

  .meeting-mobile-meta {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 13px;
  }

  .meeting-mobile-meta > div {
    display: flex;
    gap: 8px;
    min-width: 0;
    padding: 9px;
    border-radius: 10px;
    background: var(--surface-soft);
  }

  .meeting-mobile-meta > div > i {
    flex: 0 0 auto;
    color: var(--primary);
    font-size: 13px;
  }

  .meeting-mobile-meta span { min-width: 0; }

  .meeting-mobile-meta strong,
  .meeting-mobile-meta small {
    display: block;
    overflow-wrap: anywhere;
  }

  .meeting-mobile-meta strong {
    color: var(--text-strong);
    font-size: .73rem;
  }

  .meeting-mobile-meta small {
    margin-top: 2px;
    color: var(--text-muted);
    font-size: .67rem;
  }

  .meeting-attendees--mobile {
    margin-top: 10px;
    max-width: none;
  }

  .meeting-mobile-actions {
    display: flex;
    align-items: center;
    margin-top: 13px;
  }

  .meeting-mobile-actions .btn {
    width: 100%;
    justify-content: center;
  }

  .meeting-empty-state--mobile { padding-block: 28px; }
}

@media (max-width: 479.98px) {
  .meeting-mobile-meta { grid-template-columns: 1fr; }
}

/* ---- layout/meetings-page.css ---- */
/* ============================================================
 * Meetings page layout only.
 * Meeting content/card visuals live under resources/css/components/.
 * ============================================================ */
.meeting-stat-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}

.meetings-calendar-panel { margin-bottom: 16px; }

.meetings-workspace {
  position: relative;
  overflow: hidden;
  padding: 0;
}

.meetings-toolbar {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  padding: 20px 20px 16px;
}

.meeting-search-form {
  display: flex;
  align-items: center;
  gap: 8px;
  width: min(560px, 100%);
}

.meeting-search-submit { min-height: 42px; }

.meeting-source-filter {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.meeting-active-filters {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
  padding: 10px 20px;
}

.meeting-clear-filters { margin-left: auto; }

.meetings-desktop-table {
  padding: 0 20px;
}


.meetings-mobile-list { display: none; }

.meetings-workspace > .app-pagination-shell {
  margin: 18px 20px 20px;
}

@media (max-width: 1199.98px) {
  .meeting-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .meetings-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .meeting-search-form,
  .meeting-source-filter {
    width: 100%;
  }
}

@media (max-width: 767.98px) {
  .meeting-stat-grid { gap: 9px; }

  .meetings-toolbar { padding: 16px; }
  .meeting-active-filters { padding-inline: 16px; }
  .meeting-clear-filters { margin-left: 0; }

  .meetings-desktop-table { display: none; }

  .meetings-mobile-list {
    display: grid;
    gap: 10px;
    padding: 0 16px;
  }

  .meetings-workspace > .app-pagination-shell { margin-inline: 16px; }
}

@media (max-width: 479.98px) {
  .meeting-stat-grid { grid-template-columns: 1fr 1fr; }

  .meeting-search-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .meeting-search-submit { padding-inline: 11px; }
}

/* Workspace cards are containers, not tappable cards; keep them stationary. */
.meetings-workspace:hover { transform: none; }

/* ---- pages/meetings.css ---- */
/* Meetings page visual/state treatment. Structural composition lives in layout/meetings-page.css. */
.meetings-toolbar {
  border-bottom: 1px solid var(--border);
  background: var(--surface);
}

.meeting-active-filters {
  border-bottom: 1px solid var(--border);
  background: #fbfdfb;
}

.meetings-desktop-table { transition: opacity .18s ease; }

.meetings-desktop-table.is-filtering,
.meetings-mobile-list.is-filtering {
  opacity: .56;
  pointer-events: none;
}

@media (max-width: 767.98px) {
  .meetings-mobile-list { transition: opacity .18s ease; }
}

.meetings-workspace:hover { box-shadow: var(--shadow-sm); }

/* ============================================================
 * Meetings page UI hardening — 2026-08-20
 * Scoped to Meetings only. This intentionally duplicates critical shared
 * component layout so production remains correct even if an older shared
 * component stylesheet is cached/served.
 * ============================================================ */
.meeting-stat-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}

.meeting-stat-grid .app-stat-card {
  appearance: none;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  width: 100%;
  min-width: 0;
  min-height: 92px;
  padding: 14px 15px;
  color: var(--text);
  text-align: left;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: var(--surface);
  box-shadow: var(--shadow-xs);
  font: inherit;
  cursor: pointer;
}

.meeting-stat-grid .app-stat-card:hover {
  border-color: #bbd8c3;
  box-shadow: var(--shadow-sm);
}

.meeting-stat-grid .app-stat-card.is-active {
  border-color: rgba(22, 163, 74, .48);
  background: linear-gradient(135deg, #f0fdf4 0%, #ffffff 80%);
}

.meeting-stat-grid .app-stat-card__icon {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  color: var(--primary-dark);
  background: var(--primary-light);
  font-size: 18px;
}

.meeting-stat-grid .app-stat-card__copy {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.meeting-stat-grid .app-stat-card__copy strong,
.meeting-stat-grid .app-stat-card__copy > span,
.meeting-stat-grid .app-stat-card__copy small {
  display: block;
  min-width: 0;
}

.meeting-stat-grid .app-stat-card__copy strong {
  margin: 0;
  color: var(--text-strong);
  font-size: 1.1rem;
  font-weight: 780;
  line-height: 1.1;
}

.meeting-stat-grid .app-stat-card__copy > span {
  margin: 2px 0 0;
  color: var(--text-strong);
  font-size: .84rem;
  font-weight: 700;
  line-height: 1.25;
}

.meeting-stat-grid .app-stat-card__copy small {
  margin: 0;
  color: var(--text-muted);
  font-size: .71rem;
  line-height: 1.3;
}

.meetings-calendar-panel .calendar-integration-card {
  width: 100%;
}

.meetings-calendar-panel .calendar-integration-copy {
  min-width: 0;
}

.meetings-calendar-panel .calendar-integration-actions {
  margin-left: 8px;
}

.meetings-toolbar {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  padding: 20px 20px 16px;
}

.meeting-search-form {
  display: flex;
  align-items: center;
  gap: 8px;
  width: min(560px, 100%);
  min-width: 0;
}

.meeting-search-form .app-search-control {
  position: relative;
  flex: 1 1 auto;
  min-width: 0;
}

.meeting-search-form .app-search-control > i {
  position: absolute;
  top: 50%;
  left: 14px;
  z-index: 1;
  color: #839087;
  transform: translateY(-50%);
  pointer-events: none;
}

.meeting-search-form .app-search-control input {
  display: block;
  width: 100%;
  height: 42px;
  padding: 0 42px 0 39px;
  border: 1px solid var(--border-strong);
  border-radius: 12px;
  background: var(--surface-soft);
  font: inherit;
  font-size: .86rem;
  outline: none;
}

.meeting-search-form .app-search-control input:focus {
  border-color: var(--primary);
  background: var(--surface);
  box-shadow: var(--focus-ring);
}

.meeting-search-submit {
  min-height: 42px;
  flex: 0 0 auto;
  white-space: nowrap;
}

.meeting-source-filter {
  display: grid;
  gap: 6px;
  min-width: 0;
  max-width: 100%;
}

.meeting-source-filter .app-filter-label {
  display: block;
}

.meeting-source-filter .app-segmented-control {
  display: flex;
  align-items: center;
  gap: 3px;
  max-width: 100%;
  padding: 3px;
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface-soft);
  scrollbar-width: none;
}

.meeting-source-filter .app-segmented-control::-webkit-scrollbar {
  display: none;
}

.meeting-source-filter .app-segmented-control__item {
  appearance: none;
  min-height: 34px;
  padding: 6px 10px;
  flex: 0 0 auto;
  color: var(--text-muted);
  border: 0;
  border-radius: 9px;
  background: transparent;
  font: inherit;
  font-size: .76rem;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
}

.meeting-source-filter .app-segmented-control__item:hover {
  color: var(--text-strong);
  background: #edf4ef;
}

.meeting-source-filter .app-segmented-control__item.is-active {
  color: var(--primary-dark);
  background: var(--surface);
  box-shadow: 0 1px 4px rgba(15, 46, 25, .1);
}

.meetings-list-heading {
  gap: 16px;
}

.meeting-result-count {
  flex: 0 0 auto;
  white-space: nowrap;
}

@media (max-width: 1399.98px) {
  .meetings-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .meeting-search-form {
    width: min(620px, 100%);
  }

  .meeting-source-filter {
    width: 100%;
  }

  .meeting-source-filter .app-segmented-control {
    width: 100%;
  }
}

@media (max-width: 991.98px) {
  .meeting-stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767.98px) {
  .meeting-stat-grid {
    gap: 9px;
  }

  .meeting-stat-grid .app-stat-card {
    grid-template-columns: 38px minmax(0, 1fr);
    min-height: 82px;
    gap: 9px;
    padding: 11px;
  }

  .meeting-stat-grid .app-stat-card__icon {
    width: 38px;
    height: 38px;
    font-size: 16px;
  }

  .meeting-stat-grid .app-stat-card__copy strong {
    font-size: 1rem;
  }

  .meeting-stat-grid .app-stat-card__copy small {
    display: none;
  }

  .meetings-calendar-panel .calendar-integration-card {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
  }

  .meetings-calendar-panel .calendar-integration-actions {
    grid-column: 1 / -1;
    width: 100%;
    margin-left: 0;
  }

  .meetings-calendar-panel .calendar-integration-actions .btn {
    flex: 1 1 auto;
  }

  .meetings-toolbar {
    padding: 16px;
  }

  .meeting-source-filter .app-segmented-control {
    overflow-x: auto;
  }
}

@media (max-width: 479.98px) {
  .meeting-stat-grid {
    grid-template-columns: 1fr 1fr;
  }

  .meeting-stat-grid .app-stat-card {
    grid-template-columns: 34px minmax(0, 1fr);
    min-height: 76px;
    gap: 8px;
    padding: 10px;
  }

  .meeting-stat-grid .app-stat-card__icon {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    font-size: 15px;
  }

  .meeting-stat-grid .app-stat-card__copy > span {
    font-size: .74rem;
  }

  .meeting-search-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    width: 100%;
  }
}

/* ============================================================
 * Meetings legacy-compiled markup compatibility — 2026-08-20
 *
 * The production Meetings JS chunk currently renders the pre-refactor
 * meeting-* class names while the source tree has moved to shared app-* UI
 * components. Keep this page-local compatibility layer until the production
 * Vite bundle can be rebuilt. It is deliberately scoped to Meetings only.
 * ============================================================ */

/* Top date shortcut cards rendered by the currently deployed chunk. */
.meeting-stat-grid .meeting-stat-card {
  appearance: none;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  width: 100%;
  min-width: 0;
  min-height: 92px;
  padding: 14px 15px;
  color: var(--text);
  text-align: left;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: var(--surface);
  box-shadow: var(--shadow-xs);
  font: inherit;
  cursor: pointer;
  transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease, transform .18s ease;
}

.meeting-stat-grid .meeting-stat-card:hover {
  border-color: #bbd8c3;
  box-shadow: var(--shadow-sm);
  transform: translateY(-1px);
}

.meeting-stat-grid .meeting-stat-card:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring), var(--shadow-sm);
}

.meeting-stat-grid .meeting-stat-card.is-active {
  border-color: rgba(22, 163, 74, .48);
  background: linear-gradient(135deg, #f0fdf4 0%, #ffffff 80%);
  box-shadow: inset 0 0 0 1px rgba(22, 163, 74, .08), var(--shadow-sm);
}

.meeting-stat-grid .meeting-stat-icon {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  color: var(--primary-dark);
  background: var(--primary-light);
  font-size: 18px;
}

.meeting-stat-grid .meeting-stat-copy {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.meeting-stat-grid .meeting-stat-copy strong,
.meeting-stat-grid .meeting-stat-copy > span,
.meeting-stat-grid .meeting-stat-copy small {
  display: block;
  min-width: 0;
}

.meeting-stat-grid .meeting-stat-copy strong {
  margin: 0;
  color: var(--text-strong);
  font-size: 1.1rem;
  font-weight: 780;
  line-height: 1.1;
}

.meeting-stat-grid .meeting-stat-copy > span {
  margin: 2px 0 0;
  color: var(--text-strong);
  font-size: .84rem;
  font-weight: 700;
  line-height: 1.25;
}

.meeting-stat-grid .meeting-stat-copy small {
  margin: 0;
  color: var(--text-muted);
  font-size: .71rem;
  line-height: 1.3;
}

/* Search control rendered by the currently deployed chunk. */
.meeting-search-form .meeting-search-control {
  position: relative;
  flex: 1 1 auto;
  min-width: 0;
}

.meeting-search-form .meeting-search-control > i {
  position: absolute;
  top: 50%;
  left: 14px;
  z-index: 1;
  color: #839087;
  transform: translateY(-50%);
  pointer-events: none;
}

.meeting-search-form .meeting-search-control input {
  display: block;
  width: 100%;
  height: 42px;
  padding: 0 42px 0 39px;
  color: var(--text);
  border: 1px solid var(--border-strong);
  border-radius: 12px;
  background: var(--surface-soft);
  font: inherit;
  font-size: .86rem;
  outline: none;
  transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.meeting-search-form .meeting-search-control input:focus {
  border-color: var(--primary);
  background: var(--surface);
  box-shadow: var(--focus-ring);
}

.meeting-search-form .meeting-search-control input::placeholder { color: #89968d; }

.meeting-search-form .meeting-search-clear {
  appearance: none;
  position: absolute;
  top: 50%;
  right: 8px;
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  padding: 0;
  color: var(--text-muted);
  border: 0;
  border-radius: 8px;
  background: transparent;
  transform: translateY(-50%);
  cursor: pointer;
}

.meeting-search-form .meeting-search-clear:hover {
  color: var(--danger);
  background: #fff1f2;
}

/* Source selector rendered by the currently deployed chunk. */
.meeting-source-filter .meeting-filter-label,
.meeting-active-filters .meeting-filter-label {
  display: block;
  color: var(--text-muted);
  font-size: .7rem;
  font-weight: 750;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.meeting-source-filter .meeting-segmented-control {
  display: flex;
  align-items: center;
  gap: 3px;
  width: 100%;
  max-width: 100%;
  padding: 3px;
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface-soft);
  scrollbar-width: none;
}

.meeting-source-filter .meeting-segmented-control::-webkit-scrollbar { display: none; }

.meeting-source-filter .meeting-segment {
  appearance: none;
  min-height: 34px;
  padding: 6px 10px;
  flex: 0 0 auto;
  color: var(--text-muted);
  border: 0;
  border-radius: 9px;
  background: transparent;
  font: inherit;
  font-size: .76rem;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
}

.meeting-source-filter .meeting-segment:hover {
  color: var(--text-strong);
  background: #edf4ef;
}

.meeting-source-filter .meeting-segment.is-active {
  color: var(--primary-dark);
  background: var(--surface);
  box-shadow: 0 1px 4px rgba(15, 46, 25, .1);
}

.meeting-source-filter .meeting-segment:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}

/* Active-filter chips / loading bar rendered by the deployed chunk. */
.meeting-active-filters .meeting-filter-chip {
  appearance: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 29px;
  padding: 4px 9px;
  color: var(--primary-dark);
  border: 1px solid #cde8d4;
  border-radius: 999px;
  background: #f0fdf4;
  font: inherit;
  font-size: .73rem;
  font-weight: 650;
  cursor: pointer;
}

.meeting-active-filters .meeting-filter-chip:hover {
  border-color: #9fd5ad;
  background: #dcfce7;
}

.meeting-active-filters .meeting-clear-filters {
  appearance: none;
  margin-left: auto;
  padding: 4px 2px;
  color: var(--text-muted);
  border: 0;
  background: transparent;
  font: inherit;
  font-size: .75rem;
  font-weight: 700;
  cursor: pointer;
}

.meeting-active-filters .meeting-clear-filters:hover { color: var(--danger); }

.meeting-loading-bar {
  position: absolute;
  z-index: 5;
  inset: 0 0 auto;
  height: 3px;
  overflow: hidden;
  background: rgba(22, 163, 74, .1);
}

.meeting-loading-bar > span {
  display: block;
  width: 35%;
  height: 100%;
  background: var(--primary);
  animation: meeting-loading-slide 1s ease-in-out infinite;
}

@keyframes meeting-loading-slide {
  from { transform: translateX(-110%); }
  to { transform: translateX(330%); }
}

/* The deployed chunk places the calendar card directly after the stat grid. */
.meeting-stat-grid + .calendar-integration-card { margin-bottom: 16px; }

@media (max-width: 1399.98px) {
  .meetings-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .meeting-search-form { width: min(620px, 100%); }
  .meeting-source-filter { width: 100%; }
}

@media (max-width: 991.98px) {
  .meeting-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767.98px) {
  .meeting-stat-grid .meeting-stat-card {
    grid-template-columns: 38px minmax(0, 1fr);
    min-height: 82px;
    gap: 9px;
    padding: 11px;
  }

  .meeting-stat-grid .meeting-stat-icon {
    width: 38px;
    height: 38px;
    font-size: 16px;
  }

  .meeting-stat-grid .meeting-stat-copy strong { font-size: 1rem; }
  .meeting-stat-grid .meeting-stat-copy small { display: none; }

  .meeting-active-filters .meeting-clear-filters { margin-left: 0; }
}

@media (max-width: 479.98px) {
  .meeting-stat-grid .meeting-stat-card {
    grid-template-columns: 34px minmax(0, 1fr);
    min-height: 76px;
    gap: 8px;
    padding: 10px;
  }

  .meeting-stat-grid .meeting-stat-icon {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    font-size: 15px;
  }

  .meeting-stat-grid .meeting-stat-copy > span { font-size: .74rem; }
}

/* ---- layout/project-manager-tables.css ---- */
/**
 * Project Manager Dashboard layout-only rules.
 * Reusable cards, tables, forms, badges and buttons stay in component stylesheets.
 */
.project-manager-stage-update-col {
  min-width: 310px;
}

/* Projects page table layout. */
.project-manager-project-actions-col {
  min-width: 320px;
}

.project-manager-latest-action-col {
  min-width: 240px;
}
/* Meetings page table layout. */
.project-manager-meeting-update-col {
  min-width: 250px;
}

/* ---- layout/ai-leads-table.css ---- */
/* AI Leads page-specific layout rules. */

.ai-lead-client-col {
    width: 160px;
}

}

@layer utilities {
/* ---- utilities/spacing.css ---- */
/*
 * ABIT spacing utilities — Bootstrap margin/padding utility replacement (Phase 2).
 * Same class names as Bootstrap (mb-3, px-2, ms-auto, ...), built on the
 * spacer scale defined in base/variables.css, so no Blade view changes.
 */

.m-0 { margin: var(--bs-spacer-0); } .m-1 { margin: var(--bs-spacer-1); }
.m-2 { margin: var(--bs-spacer-2); } .m-3 { margin: var(--bs-spacer-3); }
.m-4 { margin: var(--bs-spacer-4); } .m-5 { margin: var(--bs-spacer-5); }
.m-auto { margin: auto; }

.mt-0 { margin-top: var(--bs-spacer-0); } .mt-1 { margin-top: var(--bs-spacer-1); }
.mt-2 { margin-top: var(--bs-spacer-2); } .mt-3 { margin-top: var(--bs-spacer-3); }
.mt-4 { margin-top: var(--bs-spacer-4); } .mt-5 { margin-top: var(--bs-spacer-5); }
.mt-auto { margin-top: auto; }

.mb-0 { margin-bottom: var(--bs-spacer-0); } .mb-1 { margin-bottom: var(--bs-spacer-1); }
.mb-2 { margin-bottom: var(--bs-spacer-2); } .mb-3 { margin-bottom: var(--bs-spacer-3); }
.mb-4 { margin-bottom: var(--bs-spacer-4); } .mb-5 { margin-bottom: var(--bs-spacer-5); }
.mb-auto { margin-bottom: auto; }

.ms-0 { margin-left: var(--bs-spacer-0); } .ms-1 { margin-left: var(--bs-spacer-1); }
.ms-2 { margin-left: var(--bs-spacer-2); } .ms-3 { margin-left: var(--bs-spacer-3); }
.ms-4 { margin-left: var(--bs-spacer-4); } .ms-5 { margin-left: var(--bs-spacer-5); }
.ms-auto { margin-left: auto; }

.me-0 { margin-right: var(--bs-spacer-0); } .me-1 { margin-right: var(--bs-spacer-1); }
.me-2 { margin-right: var(--bs-spacer-2); } .me-3 { margin-right: var(--bs-spacer-3); }
.me-4 { margin-right: var(--bs-spacer-4); } .me-5 { margin-right: var(--bs-spacer-5); }
.me-auto { margin-right: auto; }

.mx-0 { margin-inline: var(--bs-spacer-0); } .mx-1 { margin-inline: var(--bs-spacer-1); }
.mx-2 { margin-inline: var(--bs-spacer-2); } .mx-3 { margin-inline: var(--bs-spacer-3); }
.mx-4 { margin-inline: var(--bs-spacer-4); } .mx-5 { margin-inline: var(--bs-spacer-5); }
.mx-auto { margin-inline: auto; }

.my-0 { margin-block: var(--bs-spacer-0); } .my-1 { margin-block: var(--bs-spacer-1); }
.my-2 { margin-block: var(--bs-spacer-2); } .my-3 { margin-block: var(--bs-spacer-3); }
.my-4 { margin-block: var(--bs-spacer-4); } .my-5 { margin-block: var(--bs-spacer-5); }
.my-auto { margin-block: auto; }

.p-0 { padding: var(--bs-spacer-0); } .p-1 { padding: var(--bs-spacer-1); }
.p-2 { padding: var(--bs-spacer-2); } .p-3 { padding: var(--bs-spacer-3); }
.p-4 { padding: var(--bs-spacer-4); } .p-5 { padding: var(--bs-spacer-5); }

.pt-0 { padding-top: var(--bs-spacer-0); } .pt-1 { padding-top: var(--bs-spacer-1); }
.pt-2 { padding-top: var(--bs-spacer-2); } .pt-3 { padding-top: var(--bs-spacer-3); }
.pt-4 { padding-top: var(--bs-spacer-4); } .pt-5 { padding-top: var(--bs-spacer-5); }

.pb-0 { padding-bottom: var(--bs-spacer-0); } .pb-1 { padding-bottom: var(--bs-spacer-1); }
.pb-2 { padding-bottom: var(--bs-spacer-2); } .pb-3 { padding-bottom: var(--bs-spacer-3); }
.pb-4 { padding-bottom: var(--bs-spacer-4); } .pb-5 { padding-bottom: var(--bs-spacer-5); }

.ps-0 { padding-left: var(--bs-spacer-0); } .ps-1 { padding-left: var(--bs-spacer-1); }
.ps-2 { padding-left: var(--bs-spacer-2); } .ps-3 { padding-left: var(--bs-spacer-3); }
.ps-4 { padding-left: var(--bs-spacer-4); } .ps-5 { padding-left: var(--bs-spacer-5); }

.pe-0 { padding-right: var(--bs-spacer-0); } .pe-1 { padding-right: var(--bs-spacer-1); }
.pe-2 { padding-right: var(--bs-spacer-2); } .pe-3 { padding-right: var(--bs-spacer-3); }
.pe-4 { padding-right: var(--bs-spacer-4); } .pe-5 { padding-right: var(--bs-spacer-5); }

.px-0 { padding-inline: var(--bs-spacer-0); } .px-1 { padding-inline: var(--bs-spacer-1); }
.px-2 { padding-inline: var(--bs-spacer-2); } .px-3 { padding-inline: var(--bs-spacer-3); }
.px-4 { padding-inline: var(--bs-spacer-4); } .px-5 { padding-inline: var(--bs-spacer-5); }

.py-0 { padding-block: var(--bs-spacer-0); } .py-1 { padding-block: var(--bs-spacer-1); }
.py-2 { padding-block: var(--bs-spacer-2); } .py-3 { padding-block: var(--bs-spacer-3); }
.py-4 { padding-block: var(--bs-spacer-4); } .py-5 { padding-block: var(--bs-spacer-5); }

/* ---- utilities/utility-flex.css ---- */
/*
 * ABIT utility classes — Bootstrap utility-class replacement (Phase 1).
 * Same class names as Bootstrap, reimplemented locally, so no Blade view
 * needs to change when the Bootstrap CDN is removed later.
 */

/* Display */
.d-none { display: none; }
.d-inline { display: inline; }
.d-inline-block { display: inline-block; }
.d-block { display: block; }
.d-grid { display: grid; }
.d-flex { display: flex; }
.d-inline-flex { display: inline-flex; }

/* Flex direction / wrap */
.flex-row { flex-direction: row; }
.flex-row-reverse { flex-direction: row-reverse; }
.flex-column { flex-direction: column; }
.flex-column-reverse { flex-direction: column-reverse; }
.flex-wrap { flex-wrap: wrap; }
.flex-nowrap { flex-wrap: nowrap; }
.flex-fill { flex: 1 1 auto; }
.flex-grow-0 { flex-grow: 0; }
.flex-grow-1 { flex-grow: 1; }
.flex-shrink-0 { flex-shrink: 0; }
.flex-shrink-1 { flex-shrink: 1; }

/* Justify / align */
.justify-content-start { justify-content: flex-start; }
.justify-content-end { justify-content: flex-end; }
.justify-content-center { justify-content: center; }
.justify-content-between { justify-content: space-between; }
.justify-content-around { justify-content: space-around; }
.justify-content-evenly { justify-content: space-evenly; }
.align-items-start { align-items: flex-start; }
.align-items-end { align-items: flex-end; }
.align-items-center { align-items: center; }
.align-items-baseline { align-items: baseline; }
.align-items-stretch { align-items: stretch; }
.align-self-start { align-self: flex-start; }
.align-self-end { align-self: flex-end; }
.align-self-center { align-self: center; }

/* Gap utilities (standalone flex/grid gap; distinct from row-gutter g-/gx-/gy- utilities). */
.gap-0 { gap: var(--bs-spacer-0); }
.gap-1 { gap: var(--bs-spacer-1); }
.gap-2 { gap: var(--bs-spacer-2); }
.gap-3 { gap: var(--bs-spacer-3); }
.gap-4 { gap: var(--bs-spacer-4); }
.gap-5 { gap: var(--bs-spacer-5); }

/* ---- utilities/utility-text-align.css ---- */
/* Font weight */
.fw-normal { font-weight: var(--bs-fw-normal); }
.fw-semibold { font-weight: var(--bs-fw-semibold); }
.fw-bold { font-weight: var(--bs-fw-bold); }

/* Text alignment */
.text-start { text-align: left; }
.text-center { text-align: center; }
.text-end { text-align: right; }

/* ---- utilities/utility-box.css ---- */
/* Border radius */
.rounded { border-radius: var(--bs-radius); }
.rounded-circle { border-radius: 50%; }
.rounded-pill { border-radius: var(--bs-radius-pill); }
.rounded-0 { border-radius: 0; }

/* Shadow */
.shadow-sm { box-shadow: var(--bs-shadow-sm); }
.shadow { box-shadow: var(--bs-shadow); }
.shadow-lg { box-shadow: var(--bs-shadow-lg); }
.shadow-none { box-shadow: none; }

/* Sizing */
.w-100 { width: 100%; }
.h-100 { height: 100%; }

/* Position */
.position-relative { position: relative; }
.position-absolute { position: absolute; }
.position-fixed { position: fixed; }
.position-sticky { position: sticky; }

/* Overflow */
.overflow-hidden { overflow: hidden; }
.overflow-auto { overflow: auto; }

/* Border */
.border { border: 1px solid var(--bs-border-color); }
.border-0 { border: 0; }
.border-white { border-color: var(--bs-white) !important; }

/* ---- utilities/utility-text.css ---- */
/* Font size (Bootstrap's fs-1..fs-6 scale) — found during Phase 5 verification */
.fs-1 { font-size: calc(1.375rem + 1.5vw); }
.fs-2 { font-size: calc(1.325rem + 0.9vw); }
.fs-3 { font-size: calc(1.3rem + 0.6vw); }
.fs-4 { font-size: calc(1.275rem + 0.3vw); }
.fs-5 { font-size: 1.25rem; }
.fs-6 { font-size: 1rem; }
.small { font-size: 0.875em; }

/* Text decoration / wrap */
.text-decoration-none { text-decoration: none; }
.text-decoration-underline { text-decoration: underline; }
.text-nowrap { white-space: nowrap; }
.text-pre-wrap { white-space: pre-wrap; }
.text-reset { color: inherit; }

/* Vertical align (align-middle on a <table> relies on the cell
   vertical-align:inherit rule in components/table-core.css to cascade down) */
.align-middle { vertical-align: middle; }
.align-top { vertical-align: top; }
.align-bottom { vertical-align: bottom; }

/* ---- utilities/utility-position.css ---- */
/* Position (top/start/translate-middle — used for notification-dot style badges) */
.top-0 { top: 0; }
.bottom-0 { bottom: 0; }
.start-0 { inset-inline-start: 0; }
.start-50 { inset-inline-start: 50%; }
.start-100 { inset-inline-start: 100%; }
.end-0 { inset-inline-end: 0; }
.translate-middle { transform: translate(-50%, -50%); }
.translate-middle-x { transform: translateX(-50%); }
.translate-middle-y { transform: translateY(-50%); }

/* ---- utilities/utility-colors.css ---- */
/* Contextual text colors (Bootstrap defaults) */
.text-primary { color: var(--bs-primary) !important; }
.text-secondary { color: var(--bs-secondary) !important; }
.text-success { color: var(--bs-success) !important; }
.text-danger { color: var(--bs-danger) !important; }
.text-warning { color: var(--bs-warning) !important; }
.text-info { color: var(--bs-info) !important; }
.text-light { color: var(--bs-light) !important; }
.text-dark { color: var(--bs-dark) !important; }
.text-white { color: var(--bs-white) !important; }
.text-muted { color: var(--bs-muted) !important; }
.text-empty { color: #9ca3af; font-weight: 500; }
.text-black { color: #000 !important; }

/* Contextual background colors (Bootstrap defaults) */
.bg-primary { background-color: var(--bs-primary) !important; }
.bg-secondary { background-color: var(--bs-secondary) !important; }
.bg-success { background-color: var(--bs-success) !important; }
.bg-danger { background-color: var(--bs-danger) !important; }
.bg-warning { background-color: var(--bs-warning) !important; }
.bg-info { background-color: var(--bs-info) !important; }
.bg-light { background-color: var(--bs-light) !important; }
.bg-dark { background-color: var(--bs-dark) !important; }
.bg-white { background-color: var(--bs-white) !important; }
.bg-transparent { background-color: transparent !important; }

/* ---- utilities/visually-hidden.css ---- */
.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* ---- utilities/animations.css ---- */
/**
 * No @keyframes or reusable animation classes exist yet — hover transitions
 * are currently declared inline per-component (e.g. `transition:.3s`). Scaffolded for future use.
 */

/* ============================================================
 * .fade — Bootstrap's generic show/hide transition (Phase 3).
 * Used by .alert, .modal, and .tab-pane. Same class name as Bootstrap.
 * ============================================================ */
.fade {
  transition: opacity 0.15s linear;
  opacity: 0;
}

.fade.show {
  opacity: 1;
}

/* ---- layout/app-shell-responsive-lg.css ---- */
/* App shell responsive layout: <= 991.98px. */
@media (max-width: 991.98px) {
  .sidebar {
    width: min(310px, 88vw);
    transform: translateX(-105%);
    transition: transform .25s ease;
  }
  .sidebar.show { transform: translateX(0); }
  .sidebar-mobile-close { display: grid; }

  .main {
    margin-left: 0;
    padding: 18px;
  }

  .sidebar-toggle-btn { display: flex; }
  .topbar { top: 10px; }
}

/* ---- layout/navbar-responsive-md.css ---- */
/* Topbar responsive layout: <= 899.98px. */
@media (max-width: 899.98px) {
  .topbar { flex-wrap: wrap; }
  .topbar-start,
  .topbar-actions { width: 100%; }
  .topbar-actions { justify-content: flex-end; }
}

/* ---- layout/navbar-responsive-sm.css ---- */
/* Topbar responsive layout: <= 767.98px. */
@media (max-width: 767.98px) {
  .topbar {
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 12px;
    padding: 14px;
  }
  .topbar-start { width: 100%; }
  .topbar-actions {
    width: 100%;
    justify-content: stretch;
  }
  .global-client-selector { flex: 1 1 auto; }
  .global-client-btn { width: 100%; max-width: none; }
  .topbar-user-name,
  .global-role-chip { display: none; }
  .topbar-user-trigger { padding: 3px; }
  .topbar-user-chevron { display: none; }
}

/* ---- components/notification-dropdown-responsive.css ---- */
/* Notification dropdown responsive sizing. */
@media (max-width: 767.98px) {
  .notification-menu { width: min(340px, calc(100vw - 28px)); min-width: 0; }
}

/* ---- components/page-header-responsive.css ---- */
/* Page-header/title responsive behavior. Kept in utilities layer for legacy cascade parity. */
@media (max-width: 767.98px) {
  .abit-section-header { align-items: flex-start; }
  .abit-title { font-size: 20px; }
  .abit-page-subtitle { margin-left: 0; }
  .abit-page-actions { width: 100%; }
  .abit-page-actions .btn { flex: 1 1 auto; justify-content: center; }
}

/* ---- layout/app-shell-responsive-xs.css ---- */
/* App shell/topbar responsive layout: <= 575.98px. */
@media (max-width: 575.98px) {
  .main { padding: 10px; }
  .topbar { top: 8px; margin-bottom: 16px; border-radius: 16px; }
  .topbar h2 { font-size: 17px; }
  .topbar small { display: none; }
  .topbar-actions { gap: 7px; }
  .sidebar-toggle-btn,
  .topbar-icon-btn { width: 40px; height: 40px; }
  .global-client-btn { min-height: 40px; padding: 7px 10px; }
  .global-client-btn .gcs-label { max-width: calc(100vw - 190px); }
  .gcs-menu { width: calc(100vw - 20px); }
}

/* ---- components/card-family-responsive.css ---- */
/* Shared card-family responsive sizing. Kept in utilities layer for legacy cascade parity. */
@media (max-width: 575.98px) {
  .abit-card { padding: 17px; margin-bottom: 17px; border-radius: 16px; }
  .abit-kpi-card { min-height: 112px; padding: 17px; border-radius: 16px; }
  .kpi-icon { width: 48px; height: 48px; border-radius: 14px; font-size: 21px; }
  .kpi-content h2 { font-size: 1.25rem; }
  .comparison-card,
  .performance-card { border-radius: 16px; }
}

/* ---- layout/snapshots-page-responsive.css ---- */
/* Snapshots mobile layout. Kept in utilities layer for legacy cascade parity. */
@media (max-width: 575.98px) {
  .snapshot-control { grid-template-columns: 1fr; }
}

/* ---- components/table-shell-responsive.css ---- */
/* Responsive table-shell edge spacing. Kept in utilities layer for legacy cascade parity. */
@media (max-width: 575.98px) {
  .table-responsive { margin-inline: -4px; }
}

/* ---- utilities/reduced-motion.css ---- */
/* Global reduced-motion accessibility override. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

}