/* Lantern Market: shop features, header layouts, mega menu, starter-design finishes. */

/* ---------- Badges ---------- */
.lnmk-badge { display: inline-block; white-space: nowrap; }
.lnmk-badge--sale { background: var(--lnmk-cta); color: #fff; }
.lnmk-badge--new { background: var(--lnmk-primary); color: #fff; }
.lnmk-badge--low { background: #fef3c7; color: #92400e; }
.lnmk-badge--out { background: #475569; color: #fff; }
.lnmk-single-badges { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }

.lnmk-badge-count {
	position: absolute;
	top: 2px;
	right: 0;
	min-width: 20px;
	height: 20px;
	padding: 0 5px;
	border-radius: 999px;
	background: var(--lnmk-primary);
	color: #fff;
	font: 700 0.72rem/20px var(--lnmk-font-body);
	text-align: center;
}

.lnmk-badge-count[hidden] { display: none; }

/* ---------- Card tools ---------- */
.lnmk-card__tools {
	position: absolute;
	right: 10px;
	top: 10px;
	z-index: 3;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.lnmk-wish--icon,
.lnmk-cmp--icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.95);
	color: var(--lnmk-text);
	box-shadow: 0 4px 12px -4px rgba(15, 23, 42, 0.35);
	cursor: pointer;
	transition: transform 0.15s, background-color 0.15s, color 0.15s;
}

.lnmk-wish--icon svg,
.lnmk-cmp--icon svg { width: 18px; height: 18px; }
.lnmk-wish--icon:hover,
.lnmk-cmp--icon:hover { transform: scale(1.08); color: var(--lnmk-primary); }
.lnmk-wish.is-on { color: #e11d48; }
.lnmk-wish.is-on svg { fill: currentColor; }
.lnmk-cmp--icon.is-on { background: var(--lnmk-primary); color: #fff; }

.lnmk-wish__label:empty,
.lnmk-cmp__label:empty { display: none; }

/* ---------- Single product ---------- */
.lnmk-single-actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 18px; }

.lnmk-wish--text,
.lnmk-cmp--text {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 0.55rem 1rem;
	border: 1.5px solid var(--lnmk-border);
	border-radius: var(--lnmk-radius-sm);
	background: var(--lnmk-card);
	color: var(--lnmk-text);
	font: 600 0.88rem var(--lnmk-font-body);
	cursor: pointer;
}

.lnmk-wish--text svg,
.lnmk-cmp--text svg { width: 18px; height: 18px; }
.lnmk-wish--text:hover,
.lnmk-cmp--text:hover { border-color: var(--lnmk-primary); color: var(--lnmk-primary); }
.lnmk-wish--text.is-on { border-color: #e11d48; color: #e11d48; }
.lnmk-cmp--text.is-on { border-color: var(--lnmk-primary); background: var(--lnmk-primary-tint); color: var(--lnmk-primary); }

.lnmk-restock {
	margin: 0 0 16px;
	padding: 12px 14px;
	border-left: 4px solid var(--lnmk-cta);
	border-radius: var(--lnmk-radius-sm);
	background: color-mix(in srgb, var(--lnmk-cta) 9%, #fff);
	font-size: 0.92rem;
}

.lnmk-anchor { display: block; height: 0; }

.lnmk-recent { margin-top: 40px; grid-column: 1 / -1; }
.lnmk-recent[hidden] { display: none; }
.lnmk-recent ul.products { grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* ---------- Sticky add-to-cart (phones) ---------- */
.lnmk-sticky { display: none; }

@media (max-width: 860px) {
	.lnmk-sticky {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 80;
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
		border-top: 1px solid var(--lnmk-border);
		background: var(--lnmk-card);
		box-shadow: 0 -10px 30px -18px rgba(15, 23, 42, 0.5);
		transform: translateY(110%);
		transition: transform 0.25s;
	}

	.lnmk-sticky[hidden] { display: none; }
	.lnmk-sticky.is-visible { transform: none; }
	.lnmk-sticky__info { display: flex; align-items: center; gap: 10px; min-width: 0; }
	.lnmk-sticky__img img { display: block; width: 44px; height: 44px; border-radius: 8px; object-fit: cover; }
	.lnmk-sticky__text { display: flex; flex-direction: column; min-width: 0; font-size: 0.82rem; line-height: 1.3; }
	.lnmk-sticky__text strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
	.lnmk-sticky .lnmk-btn { flex: none; padding: 0.7rem 1.1rem; }
	body.single-product { padding-bottom: 72px; }
}

/* ---------- Compare bar + pages ---------- */
.lnmk-compare-bar {
	position: fixed;
	left: 50%;
	bottom: 20px;
	z-index: 120;
	display: flex;
	align-items: center;
	gap: 14px;
	max-width: calc(100vw - 24px);
	padding: 10px 14px;
	border: 1px solid var(--lnmk-border);
	border-radius: 999px;
	background: var(--lnmk-card);
	box-shadow: 0 16px 40px -14px rgba(15, 23, 42, 0.55);
	transform: translateX(-50%);
	font-size: 0.9rem;
	font-weight: 600;
}

.lnmk-compare-bar[hidden] { display: none; }
.lnmk-compare-bar__text { display: inline-flex; align-items: center; gap: 6px; }
.lnmk-compare-bar__text svg { width: 18px; height: 18px; color: var(--lnmk-primary); }
.lnmk-compare-bar__clear { border: 0; background: none; color: var(--lnmk-muted); font: 600 0.85rem var(--lnmk-font-body); cursor: pointer; text-decoration: underline; }

@media (max-width: 860px) {
	.lnmk-compare-bar { bottom: 76px; }
}

.lnmk-empty { padding: 56px 20px; border: 1px dashed var(--lnmk-border); border-radius: var(--lnmk-radius); background: var(--lnmk-card); text-align: center; color: var(--lnmk-muted); }
.lnmk-empty .lnmk-btn { margin-top: 6px; }

.lnmk-compare-scroll { overflow-x: auto; border: 1px solid var(--lnmk-border); border-radius: var(--lnmk-radius); background: var(--lnmk-card); }
.lnmk-compare { width: 100%; min-width: 640px; border-collapse: collapse; }
.lnmk-compare th, .lnmk-compare td { padding: 14px 16px; border-top: 1px solid var(--lnmk-border); text-align: left; vertical-align: top; font-size: 0.93rem; }
.lnmk-compare tr:first-child th, .lnmk-compare tr:first-child td { border-top: 0; }
.lnmk-compare th { width: 150px; color: var(--lnmk-muted); font-size: 0.8rem; letter-spacing: 0.05em; text-transform: uppercase; }
.lnmk-compare__head td { text-align: center; }
.lnmk-compare__img img { display: block; width: 140px; height: 140px; margin: 0 auto 10px; border-radius: var(--lnmk-radius-sm); object-fit: cover; }
.lnmk-compare__name { display: block; color: var(--lnmk-text); font: 700 1rem var(--lnmk-font-heading); text-decoration: none; }
.lnmk-compare__remove { margin-top: 6px; border: 0; background: none; color: var(--lnmk-danger); font: 600 0.8rem var(--lnmk-font-body); cursor: pointer; text-decoration: underline; }
.lnmk-compare .price { color: var(--lnmk-primary); font-weight: 800; }
.lnmk-compare .is-in { color: var(--lnmk-success); font-weight: 600; }
.lnmk-compare .is-out { color: var(--lnmk-danger); font-weight: 600; }

/* ---------- Mega menu ---------- */
.lnmk-nav li.lnmk-mega { position: static; }

.lnmk-nav .lnmk-mega > .sub-menu {
	left: 0;
	right: 0;
	top: 100%;
	min-width: 0;
	padding: 22px max(20px, calc((100% - 1200px) / 2));
	border-radius: 0 0 var(--lnmk-radius) var(--lnmk-radius);
	border-top: 1px solid var(--lnmk-border);
}

.lnmk-nav .lnmk-mega:hover > .sub-menu,
.lnmk-nav .lnmk-mega:focus-within > .sub-menu {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 10px 20px;
}

.lnmk-nav .lnmk-mega .sub-menu a { padding: 8px; }
.lnmk-mega__item { display: flex !important; align-items: center; gap: 12px; }
.lnmk-mega__img { flex: none; width: 52px; height: 52px; overflow: hidden; border-radius: var(--lnmk-radius-sm); background: var(--lnmk-secondary); }
.lnmk-mega__img img { display: block; width: 100%; height: 100%; object-fit: cover; }
.lnmk-mega__txt { display: flex; flex-direction: column; line-height: 1.3; }
.lnmk-mega__txt small { color: var(--lnmk-muted); font-weight: 500; }
.lnmk-nav .lnmk-mega__all { grid-column: 1 / -1; display: flex; gap: 6px; padding-top: 12px; border-top: 1px solid var(--lnmk-border); }
.lnmk-nav .lnmk-mega__all a { display: inline-block; color: var(--lnmk-primary); }

/* ---------- Header layouts (wide screens) ---------- */
@media (min-width: 861px) {
	.lnmk-header-centered .lnmk-header__inner,
	.lnmk-header-stacked .lnmk-header__inner {
		display: grid;
		align-items: center;
		row-gap: 0;
	}

	.lnmk-header-centered .lnmk-header__inner {
		grid-template-columns: 1fr auto 1fr;
		grid-template-areas: "search brand actions" "nav nav nav";
	}

	.lnmk-header-stacked .lnmk-header__inner {
		grid-template-columns: auto minmax(200px, 560px) auto;
		grid-template-areas: "brand search actions" "nav nav nav";
		justify-content: space-between;
	}

	.lnmk-header-centered .lnmk-brand,
	.lnmk-header-stacked .lnmk-brand { grid-area: brand; }
	.lnmk-header-centered .lnmk-brand { justify-self: center; }
	.lnmk-header-centered .lnmk-search,
	.lnmk-header-stacked .lnmk-search { grid-area: search; margin: 0; max-width: none; width: 100%; }
	.lnmk-header-centered .lnmk-search { max-width: 340px; }
	.lnmk-header-centered .lnmk-header__actions,
	.lnmk-header-stacked .lnmk-header__actions { grid-area: actions; justify-self: end; margin: 0; }

	.lnmk-header-centered .lnmk-nav,
	.lnmk-header-stacked .lnmk-nav {
		grid-area: nav;
		width: 100%;
		padding-block: 4px 8px;
		border-top: 1px solid var(--lnmk-border);
	}

	.lnmk-header-centered .lnmk-nav .lnmk-menu,
	.lnmk-header-centered .lnmk-nav > ul { justify-content: center; }
	.lnmk-header-centered .lnmk-logo { font-size: 1.6rem; }
}

/* ---------- Account dashboard ---------- */
.lnmk-dash { margin-bottom: 28px; }
.lnmk-dash__hello { display: flex; align-items: center; gap: 16px; margin-bottom: 18px; padding: 20px; border-radius: var(--lnmk-radius); background: linear-gradient(135deg, var(--lnmk-primary-tint), var(--lnmk-card)); border: 1px solid var(--lnmk-border); }
.lnmk-dash__hello h2 { margin: 0 0 2px; font-size: 1.35rem; }
.lnmk-dash__hello p { margin: 0; color: var(--lnmk-muted); }
.lnmk-dash__avatar img { display: block; width: 56px; height: 56px; border-radius: 50%; }
.lnmk-dash__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 14px; }
.lnmk-dash__card { display: flex; flex-direction: column; gap: 2px; padding: 18px; border: 1px solid var(--lnmk-border); border-radius: var(--lnmk-radius); background: var(--lnmk-card); color: var(--lnmk-text); text-decoration: none; transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s; }
.lnmk-dash__card:hover { transform: translateY(-2px); box-shadow: var(--lnmk-shadow); border-color: var(--lnmk-primary); color: var(--lnmk-text); }
.lnmk-dash__card > span:last-child { color: var(--lnmk-muted); font-size: 0.85rem; }
.lnmk-dash__icon { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; margin-bottom: 8px; border-radius: 12px; background: var(--lnmk-primary-tint); color: var(--lnmk-primary); }

.woocommerce-MyAccount-content { min-width: 0; }
.woocommerce-MyAccount-content > p:first-of-type { color: var(--lnmk-muted); }
.woocommerce-orders-table .button { padding: 0.45rem 0.9rem; font-size: 0.82rem; }
.woocommerce-Address { padding: 18px; border: 1px solid var(--lnmk-border); border-radius: var(--lnmk-radius); background: var(--lnmk-card); }
.woocommerce-Addresses { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.woocommerce-Addresses::before, .woocommerce-Addresses::after { display: none; }
.woocommerce-Addresses .col-1, .woocommerce-Addresses .col-2 { float: none; width: auto; }

/* ---------- Order tracking ---------- */
.woocommerce-form-track-order,
form.track_order {
	max-width: 620px;
	margin: 0 auto;
	padding: 26px;
	border: 1px solid var(--lnmk-border);
	border-radius: var(--lnmk-radius);
	background: var(--lnmk-card);
}

form.track_order p:first-of-type { color: var(--lnmk-muted); }
form.track_order .form-row-first,
form.track_order .form-row-last { float: none; width: 100%; }
form.track_order .button { width: 100%; background: var(--lnmk-cta); padding: 0.9rem; }
.woocommerce-order-details, .woocommerce-customer-details { margin-top: 24px; }
.order_details { padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 10px; }
.order_details li { padding: 10px 14px; border-radius: var(--lnmk-radius-sm); background: var(--lnmk-primary-tint); font-size: 0.85rem; }
.order_details li strong { display: block; font-size: 1rem; }

/* ---------- Reviews ---------- */
#reviews { margin-top: 4px; }
#reviews .woocommerce-Reviews-title { font-size: 1.3rem; }
#reviews ol.commentlist { display: grid; gap: 14px; margin: 0 0 24px; padding: 0; list-style: none; }
#reviews ol.commentlist li { margin: 0; padding: 18px; border: 1px solid var(--lnmk-border); border-radius: var(--lnmk-radius); background: var(--lnmk-card); }
#reviews ol.commentlist li .comment_container { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 14px; }
#reviews ol.commentlist li img.avatar { position: static; width: 48px; height: 48px; padding: 0; border: 0; border-radius: 50%; background: var(--lnmk-secondary); }
#reviews ol.commentlist li .comment-text { margin: 0; padding: 0; border: 0; }
#reviews ol.commentlist li .comment-text .star-rating { float: none; margin: 0 0 6px; }
#reviews ol.commentlist li .meta { margin: 0 0 6px; color: var(--lnmk-muted); font-size: 0.85rem; }
#reviews ol.commentlist li .meta strong { color: var(--lnmk-text); }
#reviews .description p { margin: 0; }
#review_form_wrapper { padding: 22px; border: 1px solid var(--lnmk-border); border-radius: var(--lnmk-radius); background: var(--lnmk-card); }
#review_form #reply-title { display: block; margin-bottom: 10px; font: 700 1.15rem var(--lnmk-font-heading); }
.comment-form-rating label { display: block; margin-bottom: 6px; font-weight: 600; }
.woocommerce p.stars a { color: #f59e0b; }
.woocommerce p.stars a::before { color: #f59e0b; }
.woocommerce .star-rating span::before { color: #f59e0b; }
.woocommerce #review_form #respond .form-submit input { background: var(--lnmk-cta); }
.woocommerce-verification-required { color: var(--lnmk-muted); font-size: 0.88rem; }

/* ---------- Shared card tweaks used by the designs ---------- */
.lnmk-card__image { aspect-ratio: var(--lnmk-card-ratio, 1 / 1); }
.lnmk-hero__tile { border-radius: calc(var(--lnmk-radius) + 6px); }

/* ---------- Starter design: Fashion ---------- */
.lnmk-design-fashion .lnmk-hero { background: color-mix(in srgb, var(--lnmk-bg) 70%, #e7ddd0); }
.lnmk-design-fashion .lnmk-eyebrow { border-radius: 0; background: transparent; padding-inline: 0; color: var(--lnmk-cta); letter-spacing: 0.2em; }
.lnmk-design-fashion .lnmk-hero__title { font-weight: 500; letter-spacing: -0.02em; }
.lnmk-design-fashion .lnmk-hero__tile { border-width: 0; box-shadow: 0 24px 40px -22px rgba(28, 25, 23, 0.55); border-radius: 0; }
.lnmk-design-fashion .lnmk-hero__tile--1 { border-radius: 999px 999px 0 0; }
.lnmk-design-fashion .lnmk-hero__orb { opacity: 0.55; filter: grayscale(0.6); }
.lnmk-design-fashion .lnmk-btn { text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.8rem; }
.lnmk-design-fashion .lnmk-card { border-color: transparent; background: transparent; }
.lnmk-design-fashion .lnmk-card:hover { box-shadow: none; transform: none; border-color: transparent; }
.lnmk-design-fashion .lnmk-card__body { padding-inline: 2px; }
.lnmk-design-fashion .lnmk-card__title { font-weight: 500; }
.lnmk-design-fashion .lnmk-logo { font-weight: 500; letter-spacing: 0.02em; }
.lnmk-design-fashion .lnmk-promo { background: var(--lnmk-primary); }
.lnmk-design-fashion .lnmk-badge { border-radius: 0; }
.lnmk-design-fashion .lnmk-banner { background: linear-gradient(135deg, #1c1917, #44403c); border-radius: 0; }

/* ---------- Starter design: Electronics ---------- */
.lnmk-design-electronics .lnmk-hero {
	background: radial-gradient(circle at 85% 20%, rgba(56, 189, 248, 0.35), transparent 40%), linear-gradient(135deg, #0b1220, #0c4a6e);
	border-bottom: 0;
}

.lnmk-design-electronics .lnmk-hero__title { color: #fff; }
.lnmk-design-electronics .lnmk-hero__text,
.lnmk-design-electronics .lnmk-hero__points { color: #cbd5e1; }
.lnmk-design-electronics .lnmk-eyebrow { background: rgba(56, 189, 248, 0.16); color: #7dd3fc; }
.lnmk-design-electronics .lnmk-hero .lnmk-btn--outline { border-color: rgba(255, 255, 255, 0.35); color: #fff; }
.lnmk-design-electronics .lnmk-hero .lnmk-btn--outline:hover { background: rgba(255, 255, 255, 0.1); color: #fff; border-color: #fff; }
.lnmk-design-electronics .lnmk-hero__orb--a { background: radial-gradient(circle at 30% 30%, rgba(56, 189, 248, 0.5), rgba(14, 116, 144, 0.1)); }
.lnmk-design-electronics .lnmk-hero__orb--b { background: radial-gradient(circle at 30% 30%, rgba(249, 115, 22, 0.6), rgba(249, 115, 22, 0.05)); }
.lnmk-design-electronics .lnmk-hero__tile { border-color: #0f2a43; background: #0f2a43; }
.lnmk-design-electronics .lnmk-hero__tag { background: rgba(15, 23, 42, 0.88); color: #e2e8f0; }
.lnmk-design-electronics .lnmk-hero__tag strong { color: #7dd3fc; }
.lnmk-design-electronics .lnmk-promo { background: #0b1220; }
.lnmk-design-electronics .lnmk-card { border-color: #dbe4ee; }
.lnmk-design-electronics .lnmk-card__image { background: #fff; }
.lnmk-design-electronics .lnmk-footer { background: #0b1220; }

/* ---------- Starter design: Home & living ---------- */
.lnmk-design-home .lnmk-hero { background: linear-gradient(140deg, #f3e8d9 0%, var(--lnmk-bg) 60%, #fff 100%); }
.lnmk-design-home .lnmk-eyebrow { background: rgba(124, 90, 58, 0.12); color: var(--lnmk-primary); }
.lnmk-design-home .lnmk-hero__title { font-weight: 600; }
.lnmk-design-home .lnmk-hero__tile { border-width: 8px; }
.lnmk-design-home .lnmk-hero__orb--a { background: radial-gradient(circle at 30% 30%, #e9d8c0, #f5ecdf); }
.lnmk-design-home .lnmk-hero__orb--b { background: radial-gradient(circle at 30% 30%, #d9e2c3, #f0f3e6); }
.lnmk-design-home .lnmk-btn { border-radius: 999px; }
.lnmk-design-home .lnmk-card { border-color: #eadfce; }
.lnmk-design-home .lnmk-card__body { padding-bottom: 18px; }
.lnmk-design-home .lnmk-promo { background: #5c4630; }
.lnmk-design-home .lnmk-footer { background: #2e2519; }
.lnmk-design-home .lnmk-banner { background: linear-gradient(135deg, #5c4630, #8a6a47); }
.lnmk-design-home .lnmk-cat__media { background: #f1e7d8; }

@media (max-width: 1100px) {
	.lnmk-recent ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
	.lnmk-recent ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---------- Mobile menu: mega panel becomes a plain list ---------- */
@media (max-width: 860px) {
	.lnmk-nav .lnmk-mega > .sub-menu { padding: 0 0 0 10px; border: 0; border-radius: 0; display: flex; flex-direction: column; }
	.lnmk-nav .lnmk-mega:hover > .sub-menu,
	.lnmk-nav .lnmk-mega:focus-within > .sub-menu { display: flex; }
	.lnmk-mega__img { width: 38px; height: 38px; }
}
