/* ==========================================================
   INFO PRO 13 — CATALOGUE PC
   1 PC PAR LIGNE
   Desktop/Tablette horizontal
   Mobile vertical
   ========================================================== */


/* ==========================================================
   BASE
   ========================================================== */

.shop-section ul.products {
    display:grid !important;
    grid-template-columns:minmax(0, 1fr) !important;
    gap:22px !important;
    width:100% !important;
}

.shop-section ul.products li.product {
    position:relative !important;

    width:100% !important;
    max-width:none !important;
    min-width:0 !important;

    margin:0 !important;
    padding:18px !important;

    float:none !important;

    overflow:hidden !important;
}


/* ==========================================================
   DESKTOP + TABLETTE
   IMAGE GAUCHE / CONTENU DROITE
   ========================================================== */

@media (min-width: 641px) {

    .shop-section ul.products li.product {
        display:grid !important;

        grid-template-columns:minmax(280px, 36%)
            minmax(0, 1fr) !important;

        grid-template-areas:"image title"
            "image price"
            "image specs"
            "image summary"
            "image buttons";

        column-gap:28px !important;
        row-gap:0 !important;

        align-items:start !important;
    }


    /* Lien/image WooCommerce */
    .shop-section ul.products li.product
    > a.woocommerce-LoopProduct-link {
        display:contents !important;
    }


    /* Image */
    .shop-section ul.products li.product img,
    .shop-section ul.products li.product a img,
    .shop-section ul.products li.product
    .ip13-pc-gaming-full-image {
        grid-area:image;

        display:block !important;

        width:100% !important;
        height:100% !important;
        max-height:390px !important;

        margin:0 !important;

        object-fit:contain !important;

        border-radius:10px !important;
        background:#ffffff !important;
    }


    /* Titre */
    .shop-section ul.products li.product
    .woocommerce-loop-product__title {
        grid-area:title;

        min-height:0 !important;

        margin:0 150px 8px 0 !important;
        padding:0 !important;

        font-size:1.1rem !important;
        line-height:1.3 !important;
    }


    /* Prix WooCommerce standard : on le masque ici */
    .shop-section ul.products li.product
    > .price,
    .shop-section ul.products li.product
    a.woocommerce-LoopProduct-link > .price {
        display:none !important;
    }


    /* Nouveau prix haut droite */
    .ip13-pc-catalogue-top-price {
        position:absolute !important;

        top:18px !important;
        right:18px !important;

        z-index:4;

        min-width:130px;

        padding:9px 12px;

        border:1px solid var(--border-strong);
        border-radius:8px;

        background:linear-gradient(
                135deg,
                rgba(76,29,149,.96),
                rgba(102,137,255,.96)
            );

        color:#fff;

        text-align:right;
        font-size:1rem;
        font-weight:900;
        line-height:1.2;

        box-shadow:0 8px 24px rgba(0,0,0,.28);
    }

    .ip13-pc-catalogue-top-price del {
        display:block;

        margin-bottom:2px;

        color:rgba(255,255,255,.65);

        font-size:.72rem;
        font-weight:700;
    }

    .ip13-pc-catalogue-top-price ins {
        display:block;

        color:#151515;

        text-decoration:none;
    }


    /* Specs */
    .ip13-pc-catalogue-specs {
        grid-area:specs;

        margin-top:8px;
        padding:10px 0;

        border-top:1px solid var(--border);
        border-bottom:1px solid var(--border);
    }

    .ip13-pc-catalogue-spec {
        display:grid;

        grid-template-columns:130px minmax(0, 1fr);

        gap:10px;

        min-width:0;
        min-height:30px;

        align-items:center;

        border-bottom:1px solid rgba(0, 0, 0,.045);
    }

    .ip13-pc-catalogue-spec:last-child {
        border-bottom:0;
    }

    .ip13-pc-catalogue-spec__label {
        color:var(--text-dim);

        font-size:.72rem;
        font-weight:800;
        line-height:1.2;
    }

    .ip13-pc-catalogue-spec__value {
        min-width:0;

        overflow:hidden;

        white-space:nowrap;
        text-overflow:ellipsis;

        color:var(--text);

        font-size:.76rem;
        line-height:1.2;
    }


    /* Résumé */
    .ip13-pc-catalogue-summary {
        grid-area:summary;

        margin-top:12px;
    }

    .ip13-pc-catalogue-summary strong {
        display:block;

        margin-bottom:5px;

        color:var(--primary-2);

        font-size:.73rem;
        font-weight:900;

        text-transform:uppercase;
        letter-spacing:.04em;
    }

    .ip13-pc-catalogue-summary ul {
        display:grid;

        gap:3px;

        margin:0;
        padding:0;

        list-style:none;
    }

    .ip13-pc-catalogue-summary li {
        position:relative;

        margin:0;
        padding-left:13px;

        color:var(--text-dim);

        font-size:.72rem;
        line-height:1.35;
    }

    .ip13-pc-catalogue-summary li::before {
        content:"•";

        position:absolute;
        left:0;

        color:var(--primary-2);
    }


    /* Boutons */
    .shop-section ul.products li.product
    .ip13-pc-catalogue-view,

    .shop-section ul.products li.product
    .ip13-configurator-personalize,

    .shop-section ul.products li.product
    .add_to_cart_button {
        grid-area:buttons;

        width:auto !important;
        min-width:165px;
        min-height:42px;

        display:inline-flex !important;

        align-items:center;
        justify-content:center;

        margin-top:14px !important;
        margin-right:8px !important;

        padding:8px 15px !important;

        font-size:.68rem !important;
        line-height:1.15 !important;
    }

    .shop-section ul.products li.product
    .ip13-pc-catalogue-view {
        border:1px solid var(--border-strong);

        background:rgba(255,255,255,.04);

        color:var(--text);
    }
}


