/**
 * /assets/styles/hfm.css
 */

/* Palette: HFM */
:root {

    /*  */
    --primary: #7CC100;
    --primary-dark: #459647;
    --primary-tone: #F5FFE3;

    /*  */
    --white: #FFFFFF;
    --black: #242424;
    --red: #E74C3C;
    --red-light: #FBE5E3;
    --yellow: #FBBC34;
    --yellow-dark: #E0B252;
    --yellow-light: #FAF2E2;

    /*  */
    --grey-trans: rgba(0, 0, 0, 0.15);
}

/* Woodmart: Fixes & Patch */
.single-product-page .summary-inner {
    margin-bottom: 0 !important;
}
body:has(div.single-product-page.product-type-subscription) div.wd-sticky-btn,
body:has(div.single-product-page.product-type-variable-subscription) div.wd-sticky-btn {
    display: none;
}
div.summary-inner div.wd-before-add-to-cart > div {
    margin: 0;
}

/* WordPress: Admin Toolbar */
div#wp-toolbar ul li#wp-admin-bar-xts_dashboard,
div#wp-toolbar ul li#wp-admin-bar-popup-maker,
div#wp-toolbar ul li#wp-admin-bar-gform-forms {
    display: none;
}

/* Woodmart: HFM Promo */
p.hfm-promo {
    padding: 15px;
    border-radius: 3px;
    font-size: 0.9rem;
    font-weight: 500;
    line-height: 1.6;
    background: #F5E5C5;
}
p.hfm-promo span.emp {
    text-decoration: underline;
    text-decoration-style: dashed;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

/* WooCommerce: Additional Message */
/* p#e_deliverydate_0_field:after {
	content: "Let op! Wanneer u kiest voor ziekenhuis of bedrijfsadres kunnen levertijden variëren, dit hangt af van de openingstijden en regels van deze organisaties. Bezorging op dezelfde dag kunnen wij alleen garanderen voor Nederlandse huisadressen (Waddeneilanden uitgesloten).";
    margin-top: 35px;
    padding: 15px;
    background: #F5E5C5;
    border-radius: 3px;
	color: #161616;
    font-size: 0.9rem;
    font-weight: 500;
    line-height: 1.6;
} */

/* WooCommerce: Fixes & Patches */
ul.woocommerce-error li {
    height: 40px;
}
.woocommerce-breadcrumb {
    font-size: 0.75rem;
}
.woocommerce-checkout h3#ship-to-different-address {
    display: none;
}
.woocommerce-checkout div.order-summary {
    padding-top: 82px !important;
}
.woocommerce-checkout p.form-row.form-row-last {
    margin-top: 0;
}
.woocommerce-checkout input[type="text"],
.woocommerce-checkout input[type="number"],
.woocommerce-checkout input[type="phone"],
.woocommerce-checkout input[type="tel"],
.woocommerce-checkout input[type="email"] {
    padding: 10px;
    color: var(--black);
    text-align: left;
}
.woocommerce-checkout.form-style-underlined label {
    margin-bottom: 0;
    font-size: 0.9rem;
}
.reset_variations {
    font-size: 0.75rem;
}

/* WooCommerce: Header Restyle */
.woocommerce-checkout ul#thwmsc-tabs {
    margin-top: -70px;
}
.woocommerce-cart header.whb-header,
.woocommerce-checkout header.whb-header {
    margin-bottom: 0;
}
.woocommerce-cart div.main-page-wrapper,
.woocommerce-checkout div.main-page-wrapper {
    margin-top: initial;
    padding-top: initial;
}
.woocommerce-cart div.main-page-wrapper {
    padding-top: 50px;
}
.woocommerce-cart div.main-page-wrapper div.page-title,
.woocommerce-checkout div.main-page-wrapper div.page-title {
    display: none;
}

