html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

#theme-toggle:focus,
#theme-toggle:focus-visible,
#theme-toggle:active:focus {
  outline: none;
  box-shadow: none;
}

.navbar-toggler:focus,
.navbar-toggler:focus-visible,
.navbar-toggler:active:focus {
  outline: none;
  box-shadow: none;
}

.general-factor-toggle:focus,
.general-factor-toggle:focus-visible,
.general-factor-toggle:active:focus {
  outline: none;
  box-shadow: none;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

/* Link accent colors by theme */
:root {
  --link-accent-rgb: 31, 111, 101;
  --link-accent: rgb(var(--link-accent-rgb));
  --action-rgb: 72, 110, 142;
  --action: rgb(var(--action-rgb));
  --action-hover: #3f6380;
  --action-active: #36566f;
  --action-border: #3f6380;
  --factor-adults-color: #d97706;
  --factor-young-adults-color: #22c55e;
  --factor-teens-color: #3b82f6;
  --factor-children-color: #d946ef;
}

[data-bs-theme="dark"] {
  --link-accent-rgb: 120, 201, 191;
  --action-rgb: 102, 146, 182;
  --action: rgb(var(--action-rgb));
  --action-hover: #5d8db1;
  --action-active: #547f9f;
  --action-border: #5d8db1;
}

/* Global link treatment: less default-blue, clearer hover/focus behavior */
a:not(.btn):not(.nav-link):not(.navbar-brand) {
  color: var(--bs-emphasis-color);
  text-decoration-color: rgba(var(--link-accent-rgb), 0.45);
  text-decoration-thickness: 0.08em;
  text-underline-offset: 0.16em;
  transition: color 0.15s ease, text-decoration-color 0.15s ease;
}

a:not(.btn):not(.nav-link):not(.navbar-brand):hover,
a:not(.btn):not(.nav-link):not(.navbar-brand):focus-visible {
  color: var(--link-accent);
  text-decoration-color: rgba(var(--link-accent-rgb), 0.75);
}

.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--action);
  --bs-btn-border-color: var(--action-border);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--action-hover);
  --bs-btn-hover-border-color: var(--action-hover);
  --bs-btn-focus-shadow-rgb: var(--action-rgb);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--action-active);
  --bs-btn-active-border-color: var(--action-active);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--action);
  --bs-btn-disabled-border-color: var(--action-border);
}

.btn-outline-primary {
  --bs-btn-color: var(--action);
  --bs-btn-border-color: var(--action-border);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--action);
  --bs-btn-hover-border-color: var(--action-border);
  --bs-btn-focus-shadow-rgb: var(--action-rgb);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--action-active);
  --bs-btn-active-border-color: var(--action-active);
  --bs-btn-disabled-color: var(--action);
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: var(--action-border);
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
  text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
  text-align: start;
}

.factor-history-table {
  table-layout: auto;
  width: max-content;
  min-width: 100%;
}

.factor-history-table .history-time {
  white-space: pre-line;
}

.factor-history-table .history-details {
  white-space: nowrap;
}

.factor-history-scroll {
  overflow-x: auto;
}

.report-chart-wrap {
  overflow-x: auto;
  position: relative;
}

.report-chart-svg {
  width: 100%;
  min-width: 720px;
  height: auto;
  display: block;
}

.report-chart-svg .chart-axis-line {
  stroke: none;
}

.chart-grid-line {
  stroke: var(--bs-border-color);
  stroke-width: 1;
  opacity: 0.6;
}

.chart-axis-line {
  stroke: var(--bs-emphasis-color);
  stroke-width: 1.2;
}

.chart-axis-label {
  fill: var(--bs-secondary-color);
  font-size: 12px;
}

.chart-axis-title {
  fill: var(--bs-emphasis-color);
  font-size: 12px;
  font-weight: 600;
}

