:root {
  --white: #ffffff;
  --blue: #32B4FA;
  --blue-light: #90ACD3;
  --blue-light-2: #638FCF;
  --blue-light-3: #314B70;
  --blue-light-4: #2896D2;
  --blue-dark: #14274B;
  --blue-dark-2: #283E5C;
  --gray-light: #B8B8B8;
  --yellow: #FFC107;
  --yellow-dark: #efc63b;

  --risk-high: #ef5350;
  --risk-medium: #febf2e;
  --risk-low: #f7e72a;
  --risk-safe: #bde54e;
  --risk-none: #cfcfcf;
}



@media print {
  @page {
    margin: 1cm;
  }

  /* 在每一頁的頁尾右側加入頁碼 */
  .footer {
    position: running(footer);
  }

  /* 插入頁碼，通常結合 JavaScript 或 content 內容 */
  .page-number::after {
    content: counter(page);
  }
}

@media print {
  .wrapper {
    top: 0px;
  }

  *,
  *:before,
  *:after {
    background: transparent !important;
    color: #000 !important;
    box-shadow: none !important;
    text-shadow: none !important;
  }


  .container {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
  }

  .container,
  .main-content,
  body {
    display: block !important;
    overflow: visible !important;
    float: none !important;
    position: static !important;
  }

  body {
    background: white !important;
    background-image: none !important;
    color: black !important;
    overflow: visible !important;
  }

  .section {
    margin: 10px auto;
  }

  .header {
    top: 0px;
  }

  .container-border {
    padding: 0px 1.5%;
    border: none;
    margin: 0;
  }

  .no-print {
    display: none !important;
  }


  /*風險等級*/
  .risk-high {
    color: var(--white) !important;
    background-color: var(--risk-high) !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  .risk-high * {
    color: var(--white) !important;
  }


  .risk-medium {
    color: var(--white) !important;
    background-color: var(--risk-medium) !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  .risk-high * {
    color: var(--white) !important;
  }

  .risk-low {
    color: #333 !important;
    background-color: var(--risk-low) !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  .risk-low * {
    color: color: #333 !important;
  }

  .risk-safe {
    color: var(--white) !important;
    background-color: var(--risk-safe) !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  .risk-safe * {
    color: var(--white) !important;
  }

  .risk-none {
    color: var(--white) !important;
    background-color: var(--risk-none) !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  .risk-none * {
    color: var(--white) !important;
  }

  /*特別設定*/
  .chart-container {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
  }

  canvas {
    width: 100% !important;
    max-height: 400px !important;
    max-width: 100% !important;
    background-color: transparent !important;
  }


  .header .d-dlex {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .header a.logo {
    background-color: var(--blue-dark) !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
    border: 0;
  }

  .header .logo .logo-title {
    color: var(--white) !important;
    font-size: 1.5rem !important;

  }

  .footer .link-box {
    flex-direction: column !important;
    align-items: center !important;
  }

  .table-style02 td:first-child {
    background-color: #bed5f6 !important;

  }

  .result-area span {
    display: block;
  }

  .scan .detail-box .item {
    break-inside: avoid;
    page-break-inside: avoid;
    display: block;
  }

  .scan .detail-box .item.no-data {
    color: #eeeeee !important;
    border-bottom: 1px solid var(--gray-light);
  }

  .scan .detail-box .item.no-data * {
    color: #eeeeee !important;

  }
}