/* Gridstack Container */
.grid-stack {
  margin-top: 20px;
}

/* Ensure grid-stack items have a minimum width and height */
.grid-stack-item {
  min-width: 100px !important;
  /* Minimum width (fallback if dynamic values don't apply) */
  min-height: 100px !important;
  /* Minimum height (fallback if dynamic values don't apply) */
}

.grid-stack-item-content {
  overflow: hidden !important;
}

/* Chart containers: fill tile width in flexbox layout */
#chart-container,
#maturity-chart-container {
  width: 100%;
  min-width: 0;
  position: relative;
}

/* Force Highcharts inner container to fill */
#chart-container .highcharts-container,
#maturity-chart-container .highcharts-container {
  width: 100% !important;
  max-width: 100% !important;
}

/* External chart legends - right of chart, outside plot area */
#curves-legend,
#historic-legend {
  width: 100px;
  font-size: 11px;
  color: #666;
  gap: 4px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

#curves-legend .legend-item,
#historic-legend .legend-item {
  display: flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}

#curves-legend .legend-swatch,
#historic-legend .legend-swatch {
  width: 12px;
  height: 12px;
  border-radius: 2px;
  flex-shrink: 0;
}

#curves-legend .legend-clickable:hover,
#historic-legend .legend-clickable:hover {
  opacity: 0.9;
}

#curves-legend .legend-item-hidden,
#historic-legend .legend-item-hidden {
  opacity: 0.4;
  text-decoration: line-through;
}

#curves-legend .legend-item-hidden .legend-swatch,
#historic-legend .legend-item-hidden .legend-swatch {
  opacity: 0.5;
}

/* Flex parents of chart containers need min-width for proper sizing */
.curves-tile .card-body,
.card-body:has(#maturity-chart-container) {
  min-width: 0;
}

.card .rate-value {
  font-size: 2rem;
}

.card .text-muted {
  line-height: 1.3;
}

#pwlbRatesTitle {
  margin-bottom: 5px !important;
}

/* Card Styling */
.card {
  border-radius: 12px;
  overflow: hidden !important;
  transition: none;
}

.card:hover {
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

.card-header {
  font-weight: 600;
  font-size: 0.9rem;
  padding: 0.5rem 0.75rem;
}

.card-body {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 0.5rem 0 0.25rem 0.5rem;
}

.card-body>div {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding-bottom: 0.0rem;
}

/* Shared style for button and dropdown */
.custom-nav-button,
#borrower-select {
  max-width: 300px;
  margin: 0;
  font-size: 0.75rem;
  padding: 0.25rem 0.5rem;
  height: auto;
  border: 1px solid #ced4da;
  border-radius: 0.375rem;
  background-color: #fff;
  color: #212529;
  text-decoration: none;
  display: inline-block;
  text-align: center;
  vertical-align: middle;
}

/* Optional hover and focus styles */
.custom-nav-button:hover,
#borrower-select:hover {
  background-color: #f8f9fa;
  border-color: #adb5bd;
  cursor: pointer;
}


.period-btn,
.comparison-btn {
  padding: 0.25rem 0.5rem !important;
  font-size: 0.75rem;
  height: auto;
}

select,
button {
  font-size: 0.75rem;
  line-height: 1.2;
  padding: 0.25rem 0.5rem;
  height: auto;
}

#bubble-chart-container {
  flex-grow: 1;
}

/* Info Panel Above the PWLB Table */
#pwlbInfo {
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.2;
  font-size: 12px;
}

.modal-dialog {
  max-width: 95vw;
  width: 100%;
}

.modal-content {
  height: 90vh;
}

.modal-body {
  height: 100%;
  padding: 0.5rem;
  display: flex;
  flex-direction: column;
}

#modalChartContainer {
  flex: 1;
  width: 100%;
}

#modalChartContainer {
  width: 100%;
  height: 80vh;
}

#chartModal {
  font-size: 20px;
}

#chartModal .btn {
  font-size: 20px;
}

#chartModal .highcharts-axis-labels text,
#chartModal .highcharts-legend-item text,
#chartModal .highcharts-tooltip text {
  font-size: 20px !important;
}



/* Make sure the injected caption looks clean */
#pwlbInfoWrapper {
  background: #f9f9f9;
  font-size: 0.95em;
}