/* ==========================================================
   MOBILE
   On garde vertical comme actuellement
   + prix visible en haut à droite
   ========================================================== */

@media (max-width: 640px) {

    .shop-section ul.products li.product {
        display:block !important;

        padding:14px !important;
    }


    .shop-section ul.products li.product img,
    .shop-section ul.products li.product a img,
    .shop-section ul.products li.product
    .ip13-pc-gaming-full-image {
        display:block !important;

        width:100% !important;
        height:auto !important;

        margin:0 0 16px !important;

        object-fit:contain !important;
    }


    .ip13-pc-catalogue-top-price {
        position:absolute !important;

        top:14px !important;
        right:14px !important;

        z-index:5;

        min-width:115px;

        padding:8px 10px;

        border:1px solid var(--border-strong);
        border-radius:8px;

        background:linear-gradient(
                135deg,
                rgba(76,29,149,.96),
                rgba(102,137,255,.96)
            );

        color:#fff;

        text-align:right;

        font-size:.9rem;
        font-weight:900;
        line-height:1.15;

        box-shadow:0 8px 20px rgba(0,0,0,.3);
    }


    .ip13-pc-catalogue-top-price del {
        display:block;

        color:rgba(255,255,255,.62);

        font-size:.65rem;
    }

    .ip13-pc-catalogue-top-price ins {
        display:block;

        color:#151515;

        text-decoration:none;
    }


    /* Cache ancien prix standard pour éviter doublon */
    .shop-section ul.products li.product
    > .price,
    .shop-section ul.products li.product
    a.woocommerce-LoopProduct-link > .price {
        display:none !important;
    }


    .ip13-pc-catalogue-spec {
        display:grid;

        grid-template-columns:105px minmax(0, 1fr);

        gap:8px;

        min-height:29px;
    }


    .ip13-pc-catalogue-spec__value {
        min-width:0;

        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
    }


    .shop-section ul.products li.product
    .ip13-pc-catalogue-view,

    .shop-section ul.products li.product
    .ip13-configurator-personalize,

    .shop-section ul.products li.product
    .add_to_cart_button {
        width:100% !important;

        margin-right:0 !important;
    }
}

/* ==========================================================
   FIX BOUTONS PC — DESKTOP / TABLETTE
   Voir ce PC à gauche / Personnaliser à droite
   ========================================================== */

@media (min-width: 641px) {

    .shop-section ul.products li.product
    .ip13-pc-catalogue-view,

    .shop-section ul.products li.product
    .ip13-configurator-personalize,

    .shop-section ul.products li.product
    .add_to_cart_button {
        grid-area:buttons !important;
        width:auto !important;
        min-width:170px !important;
        max-width:calc(50% - 5px) !important;
        margin-top:14px !important;
        margin-right:0 !important;
    }

    .shop-section ul.products li.product
    .ip13-pc-catalogue-view {
        justify-self:start !important;
    }

    .shop-section ul.products li.product
    .ip13-configurator-personalize,

    .shop-section ul.products li.product
    .add_to_cart_button {
        justify-self:end !important;
    }

}


/* ==========================================================
   DIFFÉRENCIATION DES BOUTONS PC
   Voir ce PC = secondaire
   Personnaliser = action principale
   ========================================================== */

.shop-section ul.products li.product
.ip13-pc-catalogue-view {
    background:rgba(255,255,255,.035) !important;
    color:var(--text) !important;

    border:1px solid var(--border-strong) !important;

    box-shadow:none !important;
}

