/**
 * Quick-view modal — additive styles only.
 *
 * The bulk of .quick-view-modal__* rules live in assets/css/style.css
 * (synced from HTML/css/style.css lines 671-929). This file only carries:
 *   - [hidden] enforcement for the optional rows (some browsers ignore the
 *     attribute when a parent has display: flex/grid).
 *   - Loading state while the AJAX fetch is in flight.
 *   - Anchor styling inside JS-rendered category/tag lists, since the
 *     base CSS targets handwritten <a> markup not present in our shell.
 */

/* The optional rows (badge, sku-wrap, description, categories-row, tags-row)
   are flex children of their parents; the bare [hidden] attribute doesn't
   override `display: flex/inline-flex` set on the parent's children. */
.quick-view-modal [hidden] {
	display: none !important;
}

/* Hard-hide Bootstrap tooltips while ANY modal is open. The trigger
   button's tooltip can queue up during modal open/close transitions
   and strand on screen even after Bootstrap's own hide() runs. This
   rule kills the visual regardless of where it is in its lifecycle —
   our JS teardown removes the DOM nodes; this catches everything in
   between. */
body.modal-open .tooltip {
	display: none !important;
}

/* Loading state — while the AJAX fetch is in flight (and on re-open, before
   the new product repaints), hide the modal content and show a centred
   spinner. The JS toggles `.quick-view-modal--loading` on open and removes it
   once the response is painted. The close button sits outside __body, so it
   stays clickable. */
.quick-view-modal--loading .quick-view-modal__body {
	position: relative;
	min-height: 340px;
	pointer-events: none;
}

.quick-view-modal--loading .quick-view-modal__row {
	visibility: hidden;
}

.quick-view-modal--loading .quick-view-modal__body::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 42px;
	height: 42px;
	margin: -21px 0 0 -21px;
	border: 3px solid var(--border-color-2, #e5e5e5);
	border-top-color: var(--gold-color, #c7a267);
	border-radius: 50%;
	animation: ellisons-qv-spin 0.7s linear infinite;
}

@keyframes ellisons-qv-spin {
	to { transform: rotate(360deg); }
}

/* JS-rendered category / tag links. The static design has these inline,
   comma-separated. Inherit the parent .quick-view-modal__meta-item color
   tokens so we don't drift from the design system. */
.quick-view-modal__meta [data-qv-categories] a,
.quick-view-modal__meta [data-qv-tags] a {
	color: var(--text-secondary);
	text-decoration: none;
}

.quick-view-modal__meta [data-qv-categories] a:hover,
.quick-view-modal__meta [data-qv-tags] a:hover {
	color: var(--gold-color);
}

/* The wpc-ajax-add-to-cart plugin appends a "View cart" link
   (.added_to_cart) after the button on success — hide it inside the modal,
   consistent with the product cards. */
.quick-view-modal .added_to_cart {
	display: none !important;
}
