/* ==========================================================================
   DissidenceTV — Mode sombre pour le thème VIDOREV
   Fichier de thème enfant. v1.0.2
   --------------------------------------------------------------------------
   PRINCIPE
   Le mode sombre s'active par la classe .dtv-dark sur <html>, posée par
   dissidencetv-dark-mode.js. Le script ajoute aussi la classe .dark-background
   sur <body> : VIDOREV embarque déjà près de 300 règles prévues pour du
   contenu posé sur fond sombre (titres, liens, tableaux, formulaires, boutons,
   blocs sociaux…). On réutilise ce travail au lieu de le refaire, et ce
   fichier ne traite que ce qui reste : les fonds, les quelques surfaces
   blanches en dur, et les widgets tiers.

   SPÉCIFICITÉ
   Les règles de base du thème sont peu spécifiques (`a`, `body`,
   `h1, h2, …`). On les bat avec `html.dtv-dark body …` sans recourir à
   !important, réservé à deux cas : les plugins tiers qui posent des styles
   en ligne (section 8), et la pastille du sélecteur de thème (section 9),
   que VIDOREV habillerait sinon comme n'importe quel <button> du site.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Palette
   -------------------------------------------------------------------------- */
html.dtv-dark {
  --dtv-bg:          #0f1216;  /* fond de page */
  --dtv-surface:     #171b21;  /* cartes, encarts, champs */
  --dtv-surface-2:   #1e232b;  /* survol, en-têtes de tableau */
  --dtv-line:        #272d36;
  --dtv-line-strong: #38404c;
  --dtv-text:        #c9ced7;
  --dtv-text-strong: #f2f4f7;
  --dtv-text-mute:   #8b93a1;
  --dtv-accent:      #cc0000;  /* rouge de la charte, sur fond plein */
  --dtv-accent-lite: #ff4d43;  /* même rouge éclairci, pour du texte */

  color-scheme: dark;          /* barres de défilement et widgets natifs */
  background-color: var(--dtv-bg);
}

/* --------------------------------------------------------------------------
   2. Fonds de page et conteneurs de gabarit
   -------------------------------------------------------------------------- */
html.dtv-dark body,
html.dtv-dark #site-wrap-parent,
html.dtv-dark #site-wrap-children,
html.dtv-dark body.main-layout-boxed #site-wrap-children,
html.dtv-dark #primary-content-wrap,
html.dtv-dark #site-content,
html.dtv-dark #site-footer {
  background-color: var(--dtv-bg);
  color: var(--dtv-text);
}
html.dtv-dark body.main-layout-boxed #site-wrap-children {
  box-shadow: 0 0 24px rgba(0, 0, 0, .6);
}
/* Le menu latéral du gabarit « header-vid-side » est blanc en dur. */
html.dtv-dark body.header-vid-side .side-menu-wrapper,
html.dtv-dark .header-sport .main-nav {
  background-color: var(--dtv-surface);
}

/* --------------------------------------------------------------------------
   3. Typographie
   -------------------------------------------------------------------------- */
html.dtv-dark body,
html.dtv-dark body .body-typography { color: var(--dtv-text); }

html.dtv-dark body h1, html.dtv-dark body h2, html.dtv-dark body h3,
html.dtv-dark body h4, html.dtv-dark body h5, html.dtv-dark body h6,
html.dtv-dark body .h1, html.dtv-dark body .h2, html.dtv-dark body .h3,
html.dtv-dark body .h4, html.dtv-dark body .h5, html.dtv-dark body .h6,
html.dtv-dark body .h7 { color: var(--dtv-text-strong); }

/* Liens. VIDOREV pose `a { color:#000 }` (spécificité 0-0-1) et
   `.dark-background a { color:#FFF }` (0-1-1). Les sélecteurs ci-dessous
   valent 0-1-3 et 0-1-4 : ils l'emportent sans recourir à !important.
   Vérifié : le thème ne contient aucune règle `color !important` sur les
   liens, et aucun `.dark-background a:link` de base. */
html.dtv-dark body a { color: var(--dtv-text-strong); }
html.dtv-dark body a:link,
html.dtv-dark body a:visited { color: var(--dtv-text-strong); }
html.dtv-dark body a:hover,
html.dtv-dark body a:focus,
html.dtv-dark body a:link:hover,
html.dtv-dark body a:visited:hover { color: var(--dtv-accent-lite); }
html.dtv-dark body a.neutral,
html.dtv-dark body a.neutral:link { color: var(--dtv-text-mute); }
html.dtv-dark body a.neutral:hover,
html.dtv-dark body a.neutral:focus { color: var(--dtv-text-strong); }