.shop-section ul.products li.product
.ip13-pc-catalogue-view:hover {
    background:rgba(102,137,255,.10) !important;
    border-color:var(--primary-2) !important;
    color:#fff !important;
}


.shop-section ul.products li.product
.ip13-configurator-personalize {
    background:linear-gradient(
            135deg,
            var(--primary-dark),
            var(--primary-2)
        ) !important;

    color:#151515 !important;

    border:1px solid var(--primary-2) !important;

    box-shadow:0 8px 22px rgba(102,137,255,.20) !important;
}

.shop-section ul.products li.product
.ip13-configurator-personalize:hover {
    filter:brightness(1.10) !important;

    box-shadow:0 10px 28px rgba(102,137,255,.30) !important;
}


/* ==========================================================
   INFO PRO 13 — BOUTONS PC
   Voir ce PC = secondaire sombre
   Personnaliser = primaire violet
   ========================================================== */

/* VOIR CE PC */
body.tax-product_cat
.shop-section
ul.products
li.product
a.button.ip13-pc-catalogue-view {
    background:#eef1f7 !important;
    background-image:none !important;

    border:1px solid rgba(102,137,255,.65) !important;

    color:#fff !important;

    box-shadow:inset 0 0 0 1px rgba(0, 0, 0,.02) !important;

    filter:none !important;
}

body.tax-product_cat
.shop-section
ul.products
li.product
a.button.ip13-pc-catalogue-view:hover {
    background:#ffffff !important;
    background-image:none !important;

    border-color:var(--primary-2) !important;

    color:#151515 !important;

    box-shadow:0 0 18px rgba(102,137,255,.18) !important;
}


/* PERSONNALISER */
body.tax-product_cat
.shop-section
ul.products
li.product
a.button.ip13-configurator-personalize {
    background:linear-gradient(
            135deg,
            var(--primary-dark),
            var(--primary-2)
        ) !important;

    background-color:var(--primary-2) !important;

    border:1px solid var(--primary-2) !important;

    color:#151515 !important;

    box-shadow:0 8px 22px rgba(102,137,255,.22) !important;
}

body.tax-product_cat
.shop-section
ul.products
li.product
a.button.ip13-configurator-personalize:hover {
    filter:brightness(1.10) !important;

    box-shadow:0 10px 28px rgba(102,137,255,.32) !important;
}


/* ==========================================================
   INFO PRO 13 — FINITION INTERIEUR CARTE PC MOBILE
   Ne touche ni image, ni prix, ni boutons
   ========================================================== */

@media (max-width: 640px) {

    /* Titre */
    .shop-section ul.products li.product
    .woocommerce-loop-product__title {
        margin:4px 0 16px !important;
        padding:0 2px !important;

        color:#151515 !important;

        font-size:1.05rem !important;
        font-weight:900 !important;
        line-height:1.35 !important;

        letter-spacing:-.01em;
    }


    /* Bloc composants */
    .ip13-pc-catalogue-specs {
        margin:0 !important;
        padding:8px 12px !important;

        border:1px solid rgba(102,137,255,.28) !important;
        border-radius:12px !important;

        background:linear-gradient(
                180deg,
                rgba(102,137,255,.045),
                rgba(255,255,255,.018)
            ) !important;
    }


    /* Chaque ligne composant */
    .ip13-pc-catalogue-spec {
        display:grid !important;

        grid-template-columns:112px minmax(0,1fr) !important;

        gap:10px !important;

        min-height:42px !important;

        padding:8px 0 !important;

        align-items:start !important;

        border-bottom:1px solid rgba(0, 0, 0,.07) !important;
    }


    .ip13-pc-catalogue-spec:last-child {
        border-bottom:0 !important;
    }


    /* Libellé : Carte mère / Processeur / etc */
    .ip13-pc-catalogue-spec__label {
        display:block !important;

        color:var(--primary-2) !important;

        font-size:.72rem !important;
        font-weight:900 !important;
        line-height:1.25 !important;

        text-transform:uppercase;
        letter-spacing:.02em;
    }


    /* Valeur composant */
    .ip13-pc-catalogue-spec__value {
        display:block !important;

        min-width:0 !important;

        color:#f3f3f7 !important;

        font-size:.82rem !important;
        font-weight:600 !important;
        line-height:1.35 !important;

        overflow:hidden !important;

        white-space:nowrap !important;
        text-overflow:ellipsis !important;
    }


    /* Bloc résumé */
    .ip13-pc-catalogue-summary {
        margin:14px 0 0 !important;
        padding:13px 14px !important;

        border:1px solid rgba(102,137,255,.22) !important;
        border-radius:12px !important;

        background:rgba(102,137,255,.055) !important;
    }


    .ip13-pc-catalogue-summary strong {
        display:block !important;

        margin:0 0 9px !important;

        color:#151515 !important;

        font-size:.84rem !important;
        font-weight:900 !important;
        line-height:1.2 !important;

        text-transform:none !important;
        letter-spacing:0 !important;
    }


    .ip13-pc-catalogue-summary ul {
        display:grid !important;
        gap:7px !important;

        margin:0 !important;
        padding:0 !important;

        list-style:none !important;
    }


    .ip13-pc-catalogue-summary li {
        position:relative !important;

        margin:0 !important;
        padding-left:17px !important;

        color:#ddddea !important;

        font-size:.79rem !important;
        font-weight:600 !important;
        line-height:1.35 !important;
    }


    .ip13-pc-catalogue-summary li::before {
        content:"" !important;

        position:absolute !important;

        left:1px !important;
        top:.48em !important;

        width:6px !important;
        height:6px !important;

        border-radius:50% !important;

        background:var(--primary-2) !important;

        box-shadow:0 0 8px rgba(102,137,255,.55) !important;
    }

}



