/* GoARbooth — สไตล์ร่วมของทุกหน้า */
:root{
  --ink:#14304a; --muted:#5d6d7e; --line:#d5dee6; --blue:#0f355e;
  --green:#0e9b6e; --red:#c0392b; --warn:#a35a12; --warnbg:#fff6e8;
  --bg:#f6f8fb; --card:#fff; --soft:#eef3f8;
}
@media(prefers-color-scheme:dark){
  :root{--ink:#e8eef4;--muted:#9fb0c0;--line:#2a3a4a;--bg:#0e1720;
        --card:#16222e;--soft:#1b2937;--warnbg:#2a2113}
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Sarabun','Leelawadee UI','Segoe UI',sans-serif;
     background:var(--bg);color:var(--ink);line-height:1.65}
a{color:var(--blue)}
@media(prefers-color-scheme:dark){a{color:#7fc6ff}}

/* แถบบนสุด */
.nav{background:var(--blue);color:#fff;padding:12px 0}
.nav .wrap{display:flex;align-items:center;gap:18px}
.nav .brand{font-weight:700;font-size:18px;color:#fff;text-decoration:none}
.nav a{color:#cfe3f5;text-decoration:none;font-size:14.5px}
.nav a:hover{color:#fff}
.nav .sp{flex:1}
.nav .who{font-size:13.5px;color:#bcd8ef}

.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
.narrow{max-width:520px}
h1{font-size:27px;margin:26px 0 4px}
h2{font-size:19px;color:var(--blue);margin-bottom:12px}
.lead{color:var(--muted);margin-bottom:22px}

.card{background:var(--card);border:1px solid var(--line);
      border-radius:12px;padding:22px;margin-bottom:16px}

label{display:block;font-size:14px;color:var(--muted);margin:14px 0 5px}
input[type=text],input[type=email],input[type=password],input[type=number],
input[type=date],select,textarea{
  width:100%;padding:10px 12px;font:inherit;border:1px solid var(--line);
  border-radius:8px;background:var(--card);color:var(--ink)}
textarea{min-height:76px;resize:vertical}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:640px){.row2{grid-template-columns:1fr}}
.cb{display:flex;align-items:center;gap:8px;margin-top:14px;font-size:14.5px}
.cb input{width:16px;height:16px}
.hint{font-size:13px;color:var(--muted);margin-top:4px}

.btn{display:inline-block;border:0;border-radius:8px;padding:11px 22px;
     font:inherit;font-weight:600;cursor:pointer;text-decoration:none;text-align:center}
.btn-primary{background:var(--blue);color:#fff}
.btn-primary:hover{background:#0b2a4a}
.btn-green{background:var(--green);color:#fff}
.btn-green:hover{background:#0c8a61}
.btn-ghost{background:transparent;color:var(--blue);border:1px solid var(--line)}
.btn.full{display:block;width:100%}
.btns{display:flex;gap:10px;margin-top:20px;flex-wrap:wrap}

.msg{border-radius:8px;padding:11px 15px;margin-bottom:14px;font-size:14.5px}
.msg.err{background:#fdecea;color:#96281b;border-left:4px solid var(--red)}
.msg.ok{background:#dff5ea;color:#0a7c5a;border-left:4px solid var(--green)}
.msg.warn{background:var(--warnbg);color:var(--warn);border-left:4px solid #e67e22}
@media(prefers-color-scheme:dark){
  .msg.err{background:#3a1d1a;color:#ffb4a8}
  .msg.ok{background:#16332a;color:#8fe3bd}
}

table{width:100%;border-collapse:collapse;font-size:14.5px}
th,td{padding:9px 10px;border-bottom:1px solid var(--line);text-align:left}
th{color:var(--blue);font-weight:700;background:var(--soft)}
td.n,th.n{text-align:right;font-variant-numeric:tabular-nums}

.pill{display:inline-block;border-radius:999px;padding:3px 12px;font-size:12.5px;font-weight:600}
.pill.wait{background:var(--warnbg);color:var(--warn)}
.pill.ok{background:#dff5ea;color:#0a7c5a}
.pill.off{background:var(--soft);color:var(--muted)}

.empty{text-align:center;color:var(--muted);padding:40px 20px}
footer{margin:44px 0 36px;text-align:center;color:var(--muted);font-size:13px}
.mono{font-family:Consolas,monospace}

/* ปุ่มบนแถบเมนูสีเข้ม — ต้องใช้สีอ่อนไม่งั้นตัวอักษรกลืนพื้น */
.nav .btn-ghost{background:transparent;color:#cfe3f5;border-color:rgba(255,255,255,.35)}
.nav .btn-ghost:hover{color:#fff;border-color:#fff}
.btn[disabled]{opacity:.45;cursor:not-allowed}