/*
 * 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, a cross to take it off the list beside the name's first line, and a price-drop note at the top; the price
   and the cards' icon cart button (cards.css) 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 / 4; /* the cross in the fourth */
	grid-row: 1;
	margin-top: 2px; /* as the cart's names, for the picture's rounded corners (cart-common.css) */
	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 / 4;
	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: 4px; /* with the name's 2px above, two lines of name and the price still fit the 88px picture at 360px */
	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, 26px and the old price 15px, 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: 26px;
	}

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

/* The cart button alone at the row's bottom right, where the cards keep theirs and the cart's lines their quantity */
.woosw-list table.woosw-items tr.woosw-item > td.woosw-item--actions {
	grid-column: 3 / 5;
	grid-row: 4;
	justify-self: end;
	align-self: end;
	display: flex;
	align-items: center;
	gap: 8px;
}

/* The plugin's stock note, empty for our products, would take a gap's 8px before the button */
.woosw-list table.woosw-items .woosw-item .woosw-item--stock:empty {
	display: none;
}

/* Taking a product off the list: a grey cross in the row's top right corner, level with the name's first line (its
   middle, 12.5px down, the 36px box's), 36px to tap, the cross's arms 5px in from the row's edge. Not a bin beside the
   cart button: a bin there read as taking it out of the cart, where the bin does that (cart-common.css), and the two
   stood finger to finger (Kirill, 2026-10-23). The plugin's own cross is an icon font glyph, 14px to aim at. */
.woosw-list table.woosw-items tr.woosw-item > :is(td.woosw-item--remove, td.gp-nw-remove) {
	grid-column: 4;
	grid-row: 1;
	align-self: start;
	width: auto;
	margin: -6px -8px 0 0;
}

.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 cross. The cross 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-x) center / contain no-repeat; /* global.css */
	mask: var(--gp-icon-x) 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);
	}
}

/* Once its product is in the cart, the row's cart button opens the mini cart (js/wishlist.js) and says so: grey as
   any, with a green check in its corner, ringed in the page's colour as the header's counts. It stayed lit in the
   accent, which asked to be tapped where the product was already in (Kirill, 2026-10-23: "яркая корзина запутывает");
   the state has to read at a glance, a day later too. WooCommerce's "Открыть корзину" link beside it goes. Not lit by
   a tap's focus either; under the pointer and on keyboard focus it lights as any (cards.css). */
.woosw-list .woosw-item--atc a.added_to_cart {
	display: none;
}

.woosw-list .woosw-item--atc a.button.add_to_cart_button.added {
	overflow: visible;
}

.woosw-list .woosw-item--atc a.button.add_to_cart_button.added:focus:not(:focus-visible) {
	background: rgba(255, 255, 255, 0.1) !important; /* over cards.css's !important accent */
	color: #e7e7e7 !important;
}

.woosw-list .woosw-item--atc a.button.add_to_cart_button.added::after {
	content: "";
	position: absolute;
	top: -5px;
	right: -5px;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: var(--wp--preset--color--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23121212' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / 10px no-repeat; /* lucide's check */
	box-shadow: 0 0 0 2px #121212;
}

/* 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 cross 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 .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-x) center / contain no-repeat;
	mask: var(--gp-icon-x) 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;
}