/* Additions for WordPress/WooCommerce on top of the original site.css / shop.css */

/* Pages without slider: room for the fixed header */
body.standard main { padding-top: 150px; padding-bottom: 3rem; }
body.standard main.shopProductDetailPage { padding-top: 10%; padding-bottom: 5%; }
main.shopProductDetailPage { min-height: 60vh; }
body.hm-shop-page { background-color: #f1efeb; }
.hm-content > h1.hm-page-title { margin-bottom: 2rem; }
.hm-content h1, .hm-content h3 { margin-bottom: 1.5rem; }

/* Slider: smaller first headline (former inline style) */
.slider_topping { font-size: 80%; }
.tx-seslider .slick-slide { overflow: hidden; }

/* Shop list: one wine per row with a separator line */
.hm-shop-list .hm-shop-row + .hm-shop-row { border-top: 1px solid #ddd; }
.hm-shop-list .hm-shop-row { padding: 20px 0; }
.shopOutOfStockInfo { font-size: 14px; }
.shopAddToCartInput { max-width: 70px; -moz-appearance: textfield; }
.shopAddToCartInput::-webkit-outer-spin-button,
.shopAddToCartInput::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.shopProductDetailDescription { margin-top: 2rem; }
.hm-cart-count { margin-left: 4px; }

/* Contact form */
.hm-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.hm-form-title { margin-bottom: 1rem; }
.hm-contact-form .form-control { border-radius: 0; height: 50px; }
.hm-contact-form textarea.form-control { height: 100px; }

/* WooCommerce: cart, checkout, account in the look of the old shop */
.woocommerce-notices-wrapper:empty { display: none; }
.woocommerce-message, .woocommerce-info, .woocommerce-error, .woocommerce-notice {
	list-style: none; margin: 0 0 1.5rem; padding: 1rem 1.25rem; background: #fff; border-left: 4px solid #d1ab59;
}
.woocommerce-error { border-left-color: #dc3545; }
.woocommerce-message .button, .woocommerce-info .button { float: right; }
.woocommerce .button, .woocommerce button.button, .woocommerce a.button, .woocommerce input.button,
.woocommerce #respond input#submit, .woocommerce-page .button {
	display: inline-block; color: #fff; background-color: #d1ab59; border: 1px solid #d1ab59; border-radius: .25rem;
	padding: .375rem .75rem; font-size: 1rem; line-height: 1.5; cursor: pointer; font-family: 'Montserrat', helvetica;
}
.woocommerce .button:hover, .woocommerce button.button:hover, .woocommerce a.button:hover {
	color: #d1ab59; background-color: #fff; border-color: #d1ab59; text-decoration: none;
}
.woocommerce .button:disabled, .woocommerce button.button:disabled { opacity: .6; cursor: not-allowed; }
.woocommerce form .input-text, .woocommerce form select, .woocommerce-page form .input-text {
	display: block; width: 100%; padding: .375rem .75rem; font-size: 1rem; line-height: 1.5; color: #495057;
	background: #fff; border: 1px solid #ced4da; border-radius: .25rem;
}
.woocommerce form .form-row { margin-bottom: 1rem; }
.woocommerce form .form-row label { display: block; margin-bottom: .25rem; }
.woocommerce form .form-row .required { color: #dc3545; text-decoration: none; border: 0; }
.woocommerce form .form-row-first, .woocommerce form .form-row-last { width: 48%; float: left; }
.woocommerce form .form-row-last { float: right; }
.woocommerce form .form-row-wide { clear: both; }
.woocommerce .col2-set { display: flex; flex-wrap: wrap; margin: 0 -15px; }
.woocommerce .col2-set > div { flex: 1 1 50%; padding: 0 15px; }
.woocommerce .clear { clear: both; }
.woocommerce table.shop_table { width: 100%; background: #fff; margin-bottom: 1.5rem; border-collapse: collapse; }
.woocommerce table.shop_table th, .woocommerce table.shop_table td { padding: .75rem; border-top: 1px solid #dee2e6; vertical-align: middle; }
.woocommerce table.shop_table img { width: 50px; height: auto; }
.woocommerce .quantity .qty { width: 70px; text-align: center; padding: .375rem; border: 1px solid #ced4da; border-radius: .25rem; }
.woocommerce a.remove { font-size: 1.5rem; color: #dc3545 !important; text-decoration: none; }
.woocommerce .cart-collaterals .cart_totals { max-width: 480px; margin-left: auto; }
.woocommerce ul.woocommerce-shipping-methods, .woocommerce ul.wc_payment_methods { list-style: none; padding: 0; margin: 0; }
.woocommerce #payment { background: #fff; padding: 1rem; }
.woocommerce #payment .payment_box { background: #f8f9fa; padding: 1rem; margin: .5rem 0 1rem; }
.woocommerce-checkout #order_review_heading, .woocommerce h2, .woocommerce h3 {
	font-family: 'Montserrat', helvetica; font-style: normal; letter-spacing: 0; text-transform: uppercase; font-size: 1.5rem;
}
.woocommerce-MyAccount-navigation ul { list-style: none; padding: 0; }
.woocommerce-MyAccount-navigation li a { display: block; padding: .5rem 0; color: #000; }
.woocommerce-MyAccount-navigation li.is-active a { color: #d1ab59; }
@media (min-width: 768px) {
	.woocommerce-account .woocommerce { display: flex; gap: 30px; }
	.woocommerce-MyAccount-navigation { flex: 0 0 220px; }
	.woocommerce-MyAccount-content { flex: 1; }
}
@media (max-width: 767px) {
	.woocommerce form .form-row-first, .woocommerce form .form-row-last { width: 100%; float: none; }
	.woocommerce .col2-set > div { flex-basis: 100%; }
	body.standard main { padding-top: 100px; }
}
.screen-reader-text { position: absolute !important; clip: rect(1px,1px,1px,1px); width: 1px; height: 1px; overflow: hidden; }

/* Content blocks (block editor) in the look of the old content elements */
.has-text-align-center { text-align: center; }
.hm-content .wp-block-columns { display: flex; flex-wrap: wrap; gap: 30px; margin-bottom: 1.5rem; }
.hm-content .wp-block-column { flex: 1 1 0; min-width: 0; }
@media (max-width: 767px) { .hm-content .wp-block-column { flex-basis: 100%; } }
.hm-content h2.hm-kicker { font-size: 1.5rem; letter-spacing: 4px; font-style: italic; font-family: 'Montserrat', helvetica; margin-bottom: 1rem; }
.hm-content table { border: 0; margin-bottom: 0; }
.hm-content table td { border: 0; padding: 0 5px; }
.hm-content .wp-block-table td, .hm-content .wp-block-table th { border: 0; }
.hm-content .wp-block-heading > p { margin: 0; }

/* WooCommerce's .col-1/.col-2 collide with Bootstrap's grid classes */
.woocommerce .col2-set > .col-1, .woocommerce .col2-set > .col-2,
.woocommerce .u-columns > .col-1, .woocommerce .u-columns > .col-2 {
	flex: 1 1 50%; max-width: 50%; position: static; padding: 0 15px;
}
.woocommerce .u-columns { display: flex; flex-wrap: wrap; margin: 0 -15px; }
@media (max-width: 767px) {
	.woocommerce .col2-set > .col-1, .woocommerce .col2-set > .col-2,
	.woocommerce .u-columns > .col-1, .woocommerce .u-columns > .col-2 { flex-basis: 100%; max-width: 100%; }
}
.woocommerce-form-login, .woocommerce-form-register { background: transparent; }
.woocommerce-account h2 { margin-top: 1rem; }

/* Checkout fine-tuning */
.woocommerce form .form-row .woocommerce-input-wrapper { display: block; width: 100%; }
.woocommerce form .form-row select, .woocommerce form .form-row textarea { width: 100%; }
.woocommerce form .form-row textarea { min-height: 100px; }
.woocommerce form .form-row label.checkbox, .woocommerce form .form-row .woocommerce-form__label-for-checkbox { display: inline; }
.woocommerce button.button.alt, .woocommerce a.button.alt, .woocommerce #place_order,
.woocommerce a.checkout-button {
	background-color: #d1ab59 !important; border-color: #d1ab59 !important; color: #fff !important; font-weight: 600;
	padding: .6rem 1.25rem; font-size: 1.1rem;
}
.woocommerce button.button.alt:hover, .woocommerce #place_order:hover, .woocommerce a.checkout-button:hover {
	background-color: #fff !important; color: #d1ab59 !important;
}
.woocommerce #payment div.payment_box { background-color: #f1efeb; color: #000; }
.woocommerce #payment div.payment_box::before { border-bottom-color: #f1efeb; }
.woocommerce-info, .woocommerce-message { border-top: 0; }
.woocommerce-info::before, .woocommerce-message::before { display: none; }
.hm-consents { margin: 1rem 0; }
.hm-consents .form-row { margin-bottom: .5rem; }
.hm-step-hint { color: #dc3545; }

/* Slider image always fills the slide (the old site served a taller crop on phones) */
.tx-seslider .slick-slide picture, .tx-seslider .slick-slide img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }

/* Notices: no WooCommerce icon overlapping the text */
.woocommerce-error::before { display: none; }
.woocommerce-error { border-top: 0; padding-left: 1.25rem; }
.woocommerce-error li { list-style: none; }

/* Free shipping: make the benefit visible */
.hm-free-hint { background: #fff; border: 2px solid #d1ab59; color: #000; padding: .75rem 1rem; margin: 0 0 1.25rem; font-size: 1.05rem; }
.hm-free-hint .fa-truck { color: #d1ab59; margin-right: .4rem; }
.hm-free-hint--done { background: #d1ab59; color: #fff; }
.hm-free-hint--done .fa-truck { color: #fff; }
.shopCartModal .hm-free-hint { font-size: .95rem; margin: .5rem 0 1rem; }
.hm-free-label { display: inline-block; background: #d1ab59; color: #fff; font-weight: 600; padding: 0 .5rem; border-radius: .2rem; }
.hm-free-product { margin: .25rem 0 .5rem; font-weight: 600; color: #000; }
.hm-free-product .fa-truck { color: #d1ab59; margin-right: .3rem; }

/* "Ausgetrunken": greyed bottle with a stamp, calm hint instead of the cart button */
.hm-soldout { position: relative; }
.hm-soldout img { filter: grayscale(.6); opacity: .55; }
.hm-soldout-stamp {
	position: absolute; z-index: 2; top: 38%; left: 50%; transform: translate(-50%, -50%) rotate(-12deg);
	font-family: 'Merriweather', serif; font-style: italic; font-weight: 700; text-transform: uppercase; letter-spacing: 3px;
	font-size: 1.35rem; color: #727845; background: rgba(255,255,255,.85); border: 3px double #727845;
	padding: .35rem 1rem; white-space: nowrap; pointer-events: none;
}
.hm-soldout-info { font-size: 14px; color: #555; }
.hm-soldout-label {
	display: inline-block; margin-right: .4rem; padding: 0 .5rem; background: #727845; color: #fff;
	font-family: 'Merriweather', serif; font-style: italic; text-transform: uppercase; letter-spacing: 2px; font-size: 12px;
}
@media (max-width: 575px) { .hm-soldout-stamp { font-size: 1rem; letter-spacing: 2px; } }

/* Checkout: no "Zusätzliche Informationen" heading; shipping toggle on its own line */
.woocommerce-additional-fields > h3 { display: none; }
.woocommerce-shipping-fields, .woocommerce-additional-fields { clear: both; width: 100%; }
#ship-to-different-address { font-size: 1.25rem; margin-bottom: 1rem; }
#ship-to-different-address label { display: flex; align-items: center; gap: .5rem; margin: 0; cursor: pointer; }
@media (max-width: 991px) {
	.woocommerce .col2-set > .col-1, .woocommerce .col2-set > .col-2 { flex-basis: 100%; max-width: 100%; }
}
.woocommerce form .form-row label { white-space: normal; overflow-wrap: anywhere; }

/* Page after the order (former Orderhandling page) */
.hm-thankyou { margin-top: 1rem; }
.hm-thankyou .orderHandlingHeadline { font-family: 'Montserrat', helvetica; font-style: normal; text-transform: none; letter-spacing: 0; margin: 1rem 0; }
.hm-thankyou .shopCheckoutCartCol { padding-bottom: 1rem; }
.hm-thankyou .btn { margin-right: .5rem; }

/* Form fields exactly like the old Bootstrap fields (WooCommerce's own styles are stronger, hence the selectors) */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-page form .form-row input.input-text,
.woocommerce-page form .form-row textarea,
.woocommerce-page form .form-row select {
	border: 1px solid #ced4da; border-radius: 4px; background-color: #fff; color: #495057;
	font-size: 16px; line-height: 1.5; padding: 6px 12px; min-height: 38px; box-shadow: none;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus {
	border-color: #e8d5ac; outline: 0; box-shadow: 0 0 0 .2rem rgba(209, 171, 89, .25);
}
.woocommerce form .form-row label { line-height: 1.5; margin-bottom: .5rem; }
.woocommerce form .form-row { padding: 0; margin: 0 0 1rem; }

/* Password field with the grey eye button attached on the right */
.woocommerce .password-input, .woocommerce-page .password-input { display: flex; width: 100%; position: relative; }
.woocommerce .password-input input.input-text { flex: 1 1 auto; border-top-right-radius: 0 !important; border-bottom-right-radius: 0 !important; }
.woocommerce .password-input .show-password-input,
.woocommerce-page .password-input .show-password-input {
	position: static; top: auto; right: auto; transform: none; display: flex; align-items: center; justify-content: center;
	flex: 0 0 44px; min-height: 38px; margin: 0; padding: 6px 12px; cursor: pointer;
	background: #6c757d; border: 1px solid #6c757d; border-radius: 0 4px 4px 0; color: #fff; box-shadow: none;
}
.woocommerce .password-input .show-password-input::before,
.woocommerce .password-input .show-password-input::after { content: none; }
.woocommerce .password-input .show-password-input { background-image: none; font-size: 0; }
.woocommerce .password-input .show-password-input::after {
	content: "\f06e"; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: 16px; color: #fff; display: inline-block;
}
.woocommerce .password-input .show-password-input.display-password::after { content: "\f070"; }
.woocommerce .password-input .show-password-input:hover { background: #5a6268; border-color: #545b62; }

/* "Mein Konto" login/registration without the boxed frames (as in the old account page) */
.woocommerce form.login, .woocommerce form.register { border: 0; padding: 0; margin: 0 0 2rem; border-radius: 0; }
.woocommerce-account .u-columns h2 { font-size: 1.75rem; margin-bottom: 1rem; }
.woocommerce form .woocommerce-form-login__rememberme { display: block; margin: .25rem 0 1rem; }
.woocommerce form.register .form-row label.woocommerce-form__label-for-checkbox { display: block; line-height: 1.5; }
.woocommerce form.login .form-row label.woocommerce-form-login__rememberme { display: block !important; margin: 0 0 1rem; }

/* Footer quicklinks: e-mail and Instagram icons in the same gold, aligned */
.footer .f-quicklinks li + li { margin-top: .5rem; }
.footer .f-quicklinks i { color: #d1ab59; width: 21px; text-align: center; }
.footer .f-quicklinks .fa-instagram { font-size: 1.1em; }

/* Buttons on their own line (WooCommerce floats them) */
.woocommerce form.login .woocommerce-form-login__submit,
.woocommerce form.login .form-row .button { float: none; display: block; margin: 0 0 1rem; }
.woocommerce form.login .form-row label.woocommerce-form-login__rememberme { float: none; }
.woocommerce #payment #place_order, .woocommerce-page #payment #place_order { float: none; display: block; margin-top: 1.25rem; }
.woocommerce #payment .place-order { display: block; }
.woocommerce form.login .form-row:has(.woocommerce-form-login__submit) { display: flex; flex-wrap: wrap; align-items: flex-start; }
.woocommerce form.login .form-row label.woocommerce-form-login__rememberme { flex: 0 0 100%; width: 100%; }
