/*
 * Habillage de la billetterie Event Tickets (correctif P2-10).
 *
 * Le module arrive avec son propre theme : fond blanc, bouton bleu #334AFF, liens
 * bleus soulignes. Sur un site entierement sombre a accents dores, la fenetre de
 * saisie des participants tombait comme un cheveu sur la soupe, juste avant de payer.
 *
 * On reprend les couleurs du site plutot que d'en inventer :
 *   fond    #0d0d0d   les blocs sombres du site
 *   texte   #f2f2f2
 *   accent  #f0a51f   le dore du panier et des liens d'en-tete
 */

:root {
    --bearit-fond: #0d0d0d;
    --bearit-fond-champ: #151719;
    --bearit-texte: #f2f2f2;
    --bearit-texte-doux: #a8a8a8;
    --bearit-accent: #f0a51f;
    --bearit-bordure: rgba(255, 255, 255, .12);
}

/* --- La fenetre elle-meme ------------------------------------------------ */
.tribe-dialog__wrapper,
.tribe-modal__wrapper--ar,
.tribe-common.event-tickets {
    background: var(--bearit-fond) !important;
    color: var(--bearit-texte) !important;
    border: 1px solid var(--bearit-bordure);
    border-radius: 10px;
}

/* Event Tickets pose ses couleurs de texte par classe, avec une specificite elevee :
   une regle large est le seul moyen de toutes les reprendre sans les enumerer une a une.
   Les champs de saisie sont exclus, ils ont leur propre traitement plus bas. */
.tribe-dialog__wrapper,
.tribe-common.event-tickets,
.tribe-common.event-tickets *:not(input):not(textarea):not(select):not(.tribe-common-c-btn),
.tribe-dialog__wrapper *:not(input):not(textarea):not(select):not(.tribe-common-c-btn) {
    color: var(--bearit-texte) !important;
}

/* Les mentions secondaires reculent, elles ne sont pas au meme niveau que le reste. */
.tribe-dialog__wrapper .tribe-tickets__attendee-tickets-footer,
.tribe-common.event-tickets .tribe-tickets__attendee-tickets-footer-details,
.tribe-dialog__wrapper .tribe-tickets__form,
.tribe-common.event-tickets .tribe-tickets__form-field-description,
.tribe-dialog__wrapper .tribe-common-b3 {
    color: var(--bearit-texte-doux) !important;
}

.tribe-dialog__close-button {
    background: transparent !important;
    color: var(--bearit-accent) !important;
}

/* --- Separateurs --------------------------------------------------------- */
.tribe-modal__wrapper--ar .tribe-tickets__attendee-tickets-item,
.tribe-common.event-tickets .tribe-tickets__attendee-tickets-item,
.tribe-modal__wrapper--ar .tribe-tickets__attendee-tickets-header,
.tribe-common.event-tickets .tribe-tickets__attendee-tickets-header,
.tribe-modal__wrapper--ar .tribe-tickets__attendee-tickets-footer,
.tribe-common.event-tickets .tribe-tickets__attendee-tickets-footer,
.tribe-modal__wrapper--ar .tribe-tickets__item,
.tribe-common.event-tickets .tribe-tickets__item {
    border-color: var(--bearit-bordure) !important;
}

/* Ces blocs arrivent en blanc : le formulaire de participant, et les encarts
   d'information qui s'affichent au-dessus. */
.tribe-dialog__wrapper .tribe-tickets__attendee-tickets-item,
.tribe-common.event-tickets .tribe-tickets__attendee-tickets-item,
.tribe-dialog__wrapper .tribe-tickets__form,
.tribe-common.event-tickets .tribe-tickets__form,
.tribe-dialog__wrapper .tribe-tickets__notice,
.tribe-common.event-tickets .tribe-tickets__notice,
.tribe-dialog__wrapper .tribe-tickets__item,
.tribe-common.event-tickets .tribe-tickets__item {
    background: rgba(255, 255, 255, .03) !important;
    border-radius: 8px;
}

/* L'encart d'information garde un liseré doré pour rester reperable. */
.tribe-dialog__wrapper .tribe-tickets__notice,
.tribe-common.event-tickets .tribe-tickets__notice {
    border-left: 3px solid var(--bearit-accent) !important;
}

/* --- Champs de saisie ---------------------------------------------------- */
.tribe-modal__wrapper--ar .tribe-common-form-control-text__input,
.tribe-common.event-tickets .tribe-common-form-control-text__input,
.tribe-modal__wrapper--ar .tribe-tickets__form-field-input,
.tribe-common.event-tickets .tribe-tickets__form-field-input {
    background: var(--bearit-fond-champ) !important;
    color: var(--bearit-texte) !important;
    border: 1px solid var(--bearit-bordure) !important;
    border-radius: 6px;
    /* 44 px : la meme cible tactile que partout ailleurs sur le parcours (P4-14). */
    min-height: 44px;
}

.tribe-modal__wrapper--ar .tribe-common-form-control-text__input:focus,
.tribe-common.event-tickets .tribe-common-form-control-text__input:focus,
.tribe-modal__wrapper--ar .tribe-tickets__form-field-input:focus,
.tribe-common.event-tickets .tribe-tickets__form-field-input:focus {
    border-color: var(--bearit-accent) !important;
    /* Contour visible au clavier : le focus par defaut disparaissait sur fond sombre. */
    outline: 2px solid rgba(240, 165, 31, .35);
    outline-offset: 1px;
}

.tribe-modal__wrapper--ar ::placeholder {
    color: #6b6b6b;
    opacity: 1;
}