/* Exceptions, déclarées après et plus spécifiques : les liens qui sont en
   réalité des boutons pleins ou des pastilles gardent leur propre couleur.
   La page « Hébergement Vidéo » n'a besoin de rien : ses règles sont
   préfixées par #hv-page, donc déjà prioritaires sur tout ce fichier. */
html.dtv-dark body a.pmpro_btn,
html.dtv-dark body a.pmpro_btn:link,
html.dtv-dark body a.basic-button-default,
html.dtv-dark body a.wp-block-button__link,
html.dtv-dark body .social-block a,
html.dtv-dark body .social-block a:link { color: #fff; }
html.dtv-dark body .tagcloud a,
html.dtv-dark body .tagcloud a:link { color: var(--dtv-text); }
html.dtv-dark body .tagcloud a:hover { color: #fff; }

/* Le contenu rédactionnel reste plus doux que les titres. */
html.dtv-dark body p,
html.dtv-dark body li,
html.dtv-dark body dd,
html.dtv-dark body figcaption,
html.dtv-dark body blockquote { color: var(--dtv-text); }
html.dtv-dark body strong,
html.dtv-dark body b { color: var(--dtv-text-strong); }

html.dtv-dark body mark { background-color: #4a3b00; color: #ffe58a; }
html.dtv-dark body pre,
html.dtv-dark body code { background-color: var(--dtv-surface-2); color: var(--dtv-text-strong); }
html.dtv-dark body hr { border-color: var(--dtv-line); }

/* --------------------------------------------------------------------------
   4. Cartes de contenu et listings
   Ces blocs sont posés en blanc en dur dans le thème.
   -------------------------------------------------------------------------- */
html.dtv-dark body .grid-special .post-item .post-item-wrap,
html.dtv-dark body .list-blog .post-item .post-item-wrap,
html.dtv-dark body .list-blog .post-item .bloglisting-read-more,
html.dtv-dark body .list-special .blog-pic + .listing-content,
html.dtv-dark body .category-sort .sort-block-list .sort-items,
html.dtv-dark body .amazon-product-link,
html.dtv-dark body .time_lapses,
html.dtv-dark body .sc-video-elm-widget,
html.dtv-dark body .popular-video-footer .popular-video-content:after,
html.dtv-dark body .single-post-video-full-width-wrapper .series-wrapper .series-item:hover {
  background-color: var(--dtv-surface);
  color: var(--dtv-text);
}
html.dtv-dark body .time_lapses .tl-time { background-color: var(--dtv-surface-2); }
html.dtv-dark body .single-post-video-full-width-wrapper .series-wrapper .series-item:hover {
  color: var(--dtv-text-strong);
}

/* Encadrements */
html.dtv-dark body .widget .widget-item-wrap,
html.dtv-dark body.archive.author .author-box,
html.dtv-dark body .cleanlogin-container,
html.dtv-dark body .codedropz-upload-handler,
html.dtv-dark body .user-settings-ads fieldset,
html.dtv-dark body .user-settings-ads fieldset .disable-ads,
html.dtv-dark body #loginform + hr,
html.dtv-dark body #lostpasswordform + hr,
html.dtv-dark body.main-layout-boxed .popular-video-footer {
  border-color: var(--dtv-line);
  background-color: transparent;
}

/* Nuage de mots-clés et calendrier : gris clair en dur */
html.dtv-dark body .widget_tag_cloud .tagcloud a,
html.dtv-dark body .widget_product_tag_cloud .tagcloud a,
html.dtv-dark body .widget_calendar caption,
html.dtv-dark body .widget_calendar a:hover,
html.dtv-dark body .global-single-content .like-dislike-toolbar-footer .ld-t-item-content,
html.dtv-dark body .global-single-content .tags-socialsharing .tag-item {
  background-color: var(--dtv-surface-2);
  color: var(--dtv-text);
  border-color: var(--dtv-line);
}
html.dtv-dark body .widget_tag_cloud .tagcloud a:hover,
html.dtv-dark body .widget_product_tag_cloud .tagcloud a:hover {
  background-color: var(--dtv-accent);
  color: #fff;
}

/* Placeholders d'images en attente de chargement */
html.dtv-dark body .ul-placeholder-bg { background-color: var(--dtv-surface-2) !important; }

/* --------------------------------------------------------------------------
   5. Formulaires
   -------------------------------------------------------------------------- */
html.dtv-dark body input:not([type]),
html.dtv-dark body input[type="text"],
html.dtv-dark body input[type="email"],
html.dtv-dark body input[type="url"],
html.dtv-dark body input[type="password"],
html.dtv-dark body input[type="search"],
html.dtv-dark body input[type="number"],
html.dtv-dark body input[type="tel"],
html.dtv-dark body input[type="date"],
html.dtv-dark body input[type="month"],
html.dtv-dark body input[type="week"],
html.dtv-dark body input[type="time"],
html.dtv-dark body input[type="datetime"],
html.dtv-dark body input[type="datetime-local"],
html.dtv-dark body textarea,
html.dtv-dark body select,
html.dtv-dark body .select2-container--default .select2-selection--single,
html.dtv-dark body .select2-container--default .select2-selection--multiple,
html.dtv-dark body .select2-container--default .select2-dropdown {
  background-color: var(--dtv-surface);
  border-color: var(--dtv-line-strong);
  color: var(--dtv-text-strong);
}
html.dtv-dark body input:focus,
html.dtv-dark body textarea:focus,
html.dtv-dark body select:focus {
  border-color: var(--dtv-accent-lite);
  color: var(--dtv-text-strong);
}
html.dtv-dark body ::placeholder { color: var(--dtv-text-mute); }
/* Le remplissage automatique de Chrome force un fond blanc. */
html.dtv-dark body input:-webkit-autofill,
html.dtv-dark body input:-webkit-autofill:hover,
html.dtv-dark body input:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--dtv-text-strong);
  -webkit-box-shadow: 0 0 0 1000px var(--dtv-surface) inset;
  caret-color: var(--dtv-text-strong);
}

/* --------------------------------------------------------------------------
   6. Tableaux
   -------------------------------------------------------------------------- */
html.dtv-dark body table thead { background-color: var(--dtv-surface-2); }
html.dtv-dark body table tbody > tr:nth-child(even) { background-color: rgba(255, 255, 255, .03); }
html.dtv-dark body table tbody tr > *,
html.dtv-dark body table thead tr > * { border-color: var(--dtv-line); }

/* --------------------------------------------------------------------------
   7. Paid Memberships Pro
   -------------------------------------------------------------------------- */
html.dtv-dark body.pmpro-variation_1 .pmpro .pmpro_form_input,
html.dtv-dark body .pmpro_form_input,
html.dtv-dark body .pmpro_card {
  background-color: var(--dtv-surface);
  border-color: var(--dtv-line-strong);
  color: var(--dtv-text-strong);
}
html.dtv-dark body .pmpro_card_title,
html.dtv-dark body .pmpro_form_label { color: var(--dtv-text-strong); }
html.dtv-dark body .pmpro_message,
html.dtv-dark body .pmpro_content_message {
  background-color: var(--dtv-surface-2);
  border-color: var(--dtv-line);
  color: var(--dtv-text);
}

/* --------------------------------------------------------------------------
   8. Plugins tiers repérés sur le site
   MailPoet, WP Simple Donation et Stripe posent des fonds clairs en dur ;
   certains passent par des styles en ligne, d'où les !important ciblés.
   -------------------------------------------------------------------------- */
html.dtv-dark body .mailpoet_form,
html.dtv-dark body [class*="mailpoet_form_"] {
  background-color: var(--dtv-surface) !important;
  color: var(--dtv-text) !important;
}
html.dtv-dark body .mailpoet_form .mailpoet_text,
html.dtv-dark body .mailpoet_form .mailpoet_textarea,
html.dtv-dark body .mailpoet_form select {
  background-color: var(--dtv-surface-2) !important;
  border-color: var(--dtv-line-strong) !important;
  color: var(--dtv-text-strong) !important;
}
html.dtv-dark body .mailpoet_form .mailpoet-has-font,
html.dtv-dark body .mailpoet_form p,
html.dtv-dark body .mailpoet_form label { color: var(--dtv-text) !important; }

html.dtv-dark body #wpsd-wrap-all,
html.dtv-dark body .wpsd-master-wrapper,
html.dtv-dark body .wpsd_donate_amount_other_li {
  background-color: var(--dtv-surface) !important;
  color: var(--dtv-text) !important;
  border-color: var(--dtv-line) !important;
}
html.dtv-dark body .wpsd-text-field,
html.dtv-dark body .wpsd_donate_other_amount {
  background-color: var(--dtv-surface-2) !important;
  border-color: var(--dtv-line-strong) !important;
  color: var(--dtv-text-strong) !important;
}
html.dtv-dark body .wpsd-form-title,
html.dtv-dark body .wpsd-form-description { color: var(--dtv-text) !important; }

/* Champ carte Stripe : le fond est dans une iframe, on ne peut agir que sur
   le cadre. Le thème de l'iframe se règle côté Stripe (option `appearance`). */
html.dtv-dark body .StripeElement {
  background-color: var(--dtv-surface-2) !important;
  border-color: var(--dtv-line-strong) !important;
}

/* --------------------------------------------------------------------------
   9. Le switch de thème
   Posé directement sur <body>, en position fixe dans le coin supérieur droit.
   Il ne dépend d'aucun conteneur du thème.

   VIDOREV habille TOUS les boutons du site :
     button:not([aria-controls]):not([aria-live]) {
       padding: 12px 20px; color: #FFFFFF; background: linear-gradient(...); }
   Sans protection, le switch hériterait de ce gabarit. Les !important
   ci-dessous sont délibérés et limités à ce seul widget.
   -------------------------------------------------------------------------- */
#dtv-theme-toggle {
  /* Positionnement */
  position: fixed !important;
  top: 12px !important;
  right: 12px !important;
  z-index: 99990 !important;

  /* Géométrie — on neutralise le gabarit « bouton » du thème */
  box-sizing: border-box !important;
  display: block !important;
  width: 62px !important;
  height: 32px !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: none !important;
  background-color: transparent !important;
  box-shadow: none !important;
  color: inherit !important;
  font-size: 0 !important;
  line-height: 0 !important;
  text-transform: none !important;
  cursor: pointer;
  -webkit-appearance: none !important;
  appearance: none !important;
}
/* Quand la barre d'administration de WordPress est présente. */
#dtv-theme-toggle.dtv-under-adminbar { top: 44px !important; }
@media screen and (max-width: 782px) {
  #dtv-theme-toggle.dtv-under-adminbar { top: 58px !important; }
}

