/* ==========================================================================
   Revnexa base: Bootstrap bridging, typography, app shell layout
   ========================================================================== */

:root,
[data-bs-theme="light"],
[data-bs-theme="dark"] {
  --bs-body-font-family: var(--rx-font);
  --bs-body-font-size: var(--rx-fs-base);
  --bs-body-color: var(--rx-text);
  --bs-body-bg: var(--rx-bg);
  --bs-border-color: var(--rx-border);
  --bs-border-radius: var(--rx-radius-sm);
  --bs-border-radius-lg: var(--rx-radius);
  --bs-primary: var(--rx-brand-500);
  --bs-primary-rgb: 59, 99, 230;
  --bs-link-color: var(--rx-brand-600);
  --bs-link-hover-color: var(--rx-brand-700);
  --bs-link-color-rgb: 47, 82, 201;
  --bs-link-hover-color-rgb: 37, 67, 163;
  --bs-secondary-color: var(--rx-text-muted);
  --bs-tertiary-bg: var(--rx-surface-2);
  --bs-emphasis-color: var(--rx-text);
  --bs-body-bg-rgb: 244, 246, 250;
  --bs-dropdown-bg: var(--rx-surface);
  --bs-dropdown-border-color: var(--rx-border);
  --bs-dropdown-link-color: var(--rx-text);
  --bs-dropdown-link-hover-bg: var(--rx-surface-2);
  --bs-dropdown-link-hover-color: var(--rx-text);
  --bs-modal-bg: var(--rx-surface);
  --bs-modal-border-color: var(--rx-border);
  --bs-offcanvas-bg: var(--rx-surface);
}

html { scroll-behavior: smooth; }
body {
  background: var(--rx-bg);
  color: var(--rx-text);
  font-family: var(--rx-font);
  -webkit-font-smoothing: antialiased;
  line-height: 1.5;
}

h1, h2, h3, h4, h5, h6 { color: var(--rx-text); font-weight: 650; letter-spacing: -.01em; }
.text-muted, .text-body-secondary { color: var(--rx-text-muted) !important; }
a { text-decoration: none; }
a:hover { text-decoration: underline; }
.num { font-variant-numeric: tabular-nums; }

/* Focus */
:focus-visible {
  outline: 2px solid var(--rx-focus);
  outline-offset: 2px;
  border-radius: 4px;
}