.tabulator-tableholder {
  background-color: #FFF !important;
}

/* ✅ Tabulator header styles */
.tabulator .tabulator-header {
  background-color: #FFF !important;
  color: white !important;
  font-size: 11px;
}

/* ✅ Individual column headers */
.tabulator .tabulator-header .tabulator-col {
  background-color: #212529 !important;
  color: white !important;
  white-space: normal !important;
  overflow: visible;
  text-overflow: ellipsis;
  line-height: 1;
  height: auto;
  padding: 6px 8px;
  vertical-align: middle;
  border-color: #444 !important;
}

/* ✅ Header title text */
.tabulator .tabulator-header .tabulator-col .tabulator-col-title {
  white-space: normal !important;
  word-break: break-word;
  font-size: 12px;
  text-align: center;
  line-height: 1;
  color: white !important;
}

/* ✅ Compact row height */
.tabulator .tabulator-row {
  min-height: 25px !important;
  height: 24px !important;
  font-size: 12px;
  text-align: center;
}

/* ✅ Compact cell padding */
.tabulator .tabulator-cell {
  padding: 2px 4px !important;
  font-size: 11px;
}

#break-cost-tile {
  overflow-y: auto !important;
  max-height: 100% !important;
  display: flex;
  flex-direction: column;
}

#breakCostChart {
  height: 100%;
  width: 100%;
  overflow: hidden;
}

/* Allow interaction everywhere */
.grid-stack-item-content {
  pointer-events: auto;
}



.grid-stack .card-header {
  cursor: move;
}

#breakCostPctChart {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 20px;
}

#breakCostChart {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 20px;
}

#bubble-chart-container {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 20px;
}

#annual-outstanding-chart {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 20px;
}

/* Highlighted row when hovered from a chart */
.row-hovered {
  background-color: #b3b3b3 !important;
  /* Same as Bootstrap's table-warning */
}




.kpi-card {
  border-radius: 10px;
  background-color: white;
  transition: transform 0.2s ease;
  overflow: hidden;
  /* Add CSS custom properties for responsive font scaling */
  --widget-width: 100%;
  --widget-height: auto;
  --header-font-size: clamp(0.7rem, 2.5vw, 0.9rem);
  --rate-font-size: clamp(1.5rem, 4vw, 2.3rem);
  --small-font-size: clamp(0.85rem, 2.5vw, 1.1rem);
}


.kpi-card .kpi-header {
  background-color: #212529;
  /* match tile header fill */
  font-size: var(--header-font-size);
  letter-spacing: 0.5px;
  transition: background-color 0.3s ease;
  /* Ensure text doesn't overflow */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 0.5rem 0.75rem;
}

.kpi-card .rate-value {
  font-size: var(--rate-font-size);
  font-weight: bold;
  transition: color 0.3s ease;
  /* Ensure text doesn't overflow */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.1;
}

.kpi-card .small {
  font-size: var(--small-font-size);
  transition: color 0.3s ease;
  /* Ensure text doesn't overflow */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.2;
}

/* Responsive adjustments for different screen sizes */
@media (max-width: 768px) {
  .kpi-card {
    --header-font-size: clamp(0.6rem, 3vw, 0.8rem);
    --rate-font-size: clamp(1.2rem, 5vw, 1.8rem);
    --small-font-size: clamp(0.75rem, 3vw, 0.95rem);
  }
}

@media (max-width: 576px) {
  .kpi-card {
    --header-font-size: clamp(0.5rem, 3.5vw, 0.7rem);
    --rate-font-size: clamp(1rem, 6vw, 1.5rem);
    --small-font-size: clamp(0.65rem, 3.5vw, 0.85rem);
  }
}

/* For very small widgets (when grid items are resized) */
@media (max-width: 400px) {
  .kpi-card {
    --header-font-size: clamp(0.4rem, 4vw, 0.6rem);
    --rate-font-size: clamp(0.8rem, 7vw, 1.2rem);
    --small-font-size: clamp(0.55rem, 4vw, 0.75rem);
  }
}

