/* 榮陞大興 — 深色主題（覆蓋層，不動主程式 bundle）
   設計語彙：近黑底 + 碳灰卡片 + Škoda 墨綠點綴，與黑色機械翻牌倒數一體成形。 */

:root { color-scheme: dark; }

/* Tailwind preflight 預設邊框色是 #e5e7eb（淺灰）；深底改為淡白線。
   只用元素選擇器，特定的 .border-* 顏色類別仍會覆蓋它。 */
*, ::before, ::after { border-color: rgba(255,255,255,.10); }
hr { border-color: rgba(255,255,255,.08); }

/* ── 基底 ── */
html, body { background: #0c0e0d !important; color: #e8ebe9; }

/* ── 面（卡片/區塊）── */
.bg-white   { background-color: #171918 !important; }
.bg-gray-50 { background-color: #121413 !important; }
.bg-gray-100{ background-color: #1d201e !important; }
.bg-gray-200{ background-color: #262a28 !important; }
.bg-gray-300{ background-color: #303532 !important; }
.bg-gray-400{ background-color: #3c423f !important; }
.bg-slate-50 { background-color: #14171a !important; }
.bg-slate-100{ background-color: #1c2024 !important; }
.bg-gray-800{ background-color: #333a36 !important; }
.bg-gray-900{ background-color: #2a2f2c !important; }

/* ── 文字 ── */
.text-black,
.text-gray-900{ color: #f3f5f4 !important; }
.text-gray-800{ color: #e6e9e7 !important; }
.text-gray-700{ color: #d0d5d2 !important; }
.text-gray-600{ color: #aab2ad !important; }
.text-gray-500{ color: #9aa49d !important; }
.text-gray-400{ color: #8a948d !important; }
.text-gray-300{ color: #6f7973 !important; }
.text-slate-600{ color: #a7b2bd !important; }
.text-slate-500{ color: #94a0ab !important; }

/* ── 品牌綠（深底上提高明度）── */
.text-brand, .hover\:text-brand:hover { color: #58c29a !important; }
.text-\[\#0E4D3A\] { color: #58c29a !important; }
.border-brand, .hover\:border-brand:hover { border-color: #2e9b76 !important; }
.divide-brand > :not([hidden]) ~ :not([hidden]) { border-color: #2e9b76 !important; }
.ring-\[\#0E4D3A\] { --tw-ring-color: #2e9b76 !important; }
.border-\[\#0E4D3A\] { border-color: #2e9b76 !important; }
.bg-brand, .hover\:bg-brand:hover { background-color: #11604a !important; }

/* ── 邊框/分隔線 ── */
.border-gray-50 { border-color: rgba(255,255,255,.05) !important; }
.border-gray-100{ border-color: rgba(255,255,255,.07) !important; }
.border-gray-200{ border-color: rgba(255,255,255,.10) !important; }
.border-gray-300{ border-color: rgba(255,255,255,.16) !important; }
.divide-y > :not([hidden]) ~ :not([hidden]) { border-color: rgba(255,255,255,.08); }

/* ── 彩色提示底（淡彩 → 深彩染）── */
.bg-red-50  { background-color: #2a1413 !important; }
.bg-red-100 { background-color: #391b19 !important; }
.bg-rose-50 { background-color: #2a1318 !important; }
.bg-rose-100{ background-color: #3a1a21 !important; }
.bg-amber-50 { background-color: #2b2310 !important; }
.bg-amber-100{ background-color: #342a13 !important; }
.bg-yellow-100{ background-color: #332b10 !important; }
.bg-green-50, .hover\:bg-green-50:hover { background-color: #11271f !important; }
.bg-green-100{ background-color: #173427 !important; }
.bg-blue-50  { background-color: #10202e !important; }
.bg-blue-100 { background-color: #16293c !important; }
.bg-indigo-100{ background-color: #1f2440 !important; }

.text-red-600, .text-red-500 { color: #f08a80 !important; }
.text-red-400 { color: #e8978f !important; }
.text-rose-700, .text-rose-600, .text-rose-500 { color: #f190a4 !important; }
.text-green-700, .text-green-600 { color: #6fd0a8 !important; }
.border-red-100 { border-color: #4a2522 !important; }
.border-red-200 { border-color: #5b2d29 !important; }
.border-green-100{ border-color: #1d4534 !important; }
.border-green-200{ border-color: #265842 !important; }

/* amber/yellow/blue/indigo 文字常見階 */
[class*="text-amber-7"], [class*="text-amber-8"], [class*="text-yellow-7"], [class*="text-yellow-8"] { color: #e8c477 !important; }
[class*="text-blue-6"], [class*="text-blue-7"] { color: #7ab5ef !important; }
[class*="text-indigo-6"], [class*="text-indigo-7"] { color: #a3b0f5 !important; }

/* ── 帶透明度的淺色面 ── */
.bg-white\/95 { background-color: rgba(23,25,24,.95) !important; }
.bg-gray-50\/50 { background-color: rgba(255,255,255,.05) !important; }
.bg-amber-50\/60 { background-color: rgba(43,35,16,.7) !important; }
.bg-red-50\/40 { background-color: rgba(42,20,19,.55) !important; }
.bg-brand\/5  { background-color: rgba(46,155,118,.08) !important; }
.bg-brand\/10 { background-color: rgba(46,155,118,.14) !important; }
.bg-brand\/80 { background-color: rgba(17,96,74,.85) !important; }
.bg-gray-900\/95 { background-color: rgba(18,20,19,.95) !important; }

/* ── inline style 淺色背景（屬性選擇器強制覆蓋）── */
[style*="rgb(238, 241, 245)"] { background-color: #20242a !important; }
[style*="rgb(231, 240, 236)"] { background-color: rgba(46,155,118,.12) !important; }
[style*="rgb(231, 237, 251)"] { background-color: #1d2742 !important; }
[style*="rgb(251, 243, 214)"] { background-color: #332b10 !important; }
[style*="rgb(254, 249, 195)"] { background-color: #332b10 !important; }
[style*="rgb(224, 231, 255)"] { background-color: #232a4d !important; }
[style*="background: rgb(255, 255, 255)"],
[style*="background-color: rgb(255, 255, 255)"],
[style*="background:#fff"], [style*="background: #fff"],
[style*="background-color:#fff"], [style*="background-color: #fff"] { background-color: #171918 !important; }

/* ── inline style 深色文字（深底上看不清，屬性選擇器提亮）── */
[style*="color: rgb(14, 77, 58)"]  { color: #58c29a !important; } /* 品牌綠字 */
[style*="color: rgb(55, 48, 163)"] { color: #aab4ff !important; } /* 晚班/靛藍 */
[style*="color: rgb(133, 77, 14)"] { color: #e8c477 !important; } /* 早班/琥珀 */
[style*="color: rgb(122, 92, 0)"]  { color: #e8c477 !important; } /* 留資料 */
[style*="color: rgb(29, 78, 216)"] { color: #8ab4f8 !important; } /* 訊息/藍 */
[style*="color: rgb(71, 85, 105)"] { color: #a7b2bd !important; } /* slate-600 */

/* 試乘時間軸「其他人」灰條：原 slate-400 淺灰配白字看不清 → 深灰條 */
.bg-slate-400 { background-color: #3a4250 !important; }
[style*="background: rgb(148, 163, 184)"],
[style*="background-color: rgb(148, 163, 184)"] { background-color: #3a4250 !important; }

/* ── hover 灰階 ── */
.hover\:bg-gray-50:hover { background-color: #1d201e !important; }
.hover\:bg-white:hover   { background-color: #1f2220 !important; }

/* ── 表單控件 ── */
input, select, textarea {
  background-color: #1a1d1b !important;
  color: #eceeed !important;
  border-color: rgba(255,255,255,.14) !important;
}

/* 控件尺寸一致化：日期/時間框原生會比相鄰的下拉/文字框高 2~5px，這裡拉齊 */
input, select, textarea {
  box-sizing: border-box;
  line-height: 1.3;
  vertical-align: middle;
}
input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="month"] {
  -webkit-appearance: none;
  appearance: none;
  min-height: 0;
}
/* WebKit（iOS / LINE 內建瀏覽器）date 內部值會帶 margin 撐高 → 歸零 */
input::-webkit-date-and-time-value { margin: 0; line-height: 1.3; }
input::-webkit-datetime-edit { padding: 0; }
input::-webkit-datetime-edit-fields-wrapper { padding: 0; }
/* 小型工具列控件（text-xs）日期框與下拉鎖同高，徹底對齊 */
input[class*="text-xs"], select[class*="text-xs"] { height: 28px !important; }
input[type="date"]::-webkit-calendar-picker-indicator,
input[type="time"]::-webkit-calendar-picker-indicator {
  margin: 0; padding: 0;
  filter: invert(.7); /* 深底上的小日曆圖示改亮 */
}
input::placeholder, textarea::placeholder { color: #6f7973 !important; }
input[type="checkbox"], input[type="radio"] { accent-color: #2e9b76; }

/* ── 品牌字「榮陞大興」：香檳金屬漸層 + 光影 ── */
header span.font-bold.text-brand {
  background: linear-gradient(
    132deg,
    #fffef9 0%,
    #f0ead8 16%,
    #cdc4aa 34%,
    #9a9077 48%,
    #dbd4bf 62%,
    #f7f3e6 78%,
    #b6ad94 100%
  );
  background-size: 220% 220%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 1px 1px rgba(0, 0, 0, .65)) drop-shadow(0 0 10px rgba(255, 248, 220, .10));
  letter-spacing: .06em;
  font-weight: 800 !important;
  animation: rsMetalSheen 7s ease-in-out infinite alternate;
}
@keyframes rsMetalSheen {
  from { background-position: 0% 30%; }
  to   { background-position: 100% 70%; }
}

/* ── 搜尋鈕：手機放大成可按的膠囊（原本 18×14px）── */
@media (max-width: 767px) {
  /* 小圓鈕 + CSS 畫的放大鏡（不佔空間、好按） */
  header button.shrink-0.border.rounded-lg {
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    min-height: 38px;
    padding: 0 !important;
    border-radius: 999px !important;
    position: relative;
    font-size: 0 !important;
  }
  header button.shrink-0.border.rounded-lg::before {
    content: "";
    position: absolute;
    left: 10px;
    top: 9px;
    width: 13px;
    height: 13px;
    border: 2px solid #9aa49d;
    border-radius: 50%;
  }
  header button.shrink-0.border.rounded-lg::after {
    content: "";
    position: absolute;
    left: 22px;
    top: 22px;
    width: 8px;
    height: 2.5px;
    background: #9aa49d;
    border-radius: 2px;
    transform: rotate(45deg);
    transform-origin: left center;
  }
}

/* ── 手機底部選單：放大觸控目標（原本僅 29px 高、12.5px 字）── */
@media (max-width: 767px) {
  nav.fixed.bottom-0 {
    padding-bottom: env(safe-area-inset-bottom);
  }
  nav.fixed.bottom-0 a,
  nav.fixed.bottom-0 button {
    font-size: 14.5px !important;
    min-height: 52px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    letter-spacing: .02em;
  }
  /* 底欄變高 → 內容底部留空，避免被蓋住 */
  main { padding-bottom: 92px !important; }
}

/* ── 快速建客圓鈕：立體墨綠鈕面 + 幾何純黑「+」（原 + 號遭去emoji誤刪）── */
button.fixed.rounded-full.bg-brand {
  background: radial-gradient(circle at 30% 26%, #36a47c, #11604a 72%) !important;
  box-shadow:
    0 10px 26px rgba(0, 0, 0, .5),
    inset 0 1px 0 rgba(255, 255, 255, .28),
    inset 0 -3px 6px rgba(0, 0, 0, .28) !important;
}
button.fixed.rounded-full.bg-brand::before,
button.fixed.rounded-full.bg-brand::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background: #0b0d0c;
  border-radius: 3px;
  box-shadow: 0 1px 1px rgba(255, 255, 255, .22);
}
button.fixed.rounded-full.bg-brand::before { width: 24px; height: 4.5px; }
button.fixed.rounded-full.bg-brand::after  { width: 4.5px; height: 24px; }

/* ── 隱藏各頁標題下的說明文字（依需求：所有抬頭下的說明先取消）── */
main p[class*="text-gray-400"]:not(:has(input,select,button,textarea,a)),
main div[class*="text-gray-400"][class*="text-xs"]:not(:has(input,select,button,textarea,a)),
main div[class*="text-gray-400"][class*="text-[11px]"]:not(:has(input,select,button,textarea,a)),
main p[class*="text-gray-500"][class*="text-xs"]:not(:has(input,select,button,textarea,a)) {
  display: none !important;
}

/* ── 試乘「使用中」區塊縮小（比照今日頁的輕量呈現）── */
main section[class*="border-red-200"][class*="bg-red-50"] {
  border-width: 1px !important;
  border-radius: 12px !important;
  font-size: 12px;
}
main section[class*="border-red-200"][class*="bg-red-50"] > * { padding-top: 6px !important; padding-bottom: 6px !important; }

/* ── 陰影調暗（深底上白陰影會發灰）── */
.shadow, .shadow-sm, .shadow-md, .shadow-lg,
.hover\:shadow-sm:hover, .hover\:shadow-md:hover {
  --tw-shadow-color: rgba(0,0,0,.55);
  --tw-shadow: var(--tw-shadow-colored);
}