/* ================================================================
   PRIX ET BOUTONS D'ACHAT EN VENTE NATIVE TUTOR — complément minimal.

   Le dessin de l'ère WooCommerce est rendu par les feuilles de
   PRODUCTION du thème enfant (mu-prices.css, custom-buttons.css,
   mu-cart.css, mu-course-details.css), parce que le balisage natif
   reproduit désormais celui de WooCommerce :
     - prix : mu-plugins/mu-native-shop/prix.php (bloc <div class="price">
       del / ins / .woocommerce-Price-amount / .mu-price-badge) ;
     - boutons : inc/mu-native-cart.php (lien a.add_to_cart_button,
       « Voir le panier » a.mu-open-cart).
   Ce fichier ne contient QUE ce que le balisage ne peut pas porter.
   Inscrit par mu-plugins/mu-native-theme.php (vente native seulement),
   après les feuilles qu'il complète.

   Unités en px (Histudy force html{font-size:10px}).
   ================================================================ */

/* ----------------------------------------------------------------
   1. ENVELOPPE DES BOUTONS D'ACHAT (div.mu-native-atc)
   Le script de Tutor remplace le contenu du PARENT du bouton après un
   ajout : le bouton natif a donc besoin d'une enveloppe, que le lien
   WooCommerce n'avait pas. display:contents la retire de la mise en
   page : le lien redevient un élément flex direct de .rbt-card-bottom
   (pleine largeur, à la ligne sous le prix), exactement comme avant.
   ---------------------------------------------------------------- */
.mu-native-atc {
    display: contents;
}

/* ----------------------------------------------------------------
   2. BARRE DU BAS DES FICHES COURS (.rbt-course-action-bottom)
   À l'ère WooCommerce, cette barre n'affichait que « Acheter
   maintenant » (46 px, barre de 66 px rangée sous l'écran à
   bottom:-75px). En vente native, elle porte le bouton d'achat de la
   fiche (template-parts/components/tutor/add-to-cart/layout-1.php) :
   même dessin que celui de la carte latérale de l'ère WooCommerce
   (dégradé du thème, texte blanc, icône panier — custom-buttons.css
   .single-courses .add_to_cart_button + mu-course-details.css), à la
   hauteur du bouton de la barre d'avant (46 px) pour que la barre
   garde sa hauteur et disparaisse encore entièrement.
   La barre est HORS de .rbt-course-details-area : le correctif de
   mu-course-details.css (section 2) ne l'atteint pas, et la règle du
   thème « a.tutor-btn…add_to_cart_button.ajax_add_to_cart »
   (0,8,1, background:none / color:heading en !important) laissait un
   simple lien sombre. Sélecteur (0,9,1) : au-dessus de cette règle.
   ---------------------------------------------------------------- */

/* La marge .mt--15 (margin-top:15px!important) sert à la carte
   latérale ; dans la barre il n'y a rien au-dessus du bouton. Même
   correctif que mu-course-details.css pour .buy-now-btn.mt--15. */
.rbt-course-action-bottom .action-btn > .mt--15 {
    margin-top: 0 !important;
}

/* Bouton « Ajouter au panier » (connecté : ajax_add_to_cart ;
   visiteur : tutor-open-login-modal). */
