/* Modernisation légère — conserve le contenu (images, liens, cartouches, textes) */
/* Objectif : meilleure lisibilité, responsive, confiance, sans casser le design existant. */

:root{
  --vc-maxw: 1120px;
  --vc-radius: 14px;
  --vc-shadow: 0 10px 30px rgba(0,0,0,.10);
  --vc-text: #1b1b1b;
  --vc-muted: rgba(0,0,0,.65);
  --vc-link: #3b2a77;
  --vc-link-hover: #1f0f4d;
}

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body{
  color: var(--vc-text);
  line-height: 1.6;
  /* garde l'ambiance "voyance" (serif) mais plus propre */
  font-family: Georgia, "Times New Roman", Times, serif;
}

/* Améliore l'affichage sur mobile */
img, video { max-width: 100%; height: auto; }

/* Centralise les grosses mises en page si elles utilisent un wrapper/table */
.main, .container, #container, #main, .wrapper { max-width: var(--vc-maxw); margin: 0 auto; }

/* Liens plus “confiance” */
a{ color: var(--vc-link); text-underline-offset: 2px; }
a:hover{ color: var(--vc-link-hover); }

/* Cartouches/encarts : arrondis + ombre douce si déjà présents */
.cartouche, .card, .encart, .box, .bloc, .panel, .cadre{
  border-radius: var(--vc-radius);
}

/* Tables anciennes : éviter le débordement sur mobile */
table{ max-width: 100%; }
@media (max-width: 768px){
  body{ font-size: 16px; }
  table{ display:block; overflow-x:auto; -webkit-overflow-scrolling: touch; }
}

/* Respecte le mouvement réduit */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior: auto; }
}

/* Accessibilité : lien d'évitement */
.vc-skip-link{position:absolute;left:-999px;top:10px;background:#fff;color:#000;padding:10px 12px;border-radius:10px;box-shadow:var(--vc-shadow);z-index:9999}
.vc-skip-link:focus{left:10px}
/* === Patch horoscope mobile+desktop (24/12/2025) === */
#horoscope_quotidien .vc-sign-icon{
  width: 22px;
  height: 22px;
  vertical-align: middle;
  margin-right: 6px;
}
#horoscope_quotidien .vc-sign-name{
  vertical-align: middle;
}

/* Desktop: on conserve le système "survol -> bulle" existant (style/style.css) */
#horoscope_quotidien a.vc-tip{
  color: inherit;
  text-decoration: none;
  display: inline-block;
}
#horoscope_quotidien a.vc-tip span{
  /* le style/style.css gère déjà display:none + position absolute au survol */
}

/* Mobile : transforme le tableau en cartes + affiche le texte complet (pas de survol) */
@media (max-width: 768px){
  #horoscope_quotidien thead{ display:none; }
  #horoscope_quotidien,
  #horoscope_quotidien tbody,
  #horoscope_quotidien tr,
  #horoscope_quotidien th,
  #horoscope_quotidien td{
    display:block;
    width:100%;
  }
  #horoscope_quotidien tr{
    margin: 0 0 12px 0;
    border: 1px solid rgba(255,255,255,0.20);
    border-radius: 12px;
    overflow: hidden;
  }
  #horoscope_quotidien th{
    text-align:left;
    padding:10px 12px;
    background: rgba(0,0,0,0.18);
  }
  #horoscope_quotidien td{
    text-align:left;
    padding:8px 12px;
    border-top: 1px solid rgba(255,255,255,0.12);
  }
  #horoscope_quotidien td:before{
    content: attr(data-label) " : ";
    font-weight: bold;
    display:inline;
  }

  /* Affiche le texte complet en mobile (span), et masque l'extrait */
  #horoscope_quotidien a.vc-tip span{
    display:block !important;
    position: static !important;
    width: auto !important;
    background: none !important;
    padding: 4px 0 0 0 !important;
    margin: 0 !important;
  }
  /* L'extrait (texte avant le span) devient inutile en mobile : on le masque visuellement */
  #horoscope_quotidien a.vc-tip{
    display:block;
  }
  #horoscope_quotidien a.vc-tip{
    /* on garde l'extrait mais il reste très court ; on le rend discret */
  }
}