.f360-tour-wrapper {
	--f360-accent: #d1a13a;
	--f360-accent-dark: #b6862a;
	--f360-ink: #16181c;
	--f360-surface: rgba(255, 255, 255, 0.86);
	--f360-radius: 14px;
	--f360-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

	position: relative;
	width: 100%;
	background: #101114;
	/* Edge-to-edge like a real 360 tour, not a rounded "widget in a box" -
	   rounded corners only belong on the floating UI chrome (cards,
	   panels, buttons) below, never on the main viewport itself. */
	border-radius: 0;
	overflow: hidden;
	font-family: var(--f360-font);
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
}

.f360-tour-wrapper *,
.f360-tour-wrapper *::before,
.f360-tour-wrapper *::after {
	box-sizing: border-box;
}

/* Fullscreen: fill the actual screen instead of being stretched inside
   whatever fixed height the shortcode was given. Marzipano tracks its
   container's size automatically, so once the wrapper and pano genuinely
   resize to the screen, the render resizes correctly instead of being
   visually stretched by the browser. */
.f360-tour-wrapper:fullscreen,
.f360-tour-wrapper:-webkit-full-screen,
.f360-tour-wrapper:-ms-fullscreen {
	width: 100vw !important;
	height: 100vh !important;
	border-radius: 0 !important;
}

.f360-tour-wrapper:fullscreen .f360-pano,
.f360-tour-wrapper:-webkit-full-screen .f360-pano,
.f360-tour-wrapper:-ms-fullscreen .f360-pano {
	width: 100% !important;
	height: 100% !important;
}

/* Full-page mode ([xohar_360_tour height="full"]): pin the wrapper to the
   real browser viewport with position:fixed, completely independent of
   whatever padding/margins the theme's page/content wrapper adds around
   the shortcode. This is the only way to guarantee zero leftover white
   space regardless of the page builder or theme it's dropped into. */
.f360-tour-wrapper.f360-fullpage-mode {
	position: fixed !important;
	inset: 0 !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	width: 100vw !important;
	height: 100vh !important;
	max-height: 100vh !important;
	margin: 0 !important;
	transform: none !important;
	z-index: 2147483647;
}

/* Stops the underlying page from scrolling at all while the full-page
   tour is active, so nothing behind it (whatever theme/page-builder
   section is reserving extra height) can ever be scrolled into view. */
html.f360-fullpage-active,
html.f360-fullpage-active body {
	overflow: hidden !important;
	height: 100% !important;
	margin: 0 !important;
}

.f360-pano {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	cursor: -webkit-grab;
	cursor: grab;
}

.f360-pano:active {
	cursor: -webkit-grabbing;
	cursor: grabbing;
}

/* ============ Pano area (fills the whole wrapper - no header now) ============ */

.f360-pano-area {
	position: relative;
	flex: 1 1 auto;
	min-height: 0;
	overflow: hidden;
}

/* ============ Home button ============ */

.f360-home-btn {
	position: absolute;
	top: 14px;
	left: 14px;
	z-index: 5;
	width: 38px;
	height: 38px;
	border-radius: 10px;
	background: rgba(16, 17, 20, 0.72) !important;
	border: 1px solid rgba(255, 255, 255, 0.2) !important;
	color: #fff !important;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	padding: 0 !important;
	box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3);
	transition: background 0.15s ease, transform 0.1s ease;
}

.f360-home-btn:hover {
	background: rgba(16, 17, 20, 0.9) !important;
	transform: translateY(-1px);
}

/* ============ Intro animation ============ */

/* Full-bleed, no letterboxing regardless of the uploaded clip's aspect
   ratio - object-fit: cover crops to fill rather than adding bars. Sits
   above the pano and everything else while it plays, then fades out and
   is removed once it finishes (or, for a .gif with no natural "ended"
   event, once the configured duration elapses) - independent of how
   much of the actual panorama has loaded by that point. */