/* KPI rate cards: break almost immediately to avoid text overlap */
/* Parent flex container: merge rows so all 6 cards wrap together */
.col-12:has([id^="rate-widget"]) {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.col-12:has([id^="rate-widget"])>.row {
  display: contents;
}

/* Cards: 1 per row default, 2 at 420px, 3 at 1200px, 6 at 1400px */
.col-12:has([id^="rate-widget"]) .col-md-4 {
  flex: 0 0 100%;
  max-width: 100%;
}

@media (min-width: 420px) {
  .col-12:has([id^="rate-widget"]) .col-md-4 {
    flex: 0 0 calc(50% - 0.375rem);
    max-width: calc(50% - 0.375rem);
  }
}

@media (min-width: 1200px) {
  .col-12:has([id^="rate-widget"]) .col-md-4 {
    flex: 0 0 calc(33.333333% - 0.5rem);
    max-width: calc(33.333333% - 0.5rem);
  }
}

/* Widest: 6 KPIs in one row (50% of 33.33% width each) */
@media (min-width: 1400px) {
  .col-12:has([id^="rate-widget"]) .col-md-4 {
    flex: 0 0 calc((100% - 3.75rem) / 6);
    max-width: calc((100% - 3.75rem) / 6);
  }
}

/* Curves and Predictions – break at 1200px (same as KPIs going 3→2) */
.row-curves-predictions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}
.row-curves-predictions .curves-tile,
.row-curves-predictions .predictions-tile {
  flex: 0 0 100%;
  max-width: 100%;
}
@media (min-width: 1200px) {
  .row-curves-predictions .curves-tile,
  .row-curves-predictions .predictions-tile {
    flex: 0 0 calc(50% - 0.375rem);
    max-width: calc(50% - 0.375rem);
  }
}
.row-curves-predictions .curves-tile {
  order: 1;
}
.row-curves-predictions .predictions-tile {
  order: 2;
}

/* Historic Rates and Latest PWLB Rates – break at 1200px (same as KPIs) */
.row-historic-latest {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}
.row-historic-latest .historic-rates-tile,
.row-historic-latest .latest-rates-tile {
  flex: 0 0 100%;
  max-width: 100%;
}
@media (min-width: 1200px) {
  .row-historic-latest .historic-rates-tile,
  .row-historic-latest .latest-rates-tile {
    flex: 0 0 calc(50% - 0.375rem);
    max-width: calc(50% - 0.375rem);
  }
}

.animated-delta {
  animation: bump 0.4s ease-out;
}

@keyframes bump {
  0% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.1);
  }

  100% {
    transform: scale(1);
  }
}

.loan-metric {
  padding: 12px;
  border-radius: 8px;
  background-color: #f8f9fa;
  transition: background-color 0.2s;
}

.loan-metric:hover {
  background-color: #e9ecef;
}

.loan-metric small.text-muted {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.loan-metric .h5 {
  margin-top: 4px;
  font-weight: 600;
}

#loanScheduleTable {
  font-size: 0.875rem;
}

#loanScheduleTable table {
  margin-bottom: 0;
}

#loanScheduleTable th {
  position: sticky;
  top: 0;
  background-color: #f8f9fa;
  z-index: 1;
}

.scroll-schedule-wrapper {
  max-height: 400px;
  overflow-y: auto;
  border: 1px solid #dee2e6;
  border-radius: 4px;
}

/* Improve modal scrollbar appearance */
.modal-body::-webkit-scrollbar {
  width: 8px;
}

.modal-body::-webkit-scrollbar-track {
  background: #f1f1f1;
  border-radius: 4px;
}

.modal-body::-webkit-scrollbar-thumb {
  background: #888;
  border-radius: 4px;
}

.modal-body::-webkit-scrollbar-thumb:hover {
  background: #555;
}


/* Mobile menu overlay: keep page visible underneath, not solid grey */
@media (max-width: 991.98px) {

  .offcanvas-backdrop,
  .navbar-collapse::before {
    background: rgba(0, 0, 0, 0.05) !important;
  }
}

/* Fix stuck modal/offcanvas backdrop on mobile - prevent grey overlay blocking page */
@media (max-width: 991.98px) {

  body:not(.modal-open) .modal-backdrop,
  body:not(:has(.modal.show)) .modal-backdrop,
  body:not(:has(.offcanvas.show)) .offcanvas-backdrop {
    display: none !important;
    pointer-events: none !important;
    visibility: hidden !important;
  }
}

