/*
Theme Name: Porto Child
Theme URI: https://www.portotheme.com/wordpress/porto
Author: P-THEMES
Author URI: https://www.portotheme.com/
Description: Porto Responsive WordPress + eCommerce Theme.
Version: 1.1
Template: porto
License: Commercial
License URI: http://themeforest.net/licenses/regular_extended
Tags: woocommerce, corporate, ecommerce, responsive, blue, black, green, white, light, dark, red, two-columns, three-columns, four-columns, left-sidebar, right-sidebar, fixed-layout, responsive-layout, custom-menu, editor-style, featured-images, flexible-header, full-width-template, microformats, post-formats, rtl-language-support, sticky-post, theme-options, translation-ready, accessibility-ready
*/

/*************** ADD YOUR CUSTOM CSS HERE  ***************/
/* Container principal */
.orthodeal-subcats {
    margin: 40px 0;
    padding: 0;
}

/* Titre */
.orthodeal-subcats h3 {
    font-size: 18px;
    font-weight: 400;
    color: #888;
    padding: 0;
}

/* Wrapper du carousel */
.orthodeal-carousel-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    margin: 0;
    transition: padding 0.3s ease;
}

/* Quand il y a du scroll, ajouter l'espace pour les flèches */
.orthodeal-subcats.has-scroll .orthodeal-carousel-wrapper {
    padding: 0 60px;
}

/* Container du carousel - avec snap sur desktop */
.orthodeal-carousel-container {
    width: 100%;
    overflow: hidden;
    position: relative;
    scroll-snap-type: x mandatory; /* Snap scrolling sur desktop */
    scroll-behavior: smooth;
}

/* Track du carousel */
.orthodeal-carousel-track {
    display: flex;
    gap: 15px;
    transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Quand pas de scroll, centrer les éléments */
.orthodeal-subcats:not(.has-scroll) .orthodeal-carousel-track {
    justify-content: center;
}

/* Boutons des catégories - avec snap align */
.orthodeal-subcat {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    padding: 10px 15px;
    background: transparent;
    border: 2px solid #FAE2EE;
    border-radius: 10px;
    color: #888;
    text-decoration: none;
    font-size: 14px;
    font-weight: 400;
    transition: all 0.3s ease;
    white-space: nowrap;
    cursor: pointer;
    scroll-snap-align: start; /* Point d'ancrage pour desktop */
}

/* Hover simple et clean */
.orthodeal-subcat:hover {
    background: #D71A75;
    border-color: #D71A75;
    color: #ffffff !important;
    text-decoration: none;
}

/* Boutons de navigation */
.orthodeal-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background: #fff;
    border: 2px solid #e8e8e8;
    color: #888;
    font-size: 26px;
    cursor: pointer;
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 10;
    transition: all 0.3s ease;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    padding: 0;
    line-height: 1;
}

/* Afficher les flèches seulement si nécessaire */
.orthodeal-subcats.has-scroll .orthodeal-nav {
    display: flex;
}

.orthodeal-nav:hover:not(.disabled) {
    border-color: #D71A75;
    background: #D71A75;
    color: #ffffff;
    box-shadow: 0 4px 12px rgba(215, 26, 117, 0.25);
}

.orthodeal-nav-prev {
    left: 10px;
}

.orthodeal-nav-next {
    right: 10px;
}

.orthodeal-nav.disabled {
    opacity: 0.2;
    cursor: not-allowed;
    pointer-events: none;
}

/* Animation pour l'apparition/disparition de l'espace */
@keyframes slideIn {
    from {
        opacity: 0;
        transform: translateY(-50%) scale(0.8);
    }
    to {
        opacity: 1;
        transform: translateY(-50%) scale(1);
    }
}

.orthodeal-subcats.has-scroll .orthodeal-nav {
    animation: slideIn 0.3s ease;
}

/* Responsive - SANS snap sur mobile */
@media (max-width: 768px) {
    .orthodeal-carousel-wrapper {
        padding: 0 15px !important;
    }
    
    .orthodeal-subcats h3 {
        margin-left: 20px;
    }
    
    .orthodeal-nav {
        display: none !important;
    }
    
    .orthodeal-carousel-container {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scroll-behavior: smooth;
        scroll-snap-type: none !important; /* Désactive le snap sur mobile */
        padding-bottom: 15px;
    }
    
    .orthodeal-carousel-track {
        padding-bottom: 10px;
    }
    
    .orthodeal-subcat {
        padding: 10px 20px;
        font-size: 14px;
        scroll-snap-align: none !important; /* Pas de snap sur mobile */
    }
    
    /* Barre de défilement personnalisée */
    .orthodeal-carousel-container {
        scrollbar-width: thin;
        scrollbar-color: #ff69b4 #f1f1f1;
    }
    
    .orthodeal-carousel-container::-webkit-scrollbar {
        height: 4px;
    }
    
    .orthodeal-carousel-container::-webkit-scrollbar-track {
        background: #f1f1f1;
        border-radius: 2px;
        margin: 0 15px;
    }
    
    .orthodeal-carousel-container::-webkit-scrollbar-thumb {
        background: #ff69b4;
        border-radius: 2px;
    }
}

@media (max-width: 480px) {
    .orthodeal-subcat {
        padding: 8px 16px;
        font-size: 13px;
    }
}


/* compte client */
.woocommerce-account .featured-boxes {
	border-radius: 10px!important;
}