/* WooCommerce: Additional Fields */
.woocommerce-checkout div.woocommerce-additional-fields {
    margin-top: 30px;
}
.woocommerce-checkout p#shipping_address_1_field,
.woocommerce-checkout p#billing_address_1_field {
    display: none !important;
}
.woocommerce-checkout p#additional_gratis_kaartje_field {
    padding: 15px;
    border: 1px solid var(--primary);
    border-radius: 3px;
    background: var(--primary-tone);
}
.woocommerce-checkout p#additional_gratis_kaartje_field textarea {
    background: var(--white);
    color: var(--black);
}
.woocommerce-checkout p#additional_gratis_kaartje_field label div,
.woocommerce-checkout p#order_comments_field label div {
    margin-bottom: 5px;
    color: var(--red) !important;
    font-size: 0.85rem;
}

/* WooCommerce: Subscription Products */
div.product-type-subscription div.wd-before-add-to-cart > div,
div.product-type-variable-subscription div.wd-before-add-to-cart > div {
    display: none;
}
div.product-type-subscription div.summary-inner table,
div.product-type-variable-subscription div.summary-inner table {
    margin-bottom: 0;
}
div.product-type-subscription div.summary-inner div.woocommerce-variation-price,
div.product-type-variable-subscription div.summary-inner div.woocommerce-variation-price {
    display: none;
}
div.single-product-page.product_cat-abonnementen div.summary-inner p.price {
    line-height: 1;
}
div.single-product-page.product_cat-abonnementen div.summary-inner span.subscription-price-prepend {
    display: block;
    margin-bottom: 5px;
    font-size: 1.8rem;
    font-weight: 600;
}
div.single-product-page.product_cat-abonnementen div.summary-inner span.amount,
div.single-product-page.product_cat-abonnementen div.summary-inner span.subscription-details {
    font-size: 1rem;
    font-weight: initial;
}

/* MyParcel: Checkout Style */
.woocommerce-checkout form.myparcel-delivery-options {
    margin-top: 25px;
}
.woocommerce-checkout form.myparcel-delivery-options h3 {
    margin-bottom: 10px;
}
.woocommerce-checkout form.myparcel-delivery-options > div > table {
    border-collapse: separate;
    border-spacing: 15px;
    border: 1px solid var(--grey-trans);
    border-radius: 3px;
    background: var(--white);
}
.woocommerce-checkout form.myparcel-delivery-options table tr:not(:first-of-type) {
    margin-top: 10px;
}
.woocommerce-checkout form.myparcel-delivery-options table.myparcel-delivery-options__table label[for="myparcel-delivery-options__carrier--postnl"] {
    float: right;
}
.woocommerce-checkout div.myparcel-delivery-options__modal:has(.myparcel-delivery-options__errors > ul > li) {
    border: 1px solid var(--red);
    border-radius: 3px;
    background: var(--red-light);
}

/* TMCP: General Elements */
div.tc-extra-product-options ul.tmcp-ul-wrap {
    margin: 0 !important;
}
div.tc-extra-product-options h2.tc-epo-label,
div.tc-extra-product-options h3.tc-epo-label,
div.tc-extra-product-options h4.tc-epo-label,
div.tc-extra-product-options h5.tc-epo-label {
    margin-bottom: 10px;
    font-size: 1rem;
}
div.tm-extra-product-options .tm_padding {
    padding: 0;
}
div.tm-epo-totals {
    padding: 0;
}
div.tm-epo-totals dl {
    margin: 0;
}
div.tm-epo-totals dl dt {
    display: block;
}
div.tm-epo-totals dl.tm-extra-product-options-totals dt.tm-options-totals,
div.tm-epo-totals dl.tm-extra-product-options-totals dd.tm-options-totals {
    display: none;
}
.tc-tooltip {
    color: var(--black);
}

/* TMCP: Custom Elements */
div.hfm-message {
    padding: 10px;
    margin: 0 0 10px;
    border: 1px solid var(--red);
    border-radius: 3px;
    background: var(--red-light);
    color: var(--red);
    font-size: 0.9rem;
    font-weight: 600;
    text-align: center;
    display: none;
}
div.hfm-message.active {
    display: block;
}

