/*
 * Laniakea Theme — Bootstrap 5 override
 * Drop this after bootstrap.min.css in base.html
 * Font: DM Sans + JetBrains Mono (load via Google Fonts)
 */

/* ── Variables ── */
:root {
  --bs-font-sans-serif: 'DM Sans', system-ui, sans-serif;
  --bs-font-monospace: 'JetBrains Mono', monospace;
  --bs-body-font-family: var(--bs-font-sans-serif);
  --bs-body-font-size: 0.9375rem;
  --bs-body-line-height: 1.6;
  --bs-body-color: #111a24;
  --bs-body-bg: #f0f2f5;

  --bs-border-radius:    8px;
  --bs-border-radius-sm: 6px;
  --bs-border-radius-lg: 12px;
  --bs-border-radius-xl: 16px;
  --bs-border-color: rgba(0,0,0,0.1);

  /* Brand palette */
  --ln-accent:       #00865f;
  --ln-accent-light: #e6f5f0;
  --ln-accent-glow:  rgba(0,134,95,0.15);
  --ln-blue:         #1a6fd4;
  --ln-blue-light:   #e8f1fb;

  /* Bootstrap semantic overrides */
  --bs-primary:         #00865f;
  --bs-primary-rgb:     0,134,95;
  --bs-secondary:       #4e6070;
  --bs-secondary-rgb:   78,96,112;
  --bs-success:         #1e8f4e;
  --bs-success-rgb:     30,143,78;
  --bs-info:            #1a6fd4;
  --bs-info-rgb:        26,111,212;
  --bs-warning:         #c07a00;
  --bs-warning-rgb:     192,122,0;
  --bs-danger:          #c5362b;
  --bs-danger-rgb:      197,54,43;
  --bs-light:           #f0f2f5;
  --bs-light-rgb:       240,242,245;
  --bs-dark:            #111a24;
  --bs-dark-rgb:        17,26,36;

  --bs-link-color:         #1a6fd4;
  --bs-link-hover-color:   #1358aa;

  --shadow-sm: 0 1px 3px rgba(0,0,0,0.07), 0 2px 8px rgba(0,0,0,0.04);
  --shadow:    0 1px 3px rgba(0,0,0,0.08), 0 4px 12px rgba(0,0,0,0.06);
  --shadow-lg: 0 4px 20px rgba(0,0,0,0.10), 0 1px 4px rgba(0,0,0,0.06);
}

/* ── Base ── */
body { -webkit-font-smoothing: antialiased; }
h1,h2,h3,h4,h5,h6 { letter-spacing: -0.02em; font-weight: 500; }
code, pre, kbd, samp { font-family: var(--bs-font-monospace); }

