/* Small additions on top of Tabler. */
.search-dropdown { position: absolute; top: 100%; left: 0; right: 0; z-index: 1050; }
.search-dropdown:empty { display: none; }
.table td.text-end, .table th.text-end { font-variant-numeric: tabular-nums; }
.timeline-item { border-left: 3px solid var(--tblr-border-color); padding-left: 1rem; margin-left: .25rem; }
.timeline-item.is-customer { border-left-color: var(--tblr-orange); }
.timeline-item.is-change, .timeline-item.is-time { color: var(--tblr-secondary); }
.comment-body { white-space: pre-wrap; overflow-wrap: anywhere; }
.diff-old { background: rgba(214, 57, 57, .12); }
.diff-new { background: rgba(47, 179, 68, .12); }
pre.json { max-height: 30rem; overflow: auto; }
@media print {
  .navbar-vertical, .page-header, header.navbar { display: none !important; }
  .page-wrapper { margin: 0 !important; }
}

/* django-allauth pages: templates/allauth/elements/ render Tabler markup. */
.auth .form-hint a { white-space: nowrap; }

/* Filter bar: every control the same height; dropdown checkboxes look like selects. */
.filter-bar .form-control, .filter-bar .form-select { min-height: 2.25rem; }
.filter-dropdown .dropdown-menu { max-height: 18rem; overflow-y: auto; min-width: 100%; }
.filter-dropdown .dropdown-item { display: flex; align-items: center; cursor: pointer; }

/* Dashboard widgets: counts right-aligned in tabular figures, like NetBox. */
.dashboard-widget .dashboard-count { font-variant-numeric: tabular-nums; min-width: 2.5rem; text-align: right; }
.dashboard-widget .badge-dot { width: .5rem; height: .5rem; padding: 0; border-radius: 50%; }

/* Change log widget: scrolls inside the card with a sticky header, like NetBox. */
.changelog-scroll { max-height: 30rem; overflow-y: auto; }
.changelog-scroll thead th { background: var(--tblr-bg-surface); }

/* Tom Select, matched to Tabler's light and dark themes.
   The wrapper keeps Tabler's .form-select look (border, arrow); the inner control is transparent. */
.ts-wrapper.form-select { padding: 0; min-height: 2.25rem; display: flex; align-items: center; }
.ts-wrapper.form-select .ts-control {
  background: transparent !important; border: 0; box-shadow: none; color: var(--tblr-body-color);
  padding: .4375rem 2.25rem .4375rem .75rem; min-height: 0; width: 100%; flex-wrap: nowrap; cursor: pointer;
}
.ts-wrapper.single .ts-control .item { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ts-wrapper.form-select.focus {
  border-color: var(--tblr-primary); box-shadow: 0 0 0 .25rem rgba(var(--tblr-primary-rgb), .25);
}
.ts-dropdown {
  background: var(--tblr-bg-surface); color: var(--tblr-body-color); border: 1px solid var(--tblr-border-color);
  border-radius: var(--tblr-border-radius); box-shadow: var(--tblr-box-shadow-dropdown); z-index: 1060;
}
.ts-dropdown .dropdown-input-wrap { padding: .5rem; border-bottom: 1px solid var(--tblr-border-color); }
.ts-dropdown .dropdown-input {
  width: 100%; background: var(--tblr-bg-forms); color: var(--tblr-body-color);
  border: 1px solid var(--tblr-border-color); border-radius: var(--tblr-border-radius); padding: .375rem .625rem;
}
.ts-dropdown .dropdown-input:focus { outline: 0; border-color: var(--tblr-primary); }
.ts-dropdown .option, .ts-dropdown .no-results { padding: .4rem .75rem; }
.ts-dropdown .active { background: rgba(var(--tblr-primary-rgb), .12); color: var(--tblr-body-color); }
.ts-dropdown .selected { color: var(--tblr-primary); font-weight: 600; }
.ts-dropdown .highlight { background: rgba(var(--tblr-warning-rgb), .35); border-radius: 2px; }
.ts-dropdown-content { max-height: 18rem; }

/* Rendered Markdown in comments, descriptions and previews. */
.markdown-body { overflow-wrap: anywhere; }
.markdown-body > :last-child { margin-bottom: 0; }
.markdown-body p, .markdown-body ul, .markdown-body ol, .markdown-body pre,
.markdown-body blockquote, .markdown-body table { margin-bottom: .6rem; }
.markdown-body h1, .markdown-body h2, .markdown-body h3 { font-size: 1rem; font-weight: 600; margin: .75rem 0 .4rem; }
.markdown-body ul, .markdown-body ol { padding-left: 1.4rem; }
.markdown-body pre { background: var(--tblr-bg-surface-secondary); padding: .6rem .75rem; border-radius: var(--tblr-border-radius); overflow-x: auto; }
.markdown-body code { font-size: .85em; }
.markdown-body blockquote { border-left: 3px solid var(--tblr-border-color); padding-left: .75rem; color: var(--tblr-secondary); }
.markdown-body table { border-collapse: collapse; display: block; overflow-x: auto; }
.markdown-body th, .markdown-body td { border: 1px solid var(--tblr-border-color); padding: .3rem .6rem; }
.markdown-preview:empty::before { content: "Nothing to preview."; color: var(--tblr-secondary); }