/* Tabulator row styles */
.tabulator-row {
  transition: background-color 0.2s ease !important;
}

.tabulator-row.tabulator-selected {
  background-color: #e9ecef !important;
}

.tabulator-row.tabulator-selected:hover {
  background-color: #e9ecef !important;
}

/* Prevent text wrapping in PWLB Activity table */
.tabulator .tabulator-cell.no-wrap {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Fix mobile header doubling issue */
@media (max-width: 768px) {
  .tabulator .tabulator-header {
    height: auto !important;
    min-height: 40px !important;
  }

  .tabulator .tabulator-header .tabulator-col {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
}

/* Remove all custom styling for Borrower Leaderboard - let it use default Tabulator styling */

.market-commentary-body {
  max-height: 260px;
  overflow-y: auto;
}

.card.d-flex.flex-column {
  height: 340px !important;
  min-height: 0 !important;
}

.market-commentary-body {
  overflow-y: auto;
  min-height: 0;
  flex-grow: 1;
  height: auto;
}

/* Remove or comment out any .col-md-4 height rules */
/* .col-md-4 { height: auto !important; min-height: 0 !important; } */

.market-commentary-body {
  height: 100% !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  flex-grow: 1 !important;
  flex-shrink: 1 !important;
  flex-basis: 0 !important;
  display: block !important;
}

/* Fix tabs: ensure only the active pane is visible */
.tab-content>.tab-pane {
  display: none;
}

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

/* SONIA Rates Table Styling */
#soniaRatesTable .modern-table {
  font-size: 12px;
  border: 1px solid #e0e0e0;
  border-radius: 6px;
  overflow: hidden;
  width: 100%;
  border-collapse: collapse;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

#soniaRatesTable .modern-table thead {
  background: #212529;
  border-bottom: 2px solid #212529;
}

#soniaRatesTable .modern-table th {
  padding: 4px 10px;
  text-align: left;
  font-weight: 600;
  color: #fd7e14 !important;
  border-right: 1px solid #333333;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  line-height: 1.25;
}

#soniaRatesTable .modern-table th:last-child {
  border-right: none;
}

#soniaRatesTable .modern-table td {
  padding: 3px 10px;
  border-bottom: 1px solid #f0f0f0;
  border-right: 1px solid #f0f0f0;
  vertical-align: middle;
  font-size: 11px;
  line-height: 1.25;
}

#soniaRatesTable .modern-table td:last-child {
  border-right: none;
}

#soniaRatesTable .modern-table tr:hover {
  background-color: #f8f9fa;
}

/* Financial Year rows */
#soniaRatesTable .financial-year-row {
  background: linear-gradient(135deg, #e9ecef 0%, #dee2e6 100%);
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s ease;
  border-left: 0px;
  color: black;
}

#soniaRatesTable .financial-year-row:hover {
  background: linear-gradient(135deg, #dee2e6 0%, #ced4da 100%);
  transform: translateX(3px);
}

#soniaRatesTable .financial-year-row td {
  color: black !important;
}

/* Quarter rows */
#soniaRatesTable .quarter-row {
  background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  border-left: 4px solid #ced4da;
  color: black;
}

#soniaRatesTable .quarter-row:hover {
  background: linear-gradient(135deg, #e9ecef 0%, #dee2e6 100%);
  transform: translateX(2px);
}

#soniaRatesTable .quarter-row td {
  color: black !important;
}

/* Month rows */
#soniaRatesTable .month-row {
  background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s ease;
  border-left: 3px solid #e9ecef;
  color: black;
}

#soniaRatesTable .month-row:hover {
  background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
  transform: translateX(1px);
}

#soniaRatesTable .month-row td {
  color: black !important;
}

/* Day rows */
#soniaRatesTable .day-row {
  background-color: #f8f9fa;
  transition: background-color 0.2s ease;
  border-left: 2px solid #dee2e6;
}

#soniaRatesTable .day-row:hover {
  background-color: #e9ecef;
}

#soniaRatesTable .day-row td {
  color: black !important;
}

/* Rate values - all black text */
#soniaRatesTable .modern-table td {
  color: black !important;
}