/* --- Boutons ------------------------------------------------------------- */
.tribe-modal__wrapper--ar .tribe-common-c-btn,
.tribe-common.event-tickets .tribe-common-c-btn,
.tribe-modal__wrapper--ar .tribe-tickets__attendee-tickets-submit,
.tribe-common.event-tickets .tribe-tickets__attendee-tickets-submit {
    background: var(--bearit-accent) !important;
    color: #111 !important;
    border: none !important;
    border-radius: 6px;
    font-weight: 700;
    min-height: 44px;
    padding: .7rem 1.4rem;
}

.tribe-modal__wrapper--ar .tribe-common-c-btn:hover,
.tribe-common.event-tickets .tribe-common-c-btn:hover,
.tribe-modal__wrapper--ar .tribe-common-c-btn:focus,
.tribe-common.event-tickets .tribe-common-c-btn:focus {
    background: #ffbe45 !important;
}

.tribe-modal__wrapper--ar .tribe-common-c-btn-link,
.tribe-common.event-tickets .tribe-common-c-btn-link {
    background: transparent !important;
    color: var(--bearit-accent) !important;
    text-decoration: underline;
    min-height: 44px;
}

/* --- Quantites ----------------------------------------------------------- */
.tribe-modal__wrapper--ar .tribe-tickets__tickets-item-quantity-number-input,
.tribe-common.event-tickets .tribe-tickets__tickets-item-quantity-number-input {
    background: var(--bearit-fond-champ) !important;
    color: var(--bearit-texte) !important;
    border-color: var(--bearit-bordure) !important;
}

/* --- Au telephone -------------------------------------------------------- */
@media (max-width: 767px) {
    .tribe-dialog__wrapper,
    .tribe-modal__wrapper--ar {
        border-radius: 10px 10px 0 0;
    }

    /* Les deux actions passent l'une sous l'autre : cote a cote, elles etaient
       trop etroites pour etre visees au pouce. */
    .tribe-modal__wrapper--ar .tribe-tickets__attendee-tickets-footer,
.tribe-common.event-tickets .tribe-tickets__attendee-tickets-footer {
        display: flex;
        flex-direction: column-reverse;
        gap: .6rem;
        align-items: stretch;
        text-align: center;
    }

    .tribe-modal__wrapper--ar .tribe-common-c-btn,
.tribe-common.event-tickets .tribe-common-c-btn,
    .tribe-modal__wrapper--ar .tribe-common-c-btn-link,
.tribe-common.event-tickets .tribe-common-c-btn-link {
        width: 100%;
    }
}

/* --- Cohabitation avec la barre d'achat ---------------------------------- */
/* Quand la fenetre est ouverte, le module verrouille le defilement du corps de page.
   On s'en sert pour effacer la barre d'achat, qui sinon recouvre le bas de la fenetre
   et le lien « Enregistrer et voir le panier ». */
body.a11y-dialog__body-locked .bearit-barre-achat {
    display: none !important;
}

/* --- Page plein ecran : le recapitulatif deborde en largeur ---------------- */
/* Le tableau des billets est plus large que l'ecran au telephone : il defile dans
   son propre cadre plutot que de pousser toute la page. */
@media (max-width: 767px) {
    .tribe-common.event-tickets .tribe-tickets__attendee-tickets-header,
    .tribe-common.event-tickets .tribe-tickets__item {
        overflow-x: auto;
    }
}

/* --- Prix et mention des taxes -------------------------------------------- */
/* Le suffixe « (28,74 $ avec taxes) » ajoute par P2-11 depasse la colonne prevue
   pour le prix et se faisait couper. Il passe a la ligne plutot que d'etre tronque. */
.tribe-tickets__tickets-item-extra-price,
.tribe-tickets__tickets-item-extra--price-suffix {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    line-height: 1.35;
}

/* La mention passe sous le prix : cote a cote, elle depassait de 44 px sur les 135
   disponibles et se faisait couper au milieu d'un mot. */
.tribe-tickets__tickets-item-extra-price .woocommerce-price-suffix,
.tribe-tickets__tickets-item-extra-price small {
    display: block;
    font-size: .8em;
    opacity: .75;
}

/* ==========================================================================
   Page d'evenement
   ==========================================================================
   The Events Calendar habille sa vue pour un fond clair : releve du 2026-09-08,
   14 textes sous le seuil de contraste, dont le titre de l'evenement a 1,19 et le
   prix a 1,0 — invisible. Sur la page qui vend les billets.

   Le module expose 110 variables `--tec-color-*` : on les redefinit plutot que de
   lutter contre sa specificite, selecteur par selecteur. C'est ce pour quoi elles
   existent, et cela couvre du meme coup les vues qu'on n'a pas ouvertes ici. */

