/* NexLink-inspired LIGHT theme (colors extracted live from https://nexlink.layoutdrop.com/demo/index.html, light mode) */
@import url('https://fonts.googleapis.com/css2?family=Instrument+Sans:wght@400;500;600;700;800&display=swap');

:root {
  --bs-body-font-family: "Instrument Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --bs-body-bg: #ffffff;
  --bs-body-color: #696981;
  --bs-body-color-rgb: 105, 105, 129;
  --bs-emphasis-color: #000000;
  --bs-heading-color: #0C243C;
  --bs-border-color: #EEEEF3;
  --bs-border-color-translucent: rgba(0, 0, 0, 0.08);
  --bs-border-radius: 0.6rem;
  --bs-border-radius-sm: 0.4rem;
  --bs-border-radius-lg: 0.9rem;
  --bs-border-radius-xl: 1.1rem;

  --bs-primary: #5955D1;
  --bs-primary-rgb: 89, 85, 209;
  --bs-primary-text-emphasis: #242254;
  --bs-primary-bg-subtle: #f5f5fc;
  --bs-primary-border-subtle: #d8d7f5;

  --bs-secondary: #696981;
  --bs-secondary-bg: #f9f9f9;
  --bs-secondary-color: rgba(105, 105, 129, .75);

  --bs-success: #009966;
  --bs-success-bg-subtle: #e6f7f1;
  --bs-danger: #F83636;
  --bs-danger-bg-subtle: #fde8e8;
  --bs-warning: #F5A70D;
  --bs-warning-bg-subtle: #fef3dc;
  --bs-info: #7008E7;
  --bs-info-bg-subtle: #f2e3fd;

  --bs-tertiary-bg: #f8f9fa;
  --bs-light: #F2F2F6;
  --bs-dark: #0C243C;

  --bs-link-color: #5955D1;
  --bs-link-hover-color: #4e4bb8;

  --theme-card-bg: #ffffff;
  --theme-card-border: #EEEEF3;
  --theme-sidebar-bg: #ffffff;
  --theme-header-bg: #FDFDFF;
  --theme-input-bg: #ffffff;
  --theme-page-bg: #F7F7FB;

  color-scheme: light;
}

body {
  background: var(--theme-page-bg);
  color: var(--bs-body-color);
  font-weight: 500;
}

h1, h2, h3, h4, h5, h6 {
  color: var(--bs-heading-color);
  font-weight: 700;
}
.fw-bold, .fw-semibold {
  color: var(--bs-heading-color);
}

