/* ================================================================
   RU Design : règles communes du site (composant 18, 2026-10-16)
   Boutons, onglets qui dépassent, message vide, animations douces.
   Couleurs et espaces : jetons --ru-* (composant 00), jamais en dur.
   ================================================================ */

/* ---- Boutons communs : bleu à texte blanc ; survol blanc, texte bleu, contour noir ---- */
/* Livraison 5 : .ru-bouton (nom de l'admin) vaut .ru-btn à l'avant ; la forme a.ru-btn passe devant le soulignement des liens de WordPress (:root :where(a)). */
.ru-btn,a.ru-btn,.ru-bouton,a.ru-bouton{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:0 16px;border:1px solid transparent;border-radius:9px;font-family:inherit;font-size:14px;font-weight:600;line-height:1.2;text-decoration:none;cursor:pointer;transition:background-color .2s ease,border-color .2s ease,color .2s ease,box-shadow .2s ease}
.ru-btn svg,a.ru-btn svg,.ru-bouton svg,a.ru-bouton svg{width:16px;height:16px;flex:none}
.ru-btn--primaire,a.ru-btn--primaire,.ru-bouton--primaire,a.ru-bouton--primaire,.ru-btn--primaire:visited,a.ru-btn--primaire:visited,.ru-bouton--primaire:visited,a.ru-bouton--primaire:visited{background:var(--ru-accent,#1d5c8f);border-color:var(--ru-accent,#1d5c8f);color:var(--ru-sur-accent,#FFFFFF)}
.ru-btn--primaire:hover,a.ru-btn--primaire:hover,.ru-bouton--primaire:hover,a.ru-bouton--primaire:hover,.ru-btn--primaire:focus-visible,a.ru-btn--primaire:focus-visible,.ru-bouton--primaire:focus-visible,a.ru-bouton--primaire:focus-visible{background:var(--ru-fond,#FFFFFF);border-color:var(--ru-contour-survol,#0A0A0A);color:var(--ru-accent,#1d5c8f)}
.ru-btn--secondaire,a.ru-btn--secondaire,.ru-bouton--secondaire,a.ru-bouton--secondaire,.ru-btn--secondaire:visited,a.ru-btn--secondaire:visited,.ru-bouton--secondaire:visited,a.ru-bouton--secondaire:visited{background:var(--ru-fond,#FFFFFF);border-color:var(--ru-bord-2,rgba(0,0,0,.16));color:var(--ru-texte,#0e2438)}
.ru-btn--secondaire:hover,a.ru-btn--secondaire:hover,.ru-bouton--secondaire:hover,a.ru-bouton--secondaire:hover,.ru-btn--secondaire:focus-visible,a.ru-btn--secondaire:focus-visible,.ru-bouton--secondaire:focus-visible,a.ru-bouton--secondaire:focus-visible{border-color:var(--ru-contour-survol,#0A0A0A);color:var(--ru-accent,#1d5c8f)}
.ru-btn:focus-visible,a.ru-btn:focus-visible,.ru-bouton:focus-visible,a.ru-bouton:focus-visible{outline:2px solid var(--ru-accent-filet,rgba(44,111,181,.45));outline-offset:2px}
@media (max-width:782px){.ru-btn,a.ru-btn,.ru-bouton,a.ru-bouton{min-height:44px}}

/* ---- Onglets qui dépassent : fondu, flèche ronde à droite, flèche à gauche pour revenir ---- */
.ru-onglets-cadre{position:relative;min-width:0}
.ru-onglets-pret{scrollbar-width:none;overflow-x:auto;scroll-behavior:smooth}
.ru-onglets-pret::-webkit-scrollbar{display:none}
.ru-onglets-fleche{position:absolute;top:0;bottom:1px;z-index:2;display:flex;align-items:center;pointer-events:none;opacity:0;visibility:hidden;transition:opacity .2s ease,visibility .2s ease}
.ru-onglets-fleche--suite{right:0;width:80px;justify-content:flex-end;padding-right:8px;background:linear-gradient(90deg,rgba(255,255,255,0),var(--ru-onglets-fond,var(--ru-fond,#FFFFFF)) 55%)}
.ru-onglets-fleche--avant{left:0;width:80px;justify-content:flex-start;padding-left:8px;background:linear-gradient(270deg,rgba(255,255,255,0),var(--ru-onglets-fond,var(--ru-fond,#FFFFFF)) 55%)}
.ru-onglets-cadre.a-suite .ru-onglets-fleche--suite,.ru-onglets-cadre.a-avant .ru-onglets-fleche--avant{opacity:1;visibility:visible}
.ru-onglets-fleche button{pointer-events:auto;position:relative;width:28px;height:28px;min-width:28px;min-height:28px;margin:0;padding:0;line-height:0;border-radius:50%;border:1px solid var(--ru-contour-survol,#0A0A0A);background:var(--ru-fond,#FFFFFF);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.08);transition:background-color .2s ease}
.ru-onglets-fleche button::before{content:"";position:absolute;inset:-7px}
.ru-onglets-fleche button:hover{background:var(--ru-surface-2,#F4F4F5)}
.ru-onglets-fleche button:focus-visible{outline:2px solid var(--ru-accent-filet,rgba(44,111,181,.45));outline-offset:2px}
.ru-onglets-fleche svg{display:block;flex:none;margin:0;width:14px;height:14px;fill:none;stroke:var(--ru-accent,#1d5c8f);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}

/* ---- Message vide : dans son cadre, centré, jamais collé ---- */
.ru-vide{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding:var(--ru-esp-boite,24px);border:1px dashed var(--ru-bord-2,rgba(0,0,0,.16));border-radius:12px;background:var(--ru-surface-2,#F4F4F5);color:var(--ru-discret,#6b7280);font-size:14px;line-height:1.5}
.ru-vide-ic{color:var(--ru-discret-2,#9ca3af);display:inline-flex}
.ru-vide-titre{color:var(--ru-texte,#0e2438);font-size:15px;font-weight:600}
.ru-vide .ru-btn{margin-top:6px}
@media (max-width:640px){.ru-vide{padding:var(--ru-esp-boite-tel,16px)}}

/* ---- Animations douces, coupées si le visiteur demande moins de mouvement ---- */
@media (prefers-reduced-motion:reduce){
	*,*::before,*::after{transition-duration:0s!important;animation-duration:0s!important;animation-iteration-count:1!important;scroll-behavior:auto!important}
}