/* La glissière */
#dtv-theme-toggle .dtv-switch-track {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 999px;
  background: rgba(18, 20, 24, .82);
  border: 1px solid rgba(255, 255, 255, .18);
  box-shadow: 0 4px 14px rgba(0, 0, 0, .28);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  transition: background-color .25s ease, border-color .25s ease;
}
html.dtv-dark #dtv-theme-toggle .dtv-switch-track {
  background: rgba(240, 242, 245, .16);
  border-color: rgba(255, 255, 255, .3);
}
#dtv-theme-toggle:hover .dtv-switch-track { border-color: rgba(255, 255, 255, .45); }
#dtv-theme-toggle:focus-visible {
  outline: 2px solid #ff4d43 !important;
  outline-offset: 3px !important;
}

/* Les deux icônes, fixes, de part et d'autre */
#dtv-theme-toggle .dtv-switch-ico {
  position: absolute;
  top: 50%;
  width: 16px;
  height: 16px;
  margin-top: -8px;
  line-height: 0;
  transition: opacity .25s ease;
}
#dtv-theme-toggle .dtv-switch-ico--sun  { left: 7px;  opacity: .45; }
#dtv-theme-toggle .dtv-switch-ico--moon { right: 7px; opacity: 1; }
html.dtv-dark #dtv-theme-toggle .dtv-switch-ico--sun  { opacity: 1; }
html.dtv-dark #dtv-theme-toggle .dtv-switch-ico--moon { opacity: .45; }