/* ── Navbar ── */
.navbar {
  background: rgba(255,255,255,0.92) !important;
  backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(0,0,0,0.08);
  padding-top: 0; padding-bottom: 0;
  min-height: 58px;
  box-shadow: none;
}
.navbar-brand {
  display: flex; align-items: center; gap: 10px;
  font-size: 0.9375rem; font-weight: 500; color: #111a24 !important;
  letter-spacing: -0.01em;
}
.navbar-brand .ln-logo {
  width: 30px; height: 30px; border-radius: 8px;
  background: linear-gradient(135deg, #00865f, #1a6fd4);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--bs-font-monospace); font-size: 11px; font-weight: 500; color: #fff;
  letter-spacing: -0.02em; flex-shrink: 0;
}
.navbar .nav-link {
  color: #4e6070 !important; font-size: 0.875rem; padding: 0.375rem 0.75rem !important;
  border-radius: var(--bs-border-radius); transition: color 0.15s, background 0.15s;
}
.navbar .nav-link:hover,
.navbar .nav-link:focus { color: #111a24 !important; background: rgba(0,0,0,0.04); }
.navbar .nav-link.active { color: var(--ln-accent) !important; }
.navbar .dropdown-toggle::after { opacity: 0.4; }

/* ── Dropdown ── */
.dropdown-menu {
  border: 1px solid rgba(0,0,0,0.1);
  border-radius: var(--bs-border-radius-lg);
  box-shadow: var(--shadow-lg);
  padding: 6px;
  font-size: 0.875rem;
}
.dropdown-item {
  border-radius: var(--bs-border-radius-sm);
  color: #4e6070; padding: 0.5rem 0.75rem;
  transition: background 0.15s, color 0.15s;
}
.dropdown-item:hover, .dropdown-item:focus {
  background: rgba(0,0,0,0.04); color: #111a24;
}
.dropdown-item.active, .dropdown-item:active {
  background: var(--ln-accent-light); color: var(--ln-accent);
}
.dropdown-divider { border-color: rgba(0,0,0,0.07); margin: 4px 0; }

/* ── Card ── */
.card {
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: var(--bs-border-radius-xl) !important;
  box-shadow: var(--shadow);
  background: #fff;
}
.card-header {
  background: transparent;
  border-bottom: 1px solid rgba(0,0,0,0.07);
  padding: 1rem 1.25rem; font-weight: 500; font-size: 0.9rem;
}
.card-footer {
  background: transparent;
  border-top: 1px solid rgba(0,0,0,0.07);
  padding: 0.875rem 1.25rem;
}
.card-body { padding: 1.25rem; }

/* ── Buttons ── */
.btn {
  font-weight: 400; letter-spacing: 0; border-radius: var(--bs-border-radius);
  padding: 0.5rem 1rem; font-size: 0.875rem;
  transition: all 0.15s cubic-bezier(0.4,0,0.2,1);
}
.btn:active { transform: scale(0.98); }

.btn-primary {
  background: var(--ln-accent); border-color: var(--ln-accent); color: #fff;
}
.btn-primary:hover { background: #006f4e; border-color: #006f4e; }
.btn-primary:focus-visible { box-shadow: 0 0 0 3px var(--ln-accent-glow); }

.btn-outline-primary {
  color: var(--ln-accent); border-color: var(--ln-accent);
}
.btn-outline-primary:hover {
  background: var(--ln-accent-light); color: var(--ln-accent); border-color: var(--ln-accent);
}

.btn-secondary { background: #4e6070; border-color: #4e6070; }
.btn-secondary:hover { background: #3d4f5e; border-color: #3d4f5e; }

.btn-light {
  background: #fff; border-color: rgba(0,0,0,0.13); color: #111a24;
  box-shadow: var(--shadow-sm);
}
.btn-light:hover { background: #f0f2f5; border-color: rgba(0,0,0,0.18); }

.btn-link { color: var(--ln-blue); text-decoration: none; }
.btn-link:hover { color: #1358aa; text-decoration: underline; }

.btn-sm { padding: 0.3125rem 0.75rem; font-size: 0.8125rem; }
.btn-lg { padding: 0.625rem 1.5rem; font-size: 1rem; }

/* ── Forms ── */
.form-label { font-size: 0.875rem; font-weight: 500; color: #111a24; margin-bottom: 0.375rem; }
.form-text  { font-size: 0.8125rem; color: #9aaab8; }

.form-control, .form-select {
  background: #fff; border: 1px solid rgba(0,0,0,0.13);
  border-radius: var(--bs-border-radius); color: #111a24;
  font-size: 0.875rem; padding: 0.5rem 0.75rem;
  box-shadow: var(--shadow-sm);
  transition: border-color 0.15s, box-shadow 0.15s;
}
.form-control::placeholder { color: #9aaab8; }
.form-control:focus, .form-select:focus {
  border-color: var(--ln-accent);
  box-shadow: 0 0 0 3px var(--ln-accent-glow);
  outline: none;
}
.form-control.is-invalid { border-color: var(--bs-danger); }
.form-control.is-invalid:focus { box-shadow: 0 0 0 3px rgba(197,54,43,0.15); }
.form-control.is-valid { border-color: var(--bs-success); }
.form-control.is-valid:focus { box-shadow: 0 0 0 3px rgba(30,143,78,0.15); }

.form-check-input {
  border-color: rgba(0,0,0,0.25); width: 1em; height: 1em;
  margin-top: 0.2em;
}
.form-check-input:checked {
  background-color: var(--ln-accent); border-color: var(--ln-accent);
}
.form-check-input:focus { box-shadow: 0 0 0 3px var(--ln-accent-glow); }

.input-group-text {
  background: #f0f2f5; border-color: rgba(0,0,0,0.13);
  color: #4e6070; font-size: 0.875rem;
}

/* ── Table ── */
.table {
  font-size: 0.875rem; --bs-table-border-color: rgba(0,0,0,0.07);
}
.table thead th {
  font-weight: 500; font-size: 0.8125rem; color: #4e6070;
  border-bottom-width: 1px; padding: 0.75rem 1rem;
  font-family: var(--bs-font-monospace); letter-spacing: 0.04em; text-transform: uppercase;
  font-size: 0.75rem;
}
.table tbody td { padding: 0.875rem 1rem; vertical-align: middle; color: #111a24; }
.table tbody tr { transition: background 0.1s; }
.table-hover tbody tr:hover { background: rgba(0,134,95,0.03); }
.table-striped tbody tr:nth-of-type(odd) { background: rgba(0,0,0,0.02); }

/* ── Badge ── */
.badge {
  font-family: var(--bs-font-monospace); font-size: 0.6875rem;
  font-weight: 500; letter-spacing: 0.05em; padding: 0.28em 0.6em;
  border-radius: 99px;
}
.bg-primary   { background: var(--ln-accent-light) !important; color: var(--ln-accent) !important; border: 1px solid rgba(0,134,95,0.25); }
.bg-success   { background: #e4f5ec !important; color: #1e8f4e !important; border: 1px solid rgba(30,143,78,0.25); }
.bg-info      { background: var(--ln-blue-light) !important; color: var(--ln-blue) !important; border: 1px solid rgba(26,111,212,0.25); }
.bg-warning   { background: #fff4e0 !important; color: #c07a00 !important; border: 1px solid rgba(192,122,0,0.25); }
.bg-danger    { background: #fdecea !important; color: #c5362b !important; border: 1px solid rgba(197,54,43,0.25); }
.bg-secondary { background: #edf0f3 !important; color: #4e6070 !important; border: 1px solid rgba(78,96,112,0.2); }
.bg-dark      { background: #111a24 !important; color: #e8edf4 !important; border: none; }

/* ── Alert ── */
.alert {
  border-radius: var(--bs-border-radius-lg); border-width: 1px;
  font-size: 0.875rem; padding: 0.875rem 1.125rem;
}
.alert-primary { background: var(--ln-accent-light); color: #005c3f; border-color: rgba(0,134,95,0.25); }
.alert-success { background: #e4f5ec; color: #155235; border-color: rgba(30,143,78,0.25); }
.alert-info    { background: var(--ln-blue-light); color: #0f4a8f; border-color: rgba(26,111,212,0.25); }
.alert-warning { background: #fff4e0; color: #7a4d00; border-color: rgba(192,122,0,0.25); }
.alert-danger  { background: #fdecea; color: #7f2020; border-color: rgba(197,54,43,0.25); }

/* ── Nav tabs / pills ── */
.nav-tabs {
  border-bottom: 1px solid rgba(0,0,0,0.1);
  gap: 2px;
}
.nav-tabs .nav-link {
  border: none; border-radius: var(--bs-border-radius) var(--bs-border-radius) 0 0;
  color: #4e6070; font-size: 0.875rem; padding: 0.5rem 0.875rem;
  transition: color 0.15s, background 0.15s;
}
.nav-tabs .nav-link:hover { color: #111a24; background: rgba(0,0,0,0.04); }
.nav-tabs .nav-link.active {
  color: var(--ln-accent); background: #fff;
  border-bottom: 2px solid var(--ln-accent);
  font-weight: 500;
}
.nav-pills .nav-link {
  border-radius: var(--bs-border-radius); color: #4e6070;
  font-size: 0.875rem; padding: 0.375rem 0.875rem;
}
.nav-pills .nav-link.active {
  background: var(--ln-accent-light); color: var(--ln-accent); font-weight: 500;
}

/* ── Pagination ── */
.pagination { gap: 3px; }
.page-link {
  border-radius: var(--bs-border-radius) !important;
  border: 1px solid rgba(0,0,0,0.1); color: #4e6070;
  font-size: 0.875rem; padding: 0.375rem 0.75rem;
  transition: all 0.15s;
}
.page-link:hover { background: #f0f2f5; color: #111a24; border-color: rgba(0,0,0,0.15); }
.page-item.active .page-link {
  background: var(--ln-accent); border-color: var(--ln-accent); color: #fff;
}
.page-item.disabled .page-link { opacity: 0.4; }

/* ── Modal ── */
.modal-content {
  border: 1px solid rgba(0,0,0,0.1);
  border-radius: var(--bs-border-radius-xl);
  box-shadow: 0 20px 60px rgba(0,0,0,0.18);
}
.modal-header {
  border-bottom: 1px solid rgba(0,0,0,0.07);
  padding: 1.125rem 1.375rem;
}
.modal-title { font-size: 1rem; font-weight: 500; letter-spacing: -0.02em; }
.modal-footer { border-top: 1px solid rgba(0,0,0,0.07); padding: 0.875rem 1.375rem; gap: 8px; }
.btn-close { opacity: 0.4; }
.btn-close:hover { opacity: 0.8; }

/* ── Progress ── */
.progress {
  border-radius: 99px; background: rgba(0,0,0,0.07);
  height: 6px; overflow: hidden;
}
.progress-bar {
  background: var(--ln-accent); border-radius: 99px;
}

/* ── List group ── */
.list-group { border-radius: var(--bs-border-radius-lg); overflow: hidden; }
.list-group-item {
  border-color: rgba(0,0,0,0.07); font-size: 0.875rem;
  padding: 0.875rem 1.125rem;
  transition: background 0.15s;
}
.list-group-item:hover { background: rgba(0,0,0,0.02); }
.list-group-item.active {
  background: var(--ln-accent-light); color: var(--ln-accent);
  border-color: rgba(0,134,95,0.2); font-weight: 500;
}
.list-group-item-action:focus { background: rgba(0,0,0,0.03); }

/* ── Tooltip & Popover ── */
.tooltip-inner {
  background: #111a24; border-radius: var(--bs-border-radius-sm);
  font-size: 0.8125rem; padding: 5px 10px;
}
.popover {
  border: 1px solid rgba(0,0,0,0.1);
  border-radius: var(--bs-border-radius-lg);
  box-shadow: var(--shadow-lg);
  font-size: 0.875rem;
}
.popover-header {
  background: transparent; border-bottom: 1px solid rgba(0,0,0,0.07);
  font-weight: 500; border-radius: var(--bs-border-radius-lg) var(--bs-border-radius-lg) 0 0;
}

/* ── Breadcrumb ── */
.breadcrumb { font-size: 0.8125rem; }
.breadcrumb-item a { color: var(--ln-blue); text-decoration: none; }
.breadcrumb-item a:hover { text-decoration: underline; }
.breadcrumb-item.active { color: #9aaab8; }
.breadcrumb-item+.breadcrumb-item::before { color: #9aaab8; }

/* ── Accordion ── */
.accordion-item {
  border-color: rgba(0,0,0,0.08);
  border-radius: var(--bs-border-radius-lg) !important;
  overflow: hidden; margin-bottom: 6px;
}
.accordion-button {
  font-size: 0.9rem; font-weight: 500; background: #fff;
  border-radius: var(--bs-border-radius-lg) !important;
}
.accordion-button:not(.collapsed) {
  background: var(--ln-accent-light); color: var(--ln-accent);
  box-shadow: none;
}
.accordion-button:focus { box-shadow: 0 0 0 3px var(--ln-accent-glow); }
.accordion-button::after { filter: none; opacity: 0.5; }
.accordion-button:not(.collapsed)::after { filter: none; opacity: 1; }

/* ── Spinner ── */
.spinner-border, .spinner-grow { color: var(--ln-accent); }

/* ── Misc utilities ── */
.text-primary  { color: var(--ln-accent) !important; }
.text-info     { color: var(--ln-blue) !important; }
.text-muted    { color: #9aaab8 !important; }
.border        { border-color: rgba(0,0,0,0.1) !important; }
.border-primary{ border-color: var(--ln-accent) !important; }
.bg-light      { background: #f0f2f5 !important; }
.shadow-sm     { box-shadow: var(--shadow-sm) !important; }
.shadow        { box-shadow: var(--shadow) !important; }
.shadow-lg     { box-shadow: var(--shadow-lg) !important; }

/* ── Page layout helpers ── */
.ln-page      { min-height: 100vh; display: flex; flex-direction: column; }
.ln-content   { flex: 1; padding: 2.5rem 0; }
.ln-section-label {
  font-family: var(--bs-font-monospace); font-size: 0.6875rem; font-weight: 500;
  color: #9aaab8; letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 1rem;
}

/* ── Service list (dashboard) ── */
.ln-service-list {
  background: #fff; border: 1px solid rgba(0,0,0,0.08);
  border-radius: var(--bs-border-radius-xl); overflow: hidden;
  box-shadow: var(--shadow);
}
.ln-service-item {
  display: flex; align-items: center; gap: 1.25rem;
  padding: 1.125rem 1.5rem; text-decoration: none; color: inherit;
  border-bottom: 1px solid rgba(0,0,0,0.07);
  position: relative; transition: background 0.15s;
}
.ln-service-item:last-child { border-bottom: none; }
.ln-service-item:hover { background: rgba(0,134,95,0.025); }
.ln-service-item::before {
  content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
  background: linear-gradient(180deg, var(--ln-accent), var(--ln-blue));
  opacity: 0; transition: opacity 0.15s;
}
.ln-service-item:hover::before { opacity: 1; }
.ln-service-icon {
  width: 44px; height: 44px; flex-shrink: 0; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  background: var(--ln-accent-light); border: 1px solid rgba(0,134,95,0.2);
}
.ln-service-icon.blue { background: var(--ln-blue-light); border-color: rgba(26,111,212,0.2); }
.ln-service-body { flex: 1; min-width: 0; }
.ln-service-title { font-size: 0.9rem; font-weight: 500; color: #111a24; margin-bottom: 2px; }
.ln-service-desc  { font-size: 0.8rem; color: #9aaab8; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ln-service-meta  { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }

/* ── Footer ── */
.ln-footer {
  background: #fff; border-top: 1px solid rgba(0,0,0,0.08);
  padding: 1.25rem 0; font-size: 0.75rem; color: #9aaab8;
}
.ln-footer strong { color: #4e6070; font-weight: 500; }