/* Secal Regalia® — plg_system_secalscripts — feuille 04 : tunnel-commande
   Chargée sur : pages HikaShop. */

/* ---------- Barre d'étapes (wizard) ---------- */
.hikashop_wizardbar ul {
    display: flex;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 0;
}

.hikashop_wizardbar ul li {
    flex: 1;
    text-align: center;
}

@media (max-width: 768px) {
    .hikashop_wizardbar ul {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
        padding: 10px;
    }

    .hikashop_wizardbar ul li {
        flex: 1 1 45%;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        min-height: 60px;
        padding: 8px 4px;
        position: static !important;
    }

    .hikashop_wizardbar .hkbadge {
        position: static !important;
        margin-bottom: 4px;
    }

    .hikashop_wizardbar .hikashop_checkout_step_name {
        display: block;
        position: static !important;
        font-size: 12px;
        white-space: normal;
        line-height: 1.3;
    }

    .hikashop_wizardbar .hikashop_chevron {
        display: none;
    }
}

/* ---------- Case « même adresse » et infos obligatoires ---------- */
.hikashop_registration_same_address_line,
.hikashop_registration_required_info_line {
    display: inline-block !important;
    width: 48% !important;
    vertical-align: middle !important;
    box-sizing: border-box !important;
}

.hikashop_registration_same_address_line {
    margin-right: 2% !important;
}

.hikashop_registration_same_address_line .hkc-sm-4,
.hikashop_registration_required_info_line .hkc-sm-4 {
    display: none !important;
}

.hikashop_registration_same_address_line .hkc-sm-8,
.hikashop_registration_required_info_line .hkc-sm-8 {
    width: 100% !important;
}

.hikashop_same_address_clone_wrapper {
    margin-top: 15px;
    margin-bottom: 15px;
}

.hikashop_registration_shipping_address_title legend {
    font-size: 20px;
    font-weight: bold;
}

.hikashop_registration_required_info_line .hkc-sm-8 {
    font-size: 16px;
    color: #d9534f;
    font-weight: bold;
}

.hikashop_registration_same_address_line label {
    font-size: 16px;
    font-weight: bold;
}

.hikashop_registration_same_address_line input[type="checkbox"] {
    width: 20px;
    height: 20px;
    vertical-align: middle;
}

.hikashop_same_address_clone_wrapper label {
    font-size: 16px;
    font-weight: bold;
}

.hikashop_same_address_clone_wrapper input[type="checkbox"] {
    width: 20px;
    height: 20px;
    vertical-align: middle;
}

/* ---------- Conditions générales ----------
   Un client a validé sa commande sans voir cette case. Elle est donc
   nettement agrandie, et surtout MISE EN EVIDENCE : la taille seule ne
   suffit pas si le bloc se fond dans le reste du récapitulatif.

   Les sélecteurs couvrent les deux identifiants rencontrés selon l'étape,
   plus une forme générique au cas où HikaShop en changerait la numérotation
   lors d'une mise à jour. */
#hikashop_checkout_terms_checkbox_4_2,
#hikashop_checkout_terms_checkbox_2_2,
.hikashop_checkout_terms input[type="checkbox"] {
    width: 30px;
    height: 30px;
    min-width: 30px;
    margin-right: 12px;
    vertical-align: middle;
    accent-color: #2DA0CE;
    cursor: pointer;
}

label[for="hikashop_checkout_terms_checkbox_4_2"],
label[for="hikashop_checkout_terms_checkbox_2_2"],
.hikashop_checkout_terms label {
    font-size: 17px;
    font-weight: 700;
    line-height: 1.4;
    cursor: pointer;
    vertical-align: middle;
}

/* Le bloc entier se détache du récapitulatif : fond ambré et liseré
   épais à gauche, comme un point d'attention. */
.hikashop_checkout_terms,
#hikashop_checkout_terms_4_8 {
    background-color: #FFF8E6 !important;
    border: 2px solid #E8B10A !important;
    border-left-width: 6px !important;
    border-radius: 6px;
}

/* La case et son libellé sur une même ligne, alignés au centre : la
   disposition par défaut décalait le texte sous la case sur mobile. */
.hikashop_checkout_terms label,
#hikashop_checkout_terms_4_8 label {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

/* ---------- Étape 3 : encadrés Livraison et Paiement ---------- */
#hikashop_checkout_shipping_3_0,
#hikashop_checkout_payment_3_2 {
    border: 1px solid #ccc;
    border-radius: 8px;
    padding: 15px;
    background-color: #fafafa;
    height: 100%;
    box-sizing: border-box;
}

