@font-face {
  font-display: swap;
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/inter-v20-latin-300.woff2') format('woff2');
}

@font-face {
  font-display: swap;
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/inter-v20-latin-regular.woff2') format('woff2');
}

@font-face {
  font-display: swap;
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/inter-v20-latin-500.woff2') format('woff2');
}

@font-face {
  font-display: swap;
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/inter-v20-latin-600.woff2') format('woff2');
}

@font-face {
  font-display: swap;
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/inter-v20-latin-700.woff2') format('woff2');
}

.nav-tabs .nav-item {
  padding-bottom: 0;
}

.ts-dropdown.multi.plugin-checkbox_options {
  margin-top: 8px;
}

.tomselect-always-open.multi.plugin-checkbox_options .ts-control {
  box-shadow: none;
}

.creative-preview {
  border: 0;
  box-sizing: content-box;
}

.messages-container {
    position: fixed;
    bottom: 10px;
    right: 10px;
    width: 300px;
    height: 150px;
    z-index: 1000;
    pointer-events: none;
}

.messages-container dialog {
    width: 100%;
    border: 1px solid var(--affirmare-light-dark);
    border-radius: 8px;
}

.messages-container dialog h1 {
    font-size: 1.4rem;
}

.messages-container dialog .message-icon {
    width: 32px;
    height: 32px;
}

/* ---------- Bootstrap 5.3 base color scheme overrides ---------- */
:root {
  /* Primary / accent */
  --bs-primary: #4f46e5;
  --bs-primary-rgb: 79, 70, 229;
  --bs-link-color: #4f46e5;
  --bs-link-color-rgb: 79, 70, 229;
  --bs-link-hover-color: #3730b3;
  --bs-link-hover-color-rgb: 55, 48, 179;

  /* Body / surfaces */
  --bs-body-color: #0b0e14;
  --bs-body-color-rgb: 11, 14, 20;
  --bs-secondary-bg: #fafbfc;
  --bs-secondary-bg-rgb: 250, 251, 252;

  /* Text color variants */
  --bs-secondary-color: #6b7280;
  --bs-secondary-color-rgb: 107, 114, 128;
  --bs-tertiary-color: #9ca3af;
  --bs-tertiary-color-rgb: 156, 163, 175;

  /* Borders */
  --bs-border-color: #e5e7eb;
  --bs-border-radius: 8px;
  --bs-border-radius-sm: 6px;
  --bs-border-radius-lg: 12px;

  /* Status colors */
  --bs-success: #059669;
  --bs-success-rgb: 5, 150, 105;
  --bs-warning: #b45309;
  --bs-warning-rgb: 180, 83, 9;
  --bs-danger: #be123c;
  --bs-danger-rgb: 190, 18, 60;
  --bs-info: #0369a1;
  --bs-info-rgb: 3, 105, 161;

  /* Shadows */
  --bs-box-shadow-sm: 0 1px 2px rgba(16, 24, 40, 0.04);
  --bs-box-shadow: 0 1px 3px rgba(16, 24, 40, 0.06), 0 1px 2px rgba(16, 24, 40, 0.04);
  --bs-box-shadow-lg: 0 12px 32px -12px rgba(16, 24, 40, 0.18), 0 4px 8px -4px rgba(16, 24, 40, 0.08);

  /* Typography */
  --bs-font-sans-serif: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
  --bs-body-font-size: 1rem;
  --bs-body-line-height: 1.45;

  /* Layout shell — no Bootstrap equivalent */
  --h-top: 52px;
  --w-side: 232px;
}

/* Font rendering not covered by Bootstrap */
body {
  -webkit-font-smoothing: antialiased;
  font-feature-settings: "ss01", "cv11";
}

h1 { font-size: 2rem; }

/* ---------- Layout shell ---------- */
.app {
  display: grid;
  grid-template-columns: var(--w-side) 1fr;
  grid-template-rows: var(--h-top) 1fr;
  min-height: 100vh;
}

.app:not(:has(> .sidebar)) {
  grid-template-columns: 1fr;
}

.topbar {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 0 10px;
  border-bottom: 1px solid var(--bs-border-color);
  background: #fff;
  position: sticky; top: 0; z-index: 40;
}

.topbar .brand {
  display: flex; align-items: center; gap: 9px;
  font-weight: 600; letter-spacing: -0.01em;
  width: calc(var(--w-side) - 18px);
  color: var(--bs-body-color);
  text-decoration: none;
}

.topbar .divider { width: 1px; height: 22px; background: var(--bs-border-color); }

.crumbs { display: flex; align-items: center; gap: 12px; color: #555; font-size: 20px; padding-left: 20px; }
.crumbs .here { color: black; }
.crumbs a {
  text-decoration: none; color: #555;
}

.topbar .spacer { flex: 1; }

.topbar .search {
  display: flex; align-items: center; gap: 8px;
  width: 280px; padding: 6px 10px;
  background: var(--bs-secondary-bg); border: 1px solid var(--bs-border-color);
  border-radius: var(--bs-border-radius);
  color: var(--bs-secondary-color);
}

.topbar .search input { flex: 1; border: 0; outline: 0; background: transparent; font-size: 13px; }

.avatar {
  width: 28px; height: 28px; border-radius: 50%;
  background: linear-gradient(135deg, var(--bs-primary), color-mix(in oklab, var(--bs-primary) 85%, black));
  color: #fff; display: grid; place-items: center; font-size: 11px; font-weight: 600;
}

.sidebar {
  border-right: 1px solid var(--bs-border-color);
  background: #fff;
  padding: 14px 10px;
  display: flex; flex-direction: column; gap: 2px;
  position: sticky; top: var(--h-top); height: calc(100vh - var(--h-top));
  overflow: auto;
}

.side-label {
  padding: 10px 10px 6px; font-size: 11px;
  color: var(--bs-tertiary-color); text-transform: uppercase; letter-spacing: 0.06em;
}

.nav-item {
  display: flex; align-items: center; gap: 10px;
  padding: 7px 10px; border-radius: 6px;
  color: #374151; font-size: 13.5px;
  text-decoration: none;
}

.nav-item:hover { background: var(--bs-secondary-bg); color: var(--bs-body-color); }

.nav-item.active {
  background: rgba(var(--bs-primary-rgb), 0.12);
  color: color-mix(in oklab, var(--bs-primary) 85%, black);
  font-weight: 500;
}

.nav-item .ic { width: 16px; height: 16px; flex: none; opacity: 0.9; }

.nav-link:visited {
  color: black;
}

.side-foot {
  margin-top: auto; padding: 10px;
  border-top: 1px solid var(--bs-border-color);
  display: flex; align-items: center; gap: 10px;
  color: var(--bs-secondary-color); font-size: 12px;
}

.main {
  padding: 20px 28px 60px;
  min-width: 0;
  background-color: #f6f7f9;
}

.main .table tr th {
  background-color: #f6f7f9;
}

a:not(.btn):visited {
  color: var(--bs-body-color);
}