/*
 * TSCore Bootstrap 5.3 theme base.
 *
 * Shipped with the package (see the "style" field in package.json). This file
 * contains the small set of TSCore layout hooks that have no equivalent
 * Bootstrap utility. It otherwise re-themes Bootstrap 5.3 through CSS custom
 * properties (`--bs-*`): theme/colour tokens at :root, and component-scoped
 * `--bs-btn-*` variables inside the matching Bootstrap button selector (these
 * are not derived from the theme colours, so they must be re-pointed there).
 * Bootstrap 5.3 must be loaded before this file.
 */

:root {
  /* Brand theme colours mapped onto Bootstrap's own theme variables.
     The bg-*, text-*, border-* and link-* utilities derive from the
     *-rgb triplets, so overriding them re-themes those utilities. */
  --bs-primary: #0067c2;
  --bs-primary-rgb: 0, 103, 194;

  --bs-secondary: #5b0f8a;
  --bs-secondary-rgb: 91, 15, 138;

  --bs-success: #85d55d;
  --bs-success-rgb: 133, 213, 93;

  /* Status swatch colours, consumed via the bg-*-subtle / text-*-emphasis /
     border-*-subtle utilities. */
  --bs-danger-bg-subtle: #fff6f6;
  --bs-danger-text-emphasis: #9f3a38;
  --bs-danger-border-subtle: #e0b4b4;

  --bs-warning-bg-subtle: #fac898;
  --bs-warning-text-emphasis: #000000;
  --bs-warning-border-subtle: #ebab3d;

  --bs-secondary-bg-subtle: #d3d3d3;
  --bs-secondary-text-emphasis: #000000;
  --bs-secondary-border-subtle: #333333;

  --bs-success-bg-subtle: #c2e5b0;
  --bs-success-text-emphasis: #29382f;
  --bs-success-border-subtle: #299e50;

  --bs-primary-bg-subtle: #66a7f1;
  --bs-primary-text-emphasis: #ffffff;
  --bs-primary-border-subtle: #172536;
}

.tsc-flex-1 {
  flex: 1 !important;
}

.tsc-w-fit {
  width: fit-content !important;
}

.tsc-h-fit {
  height: fit-content !important;
}

.tscore-date-range {
  width: fit-content;
  max-width: 100%;
  padding: .4rem .55rem;
  border: 1px solid rgb(var(--bs-primary-rgb) / 16%);
  border-radius: .8rem;
  background: rgb(var(--bs-primary-rgb) / 4%);
}

.tscore-date-range-value {
  min-width: 10rem;
  line-height: 1.25;
}

.tscore-date-range-manual {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
  padding: .75rem;
  border: 1px solid rgb(var(--bs-primary-rgb) / 12%);
  border-radius: .8rem;
  background: rgb(var(--bs-primary-rgb) / 3%);
}

.tscore-date-range-manual-input {
  width: 100%;
  margin-top: .25rem;
  padding: .45rem .65rem;
  border: 1px solid rgb(var(--bs-primary-rgb) / 20%);
  border-radius: .6rem;
  background: #fff;
}

.tscore-date-range-manual-input:focus {
  border-color: var(--bs-primary);
  outline: 0;
  box-shadow: 0 0 0 .2rem rgb(var(--bs-primary-rgb) / 12%);
}

.tscore-date-range-calendar {
  min-width: 0;
}

.tscore-date-range-calendar .flatpickr-calendar.inline {
  width: 100%;
  margin: 0 auto;
  border: 1px solid rgb(var(--bs-primary-rgb) / 14%);
  border-radius: 1rem;
  box-shadow: 0 .75rem 2rem rgb(15 45 75 / 12%);
}

.tscore-date-range-calendar .flatpickr-calendar.multiMonth .flatpickr-rContainer,
.tscore-date-range-calendar .flatpickr-calendar.multiMonth .flatpickr-days {
  width: 100%;
}

.tscore-date-range-calendar .flatpickr-calendar.multiMonth .dayContainer {
  width: 50%;
  min-width: 0;
  max-width: none;
  min-height: 235px;
}

.tscore-date-range-calendar .flatpickr-calendar.multiMonth .flatpickr-days {
  min-height: 235px;
}

.tscore-date-range-calendar .flatpickr-calendar.multiMonth .flatpickr-day {
  max-width: none;
}

.tscore-date-range-calendar .flatpickr-day.selected,
.tscore-date-range-calendar .flatpickr-day.startRange,
.tscore-date-range-calendar .flatpickr-day.endRange {
  border-color: var(--bs-primary);
  color: #fff;
  background: var(--bs-primary);
}

@media (max-width: 575.98px) {
  .tscore-date-range-manual {
    grid-template-columns: 1fr;
  }
}

/* Solid primary buttons keep the brand blue. Bootstrap hard-codes each button
   variant's colours, so re-point the component-scoped variables here. */
.btn-primary {
  --bs-btn-bg: rgb(var(--bs-primary-rgb));
  --bs-btn-border-color: #1a94ff;
  --bs-btn-hover-bg: #1a94ff;
  --bs-btn-hover-border-color: rgb(var(--bs-primary-rgb));
  --bs-btn-active-bg: rgb(var(--bs-primary-rgb));
  --bs-btn-active-border-color: #1a94ff;
}

/* Solid secondary buttons carry the brand secondary (purple). */
.btn-secondary {
  --bs-btn-bg: rgb(var(--bs-secondary-rgb));
  --bs-btn-border-color: #7913b9;
  --bs-btn-hover-bg: #7913b9;
  --bs-btn-hover-border-color: rgb(var(--bs-secondary-rgb));
  --bs-btn-active-bg: rgb(var(--bs-secondary-rgb));
  --bs-btn-active-border-color: #7913b9;
}

/* Outline-primary buttons use the brand primary (blue). */
.btn-outline-primary {
  --bs-btn-color: rgb(var(--bs-primary-rgb));
  --bs-btn-border-color: rgb(var(--bs-primary-rgb));
  --bs-btn-hover-bg: rgb(var(--bs-primary-rgb));
  --bs-btn-hover-border-color: rgb(var(--bs-primary-rgb));
  --bs-btn-active-bg: rgb(var(--bs-primary-rgb));
  --bs-btn-active-border-color: rgb(var(--bs-primary-rgb));
}
.tscore-table-search-match {
    padding: 0;
    border-radius: .15em;
    background: #fff19a;
    color: inherit;
    box-shadow: 0 0 0 .08em rgb(255 213 0 / 22%);
}

.tscore-table-column-resizer {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 3;
    width: 8px;
    height: 100%;
    cursor: col-resize;
    touch-action: none;
    user-select: none;
}

th:has(> .tscore-table-column-resizer) {
    position: relative;
}

.tscore-table-column-resizer::after {
    position: absolute;
    top: 20%;
    bottom: 20%;
    left: 3px;
    width: 2px;
    border-radius: 2px;
    background: rgb(var(--bs-primary-rgb) / 12%);
    content: '';
}

.tscore-table-column-resizer:hover::after,
.tscore-table-column-resizer:focus-visible::after {
    background: rgb(var(--bs-primary-rgb) / 45%);
}

.tscore-table-column-resizing,
.tscore-table-column-resizing * {
    cursor: col-resize !important;
    user-select: none !important;
}

.tscore-table-user-sized-column > * {
    min-width: 0 !important;
    max-width: 100% !important;
}