/* ==========================================================
   INFO PRO 13 — FILTRE PAR PALIER GAMING
   (1080p / 1080p 165Hz+ / 1440p / 1440p 165Hz+ / 4K)
   ========================================================== */

.ip13-tier-filters {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:10px 14px;

    margin:18px 0 24px;
    padding:16px 18px;

    border:1px solid rgba(102, 137, 255, .28);
    border-radius:14px;

    background:rgba(255, 255, 255, .02);
}

.ip13-tier-filters[hidden] {
    display:none !important;
}

.ip13-tier-filters__title {
    display:flex;
    align-items:center;
    gap:8px;

    margin:0;

    color:#b4b4c1;

    font-size:.74rem;
    font-weight:800;
    letter-spacing:.03em;
    text-transform:uppercase;

    flex:0 0 auto;
}

.ip13-tier-filters__icon {
    color:var(--primary-2);
}

.ip13-tier-filters__list {
    display:flex;
    flex-wrap:wrap;
    gap:8px;

    flex:1 1 auto;
}

.ip13-tier-filters__badge {
    -webkit-appearance:none;
    appearance:none;

    padding:8px 14px;

    border:1px solid rgba(102, 137, 255, .4);
    border-radius:999px;

    background:rgba(255, 255, 255, .02);
    color:#d4d4de;

    font-size:.74rem;
    font-weight:700;

    cursor:pointer;

    transition:background .2s ease,
        border-color .2s ease,
        color .2s ease,
        transform .2s ease;
}

.ip13-tier-filters__badge:hover {
    border-color:var(--primary-2);
    color:#151515;
    transform:translateY(-1px);
}

.ip13-tier-filters__badge.is-active {
    border-color:transparent;
    background:linear-gradient(135deg, var(--primary-dark), var(--primary-2));
    color:#151515;

    box-shadow:0 0 16px rgba(102, 137, 255, .35);
}

.ip13-tier-filters__reset {
    -webkit-appearance:none;
    appearance:none;

    margin-left:auto;
    padding:0;

    border:0;
    background:none;

    color:#5b6472;

    font-size:.72rem;
    font-weight:700;
    text-decoration:underline;

    cursor:pointer;

    flex:0 0 auto;
}

.ip13-tier-filters__reset:hover {
    color:#151515;
}

@media (max-width: 650px) {

    .ip13-tier-filters {
        gap:10px;
    }

    .ip13-tier-filters__reset {
        margin-left:0;
        flex-basis:100%;
    }
}


/* ==========================================================
   CATALOGUE "SITE CLÉ EN MAIN"
   Ces images utilisent .ip13-site-product-full-image (pas
   .ip13-pc-gaming-full-image), avec une règle existante dans
   style.css (body.tax-product_cat.term-site-cle-en-main
   .ip13-site-product-full-image) qui force height:auto — dans
   la grille de carte ci-dessus (grid-area:image), une hauteur
   "auto" ne donne rien de visible, d'où des vignettes qui
   paraissent noires/vides. Règle plus spécifique (scopée à la
   grille précise) pour reprendre la main ici uniquement, sans
   toucher aux autres usages de cette classe ailleurs sur le site.
   ========================================================== */

body.tax-product_cat.term-site-cle-en-main
.shop-section ul.products li.product
.ip13-site-product-full-image {
    height:100% !important;
    max-height:390px !important;
}