/**
 * Nexus Theme Standard — paridad iOS NexusTheme.swift + NexusScrollTrack.swift
 * API: nexusCard, nexusMenuRowCard, nexusGlass*, nexusBtn*, nexusScreen, nexusAccent
 * Solo tokens y superficies; el layout vive en app.css
 */

:root {
  --nexus-radius-card: 16px;
  --nexus-radius-primary-btn: 14px;
  --nexus-radius-bordered-btn: 12px;
  --nexus-radius-menu-row: 14px;
  --nexus-radius-dock: 28px;
  --nexus-accent: var(--cyan);
  --nexus-accent-dark: var(--cyan-dark);
  --nexus-card-fill: var(--card);
  --nexus-control-border: var(--border-strong);
  --nexus-glass-base: var(--card);
  --nexus-icon-accent: var(--cyan);
  --nexus-bottom-bar-active: var(--navy);
  --nexus-bottom-bar-inactive: color-mix(in srgb, var(--text) 42%, transparent);
  --nexus-bottom-bar-capsule-fill: transparent;
  --nexus-bottom-bar-capsule-border: color-mix(in srgb, var(--navy) 30%, transparent);
  --nexus-glass-blur-surface: 28px;
  --nexus-glass-blur-dock: 32px;
  --nexus-glass-blur-capsule: 10px;
  --nexus-glass-blur-item: 18px;
  --nexus-shadow-card: var(--shadow);
  --fab-bar-gap: 0.65rem;
  --fab-nav-bottom: 0;
}

[data-theme="night"] {
  --nexus-card-fill: color-mix(in srgb, var(--card) 72%, transparent);
  --nexus-control-border: color-mix(in srgb, var(--border) 55%, transparent);
  --nexus-glass-base: #000;
  --nexus-shadow-card: none;
  --nexus-bottom-bar-active: var(--cyan);
  --nexus-bottom-bar-inactive: var(--text-secondary);
  --nexus-bottom-bar-capsule-fill: transparent;
  --nexus-bottom-bar-capsule-border: color-mix(in srgb, var(--cyan) 34%, transparent);
}

/* nexusThemedScreen() */
.nexus-screen {
  background: var(--surface);
  color: var(--text);
}

/* nexusCard() */
.nexus-card,
.app-card {
  background: var(--nexus-card-fill);
  border-radius: var(--nexus-radius-card);
  box-shadow: var(--nexus-shadow-card);
  border: 1px solid var(--nexus-control-border);
}
[data-theme="night"] .nexus-card,
[data-theme="night"] .app-card {
  border: 1px solid color-mix(in srgb, var(--border) 38%, transparent);
}

/* nexusMenuRowCard() */
.nexus-menu-row-card {
  background: color-mix(in srgb, var(--card) var(--glass-item-mix), transparent);
  border: 1.5px solid var(--nexus-control-border);
  border-radius: var(--nexus-radius-menu-row);
  backdrop-filter: blur(var(--nexus-glass-blur-item));
  -webkit-backdrop-filter: blur(var(--nexus-glass-blur-item));
}

/* nexusGlassSurface() */
.nexus-glass-surface {
  background: color-mix(in srgb, var(--nexus-glass-base) var(--glass-surface-mix), transparent);
  backdrop-filter: blur(var(--nexus-glass-blur-surface));
  -webkit-backdrop-filter: blur(var(--nexus-glass-blur-surface));
}

/* nexusGlassScreen() genérico */
.nexus-glass-screen:not(.module-menu-panel) {
  background: color-mix(in srgb, var(--nexus-glass-base) var(--glass-surface-mix), transparent);
  backdrop-filter: blur(var(--nexus-glass-blur-surface));
  -webkit-backdrop-filter: blur(var(--nexus-glass-blur-surface));
}

/* nexusGlassScreen() / nexusModuleMenuSurface() */
.nexus-glass-screen.module-menu-panel,
.module-menu-panel {
  background: color-mix(in srgb, var(--surface) var(--glass-menu-mix), transparent);
}

