@import url("./loading.css");

*,
*::before,
*::after {
  box-sizing: border-box;
}

html,
body {
  width: 100%;
  max-width: 100%;
  min-height: 100%;
  margin: 0;
  padding: 0;
  overflow-x: clip;
  font-family: Arial, Helvetica, sans-serif;
  background: #0f172a;
  color: #e5e7eb;
}

body {
  min-height: 100vh;
}

#app {
  width: 100%;
  max-width: 100%;
  min-height: 100vh;
  overflow-x: clip;
}

.nexus-app {
  width: 100%;
  max-width: 100%;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  overflow-x: clip;
}

@supports not (overflow: clip) {
  html,
  body,
  #app,
  .nexus-app {
    overflow-x: hidden;
  }
}

.nexus-app-header {
  width: 100%;
  max-width: 100%;
  background: #111827;
  border-bottom: 1px solid #1f2937;
  padding: 16px 20px;
  min-width: 0;
}

.nexus-app[data-nx-header-sticky="true"] > .nexus-app-header {
  position: sticky;
  top: var(--nx-header-sticky-top, 0px);
  z-index: var(--nx-header-sticky-z-index, var(--nx-z-sticky, 1100));
}

.nexus-app[data-nx-header-sticky="true"] > .nexus-app-header > :is(header, [data-module*="header"]) {
  position: sticky;
  top: var(--nx-header-sticky-top, 0px);
  z-index: var(--nx-header-sticky-z-index, var(--nx-z-sticky, 1100));
}

.nexus-app[data-nx-header-shadow="true"] > .nexus-app-header {
  box-shadow: var(--nx-header-sticky-shadow, 0 10px 26px rgba(0, 0, 0, 0.12));
}

.nexus-app[data-nx-header-sticky="false"] > .nexus-app-header {
  position: static;
  top: auto;
  z-index: auto;
}

.nexus-app[data-nx-header-sticky="false"] > .nexus-app-header > :is(header, [data-module*="header"]) {
  position: static !important;
  top: auto !important;
}