body.single-tribe_events,
body.post-type-archive-tribe_events,
body.tribe-events-page-template {
    /* Textes. Le !important repond a l'ordre de chargement : la feuille du module
       arrive apres la notre, elle reprendrait sinon ses propres valeurs. */
    --tec-color-text-primary: #f2f2f2 !important;
    --tec-color-text-primary-light: #f2f2f2cc !important;
    --tec-color-text-secondary: #a8a8a8 !important;
    --tec-color-text-event-title: #f2f2f2 !important;
    --tec-color-text-event-title-list: #f2f2f2 !important;
    --tec-color-text-event-date: #f2f2f2 !important;
    --tec-color-text-events-title: #f2f2f2 !important;
    --tec-color-text-events-title-day: #f2f2f2 !important;
    --tec-color-text-secondary-event-date: #a8a8a8 !important;
    --tec-color-text-day-of-week-month: #a8a8a8 !important;
    --tec-color-text-day-of-week-week: #a8a8a8 !important;
    --tec-color-category-text: #f2f2f2 !important;

    /* Fonds : transparent plutot que noir, pour laisser passer celui de la page. */
    --tec-color-background: transparent !important;
    --tec-color-background-events: transparent !important;
    --tec-color-background-secondary: rgba(255, 255, 255, .03) !important;

    /* L'accent du module est un bleu vif : on lui donne le dore du site. */
    --tec-color-accent-primary: #f0a51f !important;
    --tec-color-accent-primary-hover: #ffbe45 !important;
    --tec-color-accent-primary-active: #ffbe45 !important;
    --tec-color-accent-primary-background: rgba(240, 165, 31, .12) !important;
    --tec-color-link-accent: #f0a51f !important;
    --tec-color-link-accent-hover: #ffbe45 !important;
    --tec-color-link-primary: #f2f2f2 !important;

    /* Bordures : les gris clairs disparaissent sur fond noir. */
    --tec-color-border-default: rgba(255, 255, 255, .12) !important;
    --tec-color-border-secondary: rgba(255, 255, 255, .08) !important;
    --tec-color-border-hover: rgba(255, 255, 255, .25) !important;
    --tec-color-border-active: #f0a51f !important;

    /* Vue mois : les numeros de jour passent par leur propre famille de variables,
       que les `--tec-color-text-*` n'atteignent pas. Releve du 2026-09-08 : 22 jours
       a 1,04 de contraste, un calendrier dont aucune date n'etait lisible. */
    --tec-color-day-marker-month: #f2f2f2 !important;
    --tec-color-day-marker-current-month: #f2f2f2 !important;
    --tec-color-day-marker-past-month: #9a9a9a !important;
    --tec-color-day-marker-past-month-hover: #f2f2f2 !important;
    --tec-color-day-marker-past-month-active: #f2f2f2 !important;
    --tec-color-text-secondary-event-date-month: #a8a8a8 !important;
    --tec-color-text-secondary-event-date-month-mobile: #a8a8a8 !important;
    --tec-color-text-events-title-month-multiday: #f2f2f2 !important;
    --tec-color-text-events-title-latest-past: #f2f2f2 !important;
    --tec-color-text-events-title-widget-list: #f2f2f2 !important;

    /* Icones : fleches de navigation, loupe, chevrons. Elles restent bleues ou
       anthracite sinon. */
    --tec-color-icon-primary: #cfcfcf !important;
    --tec-color-icon-active: #f0a51f !important;
    --tec-color-icon-focus: #f0a51f !important;
    --tec-color-event-icon: #f2f2f2 !important;
    --tec-color-event-icon-hover: #f0a51f !important;

    /* Barre de recherche et selecteur de vue : deux panneaux blancs a texte sombre,
       replies au chargement — l'audit ne les voit qu'une fois ouverts. */
    --tec-color-background-events-bar: #1b1d20 !important;
    --tec-color-background-view-selector: #1b1d20 !important;
    --tec-color-background-view-selector-list-item-hover: rgba(255, 255, 255, .08) !important;
    --tec-color-background-messages: rgba(255, 255, 255, .06) !important;
    --tec-color-text-events-bar-input: #f2f2f2 !important;
    --tec-color-text-events-bar-input-placeholder: #a8a8a8 !important;
    --tec-color-text-view-selector-list-item: #f2f2f2 !important;
    --tec-color-text-view-selector-list-item-hover: #f0a51f !important;
    --tec-color-icon-events-bar: #cfcfcf !important;
    --tec-color-icon-events-bar-active: #f0a51f !important;

    /* Barres des evenements sur plusieurs jours : le bleu du module reste visible
       en vue mois et en vue semaine, seul aplat colore d'un site dore. */
    --tec-color-background-primary-multiday: rgba(240, 165, 31, .30) !important;
    --tec-color-background-primary-multiday-hover: rgba(240, 165, 31, .45) !important;
    --tec-color-background-secondary-multiday: rgba(255, 255, 255, .14) !important;
    --tec-color-background-secondary-multiday-hover: rgba(255, 255, 255, .22) !important;
    --tec-color-accent-primary-week-event: rgba(240, 165, 31, .14) !important;
    --tec-color-accent-primary-week-event-hover: rgba(240, 165, 31, .24) !important;
    --tec-color-accent-primary-week-event-featured: rgba(240, 165, 31, .08) !important;
    --tec-color-accent-primary-week-event-featured-hover: rgba(240, 165, 31, .18) !important;
}

/* Le prix porte le regard : il prend l'accent plutot que le blanc. */
body:is(.single-tribe_events, .post-type-archive-tribe_events, .tribe-events-page-template) .tribe-block__event-price__cost {
    color: var(--bearit-accent);
}

/* La carte Google garde ses propres couleurs : c'est une image interactive, pas du
   contenu qu'on repeint. Les variables ci-dessus ne l'atteignent pas, cette regle
   protege le cas ou une feuille du module tenterait de la teinter. */
body:is(.single-tribe_events, .post-type-archive-tribe_events, .tribe-events-page-template) .tribe-events-venue-map,
body:is(.single-tribe_events, .post-type-archive-tribe_events, .tribe-events-page-template) .tribe-events-venue-map * {
    --tec-color-text-primary: initial;
    --tec-color-background: initial;
}

/* Le bloc du lieu se detache du fond, comme celui des billets. */
body:is(.single-tribe_events, .post-type-archive-tribe_events, .tribe-events-page-template) .tribe-events-venue,
body:is(.single-tribe_events, .post-type-archive-tribe_events, .tribe-events-page-template) .tribe-block__venue {
    background: rgba(255, 255, 255, .03);
    border-radius: 8px;
}