.f360-intro {
	position: absolute;
	inset: 0;
	z-index: 20;
	background: #101114;
	opacity: 1;
	transition: opacity 0.4s ease;
}

.f360-intro.f360-intro-hidden {
	opacity: 0;
	pointer-events: none;
}

.f360-intro video,
.f360-intro img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* ============ Toolbar ============ */

.f360-toolbar {
	position: absolute;
	top: 14px;
	left: 64px;
	right: 14px;
	z-index: 5;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 10px;
}

.f360-search-box {
	position: relative;
	flex: 0 1 220px;
}

.f360-search-box input {
	width: 100% !important;
	box-sizing: border-box !important;
	background: rgba(16, 17, 20, 0.55) !important;
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	border: 1px solid rgba(255, 255, 255, 0.25) !important;
	border-radius: 20px !important;
	color: #fff !important;
	font-size: 13px !important;
	line-height: normal !important;
	font-family: var(--f360-font) !important;
	padding: 9px 14px !important;
	margin: 0 !important;
	outline: none !important;
	box-shadow: none !important;
	-webkit-appearance: none;
	appearance: none;
	height: auto !important;
}

.f360-search-box input::placeholder {
	color: rgba(255, 255, 255, 0.65);
}

.f360-search-results {
	position: absolute;
	top: calc(100% + 6px);
	left: 0;
	right: 0;
	background: #fff;
	border-radius: 10px;
	box-shadow: 0 10px 26px rgba(0, 0, 0, 0.25);
	overflow: hidden;
	max-height: 220px;
	overflow-y: auto;
}

.f360-search-result-row,
.f360-search-empty {
	padding: 9px 12px;
	font-size: 13px;
	color: var(--f360-ink);
	cursor: pointer;
}

.f360-search-empty {
	color: #888;
	cursor: default;
}

.f360-search-result-row:hover {
	background: #f4f2ec;
}

.f360-toolbar-buttons {
	display: flex;
	gap: 8px;
	flex-shrink: 0;
}

.f360-toolbar-btn {
	width: 36px !important;
	height: 36px !important;
	min-width: 36px !important;
	min-height: 36px !important;
	max-width: 36px;
	max-height: 36px;
	flex: 0 0 36px;
	border-radius: 50% !important;
	background: rgba(16, 17, 20, 0.55) !important;
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	border: 1px solid rgba(255, 255, 255, 0.25) !important;
	color: #fff !important;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	position: relative;
	padding: 0 !important;
	margin: 0 !important;
	line-height: normal !important;
	font-size: 0 !important;
	box-shadow: none;
	transition: background 0.15s ease, transform 0.1s ease;
}

.f360-toolbar-btn svg {
	flex-shrink: 0;
	display: block;
}

.f360-toolbar-btn:hover {
	background: rgba(16, 17, 20, 0.8);
	transform: translateY(-1px);
}

.f360-toolbar-btn.is-playing {
	color: var(--f360-accent);
	border-color: var(--f360-accent);
}

.f360-badge-count {
	position: absolute;
	top: -4px;
	right: -4px;
	background: var(--f360-accent);
	color: #1a1408;
	font-size: 10px;
	font-weight: 700;
	line-height: 1;
	padding: 3px 5px;
	border-radius: 999px;
	min-width: 14px;
	text-align: center;
}

/* ============ Location pill ============ */

.f360-location-pill {
	position: absolute;
	bottom: 16px;
	left: 16px;
	z-index: 4;
	display: flex;
	align-items: center;
	gap: 6px;
	color: #fff;
	font-family: var(--f360-font);
	font-size: 12px;
	font-weight: 600;
	background: rgba(16, 17, 20, 0.62);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	border: 1px solid rgba(255, 255, 255, 0.2);
	padding: 8px 14px 8px 11px;
	border-radius: 20px;
	letter-spacing: 0.2px;
	box-shadow: 0 3px 10px rgba(0, 0, 0, 0.25);
}