/* nexusModuleMenuTopBar() — vidrio dentro del panel lateral */
.nexus-module-menu-top-bar {
  background: color-mix(in srgb, var(--surface) var(--glass-menu-mix), transparent);
  backdrop-filter: blur(var(--nexus-glass-blur-surface));
  -webkit-backdrop-filter: blur(var(--nexus-glass-blur-surface));
}

[data-theme="night"] .nexus-glass-screen.module-menu-panel,
[data-theme="night"] .module-menu-panel,
[data-theme="night"] .nexus-module-menu-top-bar {
  background: color-mix(in srgb, var(--surface) var(--glass-menu-mix), transparent);
}

/* nexusGlassDock() — contenedor principal con vidrio fuerte */
.nexus-glass-dock,
.app-nav {
  background: color-mix(in srgb, var(--surface) var(--glass-dock-mix), transparent);
  backdrop-filter: blur(var(--nexus-glass-blur-dock)) saturate(1.55);
  -webkit-backdrop-filter: blur(var(--nexus-glass-blur-dock)) saturate(1.55);
  border: 1px solid color-mix(in srgb, var(--border-strong) 48%, transparent);
  border-radius: var(--nexus-radius-dock);
  box-shadow:
    0 8px 24px rgba(15, 23, 42, 0.14),
    inset 0 1px 0 color-mix(in srgb, #fff 55%, transparent),
    inset 0 -1px 0 color-mix(in srgb, #fff 12%, transparent);
}
[data-theme="night"] .nexus-glass-dock,
[data-theme="night"] .app-nav {
  box-shadow:
    0 6px 18px rgba(0, 0, 0, 0.28),
    inset 0 1px 0 color-mix(in srgb, #fff 18%, transparent),
    inset 0 -1px 0 color-mix(in srgb, #fff 6%, transparent);
}

/* nexusGlassCapsule(active:) — botones con vidrio sutil (solo activo) */
.nexus-glass-capsule,
.nav-item {
  background: transparent;
  border: 1px solid transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: none;
}
.nexus-glass-capsule.active,
.nav-item.active {
  color: var(--nexus-bottom-bar-active);
  background: transparent;
  border-color: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: none;
}

/* nexusPrimaryButtonStyle() */
.nexus-btn-primary,
.app-btn--primary {
  background: linear-gradient(135deg, var(--nexus-accent), var(--nexus-accent-dark));
  color: #fff;
  box-shadow: 0 2px 8px color-mix(in srgb, var(--nexus-accent) 28%, transparent);
}

/* nexusBorderedButtonStyle() */
.nexus-btn-bordered,
.app-btn--outline {
  background: var(--nexus-card-fill);
  color: var(--text);
  border: 1.5px solid var(--nexus-control-border);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 80%, transparent);
}

/* nexusBottomBarButtonStyle — interacción táctil */
.nexus-bar-btn:active,
.nav-item:active {
  transform: scale(0.92);
  opacity: 0.88;
}

/* nexusAuthFieldStyle() — aplicar clase .nexus-auth-field explícitamente */
.nexus-auth-field {
  background: var(--nexus-card-fill);
  border: 1.5px solid var(--nexus-control-border);
  color: var(--text);
}

/* nexusScrollBottomPadding() */
.nexus-scroll-bottom,
.app-content {
  padding-bottom: calc(var(--nav-height) + var(--safe-bottom) + 1.75rem);
}

/* nexusFabShell() — anclado sobre .app-nav con hueco pequeño */
.nexus-fab-shell,
.fab-container {
  position: fixed;
  bottom: calc(var(--safe-bottom) + var(--nav-height) + var(--fab-bar-gap));
  right: 1.25rem;
  z-index: 30;
  transition: opacity 0.22s ease;
}

/* nexusBtn base — layout táctil compartido */
.nexus-btn-primary,
.nexus-btn-bordered,
.app-btn {
  border-radius: var(--nexus-radius-primary-btn);
}
.nexus-btn-bordered,
.app-btn--outline {
  border-radius: var(--nexus-radius-bordered-btn);
}

/* Acento en iconos interactivos — palette.iconAccent */
.nexus-accent { color: var(--nexus-icon-accent); }
.nexus-accent svg { stroke: var(--nexus-icon-accent); }