:root {
  --primary:#0f766e;
  --primary-dark:#115e59;
  --primary-soft:#ecfdf5;
  --ink:#17263d;
  --muted:#778296;
  --line:#e5eaf0;
  --canvas:#f5f7fb;
  --sidebar:#122138;
  --bs-primary:#0f766e;
  --bs-primary-rgb:15,118,110;
  --bs-link-color:#0f766e;
  --bs-link-hover-color:#115e59;
  --bs-body-font-family:'Noto Sans Thai','Leelawadee UI',Tahoma,sans-serif;
  --bs-body-color:#334155;
  --bs-body-bg:#f5f7fb;
  --bs-border-color:#e5eaf0
}
* {
  box-sizing:border-box
}
body {
  font-size:14px;
  line-height:1.65
}
a {
  text-decoration:none
}
button,input,select,textarea {
  font:inherit
}
button:focus-visible,a:focus-visible {
  outline:3px solid #5eead4;
  outline-offset:3px
}
[hidden] {
  display:none!important
}
.icon {
  width:20px;
  height:20px;
  display:inline-block;
  flex-shrink:0;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
  vertical-align:middle
}
.btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  border-radius:10px;
  font-weight:500;
  font-size:14px;
  padding:10px 16px
}
.btn-sm {
  font-size:12px;
  padding:6px 10px;
  border-radius:8px
}
.btn-primary {
  --bs-btn-bg:var(--primary);
  --bs-btn-border-color:var(--primary);
  --bs-btn-hover-bg:var(--primary-dark);
  --bs-btn-hover-border-color:var(--primary-dark);
  --bs-btn-active-bg:var(--primary-dark);
  --bs-btn-active-border-color:var(--primary-dark);
  --bs-btn-disabled-bg:var(--primary);
  --bs-btn-disabled-border-color:var(--primary)
}
.btn-light {
  --bs-btn-bg:#f1f5f9;
  --bs-btn-border-color:#e5eaf0;
  --bs-btn-hover-bg:#e8eef4
}
.btn-outline-primary {
  --bs-btn-color:var(--primary);
  --bs-btn-border-color:#99d6cd;
  --bs-btn-hover-bg:var(--primary);
  --bs-btn-hover-border-color:var(--primary);
  --bs-btn-active-bg:var(--primary);
  --bs-btn-active-border-color:var(--primary)
}
.form-label {
  font-weight:500;
  font-size:13px;
  color:var(--ink);
  margin-bottom:7px
}
.form-control,.form-select {
  min-height:44px;
  border-radius:10px;
  border-color:#dce4ec;
  font-size:14px
}
.form-control:focus,.form-select:focus {
  border-color:#5ab4a6;
  box-shadow:0 0 0 3px #0f766e14
}
.form-control::placeholder {
  color:#9aa6b6
}
textarea.form-control {
  min-height:90px
}
.input-group-text {
  background:#fff;
  color:#8392a5;
  border-color:#dce4ec;
  border-radius:10px;
  padding:10px 13px
}
.input-group .form-control {
  border-left:0;
  padding-left:0
}
.input-group:focus-within {
  border-radius:10px;
  box-shadow:0 0 0 3px #0f766e14
}
.input-group:focus-within .input-group-text,.input-group:focus-within .form-control,.input-group:focus-within .password-toggle {
  border-color:#5ab4a6
}
.input-group .form-control:focus {
  box-shadow:none
}
.form-check-input:checked {
  background-color:var(--primary);
  border-color:var(--primary)
}
.form-check-label {
  font-size:13px
}
.form-hint {
  color:var(--muted);
  font-size:12px;
  line-height:1.7
}
.required-mark {
  color:#dc2626
}
.alert {
  font-size:13px;
  border-radius:10px;
  line-height:1.7
}
.text-muted {
  color:var(--muted)!important
}
.surface-card {
  background:#fff;
  border:1px solid var(--line);
  border-radius:14px;
  box-shadow:0 2px 7px #12213803
}
.page-title {
  font-size:25px;
  line-height:1.4;
  font-weight:600;
  color:var(--ink);
  margin:0 0 7px
}
.page-kicker {
  font-size:12px;
  font-weight:600;
  color:var(--primary)
}
.code-chip {
  display:inline-block;
  padding:3px 7px;
  background:#f1f5f9;
  border-radius:5px;
  color:#536174;
  font-family:monospace;
  font-size:12px;
  overflow-wrap:anywhere
}
.status-pill {
  display:inline-flex;
  align-items:center;
  gap:6px;
  border-radius:20px;
  padding:4px 10px;
  font-size:11px;
  line-height:1.5;
  font-weight:500;
  white-space:nowrap;
  background:#eef2f6;
  color:#607087
}
.status-dot {
  height:5px;
  width:5px;
  border-radius:50%;
  background:currentColor
}
.status-pill.active,.status-pill.approved,.status-pill.succeeded,.status-pill.ready,.status-pill.completed,.status-pill.success,.status-pill.accepted,.status-pill.used {
  color:#087f5b;
  background:#e9f8ef
}
.status-pill.pending,.status-pill.pending_approval,.status-pill.invited,.status-pill.queued {
  color:#ac720c;
  background:#fff5dd
}
.status-pill.provisioning,.status-pill.running {
  color:#2563a8;
  background:#eaf2ff
}
.status-pill.suspended,.status-pill.failed,.status-pill.failure,.status-pill.rejected {
  color:#c24748;
  background:#fff0f0
}
.status-pill.disabled,.status-pill.revoked,.status-pill.expired,.status-pill.retired,.status-pill.draft,.status-pill.maintenance {
  color:#6b7280;
  background:#eef1f5
}
/* Login and self registration */
.auth-page {
  background:radial-gradient(ellipse at 15% 10%,#e9f6f3 0,transparent 48%),radial-gradient(ellipse at 90% 85%,#eaf0fb 0,transparent 48%),#f4f7fb
}
.page-shell {
  min-height:100vh;
  display:flex;
  flex-direction:column
}
.auth-area {
  display:flex;
  justify-content:center;
  align-items:center;
  flex:1;
  padding:40px 20px
}
.auth-card {
  width:100%;
  max-width:470px;
  background:#fff;
  border:1px solid #e3e9ef;
  border-radius:22px;
  box-shadow:0 18px 54px #153b5020;
  overflow:hidden
}
.card-accent {
  height:5px;
  background:linear-gradient(90deg,#0f766e,#0ea5a1,#3b82f6)
}
.auth-card-body {
  padding:34px 36px
}
.brand-mark {
  display:inline-flex;
  justify-content:center;
  align-items:center;
  width:62px;
  height:62px;
  border-radius:18px;
  background:#ecfdf5;
  border:1px solid #d5efe6;
  color:var(--primary);
  margin:0 auto 15px
}
.brand-mark .icon {
  width:29px;
  height:29px
}
.system-label {
  display:block;
  color:var(--primary);
  font-size:11px;
  font-weight:600;
  letter-spacing:2px;
  margin-bottom:9px
}
.auth-heading {
  color:#0f172a;
  font-size:27px;
  line-height:1.4;
  font-weight:600;
  margin-bottom:9px
}
.auth-subtitle {
  font-size:13px;
  color:#64748b;
  margin:0
}
.auth-form {
  margin-top:25px
}
.auth-form .form-control,.auth-form .input-group-text,.password-toggle {
  min-height:48px
}
.password-toggle {
  color:#8392a5;
  border:1px solid #dce4ec;
  border-left:0;
  background:#fff;
  border-radius:0 10px 10px 0;
  padding:10px 12px
}
.password-toggle:hover {
  color:var(--primary);
  background:#f7fbfa
}
.auth-form .btn-primary {
  min-height:48px
}
.portal-switch {
  display:flex;
  gap:4px;
  background:#f1f5f8;
  padding:4px;
  border-radius:11px;
  margin-top:26px
}
.portal-option {
  flex:1;
  border:0;
  background:transparent;
  border-radius:8px;
  color:#64748b;
  font-size:13px;
  font-weight:500;
  padding:9px 8px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px
}
.portal-option .icon {
  width:17px;
  height:17px
}
.portal-option.active {
  background:#fff;
  color:var(--primary);
  box-shadow:0 2px 5px #12213810
}
.auth-actions {
  font-size:13px
}
.auth-footer {
  font-size:11px;
  color:#8b99aa;
  text-align:center;
  padding:4px 20px 25px
}
.auth-demo-banner {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  background:#edf5f3;
  color:#526e68;
  font-size:11px;
  border-bottom:1px solid #ddebe7;
  padding:9px 16px;
  text-align:center
}
.auth-demo-banner .icon {
  width:15px;
  height:15px
}
.demo-access {
  border-top:1px dashed #dce4ec;
  padding-top:18px;
  color:#64748b
}
.demo-quick-actions .btn {
  font-size:11px
}
.auth-card-wide {
  max-width:650px
}
.success-panel {
  text-align:center;
  padding:24px 0
}
.success-panel>.icon {
  color:var(--primary);
  width:52px;
  height:52px;
  margin-bottom:18px
}
.success-panel h2 {
  font-size:22px
}
.success-panel p {
  color:#64748b;
  font-size:13px
}
.detail-list {
  border:1px solid var(--line);
  background:#f8fafc;
  border-radius:10px;
  padding:14px;
  text-align:left;
  font-size:13px
}
.detail-list dt {
  color:var(--muted);
  font-weight:400
}
.detail-list dd {
  margin-bottom:10px
}
.detail-list dd:last-child {
  margin-bottom:0
}
/* Administration shell */
.dashboard-page {
  background:var(--canvas)
}
.sidebar {
  width:264px;
  position:fixed;
  inset:0 auto 0 0;
  background:var(--sidebar);
  color:#b4c0d1;
  z-index:1040;
  display:flex;
  flex-direction:column
}
.sidebar-brand {
  display:flex;
  gap:12px;
  align-items:center;
  padding:25px 24px 24px;
  color:white;
  border-bottom:1px solid #ffffff0c
}
.sidebar-brand .brand-mark {
  width:42px;
  height:42px;
  margin:0;
  border-radius:12px;
  background:#ffffff0d;
  border:1px solid #ffffff12;
  color:#5ad9bf
}
.sidebar-brand .brand-mark .icon {
  width:24px;
  height:24px
}
.sidebar-brand strong {
  display:block;
  font-size:17px;
  font-weight:600;
  letter-spacing:.1px
}
.sidebar-brand small {
  display:block;
  font-size:10px;
  color:#8d9daf;
  margin-top:1px
}
.sidebar-scroll {
  padding:19px 13px;
  overflow-y:auto;
  flex:1
}
.nav-group-label {
  font-size:10px;
  letter-spacing:.6px;
  color:#6c8099;
  font-weight:500;
  margin:17px 13px 9px
}
.nav-group-label:first-child {
  margin-top:0
}
.sidebar-nav {
  display:flex;
  flex-direction:column;
  gap:4px
}
.sidebar-nav a {
  display:flex;
  align-items:center;
  gap:12px;
  padding:11px 14px;
  color:#b4c0d1;
  border-radius:9px;
  position:relative;
  font-size:13px;
  font-weight:400;
  transition:background .15s,color .15s
}
.sidebar-nav a .icon {
  width:18px;
  height:18px;
  color:#8192aa
}
.sidebar-nav a:hover {
  background:#ffffff08;
  color:#fff
}
.sidebar-nav a.active {
  background:#1c4053;
  color:#fff
}
.sidebar-nav a.active .icon {
  color:#68dec4
}
.sidebar-nav a.active:before {
  content:'';
  position:absolute;
  left:0;
  top:10px;
  bottom:10px;
  width:3px;
  background:#4bd6b3;
  border-radius:0 3px 3px 0
}
.nav-count {
  margin-left:auto;
  color:#75dec7;
  font-size:10px;
  border-radius:6px;
  background:#ffffff0e;
  padding:0 6px
}
.sidebar-footer {
  padding:17px 23px;
  border-top:1px solid #ffffff0c;
  font-size:10px;
  color:#73869e;
  display:flex;
  align-items:center;
  gap:8px
}
.sidebar-footer .icon {
  width:14px;
  height:14px
}
.drawer-close {
  position:absolute;
  right:13px;
  top:17px;
  display:none;
  color:#b4c0d1;
  border:0;
  background:transparent;
  padding:8px
}
.dashboard-main {
  margin-left:264px;
  min-height:100vh
}
.topbar {
  height:74px;
  background:#fff;
  border-bottom:1px solid var(--line);
  padding:0 30px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px
}
.topbar-left {
  display:flex;
  align-items:center;
  gap:13px
}
.breadcrumb-line {
  font-size:11px;
  color:#9aa5b5;
  display:flex;
  gap:8px;
  align-items:center
}
.breadcrumb-line .icon {
  width:13px;
  height:13px
}
.breadcrumb-line span:last-child {
  color:#59677b
}
.topbar-title {
  font-size:13px;
  font-weight:500;
  color:var(--ink)
}
.menu-toggle {
  display:none;
  padding:8px;
  border:1px solid var(--line);
  border-radius:9px;
  background:#fff;
  color:#536174
}
.account-block {
  display:flex;
  align-items:center;
  gap:11px
}
.account-avatar {
  width:36px;
  height:36px;
  border-radius:11px;
  display:flex;
  justify-content:center;
  align-items:center;
  background:#e8f6f1;
  color:var(--primary);
  font-size:13px;
  font-weight:600
}
.account-meta {
  line-height:1.5
}
.account-name {
  font-size:12px;
  font-weight:500;
  color:var(--ink)
}
.account-role {
  font-size:10px;
  color:#8995a5
}
.account-divider {
  height:28px;
  width:1px;
  background:var(--line);
  margin:0 5px
}
.topbar-logout {
  color:#7b8798;
  border:0;
  background:transparent;
  padding:8px
}
.topbar-logout:hover {
  color:var(--primary)
}
.main-content {
  padding:16px 30px 26px;
  max-width:1800px;
  margin:auto
}
.page-heading {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px;
  margin:9px 0 24px
}
.page-description {
  color:var(--muted);
  font-size:12px;
  margin:0
}
.heading-actions {
  display:flex;
  align-items:center;
  gap:10px;
  flex-shrink:0
}
.scope-label {
  display:block;
  font-size:10px;
  color:var(--muted);
  margin-bottom:4px
}
.scope-select {
  min-width:180px;
  max-width:230px;
  min-height:39px;
  font-size:12px
}
.summary-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:17px;
  margin-bottom:24px
}
.summary-card {
  border:1px solid var(--line);
  border-radius:13px;
  background:#fff;
  padding:19px 20px;
  box-shadow:0 2px 5px #12213802
}
.summary-top {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:9px;
  margin-bottom:9px
}
.summary-icon {
  width:36px;
  height:36px;
  border-radius:10px;
  display:flex;
  justify-content:center;
  align-items:center;
  color:var(--primary);
  background:#ecf8f4
}
.summary-card:nth-child(2) .summary-icon {
  background:#fff6e3;
  color:#b88926
}
.summary-card:nth-child(3) .summary-icon {
  background:#eef3fe;
  color:#6084cf
}
.summary-card:nth-child(4) .summary-icon {
  background:#f1eefc;
  color:#9780c9
}
.summary-label {
  font-size:11px;
  color:#7a8799
}
.summary-value {
  font-size:29px;
  font-weight:600;
  line-height:1.2;
  letter-spacing:-.5px;
  color:#17263d
}
.summary-note {
  font-size:10px;
  color:#9aa5b5;
  margin-top:6px
}
.data-panel {
  overflow:hidden
}
.panel-heading {
  padding:21px 23px 16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px
}
.panel-title {
  font-size:15px;
  font-weight:600;
  color:var(--ink);
  margin:0
}
.result-count {
  font-size:11px;
  color:#8794a6;
  margin-top:4px
}
.panel-meta {
  display:flex;
  align-items:center;
  gap:7px;
  color:#8b99aa;
  font-size:10px
}
.demo-dot {
  height:6px;
  width:6px;
  border-radius:50%;
  background:#41ae91
}
.filter-bar {
  padding:0 23px 20px;
  display:flex;
  align-items:center;
  gap:10px
}
.filter-search {
  flex:1;
  max-width:410px
}
.filter-bar .form-control,.filter-bar .form-select,.filter-bar .input-group-text {
  min-height:40px;
  font-size:12px
}
.filter-bar .input-group-text .icon {
  width:17px;
  height:17px
}
.filter-status {
  max-width:165px
}
.filter-size {
  width:115px
}
.filter-clear {
  color:#7d899b;
  font-size:11px;
  margin-left:auto;
  border:0;
  background:transparent;
  white-space:nowrap;
  padding:8px
}
.query-notice {
  font-size:12px;
  color:#946526;
  background:#fff9e9;
  padding:9px 23px;
  border-top:1px solid #f8eed9
}
.query-notice.is-error {
  background:#fff0f0;
  color:#b74343
}
.search-feedback {
  font-size:11px;
  color:var(--muted);
  min-height:16px;
  display:flex;
  align-items:center;
  gap:7px
}
.table-viewport {
  overflow:auto
}
.stock-table {
  width:100%;
  margin:0;
  font-size:12px;
  vertical-align:middle
}
.stock-table thead th {
  font-size:10px;
  font-weight:500;
  color:#7d8ba0;
  background:#f9fbfd;
  padding:12px 23px;
  white-space:nowrap;
  border-top:1px solid #eaf0f5;
  border-bottom:1px solid #eaf0f5
}
.stock-table tbody td {
  padding:16px 23px;
  color:#526176;
  border-bottom:1px solid #f0f3f7;
  vertical-align:middle
}
.stock-table tbody tr:hover {
  background:#fcfdfd
}
.stock-table tbody tr:last-child td {
  border-bottom:0
}
.stock-table td:last-child {
  white-space:nowrap
}
.table-person {
  display:flex;
  align-items:center;
  gap:11px;
  min-width:175px
}
.person-avatar {
  width:35px;
  height:35px;
  border-radius:10px;
  flex-shrink:0;
  background:#eff6f4;
  color:#538d80;
  font-size:11px;
  font-weight:500;
  display:flex;
  align-items:center;
  justify-content:center
}
.cell-title {
  font-size:12px;
  font-weight:500;
  color:#334155
}
.cell-meta {
  font-size:10px;
  color:#95a0b1;
  margin-top:3px
}
.table-actions {
  display:flex;
  gap:6px;
  align-items:center
}
.table-action {
  font-size:10px;
  font-weight:500;
  padding:6px 8px;
  border:1px solid #e1e8ef;
  border-radius:6px;
  background:#fff;
  color:#76859a
}
.table-action:hover {
  background:#f3f7f9
}
.table-action.primary {
  border-color:#cbe8df;
  background:#f1faf6;
  color:#14816d
}
.table-action.danger {
  border-color:#f2dddd;
  background:#fff7f7;
  color:#bb6262
}
.table-action .icon {
  width:13px;
  height:13px
}
.panel-footer {
  padding:17px 23px;
  border-top:1px solid var(--line);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px
}
.page-range {
  font-size:11px;
  color:#8a98ac
}
.pagination {
  display:flex;
  gap:5px;
  margin:0
}
.pagination .page-link {
  border:1px solid #e7edf3;
  border-radius:7px!important;
  font-size:11px;
  color:#7a8ba0;
  padding:6px 11px
}
.pagination .active .page-link {
  background:var(--primary);
  border-color:var(--primary);
  color:#fff
}
.pagination .page-link:hover {
  background:#f1f6f4;
  color:var(--primary)
}
.pagination .active .page-link:hover {
  background:var(--primary);
  color:#fff
}
.empty-state {
  padding:45px 20px;
  text-align:center;
  color:#8a98ac;
  font-size:13px
}
.empty-state .icon {
  width:32px;
  height:32px;
  color:#b0bccb;
  margin-bottom:12px
}
.dashboard-footer {
  display:flex;
  justify-content:space-between;
  color:#9aa6b6;
  font-size:10px;
  margin-top:21px;
  gap:14px
}
.drawer-overlay {
  display:none
}
.mobile-close-label {
  display:none
}
.detail-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  margin-bottom:17px
}
.detail-item {
  font-size:13px;
  overflow-wrap:anywhere
}
.detail-label {
  font-size:11px;
  color:#8a98ac;
  margin-bottom:5px
}
.detail-value {
  font-size:13px;
  color:#334155
}
.detail-json {
  padding:15px;
  border-radius:10px;
  border:1px solid var(--line);
  background:#f8fafc;
  font-size:11px;
  max-height:250px;
  overflow:auto;
  white-space:pre-wrap;
  word-break:break-word
}
.permission-list {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px
}
.permission-option {
  padding:10px 12px;
  border-radius:9px;
  border:1px solid var(--line);
  background:#fbfcfd
}
.permission-option .form-check {
  margin-bottom:0
}
.modal-content {
  border:0;
  border-radius:16px;
  box-shadow:0 15px 50px #12213820
}
.modal-header {
  padding:22px 24px;
  border-bottom-color:var(--line)
}
.modal-title {
  font-weight:600;
  color:var(--ink)
}
.modal-body {
  padding:24px
}
.modal-footer {
  padding:16px 24px;
  border-top-color:var(--line)
}
.modal-notice {
  padding:12px 14px;
  background:#f1f8f6;
  border:1px solid #dfeee8;
  color:#537a6e;
  border-radius:9px;
  font-size:12px
}
.handoff-link {
  font-size:12px;
  overflow-wrap:anywhere;
  word-break:break-word
}
.timeline {
  padding-left:18px;
  border-left:2px solid #e7efe9;
  font-size:12px
}
.timeline>div {
  margin-bottom:15px
}
.stock-toast {
  background:#fff;
  border:1px solid #dbece5;
  border-left:4px solid #21a17a;
  box-shadow:0 8px 30px #12213818;
  border-radius:10px;
  display:flex;
  gap:10px;
  align-items:center;
  padding:14px 17px;
  font-size:12px;
  max-width:380px;
  margin-top:9px;
  pointer-events:auto
}
.stock-toast>.icon {
  color:#21a17a
}
.stock-toast button {
  margin-left:auto;
  border:0;
  background:transparent;
  color:#96a4b6;
  padding:0
}
.stock-toast.danger {
  border-left-color:#dc6262
}
.stock-toast.danger>.icon {
  color:#dc6262
}
.toast-container {
  z-index:1090
}
/* User account portal */
.user-shell {
  min-height:calc(100vh - 37px);
  max-width:1260px;
  margin:auto;
  display:flex;
  flex-direction:column
}
.user-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:25px 30px;
  border-bottom:1px solid var(--line);
  gap:14px
}
.user-header .brand-mark {
  width:44px;
  height:44px;
  border-radius:12px
}
.user-header .brand-mark .icon {
  width:24px;
  height:24px
}
.user-header .brand strong {
  font-size:17px;
  color:var(--ink)
}
.user-main {
  padding:34px 30px;
  flex:1
}
.user-avatar {
  width:52px;
  height:52px;
  border-radius:15px;
  background:#e8f6f1;
  color:var(--primary);
  font-size:22px;
  display:flex;
  align-items:center;
  justify-content:center
}
.user-profile-list {
  font-size:12px
}
.user-profile-list dt {
  font-weight:400;
  font-size:11px;
  color:#8795a6;
  margin-top:14px
}
.user-profile-list dd {
  margin:4px 0 0;
  overflow-wrap:anywhere
}
.membership-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px
}
.membership-card {
  border:1px solid var(--line);
  border-radius:12px;
  padding:19px;
  background:#fff;
  min-width:0
}
.membership-card h3 {
  font-size:15px;
  font-weight:600;
  color:var(--ink);
  margin:0
}
.hospital-mark {
  display:flex;
  justify-content:center;
  align-items:center;
  width:40px;
  height:40px;
  border-radius:11px;
  background:#eff8f4;
  color:var(--primary);
  flex-shrink:0
}
.membership-meta {
  font-size:12px;
  color:#8b99aa;
  margin:15px 0
}
.hospital-search {
  max-width:235px
}
.hospital-search .form-control {
  font-size:12px
}
.request-list>article,.request-list>.request-item {
  padding:16px 0;
  border-bottom:1px solid var(--line)
}
.request-list>article:first-child,.request-list>.request-item:first-child {
  padding-top:0
}
.request-list>article:last-child,.request-list>.request-item:last-child {
  padding-bottom:0;
  border:0
}
.user-footer {
  padding:15px 30px 25px;
  font-size:11px;
  text-align:center;
  color:#9aa6b6
}
@media(min-width:1600px) {
  .main-content {
    padding-left:42px;
    padding-right:42px
  }
  .topbar {
    padding:0 42px
  }
}
@media(max-width:1199.98px) {
  .main-content {
    padding-left:22px;
    padding-right:22px
  }
  .topbar {
    padding:0 22px
  }
  .summary-grid {
    gap:12px
  }
  .summary-card {
    padding:16px
  }
  .stock-table thead th,.stock-table tbody td {
    padding-left:18px;
    padding-right:18px
  }
  .scope-select {
    min-width:150px
  }
  .page-heading {
    align-items:flex-start
  }
  .heading-actions {
    padding-top:3px
  }
  .page-title {
    font-size:23px
  }
}
@media(max-width:991.98px) {
  .sidebar {
    transform:translateX(-100%);
    transition:transform .2s ease;
    box-shadow:8px 0 40px #12213818
  }
  .sidebar-open .sidebar {
    transform:translateX(0)
  }
  .sidebar-open {
    overflow:hidden
  }
  .sidebar-open .drawer-overlay {
    display:block;
    position:fixed;
    inset:0;
    background:#0b152c69;
    z-index:1035
  }
  .drawer-close,.menu-toggle {
    display:block
  }
  .dashboard-main {
    margin-left:0
  }
  .sidebar-brand {
    padding-right:45px
  }
  .topbar {
    height:68px
  }
  .page-heading {
    margin-top:8px
  }
  .membership-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
}
@media(max-width:767.98px) {
  .summary-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    margin-bottom:20px
  }
  .summary-card {
    padding:15px 16px
  }
  .summary-value {
    font-size:26px
  }
  .summary-icon {
    width:31px;
    height:31px
  }
  .summary-icon .icon {
    width:17px;
    height:17px
  }
  .page-heading {
    display:block;
    margin-bottom:19px
  }
  .heading-actions {
    justify-content:space-between;
    margin-top:15px
  }
  .scope-select {
    max-width:none;
    width:100%
  }
  .hospital-scope-control {
    flex:1
  }
  .heading-actions .btn {
    padding:9px 11px;
    font-size:12px
  }
  .heading-actions .btn-refresh-label {
    display:none
  }
  .main-content {
    padding:16px 18px 22px
  }
  .topbar {
    padding:0 18px
  }
  .topbar-title {
    display:none
  }
  .account-meta {
    display:none
  }
  .account-divider {
    margin:0
  }
  .breadcrumb-line {
    font-size:10px
  }
  .filter-bar {
    flex-wrap:wrap;
    padding:0 18px 17px;
    gap:9px
  }
  .filter-search {
    min-width:100%;
    max-width:none
  }
  .filter-status {
    flex:1;
    max-width:none
  }
  .filter-size {
    width:110px
  }
  .filter-clear {
    margin:0;
    padding-right:0;
    font-size:10px
  }
  .panel-heading {
    padding:19px 18px 15px
  }
  .panel-meta {
    font-size:9px
  }
  .panel-footer {
    padding:15px 18px
  }
  .dashboard-footer {
    font-size:9px
  }
  .user-header {
    padding:20px
  }
  .user-main {
    padding:25px 20px
  }
  .user-main .page-title {
    font-size:23px
  }
  .membership-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .user-header .brand strong {
    font-size:15px
  }
  .user-header .brand .small {
    font-size:10px
  }
  .user-header .btn-sm {
    padding:8px
  }
  .detail-grid {
    gap:15px
  }
  .modal-header,.modal-body,.modal-footer {
    padding:20px
  }
  .permission-list {
    grid-template-columns:1fr 1fr
  }
}
@media(max-width:575.98px) {
  .auth-area {
    padding:25px 15px
  }
  .auth-card-body {
    padding:27px 24px
  }
  .auth-heading {
    font-size:25px
  }
  .auth-card {
    border-radius:18px
  }
  .auth-footer {
    padding-bottom:20px;
    font-size:10px
  }
  .auth-demo-banner {
    font-size:10px;
    line-height:1.5;
    padding:8px 13px
  }
  .auth-demo-banner .icon {
    display:none
  }
  .main-content {
    padding-left:14px;
    padding-right:14px
  }
  .topbar {
    padding:0 14px;
    gap:10px
  }
  .topbar-left {
    gap:8px
  }
  .account-block {
    gap:6px
  }
  .account-avatar {
    width:32px;
    height:32px;
    font-size:12px
  }
  .account-divider {
    display:none
  }
  .breadcrumb-line>span:first-child,.breadcrumb-line>.icon {
    display:none
  }
  .page-title {
    font-size:22px
  }
  .page-description {
    font-size:11px
  }
  .panel-meta {
    display:none
  }
  .panel-title {
    font-size:14px
  }
  .filter-clear {
    margin-left:auto
  }
  .page-range {
    font-size:10px
  }
  .pagination .page-link {
    padding:5px 9px
  }
  .dashboard-footer {
    flex-direction:column;
    gap:4px
  }
  .membership-grid {
    grid-template-columns:1fr
  }
  .user-header {
    padding:17px 15px
  }
  .user-header .brand {
    gap:9px!important
  }
  .user-header .brand-mark {
    width:36px;
    height:36px;
    border-radius:10px
  }
  .user-header .brand-mark .icon {
    width:20px;
    height:20px
  }
  .user-header .btn-sm {
    font-size:11px;
    padding:7px
  }
  .user-main {
    padding:24px 15px
  }
  .user-main .surface-card {
    padding:20px!important
  }
  .hospital-search {
    max-width:none;
    width:100%
  }
  .detail-grid {
    grid-template-columns:1fr
  }
  .permission-list {
    grid-template-columns:1fr
  }
  .stock-toast {
    max-width:calc(100vw - 35px)
  }
  .auth-card-wide .auth-heading {
    font-size:23px
  }
  .modal-dialog {
    margin:14px
  }
}
@media(prefers-reduced-motion:reduce) {
  *,*:before,*:after {
    scroll-behavior:auto!important;
    transition:none!important;
    animation:none!important
  }
}
.summary-card {
  text-align:left;
  transition:border-color .15s
}
.summary-card:hover {
  border-color:#bcded5
}
.summary-value,.summary-note {
  display:block
}
.permission-option {
  display:flex;
  align-items:center;
  gap:9px;
  font-size:12px
}
.permission-option .form-check-input {
  margin-top:0
}
.summary-label {
  max-width:calc(100% - 42px)
}
:root {
  --bs-link-color-rgb:15,118,110;
  --bs-link-hover-color-rgb:17,94,89
}
.form-control,.form-select {
  background-color:#fff
}
.stock-table {
  --bs-table-bg:#fff
}
.summary-card.amber .summary-icon {
  background:#fff6e3;
  color:#b88926
}
.summary-card.green .summary-icon {
  background:#ecf8f4;
  color:var(--primary)
}
@media(max-width:575.98px) {
  .hospital-scope-control {
    min-width:0
  }
  .scope-select {
    min-width:0
  }
  .sidebar {
    box-shadow:none
  }
  .sidebar-open .sidebar {
    box-shadow:8px 0 40px #12213818
  }
}
.status-pill.processing { color:#2563a8; background:#eaf2ff; }
.status-pill.denied { color:#c24748; background:#fff0f0; }
.status-pill.cancelled { color:#6b7280; background:#eef1f5; }
.stock-table { min-width:880px; }
.mobile-table-hint { font-size:10px; color:#8897aa; margin-top:5px; }
.table-viewport:focus-visible { outline:2px solid #5ab4a6; outline-offset:-2px; }