/**
 * Plafond largeur UI (ultrawide / Samsung G9…)
 * max-w-6xl = 72rem — le contenu reste centré ; les max-w plus petits (2xl, 4xl…) restent respectés.
 */
:root {
  --ui-max-w-6xl: 72rem;
}

/* ——— HUD joueur : fond full-bleed, contenu plafonné ——— */
#player-hud {
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: none !important;
  transform: none !important;
  box-sizing: border-box;
}

#player-hud-inner {
  width: 100%;
  max-width: var(--ui-max-w-6xl);
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}

/* ——— Barre d’actions bas : fond full-bleed, contenu plafonné ——— */
#bottom-action-bar {
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: none !important;
  transform: none !important;
  box-sizing: border-box;
}

#bottom-action-bar-inner {
  width: 100%;
  max-width: var(--ui-max-w-6xl);
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}

/* ——— Combat : barres vie / boutons / log ——— */
#turn-based-combat-self-ui {
  left: 0;
  right: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
}

#combat-history-container,
#combat-self-ui-panel-inner {
  width: 100% !important;
  max-width: var(--ui-max-w-6xl) !important;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}

/* Fond boutons combat : pleine largeur */
#combat-self-ui-panel {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0;
  margin-right: 0;
}

/**
 * Avatars combat : écart horizontal plafonné à 72rem (bande centrée).
 * Joueur ancré au bord gauche de la bande, adversaire au bord droit.
 * Tailles proportionnelles au viewport (réf. ~1080p : joueur 400px, monstre 192px).
 */
:root {
  --combat-player-avatar-h: clamp(220px, 42vh, 640px);
  --combat-monster-avatar-size: clamp(110px, 20vh, 300px);
}

#combat-self-avatar-container {
  left: max(0px, calc(50% - (var(--ui-max-w-6xl) / 2))) !important;
}

#combat-opponent-container {
  right: max(0px, calc(50% - (var(--ui-max-w-6xl) / 2))) !important;
}

#combat-self-avatar-image.combat-avatar-player,
.combat-avatar-player {
  height: var(--combat-player-avatar-h) !important;
  width: auto !important;
  max-width: min(48vw, calc(var(--ui-max-w-6xl) * 0.55));
}

#combat-opponent-image.combat-avatar-monster,
.combat-avatar-monster {
  width: var(--combat-monster-avatar-size) !important;
  height: var(--combat-monster-avatar-size) !important;
}

/* 🌟 Ultra boss : avatar 2x plus grand que les monstres normaux en combat */
#combat-opponent-image.combat-avatar-monster.ultra-boss-avatar,
.combat-avatar-monster.ultra-boss-avatar {
  width: calc(var(--combat-monster-avatar-size) * 2) !important;
  height: calc(var(--combat-monster-avatar-size) * 2) !important;
}

/* ——— Loader de début de jeu ——— */
#loading-screen {
  align-items: center;
  justify-content: center;
}

#loading-screen > *:first-child {
  width: min(100%, var(--ui-max-w-6xl)) !important;
  max-width: var(--ui-max-w-6xl);
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}

/**
 * Modales plein écran : plafonne le panneau (1er enfant) à 72rem.
 * On force `width` (pas max-width) pour ne pas écraser les max-w-sm / 2xl / 4xl existants.
 * Exclusions : éditeur avatar, overlays techniques plein écran.
 */
[id$="-modal"].fixed:not(#avatar-modal):not(#combat-roll-overlay) > *:first-child,
[id$="Modal"].fixed:not(#avatar-modal) > *:first-child,
#shopModal.fixed > *:first-child,
#churchModal.fixed > *:first-child {
  width: min(100%, var(--ui-max-w-6xl)) !important;
  box-sizing: border-box;
}

/* EOF: modules/ui/ultrawide_layout.css - INTEGRITY_CHECK_OK */