/* =========================================================
   PATCH V13 - Nettoyage UI global
   - supprime les grosses barres claires de sélection
   - harmonise la colonisation en bleu Omega
   - garde les champs texte sélectionnables
   ========================================================= */

:root {
  --omega-blue-fix: #4d8dff;
  --omega-cyan-fix: #6ad0ff;
  --omega-panel-fix: rgba(8, 18, 34, 0.94);
  --omega-panel-soft-fix: rgba(14, 30, 54, 0.72);
  --omega-border-fix: rgba(106, 208, 255, 0.22);
}

/* Anti barres blanches/grises : le jeu n'a pas besoin de sélection texte sur les cartes UI */
html,
body,
main,
header,
nav,
section,
aside,
.panel,
.village-layout,
.village-nav-panel,
.village-main-column,
.village-tab-panel,
.hero-command-card,
.hero-stat-card,
.overview-priority-card,
.overview-section-card,
.nav-helper-card,
.nav-status-row,
.report-item,
.movement-colonisation,
.colonisation-village-box,
.colonisation-combat-panel,
.colonisation-movements-list,
.sidebar-colonisation-box,
.sidebar-multi-village-nav,
.top-resource-card,
.top-meta-card,
.resource-strip,
.empty-state,
.btn-primary,
.btn-secondary,
button {
  -webkit-user-select: none !important;
  -moz-user-select: none !important;
  -ms-user-select: none !important;
  user-select: none !important;
}

input,
textarea,
select,
[contenteditable="true"],
.message-body,
.reader-body,
.report-body,
.copyable,
pre,
code {
  -webkit-user-select: text !important;
  -moz-user-select: text !important;
  -ms-user-select: text !important;
  user-select: text !important;
}

/* Si le navigateur force quand même une sélection, elle devient bleue très discrète au lieu d'un pavé clair. */
::selection {
  background: rgba(77, 141, 255, 0.18) !important;
  color: #ffffff !important;
}
::-moz-selection {
  background: rgba(77, 141, 255, 0.18) !important;
  color: #ffffff !important;
}

/* Nettoyage des panneaux colonisation : bleu Omega, plus d'or/jaune agressif. */
.sidebar-colonisation-box,
.colonisation-village-box,
.colonisation-combat-panel {
  border-color: var(--omega-border-fix) !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(77, 141, 255, 0.13), transparent 34%),
    linear-gradient(180deg, rgba(8, 18, 34, 0.96), rgba(5, 12, 24, 0.94)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.035),
    0 14px 28px rgba(0, 0, 0, 0.22),
    0 0 22px rgba(77, 141, 255, 0.08) !important;
}

.sidebar-colonisation-box .colonisation-kicker,
.colonisation-combat-panel .panel-kicker,
.colonisation-combat-panel .panel-kicker,
.colonisation-village-box .colonisation-kicker {
  color: var(--omega-cyan-fix) !important;
}

.sidebar-colonisation-box h3,
.colonisation-village-box h3,
.colonisation-combat-panel h2,
.movement-colonisation .report-title {
  color: #eaf6ff !important;
  text-shadow: 0 0 14px rgba(106, 208, 255, 0.12) !important;
}

.colonisation-count,
.sidebar-colonisation-box .colonisation-count {
  color: #eaf6ff !important;
  border-color: rgba(106, 208, 255, 0.28) !important;
  background: linear-gradient(180deg, rgba(77, 141, 255, 0.22), rgba(77, 141, 255, 0.08)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04), 0 0 14px rgba(77, 141, 255, 0.12) !important;
}

.colonisation-badges span,
.sidebar-colonisation-box .colonisation-badges span {
  border-color: rgba(106, 208, 255, 0.22) !important;
  background: rgba(77, 141, 255, 0.09) !important;
  color: #dff4ff !important;
}

.colonisation-badges span.ok,
.sidebar-colonisation-box .colonisation-badges span.ok {
  border-color: rgba(91, 216, 255, 0.34) !important;
  background: rgba(31, 128, 255, 0.14) !important;
  color: #dff7ff !important;
}

.colonisation-main-btn,
.sidebar-colonisation-box button,
.movement-colonisation .movement-actions button,
.mv-btn,
.mv-list-btn {
  border-color: rgba(106, 208, 255, 0.28) !important;
  background: linear-gradient(180deg, rgba(34, 111, 232, 0.9), rgba(12, 44, 100, 0.92)) !important;
  color: #f4fbff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.08), 0 10px 22px rgba(0,0,0,0.18), 0 0 18px rgba(77,141,255,0.10) !important;
}

.colonisation-main-btn:disabled,
.sidebar-colonisation-box button:disabled {
  background: linear-gradient(180deg, rgba(20, 36, 61, 0.8), rgba(10, 20, 35, 0.85)) !important;
  color: rgba(220, 235, 255, 0.58) !important;
  border-color: rgba(106, 208, 255, 0.12) !important;
  box-shadow: none !important;
}

/* Carte de colon en route : retire les reflets rectangulaires clairs et passe en bleu. */
.colonisation-movements-list .movement-colonisation,
.movement-colonisation.report-item {
  position: relative;
  overflow: hidden;
  border-color: rgba(77, 141, 255, 0.28) !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(77, 141, 255, 0.14), transparent 28%),
    linear-gradient(180deg, rgba(12, 24, 44, 0.96), rgba(7, 15, 29, 0.96)) !important;
  box-shadow: inset 0 0 24px rgba(77, 141, 255, 0.06), 0 0 18px rgba(77, 141, 255, 0.06) !important;
}

.colonisation-movements-list .movement-colonisation::before,
.colonisation-movements-list .movement-colonisation::after,
.movement-colonisation.report-item::before,
.movement-colonisation.report-item::after {
  display: none !important;
  content: none !important;
}

