/*
 Theme Name:   Low Country Moving (Divi Child)
 Theme URI:    https://www.lowcountrymoving.com/
 Description:  Divi child theme for Low Country Moving. Marketing pages (home, contact, blog) are built with Divi; the WooCommerce shop and the multi-step "Book Online" booking funnel are preserved from the original Webflow theme via ported templates, assets, and business logic.
 Author:       Digital Coast Marketing
 Template:     Divi
 Version:      1.1.0
*/

/* =========================================================================
 * Header — pixel match of the production header (values measured on live
 * 2026-07-16: nav 110px, logo 12.9rem, links 1.25rem/500 #000 pill-hover,
 * cart = bordered pill w/ #ff003d count badge on the icon corner).
 * Markup: Divi #main-header; cart pill injected by lcm_cart_menu_item().
 * ====================================================================== */
#main-header {
	background: #fff !important;
	box-shadow: 0 2px 12px rgba(0, 87, 115, .102) !important;
}
#main-header #et_top_search,
#main-header .et-cart-info { display: none !important; }

#main-header .et-menu li.lcm-myorder,
#et-top-navigation .et-menu li.lcm-myorder { display: flex; align-items: center; }

a.lcm-cart-link {
	position: relative;
	display: inline-flex !important;
	align-items: center;
	justify-content: flex-start;
	gap: .5rem;
	min-width: 9rem;
	padding: .75rem 1.5rem !important;
	box-sizing: border-box;
	background: transparent !important;
	border: 1px solid #222 !important;
	border-radius: .5rem !important;
	color: #000 !important;
	font-family: 'Inter Variablefont Slnt Wght', sans-serif;
	font-size: 1.25rem !important;
	font-weight: 500 !important;
	line-height: 1 !important;
	opacity: 1 !important;
	text-decoration: none !important;
	text-transform: none;
	white-space: nowrap;
	transition: color .2s, border-color .2s;
}
a.lcm-cart-link:hover { border-color: #219ec4 !important; color: #219ec4 !important; }
a.lcm-cart-link::before,
a.lcm-cart-link::after { display: none !important; content: none !important; }
.lcm-cart-link .lcm-cart-ico { display: inline-flex; position: relative; }
.lcm-cart-link svg { display: block; width: 17px; height: 17px; }
/* red count badge pinned to the cart icon's top-right corner (live: .cart-quantity) */
.lcm-cart-link .lcm-cart-count {
	position: absolute;
	top: -8px;
	right: -11px;
	left: auto;
	background: #ff003d;
	color: #fff;
	font-size: 10px;
	font-weight: 600;
	height: 18px;
	line-height: 18px;
	min-width: 18px;
	padding: 0 4px;
	border-radius: 9px;
	text-align: center;
	box-sizing: border-box;
}

/* ---- Desktop (Divi flips to mobile below 981px; live flips at 992 — accepted) */
@media (min-width: 981px) {
	#main-header .container.et_menu_container {
		display: flex !important;
		align-items: center;
		min-height: 110px !important;
		width: 100% !important;
		max-width: 90rem !important;
		padding: 0 1.5rem !important;
	}
	#main-header #logo { width: 12.9rem !important; height: auto !important; max-height: none !important; }
	#main-header .logo_container { position: relative !important; float: none !important; width: auto !important; height: auto !important; margin: 0 !important; }
	#main-header .logo_container .logo_helper { display: none !important; }
	#main-header #et-top-navigation { position: static; float: none !important; width: auto !important; flex: 1 1 auto; min-width: 0; padding: 0 !important; margin: 0 0 0 24px !important; display: flex; align-items: center; }
	#main-header #top-menu-nav { flex: 1 1 auto; width: 100%; max-width: none; }
	#main-header #top-menu { display: flex !important; align-items: center; gap: 2rem; width: 100%; padding: 0 !important; }
	#main-header #top-menu > li { margin: 0 !important; padding: 0 !important; }
	#main-header #top-menu > li:first-child { margin-left: auto !important; }
	#main-header #top-menu > li.lcm-myorder { margin-left: auto !important; }
	#main-header #top-menu > li > a {
		font-family: 'Inter Variablefont Slnt Wght', sans-serif;
		font-size: 1.25rem !important;
		font-weight: 500;
		color: #000 !important;
		opacity: 1 !important;
		padding: .75rem 1rem !important;
		border-radius: 50rem;
		white-space: nowrap;
		transition: background-color .2s, color .2s;
	}
	#main-header #top-menu > li > a:hover { background: #f2fbfd; color: #005773 !important; opacity: 1 !important; }
	/* Divi's nav underline pseudo-elements off */
	#main-header #top-menu > li > a::before,
	#main-header #top-menu > li > a::after { display: none !important; content: none !important; }
	/* mobile cart icon never shows on desktop (must out-specify a.lcm-cart-link) */
	a.lcm-cart-link.lcm-cart-mobile { display: none !important; }
}
@media (min-width: 981px) and (max-width: 1180px) {
	#main-header #top-menu { gap: .75rem; }
	#main-header #top-menu > li > a { padding: .75rem .5rem !important; font-size: 1.1rem !important; }
	a.lcm-cart-link { min-width: 0; padding: .75rem 1rem !important; font-size: 1.1rem !important; }
}