#hikashop_checkout_shipping_3_0 legend,
#hikashop_checkout_payment_3_2 legend {
    font-size: 20px;
    font-weight: bold;
}

/* Logos des transporteurs et des moyens de paiement alignés à droite.
   Le « clear » empêche la description de s'enrouler autour du logo. */
.hikashop_checkout_shipping_images,
.hikashop_checkout_payment_images {
    float: right;
    margin-left: 12px;
}

.hikashop_checkout_shipping_images img,
.hikashop_checkout_payment_images img {
    max-height: 40px;
    width: auto;
    vertical-align: middle;
}

/* Tout ce qui suit le logo flottant doit reprendre la pleine largeur :
   description, carte des points relais, listes et champs. Sans "clear", ces
   éléments s'insèrent dans la zone laissée libre à côté du logo — la carte
   perdait 128 px de large, et le sélecteur Mondial Relay passait dessous. */
.hikashop_checkout_shipping_description,
.hikashop_checkout_payment_description,
.hikashop_checkout_shipping_images + *,
.mondialrelay_div_map,
.leaflet-container,
.hikashop_colissimo_list,
.hikashop_nom_retrait_proxy_wrapper,
.hikabtn_checkout_shipping_submit {
    clear: both;
}

/* Les conteneurs de carte et de sélection prennent toute la largeur
   disponible, sans dépasser celle de la colonne. */
.mondialrelay_div_map,
.leaflet-container,
.hikashop_colissimo_list,
select[id*="_relay"] {
    width: 100% !important;
    max-width: 100%;
    box-sizing: border-box;
}

/* Sur mobile, le logo repasse dans le flux : flottant, il chevaucherait
   les libellés de transport les plus longs. */
@media (max-width: 600px) {
    .hikashop_checkout_shipping_images,
    .hikashop_checkout_payment_images {
        float: none;
        display: block;
        margin: 8px 0 0;
    }
}

/* ---------- Étape 4 : récapitulatif ---------- */
#hikashop_checkout_cart_4_0,
#hikashop_checkout_address_4_2,
#hikashop_checkout_shipping_4_4,
#hikashop_checkout_payment_4_6,
#hikashop_checkout_terms_4_8 {
    border: 1px solid #ccc;
    border-radius: 8px;
    padding: 15px;
    background-color: #fafafa;
    box-sizing: border-box;
}

#hikashop_checkout_shipping_4_4 legend,
#hikashop_checkout_payment_4_6 legend,
#hikashop_checkout_address_4_2 legend,
#hikashop_checkout_terms_4_8 legend,
#hikashop_checkout_cart_4_0 legend {
    font-size: 20px;
    font-weight: bold;
}

#hikashop_checkout_terms_4_8 {
    padding: 20px;
    margin-top: 10px;
}

#hikashop_checkout_terms_4_8 label {
    font-size: 16px;
    font-weight: bold;
}

#hikashop_step4_layout {
    display: flex;
    gap: 20px;
    align-items: flex-start;
}

.hikashop_step4_col_left {
    flex: 1 1 40%;
}

.hikashop_step4_col_right {
    flex: 1 1 55%;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

@media (max-width: 768px) {
    #hikashop_step4_layout {
        flex-direction: column;
    }

    .hikashop_step4_col_left,
    .hikashop_step4_col_right {
        width: 100%;
        flex: 1 1 100%;
    }

    #hikashop_checkout_cart_4_0 {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    #hikashop_checkout_cart_4_0 table {
        min-width: 500px;
    }

    #hikashop_checkout_cart_4_0 table td,
    #hikashop_checkout_cart_4_0 table th {
        font-size: 13px;
        padding: 6px 8px;
    }
}

/* ---------- Tableau du récapitulatif : lignes alternées ---------- */
#hikashop_checkout_cart_4_0 table tbody tr:nth-child(odd) {
    background-color: #ffffff !important;
}

#hikashop_checkout_cart_4_0 table tbody tr:nth-child(even) {
    background-color: #6C757D !important;
    color: #ffffff !important;
}

#hikashop_checkout_cart_4_0 table.table-hover tbody tr:nth-child(even):hover > td,
#hikashop_checkout_cart_4_0 table.table-hover tbody tr:nth-child(even):hover > th {
    background-color: #6C757D !important;
}

/* ---------- Tableau du panier et du récapitulatif : titre « Quantité » sur une ligne (1.1.1) ---------- */
#hikashop_cart_product_quantity_title,
.hikashop_cart_product_quantity_title {
    white-space: nowrap !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
    width: 1%;
}
