/* 老店墨綠主題（2026/10/28）：預約、Barber App、老闆後台共用，接在 base.css 後面載入。
   跟官網同一套：墨綠底、奶油字、黃銅主按鈕；顏色只剩墨綠、奶油、黃銅三種，紅色只留給警示。
   做法是把 base.css 的顏色變數換成深色版，元件照舊用變數，不用每頁重寫。 */
:root {
  --paper: #222326;    /* 主底 */
  --cream: #2a2b2e;    /* 抬高一階：頁首、區塊底 */
  --white: #2e3033;    /* 卡片、輸入框、白底的地方 */
  --ink: #f5f3ef;      /* 主文字：奶油色 */
  --ink-2: #cfcfcf;
  --ink-3: #a8a8a8;
  --line: #3a3c40;
  --sage: #18191b;
  --sage-l: #1c1d20;
  --gold: #b3202a;     /* 主按鈕底、選中的底（配白字） */
  --red-text: #f47a80; /* 黑底上的紅字（連結、強調），對比 > 4.5 */
  --gold-d: #931a22;
  --brass-l: #f5f3ef;  /* 淺黃銅：英文大字、數字 */
  /* 原本的綠色強調一律改黃銅；淡綠底改成墨綠上的淡黃銅 */
  --green: var(--red-text);
  --green-d: #f2a3a3;
  --green-l: #2a1716;
  --red: #e0584f;
  --red-d: #f0948a;
  --red-l: #3a211e;
  --amber: #e2b35c;
  --amber-l: #33291a;
  --blue: #9dbde0;
  --blue-l: #1e2a35;
  --shadow: none;
  --shadow-lg: 0 10px 30px rgba(0, 0, 0, .45);
}
body { background: var(--paper); color: var(--ink); }
::selection { background: var(--ink); color: var(--paper); }


/* 按鈕：主按鈕黃銅底、墨綠字；訂位的紅色按鈕在這套主題也改黃銅（跟官網一致） */
.btn, .btn.red { background: var(--gold); border-color: var(--gold); color: #ffffff; }
.btn:hover, .btn.red:hover { background: var(--gold-d); border-color: var(--gold-d); }
.btn.ghost { background: transparent; color: var(--red-text); border-color: var(--gold); }
.btn.ghost:hover { background: var(--green-l); }
.btn.light { background: var(--white); border-color: var(--line); color: var(--ink); }
.btn.light:hover { background: var(--cream); }

/* 標籤、頭像、表單 */
.chip.gray { background: #33353a; color: var(--ink-2); }
.avatar { color: #222326; }
.tag { background: transparent; color: var(--brass-l); box-shadow: inset 0 0 0 1px var(--gold); }
.tag.solid { background: var(--gold); color: #ffffff; box-shadow: none; }
.slogan { color: var(--brass-l); }
.eyebrow { color: var(--brass-l); }
.stripe { height: 2px; background: var(--gold); }
.wall { background: var(--cream); }
.input, .select, .textarea { background: var(--white); color: var(--ink); border-color: var(--line); }
.input::placeholder, .textarea::placeholder { color: var(--ink-3); }
.input:focus, .select:focus, .textarea:focus { border-color: var(--gold); box-shadow: 0 0 0 3px rgba(179, 32, 42, .22); }
select option { background: var(--white); color: var(--ink); }

/* 原型導覽列 */
.proto-bar { background: #f5f3ef; color: #222326; }
.proto-bar a { background: rgba(34, 35, 38, .1); }
.proto-bar a:hover { background: rgba(34, 35, 38, .2); }

/* 中文標題用未來熒黑窄體特粗（變數在 base.css） */
h1, h2, h3 { font-family: var(--title); letter-spacing: .01em; }

/* LINE 的按鈕維持 LINE 綠（不要被上面的黃銅主按鈕蓋掉） */
.btn.line-btn { background: #06c755; border-color: #06c755; color: #0a2a14; }
.btn.line-btn:hover { background: #05b54d; border-color: #05b54d; }
/* 桌機上看的手機外框：外框用近黑色，不要變成奶油色粗框 */
.device { border-color: #0b0f0d; }

/* 貼紙、標籤一律擺正（2026/10/28 使用者指定：不要歪的） */
.stk, .tag, [class*="stamp"], [class*="sticker"] { transform: none !important; rotate: none !important; }

/* Logo：用原檔（2026/10/28 使用者決定改回原本的，不墊底板） */
img.logo { background: none; padding: 0; border-radius: 0; }