@charset "utf-8";
/* CSS Document */

/* 屬於藥劑部外語衛教樣式 */
.card, .tab-content {
    overflow: visible !important;
}
/* 基本設定：tab 捲動與單行排列 */
.nav-tabs {
    display: flex;
    flex-wrap: nowrap !important; /* 禁止換行 */
    white-space: nowrap;          /* 禁止文字換行 */
    overflow: hidden;             /* 超出部分隱藏，交由 JS 收合到選單 */
    justify-content: center;      /* 桌機置中 */
    padding-right: 80px;          /* 預留 dropdown 空間 */
}

/* 桌機：置中對齊 */
@media (min-width: 992px) {
    .nav-tabs {
        justify-content: center;
    }
}

/* 平板與手機：靠左對齊 */
@media (max-width: 991.98px) {
    .nav-tabs {
        justify-content: flex-start;
    }
}

/* Tab 預設狀態 */
.nav-tabs .nav-link {
    color: #555;                  /* 預設文字顏色 */
    background-color: transparent; /* 預設背景透明 */
    border: none;                 /* 移除預設邊框 */
    transition: all 0.3s ease;    /* 平滑過渡效果 */
    font-weight: 500;
    padding: 10px 20px;
}

/* 滑鼠懸停 (hover) 效果 */
.nav-tabs .nav-link:hover {
    color: #1976d2;               /* 文字顏色 (藍色) */
    background-color: #f1f7ff;    /* 淺藍背景 */
    border-radius: 5px 5px 0 0;   /* 上方圓角，與選取狀態一致 */
    text-decoration: none;        /* 移除底線 */
}

/* 點擊 (active) 狀態 */
.nav-tabs .nav-link.active,
.nav-tabs .nav-link:active {
    color: #1976d2;                  /* 文字改為白色 */
    background-color: #dfedff;    /* 背景藍色 */
    border-radius: 5px 5px 0 0;   /* 上方圓角 */
    font-weight: 600;
    box-shadow: 0 -2px 6px rgba(0, 123, 255, 0.2); /* 上方陰影 */
}
    
.nav-tabs .dropdown .dropdown-menu {
    position: absolute !important;
    top: 100% !important;  /* 貼齊選單按鈕下方 */
    left: auto !important;
    right: 0 !important;
    transform: none !important;
    z-index: 9999;
}
/* dropdown 選單樣式 */
.nav-tabs .dropdown .dropdown-menu {
    top: 100% !important;        /* 緊貼按鈕下方 */
    right: 0 !important;         /* 靠右對齊 */
    left: auto !important;       /* 取消左定位 */
    transform: none !important;  /* 移除 Bootstrap 預設 transform 偏移 */
    position: absolute !important;
    z-index: 9999;
}
.dropdown-item.active, .dropdown-item:active {
    color: #fff;
    text-decoration: none;
    background-color: #1976d2;
}
/* 選單 dropdown 絕對定位在右側 */
.nav-tabs-wrapper {
    position: relative;
}
.nav-tabs .dropdown {
    position: absolute;
    top: 0;
    right: 0;
}

/* 統一所有外語影片表格的欄位寬度 */
table.color-bordered-table {
  table-layout: fixed;
  width: 100%;
}

/* 所有儲存格文字溢出處理 */
table.color-bordered-table th,
table.color-bordered-table td {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* 編號欄 */
table.color-bordered-table th:nth-child(1),
table.color-bordered-table td:nth-child(1) {
  width: 10% !important;
  text-align: center;
}

/* 院區欄 */
table.color-bordered-table th:nth-child(2),
table.color-bordered-table td:nth-child(2) {
  width: 12% !important;
  text-align: center;
}

/* 片名欄：比照英文欄寬 */
table.color-bordered-table th:nth-child(3),
table.color-bordered-table td:nth-child(3) {
  width: 50% !important;
  text-align: center;
}

/* 語系欄 */
table.color-bordered-table th:nth-child(4),
table.color-bordered-table td:nth-child(4) {
  width: 14% !important;
  text-align: center;
}

/* 影片欄 */
table.color-bordered-table th:nth-child(5),
table.color-bordered-table td:nth-child(5) {
  width: 14% !important;
  text-align: center;
}