.nexus-app-header :is(
  .sc-nav-dropdown.is-closing .sc-nav-dropdown__menu,
  .fhs-nav-item--has-menu.is-closing .fhs-nav-dropdown,
  .fhs-nav-dropdown__group.is-closing .fhs-nav-dropdown__cities,
  .nav-dropdown.is-closing .nav-dropdown__menu,
  [data-nx-dropdown].is-closing [data-nx-dropdown-menu]
) {
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

@media (max-width: 900px) {
  :root {
    --nx-mobile-header-min-height: 64px;
    --nx-mobile-header-pad-x: 16px;
    --nx-mobile-menu-gap: 14px;
  }

  .sc-menu-lock,
  .fhs-menu-lock,
  .bc-menu-lock,
  .nx-menu-lock {
    overflow: hidden;
  }

  .nexus-app-header {
    padding: 0;
  }

  .nexus-app-header :is(
    .sc-nav-shell,
    .fhs-nav-shell,
    .bc-header__inner,
    .site-header__inner,
    .header__inner,
    [data-nx-header-inner]
  ) {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--nx-mobile-menu-gap);
    width: 100%;
    min-height: var(--nx-mobile-header-min-height);
    min-width: 0;
    padding-inline: var(--nx-mobile-header-pad-x);
  }

  .nexus-app-header :is(
    .sc-logo,
    .fhs-logo,
    .bc-logo,
    .site-logo,
    .nx-brand-logo,
    [data-nx-brand-logo]
  ) {
    min-width: 0;
    max-width: calc(100% - 68px);
    flex: 1 1 auto;
  }

  .nexus-app-header :is(
    .sc-logo__text,
    .fhs-logo__text,
    .bc-logo__text,
    .site-logo__text,
    .nx-brand-logo__text
  ) {
    min-width: 0;
  }

  .nexus-app-header :is(
    .sc-logo__text strong,
    .fhs-logo__text strong,
    .bc-logo__text strong,
    .site-logo__text strong,
    .nx-brand-logo__text strong
  ) {
    overflow-wrap: anywhere;
    line-height: 1;
  }

  .nexus-app-header :is(
    .sc-logo img,
    .fhs-logo img,
    .bc-logo img,
    .site-logo img,
    .nx-brand-logo img,
    .nx-brand-logo__image
  ) {
    width: auto;
    max-width: min(58vw, 240px);
    max-height: 52px;
    object-fit: contain;
  }

  .nexus-app-header :is(
    .sc-menu-toggle,
    .fhs-menu-toggle,
    .bc-menu-toggle,
    .menu-toggle,
    [data-menu-toggle],
    [data-nx-menu-toggle]
  ) {
    flex: 0 0 auto;
  }

  .nexus-app-header :is(
    .sc-menu-panel,
    .fhs-menu-panel,
    .bc-menu-panel,
    .menu-panel,
    [data-menu-panel],
    [data-nx-mobile-menu]
  ) {
    align-content: start !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: clamp(14px, 3.8vw, 24px) !important;
    padding: clamp(18px, 5vw, 28px) var(--nx-mobile-header-pad-x) max(24px, env(safe-area-inset-bottom)) !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-gutter: stable;
  }

  .nexus-app-header :is(
    .sc-menu-panel,
    .menu-panel,
    [data-nx-mobile-menu]
  ) {
    position: fixed !important;
    top: var(--nx-header-height, 72px) !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    max-width: none !important;
    height: calc(100dvh - var(--nx-header-height, 72px)) !important;
    max-height: calc(100dvh - var(--nx-header-height, 72px)) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  .nexus-app-header :is(
    .fhs-menu-panel,
    .bc-menu-panel,
    [data-menu-panel]
  ) {
    height: 100dvh;
    max-height: 100dvh;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  .nexus-app-header :is(
    .sc-nav,
    .fhs-nav,
    .bc-nav,
    .nav,
    [data-nx-mobile-nav]
  ) {
    display: grid !important;
    gap: 2px !important;
    align-items: stretch !important;
    justify-items: stretch !important;
    text-align: left !important;
  }

  .nexus-app-header :is(
    .sc-nav a::after,
    .fhs-nav a::after,
    .bc-nav a::after,
    .nav a::after,
    .sc-nav-dropdown::after,
    .fhs-nav-item--has-menu::after,
    .fhs-nav-dropdown__group::after,
    .nav-dropdown::after,
    [data-nx-dropdown]::after
  ) {
    display: none !important;
    content: none !important;
  }

  .nexus-app-header :is(
    .sc-nav a,
    .sc-nav-dropdown > button,
    .sc-nav-dropdown__menu a,
    .fhs-nav a,
    .fhs-nav-item > a,
    .fhs-nav-dropdown a,
    .bc-nav a,
    .nav a,
    .nav-dropdown > button,
    .nav-dropdown__menu a,
    [data-nx-mobile-nav] a,
    [data-nx-dropdown] > button,
    [data-nx-dropdown-menu] a
  ) {
    width: 100%;
    min-height: 44px;
    padding-block: 11px !important;
    justify-content: flex-start !important;
    text-align: left !important;
  }

  .nexus-app-header :is(
    .sc-nav-dropdown > button,
    .fhs-nav-item--has-menu > a,
    .nav-dropdown > button,
    [data-nx-dropdown] > button,
    [data-nx-dropdown] > a
  ) {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding-right: 44px !important;
  }

  .nexus-app-header :is(
    .sc-nav-dropdown > button,
    .fhs-nav-item--has-menu > a,
    .nav-dropdown > button,
    [data-nx-dropdown] > button,
    [data-nx-dropdown] > a
  )::before {
    content: "" !important;
    position: absolute !important;
    top: 50% !important;
    right: 14px !important;
    display: block !important;
    width: 9px !important;
    height: 9px !important;
    border-right: 2px solid currentColor !important;
    border-bottom: 2px solid currentColor !important;
    opacity: 0.72 !important;
    transform: translateY(-65%) rotate(45deg) !important;
    transition: transform 160ms ease, opacity 160ms ease !important;
  }

  .nexus-app-header :is(
    .sc-nav-dropdown.is-open > button,
    .fhs-nav-item--has-menu.is-open > a,
    .nav-dropdown.is-open > button,
    [data-nx-dropdown].is-open > button,
    [data-nx-dropdown].is-open > a
  )::before {
    opacity: 1 !important;
    transform: translateY(-35%) rotate(225deg) !important;
  }

  .nexus-app-header :is(
    .sc-nav-actions,
    .fhs-nav-actions,
    .bc-nav-actions,
    .nav-actions,
    [data-nx-mobile-actions]
  ) {
    display: grid !important;
    gap: 12px !important;
    width: 100% !important;
    margin-top: 8px !important;
  }

  .nexus-app-header :is(
    .sc-nav-actions a,
    .fhs-nav-actions a,
    .bc-nav-actions a,
    .nav-actions a,
    [data-nx-mobile-actions] a
  ) {
    width: 100% !important;
    justify-content: center !important;
  }

  .nexus-app-header :is(
    .sc-nav-dropdown,
    .fhs-nav-item--has-menu,
    .fhs-nav-dropdown__group,
    .nav-dropdown,
    [data-nx-dropdown]
  ) {
    width: 100%;
    text-align: left !important;
  }

  .nexus-app-header :is(
    .sc-nav-dropdown .sc-nav-dropdown__menu,
    .nav-dropdown .nav-dropdown__menu,
    [data-nx-dropdown] [data-nx-dropdown-menu]
  ) {
    display: none !important;
  }

  .nexus-app-header :is(
    .sc-nav-dropdown.is-open .sc-nav-dropdown__menu,
    .nav-dropdown.is-open .nav-dropdown__menu,
    [data-nx-dropdown].is-open [data-nx-dropdown-menu]
  ) {
    display: grid !important;
  }

  .nexus-app-header :is(
    .fhs-nav-item--has-menu .fhs-nav-dropdown,
    .fhs-nav-dropdown__group .fhs-nav-dropdown__cities
  ) {
    display: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
  }

  .nexus-app-header :is(
    .fhs-nav-item--has-menu.is-open > .fhs-nav-dropdown,
    .fhs-nav-dropdown__group.is-open > .fhs-nav-dropdown__cities
  ) {
    display: grid !important;
  }
}

.nexus-app-body {
  flex: 1;
  width: 100%;
  max-width: 100%;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas: "content";
  overflow-x: hidden;
}

.nexus-app-sidebar {
  grid-area: sidebar;
  background: #0b1220;
  border-right: 1px solid #1f2937;
  padding: 16px;
  min-width: 0;
  max-width: 100%;
  overflow-x: hidden;
}

.nexus-app-content {
  grid-area: content;
  width: 100%;
  max-width: 100%;
  background: #111827;
  padding: 20px;
  min-width: 0;
  overflow-x: hidden;
}

.nexus-app-panel {
  grid-area: panel;
  background: #0b1220;
  border-left: 1px solid #1f2937;
  padding: 16px;
  min-width: 0;
  max-width: 100%;
  overflow-x: hidden;
}

.nexus-app-footer {
  width: 100%;
  max-width: 100%;
  background: #111827;
  border-top: 1px solid #1f2937;
  padding: 12px 20px;
  min-width: 0;
}

.nexus-app-overlay {
  display: none;
}

/* --------------------------------------------------
   Wide full-width section with centered content
   -------------------------------------------------- */

.nx-wide-section {
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;

  position: relative;
  overflow: hidden;

  padding: clamp(72px, 8vw, 140px) clamp(24px, 5vw, 72px);

  background:
    linear-gradient(
      135deg,
      rgba(0, 224, 214, 0.95),
      rgba(0, 200, 255, 0.92)
    );
}

.nx-wide-section__inner {
  width: 100%;
  max-width: var(--nx-container-max, 1200px);
  margin: 0 auto;

  position: relative;
  z-index: 2;
}

/* Optional background image support */
.nx-wide-section--image {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* Optional dark overlay for readable text over images */
.nx-wide-section--overlay::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;

  background:
    linear-gradient(
      90deg,
      rgba(0, 20, 60, 0.82),
      rgba(0, 20, 60, 0.28)
    );
}

/* Optional hero-style two-column layout */
.nx-wide-section__grid {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
  gap: clamp(32px, 5vw, 80px);
  align-items: center;
  min-width: 0;
}

.nx-wide-section__media {
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  border-radius: 18px;
  min-width: 0;
}

.nx-wide-section__media img {
  width: 100%;
  max-width: 100%;
  display: block;
  object-fit: cover;
}

/* Hero typography option */
.nx-wide-section__eyebrow {
  color: #ffc107;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.nx-wide-section__title {
  margin: 18px 0 18px;
  color: #ffffff;
  font-size: clamp(44px, 6vw, 82px);
  font-weight: 900;
  line-height: 0.98;
  letter-spacing: -0.06em;
}

.nx-wide-section__title span {
  color: #ffc107;
}

.nx-wide-section__body {
  max-width: 620px;
  color: rgba(255, 255, 255, 0.88);
  font-size: 17px;
  line-height: 1.8;
}

/* Responsive */
@media (max-width: 900px) {
  .nx-wide-section__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .nx-wide-section {
    padding: 64px 24px;
  }
}

/* -----------------------------------------
   Layout: default
   Header + content + footer only
   ----------------------------------------- */

.layout-default .nexus-app-body {
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas: "content";
}

.layout-default .nexus-app-sidebar,
.layout-default .nexus-app-panel,
.layout-default .nexus-app-overlay {
  display: none !important;
}

/* -----------------------------------------
   Layout: dashboard
   Sidebar + content + panel
   ----------------------------------------- */

.layout-dashboard .nexus-app-body {
  grid-template-columns: 220px minmax(0, 1fr) 280px;
  grid-template-areas: "sidebar content panel";
}

.layout-dashboard .nexus-app-sidebar,
.layout-dashboard .nexus-app-panel {
  display: block;
}

/* -----------------------------------------
   Layout: nexus
   Sidebar + content, no right panel
   ----------------------------------------- */

.layout-nexus .nexus-app-body {
  grid-template-columns: 220px minmax(0, 1fr);
  grid-template-areas: "sidebar content";
}

.layout-nexus .nexus-app-sidebar {
  display: block;
}

.layout-nexus .nexus-app-panel,
.layout-nexus .nexus-app-overlay {
  display: none !important;
}

/* -----------------------------------------
   Layout: fullscreen
   Content only
   ----------------------------------------- */

.layout-fullscreen .nexus-app-header,
.layout-fullscreen .nexus-app-footer,
.layout-fullscreen .nexus-app-sidebar,
.layout-fullscreen .nexus-app-panel,
.layout-fullscreen .nexus-app-overlay {
  display: none !important;
}

.layout-fullscreen .nexus-app-body {
  display: block;
  width: 100%;
  max-width: 100%;
}

.layout-fullscreen .nexus-app-content {
  width: 100%;
  max-width: 100%;
  min-height: 100vh;
  padding: 0;
}

/* -----------------------------------------
   Responsive
   ----------------------------------------- */

@media (max-width: 980px) {
  .nexus-app-body,
  .layout-dashboard .nexus-app-body,
  .layout-nexus .nexus-app-body,
  .layout-default .nexus-app-body {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "content";
  }

  .nexus-app-sidebar,
  .nexus-app-panel {
    display: none !important;
  }
}

/* --------------------------------------------------
   Dashboard wide hero
   -------------------------------------------------- */

.dashboard-page__wide-hero {
  margin-top: 10px;
  min-height: 520px;
}

.dashboard-page__wide-hero .nx-wide-section__inner {
  max-width: 1240px;
}

.dashboard-page__wide-hero-copy {
  max-width: 680px;
}

.dashboard-page__wide-hero-muted {
  max-width: 620px;
  color: rgba(255, 255, 255, 0.72) !important;
}

.dashboard-page__wide-hero-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 28px;
}

.dashboard-page__wide-hero-media {
  min-height: 360px;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.24);
}