.f360-location-pill svg {
	flex-shrink: 0;
	color: var(--f360-accent);
}

/* ============ Minimap ============ */

.f360-minimap {
	position: absolute;
	top: 60px;
	right: 14px;
	z-index: 6;
	width: 190px;
	background: rgba(16, 17, 20, 0.72);
	backdrop-filter: blur(10px);
	border: 1px solid rgba(255, 255, 255, 0.15);
	border-radius: 12px;
	padding: 10px;
	color: #fff;
}

.f360-minimap-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 12px;
	margin-bottom: 6px;
	opacity: 0.85;
}

.f360-minimap-svg {
	width: 100%;
	height: auto;
}

.f360-minimap-line {
	stroke: rgba(255, 255, 255, 0.35);
	stroke-width: 1.5;
}

.f360-minimap-dot {
	fill: rgba(255, 255, 255, 0.85);
	stroke: rgba(16, 17, 20, 0.8);
	stroke-width: 2;
	cursor: pointer;
	transition: fill 0.15s ease, r 0.15s ease;
}

.f360-minimap-node:hover .f360-minimap-dot {
	fill: var(--f360-accent);
}

.f360-minimap-node.is-active .f360-minimap-dot {
	fill: var(--f360-accent);
	r: 11;
}

.f360-minimap-label {
	fill: #fff;
	font-size: 8px;
	font-family: var(--f360-font);
	pointer-events: none;
}

/* ============ Panel (shared: wishlist) ============ */

.f360-panel-close {
	background: none;
	border: none;
	color: inherit;
	font-size: 16px;
	line-height: 1;
	cursor: pointer;
	opacity: 0.75;
}

.f360-panel-close:hover {
	opacity: 1;
}

.f360-wishlist-panel {
	position: absolute;
	top: 60px;
	right: 14px;
	z-index: 6;
	width: 230px;
	max-height: 60%;
	overflow-y: auto;
	background: rgba(255, 255, 255, 0.95);
	backdrop-filter: blur(10px);
	border-radius: 12px;
	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.3);
	padding: 12px;
}

.f360-wishlist-panel-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 13px;
	font-weight: 700;
	color: var(--f360-ink);
	margin-bottom: 8px;
}

.f360-wishlist-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.f360-wishlist-item {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 6px 0;
	border-bottom: 1px solid #eee;
	cursor: pointer;
}

.f360-wishlist-item img {
	width: 38px;
	height: 38px;
	object-fit: cover;
	border-radius: 6px;
	flex-shrink: 0;
	background: #eee;
}

.f360-wishlist-item-info {
	flex: 1;
	min-width: 0;
}

.f360-wishlist-item-name {
	font-size: 12px;
	font-weight: 600;
	color: var(--f360-ink);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.f360-wishlist-item-price {
	font-size: 11px;
	color: var(--f360-accent-dark);
	font-weight: 700;
}

.f360-wishlist-item-remove {
	background: none;
	border: none;
	color: #999;
	font-size: 16px;
	cursor: pointer;
	padding: 4px;
}

.f360-wishlist-empty {
	font-size: 12px;
	color: #888;
	text-align: center;
	margin: 10px 0 4px;
}

/* ============ Hotspots ============ */

.f360-hotspot {
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* --- Navigation: plain dot --- */

.f360-hotspot-nav.f360-hotspot-dot {
	width: 30px;
	height: 30px;
}

.f360-hotspot-dot-icon {
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background: #ffffff;
	box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.35), 0 2px 6px rgba(0, 0, 0, 0.45);
	transition: transform 0.15s ease;
	animation: f360-blink-soft 2.2s ease-in-out infinite;
}

.f360-hotspot-nav.f360-hotspot-dot:hover .f360-hotspot-dot-icon {
	transform: scale(1.25);
}

/* --- Navigation: door (room-to-room) --- */

.f360-hotspot-nav.f360-hotspot-door {
	width: 34px;
	height: 34px;
}

.f360-hotspot-door-icon {
	width: 30px;
	height: 30px;
	border-radius: 9px;
	background: rgba(20, 20, 22, 0.78);
	border: 1.5px solid rgba(255, 255, 255, 0.85);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.45);
	transition: transform 0.15s ease;
	animation: f360-blink-glow 1.8s ease-in-out infinite;
}

