/* logo.css — element de marca compartit per totes les pàgines.
   Importa-ho després de tokens.css i abans dels estils específics de la pàgina. */

.logo-link {
  display: inline-flex;
  align-items: baseline;
  padding: 6px 8px;
  border-radius: var(--r-sm);
  transition: opacity var(--dur) var(--ease);
}
.logo-link:hover { opacity: 0.85; }

.logo {
  font-family: var(--font-display);
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: -0.04em;
  font-variation-settings: "opsz" 36, "SOFT" 50;
  color: var(--text-1);
  user-select: none;
  /* Brief 013 TASCA D: a iPhone Safari, quan la topbar es comprimeix
     i el contenidor del logo queda estret, "myyo" wrappava entre la
     2a y i l'o ("myy / o"). Forcem nowrap al logo i al seu link
     contenidor. */
  white-space: nowrap;
}
.logo-link {
  white-space: nowrap;
}

/* yy centrals: cinta lleugera entre la m i la o — contrast extrem de gruix. */
.logo-y {
  display: inline-block;
  font-weight: 200;
  font-variation-settings: "opsz" 36, "SOFT" 70;
}
.logo-y--2 {
  margin-left: -0.04em;
}

/* Topbar slots — display: contents perquè els fills participin directament
   al flex layout de .topbar-actions (gap, alineació). */
.topbar-anon, .topbar-auth {
  display: contents;
}
.topbar-anon[hidden], .topbar-auth[hidden] {
  display: none;
}

/* Botó/link discret comú al topbar (Salir, "Iniciar sesión", etc.).
   Definit aquí perquè login.html també l'usa via topbar.js. */
.link-quiet {
  color: var(--text-2);
  font-size: 0.9rem;
  padding: 8px 12px;
  border-radius: var(--r-sm);
  background: none;
  border: 0;
  cursor: pointer;
  transition: color var(--dur) var(--ease), background var(--dur) var(--ease);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
}
.link-quiet:hover { color: var(--text-1); background: var(--bg-1); }
.link-quiet:disabled { opacity: 0.5; cursor: not-allowed; }

/* Brief 073 (9/5/2026) — version display al costat del logo (substitueix la barra negra inferior). */
.logo-version {
  display: inline-block;
  font-size: 0.6rem;
  color: var(--text-tertiary);
  margin-left: 6px;
  letter-spacing: -0.02em;
  vertical-align: middle;
  opacity: 0.7;
}