/* Cible tactile du bouton d'abonnement au calendrier. */
body:is(.single-tribe_events, .post-type-archive-tribe_events, .tribe-events-page-template) .tribe-events-c-subscribe-dropdown__button {
    min-height: 44px;
}

/* Deux elements que les variables du module n'atteignent pas.
   Le nom du lieu est un h3 sans classe, il herite d'une couleur du theme.
   Le libelle du bouton d'abonnement est un enfant qui garde le bleu du module. */
body:is(.single-tribe_events, .post-type-archive-tribe_events, .tribe-events-page-template) .tribe-block__venue__name h3,
body:is(.single-tribe_events, .post-type-archive-tribe_events, .tribe-events-page-template) .tribe-block__venue__name {
    color: var(--bearit-texte) !important;
}

body:is(.single-tribe_events, .post-type-archive-tribe_events, .tribe-events-page-template) .tribe-events-c-subscribe-dropdown__button-text,
body:is(.single-tribe_events, .post-type-archive-tribe_events, .tribe-events-page-template) .tribe-events-c-subscribe-dropdown__button-text * {
    color: var(--bearit-accent) !important;
}

/* Ses deux icones gardaient aussi le bleu, en aplat et en liseré de 1 px. Le calendrier
   est un aplat suivi d'une fleche en trait, le chevron un aplat. */
body:is(.single-tribe_events, .post-type-archive-tribe_events, .tribe-events-page-template) :is(.tribe-events-c-subscribe-dropdown__export-icon, .tribe-events-c-subscribe-dropdown__button-icon) path {
    fill: var(--bearit-accent) !important;
    stroke: var(--bearit-accent) !important;
}

body:is(.single-tribe_events, .post-type-archive-tribe_events, .tribe-events-page-template) .tribe-events-c-subscribe-dropdown__export-icon path:last-child {
    fill: none !important;
}

/* Le menu deroule n'avait pas de fond : ses liens se lisaient par-dessus le bloc des billets. */
body:is(.single-tribe_events, .post-type-archive-tribe_events, .tribe-events-page-template) .tribe-events-c-subscribe-dropdown__list {
    background: var(--bearit-fond-champ) !important;
}

/* Au survol et au focus, le module passe le fond en orange : le contenu y disparaissait.
   Menu ouvert, il le laisse transparent ; le fond est pose ici pour les trois etats. */
body:is(.single-tribe_events, .post-type-archive-tribe_events, .tribe-events-page-template) .tribe-events-c-subscribe-dropdown__button:is(:hover, :focus-within, .tribe-events-c-subscribe-dropdown__button--active, :has([aria-expanded="true"])) {
    background: var(--bearit-accent) !important;
}

body:is(.single-tribe_events, .post-type-archive-tribe_events, .tribe-events-page-template) .tribe-events-c-subscribe-dropdown__button:is(:hover, :focus-within, .tribe-events-c-subscribe-dropdown__button--active, :has([aria-expanded="true"])) :is(.tribe-events-c-subscribe-dropdown__button-text, .tribe-events-c-subscribe-dropdown__button-text *) {
    color: var(--bearit-fond) !important;
}

body:is(.single-tribe_events, .post-type-archive-tribe_events, .tribe-events-page-template) .tribe-events-c-subscribe-dropdown__button:is(:hover, :focus-within, .tribe-events-c-subscribe-dropdown__button--active, :has([aria-expanded="true"])) svg path {
    fill: var(--bearit-fond) !important;
    stroke: var(--bearit-fond) !important;
}

body:is(.single-tribe_events, .post-type-archive-tribe_events, .tribe-events-page-template) .tribe-events-c-subscribe-dropdown__button:is(:hover, :focus-within, .tribe-events-c-subscribe-dropdown__button--active, :has([aria-expanded="true"])) .tribe-events-c-subscribe-dropdown__export-icon path:last-child {
    fill: none !important;
}

/* Navigation entre evenements : le module pose un fond gris #666 herite d'un theme
   clair. Sur le fond sombre, la boite se voit plus que son libelle (2,41 de contraste). */
body:is(.single-tribe_events, .post-type-archive-tribe_events, .tribe-events-page-template) .tribe-events-sub-nav a {
    display: inline-flex !important;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    padding: 0 18px !important;
    background: var(--bearit-fond-champ) !important;
    border: 1px solid var(--bearit-bordure);
    border-radius: 10px;
    color: var(--bearit-texte) !important;
    font-family: "Poppins", sans-serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: .04em;
    text-decoration: none !important;
    transition: border-color .15s, color .15s;
}

body:is(.single-tribe_events, .post-type-archive-tribe_events, .tribe-events-page-template) .tribe-events-sub-nav a:is(:hover, :focus-visible) {
    border-color: var(--bearit-accent);
    color: var(--bearit-accent) !important;
}

body:is(.single-tribe_events, .post-type-archive-tribe_events, .tribe-events-page-template) .tribe-events-sub-nav a svg {
    color: var(--bearit-accent);
    fill: currentColor;
}

body:is(.single-tribe_events, .post-type-archive-tribe_events, .tribe-events-page-template) .tribe-events-sub-nav {
    margin-top: 24px !important;
}

/* --- Bloc de billets de la fiche ------------------------------------------------
   Deux cadres emboites : l'enveloppe du module sur toute la largeur, et le formulaire
   de 580 px colle a son bord gauche. Un seul cadre reste, celui du formulaire. */
body.single-tribe_events .tribe-common.event-tickets.tribe-tickets__tickets-wrapper {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0;
}