.dashboard-page__wide-hero-media img {
  min-height: 360px;
}

.dashboard-page__wide-hero-art {
  min-height: 360px;
  position: relative;
  display: grid;
  place-items: center;
}

.dashboard-page__wide-hero-orb {
  width: min(360px, 70vw);
  aspect-ratio: 1;
  border-radius: 999px;
  background:
    radial-gradient(circle at 35% 30%, rgba(255,255,255,0.9), transparent 12%),
    radial-gradient(circle, rgba(84,166,255,0.58), rgba(139,92,246,0.26) 58%, transparent 70%);
  filter: blur(0.2px);
  box-shadow:
    0 0 80px rgba(84,166,255,0.32),
    0 0 120px rgba(139,92,246,0.22);
}

.dashboard-page__wide-hero-card {
  position: absolute;
  right: 8%;
  bottom: 14%;
  min-width: 180px;
  padding: 18px;
  border-radius: 20px;
  background: rgba(3, 7, 18, 0.58);
  backdrop-filter: blur(20px);
  color: #ffffff;
  box-shadow: 0 22px 55px rgba(0, 0, 0, 0.32);
}

.dashboard-page__wide-hero-card strong,
.dashboard-page__wide-hero-card span {
  display: block;
}

.dashboard-page__wide-hero-card span {
  margin-top: 8px;
  font-size: 28px;
  font-weight: 800;
}

