@charset "UTF-8";

/* ============================================================
   表單頁面公版（Join.cshtml 為參照範例，之後類似的表單頁面沿用這組 class）
   ============================================================ */
.form-page-label { flex: 0 0 100%; max-width: 100%; }
@media (min-width: 576px) {
  .form-page-label { flex: 0 0 170px; max-width: 170px; }
}
.form-page-submit { width: 200px; }
.form-page-section-title { font-size: 1.2rem; border-bottom-color: #555 !important; }
.pwd-field { max-width: 300px; }

/* ============================================================
   Join 註冊表單專屬
   ============================================================ */
#academia-sub {
  background: var(--vlsi-surface);
  border-radius: 8px;
  padding: .3rem .8rem;
  opacity: 0;
  transform: translateX(-6px);
  transition: opacity .25s ease, transform .25s ease;
}
#academia-sub.is-visible { opacity: 1; transform: translateX(0); }

/* ============================================================
   登入頁表單
   ============================================================ */
.login-card {
  padding: clamp(1.6rem, 3vw, 2.6rem); max-width: 520px; margin-inline: auto;
}
.login-single { width: 100%; }
.login-grid { display: grid; grid-template-columns: 1.35fr 1fr; gap: clamp(1.6rem, 4vw, 3rem); align-items: start; }
.login-grid > .login-aside { border-left: 1px solid var(--vlsi-border); padding-left: clamp(1.6rem, 4vw, 3rem); }
@media (max-width: 720px){
  .login-grid { grid-template-columns: 1fr; gap: 1.8rem; }
  .login-grid > .login-aside { border-left: 0; border-top: 1px solid var(--vlsi-border); padding-left: 0; padding-top: 1.8rem; }
}
.login-heading { font-size: 28px; font-weight: 700; color: var(--vlsi-heading); margin: 0 0 1.4rem; text-align: center; }
.login-field { position: relative; margin-bottom: 1rem; }
.login-field .form-control { padding-right: 3rem; }
.login-eye {
  position: absolute; top: 50%; right: .6rem; transform: translateY(-50%);
  width: 34px; height: 34px; display: grid; place-items: center;
  background: none; border: 0; cursor: pointer; color: #6b7688;
}
.login-eye:hover, .login-eye.is-on { color: var(--vlsi-primary); }
.login-eye svg { width: 20px; height: 20px; }
.login-captcha-row { display: flex; align-items: center; gap: .6rem; margin-bottom: 1.4rem; }
.login-captcha-row .form-control { flex: 1 1 auto; padding-right: 1rem; }
.login-captcha {
  flex: 0 0 auto; display: grid; place-items: center; height: 48px; min-width: 96px; padding: 0 .6rem;
  font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size: 20px; font-weight: 700;
  letter-spacing: .18em; color: #3a3f6b; background: repeating-linear-gradient(45deg, #eef0f5 0 6px, #e4e7ef 6px 12px);
  border-radius: 6px; user-select: none;
}
.login-refresh {
  flex: 0 0 auto; width: 48px; height: 48px; display: grid; place-items: center;
  background: #fff;  cursor: pointer; color: var(--vlsi-text);
  transition: border-color .18s, color .18s;
}
.login-refresh:hover { border-color: var(--vlsi-primary); color: var(--vlsi-primary); }
.login-refresh svg { width: 20px; height: 20px; }
.login-actions { display: flex; justify-content: flex-end; }
.login-submit { width: 100%; padding-block: .7rem; font-size: 16px; }
.login-join-block { margin-top: 1.6rem; padding-top: 1.6rem; border-top: 1px solid var(--vlsi-border); }
.login-join { width: 100%; padding-block: .7rem; font-size: 16px; }
.login-join-block .login-note { margin: 1rem 0 0; }
.login-forgot-row { margin: .9rem 0 0; text-align: center; }
.login-back-row { margin: .9rem 0 0; text-align: left; }
.login-note { color: var(--vlsi-text-muted); font-size: 16px; line-height: 1.6; margin: 1.1rem 0; }
.login-forgot { border-radius: 999px; }
.section--header-bg { background: var(--vlsi-surface); }
.login-captcha-wrap { margin-bottom: 1.4rem; }
.login-captcha-wrap .login-captcha-row { margin-bottom: 0; }

/* ============================================================
   Session View - Page Contents 側邊選單
   ============================================================ */
#sessionViewIndex {
  position: sticky;
  top: 84px; /* header-nav（sticky 導覽列）高度 + 間距 */
}
#sessionViewIndex .card:last-child {
  margin-bottom: 0 !important;
}
#sessionViewIndex .card a {
  display: block;
  color: var(--vlsi-heading);
  text-decoration: none;
  font-weight: 600;
}
#sessionViewIndex .card:hover,
#sessionViewIndex .card.active {
  background: #dcefff;
}

/* Session View - 手機版 Page Contents 下拉選單：圓角裁切內容 + 陰影 */
#sessionViewIndexMobile {
  overflow: hidden;
  border-radius: var(--vlsi-radius);
  box-shadow: 0 24px 60px -34px rgba(15,27,51,.35);
}