.f360-hotspot-nav.f360-hotspot-door:hover .f360-hotspot-door-icon {
	transform: scale(1.15);
}

@keyframes f360-blink-soft {
	0%, 100% { opacity: 1; }
	50% { opacity: 0.45; }
}

@keyframes f360-blink-glow {
	0%, 100% { box-shadow: 0 2px 8px rgba(0, 0, 0, 0.45), 0 0 0 0 rgba(255, 255, 255, 0.35); }
	50% { box-shadow: 0 2px 8px rgba(0, 0, 0, 0.45), 0 0 0 6px rgba(255, 255, 255, 0); }
}

/* --- Product: circular thumbnail (or dot fallback) + blinking ring --- */

.f360-hotspot-product {
	width: 40px;
	height: 40px;
	position: relative;
}

.f360-hotspot-product-ring {
	position: absolute;
	inset: 0;
	border-radius: 50%;
	border: 2px solid var(--f360-accent);
	animation: f360-ring-pulse 2s infinite;
	pointer-events: none;
}

@keyframes f360-ring-pulse {
	0% { box-shadow: 0 0 0 0 rgba(209, 161, 58, 0.55); opacity: 1; }
	70% { box-shadow: 0 0 0 9px rgba(209, 161, 58, 0); opacity: 0.5; }
	100% { box-shadow: 0 0 0 0 rgba(209, 161, 58, 0); opacity: 1; }
}

.f360-hotspot-product-thumb {
	position: absolute;
	top: 4px;
	left: 4px;
	right: 4px;
	bottom: 4px;
	border-radius: 50%;
	overflow: hidden;
	border: 2px solid #fff;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4);
	transition: transform 0.15s ease;
}

.f360-hotspot-product-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.f360-hotspot-product-dot {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 12px;
	height: 12px;
	transform: translate(-50%, -50%);
	border-radius: 50%;
	background: var(--f360-accent);
	border: 2px solid #fff;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
	transition: transform 0.15s ease;
}

.f360-hotspot-product:hover .f360-hotspot-product-thumb,
.f360-hotspot-product:hover .f360-hotspot-product-dot {
	transform: scale(1.15);
}

.f360-hotspot-product:hover .f360-hotspot-product-dot {
	transform: translate(-50%, -50%) scale(1.3);
}

.f360-hotspot-category-badge {
	position: absolute;
	bottom: -2px;
	right: -2px;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: var(--f360-ink);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1.5px solid #fff;
}

.f360-hotspot-highlight .f360-hotspot-product-ring {
	border-color: #fff;
	animation: f360-ring-pulse-highlight 1s infinite;
}

@keyframes f360-ring-pulse-highlight {
	0% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.8); }
	70% { box-shadow: 0 0 0 12px rgba(255, 255, 255, 0); }
	100% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0); }
}

.f360-hotspot-tooltip {
	position: absolute;
	bottom: calc(100% + 8px);
	left: 50%;
	transform: translateX(-50%) translateY(4px);
	background: rgba(18, 18, 20, 0.92);
	color: #fff;
	padding: 6px 10px;
	border-radius: 8px;
	white-space: nowrap;
	font-size: 12px;
	line-height: 1.4;
	display: flex;
	flex-direction: column;
	align-items: center;
	pointer-events: none;
	opacity: 0;
	transition: opacity 0.15s ease, transform 0.15s ease;
	z-index: 3;
}

.f360-hotspot-tooltip::after {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
	border: 5px solid transparent;
	border-top-color: rgba(18, 18, 20, 0.92);
}

.f360-hotspot-tooltip-name {
	font-weight: 600;
}