body.single-tribe_events .tribe-tickets__tickets-wrapper .tribe-tickets__tickets-form {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box;
    margin: 24px 0 !important;
    padding: 28px !important;
    background: var(--bearit-fond-champ) !important;
    border: 1px solid var(--bearit-bordure) !important;
    border-radius: 14px !important;
}

body.single-tribe_events .tribe-tickets__tickets-form > h2 {
    font-family: "Poppins", sans-serif !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    margin: 0 0 8px !important;
}

/* La fenetre des participants partage les regles des billets qui suivent. */
:is(body.single-tribe_events .tribe-tickets__tickets-form, .tribe-modal__wrapper--ar) .tribe-tickets__tickets-item {
    grid-template-columns: minmax(0, 1fr) auto auto !important;
    column-gap: 24px !important;
    align-items: center !important;
    padding: 18px 0 !important;
    border-color: var(--bearit-bordure) !important;
}

:is(body.single-tribe_events .tribe-tickets__tickets-form, .tribe-modal__wrapper--ar) .tribe-tickets__tickets-item > * {
    grid-row: 1 !important;
    width: auto !important;
    margin: 0 !important;
}

/* Le module place ces elements en colonnes 2 a 5 et laisse la premiere vide. */
:is(body.single-tribe_events .tribe-tickets__tickets-form, .tribe-modal__wrapper--ar) .tribe-tickets__tickets-item-content-title-container {
    grid-column: 1 !important;
}

:is(body.single-tribe_events .tribe-tickets__tickets-form, .tribe-modal__wrapper--ar) .tribe-tickets__tickets-item-extra {
    grid-column: 2 !important;
}

:is(body.single-tribe_events .tribe-tickets__tickets-form, .tribe-modal__wrapper--ar) .tribe-tickets__tickets-item-quantity {
    grid-column: 3 !important;
}

:is(body.single-tribe_events .tribe-tickets__tickets-form, .tribe-modal__wrapper--ar) .tribe-tickets__tickets-item-total-wrap {
    grid-column: 4 !important;
}

:is(body.single-tribe_events .tribe-tickets__tickets-form, .tribe-modal__wrapper--ar) .tribe-tickets__tickets-item-content-title {
    font-family: "Poppins", sans-serif !important;
    font-size: 16px !important;
    font-weight: 700 !important;
}

:is(body.single-tribe_events .tribe-tickets__tickets-form, .tribe-modal__wrapper--ar) .tribe-tickets__tickets-item-extra {
    padding: 0 !important;
    text-align: right;
}

:is(body.single-tribe_events .tribe-tickets__tickets-form, .tribe-modal__wrapper--ar) .tribe-tickets__tickets-item-extra-price {
    font-family: "Mulish", sans-serif !important;
    font-size: 16px !important;
    font-weight: 700;
}

body.single-tribe_events .tribe-tickets__tickets-form .tribe-tickets__tickets-item-quantity {
    display: flex !important;
    align-items: center;
    gap: 8px;
}

body.single-tribe_events .tribe-tickets__tickets-form :is(.tribe-tickets__tickets-item-quantity-remove, .tribe-tickets__tickets-item-quantity-add) {
    width: 40px !important;
    height: 40px !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: 0 !important;
    border: 1px solid var(--bearit-bordure) !important;
    border-radius: 10px !important;
    background: transparent !important;
    color: var(--bearit-texte) !important;
    font-size: 20px !important;
    line-height: 1 !important;
}

body.single-tribe_events .tribe-tickets__tickets-form :is(.tribe-tickets__tickets-item-quantity-remove, .tribe-tickets__tickets-item-quantity-add):is(:hover, :focus-visible) {
    border-color: var(--bearit-accent) !important;
    color: var(--bearit-accent) !important;
}

body.single-tribe_events .tribe-tickets__tickets-form .tribe-tickets__tickets-item-quantity-number-input {
    width: 52px !important;
    height: 40px !important;
    border-radius: 10px !important;
    text-align: center;
    font-family: "Mulish", sans-serif !important;
    font-size: 16px !important;
}

body.single-tribe_events .tribe-tickets__tickets-form .tribe-tickets__tickets-footer {
    padding-top: 20px !important;
    border-color: var(--bearit-bordure) !important;
}

:is(body.single-tribe_events .tribe-tickets__tickets-form, .tribe-modal__wrapper--ar) .tribe-tickets__tickets-footer :is(.tribe-tickets__tickets-footer-quantity, .tribe-tickets__tickets-footer-total) {
    font-family: "Mulish", sans-serif !important;
    font-size: 15px !important;
}

body.single-tribe_events .tribe-tickets__tickets-form .tribe-tickets__tickets-buy {
    height: 48px !important;
    padding: 0 26px !important;
    border-radius: 10px !important;
    font-family: "Poppins", sans-serif !important;
    font-size: 15px !important;
    font-weight: 700 !important;
}

/* --- Fenetre des participants -----------------------------------------------------
   Sur un ecran large, elle s'etirait sur 2 048 px : nom du billet a gauche, prix au
   milieu, total a l'extreme droite, libelles a cote de champs de 1 860 px. */
.tribe-modal__wrapper--ar {
    max-width: 860px !important;
    width: calc(100% - 32px) !important;
    height: auto !important;
    max-height: calc(100vh - 64px);
    overflow-y: auto;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 40px 40px 36px !important;
    border: 1px solid var(--bi-filet) !important;
    border-radius: 16px !important;
}

.tribe-modal__wrapper--ar :is(.tribe-common-h1, .tribe-common-h2, .tribe-common-h3, .tribe-common-h4, .tribe-common-h5, .tribe-common-h6, .tribe-common-h7, .tribe-common-b1, .tribe-common-b2, .tribe-common-b3, .tribe-common-c-btn, .tribe-common-c-btn-link) {
    font-family: "Mulish", sans-serif !important;
}