@media (max-width: 900px) {
  .dashboard-page__wide-hero {
    min-height: auto;
  }

  .dashboard-page__wide-hero-media,
  .dashboard-page__wide-hero-media img,
  .dashboard-page__wide-hero-art {
    min-height: 260px;
  }
}

.nexus-app {
  min-height: 100vh;
  display: grid;
  grid-template-rows: auto 1fr auto;
}

.nexus-app-header {
  grid-row: 1;
  width: 100%;
  z-index: 10;
}

.nexus-app-body {
  grid-row: 2;
  display: grid;
  grid-template-columns: minmax(220px, 260px) minmax(0, 1fr) minmax(260px, 320px);
  grid-template-areas: "sidebar content panel";
  align-items: stretch;
  width: 100%;
  min-height: 0;
}

.nexus-app-sidebar {
  grid-area: sidebar;
  min-width: 0;
  overflow: auto;
}

.nexus-app-content {
  grid-area: content;
  min-width: 0;
  overflow: hidden;
}

.nexus-app-panel {
  grid-area: panel;
  min-width: 0;
  overflow: auto;
}

.nexus-app-footer {
  grid-row: 3;
  width: 100%;
}

[hidden] {
  display: none !important;
}

.nexus-app {
  min-height: 100vh;
  display: grid;
  grid-template-rows: auto 1fr auto;
}

