/* Selqon panoramic corporate header
   Visual-only layer. No business logic or navigation behavior is changed. */
body.globalrf-ui {
  --topbar-height: clamp(88px, 9.2vw, 141px);
}

body.globalrf-ui .topbar {
  isolation: isolate;
  min-height: var(--topbar-height);
  color: #FFFFFF;
  background-color: var(--sq-tone-262424, #262424);
  background-image:
    linear-gradient(90deg, rgba(15,15,15,.08) 0%, rgba(15,15,15,.02) 48%, rgba(15,15,15,.10) 100%),
    url("images/selqon-erp-header.fcd84fa33892.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  border-bottom: 1px solid rgba(238,181,12,.72);
  box-shadow: 0 12px 34px rgba(15,15,15,.22);
  backdrop-filter: none;
}

body.globalrf-ui .topbar::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  content: "";
  pointer-events: none;
  background: linear-gradient(90deg, rgba(15,15,15,.18), rgba(15,15,15,.02) 45%, rgba(15,15,15,.12));
}

body.globalrf-ui .topbar > * {
  position: relative;
  z-index: 1;
}

body.globalrf-ui .topbar .breadcrumb {
  color: rgba(255,255,255,.72);
  text-shadow: 0 1px 8px rgba(0,0,0,.55);
}

body.globalrf-ui .topbar .breadcrumb a,
body.globalrf-ui .topbar .breadcrumb strong { color: #FFFFFF; }

body.globalrf-ui .topbar .breadcrumb a:first-child {
  color: #EEB50C;
  font-weight: 760;
  letter-spacing: .05em;
}

body.globalrf-ui .topbar .breadcrumb a:hover { color: #F5BE18; }

body.globalrf-ui .topbar .global-search input {
  color: #FFFFFF;
  background: rgba(38,36,36,.76);
  border-color: rgba(255,255,255,.24);
  box-shadow: 0 8px 24px rgba(0,0,0,.18);
  backdrop-filter: blur(12px) saturate(115%);
}

body.globalrf-ui .topbar .global-search input::placeholder { color: rgba(255,255,255,.66); }

body.globalrf-ui .topbar .global-search input:focus {
  color: #FFFFFF;
  background: rgba(38,36,36,.92);
  border-color: #EEB50C;
  outline-color: rgba(238,181,12,.25);
}

body.globalrf-ui .topbar .global-search svg { color: #EEB50C; }

body.globalrf-ui .topbar .global-search kbd,
body.globalrf-ui .topbar .company-pill {
  color: #FFFFFF;
  background: rgba(38,36,36,.78);
  border-color: rgba(255,255,255,.22);
  box-shadow: 0 6px 18px rgba(0,0,0,.15);
  backdrop-filter: blur(10px);
}

body.globalrf-ui .topbar .company-pill { font-weight: 680; }

body.globalrf-ui .topbar .mobile-menu-button {
  color: #FFFFFF;
  background: rgba(38,36,36,.74);
  border-color: rgba(255,255,255,.22);
}

body.globalrf-ui .topbar .quick-create > summary {
  color: var(--sq-tone-262424, #262424);
  background: #EEB50C;
  border-color: #EEB50C;
  box-shadow: 0 8px 22px rgba(238,181,12,.22);
}

body.globalrf-ui .topbar .quick-create > summary:hover {
  background: #F5BE18;
  border-color: #F5BE18;
}

body.globalrf-ui .topbar .user-avatar {
  color: var(--sq-tone-262424, #262424);
  background: #EEB50C;
  border-color: rgba(255,255,255,.65);
  box-shadow: 0 7px 18px rgba(0,0,0,.26);
}

body.globalrf-ui .topbar .topbar-menu {
  color: #FFFFFF;
  background: rgba(38,36,36,.98);
  border-color: rgba(238,181,12,.38);
  box-shadow: 0 20px 48px rgba(0,0,0,.34);
  backdrop-filter: blur(14px);
}

body.globalrf-ui .topbar .topbar-menu a,
body.globalrf-ui .topbar .topbar-menu button,
body.globalrf-ui .topbar .user-menu-identity strong { color: #FFFFFF; }

body.globalrf-ui .topbar .topbar-menu a:hover,
body.globalrf-ui .topbar .topbar-menu button:hover {
  color: var(--sq-tone-262424, #262424);
  background: #EEB50C;
}

body.globalrf-ui .topbar .user-menu-identity { border-bottom-color: rgba(255,255,255,.16); }
body.globalrf-ui .topbar .user-menu-identity span { color: rgba(255,255,255,.66); }

body.globalrf-ui.globalrf-dark-context .topbar {
  background-color: var(--sq-tone-262424, #262424);
  background-image:
    linear-gradient(90deg, rgba(15,15,15,.08) 0%, rgba(15,15,15,.02) 48%, rgba(15,15,15,.10) 100%),
    url("images/selqon-erp-header.fcd84fa33892.png");
  border-bottom-color: rgba(238,181,12,.72);
}

@media (max-width: 1200px) {
  body.globalrf-ui .topbar { background-position: 58% center; }
}

@media (max-width: 800px) {
  body.globalrf-ui { --topbar-height: 92px; }
  body.globalrf-ui .topbar { background-position: 66% center; }
}

@media (max-width: 680px) {
  body.globalrf-ui { --topbar-height: 78px; }
  body.globalrf-ui .topbar {
    background-position: 76% center;
    box-shadow: 0 8px 24px rgba(15,15,15,.22);
  }
  body.globalrf-ui .topbar .global-search input {
    min-height: 36px;
    height: 36px;
  }
}

@media print {
  body.globalrf-ui .topbar {
    background: none !important;
    box-shadow: none !important;
  }
}

/* SELQON Nexus Header — shared contextual page header */
body.globalrf-ui .page-header {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: clamp(218px, 18vw, 292px);
  margin: 0 auto 22px;
  padding: clamp(34px, 4.4vw, 66px) clamp(30px, 6vw, 90px);
  align-items: center;
  color: #FFFFFF;
  border: 1px solid rgba(238,181,12,.42);
  border-left: 7px solid #EEB50C;
  border-bottom: 3px solid #EEB50C;
  border-radius: 0 14px 14px 0;
  background:
    radial-gradient(ellipse at 38% 45%, rgba(80,79,78,.22), transparent 42%),
    linear-gradient(104deg, #121313 0%, #1A1B1C 44%, #111213 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    inset 0 -1px 0 rgba(238,181,12,.20),
    0 20px 46px rgba(15,15,15,.24),
    -8px 0 24px rgba(238,181,12,.18);
}

body.globalrf-ui .page-header::before {
  position: absolute;
  z-index: -2;
  inset: 0 0 0 38%;
  content: "";
  pointer-events: none;
  opacity: .94;
  background:
    linear-gradient(145deg, transparent 0 61%, rgba(238,181,12,.74) 61.1% 61.4%, transparent 61.55%) 0 0 / 58% 62% no-repeat,
    linear-gradient(18deg, transparent 0 48%, rgba(238,181,12,.46) 48.1% 48.35%, transparent 48.5%) 54% 58% / 45% 38% no-repeat,
    linear-gradient(134deg, transparent 0 50%, rgba(80,79,78,.78) 50.2% 61%, rgba(238,181,12,.88) 61.2% 61.7%, rgba(38,36,36,.88) 61.9% 72%, transparent 72.2%) right center / 62% 100% no-repeat,
    radial-gradient(circle at center, rgba(238,181,12,.92) 0 1px, rgba(238,181,12,.10) 1.4px, transparent 2px) 0 40% / 12px 12px;
  -webkit-mask-image:
    radial-gradient(ellipse 68% 47% at 44% 54%, #000 0 55%, transparent 76%),
    linear-gradient(90deg, transparent 0%, #000 22%, #000 100%);
  mask-image:
    radial-gradient(ellipse 68% 47% at 44% 54%, #000 0 55%, transparent 76%),
    linear-gradient(90deg, transparent 0%, #000 22%, #000 100%);
  -webkit-mask-composite: source-over;
  mask-composite: add;
}

body.globalrf-ui .page-header::after {
  position: absolute;
  z-index: -1;
  inset: 15px 18px 14px 22px;
  content: "";
  pointer-events: none;
  border-top: 1px solid rgba(255,255,255,.07);
  border-right: 1px solid rgba(238,181,12,.34);
  background:
    linear-gradient(90deg, #EEB50C 0 70px, transparent 70px) left 54px top 62px / 108px 2px no-repeat,
    linear-gradient(90deg, rgba(238,181,12,.72), rgba(238,181,12,0)) 62% 34% / 17% 1px no-repeat,
    linear-gradient(90deg, rgba(255,255,255,.24), rgba(255,255,255,0)) 66% 59% / 15% 1px no-repeat,
    linear-gradient(90deg, rgba(238,181,12,.72), rgba(238,181,12,0)) 74% 78% / 14% 1px no-repeat;
  clip-path: polygon(0 0, 100% 0, 100% 68%, 94% 100%, 65% 100%, 63.5% 96%, 0 96%, 0 86%, 1.3% 80%, 1.3% 16%);
}

body.globalrf-ui .page-header > * {
  position: relative;
  z-index: 2;
}

body.globalrf-ui .page-header > div:first-child { max-width: min(66%, 820px); }

body.globalrf-ui .page-header .eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 22px;
  color: #EEB50C;
  font-size: clamp(10px, .78vw, 13px);
  font-weight: 760;
  letter-spacing: .22em;
  line-height: 1.2;
  text-transform: uppercase;
}

body.globalrf-ui .page-header .eyebrow::before {
  width: 16px;
  height: 16px;
  content: "";
  border: 2px solid #EEB50C;
  border-radius: 3px 3px 9px 3px;
  box-shadow: 0 0 0 4px rgba(238,181,12,.07), 0 0 18px rgba(238,181,12,.28);
  transform: rotate(45deg);
}

body.globalrf-ui .page-header h1 {
  margin: 0;
  color: #FFFFFF;
  font-size: clamp(38px, 4.1vw, 66px);
  font-weight: 760;
  letter-spacing: -.045em;
  line-height: .98;
  text-shadow: 0 8px 30px rgba(0,0,0,.44);
}

body.globalrf-ui .page-header p:not(.eyebrow) {
  max-width: 780px;
  margin: 18px 0 0;
  color: rgba(255,255,255,.70);
  font-size: clamp(14px, 1.15vw, 18px);
  line-height: 1.5;
}

body.globalrf-ui .page-header .button-row,
body.globalrf-ui .page-header > a,
body.globalrf-ui .page-header > button { align-self: center; }

body.globalrf-ui .page-header .button,
body.globalrf-ui .page-header > a.button,
body.globalrf-ui .page-header > .secondary-button,
body.globalrf-ui .page-header > button {
  min-height: 58px;
  padding: 0 28px;
  color: #FFFFFF;
  border: 1px solid rgba(238,181,12,.70);
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(38,36,36,.94), rgba(17,18,19,.92));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 12px 30px rgba(0,0,0,.24), 0 0 22px rgba(238,181,12,.07);
  backdrop-filter: blur(12px);
}

body.globalrf-ui .page-header .button::before,
body.globalrf-ui .page-header > a.button::before,
body.globalrf-ui .page-header > .secondary-button::before,
body.globalrf-ui .page-header > button::before {
  width: 13px;
  height: 13px;
  margin-right: 11px;
  content: "";
  border: 2px solid rgba(238,181,12,.48);
  border-radius: 50%;
  background: #EEB50C;
  box-shadow: 0 0 14px rgba(238,181,12,.52);
}

body.globalrf-ui .page-header .button:hover,
body.globalrf-ui .page-header > a.button:hover,
body.globalrf-ui .page-header > button:hover {
  color: var(--sq-tone-262424, #262424);
  border-color: #F5BE18;
  background: #EEB50C;
  box-shadow: 0 14px 34px rgba(238,181,12,.24);
  transform: translateY(-2px);
}

body.globalrf-ui .page-header + .section-tabs,
body.globalrf-ui .page-header + .tabs,
body.globalrf-ui .page-header + nav {
  position: relative;
  z-index: 3;
  top: auto;
  bottom: auto;
}

@media (max-width: 1000px) {
  body.globalrf-ui .page-header {
    min-height: 212px;
    padding: 34px 30px 38px 44px;
  }
  body.globalrf-ui .page-header::before { inset: 0 0 0 46%; opacity: .72; }
  body.globalrf-ui .page-header > div:first-child { max-width: 70%; }
  body.globalrf-ui .page-header h1 { font-size: clamp(34px, 5vw, 50px); }
}

@media (max-width: 680px) {
  body.globalrf-ui .page-header {
    display: block;
    min-height: 0;
    padding: 30px 22px 32px 28px;
    border-left-width: 5px;
    border-radius: 0 12px 12px 0;
  }
  body.globalrf-ui .page-header::before {
    inset: 0 0 0 46%;
    opacity: .34;
  }
  body.globalrf-ui .page-header::after {
    inset: 10px 10px 10px 12px;
    opacity: .55;
  }
  body.globalrf-ui .page-header > div:first-child { max-width: 100%; }
  body.globalrf-ui .page-header .eyebrow { margin-bottom: 15px; }
  body.globalrf-ui .page-header h1 { font-size: 34px; }
  body.globalrf-ui .page-header p:not(.eyebrow) { font-size: 14px; }
  body.globalrf-ui .page-header .button-row { margin-top: 22px; }
  body.globalrf-ui .page-header .button,
  body.globalrf-ui .page-header > a.button,
  body.globalrf-ui .page-header > button { min-height: 46px; padding: 0 18px; }
}

@media (prefers-reduced-motion: reduce) {
  body.globalrf-ui .page-header .button,
  body.globalrf-ui .page-header > a.button,
  body.globalrf-ui .page-header > button { transition: none; }
}

@media print {
  body.globalrf-ui .page-header {
    min-height: 0;
    color: var(--sq-tone-262424, #262424);
    border: 1px solid #D8D5CF;
    border-left: 5px solid var(--sq-tone-262424, #262424);
    border-bottom: 2px solid var(--sq-tone-262424, #262424);
    background: #FFFFFF !important;
    box-shadow: none;
  }
  body.globalrf-ui .page-header h1 { color: var(--sq-tone-262424, #262424); text-shadow: none; }
  body.globalrf-ui .page-header p:not(.eyebrow) { color: #5E6470; }
  body.globalrf-ui .page-header::before,
  body.globalrf-ui .page-header::after { display: none; }
}

/* 2026-09-21 - Visual coherence without navigation changes */
body.globalrf-ui .app-shell > .sidebar {
  background-color: var(--sq-tone-171717, #171717);
  background-image:
    radial-gradient(circle at 18% 8%, rgba(238,181,12,.11), transparent 27%),
    radial-gradient(circle, rgba(238,181,12,.055) 0 1px, transparent 1.5px),
    linear-gradient(142deg, transparent 0 66%, rgba(238,181,12,.12) 66.15% 66.38%, transparent 66.55%),
    linear-gradient(180deg, #111212 0%, #1B1A1A 54%, #262424 100%);
  background-size: auto, 20px 20px, 100% 100%, 100% 100%;
  border-right: 1px solid rgba(238,181,12,.24);
  box-shadow: 12px 0 34px rgba(15,15,15,.20);
}

body.globalrf-ui .sidebar .brand-mark {
  box-shadow: 0 0 0 1px rgba(255,255,255,.16), 0 10px 26px rgba(238,181,12,.18);
}

body.globalrf-ui .sidebar .nav-section-title {
  color: rgba(238,181,12,.72);
}

body.globalrf-ui .sidebar .nav-link {
  color: rgba(247,246,242,.78);
  border: 1px solid transparent;
}

body.globalrf-ui .sidebar .nav-link:hover {
  color: #FFFFFF;
  background: rgba(255,255,255,.065);
  border-color: rgba(255,255,255,.06);
}

body.globalrf-ui .sidebar .nav-link.active {
  color: #FFFFFF;
  background: linear-gradient(90deg, rgba(238,181,12,.18), rgba(80,79,78,.26));
  border-color: rgba(238,181,12,.22);
  box-shadow: inset 3px 0 0 #EEB50C, 0 8px 20px rgba(0,0,0,.10);
}

body.globalrf-ui .sidebar .nav-link.active::after {
  background: #EEB50C;
  box-shadow: 0 0 12px rgba(238,181,12,.46);
}

body.globalrf-ui .sidebar .sidebar-user {
  border-top-color: rgba(238,181,12,.20);
}

body.globalrf-ui .sidebar .sidebar-nav {
  scrollbar-color: rgba(238,181,12,.44) transparent;
}

/* Keep the established page access and action distribution. */
body.globalrf-ui main#main-content > .page-header {
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

body.globalrf-ui main#main-content > .page-header > div:first-child {
  box-sizing: border-box;
  max-width: min(66%, 820px);
  padding-left: clamp(28px, 3.2vw, 48px);
  padding-right: 22px;
  text-align: left;
}

body.globalrf-ui main#main-content > .page-header .button-row,
body.globalrf-ui main#main-content > .page-header > a,
body.globalrf-ui main#main-content > .page-header > button {
  align-self: flex-start;
}

/* Restore the original SELQON action buttons inside contextual headers. */
body.globalrf-ui main#main-content > .page-header .primary-button,
body.globalrf-ui main#main-content > .page-header .secondary-button {
  min-height: 38px;
  padding: 7px 13px;
  border-radius: 7px;
  box-shadow: none;
  backdrop-filter: none;
  transform: none;
}

body.globalrf-ui main#main-content > .page-header .primary-button {
  color: var(--sq-tone-181818, #181818);
  background: var(--accent);
  border: 1px solid var(--accent);
}

body.globalrf-ui main#main-content > .page-header .primary-button:hover {
  color: var(--sq-tone-181818, #181818);
  background: var(--grf-yellow-hover);
  border-color: var(--grf-yellow-hover);
  box-shadow: none;
  transform: none;
}

body.globalrf-ui main#main-content > .page-header .secondary-button {
  color: var(--ink);
  background: var(--surface);
  border: 1px solid var(--line);
}

body.globalrf-ui main#main-content > .page-header .secondary-button:hover {
  color: var(--ink);
  background: var(--surface-secondary);
  border-color: #cfd3d8;
  box-shadow: none;
  transform: none;
}

body.globalrf-ui main#main-content > .page-header .primary-button::before,
body.globalrf-ui main#main-content > .page-header .secondary-button::before {
  display: none;
  content: none;
}

@media (max-width: 680px) {
  body.globalrf-ui main#main-content > .page-header > div:first-child {
    max-width: 100%;
    padding-left: 20px;
    padding-right: 18px;
  }

  body.globalrf-ui main#main-content > .page-header .button-row,
  body.globalrf-ui main#main-content > .page-header > a,
  body.globalrf-ui main#main-content > .page-header > button {
    margin-top: 20px;
    margin-left: 20px;
  }
}
