/* Justér layout for faktureringsfelter */
.woocommerce-billing-fields__field-wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

/* Style fornavn, gadenavn, postnummer */
.woocommerce-billing-fields__field-wrapper .form-row-first,
.woocommerce-billing-fields__field-wrapper .form-row.address-field.validate-required.form-row-wide,
.woocommerce-billing-fields__field-wrapper .form-row.form-row-wide.validate-required.validate-email,
.woocommerce-billing-fields__field-wrapper .form-row {
    width: calc(50% - 10px);
    margin-bottom: 10px;
}

/* Ændr labeltekst for billing_address_2 */
.woocommerce-billing-fields__field-wrapper #billing_address_2_field label {
    visibility: hidden;
}

.woocommerce-billing-fields__field-wrapper #billing_address_2_field::before {
    content: "Lejlighed, værelse, o.l.";
    display: block;
    margin-bottom: 5px;
    visibility: visible;
}

/* Style telefon ved siden af hinanden uden mellemrum, og giv den 100% bredde */
.woocommerce-billing-fields__field-wrapper #billing_phone,
.woocommerce-billing-fields__field-wrapper #billing_email {
    width: 100% !important;
    margin-bottom: 10px !important;
}

/* Justér mellemrum mellem felter */
.woocommerce-additional-fields__field-wrapper {
    display: none !important;
}

col-2 {
    /* Tilføj din ønskede styling her */
    background-color: #f0f0f0; /* Eksempel på baggrundsfarve */
    padding: 10px; /* Eksempel på indre afstand */
    border: 1px solid #ddd; /* Eksempel på kant */
    box-sizing: border-box; /* Sikrer at padding og border er inkluderet i bredden */
    width: 100%; /* Sætter bredden til 100% af dens forælder */
}

@media only screen and (max-width: 600px) {
    .woocommerce-billing-fields__field-wrapper .form-row-first,
    .woocommerce-billing-fields__field-wrapper .form-row.address-field.validate-required.form-row-wide,
    .woocommerce-billing-fields__field-wrapper .form-row.form-row-wide.validate-required.validate-email,
    .woocommerce-billing-fields__field-wrapper .form-row {
        width: 100%;
    }
}
/* Standard stil for ordreoversigt (desktop) */
#order_review.woocommerce-checkout-review-order {
    max-width: 470px; /* Set a narrower maximum width for better centering */
    width: 100%; /* Ensure it uses the full width up to max-width */
    margin: 15px auto; /* Center the box horizontally */
    padding: 10px; /* Adjust padding to avoid content touching the edges */
    box-sizing: border-box; /* Ensure padding is included in the width calculation */
}

/* Ensure the shop table fits within the container */
#order_review .shop_table {
    width: 100%;
    table-layout: auto;
}

/* Mobile adjustments */
@media only screen and (max-width: 600px) {
    #order_review.woocommerce-checkout-review-order {
        width: calc(100% - 5px); /* Make it use more width but still account for padding */
        max-width: none; /* Remove max-width constraint on mobile */
        margin: 20px 5px 10px 0px; /* Adjust margin for top and sides on mobile */
        padding: 10px; /* Maintain padding for mobile */
        box-sizing: border-box; /* Ensure padding is included in the width calculation */
    }
    #order_review .shop_table {
        width: 100%;
        display: block;
        overflow-x: auto;
        padding: 0; /* Reset padding to avoid double padding */
    }

    #order_review .shop_table thead,
    #order_review .shop_table tbody,
    #order_review .shop_table th,
    #order_review .shop_table td,
    #order_review .shop_table tr {
        display: block;
    }

    #order_review .shop_table thead {
        float: left;
    }

    #order_review .shop_table tbody {
        width: auto;
        position: relative;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    #order_review .shop_table th,
    #order_review .shop_table td {
        width: 100%;
        box-sizing: border-box;
        padding-left: 10px; /* Add left padding to table cells */
        padding-right: 10px; /* Add right padding to table cells */
    }

    #order_review .shop_table tr {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    /* Hide subtotal on mobile */
    #order_review .shop_table tr.cart-subtotal {
        display: none;
    }
}