.tribe-modal__wrapper--ar :is(.tribe-dialog__title, .tribe-tickets__attendee-tickets-container > h3, .tribe-tickets__attendee-tickets-item-title) {
    font-family: "Poppins", sans-serif !important;
    font-weight: 700 !important;
}

.tribe-modal__wrapper--ar .tribe-dialog__title {
    font-size: 20px !important;
    margin: 0 56px 28px 0 !important;
    padding: 0 !important;
}

/* L'icone du module, une image de fond, s'affichait dedoublee : une croix en texte la remplace. */
/* Le selecteur porte les deux classes du bouton : celui du module pose l'image avec une
   specificite plus haute. Le repere est le conteneur du titre. */
.tribe-modal__wrapper--ar button.tribe-dialog__close-button.tribe-modal__close-button {
    position: absolute !important;
    top: -10px !important;
    right: 0 !important;
    background-image: none !important;
    width: 40px !important;
    height: 40px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 0 !important;
    background: none !important;
    border: 1px solid var(--bearit-bordure) !important;
    border-radius: 10px !important;
    color: var(--bearit-texte) !important;
    cursor: pointer;
}

.tribe-modal__wrapper--ar .tribe-dialog__close-button::before {
    content: "\00d7";
    font-size: 26px;
    line-height: 1;
}

.tribe-modal__wrapper--ar .tribe-dialog__close-button::after {
    content: none !important;
}

.tribe-modal__wrapper--ar .tribe-dialog__close-button:is(:hover, :focus-visible) {
    border-color: var(--bearit-accent) !important;
    color: var(--bearit-accent) !important;
}

/* La fenetre donne le focus a ce bouton a l'ouverture : contour garde pour le clavier seul. */
.tribe-modal__wrapper--ar .tribe-dialog__close-button:focus:not(:focus-visible) {
    outline: none !important;
}

.tribe-modal__wrapper--ar form.tribe-tickets__form.tribe-tickets__form {
    background: transparent !important;
    border: 0 !important;
    padding: 0 !important;
}

.tribe-modal__wrapper--ar .tribe-modal__cart {
    padding: 6px 24px 20px !important;
    background: var(--bearit-fond-champ) !important;
    border: 1px solid var(--bearit-bordure) !important;
    border-radius: 12px !important;
}

.tribe-modal__wrapper--ar .tribe-tickets__tickets-item {
    grid-template-columns: minmax(0, 1fr) auto auto auto !important;
    padding: 16px 0 !important;
    border-top: 0 !important;
}

.tribe-modal__wrapper--ar .tribe-tickets__tickets-footer {
    padding-top: 16px !important;
}

.tribe-modal__wrapper--ar .tribe-tickets__attendee-tickets {
    margin-top: 32px !important;
}

.tribe-modal__wrapper--ar .tribe-tickets__attendee-tickets-container > h3 {
    font-size: 16px !important;
    margin: 0 0 14px !important;
}

.tribe-modal__wrapper--ar .tribe-tickets__attendee-tickets-item.tribe-tickets__attendee-tickets-item {
    padding: 24px !important;
    border: 1px solid var(--bearit-bordure) !important;
    border-radius: 12px !important;
}

.tribe-modal__wrapper--ar .tribe-tickets__form-field {
    display: block !important;
    margin: 0 0 20px !important;
}

.tribe-modal__wrapper--ar .tribe-tickets__form-field:last-child {
    margin-bottom: 0 !important;
}

.tribe-modal__wrapper--ar .tribe-tickets__form-field-label {
    display: block !important;
    width: auto !important;
    margin: 0 0 6px !important;
    font-size: var(--bi-secondaire) !important;
    font-weight: 600 !important;
}

.tribe-modal__wrapper--ar .tribe-tickets__form-field-input-wrapper,
.tribe-modal__wrapper--ar .tribe-tickets__form-field-input {
    width: 100% !important;
}

.tribe-modal__wrapper--ar .tribe-tickets__form-field-input {
    height: 48px !important;
    padding: 0 14px !important;
    border-radius: 10px !important;
    font-size: 15px !important;
}

.tribe-modal__wrapper--ar .tribe-tickets__iac-email-disclaimer {
    padding: 20px 0 24px !important;
    font-size: var(--bi-secondaire) !important;
}

.tribe-modal__wrapper--ar .tribe-tickets__attendee-tickets-footer {
    display: flex !important;
    justify-content: flex-end;
    align-items: center;
    gap: 16px;
    padding-top: 0 !important;
    border-top: 0 !important;
}

.tribe-modal__wrapper--ar .tribe-tickets__attendee-tickets-submit {
    height: 48px !important;
    padding: 0 24px !important;
    border-radius: 10px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
}

