/* ==========================================
   Sentinelis Feedback — Widget + Dashboard
   ========================================== */

.svdl-review{ max-width:680px; font-family:Manrope,system-ui,-apple-system,Segoe UI,Roboto,sans-serif; }
.svdl-review__card{ position:relative; border-radius:22px; padding:18px 18px 16px; background:#0E3557; color:#fff; overflow:hidden; }
/* Reserve space so the top-right close X never touches the centered title */
.svdl-review__title{
  font-weight:900; letter-spacing:.06em; font-size:22px; text-transform:uppercase;
  text-align:center; margin-bottom:14px;
  padding-left:40px; padding-right:40px;
}
.svdl-review__buttons{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr)); /* 50/50 columns side by side */
  gap:18px;
  justify-items:center;
  align-items:start;
  width:100%;
}

.svdl-review__btn{
  width:68px; height:68px; border-radius:24px; border:0 !important;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
  transition:none !important;
  outline:0 !important;
  -webkit-tap-highlight-color: transparent;
  box-shadow:
    0 10px 24px rgba(0,0,0,.22),
    inset 0 0 0 1px rgba(255,255,255,.10) !important;
  outline-color: transparent !important;
  border-color: transparent !important;
}
/* Boutons comme le design (glow + relief) */
.svdl-review__btn--up{
  background:#6FD457 !important;
  box-shadow:
    0 12px 28px rgba(0,0,0,.22),
    inset 0 8px 18px rgba(255,255,255,.18),
    inset 0 -10px 18px rgba(0,0,0,.12),
    inset 0 0 0 2px rgba(0,0,0,.10) !important;
}
.svdl-review__btn--down{
  background:#6B7280 !important;
  box-shadow:
    0 12px 28px rgba(0,0,0,.22),
    inset 0 10px 20px rgba(255,255,255,.14),
    inset 0 -12px 22px rgba(0,0,0,.26),
    inset 0 0 0 2px rgba(0,0,0,.12) !important;
}

/* Pas de hover / pas d'effet de press (comme demandé) */
.svdl-review__btn:hover,
.svdl-review__btn:active,
.svdl-review__btn:focus,
.svdl-review__btn:focus-visible{
  transform:none !important;
  filter:none !important;
  outline:0 !important;
  border:0 !important;
}

/* Force no hover overrides (Elementor themes can inject hover styles) */
.svdl-review__btn--up:hover,
.svdl-review__btn--up:active,
.svdl-review__btn--up:focus,
.svdl-review__btn--up:focus-visible{
  background:#6FD457 !important;
  box-shadow:
    0 12px 28px rgba(0,0,0,.22),
    inset 0 8px 18px rgba(255,255,255,.18),
    inset 0 -10px 18px rgba(0,0,0,.12),
    inset 0 0 0 2px rgba(0,0,0,.10) !important;
}

.svdl-review__btn--down:hover,
.svdl-review__btn--down:active,
.svdl-review__btn--down:focus,
.svdl-review__btn--down:focus-visible{
  background:#6B7280 !important;
  box-shadow:
    0 12px 28px rgba(0,0,0,.22),
    inset 0 10px 20px rgba(255,255,255,.14),
    inset 0 -12px 22px rgba(0,0,0,.26),
    inset 0 0 0 2px rgba(0,0,0,.12) !important;
}

/* Hard kill any theme/Elementor border/outline that may add a red ring */
.svdl-review__btn,
.svdl-review__btn:focus,
.svdl-review__btn:focus-visible{
  outline:0 !important;
  border-color:transparent !important;
}

.svdl-review__btn-wrapper{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:4px;
  width:100%;
  max-width:240px;
}
.svdl-review__icon{ font-size:30px; line-height:1; pointer-events:none; filter:drop-shadow(0 2px 4px rgba(0,0,0,.25)); }
.svdl-review__text{
  font-size:10px;
  line-height:1.2;
  text-align:center;
  font-weight:600;
  color:#E9F4FF;
  max-width:180px;
  width:100%;
}

