/* ==========================================================================
   WooCommerce front-end overrides -- Highland Cigar Co.

   Restyles WooCommerce's default markup (My Account login/dashboard, Cart,
   Checkout) to match the template's own design language instead of
   WooCommerce's stock look. Same idea/structure as forminator-custom.css:
   WooCommerce's own class names are kept (so its JS/other plugins keep
   working), colors/spacing/fonts are pulled from this theme's own custom.css.

   Loaded only on WooCommerce pages -- see hc_enqueue_assets() in functions.php.
   ========================================================================== */

/* Accessible-but-hidden labels on the login/register forms (the visible
   placeholder text carries the label for sighted users, same pattern the
   rest of this template uses on its own forms). */
.screen-reader-text {
	position: absolute !important;
	clip: rect(1px, 1px, 1px, 1px);
	width: 1px;
	height: 1px;
	overflow: hidden;
	white-space: nowrap;
}

/* -------------------------------------------------------------------------
   0) My Account content section -- spacing under the hero.
   Cart/Checkout sit on the theme's normal light section, so the standard
   .section top padding (100px, see template-style.css) reads fine there --
   it's a visible break between the dark hero and a lighter block below it.
   My Account's content section is the one page that's dark-on-dark (see
   wc-page-wrapper.php), so that same 100px of empty black space between the
   hero's diagonal edge and the first heading looked like a broken gap
   instead of intentional spacing. Tightened here for this page only;
   left as-is for every other section that uses .dark-section.
   ------------------------------------------------------------------------- */
.woocommerce-content-section.dark-section {
	padding-top: 40px;
}
@media (max-width: 991px) {
	.woocommerce-content-section.dark-section {
		padding-top: 24px;
	}
}

/* -------------------------------------------------------------------------
   1) My Account -- Login / Register (woocommerce/myaccount/form-login.php)
   Same dark dashed-box field treatment as the Reservation page's form,
   since this form now lives on the same dark section background.
   ------------------------------------------------------------------------- */
.hc-login-wrap {
	display: flex;
	flex-wrap: wrap;
	gap: 40px;
	justify-content: center;
	padding: 20px 0;
}
.hc-login-box {
	flex: 0 1 420px;
	max-width: 420px;
}
.hc-login-wrap.has-register .hc-login-box {
	flex-basis: 380px;
}

.hc-login-box .form {
	margin-top: 10px;
}
.hc-login-box .form-group {
	position: relative;
	margin: 0 0 15px;
	padding: 0;
	display: block;
	background: rgba(0, 0, 0, .25);
	border: 1px dashed rgba(255, 255, 255, .5);
	transition: all .3s ease-in-out;
}
.hc-login-box .form-group:hover,
.hc-login-box .form-group:focus-within {
	background: rgba(0, 0, 0, .5);
	border-color: #f6a80f;
}
.hc-login-box .form-control {
	font-size: 16px;
	margin: 0;
	outline: none;
	width: 100%;
	padding: 15px;
	color: #fff;
	height: auto;
	line-height: 20px;
	background: none;
	border: none;
	box-shadow: none;
	border-radius: 0;
}
.hc-login-box .form-control::placeholder {
	color: #fff;
	opacity: .8;
}
.hc-login-box .form-control:hover,
.hc-login-box .form-control:focus {
	background: none !important;
	border: none;
	box-shadow: none;
	color: #fff;
}
.hc-login-box .woocommerce-form-login__rememberme {
	color: rgba(255, 255, 255, .66);
	font-size: 14px;
	margin: 0 0 15px;
}
.hc-login-box .login-box {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 15px;
}
.hc-login-box .login-box p.woocommerce-form-login__rememberme {
	flex: 1 0 100%;
	margin-bottom: 8px;
}
.hc-login-box .forgot,
.hc-login-box a.forgot {
	color: rgba(255, 255, 255, .66);
	text-decoration: underline;
}
.hc-login-box .forgot:hover {
	color: #f6a80f;
}
.hc-login-box .btn-sys {
	margin: 0;
	border: none;
}
.hc-login-box p {
	color: rgba(255, 255, 255, .66);
	margin-bottom: 15px;
}

/* -------------------------------------------------------------------------
   2) My Account nav (woocommerce/myaccount/navigation.php -- not overridden,
   still WooCommerce's own template, just restyled to match the template's
   pill-tab look used elsewhere).
   ------------------------------------------------------------------------- */
.woocommerce-error li {
	color: #a41e22 !important;
}