/* Compact styling for better density */
#soniaRatesTable .modern-table tr {
  height: 28px;
}

#soniaRatesTable .financial-year-row {
  height: 36px;
}

#soniaRatesTable .quarter-row {
  height: 32px;
}

#soniaRatesTable .month-row {
  height: 30px;
}

/* Wrap long text in Tabulator cells */
.tabulator .wrap {
  white-space: normal !important;
  overflow: visible !important;
  line-height: 1.3;
}

/* Allow variable row heights */
#newsFeedTable .tabulator-row,
#ratingActionNewsTable .tabulator-row {
  height: auto !important;
}

/* Make News tables background transparent */
#newsFeedTable .tabulator,
#newsFeedTable .tabulator-table,
#ratingActionNewsTable .tabulator,
#ratingActionNewsTable .tabulator-table {
  background: transparent !important;
}

/* Hide weekly, monthly and 3-month change elements on Gilts widgets only */
[id^="gilts-widget"] .rate-change-1w,
[id^="gilts-widget"] .rate-change-1m,
[id^="gilts-widget"] .rate-change-3m {
  display: none !important;
}

/* Hide date dropdown on Gilts intraday chart */
.time-period-dropdown {
  display: none !important;
}

/* PWLB Activity table header */
#pwlbActivityTable .tabulator-header {
  min-height: 34px;
}

[id^="rate-widget"] .kpi-value[style*="display:none"],
[id^="rate-widget"] .kpi-changes[style*="display:none"] {
  position: absolute;
  width: 1px;
  height: 1px;
  clip: rect(0,0,0,0);
  overflow: hidden;
}

[id^="rate-widget"].kpi-loaded .rate-value,
[id^="rate-widget"].kpi-loaded .kpi-changes,
[id^="rate-widget"].kpi-loaded .rate-change-1d,
[id^="rate-widget"].kpi-loaded .rate-change-1w,
[id^="rate-widget"].kpi-loaded .rate-change-1m,
[id^="rate-widget"].kpi-loaded .rate-change-3m {
  display: block !important;
}
[id^="rate-widget"].kpi-loaded .kpi-changes {
  display: flex !important;
}

/* Override rate-value color for dashboard (PWLB) widgets - standard orange */
[id^="rate-widget"] .rate-value {
  color: #fd7e14 !important;
  font-size: 2.5rem !important;
  font-weight: bold !important;
}

/* Compact rate widgets: minimal gap title→rate, zero gap under moves */
[id^="rate-widget"] .kpi-header {
  background-color: #212529 !important;
  padding: 0.25rem 0.5rem !important;
  padding-bottom: 0.15rem !important;
}
[id^="rate-widget"] > div:not(.kpi-header) {
  padding: 0.15rem 0.5rem !important;
  padding-bottom: 0.35rem !important;
}
[id^="rate-widget"] .row.g-1.small {
  display: flex !important;
  flex-wrap: wrap !important;
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
  gap: 0.125rem !important;
}
[id^="rate-widget"] .row.g-1.small .col-6,
[id^="rate-widget"] .row.g-1.small [class*="col-6"] {
  flex: 0 0 calc(50% - 0.0625rem) !important;
  max-width: calc(50% - 0.0625rem) !important;
}
[id^="rate-widget"] .rate-value {
  margin-bottom: 0.1rem !important;
}

/* KPIs: no gap under moves - size to content, no stretch */
[id^="rate-widget"] {
  display: flex !important;
  flex-direction: column !important;
  height: auto !important;
  min-height: 0 !important;
}
[id^="rate-widget"] > div:not(.kpi-header) {
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
  min-height: 0 !important;
}
[id^="rate-widget"] .row.g-1.small {
  margin-top: auto !important;
}

/* Override rate-value color for gilts widgets - maximum specificity to override JavaScript */
#gilts-widget-1y .rate-value,
#gilts-widget-2y .rate-value,
#gilts-widget-5y .rate-value,
#gilts-widget-10y .rate-value,
#gilts-widget-20y .rate-value,
#gilts-widget-50y .rate-value,
[id^="gilts-widget"].card.kpi-card .rate-value,
[id^="gilts-widget"] .rate-value,
[id^="gilts-widget"].card .rate-value,
[id^="gilts-widget"].kpi-card .rate-value {
  color: #fff !important;
  font-size: 2.5rem !important;
  font-weight: bold !important;
  transition: none !important;
}