.svdl-review__disclaimer{
  margin-top:10px;
  text-align:center;

  /* Lisibilité mobile */
  font-size:12px;        /* un poil plus gros que 11 */
  font-weight:700;
  line-height:1.4;
  color:#E9F4FF;
  opacity:.95;

  /* Pill clean (sans glow) */
  display:inline-block;
  padding:10px 14px;
  border-radius:999px;

  /* Fond dégradé subtil */
  background:
    linear-gradient(90deg,
      rgba(124,255,155,.14) 0%,
      rgba(90,200,250,.14) 55%,
      rgba(255,255,255,.08) 100%
    );

  /* Bordure fine uniquement (pas d'ombre) */
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.12);

  /* NO ANIM / NO GLOW */
  animation:none !important;
  filter:none !important;
}

/* Make sure it stays centered even with inline-block */
.svdl-review__card .svdl-review__disclaimer{ margin-left:auto; margin-right:auto; }

/* Kill any previous animation hook */
.feedback_widget.fw-visible .svdl-review__disclaimer{
  animation:none !important;
  filter:none !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.12) !important;
}

/* Mobile readability tweaks */
@media (max-width: 480px){
  .svdl-review__disclaimer{
    font-size:12.5px;
    padding:10px 14px;
  }
}

.svdl-review__hint{
  margin-top:14px; text-align:center;
  font-size:16px; font-weight:700;
  opacity:0; color:#E9F4FF; line-height:1.4;
  visibility:hidden;
  height:0;
  overflow:hidden;
}
.svdl-review__hint.is-visible{ 
  opacity:1;
  visibility:visible;
  height:auto;
  animation:svdlFadeIn .35s ease; 
}
@keyframes svdlFadeIn{ from{opacity:0;transform:translateY(6px)} to{opacity:1;transform:translateY(0)} }

/* ==========================================
   Floating wrapper (optional)
   - If you wrap the shortcode in an element with class "feedback_widget",
     the plugin can reveal it only after 50% scroll and add a close button.
   - This does NOT force a position/layout (so it won't break Elementor).
   ========================================== */

.feedback_widget{
  /* Docked full-width bar like your mobile screenshot */
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  z-index: 2147483647 !important;

  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .25s ease, visibility .25s ease, transform .25s ease;
  transform: translateY(12px);
}

.feedback_widget.fw-visible{
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}

.feedback_widget.fw-closed{
  display: none !important;
}

/* When docked, stretch the widget content to the screen edges */
.feedback_widget .svdl-review{
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
}
.feedback_widget .svdl-review__card{
  border-radius: 0 !important;
}

/* Close button (injected by JS) */
.feedback_widget .fw-close{
  position: absolute;
  top: 14px;
  right: 16px;
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: 0;
  background: transparent;
  cursor: pointer;
  z-index: 50;
}

.feedback_widget .fw-close::before,
.feedback_widget .fw-close::after{
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 18px;
  height: 3px;
  background: #fff;
  border-radius: 2px;
  transform-origin: center;
}

.feedback_widget .fw-close::before{ transform: translate(-50%,-50%) rotate(45deg); }
.feedback_widget .fw-close::after{ transform: translate(-50%,-50%) rotate(-45deg); }

/* Pas de hover sur la croix (design "X" simple) */
.feedback_widget .fw-close:hover{ background: transparent; }

