/* Docver.se v0.9.1 — UI light-only (Admin + Viewer) */
:root{
  --dv-bg:#f7f9fc; --dv-card:#ffffff; --dv-text:#1d2433; --dv-muted:#5b667a; --dv-line:#e6ebf2;
  --dv-primary:#4a67ff; --dv-primary-ghost:#e6ebff; --dv-danger:#e74c3c;
  --dv-radius:14px; --dv-shadow:0 6px 24px rgba(20,30,60,.08);
  --dv-blur-soft:6px; --dv-blur-strong:20px;
}

/* ---------- Layout / Cards / Form ---------- */
.dv-wrap{ max-width:1200px; }
.dv-title{ margin:24px 0; font-size:22px; color:var(--dv-text); }

.dv-grid{ display:grid; gap:16px; }
.dv-grid-2{ grid-template-columns:1fr 1fr; }
.dv-grid-3{ grid-template-columns:repeat(3,1fr); }
@media (max-width:1080px){
  .dv-grid-2,.dv-grid-3{ grid-template-columns:1fr; }
}

.dv-card{ background:var(--dv-card); border:1px solid var(--dv-line);
  border-radius:var(--dv-radius); box-shadow:var(--dv-shadow); padding:18px; }
.dv-card h3{ margin:0 0 10px; }
.dv-card-kpi .dv-kpi-row{ display:flex; gap:24px; margin-top:10px; color:var(--dv-muted); }
.dv-cards-tight .dv-card{ padding:14px; }

.dv-row{ display:flex; gap:10px; align-items:center; }
.dv-col{ flex:1; }
.dv-col-actions{ display:flex; gap:8px; justify-content:flex-end; flex-wrap:wrap; }