#dtv-theme-toggle svg {
  display: block !important;
  width: 16px !important;
  height: 16px !important;
  fill: none;
  stroke: #fff;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Le curseur mobile */
#dtv-theme-toggle .dtv-switch-knob {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 2px 6px rgba(0, 0, 0, .35);
  transition: transform .28s cubic-bezier(.22, .61, .36, 1), background-color .25s ease;
}
html.dtv-dark #dtv-theme-toggle .dtv-switch-knob {
  transform: translateX(30px);
  background: #ffd479;
}

/* Sur petits écrans, on rapproche légèrement du bord. */
@media (max-width: 600px) {
  #dtv-theme-toggle { top: 8px !important; right: 8px !important; }
}

@media (prefers-reduced-motion: reduce) {
  #dtv-theme-toggle .dtv-switch-knob,
  #dtv-theme-toggle .dtv-switch-track,
  #dtv-theme-toggle .dtv-switch-ico { transition: none !important; }
}


/* --------------------------------------------------------------------------
   10. Confort de lecture des médias
   On atténue très légèrement les visuels les plus lumineux, sans toucher aux
   vidéos ni aux logos. Retirez ce bloc si vous préférez des images intactes.
   -------------------------------------------------------------------------- */
html.dtv-dark body .post-img img,
html.dtv-dark body .blog-pic img { filter: brightness(.92); }

/* --------------------------------------------------------------------------
   11. Accessibilité
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  #dtv-theme-toggle { transition: none; }
}
html.dtv-dark body ::selection { background: var(--dtv-accent); color: #fff; }
