/* TE Wishlist — button + popover. Colors are CSS variables so themes can override. */

.te-wishlist-button {
	--te-wl-color: #8a8a8a;
	--te-wl-color-hover: #4a4a4a;
	--te-wl-color-active: #e63946;

	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 6px;
	margin: 0;
	background: none;
	border: none;
	line-height: 0;
	cursor: pointer;
	color: var(--te-wl-color);
	transition: color .15s ease, transform .15s ease, opacity .15s ease;
	-webkit-appearance: none;
	appearance: none;
}

.te-wishlist-button__icon,
.te-wishlist-button svg {
	display: inline-block;
	width: 24px;
	height: 24px;
}

/* Default icon's fill follows the button color; the active icon keeps its own. */
.te-wishlist-button__icon:not(.te-wishlist-button__icon--active) svg,
.te-wishlist-button__icon:not(.te-wishlist-button__icon--active) svg path {
	fill: currentColor;
}

/* Two-icon variant: show default when idle, active when saved. */
.te-wishlist-button__icon--active { display: none; }
.te-wishlist-button.is-active .te-wishlist-button__icon--default { display: none; }
.te-wishlist-button.is-active .te-wishlist-button__icon--active { display: inline-block; }

.te-wishlist-button:hover { color: var(--te-wl-color-hover); }

.te-wishlist-button.is-active { color: var(--te-wl-color-active); }
.te-wishlist-button.is-active:active { transform: scale(.92); }

.te-wishlist-button[aria-disabled="true"] {
	opacity: .4;
	cursor: not-allowed;
}

.te-wishlist-button.is-busy {
	opacity: .6;
	pointer-events: none;
}

/* Menu/header shortcode: empty and has-items states share one stable link. */
.te-wishlist-menu-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 0;
	color: inherit;
	text-decoration: none;
}

.te-wishlist-menu-icon__state,
.te-wishlist-menu-icon svg {
	display: inline-block;
	width: 24px;
	height: 24px;
}

.te-wishlist-menu-icon__state--has-items { display: none; }
.te-wishlist-menu-icon.has-items .te-wishlist-menu-icon__state--empty { display: none; }
.te-wishlist-menu-icon.has-items .te-wishlist-menu-icon__state--has-items { display: inline-block; }

/* Popover (multi mode) */
.te-wishlist-popover {
	position: absolute;
	z-index: 99999;
	min-width: 220px;
	max-width: 300px;
	padding: 8px;
	background: #fff;
	border: 1px solid #e2e2e2;
	border-radius: 10px;
	box-shadow: 0 8px 28px rgba(0, 0, 0, .14);
	font-size: 14px;
	color: #222;
}

.te-wishlist-popover__loading,
.te-wishlist-popover__error {
	padding: 8px 6px;
	color: #777;
}

.te-wishlist-popover__lists {
	list-style: none;
	margin: 0;
	padding: 0;
	max-height: 260px;
	overflow: auto;
}

.te-wishlist-popover__lists li { padding: 2px 2px; }

.te-wishlist-popover__lists label {
	display: flex;
	align-items: center;
	gap: 8px;
	cursor: pointer;
	padding: 5px 6px;
	border-radius: 6px;
	font-size: 14px;
	line-height: 1.3;
}