.nexus-app-header {
  grid-row: 1;
  width: 100%;
  z-index: 10;
}

.nexus-app-body {
  grid-row: 2;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas: "content";
  align-items: stretch;
  width: 100%;
  min-height: 0;
}

.nexus-app-sidebar {
  grid-area: sidebar;
  min-width: 0;
  overflow: auto;
}

.nexus-app-content {
  grid-area: content;
  min-width: 0;
  overflow: hidden;
}

.nexus-app-panel {
  grid-area: panel;
  min-width: 0;
  overflow: auto;
}

.nexus-app-footer {
  grid-row: 3;
  width: 100%;
}

/* Default: content only */
.layout-default .nexus-app-body {
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas: "content";
}

.layout-default .nexus-app-sidebar,
.layout-default .nexus-app-panel,
.layout-default .nexus-app-overlay {
  display: none !important;
}

/* Nexus: sidebar + content */
.layout-nexus .nexus-app-body {
  grid-template-columns: minmax(220px, 260px) minmax(0, 1fr);
  grid-template-areas: "sidebar content";
}

.layout-nexus .nexus-app-sidebar {
  display: block;
  grid-area: sidebar;
}

.layout-nexus .nexus-app-content {
  display: block;
  grid-area: content;
}

.layout-nexus .nexus-app-panel,
.layout-nexus .nexus-app-overlay {
  display: none !important;
}

/* Dashboard: sidebar + content + panel */
.layout-dashboard .nexus-app-body {
  display: grid;
  grid-template-columns: minmax(220px, 260px) minmax(0, 1fr) minmax(260px, 320px);
  grid-template-areas: "sidebar content panel";
}

.layout-dashboard .nexus-app-sidebar {
  display: block;
  grid-area: sidebar;
}

.layout-dashboard .nexus-app-content {
  display: block;
  grid-area: content;
  min-width: 0;
}

.layout-dashboard .nexus-app-panel {
  display: block;
  grid-area: panel;
}

/* Fullscreen */
.layout-fullscreen .nexus-app-header,
.layout-fullscreen .nexus-app-footer,
.layout-fullscreen .nexus-app-sidebar,
.layout-fullscreen .nexus-app-panel,
.layout-fullscreen .nexus-app-overlay {
  display: none !important;
}

.layout-fullscreen .nexus-app-body {
  display: block;
}

.layout-fullscreen .nexus-app-content {
  min-height: 100vh;
  padding: 0;
}

@media (max-width: 980px) {
  .layout-dashboard .nexus-app-body,
  .layout-nexus .nexus-app-body,
  .layout-default .nexus-app-body {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "content";
  }

  .nexus-app-sidebar,
  .nexus-app-panel {
    display: none !important;
  }
}