/*
 * The wishlist (WPC Smart Wishlist): its heart buttons on product cards and the product page, its popup and page.
 *
 * Moved here 2026-10-22 verbatim from snippet 195 "Wishlist"; loaded on every page, as it was.
 */

/* активное состояние — фирменный фиолетовый */
.woosw-added span.woosw-btn-icon.woosw-icon-8 {
    color: #9100FF;
    text-shadow: 0 1px 3px rgba(0,0,0,0.4);
}
span.woosw-btn-icon {
    /* color: #9100FF; */
    font-size: 22px;
}

.wishlist-button {
    border-radius: 8px;
    z-index: 2;
    background: rgba(0, 0, 0, 0.3);
    /* backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px); */
    padding: 8px;
    position: absolute;
    top: 12px;
    right: 12px;
    display: inline-flex;
    align-items: center;
}
.wishlist-button span.woosw-btn-icon {
    font-size: 22px;
    color: #fff;
    text-shadow: 0 1px 3px rgba(0,0,0,0.5);
}

/* While it is being added, a ring turning in the heart's own box. The plugin turns its icon font's spinner glyph
   (woosw-icon-35), which sits off the centre of that box, so it circled beside the heart's place (Kirill's iPhone,
   2026-10-22). */
.woosw-btn.woosw-adding .woosw-btn-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1em;
    height: 1em;
}

.woosw-btn.woosw-adding .woosw-btn-icon::before {
    content: "";
    width: 0.75em;
    height: 0.75em;
    box-sizing: border-box;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
}


    /* .wishlist-button {
    display: none !important;
}     */

.nk-network-wishlist { display: flex; flex-direction: column; gap: 16px; }

