/* =============================================
   KG NAV — header links
   ============================================= */
.kg-nav-links { display:flex; align-items:center; gap:.9rem; }
.kg-nav-links__item {
  display:inline-flex; align-items:center; gap:.3rem;
  font-size:.8rem; font-weight:600; color:#555; text-decoration:none;
  transition:color .2s;
}
.kg-nav-links__item:hover { color:#2563eb; text-decoration:none; }

/* =============================================
   PAGE
   ============================================= */
.kg-page { max-width:1140px; margin:0 auto; padding:1rem 0 3rem; }
.kg-page-title {
  display:flex; align-items:center; gap:.5rem;
  font-size:1.6rem; font-weight:700; margin-bottom:1.5rem; color:#1e293b;
}
.kg-page-title__icon { color:#2563eb; }
.kg-cocon-intro { color:#64748b; margin-bottom:1.5rem; font-size:.95rem; line-height:1.6; }

/* =============================================
   INTRO ENTITÉS
   ============================================= */
.kg-entities-intro {
  background: linear-gradient(135deg, #eff6ff 0%, #f0fdf4 100%);
  border: 1px solid #dbeafe;
  border-radius: 14px;
  padding: 1.5rem 1.75rem;
  margin-bottom: 1.75rem;
}
.kg-entities-intro__lead {
  font-size: 1rem;
  color: #1e293b;
  margin: 0 0 1rem;
  line-height: 1.6;
}
.kg-entities-intro__pills {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin-bottom: 1rem;
}
.kg-pill {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .4rem .9rem;
  border-radius: 100px;
  font-size: .82rem;
  font-weight: 700;
  border: 2px solid transparent;
  transition: transform .15s;
}
.kg-pill:hover { transform: translateY(-2px); }
.kg-pill--person { background: #ede9fe; color: #6d28d9; border-color: #c4b5fd; }
.kg-pill--brand  { background: #fef3c7; color: #92400e; border-color: #fcd34d; }
.kg-pill--org    { background: #dbeafe; color: #1e40af; border-color: #93c5fd; }
.kg-pill--place  { background: #dcfce7; color: #166534; border-color: #86efac; }
.kg-pill--work   { background: #fce7f3; color: #9d174d; border-color: #f9a8d4; }
.kg-entities-intro__sub {
  font-size: .875rem;
  color: #64748b;
  margin: 0;
  line-height: 1.55;
}
.kg-entities-intro__sub code {
  background: #e2e8f0;
  padding: .1rem .4rem;
  border-radius: 4px;
  font-family: monospace;
  font-size: .82rem;
  color: #334155;
}

/* =============================================
   SEARCH BOX
   ============================================= */
.kg-search-box { margin-bottom:2rem; }
.kg-search-box__inner {
  display:flex; box-shadow:0 2px 12px rgba(37,99,235,.1);
  border-radius:10px; overflow:hidden; border:2px solid #e2e8f0;
  transition:border-color .2s;
}
.kg-search-box__inner:focus-within { border-color:#2563eb; }
.kg-search-box__input {
  flex:1; padding:.85rem 1.2rem; font-size:1rem;
  border:none; outline:none; background:#fff; color:#1e293b;
}
.kg-search-box__btn {
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.85rem 1.6rem; background:#2563eb; color:#fff;
  font-weight:600; font-size:.95rem; border:none; cursor:pointer; transition:background .2s;
}
.kg-search-box__btn:hover { background:#1d4ed8; }
.kg-search-box__btn:disabled { background:#94a3b8; cursor:not-allowed; }

/* =============================================
   STATUS
   ============================================= */
.kg-search-status {
  margin-top:.75rem; padding:.65rem 1rem; border-radius:6px; font-size:.875rem;
}
.kg-search-status--loading { background:#eff6ff; color:#2563eb; display:flex; align-items:center; gap:.5rem; }
.kg-search-status--error   { background:#fef2f2; color:#dc2626; }
.kg-search-status--cooldown{ background:#fff7ed; color:#c2410c; }

.kg-spinner {
  display:inline-block; width:16px; height:16px;
  border:2px solid #bfdbfe; border-top-color:#2563eb;
  border-radius:50%; animation:kg-spin .7s linear infinite; flex-shrink:0;
}
@keyframes kg-spin { to { transform:rotate(360deg); } }

/* =============================================
   ENTITY CARDS (page Entités)
   ============================================= */
.kg-results { display:grid; gap:.9rem; }
.kg-results-header { font-size:.85rem; color:#64748b; margin-bottom:.25rem; font-weight:500; }
.kg-empty { color:#94a3b8; font-style:italic; padding:.5rem 0; }

.kg-entity-card {
  display:flex; gap:1rem; background:#fff;
  border:1px solid #e2e8f0; border-radius:10px; padding:1rem 1.2rem;
  transition:box-shadow .2s, border-color .2s;
}
.kg-entity-card:hover { box-shadow:0 4px 20px rgba(37,99,235,.08); border-color:#93c5fd; }
.kg-entity-card__img {
  flex-shrink:0; width:64px; height:64px; border-radius:8px;
  object-fit:cover; background:#f1f5f9;
}
.kg-entity-card__img-placeholder {
  width:64px; height:64px; border-radius:8px; background:#f1f5f9;
  display:flex; align-items:center; justify-content:center;
  font-size:1.6rem; flex-shrink:0; color:#94a3b8;
}
.kg-entity-card__body { flex:1; min-width:0; }
.kg-entity-card__name { font-size:1rem; font-weight:700; color:#1e293b; margin:0 0 .2rem; }
.kg-entity-card__types { display:flex; flex-wrap:wrap; gap:.3rem; margin-bottom:.4rem; }
.kg-entity-card__type {
  font-size:.7rem; font-weight:600; padding:.1rem .5rem;
  border-radius:100px; background:#eff6ff; color:#2563eb;
  text-transform:uppercase; letter-spacing:.04em;
}
.kg-entity-card__description { font-size:.875rem; color:#475569; margin:0 0 .4rem; }
.kg-entity-card__article { font-size:.8rem; color:#64748b; margin:0 0 .6rem; line-height:1.5; }
.kg-entity-card__links { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; margin-top:.5rem; }
.kg-entity-card__link {
  display:inline-flex; align-items:center; gap:.25rem;
  font-size:.76rem; font-weight:600; padding:.28rem .7rem;
  border-radius:6px; text-decoration:none; transition:background .15s;
}
.kg-entity-card__link--google { background:#4285f4; color:#fff; }
.kg-entity-card__link--google:hover { background:#1a73e8; color:#fff; }
.kg-entity-card__link--wiki { background:#f1f5f9; color:#334155; }
.kg-entity-card__link--wiki:hover { background:#e2e8f0; }
.kg-entity-card__kgmid {
  font-size:.68rem; font-family:monospace; color:#94a3b8;
  background:#f8fafc; padding:.15rem .4rem; border-radius:4px;
  border:1px solid #e2e8f0;
}
.kg-entity-card__score { font-size:.72rem; color:#94a3b8; margin-left:auto; }

/* =============================================
   TOOLBAR (cocon)
   ============================================= */
.kg-toolbar {
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:.75rem; margin-bottom:.85rem;
}
.kg-toolbar__stats { font-size:.875rem; color:#475569; }

.kg-view-toggle { display:flex; gap:0; border-radius:8px; overflow:hidden; border:1px solid #e2e8f0; }
.kg-view-toggle__btn {
  padding:.45rem 1rem; font-size:.8rem; font-weight:600;
  background:#fff; color:#64748b; border:none; cursor:pointer;
  border-right:1px solid #e2e8f0; transition:background .15s, color .15s;
  white-space:nowrap;
}
.kg-view-toggle__btn:last-child { border-right:none; }
.kg-view-toggle__btn:hover { background:#f1f5f9; color:#1e293b; }
.kg-view-toggle__btn--active { background:#2563eb; color:#fff; }
.kg-view-toggle__btn--active:hover { background:#1d4ed8; }

/* =============================================
   LÉGENDE
   ============================================= */
.kg-cocon-legend {
  display:flex; flex-wrap:wrap; gap:.6rem; align-items:center; margin-bottom:1rem;
}
.kg-cocon-legend__item {
  font-size:.75rem; font-weight:700; padding:.25rem .7rem;
  border-radius:100px; color:#fff;
}
.kg-cocon-legend__item--root    { background:#0f172a; }
.kg-cocon-legend__item--l1      { background:#1e40af; }
.kg-cocon-legend__item--l2      { background:#0e7490; }
.kg-cocon-legend__item--l3      { background:#0f766e; }
.kg-cocon-legend__hint { font-size:.73rem; color:#94a3b8; margin-left:.25rem; }

/* =============================================
   VUE CONTENEURS
   ============================================= */
.kg-view { display:none; }
.kg-view--active { display:block; }

/* =============================================
   VUE GRAPHE D3
   ============================================= */
#kg-view-graph { position:relative; }

/* Contrôles zoom */
.kg-zoom-controls {
  position:absolute; top:10px; right:12px;
  display:flex; flex-direction:column; gap:4px; z-index:10;
}
.kg-zoom-btn {
  width:34px; height:34px;
  background:rgba(255,255,255,0.92); border:1px solid #e2e8f0;
  border-radius:8px; font-size:1.1rem; font-weight:700; color:#334155;
  cursor:pointer; line-height:1; padding:0;
  box-shadow:0 2px 6px rgba(0,0,0,.1);
  transition:background .15s, color .15s, transform .1s;
  display:flex; align-items:center; justify-content:center;
}
.kg-zoom-btn:hover { background:#2563eb; color:#fff; border-color:#2563eb; transform:scale(1.08); }

.kg-graph-tooltip {
  position:absolute; background:#fff; border:1px solid #e2e8f0;
  border-radius:10px; padding:.7rem 1rem; font-size:.8rem;
  box-shadow:0 8px 28px rgba(0,0,0,.14); pointer-events:none;
  max-width:240px; line-height:1.6; z-index:100;
  transition:opacity .12s;
}
.kg-graph-tooltip strong {
  display:block; color:#0f172a; font-size:.9rem;
  font-weight:700; margin-bottom:.3rem;
}
.kg-tip-level  {
  display:inline-block; font-size:.68rem; font-weight:700;
  padding:.1rem .45rem; border-radius:4px;
  background:#1e40af; color:#fff; margin-bottom:.35rem;
}
.kg-tip-desc   { display:block; color:#475569; margin-bottom:.2rem; }
.kg-tip-types  {
  display:block; color:#2563eb; font-size:.75rem;
  font-weight:600; margin-bottom:.15rem;
}
.kg-tip-id     {
  display:block; color:#94a3b8; font-family:monospace;
  font-size:.68rem; margin-bottom:.2rem;
  background:#f8fafc; padding:.1rem .3rem; border-radius:3px;
}
.kg-tip-action {
  display:block; color:#4285f4; font-size:.75rem;
  font-weight:600; margin-top:.25rem;
}

/* =============================================
   VUE TABLEAU
   ============================================= */
.kg-table {
  width:100%; border-collapse:collapse; font-size:.85rem;
  border:1px solid #e2e8f0; border-radius:10px; overflow:hidden;
}
.kg-table thead tr { background:#f8fafc; }
.kg-table th { padding:.65rem .85rem; text-align:left; border-bottom:2px solid #e2e8f0; }
.kg-th-btn {
  background:none; border:none; cursor:pointer; font-size:.82rem;
  font-weight:700; color:#475569; padding:0; white-space:nowrap;
}
.kg-th-btn:hover { color:#2563eb; }
.kg-table td { padding:.6rem .85rem; border-bottom:1px solid #f1f5f9; vertical-align:middle; }
.kg-table__row--l1 td:first-child { border-left:3px solid #1e40af; }
.kg-table__row--l2 td:first-child { border-left:3px solid #0e7490; }
.kg-table__row--l3 td:first-child { border-left:3px solid #0f766e; }
.kg-table__level {
  font-size:.72rem; font-weight:700; padding:.15rem .5rem;
  border-radius:4px; color:#fff; white-space:nowrap;
}
.kg-table__level--l1 { background:#1e40af; }
.kg-table__level--l2 { background:#0e7490; }
.kg-table__level--l3 { background:#0f766e; }
.kg-table__name { font-weight:600; color:#1e293b; min-width:120px; }
.kg-table__desc { color:#64748b; max-width:260px; }
.kg-table__score { color:#94a3b8; text-align:right; }
.kg-table__type {
  display:inline-block; font-size:.65rem; font-weight:600;
  padding:.05rem .4rem; border-radius:100px;
  background:#eff6ff; color:#2563eb; margin:.1rem .1rem 0 0;
}
.kg-table__links { display:flex; flex-wrap:wrap; gap:.35rem; align-items:center; min-width:160px; }
.kg-table__link {
  font-size:.72rem; font-weight:600; padding:.2rem .5rem;
  border-radius:4px; text-decoration:none; white-space:nowrap;
}
.kg-table__link--google { background:#4285f4; color:#fff; }
.kg-table__link--google:hover { background:#1a73e8; color:#fff; }
.kg-table__link--wiki { background:#f1f5f9; color:#334155; border:1px solid #e2e8f0; }
.kg-table__link--wiki:hover { background:#e2e8f0; }
.kg-table__kgmid {
  font-size:.65rem; font-family:monospace; color:#94a3b8;
  background:#f8fafc; padding:.1rem .35rem; border-radius:3px;
  border:1px solid #e2e8f0;
}

/* =============================================
   VUE COLONNES
   ============================================= */
.kg-cocon-columns { display:flex; gap:.75rem; min-width:700px; }
.kg-cocon-col { flex:1; min-width:0; }
.kg-cocon-col__header {
  text-align:center; font-size:.72rem; font-weight:700;
  text-transform:uppercase; letter-spacing:.07em;
  padding:.35rem; border-radius:6px; margin-bottom:.75rem; color:#fff;
}
.kg-cocon-col--l1 .kg-cocon-col__header { background:#1e40af; }
.kg-cocon-col--l2 .kg-cocon-col__header { background:#0e7490; }
.kg-cocon-col--l3 .kg-cocon-col__header { background:#0f766e; }
.kg-cocon-col__empty { font-size:.78rem; color:#94a3b8; text-align:center; padding:.75rem; font-style:italic; }

.kg-cocon-node {
  background:#fff; border:1px solid #e2e8f0; border-radius:8px;
  padding:.6rem .8rem; margin-bottom:.5rem;
  transition:box-shadow .2s; cursor:default;
}
.kg-cocon-node:hover { box-shadow:0 2px 10px rgba(0,0,0,.07); }
.kg-cocon-node--l1 { border-left:3px solid #1e40af; }
.kg-cocon-node--l2 { border-left:3px solid #0e7490; }
.kg-cocon-node--l3 { border-left:3px solid #0f766e; }
.kg-cocon-node__name { font-weight:700; font-size:.83rem; color:#1e293b; margin-bottom:.1rem; }
.kg-cocon-node__desc { font-size:.74rem; color:#64748b; margin-bottom:.25rem; }
.kg-cocon-node__types { display:flex; flex-wrap:wrap; gap:.2rem; margin-bottom:.25rem; }
.kg-cocon-node__type {
  font-size:.62rem; font-weight:600; padding:.04rem .38rem;
  border-radius:100px; background:#f0fdf4; color:#15803d;
}
.kg-cocon-node__links { display:flex; flex-wrap:wrap; gap:.3rem; }
.kg-cocon-node__link {
  font-size:.68rem; font-weight:600; padding:.18rem .45rem;
  border-radius:4px; text-decoration:none; transition:background .15s;
}
.kg-cocon-node__link--google { background:#4285f4; color:#fff; }
.kg-cocon-node__link--google:hover { background:#1a73e8; color:#fff; }
.kg-cocon-node__link--wiki { background:#f1f5f9; color:#334155; border:1px solid #e2e8f0; }
.kg-cocon-node__link--wiki:hover { background:#e2e8f0; }
.kg-cocon-node__kgmid {
  font-size:.62rem; font-family:monospace; color:#94a3b8;
  background:#f8fafc; padding:.1rem .3rem; border-radius:3px;
  border:1px solid #e2e8f0;
}

/* =============================================
   MODAL AUTH
   ============================================= */
.kg-modal {
  position:fixed; inset:0; z-index:9999;
  display:flex; align-items:center; justify-content:center;
}
.kg-modal[hidden] { display:none; }
.kg-modal__backdrop {
  position:absolute; inset:0;
  background:rgba(15,23,42,.6); backdrop-filter:blur(3px);
}
.kg-modal__box {
  position:relative; background:#fff; border-radius:16px;
  padding:2.5rem 2rem; max-width:440px; width:90%;
  text-align:center; box-shadow:0 20px 60px rgba(0,0,0,.25);
}
.kg-modal__icon { font-size:2.5rem; margin-bottom:.75rem; }
.kg-modal__title { font-size:1.2rem; font-weight:700; color:#1e293b; margin-bottom:.75rem; }
.kg-modal__text { font-size:.9rem; color:#64748b; line-height:1.6; margin-bottom:1.5rem; }
.kg-modal__actions { display:flex; gap:.75rem; justify-content:center; flex-wrap:wrap; }
.kg-modal__close {
  position:absolute; top:.75rem; right:.75rem;
  background:none; border:none; font-size:1rem; color:#94a3b8; cursor:pointer; padding:.25rem;
}
.kg-modal__close:hover { color:#475569; }

/* =============================================
   BOUTONS
   ============================================= */
.kg-btn {
  display:inline-block; padding:.65rem 1.4rem; border-radius:8px;
  font-weight:600; font-size:.9rem; text-decoration:none;
  transition:background .2s, color .2s; cursor:pointer; border:none;
}
.kg-btn--primary  { background:#2563eb; color:#fff; }
.kg-btn--primary:hover  { background:#1d4ed8; color:#fff; }
.kg-btn--secondary{ background:#f1f5f9; color:#334155; border:1px solid #e2e8f0; }
.kg-btn--secondary:hover { background:#e2e8f0; color:#1e293b; }

/* =============================================
   RESPONSIVE
   ============================================= */
@media (max-width:640px) {
  .kg-search-box__btn { padding:.85rem 1rem; font-size:.82rem; }
  .kg-entity-card { flex-direction:column; }
  .kg-toolbar { flex-direction:column; align-items:flex-start; }
  .kg-cocon-columns { min-width:540px; }
  .kg-cocon-legend__hint { display:none; }
}
