/**
 * Request a Quote - Stylesheet
 * Uses theme's global accent color: var(--wd-primary-color)
 */

/* ==========================================================================
   1. HIDE ALL CART & PURCHASING ARTIFACTS
   ========================================================================== */
.wd-header-cart,
.cart-widget-opener,
.cart-widget-side,
.widget_shopping_cart,
.woocommerce-mini-cart,
.single_add_to_cart_button,
.wd-buy-now-btn,
.wd-sticky-btn,
.quantity:not(.tappit-allow-qty),
form.cart .quantity,
.woocommerce-variation-add-to-cart .quantity,
.added_to_cart {
	display: none !important;
}

/* ==========================================================================
   2. SINGLE PRODUCT "REQUEST A QUOTE" BUTTON
   ========================================================================== */
.tappit-single-quote-wrapper {
	margin: 20px 0 25px 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
}

.tappit-single-quote-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 0 32px;
	min-height: 48px;
	font-size: 14px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.8px;
	color: #ffffff !important;
	background-color: var(--wd-primary-color, #c3935b) !important;
	border: 2px solid var(--wd-primary-color, #c3935b) !important;
	border-radius: var(--btn-accented-brd-radius, 4px);
	cursor: pointer;
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
	transition: all 0.25s ease;
	text-decoration: none !important;
}

.tappit-single-quote-btn:hover {
	background-color: #111111 !important;
	border-color: #111111 !important;
	color: #ffffff !important;
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
	transform: translateY(-2px);
}

.tappit-single-quote-btn:active {
	transform: translateY(0);
}

.tappit-single-quote-btn svg {
	width: 18px;
	height: 18px;
	fill: currentColor;
	flex-shrink: 0;
}

/* Secondary helper notice under single quote button */
.tappit-quote-hint {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	color: #777777;
	margin-top: 8px;
	width: 100%;
}

.tappit-quote-hint svg {
	width: 14px;
	height: 14px;
	fill: var(--wd-primary-color, #c3935b);
}

/* ==========================================================================
   3. PRODUCT CARD (LOOP) "REQUEST A QUOTE" BUTTON
   ========================================================================== */
/* Standard / replacement loop button */
.tappit-loop-quote-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	cursor: pointer;
	text-decoration: none !important;
	transition: all 0.2s ease;
}

/* Icon hover design (matching Woodmart action buttons) */
.wd-action-btn.wd-add-cart-icon a.tappit-loop-quote-btn,
.wd-buttons .wd-add-btn a.tappit-loop-quote-btn {
	background-color: #ffffff;
	color: #333333;
}

.wd-action-btn.wd-add-cart-icon a.tappit-loop-quote-btn:hover,
.wd-buttons .wd-add-btn a.tappit-loop-quote-btn:hover {
	background-color: var(--wd-primary-color, #c3935b);
	color: #ffffff;
}

.tappit-loop-quote-btn svg {
	width: 17px;
	height: 17px;
	fill: currentColor;
	display: inline-block;
	vertical-align: middle;
}

/* Full-width / standard card buttons */
.wd-hover-fw-button .tappit-loop-quote-btn,
.wd-hover-standard .tappit-loop-quote-btn,
.wd-hover-button .tappit-loop-quote-btn {
	background-color: var(--wd-primary-color, #c3935b);
	color: #ffffff !important;
	border-radius: var(--btn-accented-brd-radius, 4px);
	padding: 10px 18px;
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
}

.wd-hover-fw-button .tappit-loop-quote-btn:hover,
.wd-hover-standard .tappit-loop-quote-btn:hover,
.wd-hover-button .tappit-loop-quote-btn:hover {
	background-color: #111111;
	color: #ffffff !important;
}

/* ==========================================================================
   4. POPUP MODAL STYLES
   ========================================================================== */
.tappit-quote-modal-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 999999;
	background-color: rgba(15, 18, 24, 0.65);
	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.3s ease;
}

.tappit-quote-modal-overlay.tappit-active {
	opacity: 1;
	visibility: visible;
}

.tappit-quote-modal {
	position: relative;
	width: 100%;
	max-width: 540px;
	max-height: 90vh;
	background: #ffffff;
	border-radius: 12px;
	box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.35);
	overflow-y: auto;
	transform: translateY(20px) scale(0.96);
	transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s ease;
	font-family: inherit;
}

.tappit-quote-modal-overlay.tappit-active .tappit-quote-modal {
	transform: translateY(0) scale(1);
}

/* Modal Header */
.tappit-modal-header {
	padding: 24px 28px 18px 28px;
	border-bottom: 1px solid #f0f0f0;
	position: relative;
	background: linear-gradient(180deg, #fafafa 0%, #ffffff 100%);
	border-radius: 12px 12px 0 0;
}

.tappit-modal-title-row {
	display: flex;
	align-items: center;
	gap: 10px;
}

.tappit-modal-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 8px;
	background-color: rgba(195, 147, 91, 0.12);
	color: var(--wd-primary-color, #c3935b);
	flex-shrink: 0;
}

.tappit-modal-icon svg {
	width: 22px;
	height: 22px;
	fill: currentColor;
}

.tappit-modal-title {
	margin: 0;
	font-size: 20px;
	font-weight: 700;
	color: #1a1a1a;
	line-height: 1.3;
}

.tappit-modal-subtitle {
	margin: 6px 0 0 0;
	font-size: 13px;
	color: #666666;
	line-height: 1.5;
}

.tappit-modal-close {
	position: absolute;
	top: 20px;
	right: 20px;
	width: 34px;
	height: 34px;
	border: none;
	background: #f4f4f4;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #555555;
	cursor: pointer;
	transition: all 0.2s ease;
	padding: 0;
}

.tappit-modal-close:hover {
	background: #e2e2e2;
	color: #111111;
	transform: rotate(90deg);
}

.tappit-modal-close svg {
	width: 14px;
	height: 14px;
	stroke: currentColor;
	stroke-width: 2.5;
}

/* Modal Body */
.tappit-modal-body {
	padding: 24px 28px 28px 28px;
}

/* Product Info Box inside Modal */
.tappit-product-box {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 12px 16px;
	margin-bottom: 22px;
	background: #fdfbf7;
	border: 1px solid rgba(195, 147, 91, 0.28);
	border-left: 4px solid var(--wd-primary-color, #c3935b);
	border-radius: 6px;
}

.tappit-product-box-icon {
	color: var(--wd-primary-color, #c3935b);
	display: flex;
	align-items: center;
	flex-shrink: 0;
}

.tappit-product-box-icon svg {
	width: 20px;
	height: 20px;
	fill: currentColor;
}

.tappit-product-box-content {
	flex: 1;
	min-width: 0;
}

.tappit-product-box-label {
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.8px;
	color: #777777;
	font-weight: 600;
	margin-bottom: 4px;
}

.tappit-product-box-title {
	font-size: 20px;
	font-weight: 700;
	color: #111111;
	margin: 0;
	line-height: 1.35;
	word-wrap: break-word;
}

.tappit-product-box-sku {
	display: inline-block;
	font-size: 12px;
	color: #666666;
	margin-top: 4px;
	background: rgba(0, 0, 0, 0.05);
	padding: 2px 8px;
	border-radius: 4px;
}

/* Enhanced Product Title Sizes Site-wide */
.wd-product .wd-entities-title,
.product-grid-item .wd-entities-title,
.wd-product .product-title {
	font-size: 17px !important;
	font-weight: 600 !important;
	line-height: 1.35 !important;
}

.single-product-page .product_title,
.single-product .entry-title,
.product-image-summary .product_title {
	font-size: 34px !important;
	line-height: 1.25 !important;
}

#tappit-success-product-name {
	font-size: 17px;
	color: var(--wd-primary-color, #c3935b);
}

/* Minimum gap between menu / My Account text and hover underline */
.wd-nav[class*="wd-style-underline"] .nav-link-text:after,
.wd-nav.wd-style-underline .nav-link-text:after,
.wd-nav-main.wd-style-underline > li > a .nav-link-text:after,
.wd-header-my-account[class*="wd-style-underline"] .wd-tools-text:after,
.wd-header-my-account.wd-style-underline .wd-tools-text:after,
.wd-header-my-account .wd-tools-text:after {
	top: calc(100% + 5px) !important;
}

/* Navigation menu & My Account font weight - Normal, Hover & Active (700) */
.wd-header-nav .wd-nav > li > a,
.wd-header-nav .wd-nav > li > a:hover,
.wd-header-nav .wd-nav > li > a:active,
.wd-header-nav .wd-nav > li > a:focus,
.wd-header-nav .wd-nav > li:hover > a,
.wd-header-nav .wd-nav > li:active > a,
.wd-header-nav .wd-nav > li.active > a,
.wd-header-nav .wd-nav > li.wd-active > a,
.wd-header-nav .wd-nav > li.current-menu-item > a,
.wd-header-nav .wd-nav > li.current_page_item > a,
.wd-header-nav .wd-nav > li.current-menu-ancestor > a,
.wd-nav-main > li > a,
.wd-nav-main > li > a:hover,
.wd-nav-main > li > a:active,
.wd-nav-main > li > a:focus,
.wd-nav-main > li:hover > a,
.wd-nav-main > li:active > a,
.wd-nav-main > li.active > a,
.wd-nav-main > li.wd-active > a,
.wd-nav-main > li.current-menu-item > a,
.wd-nav-main > li.current_page_item > a,
.wd-nav-main > li.current-menu-ancestor > a,
.wd-nav-header > li > a,
.wd-nav-header > li > a:hover,
.wd-nav-header > li > a:active,
.wd-nav-header > li > a:focus,
.wd-nav-header > li:hover > a,
.wd-nav-header > li:active > a,
.wd-nav-header > li.active > a,
.wd-nav-header > li.wd-active > a,
.wd-nav-header > li.current-menu-item > a,
.wd-nav-header > li.current_page_item > a,
.wd-nav-header > li.current-menu-ancestor > a,
.wd-nav-main .nav-link-text,
.wd-nav-header .nav-link-text,
.wd-nav-main > li:hover .nav-link-text,
.wd-nav-main > li:active .nav-link-text,
.wd-nav-main > li.active .nav-link-text,
.wd-nav-main > li.wd-active .nav-link-text,
.wd-nav-main > li.current-menu-item .nav-link-text,
.wd-nav-main > li.current_page_item .nav-link-text,
.wd-nav-header > li:hover .nav-link-text,
.wd-nav-header > li:active .nav-link-text,
.wd-nav-header > li.active .nav-link-text,
.wd-nav-header > li.wd-active .nav-link-text,
.wd-nav-header > li.current-menu-item .nav-link-text,
.wd-nav-header > li.current_page_item .nav-link-text,
.wd-header-my-account,
.wd-header-my-account:hover,
.wd-header-my-account:active,
.wd-header-my-account.active,
.wd-header-my-account.wd-active,
.wd-header-my-account > a,
.wd-header-my-account > a:hover,
.wd-header-my-account > a:active,
.wd-header-my-account > a:focus,
.wd-header-my-account .wd-tools-text,
.wd-header-my-account:hover .wd-tools-text,
.wd-header-my-account:active .wd-tools-text,
.wd-header-my-account > a:hover .wd-tools-text,
.wd-header-my-account > a:active .wd-tools-text,
.wd-header-my-account.wd-tools-element [class*="wd-tools-text"],
.whb-top-bar .wd-header-my-account .wd-tools-text,
.whb-top-bar .wd-header-my-account:hover .wd-tools-text,
.whb-top-bar .wd-header-my-account:active .wd-tools-text {
	font-weight: 700 !important;
}

/* Footer Copyrights: Remove payment logo & Center copyright text */
.wd-copyrights .wd-col-end,
.wd-copyrights img[src*="payments"],
.wd-copyrights img[alt*="payments" i] {
	display: none !important;
}

.wd-copyrights {
	text-align: center !important;
}

.wd-copyrights .container,
.wd-copyrights .container.wd-grid-g,
.wd-copyrights.wd-layout-two-columns > .container.wd-grid-g,
.wd-copyrights.wd-layout-centered > .container.wd-grid-g {
	display: flex !important;
	justify-content: center !important;
	align-items: center !important;
	text-align: center !important;
	width: 100% !important;
	max-width: 100% !important;
}

.wd-copyrights .wd-col-start,
.wd-copyrights .reset-last-child,
.wd-copyrights p {
	text-align: center !important;
	width: 100% !important;
	margin-inline: auto !important;
}

/* Remove Brand Carousel from all pages */
.wd-brands.wd-layout-carousel,
.elementor-widget-wd_products_brands,
.brands-widget.wd-layout-carousel,
.wd-prefooter:has(.wd-brands),
.wd-prefooter:has(.elementor-widget-wd_products_brands) {
	display: none !important;
}

/* Remove OUR INSTAGRAM from sidebar */
.sidebar-container .woodmart-instagram,
.sidebar-widget.woodmart-instagram,
.widget_woodmart-instagram,
div[id*="woodmart-instagram"] {
	display: none !important;
}

/* Form Styles */
.tappit-quote-form {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.tappit-form-row {
	display: flex;
	gap: 14px;
}

@media (max-width: 575px) {
	.tappit-form-row {
		flex-direction: column;
		gap: 16px;
	}
}

.tappit-form-group {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 6px;
	text-align: left;
}

.tappit-form-label {
	font-size: 13px;
	font-weight: 600;
	color: #333333;
	margin: 0;
	display: flex;
	align-items: center;
	gap: 4px;
}

.tappit-form-label .tappit-required {
	color: #e53935;
	font-weight: 700;
}

.tappit-input-wrap {
	position: relative;
	display: flex;
	align-items: center;
}

.tappit-input-icon {
	position: absolute;
	left: 14px;
	color: #999999;
	display: flex;
	align-items: center;
	pointer-events: none;
	transition: color 0.2s ease;
}

.tappit-input-icon svg {
	width: 16px;
	height: 16px;
	fill: currentColor;
}

.tappit-form-control {
	width: 100% !important;
	padding: 10px 14px 10px 40px !important;
	font-size: 14px !important;
	color: #222222 !important;
	background-color: #ffffff !important;
	border: 1px solid #dcdcdc !important;
	border-radius: 6px !important;
	outline: none !important;
	transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
	box-sizing: border-box !important;
	height: 44px !important;
	line-height: normal !important;
}

textarea.tappit-form-control {
	height: 95px !important;
	padding-left: 14px !important;
	padding-top: 10px !important;
	resize: vertical !important;
}

.tappit-form-control:focus {
	border-color: var(--wd-primary-color, #c3935b) !important;
	box-shadow: 0 0 0 3px rgba(195, 147, 91, 0.2) !important;
}

.tappit-input-wrap:focus-within .tappit-input-icon {
	color: var(--wd-primary-color, #c3935b);
}

/* Honeypot hidden input */
.tappit-hp-field {
	display: none !important;
	visibility: hidden !important;
	position: absolute !important;
	left: -9999px !important;
}

/* Submit Button */
.tappit-submit-btn {
	width: 100%;
	min-height: 48px;
	padding: 0 24px;
	background-color: var(--wd-primary-color, #c3935b) !important;
	color: #ffffff !important;
	border: 2px solid var(--wd-primary-color, #c3935b) !important;
	border-radius: 6px;
	font-size: 15px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.8px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.1);
	transition: all 0.25s ease;
	margin-top: 4px;
}

.tappit-submit-btn:hover {
	background-color: #111111 !important;
	border-color: #111111 !important;
	color: #ffffff !important;
	transform: translateY(-2px);
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.15);
}

.tappit-submit-btn:disabled {
	opacity: 0.65;
	cursor: not-allowed;
	transform: none;
}

.tappit-submit-btn svg {
	width: 16px;
	height: 16px;
	fill: currentColor;
	transition: transform 0.2s ease;
}

.tappit-submit-btn:hover svg {
	transform: translateX(3px);
}

/* Spinner */
.tappit-spinner {
	display: none;
	width: 18px;
	height: 18px;
	border: 2px solid rgba(255, 255, 255, 0.3);
	border-top-color: #ffffff;
	border-radius: 50%;
	animation: tappitSpin 0.7s linear infinite;
}

@keyframes tappitSpin {
	to {
		transform: rotate(360deg);
	}
}

.tappit-submit-btn.tappit-loading .tappit-btn-label,
.tappit-submit-btn.tappit-loading svg {
	display: none;
}

.tappit-submit-btn.tappit-loading .tappit-spinner {
	display: inline-block;
}

/* Alert Notification Boxes */
.tappit-alert {
	padding: 14px 16px;
	border-radius: 6px;
	font-size: 13.5px;
	line-height: 1.5;
	display: none;
	align-items: flex-start;
	gap: 10px;
	margin-bottom: 16px;
}

.tappit-alert svg {
	width: 18px;
	height: 18px;
	flex-shrink: 0;
	margin-top: 2px;
}

.tappit-alert-error {
	background-color: #fef2f2;
	border: 1px solid #fecaca;
	color: #b91c1c;
}

.tappit-alert-error svg {
	fill: #b91c1c;
}

.tappit-alert-success {
	background-color: #f0fdf4;
	border: 1px solid #bbf7d0;
	color: #15803d;
}

.tappit-alert-success svg {
	fill: #15803d;
}

/* Success Card Replacement State */
.tappit-success-card {
	display: none;
	text-align: center;
	padding: 20px 10px 10px 10px;
}

.tappit-success-icon-wrap {
	width: 64px;
	height: 64px;
	border-radius: 50%;
	background-color: #ecfdf5;
	border: 2px solid #a7f3d0;
	color: #10b981;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 16px auto;
}

.tappit-success-icon-wrap svg {
	width: 32px;
	height: 32px;
	stroke: currentColor;
	stroke-width: 2.5;
	fill: none;
}

.tappit-success-card h4 {
	font-size: 20px;
	font-weight: 700;
	color: #111111;
	margin: 0 0 10px 0;
}

.tappit-success-card p {
	font-size: 14px;
	color: #555555;
	line-height: 1.6;
	margin: 0 0 20px 0;
}

.tappit-success-close-btn {
	display: inline-block;
	padding: 10px 26px;
	background-color: var(--wd-primary-color, #c3935b);
	color: #ffffff !important;
	border: none;
	border-radius: 6px;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	transition: background-color 0.2s ease;
}

.tappit-success-close-btn:hover {
	background-color: #111111;
}