:root {
	  --primary: #004b7c;
	  --text-secondary: #5f6368;
	}

body {
      font-family: "Raleway", sans-serif;
    }

	.bpcenter {
		width: 100%;
		text-align: center;
		margin-bottom: 30px;
	}
	
	.chart-note {
      font-size: 0.95rem;
      color: var(--text-secondary);
      margin-top: 1rem;
      margin-bottom: 1rem;
    }

    .chart-container {
      width: 1000px;
      margin: 0 auto;
    }

	.barchartflow {
	  overflow-x: auto;
	  margin-bottom: 20px;
	}
	#barchartmin {
		min-width: 500px;
	}
	#BorrowingTable {
		margin-left: 22px;
	}
    .bottom-table {
      margin-left: 0px;
      border-collapse: collapse;
	  width: 1000px;
    }
    .bottom-table th {
      width: 60px;
	  border: 1px solid #ccc;
      padding: 2px;
      text-align: center;
	  font-size: 9px;
	  font-weight: 600;
	  background-color: #f9f9f9;
    }
	.bottom-table td {
	  width: 49.5px;
 	  border: 1px solid #ccc;
      padding: 2px;
      text-align: center;
	  font-size: 12px;
    }
    .bottom-table .label-cell {
      text-align: left;
      font-weight: bold;
      background-color: #f9f9f9;
    }
	.bottom-table tr>th:first-child {
  	  position: sticky;
  	  left: 0;
	}
    .chart-title {
      text-align: center;
      margin-bottom: 10px;
    }

	.table-container #BPTable thead tr:nth-child(2) th:nth-child(1) {
		background-color: transparent;
		z-index: 0;
	}

	.table-container #BPTable thead tr:nth-child(1) th:nth-child(1) {
		position: sticky;
		left: 0;
		background-color: #f0f7ff;
		z-index: 5;
	}

	.table-container #BPTable tbody tr th:nth-child(1) {
		position: sticky;
		left: 0;
		z-index: 10;
	}

	.table-container #BPTable tbody tr:nth-child(odd) th {
   		background-color: white !important;
		z-index: 20;
	}

	.table-container #BPTable tbody tr:nth-child(even) th {
   		background-color: #fafafa !important;
		z-index: 20;
	}
	
	.table-container #BPTable tr td:nth-child(4) {
		/*background-color: #EFEDED;*/
		background-color: transparent;
	}
	
	.table-container #BPTable tr:nth-child(2) th:nth-child(3) {
		/*background-color: #EFEDED;*/
		background-color: transparent;
	}

	
	.table-container .C1 {
		/*width: 34%;*/
		width: 46%;
	}
	
	.table-container #BPTable .C2,
	.table-container #BPTable .C3,
	.table-container #BPTable .C4,
	/*.table-container #BPTable .C6,
	.table-container #BPTable .C5,
	.table-container #BPTable .C7*/ {
		/*width: 11%;*/
		width: 18%;
	}
	
	.table-container #BPTable td {
		text-align: right;
	}

	/* Pie chart container */
	.pie-chart-container {
      width: 100%;
	  max-width: 840px;
      margin: 0 auto;
	  height: 400px;
	  margin-bottom: 15px;
    }

	.pie-container {
      background-color: #fff;
      border-radius: var(--radius-md);
      box-shadow: var(--shadow-md);
	  padding: 20px 0;
	  min-width: 340px;
    }

@media (max-width: 520px) {
	  .chart-scrollable {
        min-height: 400px;
        overflow-x: auto;
      }
	
	  .pie-chart-container {
      width: 420px;
      }
    }

	.bar-container {
      background-color: #fff;
      border-radius: var(--radius-md);
      box-shadow: var(--shadow-md);
	  padding: 20px 0 5px 20px;
	  margin-bottom: 20px;
    }
 
    .chart-title {
      text-align: center;
      font-weight: bold;
      font-size: 1.5em;
      margin-top: 10px;
    }

	.borrowing-widget {
      background-color: #f8f9fa;
      border-left: 4px solid var(--primary);
      padding: 1rem 1.5rem;
      border-radius: var(--radius-md);
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 1rem;
	  width: 100%;
	  max-width: 460px;
	  margin: auto;
	  margin-bottom: 2.5rem;
    }
    .borrowing-widget-title {
      font-size: var(--fs-base);
      font-weight: 600;
      color: var(--primary);
	  width: 50%;
	  text-align: left;
    }
    .borrowing-widget-value {
      font-size: var(--fs-lg);
      font-weight: 700;
      color: #000;
	  width: 50%;
    }

/* Further Borrowing Program responsiveness */
.donut-col-right .borrowing-widget {
      display: flex;
      align-items: flex-start;
      word-wrap: break-word;
      overflow-wrap: break-word;
    }
    .borrowing-widget-title {
      font-size: 1rem;
    }
    .borrowing-widget-value {
      font-size: 1.4rem;
    }

/* Short Term Borrowing Capacity Table */
.insights-container {
      background-color: var(--surface);
      border-radius: var(--radius-md);
      padding: 1.0rem 2.5rem 1.0rem 2.5rem; /* original only 2.5rem */
      box-shadow: var(--shadow-md);
      height: 100%;
      position: relative;
      /*z-index: 1;*/
    }
	.insights-table2 {
      width: 100%;
      border-collapse: separate;
      border-spacing: 0;
      border-radius: var(--radius-sm);
      overflow: hidden;
      box-shadow: var(--shadow-sm);
      margin-top: 1.5rem;
    }
    .insights-table2 th {
      padding: 0.75rem 1rem;
      text-align: left;
    }
    .insights-table2 td {
      padding: 0.75rem 1rem;
      text-align: center;
    }
    .insights-table2 th {
      background-color: var(--primary);
      color: var(--text-light);
      font-weight: 500;
    }
	.insights-table2 .ver {
      background-color: transparent;
      color: var(--primary);
      font-weight: 500;
	  border-bottom: 1px solid var(--divider);
    }
	.insights-table2 .verlast {
      background-color: transparent;
      color: var(--primary);
      font-weight: 500;
	  border-bottom: none;
    }
    .insights-table2 td {
      border-bottom: 1px solid var(--divider);
    }
    .insights-table2 tr:last-child th, .insights-table2 tr:last-child td {
      border-bottom: none;
    }