/* You can add global styles to this file, and also import other style files */

/*@import "bootstrap/scss/bootstrap";
@import "bootstrap-icons/font/bootstrap-icons";*/

// 3. 自定義全域樣式 (讓 Sidebar 滿版)
html, body {
  height: 100%;
  // 修正捲軸在 Dark mode 的顏色
  &[data-bs-theme="dark"] {
    color-scheme: dark;
  }
}

// Sidebar 固定寬度設定 (可依需求調整)
.sidebar {
  width: 250px;
  min-height: 100vh;
  transition: all 0.3s;

  @include media-breakpoint-down(md) {
    width: 100%; // 手機版變成全寬或隱藏
    min-height: auto;
  }
}

.main-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  height: 100vh;
  overflow-y: auto; // 內容區域獨立捲動
}

input[type="checkbox"]{

  /* 1. Remove native styles */
  -webkit-appearance: none;
  appearance: none;

  width: 25px !important;
  height: 25px !important;

  border: 2px solid #555; /* Your custom border */
  border-radius: 4px;      /* Optional: rounded corners */
  outline: none;
  cursor: pointer;

  /* Layout for the checkmark */
  display: inline-flex;
  justify-content: center;
  align-items: center;
  margin-right: 8px;
  vertical-align: middle;
  background-color: white;
  transition: all 0.2s ease;
}

$toast-max-width: 500px;
$toast-font-size: 1.5rem;