/* ===== สีของแบรนด์ (ดึงมาจากโลโก้ STADIUM.in.th) ===== */
:root{
  --brand:#0b3f72;          /* น้ำเงินกรมท่า */
  --brand-dark:#082c50;
  --brand-teal:#10a0a8;     /* ฟ้าเทอร์ควอยซ์ */
  --brand-orange:#f26a21;   /* ส้ม */
  --bs-primary:#0b3f72;
  --bs-primary-rgb:11,63,114;
  --bs-link-color:#0b3f72;
  --bs-link-color-rgb:11,63,114;
  --bs-link-hover-color:#082c50;
}
.btn-primary{
  --bs-btn-bg:var(--brand); --bs-btn-border-color:var(--brand);
  --bs-btn-hover-bg:var(--brand-dark); --bs-btn-hover-border-color:var(--brand-dark);
  --bs-btn-active-bg:var(--brand-dark); --bs-btn-active-border-color:var(--brand-dark);
  --bs-btn-disabled-bg:var(--brand); --bs-btn-disabled-border-color:var(--brand);
}
.btn-outline-primary{
  --bs-btn-color:var(--brand); --bs-btn-border-color:var(--brand);
  --bs-btn-hover-bg:var(--brand); --bs-btn-hover-border-color:var(--brand);
  --bs-btn-active-bg:var(--brand); --bs-btn-active-border-color:var(--brand);
}
.bg-primary{background-color:var(--brand)!important}
.btn-accent{
  --bs-btn-color:#fff; --bs-btn-bg:var(--brand-orange); --bs-btn-border-color:var(--brand-orange);
  --bs-btn-hover-color:#fff; --bs-btn-hover-bg:#d9591a; --bs-btn-hover-border-color:#d9591a;
  --bs-btn-active-bg:#d9591a; --bs-btn-active-border-color:#d9591a;
}
.text-primary{color:var(--brand)!important}
.badge.bg-primary{background-color:var(--brand)!important}
.list-group-item.active{background-color:var(--brand);border-color:var(--brand)}
.form-control:focus,.form-select:focus{border-color:#7ba3d0;box-shadow:0 0 0 .2rem rgba(11,63,114,.15)}
.btn-check:checked+.btn-outline-primary{background-color:var(--brand);border-color:var(--brand)}
.progress-bar{background-color:var(--brand)}
.table-primary{--bs-table-bg:#e3ecf7}
.alert-primary{--bs-alert-bg:#e8f0f9;--bs-alert-border-color:#c9dbef;--bs-alert-color:#0b3f72}
.bg-primary-subtle{background-color:#e3ecf7!important}
.text-primary-emphasis{color:var(--brand-dark)!important}

/* ===== โลโก้ ===== */
.site-navbar{border-bottom:1px solid #e6eaf0}
.site-navbar .nav-link{color:#3a4557;font-weight:500}
.site-navbar .nav-link:hover,.site-navbar .nav-link:focus{color:var(--brand)}
.site-logo{height:44px;width:auto;display:block}
.footer-logo{height:46px;width:auto}
.auth-logo{height:104px;width:auto}
@media (max-width:576px){
  .site-logo{height:34px}
  .auth-logo{height:84px}
}
body{
  font-family:'Noto Sans Thai',system-ui,-apple-system,'Segoe UI',sans-serif;
  background:#f4f6fa;
  color:#20242c;
  padding-bottom:env(safe-area-inset-bottom);
}
.navbar-brand{letter-spacing:.2px}
.card{border:0;border-radius:14px;box-shadow:0 2px 10px rgba(20,30,60,.06)}
.card-header{background:#fff;border-bottom:1px solid #eef1f6;font-weight:600;border-radius:14px 14px 0 0!important}
.table{--bs-table-bg:transparent}
.table>:not(caption)>*>*{padding:.65rem .6rem}
.badge{font-weight:500}
a{text-decoration:none}

/* ---------- Slot grid ---------- */
.slot-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(112px,1fr));
  gap:.5rem;
}
.slot{
  border:1.5px solid #d7dee9;
  border-radius:11px;
  background:#fff;
  padding:.5rem .4rem;
  text-align:center;
  cursor:pointer;
  transition:.14s;
  user-select:none;
  position:relative;
}
.slot .t{font-weight:600;font-size:.95rem;line-height:1.15}
.slot .p{font-size:.78rem;color:#6c7a90}
.slot:hover:not(.disabled){border-color:var(--brand);transform:translateY(-1px)}
.slot.selected{background:var(--brand);border-color:var(--brand);color:#fff}
.slot.selected .p{color:#dbe7ff}
.slot.disabled{cursor:not-allowed;opacity:.62}
.slot.taken{background:#ffe9e9;border-color:#f3c2c2;color:#a33}
.slot.reserved{background:#fff6e0;border-color:#f0dca5;color:#8a6d1f}
.slot.mine{background:#e3f7ea;border-color:#a8dfbc;color:#1c6b3a}
.slot.past{background:#eef0f4;border-color:#e2e5eb;color:#98a1b0}
.slot input{display:none}

/* ---------- Sport pills ---------- */
.sport-pill{
  display:inline-flex;align-items:center;gap:.35rem;
  border:1.5px solid #dde3ec;background:#fff;border-radius:999px;
  padding:.35rem .85rem;font-size:.9rem;color:#3d475a;
}
.sport-pill.active{background:var(--brand);border-color:var(--brand);color:#fff}

/* ---------- Sub navigation ---------- */
.subnav{background:#fff;border-bottom:1px solid #e7ebf2;overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch}
.subnav .nav-link{color:#48536b;font-size:.93rem;padding:.65rem .85rem;display:inline-block}
.subnav .nav-link.active{color:var(--brand);border-bottom:2.5px solid var(--brand);font-weight:600}

.stat-card{border-radius:14px;padding:1rem 1.1rem;color:#fff}
.stat-card .n{font-size:1.6rem;font-weight:700;line-height:1.1}
.stat-card .l{font-size:.85rem;opacity:.92}
.bg-g1{background:linear-gradient(135deg,#2f6cae,#0b3f72)}
.bg-g2{background:linear-gradient(135deg,#19b8bf,#0d8188)}
.bg-g3{background:linear-gradient(135deg,#ff9147,#f26a21)}
.bg-g4{background:linear-gradient(135deg,#a06bf5,#7239ce)}

.court-card img,.court-card .ph{height:120px;object-fit:cover;width:100%;
  background:linear-gradient(135deg,#dfe7f5,#c8d6ee);display:flex;align-items:center;
  justify-content:center;font-size:2.4rem;color:#5b7bb5}

.slip-thumb{max-height:70px;border-radius:8px;border:1px solid #dde3ec}
.table-responsive{border-radius:12px}

@media (max-width:576px){
  .slot-grid{grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:.4rem}
  .slot .t{font-size:.88rem}
  .slot .p{font-size:.72rem}
  h1,.h1{font-size:1.5rem}
  .card-body{padding:.9rem}
}


/* ---------- แกลเลอรีรูปภาพ/เอกสาร ---------- */
.media-thumb{width:100%;height:130px;object-fit:cover;border-radius:9px;display:flex;
  align-items:center;justify-content:center;background:#eef1f6;color:#6b7a90}
.media-doc{text-decoration:none}
.media-item{background:#fff}
.gallery-main{width:100%;max-height:420px;object-fit:cover;border-radius:14px}
.gallery-strip img{width:100%;height:86px;object-fit:cover;border-radius:9px;cursor:pointer;
  border:2px solid transparent;transition:.15s}
.gallery-strip img:hover,.gallery-strip img.active{border-color:var(--brand)}
.map-frame{width:100%;height:320px;border:0;border-radius:14px}
.avatar-lg{width:120px;height:120px;object-fit:cover;border-radius:50%;border:3px solid #fff;
  box-shadow:0 2px 10px rgba(20,30,60,.14)}
.avatar-sm{width:46px;height:46px;object-fit:cover;border-radius:50%}
.avatar-ph{display:flex;align-items:center;justify-content:center;background:#e3ecf7;color:var(--brand)}
.court-hero{width:100%;height:260px;object-fit:cover;border-radius:14px}
@media (max-width:576px){
  .gallery-main{max-height:250px}
  .court-hero{height:180px}
  .map-frame{height:250px}
}