.dv-input,.dv-textarea,.dv-select,.dv-prefix{
  border:1px solid var(--dv-line); background:#fff; border-radius:10px;
  padding:10px 12px; font-size:14px; min-height:38px;
}
.dv-input[disabled]{ background:#f3f5f9; color:#9aa3b2; }
.dv-prefix{ border-right:none; border-top-right-radius:0; border-bottom-right-radius:0; color:#6b7280; }
.dv-row .dv-input:not([disabled]){ border-top-left-radius:0; border-bottom-left-radius:0; }

.dv-btn{
  background:var(--dv-primary); color:#fff; border:none; border-radius:12px; padding:10px 14px;
  font-weight:600; cursor:pointer; box-shadow:0 6px 16px rgba(74,103,255,.25);
}
.dv-btn-ghost{ background:var(--dv-primary-ghost); color:var(--dv-primary); box-shadow:none; }
.dv-btn:disabled{ opacity:.55; cursor:not-allowed; }

.dv-switch{ display:flex; gap:10px; align-items:center; margin:8px 0; }
.dv-switch input{ width:18px; height:18px; }

.dv-field{ display:flex; flex-direction:column; gap:6px; margin:10px 0; }
.dv-field span{ font-size:13px; color:var(--dv-muted); }
.dv-fieldset{ border:1px dashed var(--dv-line); padding:12px; border-radius:12px; margin:14px 0; }
.dv-checkbox{ display:flex; align-items:center; gap:8px; margin:8px 0; }

.dv-actions-row{ display:flex; gap:10px; margin-top:12px; flex-wrap:wrap; }
.dv-divider{ height:1px; background:var(--dv-line); margin:16px 0; }

.dv-list{ display:flex; flex-direction:column; gap:10px; }
.dv-list .dv-row-link{ border:1px solid var(--dv-line); border-radius:12px; padding:10px; background:#fff; }
.dv-link-title{ font-weight:600; color:var(--dv-text); }
.dv-link-url{ display:block; color:var(--dv-muted); text-decoration:none; font-size:13px; word-break:break-all; }

.dv-empty{ color:var(--dv-muted); padding:16px; }
.dv-flash{ animation: dvFlash .8s ease-in-out; }
@keyframes dvFlash{ 0%{box-shadow:0 0 0 0 rgba(74,103,255,.0);} 40%{ box-shadow:0 0 0 6px rgba(74,103,255,.18);} 100%{ box-shadow:0 0 0 0 rgba(74,103,255,.0);} }

/* ---------- Tables ---------- */
.dv-table-wrap{ width:100%; overflow:auto; }
.dv-table{ width:100%; border-collapse:collapse; }
.dv-table th, .dv-table td{ padding:8px 10px; border-bottom:1px solid var(--dv-line); text-align:left; vertical-align:middle; }
.dv-table thead th{ font-size:13px; color:var(--dv-muted); background:#f5f7fb; }

/* ---------- “More” dropdown ---------- */
.dv-more{ position:relative; }
.dv-more-menu{
  position:absolute; right:0; top:calc(100% + 8px);
  background:#fff; border:1px solid var(--dv-line); border-radius:12px; padding:8px;
  box-shadow:var(--dv-shadow); min-width:240px; z-index:50;
}
.dv-more-menu a{ display:block; padding:8px 10px; color:var(--dv-text); text-decoration:none; border-radius:8px; }
.dv-more-menu a:hover{ background:#f7f9fc; }

/* ---------- Analytics small ---------- */
.dv-analytics .dv-kpis{ display:flex; gap:16px; margin-bottom:12px; flex-wrap:wrap; }
.dv-kpi{ background:#fff; border:1px solid var(--dv-line); border-radius:12px; padding:12px 14px; min-width:180px; }
.dv-kpi-value{ font-size:22px; font-weight:700; }
.dv-kpi-label{ color:var(--dv-muted); }
.dv-section{ margin-top:18px; }

/* ---------- Completion ring (sessions) [DV PATCH] ---------- */
.dv-ring{
  --p: 0;                 /* 0–100 (alimenté en JS ou inline) */
  --track:#e9eef6;        /* fond gris */
  --size:28px;            /* taille du cercle */
  position: relative;
  display: inline-grid;
  place-items: center;
  width: var(--size);
  height: var(--size);
}

.dv-ring i{
  /* angle calculé à partir de --p */
  --deg: calc((clamp(0, var(--p), 100) / 100) * 360deg);
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background:
    conic-gradient(var(--dv-primary) var(--deg), var(--track) 0),
    radial-gradient(farthest-side, #fff 65%, transparent 66%);
  box-shadow: 0 0 0 1px #fff inset; /* bord net */
}

/* % centré (aucune balise en plus nécessaire) */
.dv-ring::after{
  content: attr(data-p) '%';
  position: absolute; inset: 0;
  display: grid; place-items: center;
  font-size: 11px; font-weight: 700; color: var(--dv-text);
  pointer-events: none;
}

/* (IMPORTANT) on retire toute règle type attr(... percentage) qui cassait l’affichage */


/* ---------- Viewer ---------- */
.docverse-viewer-body{ background:var(--dv-bg); }
.docverse-viewer{ background:var(--dv-bg); min-height:100vh; }
.dv-header{
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 16px; background:#fff; border-bottom:1px solid var(--dv-line);
  position:sticky; top:0; z-index:10;
}
.dv-brand{ display:flex; gap:12px; align-items:center; }
.dv-logo{ width:32px; height:32px; border-radius:10px; background:var(--dv-primary);
  color:#fff; display:grid; place-items:center; font-weight:800; }
.dv-logo-img{ width:32px; height:32px; object-fit:contain; border-radius:8px; border:1px solid var(--dv-line); background:#fff; }
.dv-meta small{ color:var(--dv-muted); display:block; line-height:1.1; }

.dv-main{ padding:18px; max-width:1200px; margin:0 auto; }
.dv-gate .dv-card{ max-width:560px; margin:40px auto; }
.dv-hint{ color:var(--dv-muted); font-size:12px; }

.dv-stage{ position:relative; }
.dv-page-label{ font-size:13px; color:var(--dv-muted); margin:0 8px; }
#dv-pdf-wrap{
  background:#fff; border-radius:12px; overflow:auto; border:1px solid var(--dv-line);
  height: calc(100vh - 220px);
}

/* Pages flow */
.dv-pages{ --dv-zoom: 1; padding:16px; display:flex; flex-direction:column; align-items:center; gap:16px; }
.dv-page{ width:100%; max-width:1100px; background:#1d1d1d; border-radius:10px; overflow:hidden; position:relative; min-height:300px; }
.dv-page img{ display:block; width: calc(100% * var(--dv-zoom)); height:auto; margin:0 auto;
  transition: transform .15s ease, opacity .2s ease; background:#f5f7fb; }

/* Watermark overlay (client) — un grand texte diagonal */
.dv-watermark{
  pointer-events:none; position:absolute; inset:0; z-index:1;
  display:flex; align-items:center; justify-content:center;
}
.dv-watermark::before{
  content: attr(data-text);
  color: rgba(0,0,0,.12);
  font-weight:700; font-size: clamp(24px, 5vw, 48px);
  transform: rotate(-25deg);
  white-space:nowrap;
}

/* Feedback modal */
.dv-fab{ position:fixed; right:18px; bottom:18px; width:56px; height:56px; border-radius:50%;
  border:none; background:var(--dv-primary); color:#fff; font-size:22px; box-shadow:var(--dv-shadow); cursor:pointer; z-index:20; }
.dv-modal{ position:fixed; inset:0; background:rgba(0,0,0,.35); display:grid; place-items:center; z-index:25; }
.dv-modal[hidden]{ display:none !important; }
.dv-modal-dialog{ width:min(560px,92vw); background:#fff; border:1px solid var(--dv-line);
  border-radius:16px; padding:16px; box-shadow:var(--dv-shadow); position:relative; }
.dv-modal-close{ position:absolute; right:10px; top:8px; width:32px; height:32px; border-radius:8px; border:1px solid var(--dv-line); background:#fff; cursor:pointer; }

/* Tooltip analytics (admin doc chart) */
.dv-tip{ position:fixed; z-index:1000; background:#fff; border:1px solid var(--dv-line);
  border-radius:12px; padding:10px; box-shadow:var(--dv-shadow); width:260px; }
.dv-tip[hidden]{ display:none !important; }
.dv-tip-inner{ display:flex; gap:8px; align-items:flex-start; }
.dv-tip-meta{ font-size:13px; color:var(--dv-text); }
.dv-tip img{ width:96px; height:auto; border:1px solid var(--dv-line); border-radius:8px; background:#fff; }

/* ---------- Anti-capture / Shields ---------- */
.dv-blur-host.is-blurred   { filter: blur(var(--dv-blur-soft));  }
.dv-blur-host.is-blurred-strong{ filter: blur(var(--dv-blur-strong)); }

#dv-shield, #dv-print-shield{
  position:fixed; inset:0; background:rgba(255,255,255,.92); display:none;
  align-items:center; justify-content:center; z-index:9999;
}
#dv-shield.is-active, #dv-print-shield.is-active{ display:flex; }
.dv-shield-box{
  background:#fff; border:1px solid var(--dv-line); border-radius:16px; padding:18px; box-shadow:var(--dv-shadow);
  width:min(520px, 92vw); text-align:center;
}
.dv-shield-box h3{ margin:0 0 6px; }
.dv-shield-actions{ margin-top:12px; display:flex; justify-content:center; }
#dv-panic{
  position:fixed; inset:0; pointer-events:none; z-index:9998;
  background: repeating-linear-gradient(45deg, rgba(74,103,255,.14) 0 16px, transparent 16px 32px);
  opacity:0; transition: opacity .2s ease;
}
#dv-panic.is-active{ opacity:1; }

/* ===== PATCH DOCVERSE — forcer l'affichage Appareil/OS/Localisation ===== */
#dv-sessions-table th:nth-child(5),
#dv-sessions-table td:nth-child(5),
#dv-sessions-table th:nth-child(6),
#dv-sessions-table td:nth-child(6),
#dv-sessions-table th:nth-child(7),
#dv-sessions-table td:nth-child(7){
  display: table-cell !important;   /* au cas où un style ailleurs les masque */
  visibility: visible !important;
}

/* ===== PATCH DOCVERSE — largeur fixe + ellipses pour éviter le débordement ===== */
#dv-sessions-table{ table-layout: fixed; }
#dv-sessions-table th, #dv-sessions-table td{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* répartition simple (total ≈ 100%) */
#dv-sessions-table th:nth-child(1), #dv-sessions-table td:nth-child(1){ width: 28%; } /* Visiteur */
#dv-sessions-table th:nth-child(2), #dv-sessions-table td:nth-child(2){ width: 10%; } /* Durée */
#dv-sessions-table th:nth-child(3), #dv-sessions-table td:nth-child(3){ width: 10%; } /* Completion */
#dv-sessions-table th:nth-child(4), #dv-sessions-table td:nth-child(4){ width: 18%; } /* Dernière vue */
#dv-sessions-table th:nth-child(5), #dv-sessions-table td:nth-child(5){ width: 10%; } /* Appareil */
#dv-sessions-table th:nth-child(6), #dv-sessions-table td:nth-child(6){ width: 12%; } /* OS */
#dv-sessions-table th:nth-child(7), #dv-sessions-table td:nth-child(7){ width: 10%; } /* Localisation */
#dv-sessions-table th:nth-child(8), #dv-sessions-table td:nth-child(8){ width: 2%;  } /* actions */