/*
 * chat-mobile.css — Design tokens og base-styles for Nexus Chat mobile UI.
 *
 * Bygger ovenpå --ui-* semantic aliases fra Nexus.UI.Shared/nexus.css.
 * Tilføjer chat-specifikke aliaser som bruges af mobile komponenter i
 * Chat/Nexus.Chat.UI.Shared/Components/Mobile/. Farvepaletten matcher
 * Mockup 3 / RPG-first (se .agent-artifacts/mockups/mockup-3-all-features.html).
 *
 * Loades fra Browser-klientens index.html via RCL auto-content path:
 *   _content/Nexus.Chat.UI.Shared/css/chat-mobile.css
 */

:root {
  /* RPG-accenter (dice, crit, fumble, combat-HP) */
  --chat-accent-dice: #d4a84d;
  --chat-accent-dice-bg: rgba(212, 168, 77, 0.12);
  --chat-accent-dice-border: rgba(212, 168, 77, 0.4);
  --chat-crit: #f97316;
  --chat-fumble: #dc2626;
  --chat-combat-hp: #ef4444;
  --chat-combat-hp-bg: rgba(239, 68, 68, 0.14);
  --chat-dm: #22c55e;
  --chat-dm-bg: rgba(34, 197, 94, 0.2);

  /* Primary accent (impersonation chip, send-button, active states) */
  --chat-primary: var(--ui-action-primary);
  --chat-primary-glow: rgba(139, 92, 246, 0.35);

  /* Role chips */
  --chat-role-dm-bg: rgba(34, 197, 94, 0.2);
  --chat-role-dm-fg: #86efac;
  --chat-role-player-bg: rgba(139, 92, 246, 0.2);
  --chat-role-player-fg: #c4b5fd;
  --chat-role-ooc-bg: rgba(107, 114, 128, 0.3);
  --chat-role-ooc-fg: #d1d5db;

  /* Presence-dots */
  --chat-presence-online: #22c55e;
  --chat-presence-away: #eab308;
  --chat-presence-off: #555;

  /* Mobile layout */
  --chat-mobile-tabbar-height: 64px;
  --chat-mobile-safe-bottom: env(safe-area-inset-bottom, 0px);
  --chat-mobile-tap-target: 44px;
}

/* Forced dark theme + RPG-mockup palette for mobile chat shell.
   Mobile chat-shellen er mockup-driven dark uafhaengigt af brugerens
   tema-praeference (jf. mockup-A1-parties-landing.png / mockup-A2-venner.png).
   Overrider --ui-* aliases direkte (i stedet for via --background chain) for
   at undgaa cascade-issues hvor :root-aliases beregnes med :root-tokens. */
.nx-chat-mobile {
  /* Surfaces */
  --ui-background: #0b0b14;
  --ui-surface: #1a1a26;
  --ui-surface-muted: #15151f;

  /* Text */
  --ui-text-primary: #f5f5fa;
  --ui-text-secondary: #8a8aa0;

  /* Actions */
  --ui-action-primary: #8b5cf6;
  --ui-action-primary-text: #ffffff;
  --ui-action-secondary: #2a2a3a;
  --ui-action-secondary-text: #f5f5fa;

  /* States */
  --ui-error: #dc2626;
  --ui-error-text: #ffffff;

  /* Borders & focus */
  --ui-border: #2a2a3a;
  --ui-ring: #8b5cf6;

  /* Chat-specifikke aliaser - direkte override (cascade gennem :root-defineret
     var(--ui-action-primary) virker ikke som forventet i WebView). */
  --chat-primary: #8b5cf6;
  --chat-primary-glow: rgba(139, 92, 246, 0.45);

  /* Phase 11 batch 15 oprydning: status-farver brugt af mobile chat party-cards
     og friend-list. Tidligere spredt som inline hex-vaerdier i scoped CSS — nu
     navngivne tokens saa de kan justeres ét sted. */

  /* Online / activity */
  --chat-status-online: #22c55e;          /* Green base, presence-dot baggrund */
  --chat-status-online-text: #4ade80;     /* Lighter green, "Online" tekst */
  --chat-status-online-glow: rgba(34, 197, 94, 0.8);
  --chat-status-online-bg: rgba(34, 197, 94, 0.12);

  /* Combat */
  --chat-combat-text: #f87171;            /* Light red, combat-tag tekst */
  --chat-combat-bg: rgba(220, 38, 38, 0.15);
  --chat-combat-border: rgba(220, 38, 38, 0.4);
  --chat-combat-glow: rgba(220, 38, 38, 0.45);

  /* Soft surfaces (sigil bg, dm-btn bg) */
  --chat-soft-primary: rgba(139, 92, 246, 0.12);
  --chat-soft-primary-active: rgba(139, 92, 246, 0.22);
  --chat-soft-primary-strong: rgba(139, 92, 246, 0.14);

  /* Featured-card glow (foerste party-card) */
  --chat-featured-border: rgba(139, 92, 246, 0.55);
  --chat-featured-shadow: 0 0 0 1px rgba(139, 92, 246, 0.25);

  /* Error / unread tile glow */
  --chat-fumble: #dc2626;                 /* Tab-badge baggrund (overflow med eksisterende) */
  --chat-fumble-text: #f87171;            /* Stat-tile "Ulæste" værdi */
  --chat-fumble-bg-soft: rgba(220, 38, 38, 0.08);
  --chat-fumble-bg-medium: rgba(220, 38, 38, 0.45);

  /* Friends-feature error-banner */
  --chat-error-banner-bg: rgba(239, 68, 68, 0.1);
  --chat-error-banner-border: rgba(239, 68, 68, 0.4);
}

/* Base reset for mobile chat surfaces — gælder inden for ChatsMobileShell */
.nx-chat-mobile *,
.nx-chat-mobile *::before,
.nx-chat-mobile *::after {
  box-sizing: border-box;
}

.nx-chat-mobile {
  -webkit-tap-highlight-color: transparent;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}