/* 全站表面規範：禁止白底與近白底，維持暖黑、霧金的連續視覺。 */
:root,
[data-bs-theme="light"],
[data-bs-theme="dark"] {
  color-scheme: dark;
  --fate-field: #0b111b;
  --fate-field-hover: #0e1622;
  --fate-field-focus: #111927;
  --fate-field-muted: #11151c;
  --fate-gold-surface: #211a11;
  --fate-gold-surface-strong: #2b2114;
  --fate-panel: #0a0f18;
  --fate-panel-raised: #101722;
  --fate-border: rgba(215, 183, 127, .27);
  --fate-text: #eee5d8;
  --fate-muted: #9299a5;
  --bs-body-bg: #060a12;
  --bs-body-bg-rgb: 6, 10, 18;
  --bs-body-color: #eee5d8;
  --bs-body-color-rgb: 238, 229, 216;
  --bs-secondary-bg: #101722;
  --bs-secondary-bg-rgb: 16, 23, 34;
  --bs-tertiary-bg: #151b25;
  --bs-tertiary-bg-rgb: 21, 27, 37;
  --bs-light-bg-subtle: #17150f;
  --bs-highlight-bg: #302515;
  --bs-highlight-color: #f1dfbd;
  --bs-border-color: rgba(215, 183, 127, .24);
  --bs-border-color-translucent: rgba(215, 183, 127, .16);
}

html,
body {
  background-color: #060a12;
}

/* 所有可輸入欄位使用一致的深色表面，包含瀏覽器預設與 Bootstrap。 */
:where(.form-control, .form-select, textarea, select,
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"])) {
  border-color: var(--fate-border) !important;
  background-color: var(--fate-field) !important;
  color: var(--fate-text) !important;
  color-scheme: dark;
  box-shadow: inset 0 1px 0 rgba(255, 244, 222, .025);
}

:where(.form-control, .form-select, textarea, select,
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"])):hover {
  border-color: rgba(215, 183, 127, .42) !important;
  background-color: var(--fate-field-hover) !important;
}

:where(.form-control, .form-select, textarea, select,
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"])):focus {
  border-color: #d8b36a !important;
  background-color: var(--fate-field-focus) !important;
  color: #fff4e1 !important;
  outline: 0;
  box-shadow: 0 0 0 3px rgba(216, 179, 106, .12) !important;
}

:where(.form-control, textarea, input)::placeholder {
  color: #777e89 !important;
  opacity: 1;
}

:where(.form-control, .form-select, textarea, select, input):disabled,
:where(.form-control, .form-select, textarea, select, input)[readonly] {
  border-color: rgba(215, 183, 127, .14) !important;
  background-color: var(--fate-field-muted) !important;
  color: #777e88 !important;
  opacity: 1;
}

select option,
select optgroup {
  background: #0b111b !important;
  color: var(--fate-text) !important;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
select:-webkit-autofill {
  -webkit-text-fill-color: var(--fate-text) !important;
  caret-color: var(--fate-text);
  box-shadow: 0 0 0 1000px var(--fate-field-focus) inset !important;
  transition: background-color 9999s ease-out 0s;
}

.input-group-text,
.form-control::file-selector-button,
.form-control::-webkit-file-upload-button {
  border-color: var(--fate-border) !important;
  background: var(--fate-gold-surface) !important;
  color: #dcc79e !important;
}

/* Bootstrap 與共用互動元件不可回退成亮色面板。 */
:where(.modal-content, .offcanvas, .dropdown-menu, .popover, .toast,
  .accordion-item, .accordion-button, .list-group-item, .card) {
  border-color: var(--fate-border) !important;
  background-color: var(--fate-panel-raised) !important;
  color: var(--fate-text) !important;
}

.accordion-button:not(.collapsed),
.dropdown-item:hover,
.dropdown-item:focus,
.list-group-item-action:hover,
.list-group-item-action:focus {
  background-color: var(--fate-gold-surface) !important;
  color: #f0dfbd !important;
}

.modal-header,
.modal-footer,
.offcanvas-header,
.card-header,
.card-footer {
  border-color: var(--fate-border) !important;
}

.table {
  --bs-table-bg: transparent;
  --bs-table-color: var(--fate-text);
  --bs-table-border-color: var(--fate-border);
  --bs-table-striped-bg: rgba(215, 183, 127, .035);
  --bs-table-striped-color: var(--fate-text);
  --bs-table-hover-bg: rgba(215, 183, 127, .075);
  --bs-table-hover-color: #fff1d8;
}

.table-light,
.table-light > :not(caption) > * > * {
  --bs-table-bg: var(--fate-gold-surface);
  --bs-table-color: #ead9b9;
  --bs-table-border-color: var(--fate-border);
}

.bg-white,
.bg-light,
.text-bg-light {
  background-color: var(--fate-panel-raised) !important;
  color: var(--fate-text) !important;
}

mark,
.mark {
  background-color: var(--fate-gold-surface-strong) !important;
  color: #f0dfbd !important;
}

/* 模組中原本刻意使用米白底的區塊，轉為霧金深面。 */
.qimen-question-field textarea.form-control,
.qimen-followup textarea,
.qimen-followup textarea:focus,
.qimen-followup textarea.is-invalid {
  border-color: rgba(216, 179, 106, .34) !important;
  background: linear-gradient(135deg, rgba(216, 179, 106, .09), rgba(11, 17, 27, .98)) !important;
  color: var(--fate-text) !important;
}

.qimen-question-field textarea.form-control:focus,
.qimen-followup textarea:focus {
  border-color: #d8b36a !important;
  background: linear-gradient(135deg, rgba(216, 179, 106, .13), rgba(14, 22, 34, .99)) !important;
}

.qimen-question-field textarea.form-control::placeholder,
.qimen-followup textarea::placeholder {
  color: #8b8376 !important;
}

.qimen-time-choice input:checked + span {
  border-color: #d8ad62 !important;
  background: linear-gradient(135deg, #3a2b18, #211a12) !important;
  color: #f0d8a8 !important;
}

.iching-actions {
  border: 1px solid rgba(216, 181, 106, .28);
  background: linear-gradient(145deg, rgba(216, 181, 106, .12), #0d131d 62%) !important;
  color: var(--fate-text) !important;
}

.iching-actions header,
.iching-actions > p {
  border-color: rgba(216, 181, 106, .2) !important;
}

.iching-actions header span,
.iching-actions > p {
  color: #9c958b !important;
}

.iching-actions li::before {
  background: var(--fate-gold-surface-strong) !important;
  color: #f1d28a !important;
}

.subscription-master > i::after,
.subscription-options label > i::after {
  background: #d8b36a !important;
}

/* 捲軸也避免出現作業系統預設的亮色軌道。 */
* {
  scrollbar-color: #655033 #090d14;
}

*::-webkit-scrollbar-track {
  background: #090d14;
}

*::-webkit-scrollbar-thumb {
  border: 2px solid #090d14;
  background: #655033;
}