/**
 * RÜM — capa editorial de la plataforma (oct 2026).
 * El lenguaje de la home nueva (redesign/home/assets/css/home.css) llevado al shell:
 * Baloo 2 sólo en el logo, Syne en títulos, Inter en texto, etiquetas y botones;
 * tinta carbón, filetes cálidos en vez de sombras, botón primario durazno en píldora.
 * Fondo blanco (lo pidió el usuario: "el fondo blanco está bien").
 *
 * La carga navbar.php después de su <style>, así que gana a igual especificidad.
 * Tokens con prefijo --rx- para no chocar con los --ink / --rum-* de cada página.
 */

@font-face { font-family: "Syne"; font-style: normal; font-weight: 400 800; font-display: swap; src: url(/assets/home/fonts/syne-var.woff2) format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 100 900; font-display: swap; src: url(/assets/home/fonts/inter-var.woff2) format("woff2"); }
@font-face { font-family: "Baloo 2"; font-style: normal; font-weight: 400 800; font-display: swap; src: url(/assets/home/fonts/baloo2-var.woff2) format("woff2"); }

:root {
  --rx-ink: #1C1F26;
  --rx-ink-2: #4A4F5A;
  --rx-muted: #8A8F98;
  --rx-rule: #ECE4DA;
  --rx-rule-strong: #DDD1C3;
  --rx-paper: #FFFFFF;
  --rx-paper-2: #FAF7F3;
  --rx-peach: #F3D2B2;
  --rx-peach-2: #EEBF95;
  --rx-peach-ink: #5C3A21;
  --rx-terracotta: #B8784C;
  --rx-f-logo: "Baloo 2", system-ui, sans-serif;
  --rx-f-display: "Syne", "Inter", system-ui, sans-serif;
  --rx-f-sans: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --rx-ease: cubic-bezier(.16, 1, .3, 1);
}

/* =====================================================================
   NAVBAR
   ===================================================================== */
.rum-navbar:not(.rum-navbar--portal-dark) {
  background: var(--rx-paper);
  box-shadow: none;
  border-bottom: 1px solid var(--rx-rule);
}
.rum-navbar .rum-navbar-inner {
  padding: 12px clamp(16px, 2.4vw, 36px);
  gap: 8px 22px;
}
.rum-navbar .rum-left { gap: 28px; }