/* ---- Mobile / tablet header (≤980): logo left, cart icon + custom burger right */
@media (max-width: 980px) {
	#main-header { padding: 0 !important; }
	#main-header .container.et_menu_container {
		display: flex !important;
		align-items: center;
		justify-content: space-between;
		width: 100% !important;
		max-width: 100% !important;
		min-height: 89px;
		padding: .5rem 2rem !important;
	}
	#main-header #logo { width: 11.5rem !important; height: auto !important; max-height: none !important; }
	#main-header .logo_container { position: relative !important; float: none !important; width: auto !important; height: auto !important; margin: 0 !important; }
	#main-header .logo_container .logo_helper { display: none !important; }
	#main-header #et-top-navigation {
		display: flex !important;
		align-items: center;
		justify-content: flex-end;
		gap: .25rem;
		float: none !important;
		padding: 0 !important;
		margin: 0 0 0 auto !important;
		width: auto !important;
	}
	/* standalone cart icon (rendered by lcm_mobile_header_cart), sits left of the burger */
	a.lcm-cart-link.lcm-cart-mobile {
		order: 1;
		position: relative;
		display: inline-flex !important;
		align-items: center;
		justify-content: center;
		padding: .75rem !important;
		border: 0 !important;
		font-size: 0 !important;
		background: transparent !important;
		color: #000 !important;
		min-width: 0 !important;
	}
	.lcm-cart-mobile svg { width: 20px; height: 20px; }
	#et_mobile_nav_menu { order: 2; float: none !important; margin: 0 !important; display: block !important; }
	/* the "My Order" pill menu item never shows on mobile (cart is the standalone icon) */
	#main-header #top-menu-nav { display: none !important; }

	/* custom 3-bar burger (live: 28×18 svg — full / 19 right / 9 right bars) */
	#et_mobile_nav_menu .mobile_menu_bar { display: flex; align-items: center; justify-content: center; width: 41px; height: 26px; padding: 0 !important; }
	#et_mobile_nav_menu .mobile_menu_bar::before {
		content: '' !important;
		display: block;
		width: 29px;
		height: 18px;
		background-image: linear-gradient(#222, #222), linear-gradient(#222, #222), linear-gradient(#222, #222);
		background-size: 29px 2px, 20px 2px, 9px 2px;
		background-position: left top 1px, right top 8px, right top 15px;
		background-repeat: no-repeat;
	}
	.mobile_nav .select_page { display: none !important; }

	/* open-state dropdown = live's compact right-aligned white card */
	.et_mobile_menu {
		position: absolute;
		left: auto !important;
		right: 2rem !important;
		top: 100% !important;
		width: auto !important;
		min-width: 11rem;
		margin-top: -6px;
		padding: 0 !important;
		background: #fff !important;
		border: none !important;
		border-top: none !important;
		border-radius: .5rem;
		box-shadow: 0 4px 13px rgba(33, 158, 196, .231) !important;
		overflow: hidden;
	}
	.et_mobile_menu li a {
		font-family: 'Inter Variablefont Slnt Wght', sans-serif;
		font-size: 1.25rem !important;
		font-weight: 500;
		color: #000 !important;
		padding: .75rem 1rem !important;
		border-bottom: none !important;
	}
	.et_mobile_menu li a:hover { background: #f2fbfd; color: #005773 !important; opacity: 1; }
	.et_mobile_menu li.lcm-myorder { display: none !important; }
}
@media (max-width: 479px) {
	#main-header .container.et_menu_container { min-height: 79px; padding: .5rem 1.25rem !important; }
	#main-header #logo { width: 10rem !important; }
	.et_mobile_menu { right: 1.25rem !important; }
}