.woocommerce form.checkout_coupon, .woocommerce form.login, .woocommerce form.register {
    border: 1px dashed var(--wc-separator-color, 
color-mix(in srgb, currentColor 20%, transparent));
    padding: 20px;
    margin: 2em 0;
    text-align: left;
    border-radius: 0;
}
input#username:hover, input#password:hover {
	background: none !important;
	
}
.form:hover .form-group .form-control{background:none !important;}

.woocommerce-MyAccount-navigation {
	margin-bottom: 30px;
}
.woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: center;
}
.woocommerce-MyAccount-navigation ul li {
	margin: 0;
}
.woocommerce-MyAccount-navigation ul li a {
	display: block;
	font-size: 14px;
	line-height: 20px;
	letter-spacing: .5px;
	text-transform: uppercase;
	font-weight: 400;
	padding: 10px 22px;
	color: #fff;
	background: #a41e22;
	border-radius: 0px;
	transition: background .2s ease-in-out;
}
.woocommerce-MyAccount-navigation ul li a:hover {
	background: #f6a80f;
	color: #fff;
}
.woocommerce-MyAccount-navigation ul li.is-active a {
	background: #f6a80f;
}
.dark-section .woocommerce-MyAccount-navigation ul li a {
	background: rgba(255, 255, 255, .1);
	border: 1px dashed #f6a80f;
}
.dark-section .woocommerce-MyAccount-navigation ul li.is-active a,
.dark-section .woocommerce-MyAccount-navigation ul li a:hover {
	background: #f6a80f;
	border-color: #f6a80f;
	color: #000;
}

.woocommerce {
    display: flex;
    flex-direction: column;
	justify-content: center;
	align-items: center;
}

.woocommerce-account .woocommerce-MyAccount-navigation {
    float: none;
    width: 100%;

}

li.woocommerce-MyAccount-navigation-link.woocommerce-MyAccount-navigation-link--downloads, li.woocommerce-MyAccount-navigation-link.woocommerce-MyAccount-navigation-link--wps_memberships, li.woocommerce-MyAccount-navigation-link.woocommerce-MyAccount-navigation-link--orders {
    display: none;
}
.woocommerce-account .woocommerce-MyAccount-content
 {
    float: none;
    width: 100%;
	max-width: 1200px !important;
}
.member-dashboard {
    max-width: 1200px !important;
    margin: 0 auto;
    padding: 60px 20px;
}

.woocommerce table.shop_table, .wps_sfw_account_additional_wrap, .wps_sfw_details_wrap table.shop_table th
 {
     border: 1px dashed #f6a80f !important;
		border-radius: 0px !important;
    
}
.wps_sfw_account_wrap table th {
	     border-bottom: 1px dashed #f6a80f !important;
}
.wps_sfw_details_wrap table.shop_table th, .wps_sfw_details_wrap table.shop_table td, .wps_sfw_account_wrap table thead th, .wps_sfw_account_wrap table tbody td, .wps_sfw_account_additional_wrap table td:first-of-type {
	color: #fff;
}

.wps_sfw_details_wrap h3 {
    
    background: transparent;
    border-radius: 0px;
    border: none;
    cursor: default;
}
.wps_sfw_details_wrap table.shop_table tr:nth-of-type(even), .wps_sfw_account_wrap table tbody tr:nth-of-type(even)
 {
    background: transparent;
}

/* -------------------------------------------------------------------------
   3) Member dashboard status badge colors (see custom.css for the base
.member-dashboard/.member-header/.status rules) -- "Active Member" already
   defaults to green there, these cover every other real subscription status.
   ------------------------------------------------------------------------- */