.f360-hotspot-tooltip-price {
	color: var(--f360-accent);
	font-weight: 700;
	margin-top: 1px;
}

.f360-hotspot-product:hover .f360-hotspot-tooltip {
	opacity: 1;
	transform: translateX(-50%) translateY(0);
}

/* ============ Bottom toolbar (zoom / reset / map / refresh) ============ */

.f360-bottom-toolbar {
	position: absolute;
	bottom: 16px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 4;
	display: flex;
	align-items: center;
	gap: 6px;
	background: rgba(16, 17, 20, 0.68);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	border: 1px solid rgba(255, 255, 255, 0.2);
	border-radius: 14px;
	padding: 6px;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.3);
}

.f360-zoom-group {
	display: flex;
	border-radius: 9px;
	overflow: hidden;
}

.f360-bt-btn {
	display: flex;
	align-items: center;
	gap: 6px;
	background: transparent !important;
	border: none !important;
	color: #fff !important;
	font-family: var(--f360-font);
	font-size: 11.5px !important;
	font-weight: 600;
	padding: 8px 12px !important;
	margin: 0 !important;
	cursor: pointer;
	border-radius: 9px !important;
	white-space: nowrap;
	transition: background 0.15s ease;
}

.f360-bt-btn:hover {
	background: rgba(255, 255, 255, 0.12) !important;
}

.f360-bt-btn svg {
	flex-shrink: 0;
	display: block;
}

.f360-bt-zoom {
	font-size: 16px !important;
	font-weight: 700;
	padding: 8px 14px !important;
	border-radius: 0 !important;
}

.f360-zoom-group .f360-bt-zoom:first-child {
	border-right: 1px solid rgba(255, 255, 255, 0.15) !important;
}

.f360-bt-icon-only {
	padding: 8px !important;
}

/* ============ Cart bar ============ */

.f360-cart-bar {
	position: absolute;
	bottom: 16px;
	right: 16px;
	z-index: 4;
	display: flex;
	align-items: center;
	gap: 10px;
	background: rgba(16, 17, 20, 0.68);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	border: 1px solid rgba(255, 255, 255, 0.2);
	border-radius: 20px;
	padding: 8px 8px 8px 14px;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.3);
}

.f360-cart-bar-count {
	display: flex;
	align-items: center;
	gap: 6px;
	color: #fff;
	font-family: var(--f360-font);
	font-size: 12.5px;
	font-weight: 600;
}

.f360-checkout-btn {
	background: var(--f360-accent);
	color: #1a1408;
	text-decoration: none;
	font-family: var(--f360-font);
	font-size: 12.5px;
	font-weight: 700;
	padding: 7px 14px;
	border-radius: 14px;
	transition: background 0.15s ease;
}

.f360-checkout-btn:hover {
	background: var(--f360-accent-dark);
	color: #fff;
}

/* ============ Product card (glassmorphism) ============ */

.f360-product-card {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 300px;
	max-width: 88%;
	background: var(--f360-surface);
	backdrop-filter: blur(16px) saturate(160%);
	-webkit-backdrop-filter: blur(16px) saturate(160%);
	border: 1px solid rgba(255, 255, 255, 0.4);
	border-radius: var(--f360-radius);
	box-shadow: 0 20px 45px rgba(0, 0, 0, 0.35), 0 2px 8px rgba(0, 0, 0, 0.15);
	z-index: 10;
	overflow: hidden;
	font-family: var(--f360-font);
	transform: translate(-50%, -50%) scale(1);
	opacity: 1;
	transition: opacity 0.2s ease, transform 0.2s ease;
}

.f360-product-card.f360-card-hidden {
	opacity: 0;
	transform: translate(-50%, -47%) scale(0.94);
	pointer-events: none;
}