@media (max-width: 767px) {
    .tribe-modal__wrapper--ar {
        width: 100% !important;
        max-height: none;
        padding: 28px 20px !important;
        border-radius: 16px 16px 0 0 !important;
    }

    body.single-tribe_events .tribe-tickets__tickets-wrapper .tribe-tickets__tickets-form {
        padding: 20px 16px !important;
    }

    :is(body.single-tribe_events .tribe-tickets__tickets-form, .tribe-modal__wrapper--ar) .tribe-tickets__tickets-item {
        grid-template-columns: minmax(0, 1fr) auto !important;
        row-gap: 12px !important;
    }

    :is(body.single-tribe_events .tribe-tickets__tickets-form, .tribe-modal__wrapper--ar) .tribe-tickets__tickets-item-content-title-container {
        grid-column: 1 / -1 !important;
    }

    :is(body.single-tribe_events .tribe-tickets__tickets-form, .tribe-modal__wrapper--ar) .tribe-tickets__tickets-item > :not(.tribe-tickets__tickets-item-content-title-container) {
        grid-row: 2 !important;
    }

    :is(body.single-tribe_events .tribe-tickets__tickets-form, .tribe-modal__wrapper--ar) .tribe-tickets__tickets-item-extra {
        grid-column: 1 !important;
    }

    :is(body.single-tribe_events .tribe-tickets__tickets-form, .tribe-modal__wrapper--ar) :is(.tribe-tickets__tickets-item-quantity, .tribe-tickets__tickets-item-total-wrap) {
        grid-column: 2 !important;
    }

    .tribe-modal__wrapper--ar .tribe-tickets__tickets-item-total-wrap {
        display: none !important;
    }

    :is(body.single-tribe_events .tribe-tickets__tickets-form, .tribe-modal__wrapper--ar) .tribe-tickets__tickets-item-extra {
        text-align: left;
    }

    .tribe-modal__wrapper--ar .tribe-tickets__attendee-tickets-footer {
        flex-direction: column-reverse;
        align-items: stretch;
    }
}

/* ==========================================================================
   Boutique et fiche produit

   Meme cause que pour le calendrier : les reglages de couleur sont poses dans les
   widgets Elementor et dans WooCommerce, calibres sur un fond clair. Le !important
   repond a la specificite des selecteurs generes par Elementor
   (`.elementor-1314 .elementor-element-2d4e45bd ... a.button`), qu'aucune regle
   raisonnable ne bat autrement. */

/* Deux widgets de produits cohabitent sur la boutique et sur la fiche. Celui de
   l'archive pose un bouton sombre a liseret dore, lisible ; celui des blocs de
   produits pose un fond ambre en gardant le libelle blanc, soit 1,60 de contraste
   sur le mot qui declenche l'achat. On ne corrige que le second : viser les deux
   rendait le premier illisible a son tour. */
.woocommerce .elementor-widget-woocommerce-products ul.products li.product a.button {
    color: #111 !important;
}

/* La pastille de promotion est rose vif sur dore, deux tons voisins et satures. */
.woocommerce ul.products li.product span.onsale,
.woocommerce span.onsale {
    color: #111 !important;
    background: var(--bearit-accent) !important;
}

/* Categories du produit et onglets d'information : un dore assombri a #9d6a13,
   sous le seuil sur le fond de la fiche. */
.woocommerce .product_meta a,
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
    color: var(--bearit-accent) !important;
}

/* Printful pose la couleur en style en ligne sur son lien de guide des tailles :
   seul !important en vient a bout. */
.single_variation_wrap a[onclick*="Size_Guide"] {
    color: var(--bearit-accent) !important;
}

/* ==========================================================================
   Panier et paiement

   Releve du 2026-09-08 a 414 px : la carte du panier est blanche, la couleur de
   texte heritee est blanche. Le nom du premier article — un billet, qui n'est pas
   un lien — s'affichait blanc sur blanc : l'acheteur ne voyait pas ce qu'il achetait.
   Les liens, eux, gardaient le dore du site, a 2,08 sur blanc. */

.woocommerce-cart .woocommerce-cart-form,
.woocommerce-cart .e-shop-table,
.woocommerce-cart .cart_totals,
.woocommerce-cart .woocommerce-shipping-totals,
.woocommerce-checkout .woocommerce-checkout-review-order,
.woocommerce-cart .woocommerce-form-coupon,
.woocommerce-cart .bearit-cadeau {
    color: #151719;
}

.woocommerce-cart .woocommerce-cart-form a,
.woocommerce-cart .e-shop-table a,
.woocommerce-cart .cart_totals a,
.woocommerce-checkout .woocommerce-checkout-review-order a {
    color: #7a5200 !important;
}

/* Le mode de livraison et « Modifier l'adresse » gardent le dore du site sur la carte
   blanche, a 2,08. Ce sont les deux seules commandes de la ligne de livraison. */
.woocommerce-cart .woocommerce-shipping-totals a,
.woocommerce-cart .woocommerce-shipping-totals label,
.woocommerce-cart .woocommerce-shipping-methods label {
    color: #7a5200 !important;
}

/* La croix de suppression est blanche sur la carte blanche : le seul moyen de retirer
   un article du panier etait invisible. Un seul caractere, que les relevés de contraste
   ecartent d'ordinaire comme une icone. */
.woocommerce-cart .e-shop-table a.remove,
.woocommerce-cart .woocommerce-cart-form a.remove {
    color: #5f5f5f !important;
}

.woocommerce-cart .e-shop-table a.remove:hover,
.woocommerce-cart .woocommerce-cart-form a.remove:hover {
    color: #151719 !important;
}

/* Le prix decide de l'achat : #878787 sur blanc n'est qu'a 3,59. Le selecteur reste
   dans les colonnes du panier : viser `.woocommerce-cart .woocommerce-Price-amount`
   atteignait aussi le total du panier dans l'en-tete, sur fond noir, et le faisait
   tomber a 1,99. */
.woocommerce-cart .woocommerce-cart-form .woocommerce-Price-amount,
.woocommerce-cart .cart_totals .woocommerce-Price-amount,
.woocommerce-checkout .woocommerce-checkout-review-order .woocommerce-Price-amount {
    color: #3f3f3f !important;
}

