:root,
[data-bs-theme="light"] {
  --bs-font-sans-serif: 'Instrument Sans', ui-sans-serif, system-ui, sans-serif;
  --bs-body-font-family: var(--bs-font-sans-serif);
  --bs-body-color: #0a0f1e;
  --bs-border-color: #e5e7eb;

  --bs-primary: #4f46e5;
  --bs-primary-rgb: 79, 70, 229;
  --bs-link-color: #4f46e5;
  --bs-link-color-rgb: 79, 70, 229;
  --bs-link-hover-color: #4338ca;
  --bs-link-hover-color-rgb: 67, 56, 202;
  --bs-focus-ring-color: rgba(79, 70, 229, 0.25);
}

[data-bs-theme="dark"] {
  --bs-body-bg: #080f1e;
  --bs-secondary-bg: #0d1728;
  --bs-body-color: #cbd5e1;
  --bs-link-color: #a5b4fc;
  --bs-link-color-rgb: 165, 180, 252;
  --bs-link-hover-color: #c7d2fe;
  --bs-link-hover-color-rgb: 199, 210, 254;
}

.btn-primary {
  --bs-btn-bg: #4f46e5;
  --bs-btn-border-color: #4f46e5;
  --bs-btn-hover-bg: #4338ca;
  --bs-btn-hover-border-color: #4338ca;
  --bs-btn-active-bg: #4338ca;
  --bs-btn-active-border-color: #4338ca;
  --bs-btn-disabled-bg: #4f46e5;
  --bs-btn-disabled-border-color: #4f46e5;
}

.btn-outline-primary {
  --bs-btn-color: #4f46e5;
  --bs-btn-border-color: #4f46e5;
  --bs-btn-hover-bg: #4f46e5;
  --bs-btn-hover-border-color: #4f46e5;
  --bs-btn-active-bg: #4338ca;
  --bs-btn-active-border-color: #4338ca;
}

.form-control:focus,
.form-select:focus {
  border-color: #4f46e5;
  box-shadow: 0 0 0 0.25rem rgba(79, 70, 229, 0.25);
}

/* ===== Top bar ===== */
.navbar {
  padding-top: 0.6rem !important;
  padding-bottom: 0.6rem !important;
  border-bottom: 1px solid var(--bs-border-color);
  background: var(--bs-body-bg);
}
.navbar .nav-link {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--bs-secondary-color);
  padding: 0.35rem 0.7rem !important;
  border-radius: 6px;
}
.navbar .nav-link:hover {
  color: var(--bs-body-color);
  background: var(--bs-tertiary-bg);
}
.navbar .nav-link.active {
  color: var(--bs-body-color);
  background: var(--bs-tertiary-bg);
}
.navbar .dropdown-toggle::after { opacity: 0.5; }

/* ===== Breadcrumb and footer ===== */
.breadcrumb { font-size: 0.82rem; margin-bottom: 1rem; }
#footer {
  border-top: 1px solid var(--bs-border-color);
  padding-top: 1rem;
  margin-top: 2rem !important;
}
#footer a { color: var(--bs-secondary-color); text-decoration: none; }
#footer a:hover { color: var(--bs-body-color); }

/* ===== Back link ===== */
.navbar .sh-back-link { margin-right: auto; }
@media (max-width: 767.98px) {
  .navbar .sh-back-link { padding-left: 0 !important; }
}

/* ===== Sharp / flat look ===== */
:root {
  --bs-border-radius: 6px;
  --bs-border-radius-sm: 4px;
  --bs-border-radius-lg: 8px;
  --bs-body-font-size: 0.9rem;
  --bs-body-line-height: 1.5;
}
[data-bs-theme="light"] {
  --bs-body-bg: #fafbfc;
  --bs-tertiary-bg: #f1f5f9;
  --bs-border-color: #e5e7eb;
}
[data-bs-theme="dark"] { --bs-border-color: rgba(255, 255, 255, 0.09); }

body { -webkit-font-smoothing: antialiased; letter-spacing: -0.003em; }
h1, h2, h3, h4, h5, h6 { font-weight: 600; letter-spacing: -0.015em; }
.shadow, .shadow-sm, .shadow-lg { box-shadow: none !important; }

.card {
  --bs-card-border-color: var(--bs-border-color);
  --bs-card-cap-bg: transparent;
  --bs-card-border-radius: 8px;
  box-shadow: none;
}
.card-header { border-bottom: 1px solid var(--bs-border-color); font-weight: 600; background: transparent; }

.btn {
  --bs-btn-border-radius: 6px;
  --bs-btn-font-weight: 500;
  --bs-btn-font-size: 0.875rem;
  --bs-btn-padding-y: 0.4rem;
  --bs-btn-padding-x: 0.85rem;
  box-shadow: none !important;
}
.form-control, .form-select { border-radius: 6px; font-size: 0.9rem; box-shadow: none; }
.form-label { font-weight: 500; font-size: 0.82rem; margin-bottom: 0.3rem; }

.table { --bs-table-hover-bg: rgba(79, 70, 229, 0.04); font-size: 0.875rem; }
.table > thead th {
  font-size: 0.72rem; font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.04em; color: var(--bs-secondary-color);
  border-bottom: 1px solid var(--bs-border-color); background: transparent;
}
.table > :not(caption) > * > * { padding: 0.65rem 0.85rem; }

.badge { font-weight: 500; border-radius: 999px; padding: 0.3em 0.65em; }
.alert { border-radius: 6px; box-shadow: none; }
.dropdown-menu, .modal-content {
  border: 1px solid var(--bs-border-color);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}