.status-on-hold,
.status-paused,
.status-pending { background: #f6a80f; color: #000; }
.status-cancelled,
.status-pending-cancel,
.status-expired,
.status-none,
.status-switched { background: #a41e22; color: #fff; }
.mt20 { margin-top: 20px; }

/* -------------------------------------------------------------------------
   4) Cart / Checkout -- WooCommerce's default tables/forms, restyled to sit
   on this theme's light section (same context as the Contact page's form).
   ------------------------------------------------------------------------- */
.woocommerce-content-section table.shop_table,
.woocommerce-content-section table.woocommerce-checkout-review-order-table,
.woocommerce-content-section table.woocommerce-orders-table,
.woocommerce-content-section table.shop_table_responsive {
	width: 100%;
	border-collapse: collapse;
	margin: 0 0 30px;
}

.woocommerce-content-section table.woocommerce-checkout-review-order-table th,
.woocommerce-content-section table.woocommerce-checkout-review-order-table td {
	padding: 15px;
	border-bottom: 1px dashed #f6a80f !important;
	text-align: left;
}
.woocommerce-content-section table.shop_table th,
.woocommerce-content-section table.shop_table td {
	border-bottom: 0px !important
}
thead {
	border-bottom: 1px dashed #f6a80f70 !important;
}
.woocommerce-content-section table.shop_table {
	border: 0px dashed #f6a80f !important
}
.woocommerce-content-section table.shop_table thead th {
	text-transform: uppercase;
	letter-spacing: 1px;
	font-size: 13px;
	color: #fff;
}
.woocommerce-content-section .shop_table tfoot th,
.woocommerce-content-section .shop_table tfoot td {
	font-weight: 600;
}

.woocommerce-content-section form .form-row label,
.woocommerce-content-section .woocommerce-billing-fields label,
.woocommerce-content-section .woocommerce-shipping-fields label,
.woocommerce-content-section .woocommerce-account-fields label {
	display: block;
	font-weight: 400;
	color: #f6a80f;
	font-size: 14px;
	text-transform: normal;
	letter-spacing: 1px;
	margin-bottom: 6px;
}
.woocommerce form .form-row .input-text, .woocommerce form .form-row select {
	background: linear-gradient(to top,#fff 0%,#fef6e7 100%);
    border: 1px dashed rgba(255, 255, 255, .50);
	border-radius: 0 !important
}
.woocommerce-content-section input.input-text:hover, .woocommerce-content-section input.input-text:focus, .woocommerce-content-section textarea:hover, .woocommerce-content-section textarea:focus, .woocommerce-content-section select:hover, .woocommerce-content-section select:focus {
/*     background: #fff; */
    border-color: #f6a80f !important;
    outline: none;
}
legend {
	font-family: 'Trajan Pro';
	color: #fff !important;
}
.woocommerce-content-section form .form-row .woocommerce-input-wrapper {
	display: block;
}
.woocommerce-content-section input.input-text,
.woocommerce-content-section textarea,
.woocommerce-content-section select,
.woocommerce-content-section .select2-container .select2-selection {
	width: 100%;
	padding: 15px;
	font-size: 15px;
	color: #000;
	background: rgba(255, 255, 255, .5);
	border: 1px dashed #f6a80f;
	border-radius: 0;
	box-shadow: none;
	transition: all .3s ease-in-out;
}
.woocommerce-content-section input.input-text:hover,
.woocommerce-content-section input.input-text:focus,
.woocommerce-content-section textarea:hover,
.woocommerce-content-section textarea:focus,
.woocommerce-content-section select:hover,
.woocommerce-content-section select:focus {
	background: #fff;
	border-color: #a41e22;
	outline: none;
}
.wps_recurring_bifurcation_wrapper {
	display: none !important;
}

/* WooCommerce/WooCommerce Subscriptions buttons that aren't already .btn-sys
   (Place order, Update cart, Apply coupon, Change payment method, Cancel
   subscription, Save address, etc.) */
.woocommerce-content-section a.button,
.woocommerce-content-section button.button,
.woocommerce-content-section input.button,
.woocommerce-content-section #place_order {
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-size: 15px;
	padding: 15px 40px;
	margin: 10px 0 0;
	color: #fff;
	background: #a41e22;
	border: none;
	border-radius: 0;
	cursor: pointer;
	transition: background .2s ease-in-out;
}
.woocommerce-content-section a.button:hover,
.woocommerce-content-section button.button:hover,
.woocommerce-content-section input.button:hover,
.woocommerce-content-section #place_order:hover {
	background: #f6a80f;
	color: #fff;
}
.woocommerce-content-section a.button.alt,
.woocommerce-content-section #place_order {
	background: #a41e22;
}

/* -------------------------------------------------------------------------
   5) Notices (login errors, "order received", coupon messages, etc.)
   ------------------------------------------------------------------------- */
.woocommerce-message,
.woocommerce-error,
.woocommerce-info,
.woocommerce-noreviews {
	list-style: none;
	margin: 0 0 25px;
	padding: 15px 20px;
	font-size: 15px;
	border-left: 3px solid #a41e22;
	background: rgba(164, 30, 34, .08);
}
.woocommerce-message {
	border-left-color: #f6a80f;
	background: rgba(246, 168, 15, .12);
}
.woocommerce-info {
	border-left-color: #333;
	background: rgba(0, 0, 0, .05);
}
.dark-section .woocommerce-message,
.dark-section .woocommerce-error,
.dark-section .woocommerce-info {
	color: #fff;
	background: rgba(255, 255, 255, .08);
}
.woocommerce-message a,
.woocommerce-error a,
.woocommerce-info a {
	color: #a41e22;
	text-decoration: underline;
}
.woocommerce-message::before,
.woocommerce-error::before,
.woocommerce-info::before {
	content: none;
}