.nk-wishlist-site { border: 1px solid #2a2a2a; border-radius: 12px; overflow: hidden; }

.nk-wishlist-summary {
    cursor: pointer; padding: 14px 18px; font-weight: 600; font-size: 17px;
    list-style: none; display: flex; align-items: center; gap: 8px;
    user-select: none; transition: background .15s ease;
}
.nk-wishlist-summary::-webkit-details-marker { display: none; }
.nk-wishlist-summary:hover { background: #161616; }

/* стрелка справа */
.nk-wishlist-summary::after {
    content: "";
    width: 10px; height: 10px;
    margin-left: auto;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    transition: transform .2s ease;
    opacity: .6; flex-shrink: 0;
}
.nk-wishlist-site[open] > .nk-wishlist-summary::after {
    transform: rotate(-135deg);
}

.nk-wishlist-count { opacity: .55; font-weight: 400; font-size: 14px; }
.nk-wishlist-content { padding: 0 18px 18px; }
.nk-wishlist-empty { opacity: .55; margin: 4px 0 0; }

/* блок "поделиться" */
.nk-wishlist-share {
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
    margin: 0 0 16px; padding: 10px 12px;
    background: #161616; border: 1px solid #2a2a2a; border-radius: 10px;
}
.nk-wishlist-share-label { font-size: 13px; opacity: .7; white-space: nowrap; }
.nk-wishlist-share-input {
    flex: 1; min-width: 140px; padding: 8px 10px; font-size: 13px;
    color: #fff; background: #0d0d0d; border: 1px solid #2a2a2a !important;
    border-radius: 8px !important; outline: none;
}
.nk-wishlist-share-input:focus { border-color: #444; }
.nk-wishlist-share-btn {
    padding: 8px 16px; font-size: 13px; font-weight: 600; border: 0;
    border-radius: 20px; cursor: pointer; white-space: nowrap;
    color: var(--wp--preset--color--secondary, #111);
    background: var(--wp--preset--color--accent, #c5ff00);
    transition: opacity .15s ease;
}
.nk-wishlist-share-btn:hover { opacity: .85; }

.nk-wishlist-grid {
    display: grid; gap: 14px;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
}

.nk-wishlist-item {
    position: relative;
    display: flex; flex-direction: column;
    background: #1a1a1a; border-radius: 10px; overflow: hidden;
    border: 1px solid #262626;
}
.nk-wishlist-item-thumb { display: block; aspect-ratio: 1 / 1; background: #111; }
.nk-wishlist-item-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.nk-wishlist-item-info { padding: 10px 12px; display: flex; flex-direction: column; gap: 4px; flex: 1; }
.nk-wishlist-item-name {
    font-weight: 500; font-size: 14px; line-height: 1.3; text-decoration: none; color: inherit;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.nk-wishlist-item-price { font-size: 14px; }
.nk-wishlist-drop { font-size: 12px; color: #2ecc71; line-height: 1.3; }

.nk-wishlist-item-actions { padding: 0 12px 12px; }
.nk-wishlist-btn {
    display: block; text-align: center; padding: 9px;
    border-radius: 24px; font-size: 13px; font-weight: 600;
    text-decoration: none; cursor: pointer; transition: opacity .15s ease;
}
.nk-wishlist-btn:hover { opacity: .85; }
.nk-wishlist-cart { background: var(--wp--preset--color--accent, #c5ff00); color: var(--wp--preset--color--secondary, #111); }
.nk-wishlist-open { background: #2a2a2a; color: #fff; }

.nk-wishlist-remove {
    position: absolute; top: 4px; right: 4px; z-index: 3;
    width: 26px; height: 26px; border: 0; border-radius: 50%;
    background: rgba(0,0,0,.55); color: #fff; font-size: 18px; line-height: 1;
    cursor: pointer; display: flex; align-items: center; justify-content: center;
    backdrop-filter: blur(3px);
}
.nk-wishlist-remove:hover { background: rgba(0,0,0,.8); }
/* add to cart */
.nk-wishlist-item-actions .added_to_cart.wc-forward {    display: none; }
.nk-wishlist-cart.nk-added { opacity: .7; }
.nk-wishlist-cart.loading { opacity: .6; pointer-events: none; }
.nk-wishlist-cart.nk-added { opacity: .7; }
.nk-wishlist-cart.loading { opacity: .6; pointer-events: none; }
/* ===== Мобильная версия: компактнее, 2 колонки ===== */
@media (max-width: 600px) {
    .nk-wishlist-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
    .nk-wishlist-content { padding: 0 12px 12px; }
    .nk-wishlist-item-name { font-size: 13px; }
    .nk-wishlist-item-info { padding: 8px 10px; }
    .nk-wishlist-item-actions { padding: 0 10px 10px; }
    .nk-wishlist-summary { padding: 12px 14px; font-size: 16px; }
    .nk-wishlist-share-label { display: none; }
    .nk-wishlist-share { padding: 8px 10px; }
}

/* ── The wishlist page ([woosw_list]) ─────────────────────────────────────────── */

/* Its items read as the cart's lines (cart-common.css; Kirill, 2026-10-22: first the plugin's table, an upper-case
   button and a bare cross, then a row that came apart on a phone): the 96px picture; beside it the name, in two lines
   at most, and a price-drop note at the top; the price with the cards' icon cart button (cards.css) and the bin along
   the picture's bottom edge, an old price just above the price. No date and no line between items: 32px apart, as in
   the cart, they read well. Each row becomes a grid, and the info cell hands its lines to it. The link to the list
   under them: inline-forms.css. */
.woosw-list table.woosw-items,
.woosw-list table.woosw-items tbody {
	display: block;
	width: 100%;
	margin: 0;
	border: 0;
}

.woosw-list table.woosw-items tr.woosw-item {
	display: grid;
	grid-template-columns: var(--gp-line-picture) minmax(0, 1fr) auto auto;
	grid-template-rows: auto auto 1fr auto;
	column-gap: 12px;
	padding: 16px 0;
	border: 0;
}

.woosw-list table.woosw-items tr.woosw-item > td {
	display: block;
	padding: 0;
	border: 0;
	background: none;
}

.woosw-list table.woosw-items tr.woosw-item > td.woosw-item--info {
	display: contents;
}

.woosw-list table.woosw-items tr.woosw-item > td.woosw-item--image {
	grid-column: 1;
	grid-row: 1 / 5;
	width: var(--gp-line-picture);
	margin-right: 4px; /* 16px from the text, as in the cart */
}

.woosw-list table.woosw-items .woosw-item .woosw-item--image img {
	display: block;
	width: var(--gp-line-picture);
	height: var(--gp-line-picture);
	object-fit: cover;
	border-radius: 12px;
}

.woosw-list table.woosw-items .woosw-item .woosw-item--name {
	grid-column: 2 / 5;
	grid-row: 1;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 16px; /* as the cart's names: the same spacing in both lists */
	line-height: 21px;
}

.woosw-list table.woosw-items .woosw-item .woosw-item--name a {
	color: var(--wp--preset--color--primary);
	font-size: inherit;
	font-weight: 400;
	line-height: inherit;
	text-decoration: none;
}

.woosw-list table.woosw-items .woosw-item .woosw-item--time {
	display: none;
}

.woosw-list table.woosw-items .woosw-item .woosw-item--price-change {
	grid-column: 2 / 5;
	grid-row: 2;
	margin-top: 4px;
	font-size: 13px;
}

/* The price paid as tall as the buttons beside it; an old price above it, as close as the price's line allows (the
   proximity rule, gp-docs design/interface.md); a sale price's order and sizes: cards.css, "A sale price" */
.woosw-list table.woosw-items .woosw-item .woosw-item--price {
	grid-column: 2;
	grid-row: 4;
	align-self: end;
	display: flex;
	flex-direction: column-reverse;
	align-items: flex-start;
	margin-top: 8px;
	font-size: var(--gp-line-price); /* global.css: smaller below 393px, as the cart's */
	font-weight: 600;
	line-height: 36px;
}

.woosw-list table.woosw-items .woosw-item .woosw-item--price del {
	margin-bottom: var(--gp-line-old-price-pull);
	font-size: var(--gp-line-old-price);
	line-height: 1.1;
}

/* Wider than a phone, 28px and the old price 16px, as in the mini cart's drawer (cart-common.css) */
@media (min-width: 481px) {
	.woosw-list table.woosw-items .woosw-item .woosw-item--price {
		font-size: 28px;
	}

	.woosw-list table.woosw-items .woosw-item .woosw-item--price del {
		margin-bottom: -4px;
		font-size: 16px;
	}
}

.woosw-list table.woosw-items tr.woosw-item > td.woosw-item--actions {
	grid-column: 3;
	grid-row: 4;
	align-self: end;
	display: flex;
	align-items: center;
	gap: 8px;
}

/* The plugin's cross (an icon font glyph, 14px to aim at) as the cart's bin (cart-common.css), 36px to tap, level with
   the cart button */
.woosw-list table.woosw-items tr.woosw-item > td.woosw-item--remove {
	grid-column: 4;
	grid-row: 4;
	align-self: end;
	width: auto;
}

.woosw-list table.woosw-items .woosw-item .woosw-item--remove span {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	color: #7A7A7A;
	cursor: pointer;
	transition: color var(--gp-hover-out) ease;
}

/* While it goes, the plugin's spinner (its own ::before) instead of the bin. The bin takes the span's colour as it
   fades: the plugin turns the glyph red under the pointer (span:hover:before), at once, and back at once as the pointer
   left (Kirill, 2026-10-22: it jerked). */
.woosw-list table.woosw-items .woosw-item .woosw-item--remove span:not(.woosw-item--removing)::before {
	content: "";
	color: inherit;
	width: 20px;
	height: 20px;
	background-color: currentColor;
	-webkit-mask: var(--gp-icon-trash) center / contain no-repeat; /* global.css */
	mask: var(--gp-icon-trash) center / contain no-repeat;
}

@media (hover: hover) {
	.woosw-list table.woosw-items .woosw-item .woosw-item--name a:hover {
		color: var(--wp--preset--color--accent);
	}

	.woosw-list table.woosw-items .woosw-item .woosw-item--remove span:hover {
		color: var(--wp--preset--color--primary);
	}
}

/* ── Every catalog's list on one page (shortcodes/network-wishlist) ─────────────── */

/* A heading over each catalog's rows when more than one catalog has a list; the count grey, as the mini cart's.
   Between the glyphs: 19px from a heading to its rows, 37px from the list above it, 48px from the page's title to the
   first one, so the catalogs sit closer to each other than to the title (Kirill, 2026-10-23: they were 53px apart, the
   first one 25px under the title on a desktop, 40px on a phone). The link to the list keeps its own 24px. Padding: the
   page's first block loses its top margin to WordPress's flow layout (:root :where(.is-layout-flow) > :first-child). */
.gp-network-wishlist {
	padding-top: 24px;
}

.gp-nw-section + .gp-nw-section {
	margin-top: 16px;
}

@media (max-width: 781px) {
	.gp-network-wishlist {
		padding-top: 8px; /* the title's 16px on a phone (layout.css) leave less to add */
	}
}

.gp-nw-title {
	margin: 0;
	font-size: 20px;
	font-weight: 600;
	line-height: 28px;
}

.gp-nw-title .gp-nw-count {
	color: #7A7A7A;
}

@media (max-width: 781px) {
	.gp-nw-title {
		padding-left: var(--gp-phone-gutter); /* as the lists' own (layout.css) */
		padding-right: var(--gp-phone-gutter);
	}
}

/* Another catalog's row: the cards' icon button opens the product in its catalog (each catalog has its own cart), an
   arrow for the cart; the bin as the plugin's, through our own removal (the plugin's would take the current site's
   list). */
.woosw-list .woosw-item--atc a.button.gp-nw-open::before {
	-webkit-mask-image: var(--gp-icon-arrow-right); /* global.css */
	mask-image: var(--gp-icon-arrow-right);
}

.woosw-list table.woosw-items tr.woosw-item > td.gp-nw-remove {
	grid-column: 4;
	grid-row: 4;
	align-self: end;
}

.woosw-list table.woosw-items .woosw-item .gp-nw-remove button {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	padding: 0;
	border: 0;
	background: none;
	color: #7A7A7A;
	cursor: pointer;
	transition: color var(--gp-hover-out) ease;
}

.woosw-list table.woosw-items .woosw-item .gp-nw-remove button::before {
	content: "";
	width: 20px;
	height: 20px;
	background-color: currentColor;
	-webkit-mask: var(--gp-icon-trash) center / contain no-repeat;
	mask: var(--gp-icon-trash) center / contain no-repeat;
}

.woosw-list table.woosw-items .woosw-item.gp-nw-removing {
	opacity: 0.4;
}

@media (hover: hover) {
	.woosw-list table.woosw-items .woosw-item .gp-nw-remove button:hover {
		color: var(--wp--preset--color--primary);
	}
}

/* The header's heart (shortcodes/network-wishlist): the list's place of its own, between the search and the cart, as
   the cart drawn (an outline of the same weight) and counted (its badge, in the same place: the mini cart's numbers,
   cart-common.css). The badge fills with the accent with the icon, by a shadow, as the cart's. No badge at 0. */
.header-wishlist {
	display: flex;
}

.gp-wishlist-link {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	color: #E7E7E7;
	transition: color var(--gp-hover-out) ease;
}

.gp-wishlist-link svg {
	width: 32px;
	height: 32px;
}

.gp-wishlist-count {
	background: #E7E7E7; /* its size and place, the cart's count's too: header.css */
	box-shadow: 0 0 0 2px #121212, inset 0 0 0 1em transparent;
	color: #121212;
	transition: box-shadow var(--gp-hover-out) ease;
}

.gp-wishlist-count[hidden] {
	display: none;
}

@media (hover: hover) {
	.gp-wishlist-link:hover {
		color: var(--wp--preset--color--accent);
	}

	.gp-wishlist-link:hover .gp-wishlist-count {
		box-shadow: 0 0 0 2px #121212, inset 0 0 0 1em var(--wp--preset--color--accent);
	}
}

/* The margin of the plugin's list switcher, whose only content (the list's name) is hidden below. The page's own
   spacing around the list, on a phone: layout.css, with the cart's. */
.woosw-list .woosw-switcher {
	margin-bottom: 0;
}

.woosw-list .woosw-popup-content-mid-message {
	color: #A4A4A4;
	text-align: center;
}

/* woo-smart-wishlist 6.2.0+ prints the list's name (and a rename button) under the page title,
   which already says "Список желаний". Hidden at Kirill's request, 2026-10-21. */
.woosw-name-wrapper { display: none; }

/* "Открыть список →" in the "added to the wishlist" notice (js/wishlist.js), where the site has a wishlist page */
.notiny-theme-woosw .gp-woosw-open {
    display: block;
    margin-top: 4px;
    color: #9100FF;
    font-weight: 500;
}