/* ===========================================================
   Canada Hub 30217 · Thème Allmon3 personnalisé 2025
   Auteur : VA2DFK
   Version : v2.0.3-b (2025-10-17)
   =========================================================== */

/* ---------- Couleurs/variables globales (thème) ---------- */
:root{
  --brand-red:#b21e2b;
  --brand-red-2:#d22f3a;
  --brand-blue:#205b8f;

  --bg:#f7f8fb;
  --card:#ffffffcc;
  --text:#0b1220;
  --muted:#667085;
  --chip:#eef2f7;
  --shadow: 0 8px 24px rgba(16,24,40,.08);

  /* Variables Allmon3 (entête de nœud) */
  --am3-nodetitle-background:#b21e2b;   /* bande bleue */
  --am3-nodetitle-color:#fff;           /* texte dans la bande */
  --am3-nodetitle-button-hl:#b21e2b;    /* hover boutons entête */
}

body[data-theme="dark"]{
  --bg:#0e1217;
  --card:#1a1f27cc;
  --text:#e6e9ef;
  --muted:#9aa3b2;
  --chip:#1f2630;
  --shadow: 0 8px 24px rgba(0,0,0,.45);
}

/* ---------- Fond/texte global ---------- */
body.brand-bg{
  background:
    radial-gradient(1200px 600px at 30% -10%, rgba(210,47,58,.10), transparent),
    radial-gradient(1200px 600px at 100% 20%, rgba(32,91,143,.08), transparent),
    var(--bg);
  color: var(--text);
}

/* ---------- Navbar/entête ---------- */
.brand-navbar{
  background: linear-gradient(90deg, var(--brand-red), var(--brand-red-2));
  min-height:56px;
}
.brand-logo{
  width:42px; height:42px; object-fit:contain; display:block;
  filter: drop-shadow(0 2px 4px rgba(0,0,0,.2));
}
.navbar-brand .lh-1{ white-space:nowrap; }
.sep{ padding:0 .25rem; }
.brand-navbar .badge{
  border-radius:999px; padding:.25rem .5rem; line-height:1; font-weight:700;
  box-shadow: 0 2px 6px rgba(0,0,0,.15);
}
.brand-navbar .badge.bg-light{ color:#111; }

/* ---------- Sidebar ---------- */
.sidebar.brand-sidebar{
  background: linear-gradient(180deg, rgba(178,30,43,.14), rgba(32,91,143,.08));
  border-right: 1px solid rgba(0,0,0,.06);
  backdrop-filter: blur(6px);
}
.sidebar-sticky{ min-height: calc(100vh - 56px); }
.sidebar-badge{ width:92px; height:92px; object-fit:contain; display:block; }
.btn-brand{
  background: var(--brand-red); border: none; color: #fff; box-shadow: var(--shadow);
  transition: filter .15s ease, transform .05s ease;
}
.btn-brand:hover{ filter:brightness(1.08); color:#fff; }
.btn-brand:active{ transform: translateY(1px); }
.sidebar-footer{ padding-bottom:1rem; }

#sidebarMenu .btn{ border-radius:12px; overflow:hidden; }
#sidebarMenu .btn:not(.btn-brand){
  background: rgba(255,255,255,.55);
  border:1px solid rgba(0,0,0,.06);
  color: var(--text);
}
#sidebarMenu .btn:not(.btn-brand):hover{
  background: rgba(255,255,255,.75);
}

/* ---------- Cartes / effet “glass” ---------- */
.glass{
  background: var(--card);
  backdrop-filter: blur(8px);
  border-radius: 16px;
  box-shadow: var(--shadow);
}

/* ---------- Bandeau (hero) + puces ---------- */
.hero .hero-logo,
.hero img[src*="canada-hub-30217"]{
  width:96px; max-height:96px; height:auto; object-fit:contain; display:block;
}
.hero .d-flex.flex-wrap{ gap:.75rem; }
.hero{ position: relative; z-index:0; }