/* =========================================================================
 * Home "Tips" blog cards — output of [lcm_blog_cards] (functions.php).
 * Mirrors live .blog_item: 16:9 image, 1.25rem/700 title, grey 3-line
 * excerpt, full-width bordered "Read more".
 * ====================================================================== */
.lcm-blog-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; align-items: stretch; margin-top: 28px; }
.lcm-blog-card { background: #fff; border-radius: .5rem; box-shadow: 0 2px 9px rgba(76, 175, 209, .149), 0 11px 40px rgba(86, 197, 235, .2); overflow: hidden; display: flex; flex-direction: column; }
.lcm-blog-card .lcm-blog-img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.lcm-blog-body { padding: 1.5rem; display: flex; flex-direction: column; gap: .85rem; flex: 1; }
.lcm-blog-body h3 { font-family: 'Inter Variablefont Slnt Wght', sans-serif; font-size: 1.25rem; font-weight: 700; line-height: 1.3; color: #000; margin: 0; }
.lcm-blog-desc { color: #666; font-size: 1rem; line-height: 1.5; margin: 0; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.lcm-blog-more { margin-top: auto; width: 100%; }
@media (max-width: 479px) { .lcm-blog-cards { grid-template-columns: 1fr; } }

/* secondary (bordered) button — live .button.is-secondary */
.lcm-btn-secondary {
	display: inline-block;
	background: transparent;
	border: 1px solid #222;
	border-radius: .5rem;
	color: #000 !important;
	font-family: 'Inter Variablefont Slnt Wght', sans-serif;
	font-weight: 600;
	font-size: 1rem;
	min-width: 9rem;
	padding: .75rem 1.5rem;
	text-align: center;
	text-decoration: none;
	box-sizing: border-box;
	transition: color .2s, border-color .2s;
}
.lcm-btn-secondary:hover { border-color: #219ec4; color: #219ec4 !important; }

/* =========================================================================
 * Footer — reproduction of the production footer for Divi marketing pages.
 * lcm_render_marketing_footer() (functions.php) outputs the markup via the
 * et_after_main_content hook; Divi's own #main-footer is hidden here.
 * ====================================================================== */
#main-footer { display: none !important; }

.lcm-footer { background: #fff; color: #000; font-family: 'Inter Variablefont Slnt Wght', sans-serif; padding: 4rem 0 3rem; }
.lcm-foot-inner { max-width: 1376px; margin: 0 auto; padding: 0 2rem; }
.lcm-foot-top { display: grid; grid-template-columns: 1.25fr 1fr; gap: 2rem 3rem; align-items: start; }
.lcm-foot-intro h2 { font-size: 2rem; font-weight: 700; line-height: 1.2; color: #101828; margin: 0 0 .5rem; }
.lcm-foot-intro p { color: #333; margin: 0; line-height: 1.5; }
.lcm-foot-form { width: 100%; }
.lcm-foot-form label { display: block; font-size: .95rem; color: #222; margin-bottom: .4rem; }
/* live subscribe row: input + button inline */
.lcm-foot-subscribe { display: flex; flex-direction: row; gap: .75rem; align-items: stretch; }
.lcm-foot-input { flex: 1 1 auto; min-width: 0; background: transparent; border: 1px solid #aaa; border-radius: .5rem; height: 3rem; padding: .5rem 1rem; font-size: 1rem; font-family: inherit; color: #000; transition: border-color .2s; }
.lcm-foot-input:hover { border-color: #222; }
.lcm-foot-input:focus { outline: none; border-color: #219ec4; }
.lcm-foot-submit { flex: 0 0 auto; align-self: stretch; background: #219ec4; color: #fff; border: 0; border-radius: .5rem; font-weight: 600; min-width: 6.5rem; padding: .75rem 1.5rem; cursor: pointer; transition: background .2s; }
.lcm-foot-submit:hover { background: #1b86a6; }
.lcm-foot-cols { display: flex; flex-wrap: wrap; gap: 2.5rem 3rem; margin-top: 2.5rem; align-items: flex-start; }
.lcm-foot-col h3 { font-size: 1.25rem; font-weight: 600; color: #101828; margin: 0 0 .5rem; }
.lcm-foot-col ul, .lcm-foot-social { list-style: none; margin: 0; padding: 0; }
.lcm-foot-col ul { display: flex; flex-direction: column; }
.lcm-foot-col li { margin: 0; }
.lcm-foot-col a { display: flex; align-items: center; gap: .6rem; color: #000; text-decoration: none; padding: .5rem 0; font-size: 1rem; line-height: 1.4; transition: color .2s; }
.lcm-foot-col a:hover { color: #219ec4; }
.lcm-foot-ico { flex: 0 0 20px; width: 20px; height: 20px; display: inline-flex; color: #219ec4; }
.lcm-foot-ico svg { width: 100%; height: 100%; }
.lcm-foot-social { display: flex; flex-direction: row; gap: 1rem; margin-left: auto; align-items: center; }
.lcm-foot-social a { display: inline-flex; width: 30px; height: 30px; color: #000; transition: color .2s; }
.lcm-foot-social a:hover { color: #219ec4; }
.lcm-foot-social svg { width: 100%; height: 100%; }
.lcm-foot-line { background: #86b1bf; opacity: .3; height: 2px; width: 100%; margin: 2.5rem 0 1.5rem; }
.lcm-foot-copy { color: #333; font-size: .9rem; margin: 0; }
@media (max-width: 767px) {
	.lcm-foot-top { grid-template-columns: 1fr; }
	.lcm-foot-cols { flex-direction: column; gap: 2rem; }
	.lcm-foot-social { margin-left: 0; }
	.lcm-foot-inner { padding: 0 1.25rem; }
	.lcm-foot-intro h2 { font-size: 1.6rem; }
	.lcm-foot-subscribe { flex-direction: column; }
}

/* =========================================================================
 * DiviArea popups (#homes / #storage on the homepage) — match the live site's
 * modal typography + storage table.
 * ====================================================================== */
#homes h2, #storage h2 { font-size: 2rem; font-weight: 700; line-height: 1.2; margin: 0 0 1.25rem; color: #101828; }
#homes h3, #storage h3 { font-size: 1.5rem; font-weight: 700; line-height: 1.25; margin: 1.25rem 0 .625rem; color: #101828; }
#homes p, #storage p { font-size: 1rem; line-height: 1.5; margin: 0 0 .625rem; color: #333; }
#homes p strong, #storage p strong { font-weight: 700; color: #101828; }
.storage-table { width: 100%; border-collapse: collapse; margin: 0 0 1.25rem; }
.storage-table th, .storage-table td { border: 1px solid #ddd; padding: 10px; text-align: left; }
.storage-table th { background: #f2f2f2; font-weight: 700; }
.storage-table tr:nth-child(even) { background: #f9f9f9; }
@media (max-width: 768px) {
	#homes h2, #storage h2 { font-size: 1.5rem; }
	#homes h3, #storage h3 { font-size: 1.25rem; }
	#homes p, #storage p { font-size: .9rem; }
	.storage-table th, .storage-table td { padding: 8px; }
}

/* =========================================================================
 * reCAPTCHA — badge hidden site-wide (Michael's 7-16 call decision);
 * protection stays active, disclosure text lives in the contact form footer.
 * ====================================================================== */
.grecaptcha-badge { visibility: hidden !important; }

/* =========================================================================
 * Cart drawer — w-commerce styling for the marketing (Divi) pages, where the
 * full Webflow stylesheet is not loaded. Values copied from production
 * dist/css/style.css (+ the inline overrides the production theme prints).
 * Drawer shell/animation comes from dist/css/cartDrawer.css (enqueued
 * site-wide); markup from lcm_cart_drawer_html() in functions.php.
 * Shop/booking pages load the full Webflow CSS, whose identical rules win
 * harmlessly (same values).
 * ====================================================================== */
.cart-drawer { font-family: 'Inter Variablefont Slnt Wght', sans-serif; color: #000; font-size: 1rem; line-height: 1.5; font-weight: 400; }
/* Divi's fixed header sits at z-index 99999 — lift the drawer + overlay above
 * it so the panel covers the header like production (whose nav is z 999). */
.cart-drawer { z-index: 999999 !important; }
.cart-drawer-overlay { z-index: 999998 !important; }
.w-commerce-commercecartheading { margin: 0; padding: 0; }
.cart-drawer h4.w-commerce-commercecartheading { font-size: 1.5rem; font-weight: 700; line-height: 1.4; }
@media (max-width: 767px) { .cart-drawer h4.w-commerce-commercecartheading { font-size: 1.25rem; } }
.cart-drawer .w-commerce-commercecartlist { -webkit-overflow-scrolling: touch; flex: 1; overflow: auto; padding: 12px 24px; }
.cart-drawer .w-commerce-commercecartfooter { border-top: 1px solid #e6e6e6; display: flex; flex: none; flex-direction: column; padding: 16px 24px 24px; }
.cart-drawer .w-commerce-commercecartlineitem { align-items: baseline; display: flex; flex: none; justify-content: space-between; margin-bottom: 16px; }
.cart-drawer .w-commerce-commercecartordervalue { font-weight: 700; }
.cart-drawer .w-commerce-commercecartitemimage { height: 60px; width: 60px; }
.cart-drawer .w-commerce-commercecartcheckoutbutton {
	background-color: #219ec4 !important;
	border-radius: .5rem !important;
	color: #fff !important;
	font-weight: 600 !important;
	min-width: 100%;
	padding: .75rem 1.5rem !important;
	text-align: center !important;
	text-decoration: none !important;
	height: 48px !important;
	display: flex !important;
	justify-content: center;
	align-items: center;
	box-sizing: border-box;
}
/* Mini-cart internals (the ported woocommerce/cart/mini-cart.php prints
 * w-commerce item markup identical to production; rules from prod dist css) */
.cart-drawer p { margin: 0 0 10px; }
.cart-drawer .w-commerce-commercecartitem { align-items: flex-start; padding-top: 12px; padding-bottom: 12px; display: flex; }
.cart-drawer .w-commerce-commercecartiteminfo { flex-direction: column; flex: 1; margin-left: 16px; margin-right: 16px; display: flex; }
.cart-drawer .w-commerce-commercecartoptionlist { margin-bottom: 0; padding-left: 0; text-decoration: none; list-style-type: none; }
.cart-drawer .w-commerce-commercecartproductname { font-weight: 700; }
.cart-drawer a { color: #000; }