/* Session View - 手機版 Page Contents 下拉按鈕：捲動置頂 */
#sessionViewTocToggle {
  position: sticky;
  top: 84px; /* header-nav（sticky 導覽列）高度 + 間距 */
  z-index: 10;
}

/* Session View - 手機版 Page Contents 下拉按鈕：白底，hover/focus 不變 */
#sessionViewTocToggle > .btn,
#sessionViewTocToggle > .btn:hover,
#sessionViewTocToggle > .btn:focus,
#sessionViewTocToggle > .btn:active,
#sessionViewTocToggle.show > .btn {
  background-color: #fff;
  border-color: var(--vlsi-primary);
  color: var(--vlsi-primary);
  box-shadow: none;
}
#sessionViewIndex .card:hover a,
#sessionViewIndex .card.active a {
  color: var(--vlsi-heading);
}

/* Session View - 主標橫幅（貼齊 card 上緣，隨 card 圓角） */
.session-card {
  overflow: hidden;
}
.session-banner {
  background: var(--vlsi-primary-dark);
  text-align: left;
  padding: 1rem 1.5rem;
}
.session-banner-time {
  font-size: .85rem;
  font-weight: 600;
  letter-spacing: .04em;
  color: var(--vlsi-accent);
  margin-bottom: .25rem;
}
.session-banner-title {
  margin: 0;
  color: #fff;
  font-weight: 800;
  font-size: 1.25rem;
  letter-spacing: .06em;
  text-transform: uppercase;
}

/* Session View - 論文項目（代碼 badge 在左，內容在右） */
.paper-item {
  display: flex;
  align-items: flex-start;
  gap: .75rem;
}
.paper-code-badge {
  flex: 0 0 auto;
  display: inline-block;
  padding: .3rem .9rem;
  border-radius: 999px;
  background: #fff7db;
  color: var(--vlsi-heading);
  font-weight: 700;
  font-size: .85rem;
  white-space: nowrap;
}
.paper-body {
  flex: 1 1 auto;
  min-width: 0;
}
.paper-title {
  font-weight: 600;
  color: var(--vlsi-text);
}
.paper-title p {
  margin: 0;
  font-weight:bold;
  color:#222;
}
.card-body .paper-item:last-child {
  border-bottom: 0 !important;
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* Video View - 講者照片固定尺寸（Bootstrap 無對應 utility） */
.video-presenter-photo {
  width: 96px;
  height: 96px;
  object-fit: cover;
}

/* Submission Action - 列表 Paper Title 欄位（rich text）內 <p> 移除底部間距 */
table[id$="-dataTable"] td p {
  margin-bottom: 0;
}

/* Paper Title 富文字欄位（.paper-title-rich）：貼上內容常帶 inline color/background-color，強制蓋掉
   td 用於 DataTables 表格資料列（DataTables 的 className 也會套用到 th 表頭，不可套到 th，否則會蓋掉表頭底色）
   div 用於非 DataTables 的手刻表格（如 Committee/Rating），直接包在編輯器內容的 div 上 */
td.paper-title-rich, td.paper-title-rich *,
div.paper-title-rich, div.paper-title-rich * {
  color: inherit !important;
  background-color: transparent !important;
}
td.paper-title-rich p, div.paper-title-rich p {
  margin-bottom: 0;
}

/* Committee/AdjustCommittee - Reviewers 標籤外框加深 */
.reviewer-tag { border-color: var(--vlsi-text-muted) !important; }

/* Committee/Rating - Send the Result 浮動置底按鈕：寬度固定 300px、置中；
   用 sticky（而非 fixed）讓它只在內容範圍內浮動置底，捲到最後一個表格下方就停住，不會蓋到 footer */
.floating-action-bar {
  position: sticky;
  bottom: 30px;
  z-index: 1030;
  display: flex;
  justify-content: center;
}

/* Rating 頁：內容區底部間距固定 50px，讓浮動按鈕停在 footer 上方 50px 的地方 */
.rating-section { padding-bottom: 50px; }

/* 底線分頁 Tab（.tabs-underline，見 UI_DESIGN.md） */
.tabs-underline.border-bottom {
  border-bottom-width: 5px !important;
}
.tabs-underline .nav-link {
  border: 0;
  border-radius: 0;
  color: var(--vlsi-text);
  font-weight: 600;
}
.tabs-underline .nav-link.active {
  color: var(--vlsi-primary);
  background: none;
  font-weight: 700;
  position: relative;
}
.tabs-underline .nav-link.active::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -5px;
  height: 5px;
  background: var(--vlsi-primary);
}

/* Agenda - 同一時段內多筆 session 用虛線分隔 */
.agenda-session { padding-top: .5rem; padding-bottom: .75rem; }
.agenda-session:first-child { padding-top: 0; }
.agenda-session:not(:last-child) { border-bottom: 1px dashed var(--vlsi-border); }