.te-wishlist-popover__lists label:hover { background: #f5f5f5; }

.te-wishlist-popover__label { flex: 1 1 auto; min-width: 0; }

.te-wishlist-popover__status {
	flex: 0 0 auto;
	font-size: 11px;
	opacity: 0;
	transition: opacity .12s ease;
	white-space: nowrap;
}
.te-wishlist-popover__status.is-saving { opacity: 1; color: #999; }
.te-wishlist-popover__status.is-saved  { opacity: 1; color: #2e9e5b; }
.te-wishlist-popover__status.is-error  { opacity: 1; color: #d33; }

.te-wishlist-popover__new {
	display: flex;
	gap: 6px;
	margin-bottom: 8px;
	padding-bottom: 8px;
	border-bottom: 1px solid #eee;
}

.te-wishlist-popover__name {
	flex: 1 1 auto;
	min-width: 0;
	height: 30px;
	padding: 0 8px;
	font-size: 13px;
	line-height: 30px;
	border: 1px solid #ddd;
	border-radius: 6px;
	box-sizing: border-box;
}

.te-wishlist-popover__add {
	flex: 0 0 auto;
	height: 30px;
	padding: 0 12px;
	font-size: 13px;
	line-height: 1;
	border: none;
	border-radius: 6px;
	background: #222;
	color: #fff;
	cursor: pointer;
}

.te-wishlist-popover__add[disabled] { opacity: .5; cursor: default; }

.te-wishlist-popover__foot {
	display: flex;
	justify-content: center;
	margin-top: 8px;
	padding: 0 4px;
}

.te-wishlist-popover__done {
	text-align: center;
	min-width: 120px;
	height: 32px;
	padding: 0 18px;
	font-size: 13px;
	line-height: 1;
	border: 1px solid #ddd;
	border-radius: 6px;
	background: #fff;
	color: #333;
	cursor: pointer;
}
.te-wishlist-popover__done:hover { background: #f2f2f2; }

/* Merkliste — My Account page */
.te-wishlist-account .te-wishlist-list-title {
	margin: 1.2em 0 .5em;
	font-size: 1.05em;
}
.te-wishlist-account .te-wishlist-empty {
	color: #777;
	padding: 8px 0;
}
.te-wishlist-items {
	list-style: none;
	margin: 0 0 1em;
	padding: 0;
}
.te-wishlist-remove {
	flex: 0 0 auto;
	width: 32px;
	height: 32px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
	font-size: 16px;
	border: none;
	border-radius: 50%;
	background: transparent;
	color: #999;
	cursor: pointer;
	transition: background .15s ease, color .15s ease;
}
.te-wishlist-remove:hover { background: #f0f0f0; color: #333; }
.te-wishlist-remove[disabled] { cursor: default; }

/* Merkliste tabs */
.te-wishlist-tabs__nav {
	display: flex;
	gap: 2px;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: thin;
	border-bottom: 1px solid #e2e2e2;
	margin-bottom: 1em;
}
.te-wishlist-tabs__nav::-webkit-scrollbar { height: 6px; }
.te-wishlist-tabs__nav::-webkit-scrollbar-thumb { background: #ccc; border-radius: 3px; }

.te-wishlist-tabs__tab {
	flex: 0 0 auto;
	white-space: nowrap;
	padding: 8px 14px;
	background: none;
	border: none;
	border-bottom: 2px solid transparent;
	color: #666;
	cursor: pointer;
	font-size: 14px;
	line-height: 1.3;
}
.te-wishlist-tabs__tab:hover { color: #333; }
.te-wishlist-tabs__tab.is-active { color: #111; border-bottom-color: #111; }
.te-wishlist-tabs__count { opacity: .55; font-size: 12px; margin-left: 4px; }

.te-wishlist-list-actions {
	display: flex;
	gap: 8px;
	margin-bottom: 12px;
}
.te-wishlist-list-rename,
.te-wishlist-list-delete {
	font-size: 12px;
	padding: 4px 12px;
	height: 30px;
	border: 1px solid #ddd;
	border-radius: 6px;
	background: #fff;
	color: #555;
	cursor: pointer;
}
.te-wishlist-list-rename:hover { background: #f5f5f5; }
.te-wishlist-list-delete { color: #c0392b; border-color: #e3b7b2; }
.te-wishlist-list-delete:hover { background: #fbeae8; }

/* Small inline spinner (e.g. tab rename in progress) */
.te-wishlist-spinner {
	display: inline-block;
	width: 12px;
	height: 12px;
	margin-left: 6px;
	vertical-align: middle;
	border: 2px solid currentColor;
	border-top-color: transparent;
	border-radius: 50%;
	opacity: .6;
	animation: te-wl-spin .6s linear infinite;
}
@keyframes te-wl-spin { to { transform: rotate(360deg); } }

/* In-button loading spinner (remove, delete, add-new-list) */
.te-wl-loading {
	color: transparent !important;
	position: relative;
	pointer-events: none;
}
.te-wl-loading::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 12px;
	height: 12px;
	margin: -6px 0 0 -6px;
	border: 2px solid #999;
	border-top-color: transparent;
	border-radius: 50%;
	animation: te-wl-spin .6s linear infinite;
}

/* Merkliste item layout */
.te-wishlist-item {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: nowrap;
	padding: 10px 0;
	border-bottom: 1px solid #eee;
}

.te-wishlist-item__main {
	min-width: 0;
	display: flex;
	flex-direction: row;
	gap: 16px;
	width: 100%;
}

.te-wishlist-item__img {
	width: 64px;
	height: 64px;
	object-fit: contain;
	border-radius: 6px;
	flex: 0 0 auto;
}

.te-wishlist-item__row {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	gap: 16px;
	min-width: 0;
	width: -webkit-fill-available;
}

.te-wishlist-item__name-note-container {
	display: flex;
	flex-direction: column;
	width: -webkit-fill-available;
	gap: 8px;
}

.te-wishlist-item__name-container {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	width: -webkit-fill-available;
	gap: 4px;
}

.te-wishlist-item__name {
	overflow: hidden;
}

.te-wishlist-item__link {
	text-decoration: none;
	color: inherit;
	width: fit-content;
}

.te-wishlist-note-container {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.te-wishlist-note {
	width: 60%;
	height: 32px;
	padding: 0 8px;
	font-size: 13px;
	border: 1px solid #ddd;
	border-radius: 6px;
	box-sizing: border-box;
	min-width: 16em;
}

.te-wishlist-item__flash {
	flex: 0 0 auto;
	margin-left: 8px;
	font-size: 11px;
	white-space: nowrap;
}
.te-wishlist-item__flash.is-saved { color: #2e9e5b; }
.te-wishlist-item__flash.is-error { color: #d33; }

.te-wishlist-item__controls {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	gap: 6px;
}

.te-wishlist-item__price {
	white-space: nowrap;
	font-size: 0.8em;
	width: fit-content;
}

.te-wishlist-add-cart,
.te-wishlist-add-all {
	height: 30px;
	padding: 0 12px;
	font-size: 12px;
	line-height: 1;
	border: 1px solid #222;
	border-radius: 6px;
	background: #222;
	color: #fff;
	cursor: pointer;
	white-space: nowrap;
}
.te-wishlist-add-cart:hover,
.te-wishlist-add-all:hover { background: #000; }
.te-wishlist-add-cart[disabled],
.te-wishlist-add-all[disabled] { opacity: .7; cursor: default; }

/* 3-dot overflow menu */
.te-wishlist-menu { position: relative; flex: 0 0 auto; }

.te-wishlist-menu__toggle {
	width: 32px;
	height: 32px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 18px;
	line-height: 1;
	border-radius: 50%;
	background: #fff;
	color: #666;
	cursor: pointer;
}
.te-wishlist-menu__toggle:hover { background: #f5f5f5; color: #222; }

.te-wishlist-menu__panel {
	position: absolute;
	right: 0;
	top: calc(100% + 4px);
	z-index: 60;
	min-width: 180px;
	padding: 6px;
	display: flex;
	flex-direction: column;
	gap: 2px;
	background: #fff;
	border: 1px solid #e2e2e2;
	border-radius: 8px;
	box-shadow: 0 8px 24px rgba(0, 0, 0, .12);
}
.te-wishlist-menu__panel[hidden] { display: none; }

.te-wishlist-menu__item {
	text-align: left;
	padding: 6px 8px;
	font-size: 13px;
	line-height: 1.3;
	border: none;
	border-radius: 5px;
	background: none;
	color: #333;
	cursor: pointer;
	white-space: nowrap;
	position: relative;
}
.te-wishlist-menu__item:hover { background: #f3f3f3; }

.te-wishlist-menu__label {
	margin-top: 4px;
	padding: 6px 8px 2px;
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: .04em;
	color: #999;
	border-top: 1px solid #eee;
}

/* Add-to-cart lives in the row on desktop, inside the menu on mobile. */
.te-wishlist-menu-cart { display: none; }

.te-wishlist-item__flash {
	flex: 0 0 auto;
	margin-left: 8px;
	font-size: 11px;
	white-space: nowrap;
}
.te-wishlist-item__flash.is-saved { color: #2e9e5b; }
.te-wishlist-item__flash.is-error { color: #d33; }

@media (max-width: 600px) {
	.te-wishlist-item__controls > .te-wishlist-add-cart { display: none; }
	.te-wishlist-menu-cart { display: block; }
	.te-wishlist-item__name { max-width: none; }
	.te-wishlist-item__img { width: 44px; height: 44px; }
}

@media (min-width: 720px) {
	/* Stays a column: it now holds the name, SKU, signature, attribute list and
	   price, which do not fit on one line. */
	.te-wishlist-item__name-container {
		flex-direction: column;
		padding: 6px 0;
		gap: 4px;
	}

	.te-wishlist-item__name {
		max-width: 420px;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.te-wishlist-note-container {
		flex-direction: row;
		align-items: center;
	}

	.te-wishlist-item__price {
		margin-left: 0;
	}
}

/* Tabs bar + new-wishlist button */
.te-wishlist-tabs {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-bottom: 1em;
}
.te-wishlist-tabs__actions {
	display: flex;
	justify-content: flex-end;
}
.te-wishlist-tabs .te-wishlist-tabs__nav {
	width: 100%;
	margin-bottom: 0;
}
.te-wishlist-add-list {
	flex: 0 0 auto;
	height: 30px;
	padding: 0 12px;
	font-size: 12px;
	line-height: 1;
	white-space: nowrap;
	border: 1px solid #bbb;
	border-radius: 6px;
	background: #fff;
	color: #444;
	cursor: pointer;
}
.te-wishlist-add-list:hover { background: #f5f5f5; color: #111; }
.te-wishlist-add-list[disabled] { opacity: .7; cursor: default; }

/* SKU, signature and attributes */
.te-wishlist-item__sku {
	display: inline-block;
	margin-left: 8px;
	font-size: .75em;
	color: #777;
	white-space: nowrap;
}

.te-wishlist-item__signature {
	display: inline-block;
	margin-left: 8px;
	padding: 1px 6px;
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: .7em;
	color: #555;
	background: #f2f2f2;
	border-radius: 4px;
	white-space: nowrap;
}

.te-wishlist-item__attributes {
	list-style: none;
	margin: 4px 0 0;
	padding: 0;
}
.te-wishlist-item__attribute {
	display: block;
	margin: 0;
	font-size: .78em;
	line-height: 1.4;
	color: #666;
}
.te-wishlist-item__attribute-label { color: #999; }
.te-wishlist-item__attribute-label::after { content: ': '; }
.te-wishlist-item__attribute-value { color: #333; }

/* Shared base for every button the plugin renders. Selectable button text looks
   broken on double-click and on touch drag, so selection is disabled outright. */
.te-button,
.te-wishlist-button,
.te-wishlist-add-cart,
.te-wishlist-add-all,
.te-wishlist-add-list,
.te-wishlist-remove,
.te-wishlist-list-rename,
.te-wishlist-list-delete,
.te-wishlist-menu__toggle,
.te-wishlist-menu__item,
.te-wishlist-tabs__tab,
.te-wishlist-popover__done,
.te-wishlist-popover__add,
.te-wishlist-popover__list {
	cursor: pointer;
	-webkit-touch-callout: none;  /* iOS Safari */
	-webkit-user-select: none;    /* Safari */
	-khtml-user-select: none;     /* Konqueror HTML */
	-moz-user-select: none;       /* Firefox */
	-ms-user-select: none;        /* Internet Explorer/Edge */
	user-select: none;            /* Chrome, Opera, modern browsers */
}
.te-button[disabled],
.te-wishlist-button[disabled],
.te-wishlist-add-cart[disabled],
.te-wishlist-add-all[disabled],
.te-wishlist-add-list[disabled],
.te-wishlist-remove[disabled] { cursor: default; }

/* Standalone wishlist page: rendered by [te_wishlist] outside any theme
   container, so it supplies its own width and breathing room. */
.te-wishlist-account--standalone {
	max-width: 1200px;
	margin: 0 auto;
	padding: 32px 20px 48px;
	box-sizing: border-box;
}

.te-wishlist-login-link {
	display: inline-block;
	margin-top: 8px;
	padding: 8px 18px;
	font-size: 13px;
	line-height: 1;
	border: 1px solid #222;
	border-radius: 6px;
	background: #222;
	color: #fff;
	text-decoration: none;
}
.te-wishlist-login-link:hover { background: #000; color: #fff; }

@media (max-width: 600px) {
	.te-wishlist-account--standalone { padding: 20px 14px 32px; }
}

/* Standalone page: the theme renders the page title outside our container, so
   line it up with the content instead of letting it sit flush to the edge.
   Some builders (Bricks among them) output a bare, class-less <h1>, so the
   direct-child selectors below matter as much as the conventional classes. */
.te-wishlist-page .entry-title,
.te-wishlist-page .page-title,
.te-wishlist-page h1.wp-block-post-title,
.te-wishlist-page .woocommerce-products-header__title,
.te-wishlist-page #brx-content > h1,
.te-wishlist-page .brxe-post-content > h1,
.te-wishlist-page main > h1,
.te-wishlist-page article > h1 {
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
	padding: 0 20px;
	box-sizing: border-box;
	font-size: clamp(1.6rem, 4vw, 2.4rem);
	line-height: 1.2;
	overflow-wrap: break-word;
}

@media (max-width: 600px) {
	.te-wishlist-page .entry-title,
	.te-wishlist-page .page-title,
	.te-wishlist-page h1.wp-block-post-title,
	.te-wishlist-page .woocommerce-products-header__title,
	.te-wishlist-page #brx-content > h1,
	.te-wishlist-page .brxe-post-content > h1,
	.te-wishlist-page main > h1,
	.te-wishlist-page article > h1 {
		padding: 0 14px;
	}

	/* Full-width action row reads better than a floating button on a phone. */
	.te-wishlist-tabs__actions { justify-content: stretch; }
	.te-wishlist-add-list { width: 100%; }

	.te-wishlist-list-actions { flex-wrap: wrap; }
	.te-wishlist-item__main { gap: 12px; }
	.te-wishlist-note { min-width: 0; width: 100%; }
}

/* Catch-all, kept in its own block on purpose: a browser that does not support
   :has() discards the entire rule it appears in, which would take the selectors
   above down with it. Matches whatever heading immediately precedes the
   wishlist, whatever the theme decided to call it. */
.te-wishlist-page h1:has(+ .te-wishlist-account--standalone),
.te-wishlist-page h2:has(+ .te-wishlist-account--standalone) {
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
	padding: 0 20px;
	box-sizing: border-box;
	font-size: clamp(1.6rem, 4vw, 2.4rem);
	line-height: 1.2;
	overflow-wrap: break-word;
}

@media (max-width: 600px) {
	.te-wishlist-page h1:has(+ .te-wishlist-account--standalone),
	.te-wishlist-page h2:has(+ .te-wishlist-account--standalone) {
		padding: 0 14px;
	}
}