.chip{
  display:inline-flex; align-items:center; gap:.4rem;
  background: var(--chip);
  padding:.4rem .6rem; border-radius:999px; font-weight:600; font-size:.88rem;
  border:1px solid rgba(0,0,0,.06); white-space:nowrap;
}
.chip-green{ background:#eaf7ee; border-color:#c6ead1; }
.chip-blue{ background:#e8f1f9; border-color:#c7def1; }

/* ---------- Tables ---------- */
.table, .table-striped, .table-hover{
  --bs-table-bg: transparent;
  --bs-table-striped-bg: rgba(0,0,0,.02);
  --bs-table-hover-bg: rgba(0,0,0,.04);
  color: var(--text);
}
.table td, .table th{ vertical-align:middle; }
.table thead th{ font-weight:700; color: var(--muted); opacity:.8; }

/* ---------- Footer ---------- */
footer a{ text-decoration:none; }
footer a:hover{ text-decoration:underline; }

/* ---------- Formulaires / Modales ---------- */
.modal-content.glass{ border:1px solid rgba(0,0,0,.06); }
.form-control{ background: rgba(255,255,255,.8); border-radius:10px; }
body[data-theme="dark"] .form-control{
  background: rgba(255,255,255,.06); color: var(--text);
  border:1px solid rgba(255,255,255,.12);
}

/* ---------- Boutons ---------- */
.btn-primary{ background: var(--brand-blue); border-color: var(--brand-blue); }
.btn-primary:hover{ filter: brightness(1.08); }

/* ---------- Cartes/nœuds Allmon ---------- */
.card .card-header, .list-group-item.active, .table thead th{
  border-radius:8px !important;
}
#asl-statmon-dashboard-area .card,
#asl-node-navigation .card{
  border:0; border-radius:14px; box-shadow: var(--shadow);
}

/* ---------- Entêtes de nœuds : visibilité des actions (Conns/Up + carrés) ---------- */
.nodeline-header{
  position: relative;
  display:flex; align-items:center; gap:.5rem;
  overflow: visible !important;                  /* crucial : ne rien rogner */
  white-space: nowrap;
  min-height: 42px;
  padding-right: 12rem !important;               /* réserve pour Conns/Up + icônes */
}
.nodeline-header .float-end,
.nodeline-header .pull-right,
.nodeline-header .btn-group{
  margin-left:auto !important;
  display:inline-flex; align-items:center; gap:.35rem;
  z-index:2;
}
/* Boutons carrés d’action (Allmon définit .node-line-bi avec font-size:0 → on réactive) */
.node-line-bi{
  --bs-btn-padding-y: .18rem;
  --bs-btn-padding-x: .32rem;
  --bs-btn-font-size: .9rem;                     /* rend les icônes visibles */
  --bs-btn-border-radius: .5rem;
  line-height:1;
}
.node-line-bi .bi, .node-line-bi svg{ width:1rem; height:1rem; }

/* Compteurs/“meters” à droite */
.nodeline-header .progress,
.nodeline-header [class*="meter"],
.nodeline-header .stats{ margin-left:.5rem; }

/* En petits écrans : un peu moins de réserve à droite */
@media (max-width: 992px){
  .nodeline-header{ padding-right: 9rem !important; }
}

/* Sécurité overflow sur conteneurs de nœuds */
[id^="node-"], [id^="node-"] .card-header{ overflow: visible !important; }

/* ---------- Layout généraux ---------- */
main.col-md-9{ padding-top:.75rem; }
main img{ max-width:100%; height:auto; }

/* ---------- Divers ---------- */
.navbar .badge:empty{ display:none; }

/* --- Priorité aux clics sur les icônes de commande --- */
.nodeline-header { position: relative; z-index: 1; }

.nodeline-header .btn-group,
.nodeline-header .btn,
.nodeline-header .node-line-bi {
  position: relative;
  z-index: 10;           /* au-dessus de tout */
  pointer-events: auto;  /* clics autorisés */
}

/* Les éléments décoratifs (bargraph/compteurs) ne prennent pas le focus/clic */
.nodeline-header .progress,
.nodeline-header [class*="meter"],
.nodeline-header .stats {
  pointer-events: none;  /* la souris “traverse” */
}

/* Sécurité: aucune surface transparente ne bloque au-dessus des entêtes */
#asl-statmon-dashboard-area,
#asl-statmon-dashboard-area * {
  /* évite qu’un parent avec z-index élevé couvre les boutons */
  transform: translateZ(0);  /* crée un nouveau contexte sans overlay global */
}


