/**
 * NxR Registry Portal — system.nxr-theme.css
 * Version 3.0.0 — Full NxR Design System
 * Dark-first, matches nxrregistry.github.io identity
 * Replaces all legacy portal template styling
 * ─────────────────────────────────────────────
 * Fonts: Inter (UI) + JetBrains Mono (code/data)
 * @import via default.js or add to page head
 */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600&display=swap');

/* ============================================================
   DESIGN TOKENS
   ============================================================ */
:root {
  /* ── Core palette ── */
  --nxr-navy:        #f0f4f8;   /* page background — light */
  --nxr-navy2:       #e8edf5;
  --nxr-navy3:       #dce3ee;
  --nxr-blue:        #2563eb;
  --nxr-blue2:       #3b82f6;
  --nxr-blue3:       #1d4ed8;   /* darkened for readability on light bg */
  --nxr-accent:      #f59e0b;
  --nxr-white:       #ffffff;

  /* ── Syrian flag accent (logo) ── */
  --nxr-flag-green:  #007A3D;
  --nxr-flag-red:    #CE1126;

  /* ── Surface ── */
  --nxr-surface:     #ffffff;   /* cards = white */
  --nxr-surface2:    #f8fafc;
  --nxr-surface3:    #f1f5f9;
  --nxr-border:      rgba(0,0,0,.08);
  --nxr-border2:     rgba(0,0,0,.12);

  /* ── Text ── */
  --nxr-text:        #1e293b;
  --nxr-text2:       #475569;
  --nxr-text3:       #94a3b8;

  /* ── Status ── */
  --nxr-ok:          #16a34a;
  --nxr-ok-bg:       rgba(22,163,74,.1);
  --nxr-warn:        #d97706;
  --nxr-warn-bg:     rgba(217,119,6,.1);
  --nxr-error:       #dc2626;
  --nxr-error-bg:    rgba(220,38,38,.1);
  --nxr-info:        #2563eb;
  --nxr-info-bg:     rgba(37,99,235,.1);

  /* ── Radius ── */
  --nxr-r-sm:        6px;
  --nxr-r-md:        10px;
  --nxr-r-lg:        14px;
  --nxr-r-xl:        20px;

  /* ── Shadow ── */
  --nxr-shadow:      0 2px 12px rgba(0,0,0,.08);
  --nxr-shadow2:     0 8px 32px rgba(0,0,0,.12);

  /* ── Transition ── */
  --nxr-t:           0.15s ease;

  /* ── Sidebar ── Indigo ── */
  --nxr-sidebar-w:   240px;
  --nxr-sidebar-bg:  #1e1b4b;   /* Option A · matches navbar middle stop */

  /* ── Topbar ── Option E · Obsidian Gradient ── */
  --nxr-topbar-h:    70px;
  --nxr-topbar-bg:   #1e1b4b;   /* fallback for browsers without gradient support */
}

/* ── Sidebar gets its own indigo CSS-variable scope ── */
.side-nav,
nav.side-nav,
.sidenav-bg,
.logo-sn,
.logo-wrapper,
.sn-avatar-wrapper {
  --nxr-text:    #ffffff;
  --nxr-text2:   #c7d2fe;   /* indigo-200 — soft white for secondary text */
  --nxr-text3:   #a5b4fc;   /* indigo-300 */
  --nxr-border:  rgba(255,255,255,.10);
  --nxr-border2: rgba(255,255,255,.15);
  --nxr-surface: #1e1b4b;   /* Option A · deep indigo — same as sidebar bg */
  --nxr-surface2:#312e81;   /* Option A · medium indigo — section headers */
  --nxr-surface3:#312e81;
  --nxr-navy:    #1e1b4b;
  --nxr-blue3:   #a5b4fc;   /* indigo-300 as accent */
  --nxr-white:   #ffffff;
}

/* ============================================================
   GLOBAL RESET & BASE
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }

html, body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
  background: var(--nxr-navy) !important;
  color: var(--nxr-text) !important;
  font-size: 14px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

/* Apply Inter to text elements — explicitly exclude icon elements */
body, p, h1, h2, h3, h4, h5, h6, span:not([class*="fa"]),
div, a, input, select, textarea, label, td, th, li, button,
.btn, .badge, .form-control, .dropdown-item {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
code, pre, .text-monospace, kbd, samp {
  font-family: 'JetBrains Mono', 'Courier New', monospace !important;
}

a { color: var(--nxr-blue); transition: color var(--nxr-t); }
a:hover { color: var(--nxr-blue3); text-decoration: none; }

::selection { background: rgba(37,99,235,.4); color: #fff; }

/* Scrollbar */
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: var(--nxr-navy); }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 99px; }
::-webkit-scrollbar-thumb:hover { background: var(--nxr-blue); }

/* ============================================================
   SIDEBAR
   ============================================================ */
.sidebar,
.side-nav,
.sidenav-bg,
nav.side-nav {
  background: var(--nxr-sidebar-bg) !important;
  border-right: 1px solid var(--nxr-border) !important;
  box-shadow: none !important;
}
/* Overlay must stay semi-transparent, NOT the sidebar color */
#sidenav-overlay {
  background: rgba(0,0,0,.5) !important;
}

/* The sidebar docks BELOW the fixed navbar at EVERY width -- both the
   >1440px docked rail and the <=1440px slide-out drawer (MDB switches
   between the two at max-width:1440px). Anchored to --nxr-topbar-h, the
   same variable the navbar's height is pinned to, so the two stay in
   step if the banner height ever changes.

   This is deliberately a geometry fix, not a stacking fix. Earlier
   revisions tried to arbitrate z-index between navbar (1030) and sidebar
   (1040 idle / 1050 on slim hover), which is unwinnable while the two
   overlap:
     - leave it alone  -> the hover-expanded rail paints over the header;
     - raise the navbar -> it covers the sidebar's top strip, i.e. the
       domain search box and the FINANCE section header;
     - raise the navbar on :hover only -> the navbar then covers the very
       pixels being hovered, so :hover drops, the navbar lowers, :hover
       returns: the menu strobes at frame rate.
   Removing the overlap removes the contest, so MDB's stock z-index
   values are left untouched and no rule keys stacking off :hover. Do not
   reintroduce a z-index override here. */
.side-nav,
.side-nav.fixed {
  top: var(--nxr-topbar-h) !important;
  height: calc(100% - var(--nxr-topbar-h)) !important;
}

/* Docked mode only (>1440px, where MDB keeps the rail on-screen rather
   than sliding it out). Push main/footer during the slim rail's hover
   expand, matching the padding-left handleSlim() already applies for the
   persistent click-toggle (see material.js) -- otherwise hovering the
   collapsed rail overlays body content instead of reflowing it, and it
   never gets pushed back on mouseleave since the click-toggle's inline
   style sticks around underneath. :has(:hover) re-evaluates continuously,
   so leaving the rail hands control back to whatever the click-toggle
   already set, automatically. Layout-only -- it touches no z-index, so
   unlike the rule it replaces it cannot feed back into its own hover
   state. */
@media (min-width: 1441px) {
  header:has(.side-nav.wide.slim:hover) ~ main,
  header:has(.side-nav.wide.slim:hover) ~ footer {
    padding-left: 15rem !important;
    transition: padding-left .2s ease-in-out !important;
  }
}

/* Sidebar links */
.side-nav .collapsible a,
.side-nav li a,
.sidebar-link,
nav.side-nav a {
  color: var(--nxr-text2) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  border-radius: var(--nxr-r-md) !important;
  margin: 1px 8px !important;
  padding: 9px 14px !important;
  transition: all var(--nxr-t) !important;
}

.side-nav .collapsible a:hover,
.side-nav li a:hover,
nav.side-nav a:hover {
  background: rgba(255,255,255,.12) !important;
  color: #ffffff !important;
}

.side-nav .collapsible a.active,
.side-nav li a.active,
nav.side-nav a.active {
  background: rgba(255,255,255,.12) !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  box-shadow: 0 4px 12px rgba(0,0,0,.2) !important;
  border-left: 3px solid #a5b4fc !important;
}

/* Sidebar icons */
.side-nav .fa, .side-nav .fas,
.side-nav .far, .side-nav .fab {
  color: inherit !important;
  width: 18px !important;
  text-align: center !important;
  margin-right: 10px !important;
  font-size: 14px !important;
}

/* Sidebar logo area */
.logo-wrapper,
.sn-avatar-wrapper,
.logo-sn {
  background: var(--nxr-sidebar-bg) !important;
  border-bottom: 1px solid var(--nxr-border) !important;
  padding: 18px 20px !important;
}

/* ── NxR Logo mark ── */
.nxr-logo {
  display: flex;
  align-items: center;
  gap: 8px;
  text-decoration: none !important;
  user-select: none;
}
.nxr-logo-mark {
  font-family: 'Inter', sans-serif !important;
  font-weight: 800;
  font-size: 1.4rem;
  letter-spacing: -1px;
  line-height: 1;
}
.nxr-logo-mark .L-n { color: var(--nxr-flag-green); }
.nxr-logo-mark .L-x { color: var(--nxr-flag-red); }
.nxr-logo-mark .L-r { color: var(--nxr-text2); }
.nxr-logo-tag {
  font-size: .6rem;
  font-weight: 600;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--nxr-text3);
  margin-top: 2px;
}

/* Sidebar section headings */
.side-nav .search-form,
.side-nav hr { border-color: var(--nxr-border) !important; }

.side-nav .sub-menu {
  background: transparent !important;
}
.side-nav .sub-menu a {
  font-size: 12px !important;
  padding-left: 42px !important;
  color: var(--nxr-text3) !important;
}
.side-nav .sub-menu a:hover { color: var(--nxr-text) !important; }

/* Sidebar brand logo */
.nxr-sidebar-brand {
  position: relative !important;
  height: 72px !important;
}

.nxr-sidebar-brand .sv-logo-text {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  min-height: 72px !important;
  padding: 0 86px 0 18px !important;
  text-align: left !important;
}

.nxr-sidebar-brand .sv-logo-text span {
  display: block !important;
  max-width: 100% !important;
  overflow: hidden !important;
  color: #ffffff !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.nxr-sidebar-brand-logo {
  position: absolute !important;
  top: 10px !important;
  right: 16px !important;
  width: 58px !important;
  height: 44px !important;
  object-fit: contain !important;
  opacity: .95 !important;
  pointer-events: none !important;
}

.nxr-sidebar-brand .sv-logo-icon {
  min-height: 64px !important;
  text-align: center !important;
}

.nxr-sidebar-brand-logo-slim {
  width: 36px !important;
  height: 30px !important;
  object-fit: contain !important;
  opacity: .95 !important;
}

/* ============================================================
   TOPBAR — HOME BUTTON + PAGE TITLE
   ============================================================ */

/* Home icon button */
.nxr-home-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 42px !important;
  height: 42px !important;
  border-radius: var(--nxr-r-md) !important;
  color: rgba(255,255,255,.85) !important;
  text-decoration: none !important;
  transition: background var(--nxr-t), color var(--nxr-t) !important;
  flex-shrink: 0 !important;
}
.nxr-home-btn:hover {
  background: rgba(255,255,255,.15) !important;
  color: #ffffff !important;
  text-decoration: none !important;
}
.nxr-home-btn .fa-home {
  font-size: 24px !important;
}

/* Bigger, bolder page title in topbar — white text on indigo */
.nxr-nav-title {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  letter-spacing: -.01em !important;
}
.nxr-nav-sep {
  color: rgba(255,255,255,.5) !important;
  margin: 0 8px !important;
  font-weight: 300 !important;
}
.nxr-nav-alias {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  font-style: normal !important;
  letter-spacing: -.01em !important;
}
.nxr-nav-user {
  font-size: 13px !important;
  color: rgba(199,210,254,.75) !important;   /* indigo-200, softened */
}
.nxr-nav-user:hover {
  color: #ffffff !important;
}

/* ============================================================
   SIDEBAR TOGGLE BUTTON (hamburger)
   ============================================================ */
.button-collapse {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 44px !important;
  height: 44px !important;
  border-radius: var(--nxr-r-md) !important;
  margin-right: 10px !important;
  color: rgba(255,255,255,.85) !important;
  transition: background var(--nxr-t), color var(--nxr-t) !important;
  text-decoration: none !important;
}
.button-collapse:hover {
  background: rgba(255,255,255,.15) !important;
  color: #ffffff !important;
}
.button-collapse .fa-bars {
  font-size: 23px !important;
}

/* ============================================================
   TOPBAR / NAVBAR
   ============================================================ */