.wp-block-woocommerce-checkout-order-summary-block, .wc-block-components-express-payment--checkout .wc-block-components-express-payment__content, .wc-block-components-address-card, .wc-block-components-radio-control--highlight-checked .wc-block-components-radio-control-accordion-option--checked-option-highlighted, .wc-block-components-radio-control--highlight-checked label.wc-block-components-radio-control__option--checked-option-highlighted, .wc-block-components-radio-control--highlight-checked, .wc-block-components-radio-control--highlight-checked div.wc-block-components-radio-control-accordion-option {
	    border: 1px dashed #f6a80f !important;
		border-radius: 0px !important;
	box-shadow: none !important;
}
.wp-block-woocommerce-checkout-order-summary-totals-block .wc-block-components-totals-wrapper {
	border: 0 !important; 
}
.wc-block-components-totals-wrapper, .wp-block-woocommerce-checkout-order-summary-totals-block {
	border-top: 1px dashed #f6a80f !important;
}

.wc-block-components-express-payment--checkout .wc-block-components-express-payment__content {
	border-top: 0 !important;
}
.wc-block-components-express-payment--checkout .wc-block-components-express-payment__title-container:before, .wc-block-components-express-payment--checkout .wc-block-components-express-payment__title-container:after {
	border-radius: 0px !important;
    border-top: 1px dashed !important;
    border-color: #f6a80f !important;
}

.wc-block-components-form .wc-block-components-text-input input[type=email], .wc-block-components-form .wc-block-components-text-input input[type=number], .wc-block-components-form .wc-block-components-text-input input[type=password], .wc-block-components-form .wc-block-components-text-input input[type=tel], .wc-block-components-form .wc-block-components-text-input input[type=text], .wc-block-components-form .wc-block-components-text-input input[type=url], .wc-block-components-text-input input[type=email], .wc-block-components-text-input input[type=number], .wc-block-components-text-input input[type=password], .wc-block-components-text-input input[type=tel], .wc-block-components-text-input input[type=text], .wc-block-components-text-input input[type=url] {
	border: 1px dashed #f6a80f !important;
		border-radius: 0px !important;
}
.wc-block-components-form .wc-block-components-text-input input[type=email]:focus, .wc-block-components-form .wc-block-components-text-input input[type=number]:focus, .wc-block-components-form .wc-block-components-text-input input[type=password]:focus, .wc-block-components-form .wc-block-components-text-input input[type=tel]:focus, .wc-block-components-form .wc-block-components-text-input input[type=text]:focus, .wc-block-components-form .wc-block-components-text-input input[type=url]:focus, .wc-block-components-text-input input[type=email]:focus, .wc-block-components-text-input input[type=number]:focus, .wc-block-components-text-input input[type=password]:focus, .wc-block-components-text-input input[type=tel]:focus, .wc-block-components-text-input input[type=text]:focus, .wc-block-components-text-input input[type=url]:focus {
	border: 1px dashed #a41e22 !important;
		border-radius: 0px !important;
}
.wc-block-components-radio-control--highlight-checked:after {
	display: none !important;
}
@media (max-width: 767px) {
	.hc-login-wrap {
		flex-direction: column;
		align-items: center;
	}
}

/* -------------------------------------------------------------------------
   6) Checkout -- "Additional order information" intro note (birth month/day
   fields, inc/membership-birthday.php). WooCommerce's block-checkout
   Additional Checkout Fields API has no "section description" option to
   attach explanatory text to, so this is added as generated content on the
   step heading instead of a 3rd fake field -- to change the wording, edit
   the `content` string below (and keep the escaped `\2019` for the
   apostrophe in "we'll").
   ------------------------------------------------------------------------- */
#order-fields .wc-block-components-checkout-step__heading-container::after {
	content: "*Share your birthday and we\2019ll have your complimentary birthday cigar and drink ready for you (optional)";
	display: block;
	margin: 8px 0 20px;
	font-size: 13px;
	color: #a41e22;
}
.wc-blocks-components-select .wc-blocks-components-select__label {
	display: none !important;
}
.wc-blocks-components-select .wc-blocks-components-select__select {
	padding: 9px 16px !important;
}