.rbt-course-action-bottom .mu-native-atc > a.tutor-btn.tutor-btn-outline-primary.tutor-btn-md.tutor-btn-block.product_type_simple.add_to_cart_button {
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px;
    width: 100% !important;
    height: 46px !important;
    min-height: 0 !important;
    padding: 0 24px !important;
    border: 0 !important;
    border-radius: 6px !important;
    background-color: transparent !important;
    background-image: linear-gradient(to right, var(--color-primary, #501aa2), var(--color-secondary, #b966e7), var(--color-secondary, #b966e7), var(--color-primary, #501aa2)) !important;
    background-size: 300% 100% !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff;
    font-size: 15px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    white-space: nowrap;
    text-decoration: none !important;
    transition: background-position 0.4s ease-in-out, transform 0.4s ease-in-out, box-shadow 0.4s ease-in-out;
}
.rbt-course-action-bottom .mu-native-atc > a.tutor-btn.tutor-btn-outline-primary.tutor-btn-md.tutor-btn-block.product_type_simple.add_to_cart_button:hover,
.rbt-course-action-bottom .mu-native-atc > a.tutor-btn.tutor-btn-outline-primary.tutor-btn-md.tutor-btn-block.product_type_simple.add_to_cart_button:focus-visible {
    background-position: 102% 0 !important;
    color: #fff !important;
    transform: translate3d(0, -2px, 0);
    box-shadow: 0 10px 20px -8px rgba(0, 0, 0, 0.3) !important;
}
.rbt-course-action-bottom .mu-native-atc > a.add_to_cart_button .cart-text,
.rbt-course-action-bottom .mu-native-atc > a.add_to_cart_button [class*="tutor-icon-"] {
    display: inline-block !important;
    margin: 0 !important;
    color: #fff !important;
    line-height: 1 !important;
}
/* Ajout en cours : la roue de Tutor (::before) REMPLACE l'icône panier,
   comme sur la carte latérale (.tutor-btn.is-loading [class*=tutor-icon-]
   {display:none} de Tutor, que la règle ci-dessus annulait) ; l'écart
   roue / texte est celui du gap (marge de Tutor retirée) : le bouton garde
   sa largeur de colonne (220 px). */
.rbt-course-action-bottom .mu-native-atc > a.add_to_cart_button.is-loading [class*="tutor-icon-"] {
    display: none !important;
}
.rbt-course-action-bottom .mu-native-atc > a.add_to_cart_button.is-loading::before {
    margin-right: 0 !important;
}

/* « Voir le panier » (déjà au panier) : même hauteur dans la barre
   (le bouton du thème .rbt-btn fait 60 px). */
.rbt-course-action-bottom .mu-native-atc > a.rbt-btn,
.rbt-course-action-bottom .mu-native-atc > a.mu-open-cart.mu-open-cart.mu-open-cart.mu-open-cart.mu-open-cart.mu-open-cart.mu-open-cart.mu-open-cart.mu-open-cart.mu-open-cart.mu-open-cart {
    height: 46px !important;
    min-height: 0 !important;
    line-height: 46px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    white-space: nowrap;
}

/* Prix de la barre sur UNE ligne : prix payé, prix barré, badge
   restent côte à côte (le conteneur flex de mu-prices.css autorise le
   retour à la ligne, utile dans les cartes étroites). La barre masque
   déjà son prix sous 576 px (thème). */
.rbt-course-action-bottom .rbt-price .current-price .price {
    flex-wrap: nowrap;
    white-space: nowrap;
}
.rbt-course-action-bottom .course-action-bottom-right > .rbt-price {
    flex: 0 0 auto;
}

/* Tablette portrait (768-991 px) : conteneur de 720 px, colonne de
   droite de 336 px dont 230 pour le bouton (.action-btn : flex 0 0
   220px + marges, thème) — prix et bouton ne tiennent pas côte à côte
   (à l'ère WooCommerce, le prix débordait sur le titre). On reprend la
   disposition du thème sous 768 px : titre au-dessus, prix + bouton
   centrés dessous, et un rangement plus bas pour cette barre plus
   haute (thème : bottom -128px pour sa barre empilée). */
@media only screen and (min-width: 768px) and (max-width: 991.98px) {
    .rbt-course-action-bottom .row > .col-md-6 {
        flex: 0 0 100%;
        max-width: 100%;
    }
    .rbt-course-action-bottom .section-title.text-md-start {
        text-align: center !important;
    }
    .rbt-course-action-bottom .course-action-bottom-right {
        justify-content: center;
        margin-top: 6px;
    }
    .rbt-course-action-bottom {
        bottom: -150px;
    }
}

/* ----------------------------------------------------------------
   3. AJOUT EN COURS (classe is-loading posée par le script de Tutor)
   Équivalent de l'état « loading » de WooCommerce (custom-buttons.css,
   section des cartes) : le lien pâlit et ne réagit plus pendant l'ajout.
   Sélecteur (0,9,1) : au-dessus de la règle du thème
   « .rbt-course-details-area a.tutor-btn…ajax_add_to_cart » (0,8,1,
   opacity:1) qui touche les cartes « Cours connexes » des fiches.
   ---------------------------------------------------------------- */
.mu-native-atc > a.tutor-btn.tutor-btn.tutor-btn.tutor-btn-outline-primary.tutor-btn-md.tutor-btn-block.add_to_cart_button.is-loading {
    opacity: 0.75;
    pointer-events: none;
}

/* ----------------------------------------------------------------
   4. PAGES DE PACK (body.single-course-bundle)
   Gabarit de rainbow-elements (tutor/single-course-bundle.php) : carte
   latérale de Tutor, sans .rbt-course-details-area ni .single-courses.
   Le prix y reprend le balisage de la carte latérale des fiches cours
   (rbt-price-wrapper, mu-plugins/mu-native-theme.php module 10) et
   mu-prices.css le dessine déjà (grand prix dégradé, prix barré, badge).
   Le bouton d'achat reprend celui des fiches cours, mais les règles de
   production qui l'habillent visent .single-courses (custom-buttons.css :
   « .single-courses .add_to_cart_button ») ou .rbt-course-details-area
   (mu-course-details.css section 2, thème) : mêmes valeurs ici (dégradé,
   texte blanc, 60 px, 16 px, icône + texte centrés, écart 8 px). Sans
   elles, il restait un simple lien sombre (règles globales du thème
   a.tutor-btn…ajax_add_to_cart en !important). Sélecteur (0,9,1).
   ---------------------------------------------------------------- */
.single-course-bundle .tutor-sidebar-card .mu-native-atc > a.tutor-btn.tutor-btn-outline-primary.tutor-btn-md.tutor-btn-block.product_type_simple.add_to_cart_button {
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px;
    width: 100% !important;
    height: 60px !important;
    min-height: 54px;
    padding: 0 24px !important;
    border: none !important;
    border-radius: 6px !important;
    background-color: transparent !important;
    background-image: linear-gradient(to right, var(--color-primary, #501aa2), var(--color-secondary, #b966e7), var(--color-secondary, #b966e7), var(--color-primary, #501aa2)) !important;
    background-size: 300% 100% !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff;
    font-size: 16px !important;
    line-height: 60px !important;
    white-space: nowrap;
    text-decoration: none !important;
    transition: all 0.4s ease-in-out !important;
}
.single-course-bundle .tutor-sidebar-card .mu-native-atc > a.tutor-btn.tutor-btn-outline-primary.tutor-btn-md.tutor-btn-block.product_type_simple.add_to_cart_button:hover,
.single-course-bundle .tutor-sidebar-card .mu-native-atc > a.tutor-btn.tutor-btn-outline-primary.tutor-btn-md.tutor-btn-block.product_type_simple.add_to_cart_button:focus-visible {
    background-position: 102% 0 !important;
    color: #fff !important;
    transform: translate3d(0, -2px, 0);
    box-shadow: 0 10px 20px -8px rgba(0, 0, 0, 0.3) !important;
}
.single-course-bundle .tutor-sidebar-card .mu-native-atc > a.add_to_cart_button .cart-text,
.single-course-bundle .tutor-sidebar-card .mu-native-atc > a.add_to_cart_button [class*="tutor-icon-"] {
    margin: 0 !important;
    color: #fff !important;
}
.single-course-bundle .tutor-sidebar-card .mu-native-atc > a.add_to_cart_button [class*="tutor-icon-"] {
    line-height: 1 !important;
}

@media (prefers-reduced-motion: reduce) {
    .rbt-course-action-bottom .mu-native-atc > a.add_to_cart_button,
    .single-course-bundle .tutor-sidebar-card .mu-native-atc > a.add_to_cart_button {
        transition: none !important;
    }
    .rbt-course-action-bottom .mu-native-atc > a.add_to_cart_button:hover,
    .single-course-bundle .tutor-sidebar-card .mu-native-atc > a.add_to_cart_button:hover {
        transform: none !important;
    }
}