/* « Passer la commande » : blanc sur le dore, 2,08 pour le bouton qui fait avancer la
   commande. Le bouton promo, en contour, garde l'orange (interface.css). Le !important repond aux regles du
   widget panier d'Elementor, qui posent la couleur par variable a une specificite
   qu'aucun selecteur raisonnable ne bat. */
.woocommerce-cart a.checkout-button,
.woocommerce-cart .woocommerce-cart-form button.button:not(.e-apply-coupon),
.woocommerce-cart .woocommerce-form-coupon button.button {
    color: #111 !important;
}

/* --- Page de saisie : un titre en double, et en anglais --------------------- */
/* La page porte deux titres : celui de la page WordPress, reste « Attendee
   Registration », et celui du module juste en dessous, traduit. Le premier etait
   en #151719 sur noir — invisible, ce qui explique que personne ne l'ait releve.
   On retire le doublon plutot que de l'eclaircir : sinon on rendrait visible de
   l'anglais au dernier ecran avant le paiement. Le correctif durable est de
   renommer la page en base ; il est note au plan. */
body.page .tribe-tickets__registration-page ~ * .entry-title,
.tribe-tickets__registration h1.entry-title,
body:has(.tribe-tickets__registration-content) > * h1.entry-title {
    display: none;
}

/* --- Commande recue et suivi de commande ---------------------------------- */
/* La page de confirmation est sur fond blanc : son bloc d'adresse y etait en #69727d,
   juste au-dessus du seuil. On le fonce franchement, c'est la ligne que l'acheteur
   relit pour verifier ou son billet sera envoye.
   Le meme bloc sur la page de suivi de commande releve du theme « Mon compte » :
   il est traite dans `composants/style-mon-compte-bear-it/account.css`. */
.woocommerce-order-received .woocommerce-customer-details address,
.woocommerce-order-received .woocommerce-customer-details--phone,
.woocommerce-order-received .woocommerce-customer-details--email {
    color: #151719 !important;
}

/* Le nom du produit reste dore sur le tableau blanc de la confirmation. */
.woocommerce-order-received .woocommerce-table--order-details a,
.woocommerce-order-received .woocommerce-order-details a {
    color: #7a5200 !important;
}

/* Vue mois au telephone : la journee selectionnee prend l'accent dore en aplat.
   Le numero suit `--tec-color-day-marker-month`, passe au clair pour les autres
   cases : il devenait blanc sur dore, a 1,86. Cet etat n'existe qu'en dessous de
   768 px, ou le calendrier met en avant le jour choisi. */
.tribe-events-calendar-month__day-cell--selected .tribe-events-calendar-month__day-date-daynum {
    color: #111 !important;
}

/* Pagination de la boutique : la page courante est un pave dore a libelle blanc,
   2,08 — le seul chiffre qui dit ou l'on se trouve dans le catalogue. */
.woocommerce .woocommerce-pagination span.page-numbers.current,
.woocommerce nav.woocommerce-pagination span.page-numbers.current,
.woocommerce ul.page-numbers li span.page-numbers.current {
    color: #111 !important;
}

/* ==========================================================================
   Paiement

   Contrairement au reste du site, le tunnel de paiement est pose sur une carte
   claire (#f5f5f5). Les liens et les titres y ont garde le dore du site : releve du
   2026-09-08, 18 textes sous le seuil, dont **« termes et conditions » et
   « politique de confidentialite » a 1,91** — les deux liens que P1-03 a mis en
   place pour la conformite, et qu'on lisait a peine.

   Les selecteurs restent dans les blocs du formulaire : viser `.woocommerce-checkout`
   atteindrait l'en-tete et le pied de page, qui sont sombres. */

.woocommerce-checkout form.checkout a,
.woocommerce-checkout form.checkout h3,
.woocommerce-checkout .e-checkout__order_review a,
.woocommerce-checkout .e-checkout__order_review h3,
.woocommerce-checkout .woocommerce-checkout-review-order a,
.woocommerce-checkout .woocommerce-checkout-payment a,
.woocommerce-checkout .woocommerce-form-login-toggle a,
.woocommerce-checkout .woocommerce-form-coupon-toggle a,
.woocommerce-checkout .woocommerce-privacy-policy-text a,
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper a {
    color: #7a5200 !important;
}

/* Nom de l'article et quantite dans le recapitulatif : meme dore sur la meme carte. */
.woocommerce-checkout .woocommerce-checkout-review-order td.product-name,
.woocommerce-checkout .woocommerce-checkout-review-order .product-quantity {
    color: #151719 !important;
}

/* En-tetes et libelles du recapitulatif : #878787 sur clair, 3,30. */
.woocommerce-checkout .woocommerce-checkout-review-order th,
.woocommerce-checkout .e-checkout__order_review th,
.woocommerce-checkout .woocommerce-checkout-review-order .woocommerce-Price-currencySymbol,
.woocommerce-checkout .woocommerce-checkout-review-order small,
.woocommerce-checkout .woocommerce-checkout-review-order strong,
.woocommerce-checkout .woocommerce-privacy-policy-text,
.woocommerce-checkout .woocommerce-privacy-policy-text p {
    color: #5f5f5f !important;
}

/* Les lignes de la vue liste sont des `tribe-common-g-row` a gouttieres negatives
   (`margin: 0 -21px`) que le conteneur ne compense pas exactement : elles depassent
   d'un peu plus d'un pixel, et la page se laisse tirer d'autant au doigt.
   `overflow-x: clip` plutot que `hidden` : `hidden` sur un axe force le second a
   defiler, ce qui rognerait le menu « Exporter le calendrier » quand il s'ouvre. */
body:is(.post-type-archive-tribe_events, .tribe-events-page-template) .tribe-events-view {
    overflow-x: clip;
    overflow-y: visible;
}