.movement-colonisation .movement-head-row,
.movement-colonisation .movement-meta,
.movement-colonisation .movement-actions {
  position: relative;
  z-index: 2;
}

.movement-colonisation .movement-progress {
  position: relative;
  z-index: 2;
  background: rgba(77, 141, 255, 0.12) !important;
}

.movement-colonisation .movement-progress span {
  background: linear-gradient(90deg, #3f8cff, #7fdcff) !important;
  box-shadow: 0 0 12px rgba(77, 141, 255, 0.35) !important;
}

/* Badges navigation : colonisation en bleu. */
.nav-pill-blue,
#combat-colon-badge,
#colonisation-nav-badge {
  background: linear-gradient(180deg, rgba(77,141,255,.28), rgba(77,141,255,.10)) !important;
  border: 1px solid rgba(106,208,255,.30) !important;
  color: #dff6ff !important;
}

/* Sécurité sur les états vides qui pouvaient prendre une sélection claire. */
.empty-state,
.reports-list > .empty-state,
.no-data,
.placeholder-row {
  background: rgba(10, 22, 41, 0.62) !important;
  border-color: rgba(106, 208, 255, 0.12) !important;
}

/* =========================================================
   Patch 20260609 - Barre haute harmonisée avec village.html
   Appliqué aux pages qui chargent omega-ui-clean-fix.css
   ========================================================= */
.top-bar {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 auto !important;
    padding: 18px 38px !important;
    border-radius: 0 !important;
    clip-path: polygon(36px 0, calc(100% - 36px) 0, 100% 28px, 100% calc(100% - 28px), calc(100% - 36px) 100%, 36px 100%, 0 calc(100% - 28px), 0 28px) !important;
    background:
        linear-gradient(90deg, transparent 0%, rgba(35, 94, 168, .13) 18%, rgba(10, 24, 49, .94) 50%, rgba(35, 94, 168, .13) 82%, transparent 100%),
        linear-gradient(180deg, rgba(9, 25, 50, .92), rgba(3, 10, 23, .96)) !important;
    border: 1px solid rgba(82, 191, 255, .20) !important;
    border-top: 1px solid rgba(82, 191, 255, .20) !important;
    border-bottom: 1px solid rgba(82, 191, 255, .20) !important;
    box-shadow: 0 24px 70px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.04) !important;
}

.top-bar::before,
.top-bar::after {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    height: 2px !important;
    width: 92px !important;
    background: linear-gradient(90deg, transparent, rgba(69,217,255,.75)) !important;
    pointer-events: none !important;
}

.top-bar::before { left: 24px !important; }
.top-bar::after { right: 24px !important; transform: scaleX(-1) !important; }

.top-bar button,
.top-bar a {
    position: relative !important;
    overflow: hidden !important;
    min-width: 118px !important;
    padding: 12px 18px !important;
    border-radius: 0 !important;
    clip-path: polygon(12px 0, calc(100% - 8px) 0, 100% 8px, 100% calc(100% - 12px), calc(100% - 12px) 100%, 8px 100%, 0 calc(100% - 8px), 0 12px) !important;
    background: linear-gradient(180deg, rgba(21, 45, 82, .92), rgba(6, 16, 35, .96)) !important;
    border: 1px solid rgba(105, 173, 255, .17) !important;
    color: rgba(238,246,255,.95) !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.05) !important;
    transition: transform .15s ease, box-shadow .2s ease, border-color .2s ease, background .2s ease !important;
}

.top-bar button::before,
.top-bar a::before {
    content: none !important;
}

.top-bar button.active,
.top-bar button.is-active,
.top-bar a.active,
.top-bar a.is-active,
.top-bar button:hover,
.top-bar a:hover {
    transform: translateY(-1px) !important;
    background: linear-gradient(180deg, rgba(45, 134, 255, .78), rgba(16, 52, 112, .94)) !important;
    border-color: rgba(110, 204, 255, .50) !important;
    box-shadow: 0 0 26px rgba(47,140,255,.18), inset 0 1px 0 rgba(255,255,255,.14) !important;
}

@media (max-width: 760px) {
    .top-bar {
        width: auto !important;
        padding: 12px 14px !important;
        gap: 8px !important;
        clip-path: polygon(24px 0, calc(100% - 24px) 0, 100% 20px, 100% calc(100% - 20px), calc(100% - 24px) 100%, 24px 100%, 0 calc(100% - 20px), 0 20px) !important;
    }

    .top-bar button,
    .top-bar a {
        flex: 1 1 calc(50% - 8px) !important;
        min-width: 112px !important;
    }
}


/* PATCH MOBILE NAV/PANELS - 20260610 */
html, body { max-width: 100%; overflow-x: hidden; }
@media (max-width: 820px) {
    .main-header,
    main,
    #main-content,
    .panel,
    .academy-panel,
    .alliance-panel,
    .ranking-panel,
    .message-panel,
    .market-panel,
    .admin-panel {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    .top-bar {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        width: calc(100% - 20px) !important;
        max-width: calc(100% - 20px) !important;
        margin-left: auto !important;
        margin-right: auto !important;
        gap: 8px !important;
        overflow: visible !important;
    }

    .top-bar button,
    .top-bar a,
    button,
    .btn-primary,
    .btn-secondary,
    .academy-btn {
        min-width: 0 !important;
        min-height: 44px !important;
        white-space: normal !important;
        line-height: 1.12 !important;
        touch-action: manipulation;
    }

    .academy-inline-actions,
    .entry-actions,
    .panel-actions,
    .form-actions,
    .modal-actions {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 8px !important;
        width: 100% !important;
    }
}