/* =============================================
   SKINPECCABLE - CORRECTIONS ACCESSIBILITE & UX
   Ce fichier doit etre charge APRES theme.css
   ============================================= */

/* --- Skip Link (accessibilite WCAG 2.1) --- */
.skip-link {
    position: absolute;
    top: -100%;
    left: 50%;
    transform: translateX(-50%);
    background: #000;
    color: #fff;
    padding: 12px 24px;
    z-index: 99999;
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    border-radius: 0 0 8px 8px;
    transition: top 0.2s ease;
}

.skip-link:focus {
    top: 0;
    color: #fff;
    outline: 3px solid #F4CCCC;
    outline-offset: 2px;
}

/* --- Correction contraste (WCAG AA minimum) --- */
/* Rose pale sur blanc = ratio ~1.4:1 -> insuffisant
   On renforce le texte pour atteindre au moins 4.5:1 */

/* Texte rose sur fond blanc : renforcer */
.tp-footer-copyright p,
.tp-footer-area p,
.tp-product-content .tp-product-category a {
    color: #5a5a5a; /* ratio 5.9:1 sur blanc */
}

/* Liens dans le footer */
.tp-footer-area a {
    color: #4a4a4a; /* ratio 7:1 sur blanc */
}

.tp-footer-area a:hover,
.tp-footer-area a:focus {
    color: #c0392b;
}

/* Bouton CTA newsletter - contraste ameliore */
.tp-subscribe-cta-btn {
    --tp-btn-color: var(--tp-common-white);
    background-color: var(--tp-common-black);
    border-radius: 8px;
    box-shadow: 0 1px 2px rgba(1, 15, 28, 0.1);
    color: var(--tp-common-white);
    font-family: var(--primary-font);
    font-size: 14px;
    font-weight: 500;
    padding: 17px 40px;
    text-decoration: none;
    display: inline-block;
    transition: background-color 0.3s ease, transform 0.2s ease;
}

.tp-subscribe-cta-btn:hover,
.tp-subscribe-cta-btn:focus {
    background-color: #333;
    color: #fff;
    transform: translateY(-2px);
}

/* --- Focus visible pour tous les elements interactifs --- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 3px solid #2563eb;
    outline-offset: 2px;
}

/* --- Taille minimale des cibles tactiles (44x44px WCAG) --- */
.tp-product-action-btn a,
.tp-product-action-btn button {
    min-width: 44px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* --- Liens legaux dans le footer --- */
.tp-footer-legal a {
    color: #555;
    text-decoration: none;
    transition: color 0.2s ease;
}

.tp-footer-legal a:hover,
.tp-footer-legal a:focus {
    color: #c0392b;
    text-decoration: underline;
}

/* --- Pages legales --- */
.tp-contact-wrapper h2 {
    margin-top: 30px;
    margin-bottom: 15px;
    font-size: 1.3rem;
    color: #333;
}

.tp-contact-wrapper ul {
    padding-left: 20px;
    margin-bottom: 15px;
}

.tp-contact-wrapper ul li {
    margin-bottom: 8px;
    line-height: 1.6;
}

.tp-contact-wrapper table {
    margin-bottom: 20px;
}

.tp-contact-wrapper table th {
    background-color: #f8f8f8;
}

/* --- Amelioration du preloader d'accessibilite --- */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* --- Amelioration responsive petits ecrans --- */
@media (max-width: 575px) {
    .tp-subscribe-cta-btn {
        padding: 14px 30px;
        font-size: 13px;
    }

    .tp-footer-legal-wrapper {
        font-size: 12px;
    }

    .tp-footer-legal a {
        display: inline-block;
        margin: 3px 5px;
    }

    .tp-footer-legal .mx-2 {
        display: none;
    }
}


/* ============================
   SKINPECCABLE RESPONSIVE FIXES
   ============================ */

/* Product images - proper sizing */
.tp-product-thumb img,
.tp-product-item img,
.tpproduct__thumb img {
    width: 100%;
    height: auto;
    object-fit: contain;
    aspect-ratio: 1/1;
    background: #f8f8f8;
}

/* Product grid cards - uniform */
.tp-product-item { height: 100%; }

.tp-product-thumb,
.tpproduct__thumb {
    overflow: hidden;
    aspect-ratio: 1/1;
    background: #f8f8f8;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Product detail - main image */
.tp-product-details-thumb-image img {
    max-width: 100%;
    height: auto;
}

/* Related products */
.tp-product-related .tp-product-thumb img,
.tp-related-product .tp-product-thumb img {
    width: 100%;
    height: auto;
    object-fit: contain;
    aspect-ratio: 1/1;
    background: #f8f8f8;
}

/* Search results */
.tp-search-result-product img {
    width: 60px;
    height: 60px;
    object-fit: contain;
    background: #f8f8f8;
    border-radius: 4px;
}

/* Mobile responsive */
@media (max-width: 768px) {
    /* Product grid spacing */
    .tp-product-area .row { margin: 0 -5px; }
    .tp-product-area .row > [class*="col-"] { padding: 0 5px; }
    .tp-product-item { margin-bottom: 15px; }
    .tp-product-content .tp-product-title { font-size: 13px; line-height: 1.3; }
    .tp-product-price-wrapper span { font-size: 14px; }

    /* Footer */
    .tp-footer-area .row > [class*="col-"] { margin-bottom: 20px; }

    /* Search */
    .tp-header-search-form { width: 100%; }
    .tp-header-search-category { display: none; }

    /* Product detail */
    .tp-product-details-thumb-image { margin-bottom: 20px; }
    .tp-product-details-wrapper { padding: 0 10px; }

    /* Breadcrumb */
    .tp-breadcrumb-area { padding: 15px 0; }
    .breadcrumb-item { font-size: 12px; }

    /* Header adjustments */
    .tp-header-main .container { padding: 0 10px; }
}

@media (max-width: 480px) {
    .tp-product-content .tp-product-title { font-size: 12px; }
    .tp-product-price-wrapper span { font-size: 13px; }
    /* 2 columns on small screens */
    .tp-product-area .row > [class*="col-"] {
        flex: 0 0 50%;
        max-width: 50%;
    }
}

/* Legal footer links */
.tp-footer-legal-wrapper { font-size: 12px; }
.tp-footer-legal-wrapper a { color: inherit; text-decoration: underline; }

/* Newsletter popup */
.tp-newsletter-popup { max-width: 90vw; }

/* Category sidebar */
.tp-shop-widget .tp-shop-widget-categories li { margin-bottom: 8px; }