/* Override all text colors for gilts widgets to ensure white subtext with same size as dashboard */
[id^="gilts-widget"] .small,
[id^="gilts-widget"] .text-muted,
[id^="gilts-widget"] .rate-change-1d,
[id^="gilts-widget"] .rate-change-1w,
[id^="gilts-widget"] .rate-change-1m,
[id^="gilts-widget"] .rate-change-3m,
[id^="gilts-widget"] .row.g-1.small {
  color: #ffffff !important;
  font-size: 0.75rem !important;
}

/* Ensure gilts widget backgrounds use Bootstrap dark */
[id^="gilts-widget"] {
  background-color: #212529 !important;
}

[id^="gilts-widget"] .kpi-header {
  background-color: #212529 !important;
}

[id^="gilts-widget"] .p-2 {
  background-color: #212529 !important;
}

/* Force LA Metrics trend gallery to show 3 charts per row - MAXIMUM SPECIFICITY */
#la-metrics #trendGallery .row {
  display: flex !important;
  flex-wrap: wrap !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100% !important;
}

#la-metrics #trendGallery .row .col-4 {
  flex: 0 0 33.333333% !important;
  max-width: 33.333333% !important;
  width: 33.333333% !important;
  padding-left: 15px !important;
  padding-right: 15px !important;
  box-sizing: border-box !important;
  float: none !important;
  position: relative !important;
}

/* Override any Bootstrap or other CSS */
#la-metrics #trendGallery .row .col-4:nth-child(1),
#la-metrics #trendGallery .row .col-4:nth-child(2),
#la-metrics #trendGallery .row .col-4:nth-child(3) {
  flex: 0 0 33.333333% !important;
  max-width: 33.333333% !important;
  width: 33.333333% !important;
}

/* Ensure no other CSS interferes */
#la-metrics #trendGallery .row>* {
  flex-shrink: 0 !important;
}

/* Override any JavaScript-applied inline styles for gilts widgets */
#gilts-widget-1y .rate-value[style*="color"],
#gilts-widget-2y .rate-value[style*="color"],
#gilts-widget-5y .rate-value[style*="color"],
#gilts-widget-10y .rate-value[style*="color"],
#gilts-widget-20y .rate-value[style*="color"],
#gilts-widget-50y .rate-value[style*="color"] {
  color: #fd7e14 !important;
}

button.la-tab-button[data-panel="documents"] {
  display: none !important;
}
/* Gilts page � same layout as PWLB (KPI breakpoints, chart rows at 1200px) */
.col-12:has([id^="gilts-widget"]) {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}
.col-12:has([id^="gilts-widget"]) > .row {
  display: contents;
}
.col-12:has([id^="gilts-widget"]) .col-md-4 {
  flex: 0 0 100%;
  max-width: 100%;
}
@media (min-width: 500px) {
  .col-12:has([id^="gilts-widget"]) .col-md-4 {
    flex: 0 0 calc(50% - 0.375rem);
    max-width: calc(50% - 0.375rem);
  }
}
@media (min-width: 1200px) {
  .col-12:has([id^="gilts-widget"]) .col-md-4 {
    flex: 0 0 calc(33.333333% - 0.5rem);
    max-width: calc(33.333333% - 0.5rem);
  }
}

.row-gilts-charts-1, .row-gilts-charts-2 {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}
.row-gilts-charts-1 .gilts-change-tile,
.row-gilts-charts-1 .gilts-history-tile,
.row-gilts-charts-2 .gilts-table-tile,
.row-gilts-charts-2 .gilts-yield-tile {
  flex: 0 0 100%;
  max-width: 100%;
}
@media (min-width: 1200px) {
  .row-gilts-charts-1 .gilts-change-tile,
  .row-gilts-charts-1 .gilts-history-tile,
  .row-gilts-charts-2 .gilts-table-tile,
  .row-gilts-charts-2 .gilts-yield-tile {
    flex: 0 0 calc(50% - 0.375rem);
    max-width: calc(50% - 0.375rem);
  }
}