.chart-line {
  fill: none;
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.chart-line-passages {
  stroke: #3f6380;
}

.chart-line-visits {
  stroke: #198754;
}

.chart-line-factor-adults {
  stroke: var(--factor-adults-color);
}

.chart-line-factor-young-adults {
  stroke: var(--factor-young-adults-color);
}

.chart-line-factor-teens {
  stroke: var(--factor-teens-color);
}

.chart-line-factor-children {
  stroke: var(--factor-children-color);
}

.chart-hover-zone {
  fill: transparent;
  pointer-events: all;
}

.chart-hover-zone:hover {
  fill: rgba(var(--link-accent-rgb), 0.08);
}

.report-week-wrap {
  overflow-x: auto;
}

.report-week-table {
  min-width: 980px;
}

.report-week-table th:first-child,
.report-week-table td:first-child {
  white-space: nowrap;
  min-width: 5.5rem;
}

.text-week-adults {
  color: var(--factor-adults-color);
}

.text-week-young-adults {
  color: var(--factor-young-adults-color);
}

.text-week-teens {
  color: var(--factor-teens-color);
}

.text-week-children {
  color: var(--factor-children-color);
}

.report-week-table thead th.text-week-adults {
  color: var(--factor-adults-color) !important;
}

.report-week-table thead th.text-week-young-adults {
  color: var(--factor-young-adults-color) !important;
}

.report-week-table thead th.text-week-teens {
  color: var(--factor-teens-color) !important;
}

.report-week-table thead th.text-week-children {
  color: var(--factor-children-color) !important;
}

.factors-active-table thead th.text-week-adults {
  color: var(--factor-adults-color) !important;
}

.factors-active-table thead th.text-week-young-adults {
  color: var(--factor-young-adults-color) !important;
}

.factors-active-table thead th.text-week-teens {
  color: var(--factor-teens-color) !important;
}

.factors-active-table thead th.text-week-children {
  color: var(--factor-children-color) !important;
}

.factors-old-table thead th.text-week-adults {
  color: var(--factor-adults-color) !important;
}

.factors-old-table thead th.text-week-young-adults {
  color: var(--factor-young-adults-color) !important;
}

.factors-old-table thead th.text-week-teens {
  color: var(--factor-teens-color) !important;
}

.factors-old-table thead th.text-week-children {
  color: var(--factor-children-color) !important;
}

.factors-active-table,
.factors-old-table {
  min-width: 1080px;
}

.factors-active-table th,
.factors-active-table td,
.factors-old-table th,
.factors-old-table td {
  white-space: nowrap;
}

.week-stack-track {
  width: 100%;
  height: 16px;
  overflow: visible;
}

.week-stack-svg {
  width: 100%;
  max-width: 100%;
  height: 100%;
  border-radius: 999px;
  overflow: hidden;
  display: block;
}

.chart-tooltip {
  position: fixed;
  left: 0;
  top: 0;
  transform: translate(-9999px, -9999px);
  padding: 0.35rem 0.5rem;
  border-radius: 0.4rem;
  border: 1px solid var(--bs-border-color);
  background: var(--bs-body-bg);
  color: var(--bs-emphasis-color);
  font-size: 0.82rem;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.16);
  pointer-events: none;
  white-space: nowrap;
  z-index: 5;
}

.chart-tooltip-global {
  z-index: 2000;
}

.chart-tooltip.is-visible {
  transform: none;
}

.report-chart-legend {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
  font-size: 0.9rem;
}

.report-view-switch {
  flex-wrap: wrap;
  justify-content: flex-end;
}

.legend-swatch {
  width: 0.75rem;
  height: 0.75rem;
  margin-right: 0.35rem;
  vertical-align: -0.1em;
}

.legend-swatch circle {
  fill: currentColor;
}

.legend-visits {
  color: #198754;
}

.legend-factor-adults {
  color: var(--factor-adults-color);
}

.legend-factor-young-adults {
  color: var(--factor-young-adults-color);
}

.legend-factor-teens {
  color: var(--factor-teens-color);
}

.legend-factor-children {
  color: var(--factor-children-color);
}

.week-segment-adults {
  fill: var(--factor-adults-color);
}

.week-segment-young-adults {
  fill: var(--factor-young-adults-color);
}

.week-segment-teens {
  fill: var(--factor-teens-color);
}

.week-segment-children {
  fill: var(--factor-children-color);
}

@media (max-width: 991.98px) {
  .app-user-nav {
    margin-top: 0.4rem;
    padding-top: 0.45rem;
    border-top: 1px solid var(--bs-border-color);
  }
}

@media (max-width: 768px) {
  .report-chart-svg {
    min-width: 640px;
  }

  .report-week-table {
    min-width: 860px;
  }
}