/*
 * phosphorescent.fr — retouches du thème phospho (chargé automatiquement par PrestaShop après theme.css, priorité 1000).
 * Ce fichier n'est touché ni par les mises à jour des modules ni par celles de PrestaShop.
 */

/* En-tête : barre de recherche (#search_widget, module ps_searchbar) à la hauteur des boutons alignés à sa droite (contact,
   compte, panier : 60 px), bas alignés (2026-10-21, reprise de la correction faite sur nachleucht.de). Ici et non dans
   modules/ps_searchbar/ps_searchbar.css, que les mises à jour du module écrasent.
   Écran ≥ 421 px (sur mobile la recherche est seule sur sa ligne, réglages du thème gardés). */
@media screen and (min-width: 421px) {
    #header #search_widget {
        margin-bottom: 0;
        height: 60px;
        overflow: visible;
    }
    #header #search_widget form {
        height: 60px;
    }
    #header #search_widget form input[type=text] {
        box-sizing: border-box;
        height: 60px;
        padding-top: 0;
        padding-bottom: 0;
    }
    /* Icônes loupe / effacer : le thème leur donne une boîte de 1em (24 px) marges comprises (box-sizing: border-box) ; le
       glyphe de 24 px débordait alors de 8 px vers le bas et le centrage visait la boîte, pas le glyphe. Boîte = glyphe + marges. */
    #header #search_widget form i {
        box-sizing: content-box;
        line-height: 1;
        top: 50%;
        transform: translateY(-50%);
    }
}

/* Panier : bloc « Toujours utile » du module sdcartcrossselling (2026-10-28). Mise en forme reprise du .com (thème panda,
   « Cros-selling panier »), aux couleurs de phospho (#0DABF5, survol #1d93ab) ; le module n'apporte que l'alignement des cartes. */
.cross-selling-container {
    background: #fff;
    box-shadow: 0 2px 20px rgba(0,0,0,.1);
    border: 0 !important;
    margin: 6px auto 24px auto;
    padding: 12px;
    width: 100%;
}
.cross-selling-title {
    display: block;
    font-size: 22px;
    margin: 12px;
    color: #0DABF5;
}
.cross-selling-products {
    width: 100%;
    overflow-x: auto;
    display: flex;
    gap: 7px;
}
.cr-product-box {
    width: 174.8px;
    height: fit-content;
    border: 1px solid #d4d1d1;
    padding: 6px;
    min-width: 166px;
    margin: 0 0 12px 0;
}
.cr-product-box-img {
    width: 100%;
    aspect-ratio: 1 / 1;
    background: #fff;
}
.cr-product-box-txt a {
    line-height: 16px;
    font-size: 14px;
}
.cr-product-box-txt .ajax_add_to_cart_button .cr-add-to-cart {
    background-color: #0DABF5;
    color: #fff;
    padding: 6px;
    text-align: center;
    margin: 6px auto 0 auto;
}
.cr-product-box-txt .ajax_add_to_cart_button:hover .cr-add-to-cart {
    background-color: #1d93ab;
}

/* Étape de paiement : acceptation des CGV au-dessus des moyens de paiement, dans l'encadré vert des sites ST (2026-10-28).
   Règles reprises du .pt (elles-mêmes reprises du .com, thème panda) : cadre vert #489548, fond #ddffb445, case native de 24 px,
   texte vert, lien bleu. Le déplacement est fait dans templates/checkout/_partials/steps/payment.tpl. */
body#checkout section.checkout-step #conditions-to-approve {
    display: block;
    padding: 0.6rem 0.5rem;
    margin: 12px auto 20px auto;
    border: 1px solid #489548;
    border-radius: 4px;
    background-color: #ddffb445;
}
body#checkout #conditions-to-approve ul {
    margin: 0;
}
body#checkout #conditions-to-approve li {
    display: flex;
    align-items: center;
}
body#checkout #conditions-to-approve li + li {
    margin-top: 0.5rem;
}
body#checkout #conditions-to-approve .custom-checkbox input[type="checkbox"] {
    position: static;
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
    margin: 0 10px 0 0;
    opacity: 1;
    cursor: pointer;
}
body#checkout #conditions-to-approve .condition-label {
    padding-left: 0;
    margin-top: 0;
}
body#checkout #conditions-to-approve label {
    margin: 0;
    color: green;
}
body#checkout #conditions-to-approve #cta-terms-and-conditions-0 {
    color: blue;
}

/* En-tête : logo limité à 240 px de large (2026-10-28, demande de l'utilisateur) ; la hauteur suit (height: auto du thème).
   Le fichier WebP fait 96 px de haut : il reste net sur les écrans haute densité. */
#header .logo {
    max-width: 290px;
    margin: -4px auto 0 0;
}

/* Fiche produit : référence (ou référence de la déclinaison) entre le nom et le prix, en gris (2026-10-28).
   Ajoutée en tête de templates/catalog/_partials/product-prices.tpl. */
/* Avec une référence, la marge haute du bloc prix (1.25rem dans le thème) passe sous la référence : collée au titre (2026-10-28). */
.product-prices.with-reference {
    margin-top: 0;
}
.product-prices .product-reference-top {
    margin: 0 0 1.25rem 0;
    font-size: .875rem;
    color: #7a7a7a;
}

/* Topbar (2026-10-29) : liens vers les autres sites PH à gauche (.worldweb, comme sur les sites ST), société + dépôt à droite */
.info-row .header-info {
    width: 100%;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 24px;
}
.header-info .worldweb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}
.header-info .worldweb .material-icons {
    font-size: 22px;
    margin-right: 4px;
    color: #fff;
}
.header-info .worldweb a {
    color: #fff;
    font-size: 13px;
    line-height: 1.2;
    padding: 0 6px;
}
.header-info .worldweb a:not(:last-child) {
    border-right: 1px solid lightgray;
}
.header-info .worldweb a:hover,
.header-info .worldweb a:focus {
    color: #eb7b54;
}
.header-info .worldweb .lang-short {
    display: none;
}
.header-info .head-support {
    text-align: right;
}
@media (max-width: 991px) {
    .info-row .header-info {
        justify-content: center;
    }
    .header-info .worldweb {
        justify-content: center;
    }
    .header-info .head-support {
        text-align: center;
    }
}
@media (max-width: 768px) {
    .header-info .worldweb .lang-short {
        display: inline;
    }
    .header-info .worldweb .lang-full {
        display: none;
    }
}