.navbar,
nav.navbar,
.top-nav,
.navbar-dark {
  background:       var(--nxr-topbar-bg) !important;
  background-image: linear-gradient(135deg, #0f172a 0%, #1e1b4b 50%, #312e81 100%) !important;
  border-bottom:    none !important;
  box-shadow:       0 3px 20px rgba(15,23,42,.45) !important;
  height:           var(--nxr-topbar-h) !important;
  min-height:       var(--nxr-topbar-h) !important;
  padding:          0 22px !important;
}

.navbar .navbar-brand,
.navbar-brand {
  color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 18px !important;
}

.navbar .nav-link,
.navbar-nav .nav-link {
  color: rgba(255,255,255,.85) !important;
  font-size: 19px !important;   /* icon size */
  font-weight: 500 !important;
  padding: 6px 12px !important;
  border-radius: var(--nxr-r-md) !important;
  transition: all var(--nxr-t) !important;
  line-height: 1 !important;
}

.navbar .nav-link:hover { color: #ffffff !important; background: rgba(255,255,255,.15) !important; }
.navbar .nav-link.active { color: #ffffff !important; background: rgba(255,255,255,.2) !important; }

/* Topbar badge */
.navbar .badge { font-size: 10px; border-radius: 99px; }

/* ============================================================
   NAVBAR STATUS STRIP
   ============================================================ */
.nxr-nav-status {
  pointer-events: none;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
}
.nxr-ns-item {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: rgba(255,255,255,0.75);
}
.nxr-ns-sep {
  display: inline-block;
  margin: 0 7px;
  font-size: 11px;
  color: rgba(255,255,255,0.30);
  font-weight: 300;
}
.nxr-ns-label {
  font-size: 11px;
  color: rgba(255,255,255,0.80);
  letter-spacing: 0.05em;
}
/* Status dot */
.nxr-ns-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex-shrink: 0;
}
.nxr-ns-dot.nxr-ns-ok   { background: #22c55e; box-shadow: 0 0 5px rgba(34,197,94,.6); }
.nxr-ns-dot.nxr-ns-err  { background: #ef4444; box-shadow: 0 0 5px rgba(239,68,68,.6); }
.nxr-ns-dot.nxr-ns-warn { background: #f59e0b; box-shadow: 0 0 5px rgba(245,158,11,.6); }

/* Maintenance banner (shown in navbar center when maintenance_message is set in interface.conf) */
.nxr-nav-maintenance {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.03em;
  color: #f59e0b;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 560px;
}
.nxr-nav-maintenance .fa-wrench {
  font-size: 12px;
  opacity: 0.85;
  flex-shrink: 0;
}

/* Login page proactive maintenance notice (anonymous visitors) */
.nxr-auth-maintenance {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 12.5px;
  font-weight: 600;
  color: #b45309;
  background: rgba(245, 158, 11, 0.12);
  border: 1px solid rgba(245, 158, 11, 0.35);
  border-radius: 6px;
  padding: 8px 12px;
  margin-bottom: 14px;
  width: 100%;
}

/* ============================================================
   CARDS
   ============================================================ */
.card {
  background: var(--nxr-surface) !important;
  border: 1px solid var(--nxr-border) !important;
  border-radius: var(--nxr-r-lg) !important;
  box-shadow: var(--nxr-shadow) !important;
  color: var(--nxr-text) !important;
}

.card-header {
  background: var(--nxr-surface2) !important;
  border-bottom: 1px solid var(--nxr-border) !important;
  color: var(--nxr-text) !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  padding: 12px 18px !important;
  border-radius: var(--nxr-r-lg) var(--nxr-r-lg) 0 0 !important;
}

/* ── Gradient header variant (used by panels) ── */
.card-header.elegant-color-dark,
.card-header.nxr-header-gradient {
  background: #312e81 !important;
  border-bottom: 1px solid rgba(255,255,255,.1) !important;
  color: #ffffff !important;
  position: relative;
  overflow: hidden;
}
.card-header.elegant-color-dark::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at top right, rgba(255,255,255,.08) 0%, transparent 70%);
  pointer-events: none;
}

.card-body { padding: 18px !important; color: var(--nxr-text) !important; }
.card-footer {
  background: var(--nxr-surface2) !important;
  border-top: 1px solid var(--nxr-border) !important;
  border-radius: 0 0 var(--nxr-r-lg) var(--nxr-r-lg) !important;
  padding: 10px 18px !important;
}

/* ============================================================
   BUTTONS
   ============================================================ */
.btn {
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  border-radius: var(--nxr-r-md) !important;
  padding: 7px 16px !important;
  transition: all var(--nxr-t) !important;
  border: 1px solid transparent !important;
  letter-spacing: .01em !important;
}

/* Primary */
.btn-primary,
.btn.elegant-color-dark {
  background: var(--nxr-blue) !important;
  border-color: var(--nxr-blue) !important;
  color: #fff !important;
  box-shadow: 0 4px 12px rgba(37,99,235,.3) !important;
}
.btn-primary:hover, .btn.elegant-color-dark:hover {
  background: var(--nxr-blue2) !important;
  border-color: var(--nxr-blue2) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 20px rgba(37,99,235,.4) !important;
}

/* MDB btn-elegant / btn-outline-elegant — override with NxR blue style */
.btn-elegant,
.btn.btn-elegant {
  background: var(--nxr-blue) !important;
  border-color: var(--nxr-blue) !important;
  color: #fff !important;
  box-shadow: 0 2px 8px rgba(37,99,235,.2) !important;
}
.btn-elegant:hover,
.btn.btn-elegant:hover,
.btn-elegant:focus,
.btn-elegant.dropdown-toggle {
  background: var(--nxr-blue2) !important;
  border-color: var(--nxr-blue2) !important;
  color: #fff !important;
}
.btn-elegant:active,
.btn-elegant.active {
  background: var(--nxr-blue3) !important;
  border-color: var(--nxr-blue3) !important;
  color: #fff !important;
}

/* Outlined elegant variant */
.btn-outline-elegant {
  background: transparent !important;
  border-color: var(--nxr-border2) !important;
  color: var(--nxr-text2) !important;
}
.btn-outline-elegant:hover {
  background: rgba(37,99,235,.08) !important;
  border-color: var(--nxr-blue) !important;
  color: var(--nxr-blue) !important;
}

/* btn-outline-dark — update for light theme */
.btn-outline-dark {
  color: var(--nxr-text2) !important;
  border-color: var(--nxr-border2) !important;
  background: var(--nxr-surface2) !important;
}
.btn-outline-dark:hover {
  background: rgba(0,0,0,.05) !important;
  color: var(--nxr-text) !important;
  border-color: var(--nxr-border2) !important;
}
.btn-outline-dark:disabled,
.btn-outline-dark[disabled],
button.btn-outline-dark:disabled,
button[disabled].btn-outline-dark {
  background: var(--nxr-surface2) !important;
  background-color: var(--nxr-surface2) !important;
  border-color: var(--nxr-border) !important;
  color: var(--nxr-text) !important;
  opacity: 1 !important;
}

/* Ledger date range display button — highly specific override for all states */
.ledger-control .btn-outline-dark,
.ledger-control button.btn-outline-dark,
.ledger-control .btn.btn-outline-dark,
.ledger-header .btn-outline-dark,
button.self-toggle.btn-outline-dark,
.btn.self-toggle.btn-outline-dark {
  background: var(--nxr-surface2) !important;
  background-color: var(--nxr-surface2) !important;
  border-color: var(--nxr-border2) !important;
  color: var(--nxr-text) !important;
  font-weight: 600 !important;
  opacity: 1 !important;
}

/* Secondary */
.btn-secondary, .btn-default {
  background: var(--nxr-surface3) !important;
  background-color: var(--nxr-surface3) !important;
  border-color: var(--nxr-border2) !important;
  color: var(--nxr-text2) !important;
}
.btn-secondary:hover, .btn-default:hover {
  background: #e2e8f0 !important;
  background-color: #e2e8f0 !important;
  color: var(--nxr-text) !important;
}
/* Active state — MDB overrides this to purple (#a6c / #739), fix to blue */
.btn-secondary.active,
.btn-secondary:active,
.btn-secondary:not(:disabled):not(.disabled).active,
.btn-secondary:not(:disabled):not(.disabled):active,
.show > .btn-secondary.dropdown-toggle {
  background: var(--nxr-blue) !important;
  background-color: var(--nxr-blue) !important;
  border-color: var(--nxr-blue) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 12px rgba(37,99,235,.35) !important;
}

/* Light (used heavily in portal) */
.btn-light {
  background: rgba(0,0,0,.05) !important;
  border-color: var(--nxr-border2) !important;
  color: var(--nxr-text2) !important;
}
.btn-light:hover {
  background: rgba(0,0,0,.09) !important;
  color: var(--nxr-text) !important;
}

/* Danger */
.btn-danger {
  background: rgba(239,68,68,.15) !important;
  border-color: rgba(239,68,68,.4) !important;
  color: #fca5a5 !important;
}
.btn-danger:hover {
  background: var(--nxr-error) !important;
  border-color: var(--nxr-error) !important;
  color: #fff !important;
}

/* Success */
.btn-success {
  background: var(--nxr-ok) !important;
  background-color: var(--nxr-ok) !important;
  border-color: var(--nxr-ok) !important;
  color: #ffffff !important;
}
.btn-success:hover {
  background: #15803d !important;
  background-color: #15803d !important;
  border-color: #15803d !important;
  color: #ffffff !important;
}

/* Warning */
.btn-warning {
  background: rgba(245,158,11,.15) !important;
  border-color: rgba(245,158,11,.4) !important;
  color: #fcd34d !important;
}

/* Outline */
.btn-outline-primary {
  background: transparent !important;
  border-color: var(--nxr-blue) !important;
  color: var(--nxr-blue3) !important;
}
.btn-outline-primary:hover {
  background: var(--nxr-blue) !important;
  color: #fff !important;
}

/* Small / XS */
.btn-sm { padding: 4px 10px !important; font-size: 12px !important; }
.btn-xs { padding: 2px 8px !important; font-size: 11px !important; }

/* ============================================================
   FORMS
   ============================================================ */
.form-control,
input.form-control,
select.form-control,
textarea.form-control,
.form-control:not([type="range"]) {
  background: var(--nxr-white) !important;
  border: 1px solid var(--nxr-border2) !important;
  border-radius: var(--nxr-r-md) !important;
  color: var(--nxr-text) !important;
  font-size: 13px !important;
  font-family: 'Inter', sans-serif !important;
  padding: 8px 14px 8px 16px !important;
  transition: border-color var(--nxr-t), box-shadow var(--nxr-t) !important;
}

/* Ensure bare input/textarea elements (no .form-control class) also get padding */
input:not([type="range"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="file"]),
textarea,
select {
  padding-left: 16px !important;
}

/* ── MDB md-form — re-tune floating label for border-box inputs ──
   MDB defaults assume a bottom-border-only input.
   Our inputs are full border-box, so we reposition the label
   to float INSIDE the box (top-left) when active.
   ─────────────────────────────────────────────────────────── */
.md-form {
  position: relative !important;
  margin-bottom: 0.75rem !important;
}

/* Taller input — top padding holds the shrunken floating label */
.md-form input.form-control,
.md-form textarea.form-control {
  padding: 22px 16px 8px 16px !important;
  height: auto !important;
  border: 1px solid var(--nxr-border2) !important;
  border-radius: var(--nxr-r-md) !important;
  border-bottom: 1px solid var(--nxr-border2) !important;
  background: var(--nxr-white) !important;
  color: var(--nxr-text) !important;
  font-size: 14px !important;
  box-shadow: none !important;
  margin: 0 !important;
}
.md-form input.form-control:focus,
.md-form textarea.form-control:focus {
  border-color: var(--nxr-blue) !important;
  box-shadow: 0 0 0 3px rgba(37,99,235,.12) !important;
}

/* Label — starts centered inside the input (like a placeholder) */
.md-form label {
  position: absolute !important;
  top: 0 !important;
  left: 16px !important;
  right: 0 !important;
  z-index: 10 !important;
  transform: translateY(15px) !important;
  transform-origin: left top !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  color: var(--nxr-text3) !important;
  transition: transform .15s ease, font-size .15s ease, color .15s ease !important;
  pointer-events: none !important;
  white-space: nowrap !important;
}

/* Label active — shrinks to top-left of the input box */
.md-form label.active {
  transform: translateY(5px) scale(0.78) !important;
  color: var(--nxr-blue) !important;
  font-weight: 600 !important;
}
.form-control:focus {
  background: var(--nxr-white) !important;
  border-color: var(--nxr-blue) !important;
  box-shadow: 0 0 0 3px rgba(37,99,235,.15) !important;
  color: var(--nxr-text) !important;
  outline: none !important;
}
.form-control::placeholder { color: var(--nxr-text3) !important; }
.form-control:disabled { opacity: .5 !important; cursor: not-allowed !important; }

label, .col-form-label { color: var(--nxr-text2) !important; font-size: 12px !important; font-weight: 600 !important; }

.input-group-text {
  background: var(--nxr-surface3) !important;
  border: 1px solid var(--nxr-border2) !important;
  color: var(--nxr-text2) !important;
  font-size: 13px !important;
}

/* Select */
select.form-control option {
  background: var(--nxr-white) !important;
  color: var(--nxr-text) !important;
}

/* Checkbox & Radio */
.form-check-input { accent-color: var(--nxr-blue); }

/* ============================================================
   TABLES
   ============================================================ */
.table {
  color: var(--nxr-text) !important;
  border-color: var(--nxr-border) !important;
  font-size: 13px !important;
}
.table thead th {
  background: var(--nxr-surface2) !important;
  border-bottom: 1px solid var(--nxr-border2) !important;
  color: var(--nxr-text2) !important;
  font-size: 12px !important;        /* was 11px — slightly bigger for readability */
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .05em !important;
  padding: 10px 14px !important;
  white-space: nowrap !important;
}
.table tbody td {
  border-bottom: 1px solid var(--nxr-border) !important;
  padding: 10px 14px !important;
  vertical-align: middle !important;
  color: var(--nxr-text) !important;
  font-size: 13px !important;
}
/* Prevent .small class from making table text too tiny */
.table td .small, .table td small,
.table th .small, .table th small {
  font-size: 12px !important;
}
.table tbody tr:hover td { background: rgba(37,99,235,.06) !important; }
.table tbody tr:last-child td { border-bottom: none !important; }

/* Striped */
.table-striped tbody tr:nth-of-type(odd) td { background: rgba(0,0,0,.02) !important; }
.table-hover tbody tr:hover td { background: rgba(37,99,235,.06) !important; }

/* DataTables override */
.dataTables_wrapper { color: var(--nxr-text) !important; font-size: 13px !important; }
.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select {
  background: var(--nxr-white) !important;
  border: 1px solid var(--nxr-border2) !important;
  color: var(--nxr-text) !important;
  border-radius: var(--nxr-r-md) !important;
  padding: 5px 10px !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button {
  background: var(--nxr-white) !important;
  border: 1px solid var(--nxr-border) !important;
  color: var(--nxr-text2) !important;
  border-radius: var(--nxr-r-sm) !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current {
  background: var(--nxr-blue) !important;
  border-color: var(--nxr-blue) !important;
  color: #fff !important;
}
.dataTables_wrapper .dataTables_info { color: var(--nxr-text3) !important; font-size: 12px !important; }

/* ============================================================
   BADGES
   ============================================================ */
.badge {
  font-family: 'Inter', sans-serif !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  padding: 3px 8px !important;
  border-radius: 99px !important;
  letter-spacing: .04em !important;
}
.badge-primary   { background: rgba(37,99,235,.12)  !important; color: var(--nxr-blue)  !important; }
.badge-success   { background: var(--nxr-ok)        !important; color: #ffffff           !important; }
.badge-warning   { background: var(--nxr-warn)      !important; color: #ffffff           !important; }
.badge-danger    { background: var(--nxr-error)     !important; color: #ffffff           !important; }
.badge-info      { background: var(--nxr-info)      !important; color: #ffffff           !important; }
.badge-secondary { background: rgba(0,0,0,.06)      !important; color: var(--nxr-text2)  !important; }
.badge-light     { background: rgba(0,0,0,.06)      !important; color: var(--nxr-text2)  !important; }
.badge-dark      { background: #e2e8f0              !important; color: var(--nxr-text2)  !important; }

/* ============================================================
   ALERTS
   ============================================================ */
.alert {
  border-radius: var(--nxr-r-md) !important;
  font-size: 13px !important;
  border: 1px solid !important;
  padding: 12px 16px !important;
}
.alert-success {
  background: var(--nxr-ok-bg) !important;
  border-color: rgba(22,163,74,.25) !important;
  color: var(--nxr-ok) !important;
}
.alert-danger, .alert-error {
  background: var(--nxr-error-bg) !important;
  border-color: rgba(220,38,38,.25) !important;
  color: var(--nxr-error) !important;
}
.alert-warning {
  background: var(--nxr-warn-bg) !important;
  border-color: rgba(217,119,6,.25) !important;
  color: var(--nxr-warn) !important;
}
.alert-info {
  background: var(--nxr-info-bg) !important;
  border-color: rgba(37,99,235,.25) !important;
  color: var(--nxr-info) !important;
}

/* ============================================================
   MODALS
   ============================================================ */
.modal-content {
  background: var(--nxr-surface) !important;
  border: 1px solid var(--nxr-border2) !important;
  border-radius: var(--nxr-r-xl) !important;
  box-shadow: var(--nxr-shadow2) !important;
  color: var(--nxr-text) !important;
}
.modal-header {
  background: var(--nxr-surface2) !important;
  border-bottom: 1px solid var(--nxr-border) !important;
  border-radius: var(--nxr-r-xl) var(--nxr-r-xl) 0 0 !important;
  padding: 14px 20px !important;
}
.modal-title { color: var(--nxr-text) !important; font-weight: 700 !important; font-size: 15px !important; }
.modal-body { padding: 20px !important; color: var(--nxr-text) !important; }
.modal-footer {
  background: var(--nxr-surface2) !important;
  border-top: 1px solid var(--nxr-border) !important;
  border-radius: 0 0 var(--nxr-r-xl) var(--nxr-r-xl) !important;
  padding: 12px 20px !important;
}
.modal-backdrop { backdrop-filter: blur(4px) !important; }

.close, .close span {
  color: var(--nxr-text2) !important;
  opacity: 1 !important;
  font-size: 20px !important;
  transition: color var(--nxr-t) !important;
}
.close:hover { color: var(--nxr-text) !important; }

/* ============================================================
   DROPDOWNS
   ============================================================ */
.dropdown-menu {
  background: var(--nxr-surface) !important;
  border: 1px solid var(--nxr-border2) !important;
  border-radius: var(--nxr-r-lg) !important;
  box-shadow: var(--nxr-shadow2) !important;
  padding: 6px !important;
}
.dropdown-item {
  color: var(--nxr-text2) !important;
  font-size: 13px !important;
  border-radius: var(--nxr-r-md) !important;
  padding: 8px 14px !important;
  transition: all var(--nxr-t) !important;
}
.dropdown-item:hover {
  background: rgba(37,99,235,.15) !important;
  color: var(--nxr-white) !important;
}
.dropdown-item.active {
  background: var(--nxr-blue) !important;
  color: #fff !important;
}
.dropdown-divider { border-color: var(--nxr-border) !important; margin: 4px 0 !important; }
.dropdown-header { color: var(--nxr-text3) !important; font-size: 10px !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: .06em !important; }

/* ============================================================
   TABS
   ============================================================ */
.nav-tabs {
  border-bottom: 1px solid var(--nxr-border) !important;
  gap: 4px !important;
}
.nav-tabs .nav-link {
  color: var(--nxr-text2) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  border: 1px solid transparent !important;
  border-radius: var(--nxr-r-md) var(--nxr-r-md) 0 0 !important;
  padding: 8px 16px !important;
  transition: all var(--nxr-t) !important;
}
.nav-tabs .nav-link:hover {
  color: var(--nxr-text) !important;
  border-color: var(--nxr-border) !important;
  background: rgba(0,0,0,.04) !important;
}
.nav-tabs .nav-link.active {
  background: var(--nxr-surface) !important;
  border-color: var(--nxr-border) var(--nxr-border) var(--nxr-surface) !important;
  color: var(--nxr-blue3) !important;
}
.tab-content { padding-top: 16px !important; }

/* ============================================================
   DASHBOARD TABS — alert dot (per-tab pulsing indicator)
   ============================================================ */
.default-ui .nav-tabs { flex-wrap: wrap !important; }
.default-ui .nav-tabs .nav-link { cursor: pointer; }
.nxr-dot {
  display: inline-block;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--nxr-error, #dc2626);
  vertical-align: middle;
  animation: nxr-dot-pulse 1.5s infinite;
}
@keyframes nxr-dot-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(220,38,38,.55); }
  70%  { box-shadow: 0 0 0 6px rgba(220,38,38,0); }
  100% { box-shadow: 0 0 0 0 rgba(220,38,38,0); }
}
@media (prefers-reduced-motion: reduce) { .nxr-dot { animation: none; } }

/* ============================================================
   REGISTRY OPERATIONS widget — prototype styling + hover
   ============================================================ */
.ops-panel { border: 1px solid var(--nxr-border); border-radius: 10px; padding: 8px 12px 4px; background: var(--nxr-surface); }
.ops-swatch { display: inline-block; width: 9px; height: 9px; border-radius: 2px; margin-right: 7px; transform: translateY(-1px); }
.ops-name { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--nxr-text3); }
.ops-total { margin-left: auto; font-size: 1.35rem; font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums; color: var(--nxr-text); }
.ops-meta { font-size: 10.5px; line-height: 1.2; margin-top: 1px; }
.ops-delta { font-weight: 700; padding: 1px 6px; border-radius: 99px; }
.ops-delta.ops-up   { background: var(--nxr-ok-bg);    color: var(--nxr-ok); }
.ops-delta.ops-down { background: var(--nxr-error-bg); color: var(--nxr-error); }
.ops-delta.ops-flat { background: rgba(0,0,0,.05);     color: var(--nxr-text3); }
.ops-chart { position: relative; min-height: 0; }
.ops-svg { width: 100%; height: 100%; }
.ops-cross { position: absolute; top: 2px; bottom: 2px; width: 1px; background: var(--nxr-text3); opacity: 0; pointer-events: none; transition: opacity .08s; }
.ops-hdot { position: absolute; width: 6px; height: 6px; border-radius: 50%; transform: translate(-50%,-50%); opacity: 0; pointer-events: none; box-shadow: 0 0 0 2px #fff; }
.ops-tip { position: fixed; z-index: 2000; pointer-events: none; background: #0d1b35; color: #fff; border: 1px solid rgba(255,255,255,.14); border-radius: 8px; padding: 6px 9px; font-size: 12px; box-shadow: 0 8px 24px rgba(0,0,0,.4); opacity: 0; transition: opacity .08s; white-space: nowrap; }
.ops-tip b { font-family: 'JetBrains Mono', monospace; font-weight: 600; }
.ops-tip .ops-tip-d { display: block; font-size: 11px; color: #93c5fd; margin-bottom: 2px; }
.ops-scope { font-size: 11.5px; color: var(--nxr-text2); background: var(--nxr-info-bg, rgba(37,99,235,.08)); border: 1px solid rgba(37,99,235,.18); border-radius: 8px; padding: 6px 10px; margin-bottom: 10px; }
.ops-scope .fa { color: var(--nxr-blue); }
.ops-embed-loader { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; background: var(--nxr-surface, #fff); border-radius: 12px; z-index: 3; color: var(--nxr-text3); }
/* Recent Transactions — last-10 table (sits under the sparkline charts) */
.ledger-recent { margin-top: 12px; border-top: 1px solid var(--nxr-border); padding-top: 10px; }
.ledger-recent-head { display: flex; align-items: center; margin-bottom: 4px; padding: 0 2px; }
.ledger-recent-title { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--nxr-text3); }
.ledger-recent-title .fa { color: var(--nxr-blue); }
.ledger-recent-scroll { overflow-x: auto; }
.ledger-recent-table { table-layout: auto; margin-bottom: 0; }
.ledger-recent-table thead th { font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--nxr-text3); border-bottom: 1px solid var(--nxr-border); border-top: none; padding: 4px 10px 6px; }
.ledger-recent-table tbody td { border-top: 1px solid var(--nxr-border); padding: 6px 10px; vertical-align: middle; }
.ledger-recent-table tbody tr:hover td { background: var(--nxr-surface2); }
.ledger-recent-date { font-family: 'JetBrains Mono', monospace; font-size: 11.5px; color: var(--nxr-text2); font-variant-numeric: tabular-nums; }
.ledger-recent-cell { display: flex; align-items: center; gap: 10px; min-width: 0; }
.ledger-recent-body { min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
.ledger-recent-name { font-size: 12.5px; color: var(--nxr-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 360px; }
.ledger-recent-domain { font-family: 'JetBrains Mono', monospace; font-weight: 600; margin-left: 7px; color: var(--nxr-blue); }
.ledger-recent-sub { font-size: 10.5px; color: var(--nxr-text3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 360px; }
.ledger-recent-amt { font-family: 'JetBrains Mono', monospace; font-weight: 700; font-size: 12.5px; font-variant-numeric: tabular-nums; }
.ledger-recent-amt.amt-debit  { color: var(--nxr-text); }
.ledger-recent-amt.amt-credit { color: var(--nxr-ok); }
.ledger-pill { flex: none; display: inline-block; min-width: 62px; text-align: center; font-size: 9.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; padding: 2px 7px; border-radius: 6px; }
.ledger-pill.pill-purchase { color: var(--nxr-blue3); background: var(--nxr-info-bg, rgba(37,99,235,.1)); }
.ledger-pill.pill-payment  { color: var(--nxr-ok);    background: var(--nxr-ok-bg); }
.ledger-pill.pill-refund   { color: var(--nxr-warn);  background: var(--nxr-warn-bg); }
.ledger-pill.pill-debit    { color: var(--nxr-error); background: var(--nxr-error-bg); }
/* Modern Accounts table */
.nxr-acct .nxr-acct-h { font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--nxr-text3); border-bottom: 1px solid var(--nxr-border); padding: 10px 12px 6px; }
.nxr-acct .nxr-acct-zone td { background: var(--nxr-info-bg, rgba(37,99,235,.06)); border-top: 1px solid var(--nxr-border); border-bottom: 1px solid var(--nxr-border); padding: 7px 12px !important; }
.nxr-acct-zchip { display: inline-flex; align-items: center; gap: 8px; font-family: 'JetBrains Mono', monospace; font-weight: 700; font-size: 12.5px; color: var(--nxr-blue, #2563eb); }
.nxr-acct-zbar { width: 3px; height: 13px; border-radius: 2px; background: var(--nxr-blue, #2563eb); display: inline-block; }
.nxr-acct-ztot { font-family: 'JetBrains Mono', monospace; font-size: 11px; color: var(--nxr-text3); font-variant-numeric: tabular-nums; }
.nxr-acct-ztot b { color: var(--nxr-text); font-weight: 700; }
.nxr-acct-dot { font-size: 9px; margin-right: 9px; line-height: 1; }
.nxr-acct .nxr-acct-name { max-width: 320px; }
.default-ui-accounts .nxr-acct td { border-top: none; }

/* ============================================================
   BREADCRUMBS
   ============================================================ */
.breadcrumb {
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  font-size: 12px !important;
}
.breadcrumb-item { color: var(--nxr-text3) !important; }
.breadcrumb-item.active { color: var(--nxr-text2) !important; }
.breadcrumb-item + .breadcrumb-item::before { color: var(--nxr-text3) !important; content: "/" !important; }
.breadcrumb-item a { color: var(--nxr-blue3) !important; }

/* ============================================================
   PROGRESS
   ============================================================ */
.progress {
  background: var(--nxr-surface3) !important;
  border-radius: 99px !important;
  height: 6px !important;
}
.progress-bar {
  background: linear-gradient(90deg, var(--nxr-blue), var(--nxr-blue3)) !important;
  border-radius: 99px !important;
}

/* Tall progress bar (backups + zone generation) so the % number is visible */
.backups-ui .progress,
.zone-file-progress .progress {
  height: 32px !important;
  border-radius: 8px !important;
  background: var(--nxr-surface3) !important;
}
.backups-ui .progress-bar,
.zone-file-progress .progress-bar {
  border-radius: 8px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  padding-right: 10px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  min-width: 56px !important;   /* always show % even at low values */
}

/* Zone generation label */
.zone-file-progress p.text-muted {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--nxr-text2) !important;
  margin-bottom: 8px !important;
}

/* Backups-ui — bigger, clearer text throughout */
.backups-ui .card-body h5.small {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--nxr-text2) !important;
  margin-bottom: 8px !important;
}
.backups-ui .table td,
.backups-ui .table th {
  font-size: 14px !important;
}
.backups-ui .table .text-monospace {
  font-size: 14px !important;
  letter-spacing: 0.01em !important;
}

/* ============================================================
   TOOLTIPS & POPOVERS
   ============================================================ */
.tooltip-inner {
  background: var(--nxr-surface3) !important;
  border: 1px solid var(--nxr-border2) !important;
  color: var(--nxr-text) !important;
  font-size: 12px !important;
  border-radius: var(--nxr-r-md) !important;
  padding: 6px 10px !important;
  box-shadow: var(--nxr-shadow) !important;
}
.popover {
  background: var(--nxr-surface) !important;
  border: 1px solid var(--nxr-border2) !important;
  border-radius: var(--nxr-r-lg) !important;
  box-shadow: var(--nxr-shadow2) !important;
}
.popover-header {
  background: var(--nxr-surface2) !important;
  border-bottom: 1px solid var(--nxr-border) !important;
  color: var(--nxr-text) !important;
  font-weight: 600 !important;
}
.popover-body { color: var(--nxr-text2) !important; font-size: 13px !important; }

/* ============================================================
   UTILITIES — Bootstrap overrides
   ============================================================ */
.text-dark     { color: var(--nxr-text)  !important; }
.text-muted    { color: var(--nxr-text3) !important; }
.text-white    { color: var(--nxr-white) !important; }
.text-primary  { color: var(--nxr-blue3) !important; }
.text-success  { color: var(--nxr-ok)    !important; }
.text-danger   { color: var(--nxr-error) !important; }
.text-warning  { color: var(--nxr-warn)  !important; }
.text-info     { color: var(--nxr-info)  !important; }
.text-secondary{ color: var(--nxr-text2) !important; }

.bg-white   { background: var(--nxr-surface) !important; }
.bg-light   { background: var(--nxr-surface2) !important; }
.bg-dark    { background: var(--nxr-navy) !important; }
.bg-primary { background: var(--nxr-blue) !important; }

.border     { border-color: var(--nxr-border) !important; }
.border-top { border-top-color: var(--nxr-border) !important; }
.border-bottom { border-bottom-color: var(--nxr-border) !important; }

hr { border-color: var(--nxr-border) !important; }

/* ============================================================
   LIST GROUPS
   ============================================================ */
.list-group-item {
  background: var(--nxr-surface) !important;
  border-color: var(--nxr-border) !important;
  color: var(--nxr-text) !important;
  font-size: 13px !important;
  transition: background var(--nxr-t) !important;
}
.list-group-item:hover { background: var(--nxr-surface2) !important; }
.list-group-item.active {
  background: var(--nxr-blue) !important;
  border-color: var(--nxr-blue) !important;
  color: #fff !important;
}

/* ============================================================
   CODE & PRE
   ============================================================ */
code {
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 12px !important;
  background: rgba(37,99,235,.07) !important;
  color: var(--nxr-blue) !important;
  padding: 2px 6px !important;
  border-radius: 4px !important;
  border: 1px solid rgba(37,99,235,.15) !important;
}
pre {
  background: var(--nxr-navy) !important;
  border: 1px solid var(--nxr-border) !important;
  border-radius: var(--nxr-r-md) !important;
  color: var(--nxr-text) !important;
  padding: 16px !important;
  font-size: 12px !important;
  overflow-x: auto !important;
}
pre code { background: none !important; border: none !important; padding: 0 !important; }

/* ============================================================
   LOADING / SPINNER
   ============================================================ */
.spinner-border { color: var(--nxr-blue) !important; }
.spinner-grow   { color: var(--nxr-blue) !important; }

/* Page-level loader overlay */
#nxr-loading-overlay {
  background: rgba(240,244,248,.9) !important;
  backdrop-filter: blur(4px) !important;
}

/* ============================================================
   MAIN CONTENT AREA
   ============================================================ */
main, .main, #content, .page-wrapper, .content-wrapper {
  background: var(--nxr-navy) !important;
  color: var(--nxr-text) !important;
  min-height: 100vh !important;
}

/* ── Navbar breathing room (rev 108) ──────────────────────────────────────────
   MDB's .fixed-sn main rule sets padding-top to clear the fixed navbar.
   We must NOT override that or content slides behind the navbar.
   Instead, add breathing room to the first inner container. ── */
.fixed-sn main > .container-fluid,
.fixed-sn main > .container {
  padding-top: 24px !important;  /* breathing room between navbar clearance and page content */
}

.container-fluid, .container { color: var(--nxr-text) !important; }

/* Page header */
.page-header, .nxr-page-header {
  padding: 20px 0 16px;
  border-bottom: 1px solid var(--nxr-border);
  margin-bottom: 24px;
}
.page-title, .nxr-page-title {
  font-size: 20px !important;
  font-weight: 700 !important;
  color: var(--nxr-text) !important;
  margin: 0 !important;
}

/* ============================================================
   STAT / KPI CARDS (Dashboard)
   ============================================================ */
.nxr-kpi {
  background: var(--nxr-surface);
  border: 1px solid var(--nxr-border);
  border-radius: var(--nxr-r-lg);
  padding: 20px;
  position: relative;
  overflow: hidden;
  transition: transform var(--nxr-t), box-shadow var(--nxr-t);
}
.nxr-kpi:hover {
  transform: translateY(-2px);
  box-shadow: var(--nxr-shadow2);
}
.nxr-kpi-value {
  font-size: 2rem;
  font-weight: 800;
  color: var(--nxr-text);
  line-height: 1;
  margin-bottom: 4px;
}
.nxr-kpi-label {
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--nxr-text3);
}
.nxr-kpi-icon {
  position: absolute;
  right: 16px;
  top: 16px;
  font-size: 24px;
  color: var(--nxr-blue);
  opacity: .4;
}
.nxr-kpi--blue  { border-left: 3px solid var(--nxr-blue); }
.nxr-kpi--green { border-left: 3px solid var(--nxr-ok); }
.nxr-kpi--amber { border-left: 3px solid var(--nxr-warn); }
.nxr-kpi--red   { border-left: 3px solid var(--nxr-error); }

/* ============================================================
   STATUS PILLS
   ============================================================ */
.nxr-status {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 9px;
  border-radius: 99px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .03em;
}
.nxr-status::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
  opacity: .7;
}
.nxr-status--ok     { background: var(--nxr-ok-bg);    color: var(--nxr-ok);    }
.nxr-status--warn   { background: var(--nxr-warn-bg);  color: var(--nxr-warn);  }
.nxr-status--error  { background: var(--nxr-error-bg); color: var(--nxr-error); }
.nxr-status--info   { background: var(--nxr-info-bg);  color: var(--nxr-info);  }
.nxr-status--muted  { background: rgba(0,0,0,.06); color: var(--nxr-text3); }

/* ============================================================
   SEARCH INPUT
   ============================================================ */
.nxr-search {
  position: relative;
  display: flex;
  align-items: center;
}
.nxr-search-input {
  background: var(--nxr-white) !important;
  border: 1px solid var(--nxr-border2) !important;
  border-radius: var(--nxr-r-xl) !important;
  color: var(--nxr-text) !important;
  font-size: 13px !important;
  padding: 8px 16px 8px 36px !important;
  width: 100%;
  transition: border-color var(--nxr-t), box-shadow var(--nxr-t) !important;
}
.nxr-search-input:focus {
  border-color: var(--nxr-blue) !important;
  box-shadow: 0 0 0 3px rgba(37,99,235,.2) !important;
}
.nxr-search-icon {
  position: absolute;
  left: 12px;
  color: var(--nxr-text3);
  font-size: 13px;
  pointer-events: none;
}

/* ============================================================
   RTL SUPPORT
   ============================================================ */
html[dir="rtl"] body          { direction: rtl !important; }
html[dir="rtl"] .text-right   { text-align: left !important; }
html[dir="rtl"] .text-left    { text-align: right !important; }
html[dir="rtl"] .ml-auto      { margin-left: unset !important; margin-right: auto !important; }
html[dir="rtl"] .mr-auto      { margin-right: unset !important; margin-left: auto !important; }
html[dir="rtl"] .pl-3         { padding-left: unset !important; padding-right: 1rem !important; }
html[dir="rtl"] input,
html[dir="rtl"] select,
html[dir="rtl"] textarea       { text-align: right !important; }
html[dir="rtl"] .side-nav .collapsible a { padding-left: 14px !important; padding-right: 42px !important; }
html[dir="rtl"] .dropdown-menu { text-align: right !important; }

/* ============================================================
   CAPTCHA / TURNSTILE
   ============================================================ */
.captcha-input {
  background: var(--nxr-white) !important;
  border: 1px solid var(--nxr-border2) !important;
  border-radius: var(--nxr-r-md) !important;
}

/* Cloudflare Turnstile — stretch to match input width, kill iframe gap */
.cf-turnstile {
  width: 100% !important;
  line-height: 0 !important;   /* kills the inline-block gap below iframe */
  font-size: 0 !important;
}
.cf-turnstile iframe {
  display: block !important;   /* removes bottom inline-block whitespace */
  width: 100% !important;
  border-radius: var(--nxr-r-md) !important;
}

/* Turnstile wrapper — same styling as inputs for visual consistency */
.nxr-auth-card .cf-turnstile,
.nxr-auth-card [data-sitekey] {
  display: block !important;
  width: 100% !important;
  border: 1px solid var(--nxr-border2) !important;
  border-radius: var(--nxr-r-md) !important;
  overflow: hidden !important;
  background: var(--nxr-white) !important;
  line-height: 0 !important;
  font-size: 0 !important;
}

/* Match input width — remove mx-1 margin MDB adds to md-form inside auth card */
.nxr-auth-card .md-form {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Hide the <br> tag the login-form component injects between password and button */
.login-form br {
  display: none !important;
}

/* ============================================================
   SIDEBAR NAVIGATION — NxR classes (replaces MDB collapsible)
   ============================================================ */

/* Collapsible group headers */
.nxr-nav-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 18px;
  color: var(--nxr-text-muted);
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .06em;
  cursor: pointer;
  border-radius: var(--nxr-r-sm);
  transition: background .15s ease, color .15s ease;
  user-select: none;
}
.nxr-nav-header:hover,
.nxr-nav-header.active {
  background: rgba(255,255,255,.12);
  color: var(--nxr-blue-light);
}
.nxr-nav-header .arrow-r::after {
  content: "\f054";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  font-size: 10px;
  margin-left: auto;
  transition: transform .2s ease;
}
.nxr-nav-header.open .arrow-r::after {
  transform: rotate(90deg);
}

/* Sidebar nav links */
.nxr-nav-link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 18px 9px 36px;
  color: var(--nxr-text-muted);
  font-size: 13px;
  border-radius: var(--nxr-r-sm);
  transition: background .15s ease, color .15s ease;
  text-decoration: none !important;
  white-space: nowrap;
  overflow: hidden;
}
.nxr-nav-link:hover {
  background: rgba(37,99,235,.1);
  color: var(--nxr-blue-light);
  text-decoration: none;
}
.nxr-nav-link.active,
.nxr-nav-link.router-link-active {
  background: rgba(255,255,255,.12);
  color: #fff;
}

/* Collapse/expand toggle at bottom of sidebar */
.nxr-toggle {
  padding-left: 18px;
  border-top: 1px solid var(--nxr-border);
  margin-top: 8px;
  padding-top: 10px;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .06em;
}

/* Sidebar domain search */
.nxr-search-form {
  margin: 0;
}
.nxr-search-form input.form-control {
  background: rgba(255,255,255,.04) !important;
  border: 1px solid var(--nxr-border) !important;
  border-radius: var(--nxr-r-sm) !important;
  color: var(--nxr-text) !important;
  padding: 7px 12px !important;
  font-size: 13px !important;
}
.nxr-search-form input.form-control::placeholder { color: var(--nxr-text3) !important; }
.nxr-search-form input.form-control:focus {
  border-color: var(--nxr-blue) !important;
  background: rgba(37,99,235,.06) !important;
  box-shadow: none !important;
  outline: none !important;
}

/* ============================================================
   TABS — NxR styled (replaces md-pills)
   ============================================================ */
.nxr-tabs {
  border-bottom: 1px solid var(--nxr-border2);
  gap: 4px;
  flex-wrap: nowrap;
  overflow-x: auto;
}
.nxr-tabs .nav-item { flex: 1; text-align: center; }
.nxr-tabs .nav-link {
  border: none !important;
  border-radius: var(--nxr-r-sm) var(--nxr-r-sm) 0 0 !important;
  color: var(--nxr-text2) !important;
  padding: 10px 12px !important;
  font-size: 13px !important;        /* was 11px — bumped for readability */
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: .05em !important;
  background: transparent !important;
  transition: color .15s ease, background .15s ease !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
}
/* Cap icon size inside nxr-tabs so icon and label are balanced */
.nxr-tabs .nav-link .fa,
.nxr-tabs .nav-link .fas,
.nxr-tabs .nav-link .far,
.nxr-tabs .nav-link .fab {
  font-size: 20px !important;        /* consistent icon size across all tabs */
  line-height: 1 !important;
}
.nxr-tabs .nav-link:hover {
  color: var(--nxr-blue) !important;
  background: rgba(37,99,235,.06) !important;
}
.nxr-tabs .nav-link.active,
.nxr-tabs .nav-link.active.show {
  color: var(--nxr-blue) !important;
  background: rgba(37,99,235,.08) !important;
  border-bottom: 2px solid var(--nxr-blue) !important;
}

/* ============================================================
   CARD HEADER — NxR gradient (replaces elegant-color-dark)
   ============================================================ */
.nxr-card-header {
  background: #312e81 !important;
  color: #ffffff !important;
  padding: 16px 20px;
  border-radius: var(--nxr-r-lg) var(--nxr-r-lg) 0 0;
  font-weight: 700;
  font-size: 15px;
  border-bottom: 1px solid rgba(255,255,255,.1);
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
/* ============================================================
   PAGE HEADER — icon + title block used on list pages
   ============================================================ */
.nxr-page-icon {
  width: 44px;
  height: 44px;
  background: #312e81;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  color: #fff;
  box-shadow: 0 4px 12px rgba(49,46,129,.3);
  flex-shrink: 0;
}
.nxr-page-title {
  font-size: 18px;
  font-weight: 700;
  color: var(--nxr-text);
  line-height: 1.2;
}
.nxr-page-sub {
  font-size: 12px;
  color: var(--nxr-text-muted);
}

/* ============================================================
   SERVER TABLE — NxR styled rows
   ============================================================ */
.servers-table .table-nxr {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}
.servers-table .table-nxr tbody tr.nxr-server-row {
  border-bottom: 1px solid var(--nxr-border);
  transition: background .12s ease;
}
.servers-table .table-nxr tbody tr.nxr-server-row:last-child {
  border-bottom: none;
}
.servers-table .table-nxr tbody tr.nxr-server-row:hover {
  background: rgba(37,99,235,.05);
}
.servers-table .table-nxr td {
  padding: 12px 10px;
  vertical-align: middle;
  color: var(--nxr-text);
  font-size: 13px;
}

/* Server type icon circle */
.nxr-server-icon {
  width: 34px;
  height: 34px;
  border-radius: 8px;
  background: rgba(37,99,235,.12);
  color: var(--nxr-blue-light);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  flex-shrink: 0;
}

/* ============================================================
   MODAL — NxR light theme
   ============================================================ */
.modal-content {
  background: var(--nxr-surface) !important;
  border: 1px solid var(--nxr-border) !important;
  border-radius: var(--nxr-r-lg) !important;
  box-shadow: var(--nxr-shadow2) !important;
}
.modal-header {
  background: linear-gradient(135deg, #1e40af, #2563eb) !important;
  border-bottom: 1px solid rgba(255,255,255,.1) !important;
  border-radius: var(--nxr-r-lg) var(--nxr-r-lg) 0 0 !important;
  padding: 16px 20px !important;
}
.modal-title, .modal-header .modal-title {
  color: #ffffff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
}
.modal-header .close {
  color: rgba(255,255,255,.8) !important;
  opacity: 1;
  text-shadow: none !important;
  font-size: 1.4rem !important;
}
.modal-header .close:hover { color: #ffffff !important; opacity: 1; }
.modal-body {
  padding: 20px !important;
  color: var(--nxr-text) !important;
}
.modal-footer {
  border-top: 1px solid var(--nxr-border) !important;
  padding: 12px 20px !important;
  background: var(--nxr-surface2) !important;
  border-radius: 0 0 var(--nxr-r-lg) var(--nxr-r-lg) !important;
}
/* Fullscreen statistics modal */
.modal-xl-fs .modal-dialog {
  max-width: 95vw;
  margin: 2vh auto;
}

/* ============================================================
   DROPDOWN — NxR styled
   ============================================================ */
.nxr-dropdown {
  background: var(--nxr-surface) !important;
  border: 1px solid var(--nxr-border2) !important;
  border-radius: var(--nxr-r-md) !important;
  box-shadow: var(--nxr-shadow2) !important;
  padding: 6px !important;
  min-width: 180px;
}
.nxr-dropdown .dropdown-item {
  color: var(--nxr-text2) !important;
  border-radius: 6px !important;
  padding: 7px 12px !important;
  font-size: 12px !important;
  transition: background .12s ease !important;
}
.nxr-dropdown .dropdown-item:hover {
  background: rgba(37,99,235,.08) !important;
  color: var(--nxr-blue) !important;
}
.nxr-dropdown .dropdown-divider {
  border-color: var(--nxr-border) !important;
  margin: 4px 0 !important;
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 992px) {
  .sidebar, .side-nav { width: 100% !important; }
  .card-body { padding: 14px !important; }
  .modal-dialog { margin: 12px !important; }
}

@media (max-width: 576px) {
  .btn { font-size: 12px !important; padding: 6px 12px !important; }
  .card-header { padding: 10px 14px !important; }
  .table thead th, .table tbody td { padding: 8px 10px !important; }
}

/* ============================================================
   BOOTSTRAP 4 GAP UTILITY POLYFILL
   ============================================================ */
.gap-1 { gap: 4px !important; }
.gap-2 { gap: 8px !important; }
.gap-3 { gap: 16px !important; }
.gap-4 { gap: 24px !important; }
.gap-5 { gap: 32px !important; }

/* ============================================================
   NXR DIVIDER
   ============================================================ */
.nxr-divider {
  border: none;
  border-top: 1px solid var(--nxr-border);
  margin: 16px 0;
}

/* ============================================================
   AUTH PAGES — NxR logo mark
   ============================================================ */
.nxr-mark {
  font-family: Inter, system-ui, -apple-system, sans-serif;
  font-size: 2.4rem;
  font-weight: 800;
  letter-spacing: -1.5px;
  line-height: 1;
  display: inline-block;
}
.nxr-mark .L-n { color: #007A3D; }
.nxr-mark .L-x { color: #CE1126; }
.nxr-mark .L-r { color: #0E1012; }

/* ============================================================
   DIAGNOSTIC PAGE
   ============================================================ */
.gap-2.flex-column > .btn { margin-bottom: 6px; }

/* ============================================================
   LAST-RESORT OVERRIDES — placed at end to win cascade order
   Override any residual dark/purple button colors on light theme
   ============================================================ */
.btn-elegant,
.btn.btn-elegant,
button.btn-elegant {
  background:       var(--nxr-blue) !important;
  background-color: var(--nxr-blue) !important;
  border-color:     var(--nxr-blue) !important;
  color: #fff !important;
}
.btn-outline-dark,
.btn.btn-outline-dark,
button.btn-outline-dark {
  background:       var(--nxr-surface2) !important;
  background-color: var(--nxr-surface2) !important;
  border-color:     var(--nxr-border2) !important;
  color:            var(--nxr-text)  !important;
}
.btn-outline-dark:disabled,
.btn-outline-dark[disabled],
button.btn-outline-dark:disabled,
button[disabled].btn-outline-dark {
  background:       var(--nxr-surface2) !important;
  background-color: var(--nxr-surface2) !important;
  border-color:     var(--nxr-border)  !important;
  color:            var(--nxr-text)    !important;
  opacity: 1 !important;
}

/* ============================================================
   NXR UI UPDATE — scoped final overrides
   ============================================================ */

/* Login brand and width alignment */
.nxr-auth-card {
  max-width: 360px !important;
  width: min(360px, calc(100vw - 32px)) !important;
}
.nxr-auth-card .nxr-auth-logo {
  text-align: center !important;
  margin-bottom: 12px !important;
}
.nxr-auth-card .nxr-mark,
.nxr-auth-card .nxr-mark .L-n,
.nxr-auth-card .nxr-mark .L-x,
.nxr-auth-card .nxr-mark .L-r {
  color: #111827 !important;
}
.nxr-auth-card .nxr-product-subtitle {
  margin-top: 8px !important;
  color: #475569 !important;
  font-family: Inter, Arial, system-ui, sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 2.4px !important;
  line-height: 1.25 !important;
}
.nxr-auth-card .nxr-brand-accent {
  display: inline-flex !important;
  justify-content: center !important;
  gap: 4px !important;
  width: 112px !important;
  height: 3px !important;
  margin-top: 10px !important;
  vertical-align: top !important;
}
.nxr-auth-card .nxr-brand-accent span {
  display: block !important;
  height: 3px !important;
  border-radius: 999px !important;
}
.nxr-auth-card .nxr-brand-accent span:nth-child(1),
.nxr-auth-card .nxr-brand-accent span:nth-child(3) { width: 42px !important; background: #0057B8 !important; }
.nxr-auth-card .nxr-brand-accent span:nth-child(2) { width: 18px !important; background: #FECC00 !important; }
.nxr-auth-card #login-form,
.nxr-auth-card .login-form,
.nxr-auth-card .md-form,
.nxr-auth-card .form-control,
.nxr-auth-card .btn,
.nxr-auth-card .cf-turnstile,
.nxr-auth-card [data-sitekey],
.nxr-auth-card .captcha-input {
  width: 100% !important;
  max-width: 300px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.nxr-auth-card .form-control,
.nxr-auth-card input[type="text"],
.nxr-auth-card input[type="password"] {
  height: 42px !important;
  box-shadow: none !important;
  outline: 0 !important;
}
.nxr-auth-card .form-control:focus,
.nxr-auth-card input[type="text"]:focus,
.nxr-auth-card input[type="password"]:focus {
  border-color: #0057B8 !important;
  box-shadow: 0 0 0 2px rgba(0, 87, 184, .16) !important;
  outline: 0 !important;
}
.nxr-auth-card .btn-elegant,
.nxr-auth-card .btn.btn-elegant,
.nxr-auth-card button[type="submit"],
.nxr-auth-card button.btn {
  background-color: #0057B8 !important;
  border-color: #0057B8 !important;
  color: #fff !important;
}

/* Domain/Object/Zone readability without changing unrelated screens */
.domain-ui,
.domain-object,
.domain-object-tags,
.domain-object-status,
.domain-object-tags-history,
.domain-object-transfer,
.zone-ui,
.zone-object {
  font-family: Inter, Arial, system-ui, sans-serif !important;
  color: #111827 !important;
  font-size: 15px !important;
  line-height: 1.55 !important;
}
.domain-ui .card-header,
.domain-object .card-header,
.domain-object-tags .card-header,
.domain-object-status .card-header,
.domain-object-tags-history .card-header,
.domain-object-transfer .card-header,
.zone-ui .card-header,
.zone-object .card-header {
  color: #111827 !important;
  background: #f8fafc !important;
  border-color: #e5e7eb !important;
  font-family: Inter, Arial, system-ui, sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: normal !important;
}
.domain-ui .card-header.elegant-color-dark,
.domain-ui .card-header.primary-color,
.domain-object .card-header.elegant-color-dark,
.domain-object .card-header.primary-color,
.zone-ui .card-header.elegant-color-dark,
.zone-ui .card-header.primary-color,
.zone-object .card-header.elegant-color-dark,
.zone-object .card-header.primary-color {
  color: #fff !important;
}
.domain-ui .text-monospace:not(pre):not(code),
.domain-object .text-monospace:not(pre):not(code),
.domain-object-tags .text-monospace:not(pre):not(code),
.domain-object-status .text-monospace:not(pre):not(code),
.zone-ui .text-monospace:not(pre):not(code),
.zone-object .text-monospace:not(pre):not(code) {
  font-family: Inter, Arial, system-ui, sans-serif !important;
  font-size: 13px !important;        /* was 15px — too large, aligned to body */
}
.domain-ui .table,
.domain-object .table,
.zone-ui .table,
.zone-object .table {
  font-size: 13px !important;        /* was 14px — consistent with global table */
  line-height: 1.5 !important;
}
.domain-ui .table thead th,
.domain-object .table thead th,
.zone-ui .table thead th,
.zone-object .table thead th {
  font-size: 12px !important;
}
.domain-ui .nav-link,
.domain-object .nav-link,
.zone-ui .nav-link,
.zone-object .nav-link,
.domain-ui .dropdown-menu,
.domain-object .dropdown-menu,
.zone-ui .dropdown-menu,
.zone-object .dropdown-menu {
  font-size: 13px !important;
}

/* Flat log/code output rendering for console, XML, journal, daemon views */
.domain-ui pre,
.domain-object pre,
.zone-ui pre,
.zone-object pre,
.console-output,
.xml-output,
.journal-output,
.daemon-output,
.console-line,
.xml-line,
.journal-line,
.daemon-line {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
  font-size: 12.5px !important;
  line-height: 1.45 !important;
}
.console-line,
.xml-line,
.journal-line,
.daemon-line,
.domain-ui .list-group-item.text-monospace,
.domain-object .list-group-item.text-monospace,
.zone-ui .list-group-item.text-monospace,
.zone-object .list-group-item.text-monospace {
  display: block !important;
  margin: 0 !important;
  padding: 3px 8px !important;
  border-radius: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}
.domain-ui pre code,
.domain-object pre code,
.zone-ui pre code,
.zone-object pre code {
  font-family: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
}

/* Bootstrap/MDB tooltip behavior for Domain View actions */
.domain-ui [data-toggle="tooltip"] {
  cursor: help;
}
.tooltip .tooltip-inner {
  background: #111827 !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  border-radius: 6px !important;
  padding: 6px 9px !important;
}


/* ============================================================
   NXR UI UPDATE HOTFIX — compact login rail correction
   Fixes oversized controls from previous override without touching
   registry workflows.
   ============================================================ */
body .nxr-auth-card {
  max-width: 420px !important;
  width: min(420px, calc(100vw - 32px)) !important;
  padding: 34px 34px 32px !important;
  border-radius: 18px !important;
}
body .nxr-auth-card .nxr-auth-logo {
  margin-bottom: 18px !important;
}
body .nxr-auth-card .nxr-mark {
  font-size: 2.35rem !important;
  letter-spacing: -1.2px !important;
}
body .nxr-auth-card .nxr-product-subtitle {
  margin-top: 7px !important;
  font-size: 10.5px !important;
  line-height: 1.2 !important;
  letter-spacing: 2px !important;
  color: #334155 !important;
  white-space: nowrap !important;
}
body .nxr-auth-card .nxr-brand-accent {
  width: 72px !important;
  height: 3px !important;
  margin-top: 12px !important;
  gap: 0 !important;
}
body .nxr-auth-card .nxr-brand-accent span {
  height: 3px !important;
  border-radius: 999px !important;
}
body .nxr-auth-card .nxr-brand-accent span:nth-child(1) { width: 28px !important; background: #0057B8 !important; }
body .nxr-auth-card .nxr-brand-accent span:nth-child(2) { width: 16px !important; background: #FECC00 !important; }
body .nxr-auth-card .nxr-brand-accent span:nth-child(3) { width: 28px !important; background: #0057B8 !important; }
body .nxr-auth-card .nxr-auth-title {
  margin-top: 0 !important;
  margin-bottom: 6px !important;
  font-size: 18px !important;
}
body .nxr-auth-card .nxr-auth-sub {
  max-width: 300px !important;
  margin: 0 auto 18px !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
}
body .nxr-auth-card #login-form,
body .nxr-auth-card .login-form,
body .nxr-auth-card .login-form .md-form,
body .nxr-auth-card .login-form .btn-group,
body .nxr-auth-card .mb-3,
body .nxr-auth-card .cf-turnstile,
body .nxr-auth-card [data-sitekey],
body .nxr-auth-card .captcha-input {
  width: 300px !important;
  max-width: 300px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
body .nxr-auth-card .mb-3,
body .nxr-auth-card .login-form .md-form {
  margin-bottom: 14px !important;
}
body .nxr-auth-card .cf-turnstile,
body .nxr-auth-card [data-sitekey] {
  min-height: 65px !important;
  border-radius: 10px !important;
}
body .nxr-auth-card .cf-turnstile iframe {
  width: 300px !important;
  max-width: 300px !important;
}
body .nxr-auth-card .login-form input.form-control {
  width: 300px !important;
  max-width: 300px !important;
  min-height: 48px !important;
  height: 48px !important;
  padding: 18px 14px 7px 14px !important;
  font-size: 14px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(15, 23, 42, .16) !important;
  box-shadow: none !important;
}
body .nxr-auth-card .login-form .md-form label {
  left: 14px !important;
  transform: translateY(14px) !important;
  font-size: 13px !important;
}
body .nxr-auth-card .login-form .md-form label.active {
  transform: translateY(4px) scale(.78) !important;
}
body .nxr-auth-card .login-form input.form-control:focus {
  border-color: #0057B8 !important;
  box-shadow: 0 0 0 2px rgba(0, 87, 184, .14) !important;
  outline: none !important;
}
body .nxr-auth-card .login-form button[type="submit"],
body .nxr-auth-card .login-form .btn-group > .btn {
  width: 300px !important;
  max-width: 300px !important;
  min-height: 46px !important;
  height: 46px !important;
  padding: 0 16px !important;
  border-radius: 10px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: .02em !important;
  box-shadow: 0 8px 18px rgba(0, 87, 184, .20) !important;
}

/* NxR UI guardrails: pending domain edit states + contained domain text */
.domain-ui .dropdown-menu .dropdown-item.disabled,
.domain-ui .dropdown-menu .dropdown-item:disabled {
  color: #9ca3af !important;
  background-color: transparent !important;
  opacity: .62;
  cursor: not-allowed !important;
  pointer-events: none;
}

.domain-ui .dropdown-menu .dropdown-item.disabled i,
.domain-ui .dropdown-menu .dropdown-item.disabled span {
  color: #9ca3af !important;
}

.domain-ui .card,
.domain-ui .card-body,
.domain-ui .table,
.domain-ui table,
.domain-ui .row,
.domain-ui [class*="col-"] {
  min-width: 0;
}

.domain-ui .card,
.domain-ui .card-body {
  overflow: hidden;
}

.domain-ui table {
  width: 100%;
  table-layout: fixed;
}

.domain-ui td,
.domain-ui th,
.domain-ui .row div,
.domain-ui .card-body div,
.domain-ui .card-body span,
.domain-ui .card-body p,
.domain-ui .list-group-item,
.domain-ui .timeline-body,
.domain-ui .timeline-content {
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.domain-ui td:first-child,
.domain-ui th:first-child {
  width: 165px;
  white-space: normal;
}

.domain-ui code,
.domain-ui pre,
.domain-ui .text-monospace {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* Keep analyzer keyword columns readable. The generic domain detail table
   uses fixed layout for long hashes, but this table needs distinct columns. */
.domain-ui .unicode-sandbox-keywords table,
.domain-object .unicode-sandbox-keywords table {
  table-layout: auto !important;
  width: 100% !important;
}

.domain-ui .unicode-sandbox-keywords th:first-child,
.domain-ui .unicode-sandbox-keywords td:first-child,
.domain-object .unicode-sandbox-keywords th:first-child,
.domain-object .unicode-sandbox-keywords td:first-child {
  width: 22% !important;
  min-width: 180px !important;
  white-space: nowrap !important;
}

.domain-ui .unicode-sandbox-keywords th:nth-child(2),
.domain-ui .unicode-sandbox-keywords td:nth-child(2),
.domain-object .unicode-sandbox-keywords th:nth-child(2),
.domain-object .unicode-sandbox-keywords td:nth-child(2) {
  width: 110px !important;
  min-width: 90px !important;
  text-align: right !important;
  white-space: nowrap !important;
}

.domain-ui .unicode-sandbox-keywords th:nth-child(3),
.domain-ui .unicode-sandbox-keywords td:nth-child(3),
.domain-object .unicode-sandbox-keywords th:nth-child(3),
.domain-object .unicode-sandbox-keywords td:nth-child(3) {
  width: 170px !important;
  min-width: 150px !important;
  white-space: nowrap !important;
}

.domain-ui .unicode-sandbox-keywords th:nth-child(4),
.domain-ui .unicode-sandbox-keywords td:nth-child(4),
.domain-object .unicode-sandbox-keywords th:nth-child(4),
.domain-object .unicode-sandbox-keywords td:nth-child(4) {
  width: auto !important;
  min-width: 260px !important;
  white-space: normal !important;
}

.domain-ui .unicode-sandbox-keywords th:nth-child(5),
.domain-ui .unicode-sandbox-keywords td:nth-child(5),
.domain-object .unicode-sandbox-keywords th:nth-child(5),
.domain-object .unicode-sandbox-keywords td:nth-child(5) {
  width: 56px !important;
  min-width: 48px !important;
  white-space: nowrap !important;
}

/* ============================================================
   NXR UI UPDATE FINAL PASS - scoped portal refinements
   ============================================================ */
body .nxr-auth-card .nxr-auth-logo {
  text-align: center !important;
}

body .nxr-auth-card .nxr-mark,
body .nxr-auth-card .nxr-mark .L-n,
body .nxr-auth-card .nxr-mark .L-x,
body .nxr-auth-card .nxr-mark .L-r {
  color: #111827 !important;
}

body .nxr-auth-card #login-form .login-form,
body .nxr-auth-card #login-form .login-form .md-form,
body .nxr-auth-card #login-form .login-form .btn-group,
body .nxr-auth-card #login-form .login-form input.form-control,
body .nxr-auth-card #login-form .login-form button[type="submit"],
body .nxr-auth-card #login-form .cf-turnstile,
body .nxr-auth-card #login-form [data-sitekey],
body .nxr-auth-card #login-form .captcha-input {
  width: 300px !important;
  max-width: 300px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

body .nxr-auth-card #login-form .login-form input.form-control {
  box-sizing: border-box !important;
  min-height: 46px !important;
  height: 46px !important;
  font-family: Inter, Arial, system-ui, sans-serif !important;
  font-size: 14px !important;
  border: 1px solid rgba(15, 23, 42, .16) !important;
  box-shadow: none !important;
  outline: 0 !important;
}

body .nxr-auth-card #login-form .login-form input.form-control:focus {
  border-color: #0057B8 !important;
  box-shadow: 0 0 0 2px rgba(0, 87, 184, .14) !important;
  outline: 0 !important;
}

body .nxr-auth-card #login-form .login-form button[type="submit"] {
  min-height: 46px !important;
  height: 46px !important;
  background: #0057B8 !important;
  border-color: #0057B8 !important;
  color: #fff !important;
  font-family: Inter, Arial, system-ui, sans-serif !important;
  font-weight: 700 !important;
}

.domain-ui .card-header:not(.elegant-color-dark):not(.primary-color):not(.stylish-color-dark),
.domain-object .card-header:not(.elegant-color-dark):not(.primary-color):not(.stylish-color-dark),
.domain-object-tags .card-header:not(.elegant-color-dark):not(.primary-color):not(.stylish-color-dark),
.domain-object-status .card-header:not(.elegant-color-dark):not(.primary-color):not(.stylish-color-dark),
.zone-ui .card-header:not(.elegant-color-dark):not(.primary-color):not(.stylish-color-dark),
.zone-object .card-header:not(.elegant-color-dark):not(.primary-color):not(.stylish-color-dark) {
  color: #111827 !important;
  background: #eef6ff !important;
  border-color: #bfdbfe !important;
  font-family: Inter, Arial, system-ui, sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
}

.domain-ui,
.domain-ui .small,
.domain-object,
.domain-object .small,
.domain-object-tags,
.domain-object-status,
.zone-ui,
.zone-object {
  font-family: Inter, Arial, system-ui, sans-serif !important;
}

.domain-ui .table td,
.domain-ui .table th,
.domain-object .table td,
.domain-object .table th,
.zone-ui .table td,
.zone-ui .table th,
.zone-object .table td,
.zone-object .table th {
  font-size: 14px !important;
  line-height: 1.5 !important;
}

.domain-ui .table td.text-right,
.domain-ui .table th.text-right,
.domain-object .table td.text-right,
.domain-object .table th.text-right,
.domain-ui .domain-pricing td:last-child,
.domain-ui .domain-pricing th:last-child,
.domain-object .domain-pricing td:last-child,
.domain-object .domain-pricing th:last-child {
  text-align: right !important;
  font-variant-numeric: tabular-nums !important;
}

.domain-ui .text-danger,
.domain-object .text-danger,
.domain-ui .domain-pricing .text-danger,
.domain-object .domain-pricing .text-danger {
  font-weight: 700 !important;
}

.domain-ui .alert,
.domain-object .alert,
.domain-object-tags .alert,
.domain-object-status .alert {
  border-radius: 6px !important;
  font-family: Inter, Arial, system-ui, sans-serif !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
}

.domain-ui .alert-danger,
.domain-object .alert-danger,
.domain-object-tags .alert-danger,
.domain-object-status .alert-danger {
  background: #fff1f2 !important;
  border-color: #fecdd3 !important;
  color: #991b1b !important;
}

.domain-ui .alert-warning,
.domain-object .alert-warning,
.domain-object-tags .alert-warning,
.domain-object-status .alert-warning {
  background: #fff7ed !important;
  border-color: #fed7aa !important;
  color: #9a3412 !important;
}

.domain-ui .alert-success,
.domain-object .alert-success,
.domain-object-tags .alert-success,
.domain-object-status .alert-success {
  background: #ecfdf5 !important;
  border-color: #bbf7d0 !important;
  color: #166534 !important;
}

.domain-ui .alert-info,
.domain-object .alert-info,
.domain-object-tags .alert-info,
.domain-object-status .alert-info,
.domain-ui .alert-light,
.domain-object .alert-light {
  background: #eff6ff !important;
  border-color: #bfdbfe !important;
  color: #1e3a8a !important;
}

.domain-ui pre,
.domain-object pre,
.zone-ui pre,
.zone-object pre,
.CodeMirror,
.CodeMirror pre,
.console-output,
.xml-output,
.journal-output,
.daemon-output {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
  font-size: 12.5px !important;
  line-height: 1.45 !important;
}

.domain-ui .list-group-item.text-monospace,
.domain-object .list-group-item.text-monospace,
.zone-ui .list-group-item.text-monospace,
.zone-object .list-group-item.text-monospace,
.journal-output .list-group-item,
.daemon-output .list-group-item,
.xml-output .list-group-item {
  margin: 0 !important;
  padding: 3px 8px !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.domain-ui [data-toggle="tooltip"],
.domain-ui [title] {
  cursor: help;
}

/* ============================================================
   NXR UI UPDATE FINAL CLAMP - login, pricing, domain state
   ============================================================ */
body .nxr-auth-card {
  max-width: 420px !important;
  width: min(420px, calc(100vw - 32px)) !important;
}

body .nxr-auth-card #login-form,
body .nxr-auth-card #login-form .mb-3,
body .nxr-auth-card #login-form .mb-3 > div,
body .nxr-auth-card #login-form .cf-turnstile,
body .nxr-auth-card #login-form .cf-turnstile iframe,
body .nxr-auth-card #login-form [data-sitekey],
body .nxr-auth-card #login-form .login-form,
body .nxr-auth-card #login-form .login-form .md-form,
body .nxr-auth-card #login-form .login-form .btn-group,
body .nxr-auth-card #login-form .login-form input.form-control,
body .nxr-auth-card #login-form .login-form button[type="submit"] {
  width: 300px !important;
  max-width: 300px !important;
  min-width: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

body .nxr-auth-card #login-form .login-form .md-form {
  height: auto !important;
  margin-top: 0 !important;
  margin-bottom: 12px !important;
}

body .nxr-auth-card #login-form .login-form input.form-control {
  display: block !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 16px 12px 6px !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: none !important;
  outline: 0 !important;
  line-height: 1.2 !important;
}

body .nxr-auth-card #login-form .login-form input.form-control:focus,
body .nxr-auth-card #login-form .login-form input.form-control.focus,
body .nxr-auth-card #login-form .login-form input.form-control.focus-trigger:focus {
  border: 1px solid #0057B8 !important;
  box-shadow: 0 0 0 2px rgba(0, 87, 184, .12) !important;
  outline: 0 !important;
  transform: none !important;
}

body .nxr-auth-card #login-form .login-form .md-form label {
  left: 12px !important;
  max-width: calc(100% - 24px) !important;
  color: #64748b !important;
  font-size: 13px !important;
  line-height: 1 !important;
  pointer-events: none !important;
}

body .nxr-auth-card #login-form .login-form .md-form label.active {
  color: #0057B8 !important;
  transform: translateY(4px) scale(.78) !important;
}

body .nxr-auth-card #login-form .login-form button[type="submit"] {
  height: 44px !important;
  min-height: 44px !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}

.domain-ui .card-header:not(.elegant-color-dark):not(.primary-color):not(.stylish-color-dark),
.domain-object .card-header:not(.elegant-color-dark):not(.primary-color):not(.stylish-color-dark),
.domain-object-tags .card-header:not(.elegant-color-dark):not(.primary-color):not(.stylish-color-dark),
.domain-object-status .card-header:not(.elegant-color-dark):not(.primary-color):not(.stylish-color-dark) {
  background: #dbeafe !important;
  border-color: #93c5fd !important;
  color: #0057B8 !important;
}

.domain-ui .danger-color-dark,
.domain-ui .btn-danger,
.domain-ui .alert-danger,
.domain-object .danger-color-dark,
.domain-object .btn-danger,
.domain-object .alert-danger,
.domain-object-tags .alert-danger,
.domain-object-status .alert-danger {
  background-color: #fee2e2 !important;
  border-color: #ef4444 !important;
  color: #b91c1c !important;
}

.domain-ui .warning-color,
.domain-ui .warning-color-dark,
.domain-ui .btn-amber,
.domain-ui .alert-warning,
.domain-object .warning-color,
.domain-object .warning-color-dark,
.domain-object .btn-amber,
.domain-object .alert-warning,
.domain-object-tags .alert-warning,
.domain-object-status .alert-warning {
  background-color: #fee2e2 !important;
  border-color: #ef4444 !important;
  color: #b91c1c !important;
}

.domain-ui .btn-dark-green,
.domain-ui .alert-success,
.domain-object .btn-dark-green,
.domain-object .alert-success {
  background-color: #dcfce7 !important;
  border-color: #22c55e !important;
  color: #166534 !important;
}

.domain-ui .special-color-dark,
.domain-ui .alert-info,
.domain-ui .alert-light,
.domain-object .special-color-dark,
.domain-object .alert-info,
.domain-object .alert-light {
  background-color: #eff6ff !important;
  border-color: #93c5fd !important;
  color: #1d4ed8 !important;
}

.domain-ui .domain-bar .btn,
.domain-object .domain-bar .btn {
  border: 1px solid currentColor !important;
}

.domain-ui .domain-bar .btn span,
.domain-object .domain-bar .btn span {
  color: inherit !important;
}

.domain-ui .domain-pricing,
.domain-object .domain-pricing {
  font-family: Inter, Arial, system-ui, sans-serif !important;
}

.domain-ui .domain-pricing .alert-warning,
.domain-object .domain-pricing .alert-warning,
.domain-ui .domain-pricing .text-danger,
.domain-object .domain-pricing .text-danger {
  color: #b91c1c !important;
  border-color: #dc2626 !important;
}

.domain-ui .domain-pricing .alert-warning,
.domain-object .domain-pricing .alert-warning {
  background: #fff1f2 !important;
}

.domain-ui .domain-pricing .card,
.domain-object .domain-pricing .card {
  overflow: hidden !important;
}

.domain-ui .domain-pricing table,
.domain-object .domain-pricing table {
  table-layout: auto !important;
  width: 100% !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
}

.domain-ui .domain-pricing th,
.domain-ui .domain-pricing td,
.domain-object .domain-pricing th,
.domain-object .domain-pricing td {
  padding: 9px 12px !important;
  vertical-align: middle !important;
  white-space: nowrap !important;
  font-size: 14px !important;
}

.domain-ui .domain-pricing td:first-child,
.domain-ui .domain-pricing th:first-child,
.domain-object .domain-pricing td:first-child,
.domain-object .domain-pricing th:first-child {
  width: auto !important;
  white-space: normal !important;
}

.domain-ui .domain-pricing td:last-child,
.domain-ui .domain-pricing th:last-child,
.domain-object .domain-pricing td:last-child,
.domain-object .domain-pricing th:last-child,
.domain-ui .domain-pricing td:nth-last-child(-n+3),
.domain-object .domain-pricing td:nth-last-child(-n+3) {
  text-align: right !important;
  font-variant-numeric: tabular-nums !important;
  white-space: nowrap !important;
}

.domain-ui .domain-pricing tfoot td,
.domain-object .domain-pricing tfoot td {
  font-size: 15px !important;
  font-weight: 800 !important;
}

.domain-ui .domain-pricing tfoot td:last-child,
.domain-object .domain-pricing tfoot td:last-child {
  color: #dc2626 !important;
}

.domain-ui td,
.domain-ui th,
.domain-object td,
.domain-object th,
.domain-object-tags td,
.domain-object-status td {
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}

/* ============================================================
   NXR LOG / XML / CONSOLE TEXTAREA FIX
   CodeMirror renders each visual line as <pre>; keep global pre
   card styling away from log editors.
   ============================================================ */
.CodeMirror,
.cm-s-neo.CodeMirror,
.cm-s-lesser-dark.CodeMirror {
  background: #ffffff !important;
  color: #1f2937 !important;
  border: 1px solid #dbe3ee !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
  font-size: 12.5px !important;
  line-height: 1.45 !important;
}

.CodeMirror-scroll {
  background: #ffffff !important;
}

.CodeMirror-lines {
  padding: 8px 0 !important;
}

.CodeMirror-code,
.CodeMirror-code > div,
.CodeMirror-line,
.CodeMirror pre,
.cm-s-neo pre,
.cm-s-lesser-dark pre {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
  padding: 0 8px !important;
  min-height: 0 !important;
  color: inherit !important;
  line-height: inherit !important;
}

.CodeMirror-gutters {
  background: #f8fafc !important;
  border-right: 1px solid #e2e8f0 !important;
  box-shadow: none !important;
}

.CodeMirror-linenumber {
  color: #94a3b8 !important;
  font-size: 12px !important;
}

.CodeMirror-activeline-background,
.CodeMirror-linebackground {
  background: transparent !important;
}

.daemon-ui textarea,
.domain-ui textarea,
.domain-object textarea,
.log-gui-info textarea,
.log-epp-info textarea,
.journal-info textarea,
.console-output,
.xml-output,
.journal-output,
.daemon-output {
  background: #ffffff !important;
  border: 1px solid #dbe3ee !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  color: #1f2937 !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
  font-size: 12.5px !important;
  line-height: 1.45 !important;
  padding: 8px !important;
}

/* Domain action hover helpers */
.domain-ui .domain-action-tooltip {
  display: inline-flex;
  align-items: stretch;
}

.domain-ui .domain-action-tooltip > .btn {
  height: 100%;
}

.tooltip .tooltip-inner {
  max-width: 220px;
  padding: 10px 12px;
  border-radius: 4px;
  background: #111827;
  color: #ffffff;
  font-size: 12.5px;
  line-height: 1.35;
  text-align: center;
  box-shadow: 0 8px 18px rgba(15, 23, 42, .22);
}

.tooltip .tooltip-inner strong {
  display: block;
  margin-bottom: 4px;
  font-weight: 800;
}

/* ── Rev 109: Pricing step visual improvements (CSS-only, no JS changes) ─────────────────── */

/* 1. Current Balance card — strong vivid red gradient (was washed-out pink) */
.domain-ui .domain-pricing .accounts-counter .btn-danger,
.domain-object .domain-pricing .accounts-counter .btn-danger {
  background: linear-gradient(135deg, #b91c1c 0%, #dc2626 100%) !important;
  border: none !important;
  color: #fff !important;
  box-shadow: 0 6px 20px rgba(185, 28, 28, .40) !important;
  border-radius: 8px !important;
}

.domain-ui .domain-pricing .accounts-counter .btn-danger .lead,
.domain-ui .domain-pricing .accounts-counter .btn-danger .font-weight-bold,
.domain-ui .domain-pricing .accounts-counter .btn-danger small,
.domain-ui .domain-pricing .accounts-counter .btn-danger p,
.domain-object .domain-pricing .accounts-counter .btn-danger .lead,
.domain-object .domain-pricing .accounts-counter .btn-danger .font-weight-bold,
.domain-object .domain-pricing .accounts-counter .btn-danger small,
.domain-object .domain-pricing .accounts-counter .btn-danger p {
  color: #fff !important;
  opacity: 1 !important;
}

.domain-ui .domain-pricing th,
.domain-ui .domain-pricing td,
.domain-object .domain-pricing th,
.domain-object .domain-pricing td {
  overflow-wrap: normal !important;
  word-break: normal !important;
}

.domain-ui .domain-pricing td:last-child,
.domain-ui .domain-pricing th:last-child,
.domain-object .domain-pricing td:last-child,
.domain-object .domain-pricing th:last-child {
  min-width: 160px !important;
  width: 160px !important;
  white-space: nowrap !important;
}

.domain-ui .domain-pricing td:nth-child(n+3),
.domain-object .domain-pricing td:nth-child(n+3) {
  min-width: 128px !important;
  width: 128px !important;
  white-space: nowrap !important;
}

.domain-ui .domain-pricing tfoot td:last-child,
.domain-object .domain-pricing tfoot td:last-child {
  color: #b91c1c !important;
  font-weight: 900 !important;
}

/* 2. Warning banner (zero balance / over limit) — stronger left-border style */
.domain-ui .domain-pricing .alert-warning,
.domain-object .domain-pricing .alert-warning {
  background: #fff1f2 !important;
  border: 1px solid #fca5a5 !important;
  border-left: 4px solid #dc2626 !important;
  color: #991b1b !important;
  border-radius: 8px !important;
  padding: 12px 16px !important;
}

.domain-ui .domain-pricing .alert-warning .alert-heading,
.domain-object .domain-pricing .alert-warning .alert-heading {
  color: #b91c1c !important;
  font-weight: 700 !important;
  font-size: 14px !important;
}

/* 3. Period picker card — modern bordered card with larger period number */
.domain-ui .domain-pricing .col-md-3 .card.border.rounded,
.domain-object .domain-pricing .col-md-3 .card.border.rounded {
  border: 2px solid #312e81 !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 12px rgba(49, 46, 129, .12) !important;
}

.domain-ui .domain-pricing .col-md-3 .card .card-body,
.domain-object .domain-pricing .col-md-3 .card .card-body {
  padding: 18px 16px !important;
}

.domain-ui .domain-pricing .col-md-3 .card .lead .font-weight-bold,
.domain-object .domain-pricing .col-md-3 .card .lead .font-weight-bold {
  font-size: 2rem !important;
  color: #312e81 !important;
  font-weight: 800 !important;
}

.domain-ui .domain-pricing .col-md-3 .card .lead .text-muted,
.domain-object .domain-pricing .col-md-3 .card .lead .text-muted {
  color: #64748b !important;
  font-size: 1rem !important;
  font-weight: 500 !important;
}

/* 4. Register wizard action buttons (CONTINUE / DELETE / BACK) */
.register-form .btn.btn-sm.btn-secondary,
.register-form .btn.btn-sm.btn-blue-grey {
  border-radius: 8px !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  padding: 9px 20px !important;
  letter-spacing: .02em !important;
  transition: opacity .15s ease, transform .1s ease !important;
  border: none !important;
}

.register-form .btn.btn-sm.btn-secondary {
  background: #312e81 !important;
  color: #fff !important;
  box-shadow: 0 4px 12px rgba(49, 46, 129, .30) !important;
}

.register-form .btn.btn-sm.btn-secondary:hover {
  background: #1e1b4b !important;
  transform: translateY(-1px) !important;
}

.register-form .btn.btn-sm.btn-blue-grey {
  background: #64748b !important;
  color: #fff !important;
  box-shadow: 0 4px 10px rgba(100, 116, 139, .25) !important;
}

.register-form .btn.btn-sm.btn-blue-grey:hover {
  background: #475569 !important;
  transform: translateY(-1px) !important;
}

/* ── Rev 110: Performance modal — fix ui_select button overflowing modal right edge ─────────
   Bootstrap .row has margin-right: -15px which extends it past the modal boundary.
   The ui_select toggle button (position:absolute; right:0) then lands outside the modal.
   Zeroing the row margins inside this modal keeps everything within bounds.
   Scoped to #create-analysis only — zero impact on any other modal or page. ── */
#create-analysis .modal-body .row {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Domain View notices: expired/warning notices should read warm yellow, not critical red. */
.domain-ui .domain-notices .alert-warning,
.domain-ui .domain-notices .alert-warning *,
.domain-notices .alert-warning,
.domain-notices .alert-warning * {
  color: #854d0e !important;
}

.domain-ui .domain-notices .alert-warning,
.domain-notices .alert-warning {
  background-color: #fefce8 !important;
  border-color: #eab308 !important;
}

/* ============================================================
   PHONE / FAX INPUT — intlTelInput layout
   Strategy: flag container is a FLEX ITEM (not position:absolute).
   The tel input sits naturally to its right — no padding-left trick
   needed. intlTelInput's own JS may set paddingLeft but that only
   adds inner space to the input, it never hides the text.
   ============================================================ */
.phone-ext-input .input-group {
  align-items: stretch !important;
  gap: 0 !important;
}

/* The .iti wrapper becomes a flex row */
.form-group > .iti.form-control,
.phone-ext-input .iti.form-control,
.contacts-form-element .iti.form-control,
.modal .iti.form-control {
  display: flex !important;
  flex-direction: row !important;
  align-items: stretch !important;
  width: 100% !important;
  height: 52px !important;
  min-height: 52px !important;
  padding: 0 !important;
  border: 1px solid #d7dee9 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: none !important;
  overflow: visible !important;
  position: relative !important;
}

.phone-ext-input .iti.form-control {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

/* Flag container: STATIC flex item, not absolute — this is the key fix.
   intlTelInput positions it absolute by default, which requires a large
   padding-left on the input. As a flex item it naturally precedes the input. */
.form-group > .iti.form-control .iti__flag-container,
.phone-ext-input .iti.form-control .iti__flag-container,
.contacts-form-element .iti.form-control .iti__flag-container,
.modal .iti.form-control .iti__flag-container {
  position: relative !important;
  flex: 0 0 auto !important;
  flex-shrink: 0 !important;
  align-self: stretch !important;
  height: 100% !important;
  width: 156px !important;
  max-width: 156px !important;
  overflow: visible !important;
}

/* Focus-within: highlight the whole phone row when input is active */
.form-group > .iti.form-control:focus-within,
.phone-ext-input .iti.form-control:focus-within,
.contacts-form-element .iti.form-control:focus-within,
.modal .iti.form-control:focus-within {
  border-color: var(--nxr-blue) !important;
  box-shadow: 0 0 0 3px rgba(37,99,235,.12) !important;
}

/* Tel input: flex item filling remaining width.
   padding-left:0 because the flag is already a flex sibling to its left. */
.form-group > .iti.form-control input[type="tel"],
.phone-ext-input .iti.form-control input[type="tel"],
.contacts-form-element .iti.form-control input[type="tel"],
.modal .iti.form-control input[type="tel"] {
  flex: 1 1 auto !important;
  width: 0 !important;
  min-width: 0 !important;
  height: 50px !important;
  min-height: 50px !important;
  padding: 0 14px !important;
  line-height: 50px !important;
  border: 0 !important;
  border-radius: 0 8px 8px 0 !important;
  box-shadow: none !important;
  background: #ffffff !important;
  color: #1f2937 !important;
  font-size: 14px !important;
  cursor: text !important;
}
.form-group > .iti.form-control input[type="tel"]::placeholder,
.phone-ext-input .iti.form-control input[type="tel"]::placeholder,
.contacts-form-element .iti.form-control input[type="tel"]::placeholder,
.modal .iti.form-control input[type="tel"]::placeholder {
  color: #9ca3af !important;
  font-size: 14px !important;
}

/* Override any intlTelInput JS-injected padding-left with 0 — layout handles it */
.iti--separate-dial-code.form-control input[type="tel"],
.phone-ext-input .iti--separate-dial-code.form-control input[type="tel"],
.contacts-form-element .iti--separate-dial-code.form-control input[type="tel"],
.modal .iti--separate-dial-code.form-control input[type="tel"] {
  padding-left: 0 !important;
  text-indent: 0 !important;
}

.form-group > .iti.form-control .iti__selected-flag,
.phone-ext-input .iti.form-control .iti__selected-flag,
.contacts-form-element .iti.form-control .iti__selected-flag,
.modal .iti.form-control .iti__selected-flag {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  box-sizing: border-box !important;
  width: 156px !important;
  min-width: 156px !important;
  max-width: 156px !important;
  height: 100% !important;
  padding: 0 16px !important;
  border-right: 1px solid #e2e8f0 !important;
  border-radius: 8px 0 0 8px !important;
  background: #f8fafc !important;
}

.form-group > .iti.form-control .iti__selected-dial-code,
.phone-ext-input .iti.form-control .iti__selected-dial-code,
.contacts-form-element .iti.form-control .iti__selected-dial-code,
.modal .iti.form-control .iti__selected-dial-code {
  margin-left: 6px !important;
  color: #334155 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

.phone-ext-input input[name$="-ext"],
.phone-ext-input input[placeholder="Ext."],
.phone-ext-input input[placeholder="Ext"],
.modal input[name$="-ext"],
.modal input[placeholder="Ext."],
.modal input[placeholder="Ext"] {
  flex: 0 0 112px !important;
  max-width: 112px !important;
  height: 52px !important;
  min-height: 52px !important;
  padding: 0 16px !important;
  line-height: 52px !important;
  border: 1px solid #d7dee9 !important;
  border-radius: 8px !important;
  color: #1f2937 !important;
  font-size: 14px !important;
  box-shadow: none !important;
}

/* Domain View state color: keep headers light blue; color only Service Tags and Status content. */
.domain-ui .card-header:not(.elegant-color-dark):not(.primary-color):not(.stylish-color-dark) {
  background: #eef6ff !important;
  border-color: #93c5fd !important;
  color: #0057B8 !important;
}

.domain-ui .domain-state-panel {
  border-left: 4px solid #93c5fd !important;
}

.domain-ui .domain-state-panel .card-body,
.domain-ui .domain-state-panel .table,
.domain-ui .domain-state-panel .table td,
.domain-ui .domain-state-panel .table th,
.domain-ui .domain-state-panel .table tr,
.domain-ui .domain-state-panel .list-group-item {
  background-color: #eff6ff !important;
}

.domain-ui .domain-tag-panel {
  border-left: 1px solid #e5e7eb !important;
}

.domain-ui .domain-tag-panel .card-body,
.domain-ui .domain-tag-panel .table,
.domain-ui .domain-tag-panel .table td,
.domain-ui .domain-tag-panel .table th,
.domain-ui .domain-tag-panel .table tr,
.domain-ui .domain-tag-panel .list-group-item {
  background-color: #ffffff !important;
}

.domain-ui .domain-tag-panel.tag-state-critical {
  border-left-color: #dc2626 !important;
  border-left-width: 4px !important;
}

.domain-ui .domain-tag-panel.tag-state-critical .card-body,
.domain-ui .domain-tag-panel.tag-state-critical .table,
.domain-ui .domain-tag-panel.tag-state-critical .table td,
.domain-ui .domain-tag-panel.tag-state-critical .table th,
.domain-ui .domain-tag-panel.tag-state-critical .table tr,
.domain-ui .domain-tag-panel.tag-state-critical .list-group-item {
  background-color: #fff1f2 !important;
}

.domain-ui .domain-tag-panel.tag-state-warning {
  border-left-color: #f59e0b !important;
  border-left-width: 4px !important;
}

.domain-ui .domain-tag-panel.tag-state-warning .card-body,
.domain-ui .domain-tag-panel.tag-state-warning .table,
.domain-ui .domain-tag-panel.tag-state-warning .table td,
.domain-ui .domain-tag-panel.tag-state-warning .table th,
.domain-ui .domain-tag-panel.tag-state-warning .table tr,
.domain-ui .domain-tag-panel.tag-state-warning .list-group-item {
  background-color: #fffbeb !important;
}

.domain-ui .domain-tag-panel.tag-state-info {
  border-left-color: #3b82f6 !important;
  border-left-width: 4px !important;
}

.domain-ui .domain-tag-panel.tag-state-info .card-body,
.domain-ui .domain-tag-panel.tag-state-info .table,
.domain-ui .domain-tag-panel.tag-state-info .table td,
.domain-ui .domain-tag-panel.tag-state-info .table th,
.domain-ui .domain-tag-panel.tag-state-info .table tr,
.domain-ui .domain-tag-panel.tag-state-info .list-group-item {
  background-color: #eff6ff !important;
}

.domain-ui.domain-state-ok .domain-state-panel,
.domain-ui[data-domain-state="ok"] .domain-state-panel {
  border-left-color: #22c55e !important;
}

.domain-ui.domain-state-ok .domain-state-panel .card-body,
.domain-ui.domain-state-ok .domain-state-panel .table,
.domain-ui.domain-state-ok .domain-state-panel .table td,
.domain-ui.domain-state-ok .domain-state-panel .table th,
.domain-ui.domain-state-ok .domain-state-panel .table tr,
.domain-ui.domain-state-ok .domain-state-panel .list-group-item,
.domain-ui[data-domain-state="ok"] .domain-state-panel .card-body,
.domain-ui[data-domain-state="ok"] .domain-state-panel .table,
.domain-ui[data-domain-state="ok"] .domain-state-panel .table td,
.domain-ui[data-domain-state="ok"] .domain-state-panel .table th,
.domain-ui[data-domain-state="ok"] .domain-state-panel .table tr,
.domain-ui[data-domain-state="ok"] .domain-state-panel .list-group-item {
  background-color: #f0fdf4 !important;
}

.domain-ui.domain-state-critical .domain-state-panel,
.domain-ui[data-domain-state="critical"] .domain-state-panel {
  border-left-color: #dc2626 !important;
}

.domain-ui.domain-state-critical .domain-state-panel .card-body,
.domain-ui.domain-state-critical .domain-state-panel .table,
.domain-ui.domain-state-critical .domain-state-panel .table td,
.domain-ui.domain-state-critical .domain-state-panel .table th,
.domain-ui.domain-state-critical .domain-state-panel .table tr,
.domain-ui.domain-state-critical .domain-state-panel .list-group-item,
.domain-ui[data-domain-state="critical"] .domain-state-panel .card-body,
.domain-ui[data-domain-state="critical"] .domain-state-panel .table,
.domain-ui[data-domain-state="critical"] .domain-state-panel .table td,
.domain-ui[data-domain-state="critical"] .domain-state-panel .table th,
.domain-ui[data-domain-state="critical"] .domain-state-panel .table tr,
.domain-ui[data-domain-state="critical"] .domain-state-panel .list-group-item {
  background-color: #fff1f2 !important;
}

.domain-ui.domain-state-warning .domain-state-panel,
.domain-ui[data-domain-state="warning"] .domain-state-panel {
  border-left-color: #f59e0b !important;
}

.domain-ui.domain-state-warning .domain-state-panel .card-body,
.domain-ui.domain-state-warning .domain-state-panel .table,
.domain-ui.domain-state-warning .domain-state-panel .table td,
.domain-ui.domain-state-warning .domain-state-panel .table th,
.domain-ui.domain-state-warning .domain-state-panel .table tr,
.domain-ui.domain-state-warning .domain-state-panel .list-group-item,
.domain-ui[data-domain-state="warning"] .domain-state-panel .card-body,
.domain-ui[data-domain-state="warning"] .domain-state-panel .table,
.domain-ui[data-domain-state="warning"] .domain-state-panel .table td,
.domain-ui[data-domain-state="warning"] .domain-state-panel .table th,
.domain-ui[data-domain-state="warning"] .domain-state-panel .table tr,
.domain-ui[data-domain-state="warning"] .domain-state-panel .list-group-item {
  background-color: #fffbeb !important;
}

.domain-ui.domain-state-expired .domain-state-panel,
.domain-ui[data-domain-state="expired"] .domain-state-panel {
  border-left-color: #eab308 !important;
}

.domain-ui.domain-state-expired .domain-state-panel .card-body,
.domain-ui.domain-state-expired .domain-state-panel .table,
.domain-ui.domain-state-expired .domain-state-panel .table td,
.domain-ui.domain-state-expired .domain-state-panel .table th,
.domain-ui.domain-state-expired .domain-state-panel .table tr,
.domain-ui.domain-state-expired .domain-state-panel .list-group-item,
.domain-ui[data-domain-state="expired"] .domain-state-panel .card-body,
.domain-ui[data-domain-state="expired"] .domain-state-panel .table,
.domain-ui[data-domain-state="expired"] .domain-state-panel .table td,
.domain-ui[data-domain-state="expired"] .domain-state-panel .table th,
.domain-ui[data-domain-state="expired"] .domain-state-panel .table tr,
.domain-ui[data-domain-state="expired"] .domain-state-panel .list-group-item {
  background-color: #fefce8 !important;
}


/* Domain View final readability tuning */
.domain-ui .timeline-content,
.domain-ui .timeline-body,
.domain-ui .domain-timeline,
.domain-ui [class*="timeline"] a,
.domain-ui [class*="timeline"] span,
.domain-ui [class*="timeline"] div {
  font-size: 15px !important;
  line-height: 1.45 !important;
  color: #1f2937 !important;
}

.domain-ui .card-body,
.domain-ui .card-body td,
.domain-ui .card-body th,
.domain-ui .card-body p,
.domain-ui .card-body span,
.domain-ui .card-body div,
.domain-ui .table td,
.domain-ui .table th {
  font-size: 13px !important;
  line-height: 1.42 !important;
  color: #1f2937 !important;
}

.domain-ui .text-muted,
.domain-ui .text-monospace,
.domain-ui .domain-info-pointer {
  color: #1f2937 !important;
}

.domain-ui .card-header,
.domain-ui .card-header * {
  font-size: 15px !important;
  line-height: 1.25 !important;
}

/* ============================================================
   DROPDOWN — Option A · Midnight Command
   Deep navy panel · lavender text · cohesive with indigo navbar
   Applied to ALL Bootstrap dropdowns + ui_select menus.
   ============================================================ */

/* ── New design tokens ── */
:root {
  --nxr-dd-bg:       #1a2744;
  --nxr-dd-text:     #c8d0f0;
  --nxr-dd-text2:    #e8ecff;
  --nxr-dd-hover:    rgba(255,255,255,0.09);
  --nxr-dd-active:   rgba(57,73,171,0.55);
  --nxr-dd-divider:  rgba(255,255,255,0.10);
  --nxr-dd-icon:     #7986cb;
  --nxr-dd-danger:   #f87171;
  --nxr-toggle-from: #1a237e;
  --nxr-toggle-to:   #283593;
  --nxr-toggle-bg:   linear-gradient(135deg, #1a237e 0%, #283593 100%);
  --nxr-toggle-bg2:  linear-gradient(135deg, #283593 0%, #3949ab 100%);
}

/* ── Dropdown panel ── */
.dropdown-menu {
  background:    var(--nxr-dd-bg)            !important;
  border:        1px solid rgba(255,255,255,.10) !important;
  border-radius: var(--nxr-r-lg)             !important;
  box-shadow:    0 8px 32px rgba(0,0,0,.28)  !important;
  padding:       6px                         !important;
}

/* ── Items ── */
.dropdown-item {
  color:         var(--nxr-dd-text)          !important;
  font-size:     13px                        !important;
  border-radius: var(--nxr-r-md)             !important;
  padding:       8px 14px                   !important;
  transition:    background var(--nxr-t), color var(--nxr-t) !important;
}
.dropdown-item:hover,
.dropdown-item:focus {
  background: var(--nxr-dd-hover)   !important;
  color:      var(--nxr-dd-text2)   !important;
}
.dropdown-item.active,
.dropdown-item:active {
  background: var(--nxr-dd-active)  !important;
  color:      #fff                  !important;
}
.dropdown-item.disabled,
.dropdown-item:disabled {
  color: rgba(200,208,240,.35)      !important;
}

/* ── Danger / destructive items ── */
.dropdown-item.text-danger,
.dropdown-item[class*="danger"] {
  color: var(--nxr-dd-danger)       !important;
}
.dropdown-item.text-danger:hover {
  background: rgba(220,38,38,.15)   !important;
  color: #fca5a5                    !important;
}

/* ── Icons inside dropdown items ── */
.dropdown-item i,
.dropdown-item .fa,
.dropdown-item .fas,
.dropdown-item .far {
  color:       var(--nxr-dd-icon);
  width:       16px;
  text-align:  center;
}
.dropdown-item.text-danger i,
.dropdown-item.text-danger .fa,
.dropdown-item.text-danger .fas { color: var(--nxr-dd-danger) !important; }

/* ── Divider ── */
.dropdown-divider {
  border-color: var(--nxr-dd-divider) !important;
  margin:       4px 0                 !important;
}

/* ── Header labels ── */
.dropdown-header {
  color:           rgba(200,208,240,.5) !important;
  font-size:       10px                 !important;
  font-weight:     700                  !important;
  text-transform:  uppercase            !important;
  letter-spacing:  .07em                !important;
}

/* ── .nxr-dropdown inherits the same dark style ── */
.nxr-dropdown .dropdown-item {
  color:         var(--nxr-dd-text)  !important;
  border-radius: 6px                 !important;
  padding:       7px 12px            !important;
  font-size:     12px                !important;
}
.nxr-dropdown .dropdown-item:hover {
  background: var(--nxr-dd-hover)    !important;
  color:      var(--nxr-dd-text2)    !important;
}
.nxr-dropdown .dropdown-divider {
  border-color: var(--nxr-dd-divider) !important;
}

/* ── Bootstrap dropdown TOGGLE button ─ btn-secondary variant ──
   Covers: table action ▼ buttons, domain-input .KW ▼ zone selector
   ── */
.btn-secondary.dropdown-toggle,
.btn.dropdown-toggle.btn-secondary {
  background:    var(--nxr-toggle-bg)           !important;
  background-image: var(--nxr-toggle-bg)        !important;
  border-color:  rgba(255,255,255,.15)           !important;
  color:         #e8ecff                         !important;
  box-shadow:    0 2px 8px rgba(26,35,126,.35)   !important;
}
.btn-secondary.dropdown-toggle:hover,
.btn.dropdown-toggle.btn-secondary:hover {
  background:    var(--nxr-toggle-bg2)           !important;
  background-image: var(--nxr-toggle-bg2)        !important;
  color:         #fff                            !important;
  box-shadow:    0 4px 14px rgba(26,35,126,.45)  !important;
}
.show > .btn-secondary.dropdown-toggle {
  background:    var(--nxr-toggle-bg2)           !important;
  background-image: var(--nxr-toggle-bg2)        !important;
  border-color:  rgba(255,255,255,.22)            !important;
  color:         #fff                            !important;
}

/* ── ui_select toggle button (btn.btn-sm.ui-select-button) ── */
.ui-select-button {
  background:    var(--nxr-toggle-bg)            !important;
  background-image: var(--nxr-toggle-bg)         !important;
  border-color:  rgba(255,255,255,.15)            !important;
  color:         #e8ecff                          !important;
  border-left:   1px solid rgba(255,255,255,.12)  !important;
}
.ui-select-button:hover {
  background:    var(--nxr-toggle-bg2)            !important;
  background-image: var(--nxr-toggle-bg2)         !important;
  color:         #fff                             !important;
}

/* ── ui_select dropdown panel ── */
.ui-select-menu {
  background:    var(--nxr-dd-bg)                !important;
  border:        1px solid rgba(255,255,255,.10)  !important;
  border-radius: var(--nxr-r-lg)                 !important;
  box-shadow:    0 8px 32px rgba(0,0,0,.28)       !important;
  max-height:    220px                            !important;
  overflow-y:    auto                             !important;
}
.ui-select-menu .list-group-item {
  background:     transparent                    !important;
  border-color:   rgba(255,255,255,.07)           !important;
  color:          var(--nxr-dd-text)             !important;
  font-size:      13px                           !important;
  transition:     background var(--nxr-t), color var(--nxr-t) !important;
}
.ui-select-menu .list-group-item:hover,
.ui-select-menu .list-group-item:focus {
  background: var(--nxr-dd-hover)    !important;
  color:      var(--nxr-dd-text2)    !important;
}
.ui-select-menu .list-group-item.active {
  background:   rgba(57,73,171,.6)   !important;
  color:        #fff                 !important;
  border-color: transparent          !important;
}

/* ── ui_select search field (dark themed) ── */
.ui-select-search {
  background:   rgba(255,255,255,.07) !important;
  border-color: rgba(255,255,255,.15) !important;
  color:        var(--nxr-dd-text2)   !important;
  border-radius: var(--nxr-r-md)      !important;
}
.ui-select-search::placeholder { color: rgba(200,208,240,.4) !important; }
.ui-select-search:focus {
  background:   rgba(255,255,255,.11) !important;
  border-color: rgba(121,134,203,.6)  !important;
  outline:      none                  !important;
  box-shadow:   none                  !important;
}

/* ── Restore Summernote editor menus (keep white) ── */
.note-editor   .dropdown-menu,
.note-toolbar  .dropdown-menu,
.note-popover  .dropdown-menu { background: #fff !important; border: 1px solid rgba(0,0,0,.15) !important; }
.note-editor   .dropdown-item,
.note-toolbar  .dropdown-item,
.note-popover  .dropdown-item { color: #333 !important; border-radius: 0 !important; }
.note-editor   .dropdown-item:hover,
.note-toolbar  .dropdown-item:hover,
.note-popover  .dropdown-item:hover { background: #f5f5f5 !important; color: #111 !important; }

/* ============================================================
   intlTelInput — z-index fix (rev 101)
   The country-list dropdown was z-index:2 (inline) while the
   Fax field's floating label was position:absolute;z-index:10,
   causing "Fax" text to paint OVER the open Phone country list.
   Fix 1 (CSS): raise .iti__country-list to 1060 as belt-and-
   suspenders for any case where dropdownContainer is not body.
   Fix 2 (JS shared.js): dropdownContainer:document.body appends
   the list to <body> as .iti--container (already z-index:1060)
   so stacking context of sibling fields is irrelevant.
   ============================================================ */
.iti__country-list {
  z-index: 1060 !important;
}
/* .iti--container is already 1060 in phone.css; keep consistent */
.iti--container {
  z-index: 1061 !important;
}

/* ============================================================
   FORM LAYOUT — Option C (rev 105)
   Cap modal widths + 2-column grid for address fields
   ============================================================ */

/* ── Modal width caps ── */
/* Default / modal-sm / modal-lg → 580px */
.modal-dialog {
  max-width: 580px !important;
}
/* Contact wizard uses modal-xl → needs more room for the stepper sidebar */
.modal-dialog.modal-xl {
  max-width: 860px !important;
}
/* Fullscreen stats modal stays at 95vw (already defined, reinforce) */
.modal-xl-fs .modal-dialog {
  max-width: 95vw !important;
}

/* ── 2-col address grid spacing ── */
/* Ensure md-form inside col-md-6 has consistent top margin matching siblings */
.col-md-6 .md-form,
.col-md-6 .form-group {
  margin-top: 0;
}
/* Remove bottom gap on last row of address pairs */
.step-new-content .row:last-of-type .md-form,
.step-new-content .row:last-of-type .form-group,
.contacts-form-element .row:last-of-type .md-form,
.contacts-form-element .row:last-of-type .form-group {
  margin-bottom: 0;
}

/* ============================================================
   NXR CAPTCHA COMPACT BADGE
   ============================================================ */
.nxr-captcha-badge {
  display: flex;
  align-items: center;
  width: 300px;
  height: 64px;
  background: #fff;
  border: 1px solid #d1d5db;
  border-left: 3px solid #0057B8;
  border-radius: 6px;
  padding: 0 14px 0 12px;
  gap: 10px;
  box-shadow: 0 1px 3px rgba(0,0,0,.06);
  box-sizing: border-box;
}
.nxr-badge-icon {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: background .3s;
}
.nxr-badge-pending  { background: #f1f5f9; }
.nxr-badge-verified { background: #f0fdf4; }
.nxr-badge-error    { background: #fef2f2; }
@keyframes nxr-badge-spin { to { transform: rotate(360deg); } }
.nxr-badge-spinner {
  width: 16px;
  height: 16px;
  border: 2px solid #e2e8f0;
  border-top-color: #0057B8;
  border-radius: 50%;
  animation: nxr-badge-spin .8s linear infinite;
}
.nxr-badge-body  { flex: 1; min-width: 0; }
.nxr-badge-title {
  font-size: 12.5px;
  font-weight: 600;
  color: #1e293b;
  white-space: nowrap;
  font-family: Inter, system-ui, -apple-system, sans-serif;
}
.nxr-badge-sub {
  font-size: 10.5px;
  color: #64748b;
  margin-top: 1px;
  white-space: nowrap;
  font-family: Inter, system-ui, -apple-system, sans-serif;
}
.nxr-badge-brand {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
  flex-shrink: 0;
}
.nxr-badge-tag {
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .12em;
  color: #94a3b8;
  text-transform: uppercase;
  line-height: 1;
  font-family: Inter, system-ui, sans-serif;
}
.nxr-badge-links {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  width: 300px;
  margin-top: 4px;
}
.nxr-badge-link {
  font-size: 9px;
  color: #94a3b8;
  text-decoration: none;
  letter-spacing: .04em;
  font-family: Inter, system-ui, sans-serif;
}
.nxr-badge-link:hover { color: #475569; text-decoration: underline; }
body.dark-theme .nxr-captcha-badge,
.dark-theme .nxr-captcha-badge { background:#1e293b; border-color:#334155; border-left-color:#3b82f6; }
body.dark-theme .nxr-badge-title, .dark-theme .nxr-badge-title { color:#f1f5f9; }
body.dark-theme .nxr-badge-sub,   .dark-theme .nxr-badge-sub   { color:#64748b; }
body.dark-theme .nxr-badge-pending,  .dark-theme .nxr-badge-pending  { background:rgba(255,255,255,.06); }
body.dark-theme .nxr-badge-verified, .dark-theme .nxr-badge-verified { background:rgba(74,222,128,.1); }
body.dark-theme .nxr-badge-error,    .dark-theme .nxr-badge-error    { background:rgba(248,113,113,.1); }

/* NXR MCAPTCHA WIDGET WRAPPER — compact checkbox-only view */
.nxr-mcaptcha-wrap {
  position: relative;
  width: 300px;
  height: 65px;          /* show only the checkbox row */
  overflow: hidden;
  border: 1px solid #d1d5db;
  border-left: 3px solid #0057B8;
  border-radius: 6px;
  box-shadow: 0 1px 3px rgba(0,0,0,.06);
  box-sizing: border-box;
  background: #f6f6f6;  /* matches widget inner bg */
}
/* Pull iframe up so the vertically-centred checkbox row sits in the 65px window */
.nxr-mcaptcha-wrap iframe {
  margin-top: -75px;
}
/* Solid overlay that covers the mCaptcha logo / branding on the right */
.nxr-mcaptcha-wrap::after {
  content: '';
  position: absolute;
  top: 0; right: 0;
  width: 100px;
  height: 100%;
  background: #f6f6f6;
  pointer-events: none;  /* clicks still reach the checkbox */
}



/* ── Rev 111: Global modal dropdown overflow fix ─────────────────────────────
   Two related issues seen in every modal that contains MDB material-select:

   Issue 1 — Button bleeds past right edge:
     Bootstrap .row adds margin-right: -15px to compensate for col-* padding.
     Inside a modal with padding: 20px this extends the row 15px beyond the
     modal edge. The MDB select caret button (position:absolute; right:0) then
     renders 15px outside the modal frame. Fix: zero the row gutters inside
     .modal-body across all modals (col-* padding is retained so columns still
     align correctly).

   Issue 2 — Dropdown list extends below modal:
     The MDB .dropdown-content has max-height: 40.625rem (650px), far taller
     than most modals. When a select near the bottom of a modal opens, the list
     overflows below the modal and is clipped by the .modal scroll container.
     Fix: cap the list to 200px with internal scroll inside any modal context.

   Scoped to .modal so page-level selects are unaffected. ── */

/* Fix 1: zero row gutters so absolute-positioned children stay inside modal */
.modal .modal-body .row {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Fix 2: cap dropdown list height and scroll internally */
.modal .dropdown-content.select-dropdown,
.modal ul.dropdown-content,
.modal .dropdown-content {
  max-height: 200px !important;
  overflow-y: auto !important;
}

/* ── Rev 110: extend the Rev 109 credit-tile red to the Register Domain wizard ──────────────

   Rev 109 (above) replaced the washed-out pink credit tiles with a strong red, but scoped it
   to `.domain-ui` / `.domain-object` only.  The Register Domain wizard renders the very same
   <credit-counter> component under a `.register-form` root, so it matched neither selector and
   fell through to the pastel base rule:

       .btn-danger { background: rgba(239,68,68,.15); color: #fca5a5; }

   which is why CURRENT BALANCE / CREDIT LIMIT / AVAILABLE FUNDS render light and low-contrast
   in the registration flow while looking correct elsewhere.

   Scoping to `.accounts-counter` covers the wizard plus any other host of the credit tiles.
   The Rev 109 rules are more specific (4 classes vs 2) so they still win unchanged inside
   `.domain-ui` / `.domain-object` — the declarations here are deliberately identical, so both
   contexts now render the same.  `opacity: 1` is required to cancel the `opacity-70` utility
   class that the component puts on the caption paragraph. ── */

.accounts-counter .btn-danger {
  background: linear-gradient(135deg, #b91c1c 0%, #dc2626 100%) !important;
  border: none !important;
  color: #fff !important;
  box-shadow: 0 6px 20px rgba(185, 28, 28, .40) !important;
  border-radius: 8px !important;
}

.accounts-counter .btn-danger .lead,
.accounts-counter .btn-danger .font-weight-bold,
.accounts-counter .btn-danger small,
.accounts-counter .btn-danger p {
  color: #fff !important;
  opacity: 1 !important;
}

.accounts-counter .btn-danger:hover {
  background: linear-gradient(135deg, #991b1b 0%, #b91c1c 100%) !important;
  border: none !important;
  color: #fff !important;
}

/* ── Rev 111: registrar-facing "Insufficient Credit" notice ─────────────────────────────────

   Deliberately neutral grey rather than the amber `.alert-warning` used by the staff-facing
   `over_credit_limit` / `zero_credit_limit` notices.  For a registrar this is not a fault to
   diagnose — it is simply a statement that the balance does not cover the price — so it should
   read as information, not as an error.  The red is reserved for the balance tiles above it,
   which are the actual numbers at issue.

   Selected in domain-pricing.js and register-ui.js whenever ui.data("admin") is not true. ── */

.nxr-credit-notice {
  background: #f3f4f6 !important;
  border: 1px solid #d1d5db !important;
  border-left: 4px solid #6b7280 !important;
  color: #374151 !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}

.nxr-credit-notice .alert-heading {
  color: #1f2937 !important;
  font-weight: 600 !important;
}

.nxr-credit-notice p {
  color: #4b5563 !important;
  margin-bottom: 0 !important;
}

/* ── Rev 112: Registrar Documentation — inspector report ────────────────────────────────────

   Replaces the raw JSON dump the Inspect tab used to render. Two reasons that mattered: a JSON
   blob is unreadable for the registrar it is aimed at, and it displayed every field the agent
   returned — including registry-internal identifiers. Those are now stripped server-side in
   api/docs.java; this is the presentation half. ── */

.nxr-docs-report .nxr-docs-section {
  border: 1px solid rgba(0, 0, 0, .07);
  border-radius: 8px;
  padding: 14px 16px;
  margin-bottom: 12px;
  background: #ffffff;
}

.nxr-docs-report .nxr-docs-section-title {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .3px;
  text-transform: uppercase;
  color: #4b5563;
  margin: 0 0 10px;
  display: flex;
  align-items: center;
}

/* Neutral identifier pill — domain, zone, EPP status */
.nxr-docs-chip {
  display: inline-block;
  background: #eef3fb;
  color: #2f80ed;
  border-radius: 20px;
  padding: 3px 12px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .2px;
}

/* State badge — delegation / DNSSEC / health */
.nxr-docs-state {
  display: inline-block;
  border-radius: 20px;
  padding: 3px 12px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .3px;
}
.nxr-docs-state--ok   { background: #e7f7ee; color: #1e7d4f; }
.nxr-docs-state--warn { background: #fff4ec; color: #b45309; }
.nxr-docs-state--bad  { background: #fdecec; color: #b91c1c; }

/* Inline yes/no for the nameserver health table */
.nxr-docs-flag {
  font-weight: 700;
  font-size: 11px;
  letter-spacing: .2px;
}
.nxr-docs-flag--yes { color: #1e7d4f; }
.nxr-docs-flag--no  { color: #b91c1c; }

.nxr-docs-report table th {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .3px;
  color: #6b7280;
  border-top: none;
  font-weight: 600;
}

/* Guides and topics list items */
.nxr-docs-item { background: #ffffff; }
.nxr-docs-steps li { line-height: 1.55; }

/* ─────────────────────────────────────────────────────────────────────────────
   CONTACT CREATE FORM — label and help ABOVE the field.

   The contact wizard emits its fields as  <input> <label> <small>  inside a plain
   .form-group, which has no floating-label styling. The label therefore fell into
   normal flow and rendered BELOW its own input, so each label, its description and
   its red validation message sat directly above the NEXT field. Registrars read the
   Name error ("Invalid or empty name string") as an Organization error and typed
   values into the wrong boxes.

   SCOPE: .contact-object-create only -- the root class of the contact-object-create
   component. An earlier attempt targeted .md-form / .form-group globally and broke
   the login card and the create user/group/EPP-client dialog (static labels, collapsed
   password box); that was reverted in 09a5941. Groups containing a <button> or a
   password input are excluded so the auth-code and generator widgets keep their layout.
   Verified against the live stylesheet: contact fields reorder; login card, user dialog
   and the password group are byte-for-byte unaffected.

   Browsers without :has() simply keep the previous rendering.
   ───────────────────────────────────────────────────────────────────────────── */
.contact-object-create .form-group:has(> input.form-control + label):not(:has(button)):not(:has(input[type="password"])) {
  display: flex;
  flex-direction: column;
}
.contact-object-create .form-group:has(> input.form-control + label):not(:has(button)):not(:has(input[type="password"])) > label {
  order: 1;
  position: static !important;
  transform: none !important;
  margin: 0 0 2px 0 !important;
}
.contact-object-create .form-group:has(> input.form-control + label):not(:has(button)):not(:has(input[type="password"])) > small {
  order: 2;
  margin: 0 0 6px 0 !important;
}
.contact-object-create .form-group:has(> input.form-control + label):not(:has(button)):not(:has(input[type="password"])) > input.form-control {
  order: 3;
}
.contact-object-create .form-group:has(> input.form-control + label):not(:has(button)):not(:has(input[type="password"])) > .invalid-feedback {
  order: 4;
}

/* Injected character counter ("0/255") and any other element the component adds to a
   reordered group. Without an explicit order it defaulted to 0 and rendered on top of the
   label; MDB also positions it absolutely. Send it to the end, right-aligned, in flow. */
.contact-object-create .form-group:has(> input.form-control + label):not(:has(button)):not(:has(input[type="password"])) > *:not(label):not(small):not(input):not(.invalid-feedback) {
  order: 9;
  align-self: flex-end;
  position: static !important;
  font-size: .75rem;
  color: #9e9e9e;
}

/* Step instruction ("ASCII contact - ...") in the contact wizard. MDB renders it via
   .step-title:after with content:attr(data-step-label) and position:absolute, so a note long
   enough to wrap overlapped the field below it. Put it in flow and emphasise it -- this line
   is the instruction that stops registrars typing Arabic into the ASCII block. */
.contact-object-create ul.stepper .step-title:after {
  position: static !important;
  font-weight: 600 !important;
  color: #0d2a6b !important;
  margin-top: 2px;
}

/* History/action dropdowns use class "dropdown-menu small"; the generic .small icon-size
   utility (width/height:2.25rem in system.css) was clamping the menu box and overflowing the
   labels. Restore natural sizing so the items fit. */
.dropdown-menu.small{width:auto !important;height:auto !important;min-width:max-content}
.dropdown-menu.small>a,.dropdown-menu.small .dropdown-item{white-space:nowrap}

/* Status-change and service-tag history tables truncate their description/notes column because
   the generic .text-cell utility clamps it to max-width:0 + ellipsis. Show the full text there. */
.status-history .text-cell,.domain-object-tags-history .text-cell{max-width:none !important}
.status-history .text-cell span,.domain-object-tags-history .text-cell span{white-space:normal !important;overflow:visible !important;text-overflow:clip !important;max-width:100% !important;word-break:break-word}

/* History tables can be wider than the modal; keep cells on one line (no clipping) and give the
   table a horizontal scrollbar instead of cutting off the last column. Overrides the wrap above. */
.status-history .text-cell span,.domain-object-tags-history .text-cell span{white-space:nowrap !important;word-break:normal !important}
.status-history,.domain-object-tags-history,.transfer-history,.contact-object-history,.host-object-history,.contact-history,.host-history{overflow-x:auto}
.status-history table,.domain-object-tags-history table,.transfer-history table,.contact-object-history table,.host-object-history table{min-width:max-content}


/* Operator Notes viewer: give the NOTE column the width and let it wrap fully (readable),
   and wrap the long signature so it does not force a wide column and squeeze the note. */
.domain-notes-table th,.domain-notes-table td{vertical-align:top}
.domain-notes-table td.note-cell{white-space:pre-wrap !important;word-break:break-word}
.domain-notes-table td.note-cell span{white-space:pre-wrap !important;word-break:break-word}
.domain-notes-table td.sig-cell,.domain-notes-table td.sig-cell span{white-space:nowrap}
/* scrollX: keep the whole notes table inside the modal, with a horizontal scrollbar */
.domain-object-notes .dataTables_scrollBody{overflow-x:auto !important}
.domain-object-notes .dataTables_wrapper{width:100%;max-width:100%}
.domain-object-notes .dataTables_scrollHead,.domain-object-notes .dataTables_scrollBody{max-width:100% !important}


/* === IRP" marker, append this file,
 *   then bump src/nxrr/root/service/revision.xml <number> (the ?r= cache-buster) so
 *   clients refetch. Static file — no Resin restart.
 * Revert: remove the marker block (or restore a system.nxr-theme.css.bak-* backup).
 * Current: v14 — NxRuntime wordmark + "THE NEXT REGISTRY RUNTIME" tagline; ccTLD wording (was IRP / .sy).
 * See also: memory nxr-ote-login-overlay.
 */

/* === IRP premium split-screen login v14 (teal jasmine + gold line; sequenced reveal; ccTLD wording; NxRuntime wordmark/tagline; remove this block to revert) === */
body.screen:has(.nxr-auth-card){position:relative!important;display:grid!important;grid-template-columns:1.05fr .95fr!important;min-height:100vh;margin:0!important;padding:0!important;background:#fff!important}
body.screen:has(.nxr-auth-card)::before{content:"";display:block;background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20240%2068%27%3E%3Ctext%20x%3D%270%27%20y%3D%2742%27%20font-family%3D%27system-ui%2CSegoe%20UI%2CRoboto%2CArial%2Csans-serif%27%20font-weight%3D%27700%27%20font-size%3D%2720%27%20letter-spacing%3D%270%27%20fill%3D%27%23ffffff%27%3ENxRuntime%3C%2Ftext%3E%3C%2Fsvg%3E") no-repeat left 96px top 44px / 210px auto,url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20560%20200%27%3E%3Ctext%20x%3D%270%27%20y%3D%2716%27%20font-family%3D%27system-ui%2CSegoe%20UI%2CRoboto%2CArial%2Csans-serif%27%20font-weight%3D%27600%27%20font-size%3D%2712%27%20letter-spacing%3D%273%27%20fill%3D%27%232f9179%27%3EACCESS%20POLICY%3C%2Ftext%3E%3Ctext%20x%3D%270%27%20y%3D%2756%27%20font-family%3D%27system-ui%2CSegoe%20UI%2CRoboto%2CArial%2Csans-serif%27%20font-size%3D%2715%27%20fill%3D%27%239fb0bc%27%3EAuthorized%20use%20only.%20Access%20to%20the%20ccTLD%20registry%3C%2Ftext%3E%3Ctext%20x%3D%270%27%20y%3D%2782%27%20font-family%3D%27system-ui%2CSegoe%20UI%2CRoboto%2CArial%2Csans-serif%27%20font-size%3D%2715%27%20fill%3D%27%239fb0bc%27%3Eand%20its%20data%20is%20restricted%2C%20logged%20and%20monitored.%3C%2Ftext%3E%3Ctext%20x%3D%270%27%20y%3D%27108%27%20font-family%3D%27system-ui%2CSegoe%20UI%2CRoboto%2CArial%2Csans-serif%27%20font-size%3D%2715%27%20fill%3D%27%239fb0bc%27%3EUse%20only%20the%20records%20and%20actions%20your%20account%3C%2Ftext%3E%3Ctext%20x%3D%270%27%20y%3D%27134%27%20font-family%3D%27system-ui%2CSegoe%20UI%2CRoboto%2CArial%2Csans-serif%27%20font-size%3D%2715%27%20fill%3D%27%239fb0bc%27%3Epermits%3B%20bulk%20extraction%20or%20unauthorized%3C%2Ftext%3E%3Ctext%20x%3D%270%27%20y%3D%27160%27%20font-family%3D%27system-ui%2CSegoe%20UI%2CRoboto%2CArial%2Csans-serif%27%20font-size%3D%2715%27%20fill%3D%27%239fb0bc%27%3Edisclosure%20of%20registry%20data%20is%20prohibited.%3C%2Ftext%3E%3C%2Fsvg%3E") no-repeat left 48px center / 470px auto,url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20280%2020%27%3E%3Ctext%20x%3D%270%27%20y%3D%2715%27%20font-family%3D%27system-ui%2CSegoe%20UI%2CRoboto%2CArial%2Csans-serif%27%20font-weight%3D%27600%27%20font-size%3D%2712.5%27%20letter-spacing%3D%273%27%20fill%3D%27%232f9179%27%3EEPP%20%C2%B7%20RDAP%20%C2%B7%20ESCROW%3C%2Ftext%3E%3C%2Fsvg%3E") no-repeat left 48px bottom 74px / 250px auto,url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20360%2024%27%3E%3Ctext%20x%3D%270%27%20y%3D%2717%27%20font-family%3D%27system-ui%2CSegoe%20UI%2CRoboto%2CArial%2Csans-serif%27%20font-size%3D%2713%27%20letter-spacing%3D%271%27%20fill%3D%27%237d93a4%27%3ERegistry%20workspace%20%C2%B7%20Secure%20access%3C%2Ftext%3E%3C%2Fsvg%3E") no-repeat left 48px bottom 40px / 300px auto,url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20200%20200%27%3E%3Cg%20fill%3D%27none%27%20stroke%3D%27%23ffffff%27%20stroke-opacity%3D%27.06%27%20stroke-width%3D%272.2%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20transform%3D%27rotate%280%20100%20100%29%27%20d%3D%27M100%20100%20C79%2080%2081%2038%20100%2022%20C119%2038%20121%2080%20100%20100%20Z%27%2F%3E%3Cpath%20transform%3D%27rotate%2860%20100%20100%29%27%20d%3D%27M100%20100%20C79%2080%2081%2038%20100%2022%20C119%2038%20121%2080%20100%20100%20Z%27%2F%3E%3Cpath%20transform%3D%27rotate%28120%20100%20100%29%27%20d%3D%27M100%20100%20C79%2080%2081%2038%20100%2022%20C119%2038%20121%2080%20100%20100%20Z%27%2F%3E%3Cpath%20transform%3D%27rotate%28180%20100%20100%29%27%20d%3D%27M100%20100%20C79%2080%2081%2038%20100%2022%20C119%2038%20121%2080%20100%20100%20Z%27%2F%3E%3Cpath%20transform%3D%27rotate%28240%20100%20100%29%27%20d%3D%27M100%20100%20C79%2080%2081%2038%20100%2022%20C119%2038%20121%2080%20100%20100%20Z%27%2F%3E%3Cpath%20transform%3D%27rotate%28300%20100%20100%29%27%20d%3D%27M100%20100%20C79%2080%2081%2038%20100%2022%20C119%2038%20121%2080%20100%20100%20Z%27%2F%3E%3Ccircle%20cx%3D%27100%27%20cy%3D%27100%27%20r%3D%2712%27%20fill%3D%27none%27%20stroke%3D%27%23ffffff%27%20stroke-opacity%3D%27.06%27%20stroke-width%3D%272.2%27%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat right -190px bottom -200px / 600px auto,#13293b}
body.screen:has(.nxr-auth-card)::after{content:"";position:absolute;left:48px;top:40px;width:42px;height:56px;z-index:2;background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20220%20300%27%3E%3Cg%20fill%3D%27none%27%20stroke%3D%27%2319b391%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20stroke-width%3D%279%27%20d%3D%27M110%2014%20C114%2074%20120%20140%20124%20178%20C150%20176%20186%20184%20203%20193%27%2F%3E%3Cpath%20stroke-width%3D%279%27%20d%3D%27M110%2014%20C106%2074%20100%20140%2096%20178%20C70%20176%2034%20184%2017%20193%27%2F%3E%3Cpath%20stroke-width%3D%279%27%20d%3D%27M110%20288%20C116%20274%20124%20250%20126%20222%20C150%20222%20186%20210%20203%20199%27%2F%3E%3Cpath%20stroke-width%3D%279%27%20d%3D%27M110%20288%20C104%20274%2096%20250%2094%20222%20C70%20222%2034%20210%2017%20199%27%2F%3E%3Cg%20stroke-width%3D%276%27%3E%3Cpath%20d%3D%27M110%20200%20C102%20193%20102%20181%20110%20176%20C118%20181%20118%20193%20110%20200%20Z%27%2F%3E%3Cpath%20transform%3D%27rotate%2872%20110%20200%29%27%20d%3D%27M110%20200%20C102%20193%20102%20181%20110%20176%20C118%20181%20118%20193%20110%20200%20Z%27%2F%3E%3Cpath%20transform%3D%27rotate%28144%20110%20200%29%27%20d%3D%27M110%20200%20C102%20193%20102%20181%20110%20176%20C118%20181%20118%20193%20110%20200%20Z%27%2F%3E%3Cpath%20transform%3D%27rotate%28216%20110%20200%29%27%20d%3D%27M110%20200%20C102%20193%20102%20181%20110%20176%20C118%20181%20118%20193%20110%20200%20Z%27%2F%3E%3Cpath%20transform%3D%27rotate%28288%20110%20200%29%27%20d%3D%27M110%20200%20C102%20193%20102%20181%20110%20176%20C118%20181%20118%20193%20110%20200%20Z%27%2F%3E%3Ccircle%20cx%3D%27110%27%20cy%3D%27200%27%20r%3D%273%27%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center/contain;transform-origin:center;animation:irpLogoIn 1.5s cubic-bezier(.2,.75,.25,1) both}
@keyframes irpLogoIn{0%{opacity:0;transform:perspective(650px) rotateY(0deg) scale(.6)}35%{opacity:1}100%{opacity:1;transform:perspective(650px) rotateY(360deg) scale(1)}}
/* small gold line under logo (lights up after the spin) */
body.screen:has(.nxr-auth-card) main.container::after{content:"";position:absolute;left:52px;top:92px;width:34px;height:6px;z-index:1;background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2040%206%27%3E%3Cline%20x1%3D%273%27%20y1%3D%273%27%20x2%3D%2737%27%20y2%3D%273%27%20stroke%3D%27%23e9bd52%27%20stroke-width%3D%272.6%27%20stroke-linecap%3D%27round%27%2F%3E%3C%2Fsvg%3E") no-repeat center/contain;transform-origin:center;animation:ringGlow 1.3s ease 1.5s both;pointer-events:none}
@keyframes ringGlow{0%{opacity:0;transform:scaleX(.4)}45%{opacity:1;transform:scaleX(1.08);filter:drop-shadow(0 0 8px rgba(233,189,82,.95)) brightness(1.35)}100%{opacity:1;transform:scaleX(1);filter:drop-shadow(0 0 2px rgba(233,189,82,.45))}}

/* tagline "INTELLIGENT REGISTRY PLATFORM" — writes in after the line shines */
body.screen:has(.nxr-auth-card) main.container::before{content:"";position:absolute;left:96px;top:85px;width:220px;height:20px;z-index:1;background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20240%2020%27%3E%3Ctext%20x%3D%271%27%20y%3D%2715%27%20font-family%3D%27system-ui%2CSegoe%20UI%2CRoboto%2CArial%2Csans-serif%27%20font-weight%3D%27600%27%20font-size%3D%279.5%27%20letter-spacing%3D%271%27%20fill%3D%27%23d8ad55%27%3ETHE%20NEXT%20REGISTRY%20RUNTIME%3C%2Ftext%3E%3C%2Fsvg%3E") no-repeat left top / 210px auto;pointer-events:none;animation:taglineIn .7s ease 2.7s both}
@keyframes taglineIn{0%{opacity:0;transform:translateX(6px)}100%{opacity:1;transform:translateX(0)}}
@media (prefers-reduced-motion:reduce){body.screen:has(.nxr-auth-card)::after,body.screen:has(.nxr-auth-card) main.container::after,body.screen:has(.nxr-auth-card) main.container::before{animation:none;opacity:1;filter:none;transform:none}}
body.screen:has(.nxr-auth-card) main.container{max-width:none!important;width:100%!important;height:auto!important;margin:0!important;padding:28px!important;display:flex!important;align-items:center!important;justify-content:center!important}
body.screen:has(.nxr-auth-card) .row{height:auto!important;width:100%!important;margin:0!important;justify-content:center!important;align-items:center!important}
body.screen:has(.nxr-auth-card) .col-lg-5{flex:0 0 auto!important;max-width:420px!important;width:100%!important}
body.screen:has(.nxr-auth-card) .nxr-auth-card{max-width:400px!important;box-shadow:none!important;border:0!important;text-align:left!important;background:transparent!important}
body.screen:has(.nxr-auth-card) .nxr-auth-title{font-size:0!important;text-align:left!important;margin:0 0 6px!important}
body.screen:has(.nxr-auth-card) .nxr-auth-title::before{content:"WELCOME TO NxRuntime";display:block;font:600 11.5px/1 "IBM Plex Sans",system-ui,sans-serif;letter-spacing:.2em;color:#17b090;margin-bottom:10px}
body.screen:has(.nxr-auth-card) .nxr-auth-title::after{content:"Sign in to your workspace";display:block;font:700 31px/1.1 "Sora",system-ui,sans-serif;color:#12283a;letter-spacing:-.01em}
body.screen:has(.nxr-auth-card) .nxr-auth-sub{font-size:0!important;text-align:left!important;margin:8px 0 20px!important}
body.screen:has(.nxr-auth-card) .nxr-auth-sub::after{content:"Use your registry account to continue.";font:400 14.5px/1.5 "IBM Plex Sans",system-ui,sans-serif;color:#6b7884}
body.screen:has(.nxr-auth-card) .nxr-auth-card input{border-radius:11px!important;padding:14px 15px!important}
body.screen:has(.nxr-auth-card) #login-form button[type=submit], body.screen:has(.nxr-auth-card) .nxr-auth-card .btn, body.screen:has(.nxr-auth-card) .nxr-auth-card button.btn-elegant{background:#0d7a63!important;background-color:#0d7a63!important;border-color:#0d7a63!important;color:#fff!important;border-radius:12px!important}
@media(max-width:820px){body.screen:has(.nxr-auth-card){grid-template-columns:1fr!important}body.screen:has(.nxr-auth-card)::before,body.screen:has(.nxr-auth-card)::after,body.screen:has(.nxr-auth-card) main.container::after,body.screen:has(.nxr-auth-card) main.container::before{display:none!important}}


/* Narrow-screen controls must fit the card content box. Leave third-party
   captcha dimensions alone: their responsive behavior belongs to the widget. */
body .nxr-auth-card #login-form,
body .nxr-auth-card #login-form .login-form,
body .nxr-auth-card #login-form .login-form .md-form,
body .nxr-auth-card #login-form .login-form .btn-group,
body .nxr-auth-card #login-form .login-form input.form-control,
body .nxr-auth-card #login-form .login-form button[type="submit"] {
  max-width: 100% !important;
}

/* Keep long action labels readable within small viewports. */
@media (max-width: 575.98px) {
  .dropdown-menu.small {
    min-width: 0 !important;
    max-width: calc(100vw - 32px);
  }
  .dropdown-menu.small > a,
  .dropdown-menu.small .dropdown-item {
    white-space: normal;
    overflow-wrap: anywhere;
  }
}

/* A distinct keyboard indicator, including in the highly-specific login rules. */
body .nxr-auth-card #login-form .login-form input.form-control:focus-visible,
body .nxr-auth-card #login-form .login-form button[type="submit"]:focus-visible,
.dropdown-menu.small > a:focus-visible,
.dropdown-menu.small .dropdown-item:focus-visible {
  outline: 2px solid #0057b8 !important;
  outline-offset: 2px !important;
}



/* NXR portal jasmine theme — matches the deployed login palette.
   Scoped to the authenticated navigation shell; status colors and light
   data-entry surfaces retain their existing semantic styles. */
body:has(.side-nav):not(:has(.nxr-auth-card)) {
  --nxr-sidebar-bg: #13293b;
  --nxr-topbar-bg: #13293b;
  background: #13293b url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20200%20200%27%3E%3Cg%20fill%3D%27none%27%20stroke%3D%27%23ffffff%27%20stroke-opacity%3D%27.06%27%20stroke-width%3D%272.2%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20transform%3D%27rotate%280%20100%20100%29%27%20d%3D%27M100%20100%20C79%2080%2081%2038%20100%2022%20C119%2038%20121%2080%20100%20100%20Z%27%2F%3E%3Cpath%20transform%3D%27rotate%2860%20100%20100%29%27%20d%3D%27M100%20100%20C79%2080%2081%2038%20100%2022%20C119%2038%20121%2080%20100%20100%20Z%27%2F%3E%3Cpath%20transform%3D%27rotate%28120%20100%20100%29%27%20d%3D%27M100%20100%20C79%2080%2081%2038%20100%2022%20C119%2038%20121%2080%20100%20100%20Z%27%2F%3E%3Cpath%20transform%3D%27rotate%28180%20100%20100%29%27%20d%3D%27M100%20100%20C79%2080%2081%2038%20100%2022%20C119%2038%20121%2080%20100%20100%20Z%27%2F%3E%3Cpath%20transform%3D%27rotate%28240%20100%20100%29%27%20d%3D%27M100%20100%20C79%2080%2081%2038%20100%2022%20C119%2038%20121%2080%20100%20100%20Z%27%2F%3E%3Cpath%20transform%3D%27rotate%28300%20100%20100%29%27%20d%3D%27M100%20100%20C79%2080%2081%2038%20100%2022%20C119%2038%20121%2080%20100%20100%20Z%27%2F%3E%3Ccircle%20cx%3D%27100%27%20cy%3D%27100%27%20r%3D%2712%27%20fill%3D%27none%27%20stroke%3D%27%23ffffff%27%20stroke-opacity%3D%27.06%27%20stroke-width%3D%272.2%27%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat right -150px bottom -170px / 650px auto !important;
  background-attachment: fixed !important;
}
body:has(.side-nav):not(:has(.nxr-auth-card)) main {
  background: transparent !important;
}
body:has(.side-nav):not(:has(.nxr-auth-card)) :is(.side-nav, nav.side-nav, .sidenav-bg, .logo-sn, .logo-wrapper, .sn-avatar-wrapper) {
  --nxr-text: #f1f5f9;
  --nxr-text2: #c4d3dc;
  --nxr-text3: #a9bfcc;
  --nxr-surface: #13293b;
  --nxr-surface2: #1c3b4b;
  --nxr-surface3: #1c3b4b;
  --nxr-navy: #13293b;
  --nxr-blue3: #5dd5b8;
  background-color: #13293b !important;
  background-image: none !important;
}
body:has(.side-nav):not(:has(.nxr-auth-card)) :is(.navbar, nav.navbar, .top-nav, .navbar-dark) {
  background: #13293b !important;
  border-bottom: 1px solid rgba(255,255,255,.10) !important;
}
body:has(.side-nav):not(:has(.nxr-auth-card)) .side-nav a.active {
  background-color: #1c4a4d !important;
  color: #fff !important;
}
body:has(.side-nav):not(:has(.nxr-auth-card)) main > :is(h1,h2,h3,h4,h5,h6),
body:has(.side-nav):not(:has(.nxr-auth-card)) main > .container-fluid > :is(h1,h2,h3,h4,h5,h6) {
  color: #f1f5f9 !important;
}
body:has(.side-nav):not(:has(.nxr-auth-card)) footer {
  background: #13293b !important;
  color: #c4d3dc !important;
}
body:has(.side-nav):not(:has(.nxr-auth-card)) footer a { color: #5dd5b8 !important; }
@media (max-width: 575.98px) {
  body:has(.side-nav):not(:has(.nxr-auth-card)) {
    background-size: 380px auto !important;
    background-position: right -130px bottom -100px !important;
    background-attachment: scroll !important;
  }
}
@media print {
  body:has(.side-nav):not(:has(.nxr-auth-card)) { background: white !important; }
}



/* Jasmine readability guard: legacy pages contain unboxed dark labels and
   help text. Keep their existing light canvas; decoration stays outside it.
   Do not set opacity, overflow, positioning or z-index on the content shell:
   descendant menus and modal dialogs must retain their normal behavior. */
body:has(.side-nav):not(:has(.nxr-auth-card)) main > .container-fluid {
  background-color: #f0f4f8 !important;
  color: #1e293b !important;
  border-radius: 12px;
}
/* Undo the earlier white heading exception on the now-light content surface. */
body:has(.side-nav):not(:has(.nxr-auth-card)) main > .container-fluid > :is(h1,h2,h3,h4,h5,h6) {
  color: #1e293b !important;
}