:root{
  --brand:#0f7a4f;
  --brand-dark:#0b613b;
  --line:#e5e7eb;
  --muted:#6b7280;
  --soft:#f8fafc;
  --bg:#f4f6f7;
  --text:#111827;
  --card:#ffffff;
  --radius:14px;
  --radius-sm:10px;
  --shadow:0 10px 24px rgba(0,0,0,.05);
}

html,body{background:var(--bg)!important;color:var(--text)}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,"DejaVu Sans",sans-serif}

/* ===== SIDEBAR / TOPBAR: giữ layout cũ nhưng đồng màu brand ===== */
.sidebar{background:linear-gradient(180deg,#061b26 0%, #04131c 100%)!important}
.sidebar a{color:#fff!important;opacity:.92}
.sidebar a.active{background:rgba(255,255,255,.14)!important}
.sidebar .nav-title{color:rgba(255,255,255,.86)!important}
.sidebar .hr{border-color:rgba(255,255,255,.18)!important}
.sidebar .brand{color:#fff!important}
.sidebar .brand .dot{background:#2dd4bf!important}

/* Push bottom section */
.sidebar{display:flex;flex-direction:column}
.sidebar-spacer{flex:1}

/* Collapsible "Hệ thống (xem thêm)" */
.nav-more{margin-top:10px}
.nav-more > summary{
  list-style:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:12px;
  color:rgba(255,255,255,.92);
  font-weight:900;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
}
.nav-more > summary::-webkit-details-marker{display:none}
.nav-more[open] > summary{background:rgba(255,255,255,.10)}
.nav-more__body{margin-top:8px;display:flex;flex-direction:column;gap:6px}
.nav-more__body a{margin:0}
.mobile-topbar{background:#fff!important;border-bottom:1px solid var(--line)!important}

/* ===== CARD: chuẩn print_booking ===== */
.card{
  background:var(--card)!important;
  border:1px solid var(--line)!important;
  border-radius:var(--radius)!important;
  box-shadow:var(--shadow)!important;
  padding:10px 12px!important;
  overflow:hidden!important;
}

/* ===== HEADER XANH LÁ (auto cho mọi card có .brand / h2/h3 đầu) ===== */
.section-header,
.card > .brand:first-child{
  background:var(--brand)!important;
  color:#fff!important;
  font-weight:900!important;
  font-size:13px!important;
  letter-spacing:.3px!important;
  text-transform:uppercase!important;
  padding:8px 12px!important;
  margin:-10px -12px 10px -12px!important;
  border-radius:0!important;
}
.card > .brand:first-child .dot{display:none!important}
.card > .brand:first-child{box-shadow:none!important}

/* Nếu card mở đầu bằng h2/h3 thì biến thành header */
.card > h1:first-child,
.card > h2:first-child,
.card > h3:first-child{
  background:var(--brand)!important;
  color:#fff!important;
  font-weight:900!important;
  font-size:13px!important;
  letter-spacing:.3px!important;
  text-transform:uppercase!important;
  padding:8px 12px!important;
  margin:-10px -12px 10px -12px!important;
}

/* ===== BUTTONS ===== */
.btn{
  border:1px solid var(--line)!important;
  border-radius:10px!important;
  padding:8px 10px!important;
  font-weight:800!important;
  background:#fff!important;
  color:var(--text)!important;
  box-shadow:none!important;
}
.btn:hover{border-color:rgba(0,0,0,.18)!important}
.btn.primary,
.btnPrimary,
.btnSolid{
  background:#f2fbf6!important;
  border-color:#b7e3cf!important;
  color:var(--brand-dark)!important;
}
.btn.danger{background:#fff0f0!important;border-color:#f2b6b6!important;color:#b91c1c!important}

/* ===== INPUTS ===== */
input,select,textarea{
  border:1px solid var(--line)!important;
  border-radius:10px!important;
  background:#fff!important;
}
input:focus,select:focus,textarea:focus{outline:none!important;box-shadow:0 0 0 3px rgba(15,122,79,.12)!important;border-color:rgba(15,122,79,.45)!important}

/* ===== TABLES ===== */
table{border-collapse:separate!important;border-spacing:0!important}
.table,table{
  width:100%;
}
th{
  background:var(--soft)!important;
  border-bottom:1px solid var(--line)!important;
  font-weight:900!important;
}
td{border-bottom:1px solid rgba(0,0,0,.06)!important}

/* ===== BADGES / PILLS ===== */
.pill{background:#f2fbf6!important;border:1px solid #b7e3cf!important;color:var(--brand-dark)!important;font-weight:900!important}
.muted{color:var(--muted)!important}

/* ===== PAGE WRAP: tạo cảm giác “khung phiếu” ===== */
.main .wrap{max-width:1180px!important}