/* TMCP: Product Fields */
ul.tmcp-ul-wrap {
    gap: 10px;
}
ul.tmcp-ul-wrap li.tmcp-field-wrap {
    display: flex !important;
    align-items: center !important;
    height: 60px;
    padding: 0 !important;
    background: var(--white);
    border: 1px solid var(--grey-trans);
    border-radius: 3px;
}
ul.tmcp-ul-wrap li.tmcp-field-wrap:has(.tc-price-wrap) {
    justify-content: space-between !important;
}
ul.tmcp-ul-wrap li.tmcp-field-wrap.tc-active {
    background: var(--primary-tone);
    border-color: var(--primary);
}

/* TMCP: Labels and Fields */
ul.tmcp-ul-wrap li.tmcp-field-wrap span.tc-label {
    font-size: 0.9rem;
}
ul.tmcp-ul-wrap li.tmcp-field-wrap input[type="number"] {
    margin-right: 8px;
    padding: 0;
    background: var(--white);
    border: 1px solid var(--primary);
    color: var(--black);
}

/* TMCP: Priced Fields */
ul.tmcp-ul-wrap li.tmcp-field-wrap label.tm-epo-field-label {
    display: flex !important;
    align-items: center;
    height: 40px;
    padding: 0 20px 0 10px !important;
}

/* WooCommerce: Checkout "Bezorgmoment" Step */
.woocommerce-checkout div.hfm-checkout-message {
    margin-bottom: 35px;
}
.woocommerce-checkout div.hfm-checkout-message div.text {
    margin: 20px 0 10px 0;
    padding: 15px;
    background: #F5E5C5;
    border-radius: 3px;
    color: #161616;
    font-size: 0.9rem;
    font-weight: 500;
    line-height: 1.6;
}
.woocommerce-checkout div.hfm-checkout-message div.action {
    text-align: center;
}
.woocommerce-checkout div.hfm-checkout-message div.action a {
    cursor: pointer;
    transition: color 0.2s ease-out;
}
.woocommerce-checkout div.hfm-checkout-message div.action a:hover {
    color: #242424;
}
.woocommerce-checkout div.hfm-orddd-unavailable {
    margin-bottom: 20px;
}
.woocommerce-checkout div.hfm-orddd-unavailable h3 {
    margin-bottom: 10px;
    font-size: 1.2rem;
}
.woocommerce-checkout div.hfm-orddd-unavailable p.emphasis {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: auto 1fr;
    grid-column-gap: 10px;
    grid-row-gap: 0px;
    padding: 15px;
    border: 1px solid var(--primary);
    border-radius: 3px;
    background: var(--primary-tone);
    color: var(--black);
    font-size: 0.9rem;
}
.woocommerce-checkout div.hfm-orddd-unavailable p a {
    color: var(--primary-dark);
    text-decoration: underline dotted;
    text-underline-offset: 2px;
    transition: all 0.2s ease-out;
    cursor: pointer;
}
.woocommerce-checkout div.hfm-orddd-unavailable p a:hover,
.woocommerce-checkout div.hfm-orddd-unavailable p a:focus {
    color: var(--black);
}
.woocommerce-checkout div.hfm-orddd-unavailable select {
    margin: 10px 0 0 0;
    padding: 8px 12px;
    border: 1px solid var(--primary);
    background-color: var(--white);
    background-position: calc(100% - 10px) center;
    color: var(--black);
}
.woocommerce-checkout div.hfm-orddd-unavailable label.left { grid-area: 1 / 1 / 2 / 2; }
.woocommerce-checkout div.hfm-orddd-unavailable select.left { grid-area: 2 / 1 / 3 / 2; }
.woocommerce-checkout div.hfm-orddd-unavailable label.right { grid-area: 1 / 2 / 2 / 3; }
.woocommerce-checkout div.hfm-orddd-unavailable select.right { grid-area: 2 / 2 / 3 / 3; }


/* ??? */
#thwmsc-tab-panels .thwmsc-tab-content .select2-selection--single {
    padding: 0 5px !important;
    border: 2px solid rgba(129, 129, 129, .2) !important;
}
.form-style-underlined .select2-container--default .select2-selection .select2-selection__arrow {
    right: 5px !important;
}
p:is(.form-row-first,.form-row-last) {
    width: 100%;
}