/*
 * 民眾前台視覺主題。色彩取自美術設計提供的「06_臺中觀光_網站」系列元件圖：
 * 奶油色底 + 白色圓角卡片 + 橘色主色按鈕 + 深藍色點綴 + 深灰紫色文字。
 * 刻意獨立成一支檔案、只在前台 _Layout.cshtml 引用，不影響後台 admin.css 的樣式。
 */

:root {
  --tc-orange: #ff8200;
  --tc-orange-dark: #e67300;
  --tc-blue: #00559c;
  --tc-text: #504650;
  --tc-bg: #fdefd3;
  --tc-bg-soft: #fff6e6;
  --tc-border: #cabfc3;
}

body {
  background-color: var(--tc-bg);
  color: var(--tc-text);
}

h1, h2, h3, h4, h5, h6,
.card-title {
  color: var(--tc-text);
  font-weight: 700;
}

a {
  color: var(--tc-blue);
}
a:hover {
  color: var(--tc-orange);
}

.navbar {
  background-color: #fff !important;
}
.navbar-brand {
  color: var(--tc-text) !important;
  font-weight: 700;
}
.nav-link.text-dark {
  color: var(--tc-text) !important;
}

.footer {
  background-color: transparent;
  color: var(--tc-text);
}

/* 卡片：白底、大圓角、無邊框，比照設計稿的圓角矩形容器 */
.card {
  background-color: #fff;
  border: none;
  border-radius: 1.5rem;
  color: var(--tc-text);
}

/* 主要按鈕：橘色圓角膠囊，白字粗體 */
.btn-primary {
  background-color: var(--tc-orange);
  border-color: var(--tc-orange);
  border-radius: 50rem;
  font-weight: 700;
  padding: 0.6rem 1.75rem;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  background-color: var(--tc-orange-dark) !important;
  border-color: var(--tc-orange-dark) !important;
}

.btn-outline-secondary,
.btn-outline-danger {
  border-radius: 50rem;
  font-weight: 700;
}

.btn-link.nav-link {
  color: var(--tc-text) !important;
}

/* 表單輸入：圓角膠囊造型比照設計稿的輸入框 */
.form-control,
.form-select {
  border-radius: 50rem;
  border: 1.5px solid var(--tc-border);
  padding: 0.6rem 1.25rem;
  color: var(--tc-text);
}
.form-control:focus,
.form-select:focus {
  border-color: var(--tc-orange);
  box-shadow: 0 0 0 0.2rem rgba(255, 130, 0, 0.15);
}

/* 檔案上傳、多行文字這類欄位維持較小圓角，膠囊造型不適合 */
.form-control[type="file"],
textarea.form-control {
  border-radius: 1rem;
}

.form-label {
  color: var(--tc-text);
  font-weight: 700;
}

.form-check-input:checked {
  background-color: var(--tc-orange);
  border-color: var(--tc-orange);
}
.form-check-input:focus {
  border-color: var(--tc-orange);
  box-shadow: 0 0 0 0.2rem rgba(255, 130, 0, 0.15);
}