/* Sidebar */
.sidebar {
  background: var(--theme-sidebar-bg) !important;
  border-right: 1px solid var(--bs-border-color);
}
.sidebar-brand {
  width: 2.4rem;
  height: 2.4rem;
  border-radius: .75rem;
  background: linear-gradient(135deg, #7f7bf0, #5955D1);
  color: #fff !important;
  font-size: 1.1rem;
  box-shadow: 0 6px 14px rgba(89, 85, 209, .35);
}
.sidebar .nav-link {
  color: #696981;
  border-radius: .75rem;
  padding: .65rem .9rem;
  font-weight: 600;
  font-size: .92rem;
  display: flex;
  align-items: center;
  gap: .65rem;
  transition: background .15s ease, color .15s ease;
}
.sidebar .nav-link i {
  font-size: 1.05rem;
  width: 1.2rem;
  text-align: center;
  flex-shrink: 0;
  color: #b3b3c6;
  transition: color .15s ease;
}
.sidebar .nav-link:hover {
  color: var(--bs-primary);
  background: var(--bs-primary-bg-subtle);
}
.sidebar .nav-link:hover i {
  color: var(--bs-primary);
}
.sidebar .nav-link.active {
  color: var(--bs-primary-text-emphasis);
  background: var(--bs-primary-bg-subtle);
  box-shadow: inset 3px 0 0 var(--bs-primary);
}
.sidebar .nav-link.active i {
  color: var(--bs-primary);
}

/* Top navbar */
.navbar {
  background: var(--theme-header-bg) !important;
  border-bottom: 1px solid var(--bs-border-color) !important;
}

/* Cards */
.card {
  background: var(--theme-card-bg);
  border: 1px solid var(--theme-card-border);
  border-radius: 1.1rem;
  box-shadow: 0 .35rem 1.25rem rgba(23, 23, 60, .06);
}
.card-header {
  background: transparent;
  border-bottom: 1px solid var(--bs-border-color);
  font-weight: 700;
  color: var(--bs-heading-color);
}
.card-footer {
  background: transparent;
  border-top: 1px solid var(--bs-border-color);
}

/* Tables */
.table {
  --bs-table-bg: transparent;
  color: var(--bs-body-color);
}
.table thead.table-light th {
  background: var(--bs-primary-bg-subtle);
  color: var(--bs-primary-text-emphasis);
  border-bottom-color: var(--bs-border-color);
  font-weight: 700;
}
.table-hover > tbody > tr:hover > * {
  background-color: var(--bs-primary-bg-subtle);
  color: var(--bs-heading-color);
}
.table > :not(caption) > * > * {
  border-bottom-color: var(--bs-border-color);
}
/* Force cells to keep their natural width so table-responsive's overflow-x
   actually scrolls on narrow screens, instead of the browser wrapping text
   and squeezing every column down to unreadable widths. */
.table-responsive .table th,
.table-responsive .table td {
  white-space: nowrap;
}

/* Forms */
.form-control, .form-select {
  background-color: var(--theme-input-bg);
  border-color: var(--bs-border-color);
  color: var(--bs-heading-color);
}
.form-control:focus, .form-select:focus {
  background-color: #fff;
  border-color: var(--bs-primary);
  box-shadow: 0 0 0 .2rem rgba(89, 85, 209, .15);
  color: var(--bs-heading-color);
}
.form-control::placeholder {
  color: #b3b3c6;
}
.form-label {
  color: var(--bs-heading-color);
  font-weight: 600;
  font-size: .875rem;
}
.form-text {
  color: #9494a8;
}

/* Buttons */
.btn {
  font-weight: 600;
  border-radius: .65rem;
}
.btn-primary {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
  box-shadow: 0 .35rem .9rem rgba(89, 85, 209, .3);
}
.btn-primary:hover, .btn-primary:focus {
  background-color: #4e4bb8;
  border-color: #4e4bb8;
}
.btn-outline-secondary {
  color: var(--bs-body-color);
  border-color: var(--bs-border-color);
}
.btn-outline-secondary:hover {
  background: var(--bs-light);
  color: var(--bs-heading-color);
  border-color: var(--bs-border-color);
}
.btn-outline-primary {
  color: var(--bs-primary);
  border-color: var(--bs-primary-border-subtle);
}
.btn-outline-primary:hover {
  background: var(--bs-primary);
  border-color: var(--bs-primary);
}
.btn-outline-danger:hover {
  box-shadow: 0 .3rem .75rem rgba(248, 54, 54, .25);
}
.btn-outline-success:hover {
  box-shadow: 0 .3rem .75rem rgba(0, 153, 102, .25);
}
.btn-outline-warning:hover {
  box-shadow: 0 .3rem .75rem rgba(245, 167, 13, .25);
}

/* Badges */
.badge {
  font-weight: 600;
  border-radius: .5rem;
}
.badge.bg-warning {
  color: #6b4a00 !important;
}
.badge.bg-secondary {
  background-color: #EEEEF3 !important;
  color: #696981 !important;
}

/* Modals */
.modal-content {
  border-radius: 1.1rem;
  border: 1px solid var(--bs-border-color);
  box-shadow: 0 1rem 3rem rgba(23, 23, 60, .15);
}

/* Pagination */
.page-link {
  background: transparent;
  border-color: var(--bs-border-color);
  color: var(--bs-body-color);
  border-radius: .5rem;
  margin: 0 .1rem;
}
.page-link:hover {
  background: var(--bs-primary-bg-subtle);
  color: var(--bs-primary);
}
.page-item.active .page-link {
  background: var(--bs-primary);
  border-color: var(--bs-primary);
}
.page-item.disabled .page-link {
  background: transparent;
  color: #cfcfe0;
}

/* Alerts */
.alert {
  border: 1px solid var(--bs-border-color);
  border-radius: .9rem;
}

/* Code / muted text */
code {
  color: #d6336c;
}
.text-muted {
  color: #9494a8 !important;
}
