/*
 * 只放 SPA 自己需要、舊站沒有的樣式。版面本身在 public/assets/www/css/（base.css = v2、style.css = classic，跟舊站同一份），
 * 不要把那邊的規則搬過來改 —— 兩邊會走鐘。這裡的規則兩套版面都會吃到，所以顏色寫死、不用 base.css 的變數。
 */

/* 舊站的登入視窗是 modal.js 切 inline display；這裡由 Vue 控制（base.css / style.css 起手都是 display:none） */
.authModal.is-open {
  display: block;
}

.mt-loading {
  padding: 3rem 0;
  text-align: center;
  color: #bbb;
}

.mt-error {
  padding: 2rem 0;
  text-align: center;
  color: #ff8a8a;
}

/* 表單送出後、頁面內的那一行訊息（舊站是 alert() 或整頁重新載入後的 alertMsg） */
.mt-form-msg {
  margin: 0;
  font-size: 0.9rem;
  color: #ff8a8a;
}

.mt-form-msg.ok {
  color: #79dfae;
}

/* 正中央的提示（src/composables/useToast.js）。樣式照 fh6666 的 .fh-toast */
.mt-toast {
  position: fixed;
  left: 50%;
  top: 50%;
  z-index: 2000;
  transform: translate(-50%, -50%);
  max-width: 90vw;
  padding: 1.1rem 1.8rem;
  border: 1px solid #d4af37;
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.92);
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.6);
  color: #fff;
  font-size: 1.1rem;
  text-align: center;
}

button[disabled],
a.disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

/* 註冊視窗的「手機 + 取得驗證碼」那一列（舊站的 #authModal 沒有手機欄，base.css / style.css 沒這條）。
   顏色先吃 base.css 的變數，classic 版面沒有那組變數就用後面的值 */
.authModal .sms-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: stretch;
}

.authModal .sms-row .sms-btn {
  min-height: 44px;
  padding: 0 14px;
  border: 1px solid var(--gold, #c9a24b);
  border-radius: var(--r1, 6px);
  background: transparent;
  color: var(--gold-hi, #e8c77a);
  font-weight: 700;
  font-size: 15px;
  white-space: nowrap;
  cursor: pointer;
}