.f360-card-close,
.f360-card-wishlist-btn {
	position: absolute;
	top: 8px;
	width: 34px;
	height: 34px;
	min-width: 44px;
	min-height: 44px;
	margin: -5px;
	background: rgba(255, 255, 255, 0.92);
	color: #1a1a1a;
	border: none;
	border-radius: 50%;
	line-height: 1;
	cursor: pointer;
	z-index: 2;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
	transition: transform 0.12s ease;
	display: flex;
	align-items: center;
	justify-content: center;
}

.f360-card-close {
	right: 8px;
	font-size: 20px;
}

.f360-card-wishlist-btn {
	left: 8px;
	color: #b3311f;
}

.f360-card-wishlist-btn.is-active svg path {
	fill: #e0392a;
}

.f360-card-close:hover,
.f360-card-wishlist-btn:hover {
	transform: scale(1.08);
}

.f360-card-image-wrap {
	width: 100%;
	height: 170px;
	background: #f2f0ec;
	position: relative;
	overflow: hidden;
}

.f360-card-gallery {
	position: relative;
	width: 100%;
	height: 100%;
}

.f360-card-gallery-img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0;
	transition: opacity 0.25s ease;
}

.f360-card-gallery-img.is-active {
	opacity: 1;
}

.f360-card-gallery-dots {
	position: absolute;
	bottom: 10px;
	left: 0;
	right: 0;
	display: flex;
	justify-content: center;
	gap: 6px;
	z-index: 2;
}

.f360-card-gallery-dot {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.55);
	cursor: pointer;
	transition: background 0.15s ease, transform 0.15s ease;
}

.f360-card-gallery-dot.is-active {
	background: #fff;
	transform: scale(1.3);
}

.f360-card-badge {
	position: absolute;
	top: 10px;
	left: 10px;
	background: var(--f360-accent);
	color: #1a1408;
	font-size: 10px;
	font-weight: 800;
	letter-spacing: 0.3px;
	text-transform: uppercase;
	padding: 5px 9px;
	border-radius: 6px;
	z-index: 2;
}

.f360-card-body {
	padding: 16px 18px 18px;
}

.f360-card-body h4 {
	margin: 0 0 4px;
	font-size: 16px;
	font-weight: 700;
	color: var(--f360-ink);
	letter-spacing: -0.1px;
}

.f360-card-rating {
	margin-bottom: 6px;
	font-size: 12px;
	color: #d8d8d8;
	letter-spacing: 1px;
}

.f360-card-rating .f360-star.is-filled {
	color: var(--f360-accent);
}

.f360-card-price-row {
	display: flex;
	align-items: baseline;
	gap: 8px;
	margin-bottom: 8px;
}

.f360-card-price {
	font-size: 16px;
	font-weight: 800;
	color: var(--f360-ink);
}

.f360-card-price:empty {
	display: none;
}

.f360-card-original-price {
	font-size: 12px;
	color: #98988f;
	text-decoration: line-through;
}

.f360-card-body p {
	font-size: 13px;
	color: #62666e;
	line-height: 1.5;
	margin: 0 0 14px;
}

.f360-card-body p:empty {
	display: none;
}

.f360-card-buy-btn {
	display: block;
	width: 100%;
	box-sizing: border-box;
	text-align: center;
	background: var(--f360-ink);
	color: #fff;
	text-decoration: none;
	border: none;
	padding: 11px 18px;
	border-radius: 9px;
	font-size: 13px;
	font-family: var(--f360-font);
	font-weight: 600;
	letter-spacing: 0.2px;
	cursor: pointer;
	margin: 0 0 8px;
	transition: background 0.15s ease, transform 0.1s ease;
}

.f360-card-buy-btn:hover {
	background: var(--f360-accent-dark);
	transform: translateY(-1px);
}

.f360-card-add-cart-btn {
	background: var(--f360-accent);
	color: #1a1408;
}

.f360-card-add-cart-btn:hover {
	background: var(--f360-accent-dark);
	color: #fff;
}

.f360-card-add-cart-btn:disabled {
	opacity: 0.6;
	cursor: not-allowed;
	transform: none !important;
}