.dropdown-item { font-size: 0.875rem; border-radius: 4px; }

/* ===== Refinements ===== */
.card > .card-header,
.card .card-header {
  background-color: transparent !important;
  border-bottom: 1px solid var(--bs-border-color);
  padding: 0.85rem 1.1rem;
  font-size: 0.9rem;
  font-weight: 600;
}
.card-body { padding: 1.1rem; }

/* Showcase banner */
.alert h1, .alert h2, .alert .h1, .alert .h2 {
  font-size: 1.25rem;
  font-weight: 600;
  margin-bottom: 0.35rem;
}
.alert-primary, .alert-info {
  --bs-alert-bg: #eef2ff;
  --bs-alert-border-color: #c7d2fe;
  --bs-alert-color: #3730a3;
}

/* Secondary dark buttons: neutral outline style */
.btn-dark {
  --bs-btn-bg: transparent;
  --bs-btn-color: var(--bs-body-color);
  --bs-btn-border-color: var(--bs-border-color);
  --bs-btn-hover-bg: var(--bs-tertiary-bg);
  --bs-btn-hover-color: var(--bs-body-color);
  --bs-btn-hover-border-color: var(--bs-border-color);
  --bs-btn-active-bg: var(--bs-tertiary-bg);
  --bs-btn-active-color: var(--bs-body-color);
}

/* Slightly narrower, tighter page */
.container { max-width: 1080px; }

/* ===== Dashboard polish ===== */
.container { max-width: 1200px; margin-left: auto; margin-right: auto; }

/* Smaller logo, tighter top bar */
.navbar-brand img { height: 26px; width: auto; }

/* Cards: more breathing room, stronger hierarchy */
.card { --bs-card-spacer-y: 1.1rem; --bs-card-spacer-x: 1.25rem; }
.card-header { padding: 0.9rem 1.25rem; }
.card-header .btn { --bs-btn-padding-y: 0.25rem; --bs-btn-padding-x: 0.65rem; --bs-btn-font-size: 0.8rem; }
.card-body { font-variant-numeric: tabular-nums; }

/* Primary button: slightly bolder, subtle depth */
.btn-primary { font-weight: 600; }
.btn-light, .btn-outline-secondary { border-color: var(--bs-border-color); }

/* Empty states */
.card-body.text-center, .card .text-center { color: var(--bs-secondary-color); font-size: 0.875rem; }

/* ===== Sidebar ===== */
#sidebarMenu .nav { gap: 2px; }
#sidebarMenu .offcanvas-item,
#sidebarMenu .offcanvas-item.active {
  background: transparent !important;
  border: 0 !important;
}
#sidebarMenu .nav-link {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--bs-secondary-color);
  padding: 0.5rem 0.75rem;
  border-radius: 6px;
  border: 0;
}
#sidebarMenu .nav-link .icon {
  width: 18px; height: 18px; opacity: 0.75;
}
#sidebarMenu .nav-link:hover {
  background: var(--bs-tertiary-bg);
  color: var(--bs-body-color);
}
#sidebarMenu .nav-link.active {
  background: rgba(79, 70, 229, 0.08) !important;
  color: #4f46e5;
  font-weight: 600;
}
#sidebarMenu .nav-link.active .icon { opacity: 1; }
[data-bs-theme="dark"] #sidebarMenu .nav-link.active { color: #a5b4fc; }

/* Balance block */
#sidebarMenu h5.text-secondary,
#sidebarMenu h5 {
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin: 1.25rem 0.75rem 0.15rem;
  padding: 0 !important;
}

/* ===== Order page ===== */
.list-group { --bs-list-group-border-color: var(--bs-border-color); --bs-list-group-border-radius: 8px; }
.list-group-item { padding: 0.95rem 1.1rem; font-weight: 500; font-size: 0.9rem; }
.list-group-item-action:hover { background: var(--bs-tertiary-bg); }
.list-group-item .icon { color: var(--bs-secondary-color); margin-right: 0.4rem; }

/* Replace cyan/green default badges with brand colours */
.badge.bg-info { background-color: #eef2ff !important; color: #4f46e5 !important; border: 1px solid #c7d2fe; }
.badge.bg-success { background-color: #ecfdf5 !important; color: #047857 !important; border: 1px solid #a7f3d0; }

/* Breadcrumb link: no underline */
.breadcrumb a { text-decoration: none; }
.breadcrumb a:hover { text-decoration: underline; }

/* ===== Plan cards ===== */
.sh-plan { transition: border-color .15s ease; }
.sh-plan:hover { border-color: #4f46e5; }
.sh-plan-title { font-size: 1.05rem; font-weight: 600; margin-bottom: 1rem; }
.sh-plan-features { margin-bottom: 1.25rem; font-size: 0.875rem; }
.sh-plan-features li { display: flex; align-items: flex-start; gap: 0.5rem; padding: 0.3rem 0; color: var(--bs-secondary-color); }
.sh-plan-features .icon { width: 16px; height: 16px; flex: none; margin-top: 3px; color: #059669; }

.sh-plan-price { margin: -0.4rem 0 1rem; display: flex; align-items: baseline; gap: 0.35rem; }
.sh-plan-price .sh-amount { font-size: 1.6rem; font-weight: 700; letter-spacing: -0.02em; }
.sh-plan-price .sh-from, .sh-plan-price .sh-per { font-size: 0.8rem; color: var(--bs-secondary-color); }