.skip-link {
  position: absolute; left: -999px; top: 8px; z-index: 2000;
  background: var(--rx-brand-600); color: #fff; padding: .5rem 1rem; border-radius: var(--rx-radius-sm);
}
.skip-link:focus { left: 8px; color: #fff; }

.visually-hidden-focusable:not(:focus):not(:focus-within) { position: absolute !important; }

/* --------------------------------------------------------------------------
   App shell
   -------------------------------------------------------------------------- */
.rx-app { min-height: 100vh; display: flex; }

.rx-sidebar {
  position: fixed; inset: 0 auto 0 0; z-index: 1040;
  width: var(--rx-sidebar-w);
  background: var(--rx-sidebar-bg);
  color: var(--rx-sidebar-text);
  display: flex; flex-direction: column;
  transition: transform .2s ease, width .2s ease;
}
.rx-sidebar__brand {
  height: var(--rx-topbar-h); flex: 0 0 auto;
  display: flex; align-items: center; gap: .65rem; padding: 0 1.25rem;
  border-bottom: 1px solid var(--rx-sidebar-border);
  color: #fff; font-weight: 700; font-size: 1.15rem; letter-spacing: -.02em;
}
.rx-sidebar__brand:hover { color: #fff; text-decoration: none; }
.rx-logo-mark {
  width: 32px; height: 32px; border-radius: 9px; flex: 0 0 auto;
  background: var(--rx-brand-500); display: grid; place-items: center; color: #fff;
}
.rx-sidebar__scroll { flex: 1 1 auto; overflow-y: auto; padding: 1rem .75rem 1.25rem; }
.rx-nav-label {
  font-size: .68rem; text-transform: uppercase; letter-spacing: .08em;
  color: #7f8ba3; padding: 1rem .75rem .4rem; font-weight: 600;
}
.rx-nav { list-style: none; margin: 0; padding: 0; }
.rx-nav a {
  display: flex; align-items: center; gap: .75rem;
  padding: .55rem .75rem; border-radius: var(--rx-radius-sm);
  color: var(--rx-sidebar-text); font-size: .875rem; font-weight: 500;
}
.rx-nav a:hover { background: var(--rx-sidebar-hover); color: #fff; text-decoration: none; }
.rx-nav a.active { background: var(--rx-sidebar-active); color: var(--rx-sidebar-text-active); }
.rx-nav a .bi { font-size: 1.05rem; width: 1.25rem; text-align: center; flex: 0 0 auto; }
.rx-nav .rx-nav-badge {
  margin-left: auto; background: var(--rx-brand-500); color: #fff;
  font-size: .68rem; padding: .1rem .45rem; border-radius: 999px; font-weight: 600;
}
.rx-sidebar__foot { padding: .75rem 1rem; border-top: 1px solid var(--rx-sidebar-border); font-size: .75rem; color: #7f8ba3; }

.rx-main { flex: 1 1 auto; min-width: 0; margin-left: var(--rx-sidebar-w); display: flex; flex-direction: column; transition: margin .2s ease; }

.rx-topbar {
  position: sticky; top: 0; z-index: 1030;
  height: var(--rx-topbar-h);
  display: flex; align-items: center; gap: .75rem; padding: 0 var(--rx-space);
  background: var(--rx-surface); border-bottom: 1px solid var(--rx-border);
}
.rx-topbar__search { position: relative; flex: 1 1 auto; max-width: 420px; }
.rx-topbar__search .bi { position: absolute; left: .8rem; top: 50%; transform: translateY(-50%); color: var(--rx-text-faint); pointer-events: none; }
.rx-topbar__search input { padding-left: 2.3rem; background: var(--rx-surface-2); }
.rx-topbar__actions { margin-left: auto; display: flex; align-items: center; gap: .35rem; }

.rx-icon-btn {
  position: relative; width: 40px; height: 40px; display: inline-grid; place-items: center;
  border: 0; background: transparent; color: var(--rx-text-muted); border-radius: var(--rx-radius-sm); font-size: 1.15rem;
}
.rx-icon-btn:hover { background: var(--rx-surface-2); color: var(--rx-text); }
.rx-icon-btn .rx-dot {
  position: absolute; top: 5px; right: 4px; min-width: 17px; height: 17px; padding: 0 4px;
  background: var(--rx-danger); color: #fff; font-size: .65rem; font-weight: 700;
  border-radius: 999px; display: grid; place-items: center; border: 2px solid var(--rx-surface);
}

.rx-content { flex: 1 1 auto; padding: var(--rx-space); width: 100%; max-width: var(--rx-content-max); margin: 0 auto; }
.rx-footer { padding: 1rem var(--rx-space); color: var(--rx-text-faint); font-size: var(--rx-fs-sm); border-top: 1px solid var(--rx-border); }

.rx-backdrop { display: none; position: fixed; inset: 0; background: rgba(8, 12, 22, .55); z-index: 1035; }

@media (max-width: 991.98px) {
  .rx-sidebar { transform: translateX(-100%); }
  .rx-sidebar.is-open { transform: none; box-shadow: var(--rx-shadow-lg); }
  .rx-main { margin-left: 0; }
  body.rx-nav-open .rx-backdrop { display: block; }
  .rx-topbar__search { display: none; }
  :root { --rx-space: 1rem; }
}

/* Page header */
.rx-page-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: 1.25rem; }
.rx-page-head h1 { font-size: var(--rx-fs-xl); margin: 0; }
.rx-page-head p { margin: .15rem 0 0; color: var(--rx-text-muted); }
.rx-breadcrumb { font-size: var(--rx-fs-sm); margin-bottom: .35rem; }
.rx-breadcrumb ol { list-style: none; display: flex; flex-wrap: wrap; gap: .35rem; margin: 0; padding: 0; color: var(--rx-text-faint); }
.rx-breadcrumb li + li::before { content: "/"; margin-right: .35rem; color: var(--rx-border-strong); }
.rx-breadcrumb a { color: var(--rx-text-muted); }

/* Demo banner */
.rx-demo-note {
  font-size: var(--rx-fs-sm); background: var(--rx-info-bg); color: var(--rx-info);
  border-radius: var(--rx-radius-sm); padding: .5rem .85rem; margin-bottom: 1rem;
  display: flex; gap: .5rem; align-items: center;
}

html[data-theme="dark"] { --bs-link-color: #8fa6ff; --bs-link-hover-color: #bccdff; --bs-link-color-rgb: 143, 166, 255; --bs-link-hover-color-rgb: 190, 205, 255; --bs-nav-link-color: #8fa6ff; --bs-nav-link-hover-color: #bccdff; }

/* Links inside running text carry an underline so they are not distinguished by colour alone */
p a:not(.btn), .small a:not(.btn), .rx-timeline__meta a, .rx-notice__time a, .cell-sub a, .form-text a, .text-muted a, .rx-footer a, .alert a:not(.btn) { text-decoration: underline; text-underline-offset: 2px; }