.f360-card-details-link {
	display: block;
	text-align: center;
	margin-top: 10px;
	font-size: 12px;
	color: #62666e;
	text-decoration: underline;
}

.f360-card-details-link:hover {
	color: var(--f360-ink);
}

/* ============ Watermark ============ */

.f360-watermark {
	position: absolute;
	bottom: 14px;
	right: 14px;
	max-width: 90px;
	max-height: 36px;
	opacity: 0.85;
	z-index: 4;
	pointer-events: none;
}

/* ============ Toast ============ */

.f360-toast {
	position: absolute;
	bottom: 24px;
	left: 50%;
	transform: translateX(-50%) translateY(10px);
	background: rgba(16, 17, 20, 0.9);
	color: #fff;
	font-size: 13px;
	padding: 9px 16px;
	border-radius: 20px;
	opacity: 0;
	transition: opacity 0.25s ease, transform 0.25s ease;
	z-index: 20;
	pointer-events: none;
}

.f360-toast.is-visible {
	opacity: 1;
	transform: translateX(-50%) translateY(0);
}

/* ============ Mobile responsiveness ============ */

@media (max-width: 700px) {
	.f360-product-card {
		position: absolute;
		top: auto;
		bottom: 0;
		left: 0;
		width: 100%;
		max-width: 100%;
		border-radius: 18px 18px 0 0;
		transform: translateY(0);
	}

	.f360-product-card.f360-card-hidden {
		transform: translateY(100%);
		opacity: 1;
	}

	.f360-card-image-wrap {
		height: 150px;
	}

	.f360-home-btn {
		width: 34px;
		height: 34px;
		top: 10px;
		left: 10px;
	}

	.f360-toolbar {
		top: 10px;
		left: 56px;
		right: 10px;
	}

	.f360-location-pill {
		font-size: 10.5px;
		padding: 6px 10px 6px 9px;
		max-width: 42vw;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
	}

	.f360-bottom-toolbar {
		padding: 4px;
		gap: 3px;
	}

	.f360-bt-btn span {
		display: none;
	}

	.f360-bt-btn {
		padding: 7px 9px !important;
	}

	.f360-bt-zoom {
		padding: 7px 10px !important;
	}

	/* Mobile keeps navigation simple: hotspot dots + the Map button only.
	   Zoom, Reset View and Refresh clutter the bottom row on small
	   screens and get hidden behind/under it, so they're dropped here
	   (still available on desktop). */
	.f360-zoom-group,
	#f360-reset-view-btn,
	#f360-refresh-btn {
		display: none !important;
	}

	/* Map button moves to the bottom-right, stacked a bit above the cart
	   bar so it clears both the cart bar and the phone's own bottom
	   gesture/nav bar instead of hiding under either. */
	.f360-bottom-toolbar {
		left: auto;
		right: 12px;
		bottom: 74px;
		transform: none;
		padding: 4px;
	}

	.f360-cart-bar {
		padding: 6px 6px 6px 10px;
	}

	.f360-cart-bar-count {
		font-size: 11px;
	}

	.f360-checkout-btn {
		font-size: 11px;
		padding: 6px 10px;
	}

	.f360-hotspot-nav.f360-hotspot-dot,
	.f360-hotspot-nav.f360-hotspot-door {
		width: 30px;
		height: 30px;
	}

	.f360-hotspot-product {
		width: 40px;
		height: 40px;
	}

	.f360-search-box {
		flex: 1 1 auto;
	}

	.f360-minimap,
	.f360-wishlist-panel {
		width: calc(100% - 28px);
		right: 14px;
		left: 14px;
	}
}

.f360-hidden {
	display: none !important;
}

/* Shown only to logged-in admins, only when the plugin isn't activated yet */
.f360-not-activated-notice {
	background: #fff8e5;
	border: 1px solid #e5c07b;
	border-radius: 8px;
	padding: 12px 16px;
	font-size: 14px;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	color: #4a3c0e;
	max-width: 640px;
}