/* Logo: el de la home, Baloo 2 extranegrita en carbón */
.rum-navbar .rum-logo-link { padding: 2px 0; border-radius: 0; }
.rum-navbar .rum-logo-letter,
.rum-navbar .nav-portal-u {
  font-family: var(--rx-f-logo);
  font-weight: 800;
  font-size: 1.62rem;
  letter-spacing: -.01em;
}
.rum-navbar:not(.rum-navbar--portal-dark) .rum-logo-letter,
.rum-navbar:not(.rum-navbar--portal-dark) .nav-portal-u { color: var(--rx-ink); text-shadow: none; }
/* El portal de la Ü abre en durazno, no en azul neón */
.rum-navbar .nav-portal-ring { border-color: rgba(184, 120, 76, .75); box-shadow: none; }
.rum-navbar .nav-portal-core { background: radial-gradient(circle, #FFF6EC, var(--rx-peach) 55%, var(--rx-terracotta)); box-shadow: 0 0 10px rgba(243, 210, 178, .9); }

/* Enlaces, disparadores de menú, idioma, proyecto, salir: etiquetas Inter en versalitas */
.rum-navbar .rum-nav-link,
.rum-navbar .portal-enter-link,
.rum-navbar .nav-enterlike,
.rum-navbar .enter-black,
.rum-navbar .rum-nav-dropdown__trigger,
.rum-navbar .rum-right-actions .rum-nav-dropdown--plain .rum-nav-dropdown__trigger,
.rum-navbar .rum-nav-project-switch__select,
.rum-navbar .rum-company-name,
.rum-navbar .rum-lang-opt {
  font-family: var(--rx-f-sans) !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase;
  line-height: 1.2;
  text-decoration: none;
  text-shadow: none !important;
}
.rum-navbar:not(.rum-navbar--portal-dark) .rum-nav-link,
.rum-navbar:not(.rum-navbar--portal-dark) .portal-enter-link,
.rum-navbar:not(.rum-navbar--portal-dark) .rum-nav-dropdown__trigger,
.rum-navbar:not(.rum-navbar--portal-dark) .rum-nav-project-switch__select,
.rum-navbar:not(.rum-navbar--portal-dark) .rum-company-name { color: var(--rx-ink); }

/* Fuera el halo azul, las chispas y el portal punteado al pasar el mouse */
.rum-navbar .nav-glow::before,
.rum-navbar .rum-logo-link::after,
.rum-navbar .nav-enterlike:not(.enter-black)::before,
.rum-navbar .rum-nav-link.is-active::before,
.rum-navbar .portal-hover,
.rum-navbar .portal-enter-underline { display: none !important; }
.rum-navbar .nav-glow:hover { transform: none; }

/* Subrayado fino que corre de izquierda a derecha (el de la home) */
.rum-navbar .rum-nav-link,
.rum-navbar .portal-enter-link { position: relative; overflow: visible; }
.rum-navbar .rum-nav-link::after,
.rum-navbar .portal-enter-link::after {
  content: "";
  display: block !important;
  position: absolute;
  height: 1px;
  width: auto;
  background: currentColor;
  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
  inset: auto 8px 2px 8px;
  border-radius: 0;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .5s var(--rx-ease);
  animation: none !important;
}
.rum-navbar .rum-nav-link:hover::after,
.rum-navbar .rum-nav-link:focus-visible::after,
.rum-navbar .rum-nav-link.is-active::after,
.rum-navbar .portal-enter-link:hover::after,
.rum-navbar .portal-enter-link:focus-visible::after { transform: scaleX(1); }
.rum-navbar .rum-nav-dropdown__trigger::after { display: none !important; }
.rum-navbar .rum-nav-link.is-active { text-shadow: none; }

/* Chevron: trazo fino en lugar del triángulo macizo */
.rum-navbar .rum-nav-dropdown__chev {
  width: 6px; height: 6px;
  border: 0;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
  margin-left: 4px;
  opacity: .7;
}
.rum-navbar .rum-nav-dropdown.is-open .rum-nav-dropdown__chev { transform: rotate(225deg) translate(-1px, -1px); opacity: 1; }

/* Selector de rol: el orbe azul pasa a un punto durazno "en vivo" */
.rum-navbar .rum-nav-role-portal {
  width: 10px; height: 10px;
  filter: none !important;
  transform: none !important;
}
.rum-navbar .rum-nav-role-portal > * { display: none !important; }
.rum-navbar .rum-nav-role-portal::before {
  inset: 0;
  background: var(--rx-terracotta);
  box-shadow: 0 0 0 4px rgba(243, 210, 178, .55);
  animation: rxLiveDot 2.8s ease-in-out infinite;
}
@keyframes rxLiveDot {
  0%, 100% { box-shadow: 0 0 0 3px rgba(243, 210, 178, .7); }
  50% { box-shadow: 0 0 0 6px rgba(243, 210, 178, .25); }
}
.rum-navbar .rum-nav-dropdown__trigger-label { gap: 10px; }

/* Menús desplegables: papel blanco, filete cálido, títulos Syne */
.rum-navbar .rum-nav-dropdown__panel {
  border: 1px solid var(--rx-rule-strong);
  border-radius: 10px;
  box-shadow: 0 24px 48px rgba(28, 31, 38, .12);
  padding: 8px;
}
.rum-navbar .rum-nav-dropdown__heading,
.rum-navbar .rum-nav-dropdown__group-title {
  font-family: var(--rx-f-display) !important;
  font-weight: 600;
  letter-spacing: -.01em;
  color: var(--rx-ink);
}
.rum-navbar .rum-nav-dropdown__group-trigger {
  font-family: var(--rx-f-sans) !important;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--rx-muted);
}
.rum-navbar .rum-nav-dropdown__group-trigger--rich { background: var(--rx-paper-2); border-radius: 8px; }
.rum-navbar .rum-nav-dropdown__group-icon { background: #fff; border: 1px solid var(--rx-rule); color: var(--rx-ink); box-shadow: none; }
.rum-navbar .rum-nav-dropdown__group-sub,
.rum-navbar .rum-nav-dropdown__desc { font-family: var(--rx-f-sans); color: var(--rx-muted); }
.rum-navbar .rum-nav-dropdown__title,
.rum-navbar .rum-nav-dropdown__submenu-trigger .rum-nav-dropdown__title { font-family: var(--rx-f-sans) !important; color: var(--rx-ink-2); }
.rum-navbar .rum-nav-dropdown__item { border-radius: 6px; }
.rum-navbar .rum-nav-dropdown__item:hover,
.rum-navbar .rum-nav-dropdown__item:focus-visible { background: var(--rx-paper-2); }
.rum-navbar a.rum-nav-dropdown__item:hover .rum-nav-dropdown__title,
.rum-navbar a.rum-nav-dropdown__item:focus-visible .rum-nav-dropdown__title { color: var(--rx-ink); }
.rum-navbar .rum-nav-dropdown--index-roles .rum-nav-index-item.is-active { background: rgba(243, 210, 178, .35); }

/* Título de página al centro: Syne */
.rum-navbar .rum-navbar-page-title {
  font-family: var(--rx-f-display);
  font-weight: 600;
  font-size: clamp(.95rem, 1.2vw, 1.1rem);
  letter-spacing: -.01em;
  color: var(--rx-ink);
}

/* Cuenta: "Salir" arriba, sesión y rol abajo en gris */
.rum-navbar .portal-logout { gap: 3px; }
.rum-navbar .portal-logout::after { display: none !important; }
.rum-navbar .portal-logout:hover { color: var(--rx-terracotta); }
.rum-navbar .portal-enter-meta {
  font-family: var(--rx-f-sans);
  font-size: 10.5px;
  font-weight: 500;
  letter-spacing: .02em;
  text-transform: none;
  color: var(--rx-muted);
  opacity: 1;
}

/* Empresa: logo + nombre, separados por un filete */
.rum-navbar .rum-company-brand {
  padding: 4px 0 4px 18px;
  border-left: 1px solid var(--rx-rule);
  border-radius: 0;
  background: transparent;
}
.rum-navbar .rum-company-logo { background: transparent; }

/* Proyecto activo y "Ingresar": píldora de línea fina */
.rum-navbar .rum-nav-project-switch__inner {
  border: 1px solid var(--rx-rule-strong);
  border-radius: 999px;
  padding: 0 12px 0 6px;
  min-height: 34px;
  transition: border-color .3s ease;
}
.rum-navbar .rum-nav-project-switch__inner:hover { border-color: var(--rx-ink); }
.rum-navbar .rum-nav-project-switch__select { padding: 8px 0 8px 8px; }
.rum-navbar .portal-enter-link--sky-cta {
  background: var(--rx-peach) !important;
  color: var(--rx-ink) !important;
  border-radius: 999px !important;
  padding: 10px 18px !important;
}
.rum-navbar .portal-enter-link--sky-cta::after { display: none !important; }

/* Pestaña para plegar la barra */
.rum-nav-collapse { border-color: var(--rx-rule-strong); box-shadow: none; color: var(--rx-ink); }
.rum-nav-collapse:hover { color: var(--rx-terracotta); box-shadow: none; }
.rum-nav-collapse:focus-visible { outline-color: var(--rx-ink); }
.rum-navbar.is-collapsed { box-shadow: none; }

/* Hamburguesa */
.rum-navbar .rum-nav-toggle { background: transparent; border: 1px solid var(--rx-rule-strong); border-radius: 999px; }
.rum-navbar .rum-nav-toggle-bar { background: var(--rx-ink); width: 18px; height: 1.5px; }

.rum-navbar .rum-nav-link--learning {
  color: var(--rx-ink) !important;
  background: transparent;
  border: 1px solid var(--rx-rule-strong);
  box-shadow: none;
}
.rum-navbar .rum-nav-link--learning:hover { color: var(--rx-ink) !important; border-color: var(--rx-ink); box-shadow: none; transform: none; }
.rum-navbar .rum-nav-link--learning::after { display: none !important; }

@media (max-width: 900px) {
  .rum-navbar .rum-nav-links { border-top-color: var(--rx-rule); }
  .rum-navbar .rum-nav-link::after { display: none !important; }
  .rum-navbar .rum-nav-link + .rum-nav-link,
  .rum-navbar .rum-nav-dropdown + .rum-nav-link,
  .rum-navbar .rum-nav-link + .rum-nav-dropdown { border-top-color: var(--rx-rule); }
}
@media (max-width: 640px) {
  .rum-navbar .rum-logo-letter, .rum-navbar .nav-portal-u { font-size: 1.4rem; }
  .rum-navbar .rum-right-actions .portal-enter-link { font-size: 10.5px !important; }
  /* Con versalitas espaciadas ya no caben en una fila: bajan a dos */
  .rum-navbar .rum-right-actions {
    flex-wrap: wrap;
    width: 100%;
    margin-left: 0;
    justify-content: flex-start;
    gap: 6px 14px;
  }
  .rum-navbar .rum-right-actions .rum-nav-link,
  .rum-navbar .rum-right-actions .portal-enter-link,
  .rum-navbar .rum-right-actions .rum-nav-project-switch__select { letter-spacing: .06em !important; }
  .rum-navbar .rum-nav-project-switch { width: auto; max-width: 100%; }
  .rum-navbar .rum-nav-project-switch__select { max-width: 56vw; }
}
@media (prefers-reduced-motion: reduce) {
  .rum-navbar .rum-nav-role-portal::before { animation: none; }
  .rum-navbar .rum-nav-link::after, .rum-navbar .portal-enter-link::after { transition: none; }
}