/* Modal confirmation négatif */
.svdl-modal{ display:none; }
.svdl-modal.is-open{ display:block; }
.svdl-modal__backdrop{ position:fixed; inset:0; background:rgba(0,0,0,.55); z-index:2147483648 !important; }
.svdl-modal__panel{
  position:fixed; left:50%; top:50%; transform:translate(-50%,-50%);
  width:min(420px, calc(100vw - 32px));
  max-width:90vw;
  background:#fff; border-radius:16px;
  box-shadow:0 20px 70px rgba(0,0,0,.25);
  z-index:2147483649 !important; overflow:hidden;
}
.svdl-modal__head{ display:flex; justify-content:space-between; align-items:center; padding:12px 16px; background:linear-gradient(180deg,#0E3557,#0B2A45); }
.svdl-modal__title{ font-weight:700; font-size:15px; color:#fff; }
.svdl-modal__close{ border:0 !important; background:transparent !important; cursor:pointer; font-size:20px; line-height:1; color:#F4E8D3 !important; padding:4px; outline:none !important; }
.svdl-modal__close:hover, .svdl-modal__close:focus{ color:#F4E8D3 !important; opacity:.8; }
.svdl-modal__body{ padding:16px 18px 18px; }
.svdl-modal__text{ margin:0 0 14px; color:#1d2a35; font-size:14px; line-height:1.5; }
.svdl-modal__actions{ display:flex; gap:10px; justify-content:flex-end; align-items:center; }
.svdl-modal .svdl-btn{ border-radius:10px; padding:9px 16px; font-weight:700; font-size:14px; border:2px solid transparent !important; cursor:pointer; transition:opacity .2s ease; outline:none !important; }
.svdl-modal .svdl-btn:hover{ opacity:.85; }
.svdl-modal .svdl-btn:focus{ outline:none !important; box-shadow:none !important; border-color:rgba(14,53,87,.3) !important; }
.svdl-modal .svdl-btn--primary{ background:#0E3557 !important; color:#fff !important; border-color:#0E3557 !important; }
.svdl-modal .svdl-btn--primary:hover, .svdl-modal .svdl-btn--primary:focus{ background:#0E3557 !important; border-color:#0E3557 !important; }
.svdl-modal .svdl-btn--ghost{ background:rgba(14,53,87,.08) !important; color:#0E3557 !important; border-color:rgba(14,53,87,.25) !important; }
.svdl-modal .svdl-btn--ghost:hover, .svdl-modal .svdl-btn--ghost:focus{ background:rgba(14,53,87,.08) !important; border-color:rgba(14,53,87,.25) !important; }
.svdl-modal__status{ margin-top:10px; font-size:13px; color:#0E3557; }

/* Mobile adjustments */
@media (max-width: 480px){
  .svdl-modal__panel{ 
    width:calc(100vw - 24px);
    max-width:none;
  }
  .svdl-modal__head{ padding:10px 14px; }
  .svdl-modal__title{ font-size:14px; }
  .svdl-modal__body{ padding:14px 16px 16px; }
  .svdl-modal__text{ font-size:13px; }
  .svdl-btn{ padding:8px 14px; font-size:13px; }
}

/* ==========================================
   DASHBOARD ADMIN — Mobile-first, WP-compatible
   ========================================== */

/* Container principal */
.svdl-dash{ 
  font-family:Manrope,system-ui,-apple-system,Segoe UI,Roboto,sans-serif; 
  color:#0E3557;
  max-width:100%;
  margin:0 auto;
}

/* Layout grid : 1 col mobile → 2 col desktop */
.svdl-dash__top{ 
  display:grid; 
  grid-template-columns:1fr; 
  gap:16px;
  margin-bottom:16px;
}
@media(min-width:1024px){ 
  .svdl-dash__top{ 
    grid-template-columns:minmax(360px, 440px) 1fr; 
  } 
}

/* Cartes universelles */
.svdl-dash__card{ 
  background:#fff; 
  border-radius:12px; 
  box-shadow:0 2px 8px rgba(0,0,0,.06), inset 0 0 0 1px rgba(14,53,87,.06); 
  padding:16px;
  overflow:hidden;
}

/* Header de carte : titre + actions */
.svdl-dash__header{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
  margin-bottom:16px;
}

.svdl-dash__header-left{
  flex:1 1 auto;
  min-width:0;
}

.svdl-dash__header-right{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
}

.svdl-dash__title{ 
  font-weight:700; 
  font-size:17px; 
  margin:0 0 4px;
  line-height:1.3;
}

.svdl-dash__sub{ 
  font-size:13px; 
  opacity:.7; 
  margin:0;
}

/* Bloc stats + donut */
.svdl-dash__row{ 
  display:flex; 
  gap:16px; 
  align-items:center;
  flex-wrap:wrap;
}

/* Donut (camembert) */
.svdl-dash__pie{
  width:100px; 
  height:100px; 
  border-radius:50%;
  background:conic-gradient(#6FD457 0 0%, #1F6AA5 0% 100%);
  position:relative;
  box-shadow:0 4px 12px rgba(0,0,0,.1), inset 0 0 0 1px rgba(14,53,87,.08);
  flex:0 0 auto;
}
.svdl-dash__pie::after{ 
  content:""; 
  position:absolute; 
  inset:22%; 
  background:#fff; 
  border-radius:50%; 
  box-shadow:inset 0 0 0 1px rgba(14,53,87,.06); 
}

/* Légende stats */
.svdl-dash__legend{ 
  display:flex; 
  flex-direction:column; 
  gap:8px; 
  font-size:14px;
  flex:1 1 auto;
  min-width:0;
}

.svdl-dash__legend > div{
  display:flex;
  align-items:center;
  gap:6px;
}

.svdl-dash__total{ 
  margin-top:4px; 
  padding-top:8px;
  border-top:1px solid rgba(14,53,87,.08);
  font-weight:600;
}

.svdl-dot{ 
  width:10px; 
  height:10px; 
  border-radius:50%; 
  flex:0 0 auto;
}
.svdl-dot--up{ background:#6FD457; }
.svdl-dot--down{ background:#6B7280; }

.svdl-muted{ opacity:.65; }

.svdl-dash__small{ 
  font-size:12px; 
  margin-top:12px;
  opacity:.7;
}

/* ==========================================
   TABLEAU HISTORIQUE
   ========================================== */

.svdl-dash__tablewrap{ 
  overflow-x:auto;
  margin:0 -16px;
  padding:0 16px;
  -webkit-overflow-scrolling:touch;
}

.svdl-dash__table{ 
  width:100%; 
  border-collapse:collapse; 
  font-size:13px;
  min-width:600px;
}

.svdl-dash__table th, 
.svdl-dash__table td{ 
  padding:10px 8px; 
  border-bottom:1px solid rgba(14,53,87,.06); 
  text-align:left;
  vertical-align:middle;
}

.svdl-dash__table th{ 
  font-size:11px; 
  font-weight:700;
  text-transform:uppercase; 
  letter-spacing:.05em; 
  opacity:.6;
  white-space:nowrap;
}

/* Colonnes spécifiques */
.svdl-dash__table td:nth-child(1){ 
  white-space:nowrap; 
  width:130px;
}

.svdl-dash__table td:nth-child(2){ 
  white-space:nowrap;
  width:110px;
}

.svdl-dash__table td:nth-child(3){ 
  max-width:280px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.svdl-dash__table td:nth-child(4){ 
  white-space:nowrap;
  width:110px;
  font-family:monospace;
  font-size:12px;
}

/* Badge vote */
.svdl-badge{ 
  display:inline-flex; 
  align-items:center; 
  gap:4px; 
  padding:4px 10px; 
  border-radius:999px; 
  font-weight:700; 
  font-size:11px; 
  white-space:nowrap;
}
.svdl-badge--up{ 
  background:rgba(111,212,87,.12); 
  color:#1e6b3a; 
}
.svdl-badge--down{ 
  background:rgba(107,114,128,.12); 
  color:#374151; 
}

/* Lien page */
.svdl-link{ 
  color:#0E3557; 
  text-decoration:none;
  font-weight:500;
}
.svdl-link:hover{ 
  text-decoration:underline; 
  color:#1F6AA5;
}

/* ==========================================
   BOUTONS & CONTRÔLES
   ========================================== */

.svdl-btn{ 
  border-radius:8px; 
  padding:8px 14px; 
  font-weight:600; 
  font-size:13px; 
  border:0; 
  cursor:pointer;
  transition:opacity .2s ease, transform .1s ease;
  white-space:nowrap;
  line-height:1.4;
}
.svdl-btn:hover:not(:disabled){ 
  opacity:.85;
  transform:translateY(-1px);
}
.svdl-btn:disabled{
  opacity:.5;
  cursor:not-allowed;
}

.svdl-btn--primary{ 
  background:#0E3557; 
  color:#fff; 
}
.svdl-btn--ghost{ 
  background:rgba(14,53,87,.08); 
  color:#0E3557; 
}

/* ==========================================
   FILTRE DE PAGES (admin)
   ========================================== */

.svdl-pages__filter{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:8px;
}

.svdl-input{ 
  padding:8px 12px; 
  border-radius:6px; 
  border:1px solid rgba(14,53,87,.12); 
  font-size:13px;
  width:100%;
  max-width:320px;
  transition:border-color .2s ease;
}
.svdl-input:focus{
  outline:none;
  border-color:rgba(14,53,87,.3);
}

.svdl-pages__list{ 
  max-width:100%;
  max-height:320px;
  overflow-y:auto;
  border:1px solid rgba(14,53,87,.08);
  border-radius:8px;
  background:#fafbfc;
}

.svdl-pages__item{ 
  padding:10px 12px; 
  cursor:pointer; 
  border-bottom:1px solid rgba(14,53,87,.04);
  transition:background .15s ease;
}
.svdl-pages__item:last-child{
  border-bottom:0;
}
.svdl-pages__item:hover{ 
  background:#f0f4f8; 
}
.svdl-pages__item.is-active{ 
  background:linear-gradient(90deg,#e6f7ed,#e8f3f8); 
  font-weight:600;
}

.svdl-pages__url{ 
  font-size:11px; 
  margin-top:4px;
  opacity:.6;
}

.svdl-pages__controls{ 
  display:flex; 
  align-items:center; 
  gap:8px;
  flex-wrap:wrap;
  justify-content:center;
  margin-top:8px;
}

.svdl-pages__debug{ 
  padding:8px 10px; 
  background:rgba(14,53,87,.03); 
  border-radius:6px; 
  margin-top:6px;
  font-size:12px;
  line-height:1.5;
}

.svdl-pages__loader{ 
  display:inline-block; 
  width:16px; 
  height:16px; 
  border-radius:50%; 
  border:2px solid rgba(14,53,87,.12); 
  border-top-color:#0E3557; 
  animation:svdlSpin .8s linear infinite;
  vertical-align:middle;
}
@keyframes svdlSpin{ 
  from{transform:rotate(0deg)} 
  to{transform:rotate(360deg)} 
}

/* ==========================================
   RESPONSIVE MOBILE
   ========================================== */

@media(max-width:768px){
  .svdl-dash__card{
    padding:14px;
  }
  
  .svdl-dash__header{
    flex-direction:column;
    align-items:stretch;
  }
  
  .svdl-dash__header-right{
    width:100%;
    justify-content:flex-start;
  }
  
  .svdl-dash__pie{
    width:90px;
    height:90px;
  }
  
  .svdl-dash__title{
    font-size:16px;
  }
  
  .svdl-dash__legend{
    font-size:13px;
  }
  
  .svdl-btn{
    font-size:12px;
    padding:7px 12px;
  }
  
  .svdl-dash__table{
    font-size:12px;
  }
  
  .svdl-dash__table th,
  .svdl-dash__table td{
    padding:8px 6px;
  }
}
