.tippy-box {
    z-index: 9999; /* 確保這個值足夠高，以覆蓋頁面上的其他元素 */
  }
  #chart {
       /* 這個值需要比 tippy-box 的 z-index 還要高 */
  }

  .text-blue-500 {
      --tw-text-opacity: 1;
      color: blue;
  }
  .bg-red-200 {
      --tw-bg-opacity: 1;
      background-color: rgb(254 202 202 / var(--tw-bg-opacity));
  }
  .bg-yellow-200 {
      --tw-bg-opacity: 1;
      background-color: rgb(254 240 138 / var(--tw-bg-opacity));
  }
  .bg-green-200 {
      --tw-bg-opacity: 1;
      background-color: rgb(187 247 208 / var(--tw-bg-opacity));
  }
    #institutionName {
        border: 1px solid #ebedf2;
        font-family: "ubuntu-regular", sans-serif;
        font-size: 1.3rem;
    }
    .content-wrapper {
        padding: 0.5rem 0.5rem !important;
    }
    .row {
    --bs-gutter-x: 0 px;
    justify-content: center;
    }
    .col-3 {
        width: 30%;
        border-radius: 10px;
        border: 1px solid #ddd;
        border-radius: 10px;
        box-shadow: 0 4px 8px rgba(0,0,0,0.1);
        position: relative;
        overflow: hidden;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        margin-bottom: 5px;
        margin-right: 5px;
    }
    .card-title {
        margin-bottom: 0.5rem;
        font-size: 1rem;
    }
    .card-value {
        font-size: 2rem;
        line-height: 1;
    }
    .card-passed {
        color: #198754;
    }
    .card-vulnerable {
        color: #fd7e14;
    }
    .card-Low {
        color: #198754;
    }
    .card-Medium {
        color: #fd7e14;
    }
    .card-High {
        color: red;
    }
    .card .card-body {
        padding: 3px 3px !important;
    }



    /* 手機裝置時的圖標大小 */
    @media (max-width: 768px) {
      .card-value {
          font-size: 1rem;
          line-height: 1;
      }
      .card-text:last-child {
          margin-bottom: 0;
          font-size: 0.8rem;
      }
    }
    table.dataTable.no-footer {
        width: 100% !important;
    }
	.tippy-box[data-theme~='white-theme'] {
			background-color: white;
			color: black;
			border: 1px solid lightgrey; /* Optional: if you want a border around the tooltip */
			z-index: 9999; /* 自定義主題或類的 z-index */
    }
    .border-collapse {
      border-collapse: collapse;
    }

    .border-inner {
      border-left: 1px solid black;
      border-right: 1px solid black;
    }

    .border-transparent {
      border-color: transparent;
    }
    .align-left {
      float: left; /* 將「中位數」文字對齊到左邊 */
    }

    .align-right {
      float: right; /* 將「兩倍中位數」文字對齊到右邊 */
    }

    .border-inner {
      position: relative; /* 為了使用絕對定位的子元素 */
    }

    .border-inner span {
      position: absolute;
      width: 50%; /* 將父元素的寬度平分 */
    }

    .border-inner .align-left {
      left: 0; /* 對齊到父元素的左側 */
    }

    .border-inner .align-right {
      right: 0; /* 對齊到父元素的右側 */
    }
    .table-centered {
      margin-left: auto;
      margin-right: auto;
      display: block;
    }
    tfoot th, tfoot td {
      padding: 0px;
    }
    #expensesDataViewResponseTextContent table tbody tr td:first-child {
      width: 33%;
      text-align: right;
      padding-right: 10px;
    }

    #expensesDataViewResponseTextContent table tbody tr td:last-child {
      width: 33%;
      text-align: left;
      padding-left: 10px;
    }

    #expensesDataViewResponseTextContent table tbody tr td:nth-child(2) {
      width: 34%;
    }
    .form-group {
        padding:2.5rem;
    }