/* =================================================================
   ФБ — Полоса доверия и бейджи товаров v2.1.0
   Стиль сайта cvety180.ru: тонкие золотые обводки (как карточки
   товаров), плоский тёмный фон, без глянца и бликов.
   ================================================================= */

@keyframes fb-dot-pulse {
	0%, 100% { box-shadow: 0 0 0 0 rgba(224, 48, 48, .8); }
	50%      { box-shadow: 0 0 0 5px rgba(224, 48, 48, 0); }
}
@keyframes fb-timer-glow {
	0%, 100% { color: #e8b86d; }
	50%      { color: #f8d898; }
}
@keyframes fb-fade-in {
	from { opacity: 0; transform: translateY(-6px); }
	to   { opacity: 1; transform: translateY(0); }
}

/* Обёртка всей полосы */
.fb-trust {
	width: 100%;
	box-sizing: border-box;
	animation: fb-fade-in .4s ease both;
}
.fb-trust *,
.fb-trust *::before,
.fb-trust *::after {
	box-sizing: border-box;
}

/* =================================================================
   URGENCY — строка с таймером. Тонкая золотая обводка, плоско.
   ================================================================= */
.fb-urgency {
	display: none;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 10px;

	width: fit-content;
	max-width: calc(100% - 24px);
	margin: 10px auto 0;
	padding: 7px 18px;

	border-radius: 999px;
	background: rgba(255, 255, 255, .02);
	border: 1px solid rgba(201, 164, 78, .30);
}
.fb-urgency.fb-visible {
	display: flex;
}

.fb-urgency .fb-live {
	display: flex;
	align-items: center;
	gap: 6px;
}
/* Заскоуплено — не трогает точки слайдера товаров */
.fb-urgency .fb-dot {
	display: inline-block;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #e03030;
	flex-shrink: 0;
	animation: fb-dot-pulse 1.4s ease-in-out infinite;
}
.fb-urgency .fb-live-label {
	font-size: 10px;
	font-weight: 700;
	color: #e03030;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	line-height: 1;
}

/* Тексты режимов: по data-mode показываем нужный */
.fb-u-msg { display: none; align-items: center; gap: 6px; }
.fb-urgency[data-mode="today"]    .fb-u-msg--today    { display: inline-flex; }
.fb-urgency[data-mode="tomorrow"] .fb-u-msg--tomorrow { display: inline-flex; }

.fb-urgency-text--full {
	font-size: 12px;
	color: rgba(255, 255, 255, .55);
	line-height: 1.3;
}
.fb-urgency-text--short {
	display: none;
	font-size: 12px;
	color: rgba(255, 255, 255, .60);
	line-height: 1.3;
}

.fb-timer {
	font-size: 13px;
	font-weight: 700;
	color: #e8b86d;
	letter-spacing: .08em;
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	font-variant-numeric: tabular-nums;
	animation: fb-timer-glow 1.6s ease-in-out infinite;
}

/* Пилюли режимов */
.fb-pill {
	font-size: 10px;
	font-weight: 600;
	padding: 3px 10px;
	border-radius: 100px;
	white-space: nowrap;
	line-height: 1.6;
	display: none;
}
.fb-pill--today {
	background: rgba(200, 40, 40, .16);
	border: 1px solid rgba(200, 40, 40, .38);
	color: #f08080;
}
.fb-pill--tomorrow {
	background: rgba(201, 164, 78, .12);
	border: 1px solid rgba(201, 164, 78, .38);
	color: #e8c97a;
}
.fb-urgency[data-mode="today"]    .fb-pill--today    { display: inline-block; }
.fb-urgency[data-mode="tomorrow"] .fb-pill--tomorrow { display: inline-block; }

/* В режиме «завтра» точка золотая, спокойная */
.fb-urgency[data-mode="tomorrow"] .fb-dot {
	background: #c9a84c;
	animation: none;
	box-shadow: 0 0 6px rgba(201, 168, 76, .5);
}
.fb-urgency[data-mode="tomorrow"] .fb-live-label {
	color: #c9a84c;
}

/* =================================================================
   ПОЛОСА ПРЕИМУЩЕСТВ — как карточки товаров: тонкое золото, плоско
   ================================================================= */
.fb-bar {
	background: transparent;
	width: 100%;
	padding: 10px 12px;
}
.fb-inner {
	display: flex;
	flex-direction: row;
	align-items: stretch;
	justify-content: center;
	gap: 10px;
	width: 100%;
	max-width: 1280px;
	margin: 0 auto;
}

/* Пункт — в стиле карточки товара */
.fb-item {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 11px 20px;
	flex: 1;
	min-width: 0;
	position: relative;
	cursor: default;

	border-radius: 14px;
	background: transparent;
	border: 1px solid rgba(201, 164, 78, .28);
	transition: border-color .25s ease, background .25s ease;
}
.fb-item:hover {
	border-color: rgba(201, 164, 78, .55);
	background: rgba(201, 164, 78, .04);
}

/* Иконка пункта — плоская, без глянца */
.fb-bar .fb-badge {
	width: 34px;
	height: 34px;
	min-width: 34px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 17px;
	flex-shrink: 0;
	background: rgba(201, 164, 78, .08);
	border: 1px solid rgba(201, 164, 78, .30);
}
/* Цветовые модификаторы иконок — лёгкая тонировка, без градиентов */
.fb-badge--red  { background: rgba(232, 24, 58, .10); border-color: rgba(232, 24, 58, .35); }
.fb-badge--gold { background: rgba(201, 164, 78, .10); border-color: rgba(201, 164, 78, .40); }
.fb-badge--dark { background: rgba(255, 255, 255, .04); border-color: rgba(255, 255, 255, .16); }

.fb-text {
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
}
.fb-title {
	font-size: 13px;
	font-weight: 600;
	color: #f0ede8;
	white-space: nowrap;
	line-height: 1.25;
	letter-spacing: .01em;
	margin: 0;
	padding: 0;
}
.fb-sub {
	font-size: 10px;
	color: rgba(255, 255, 255, .42);
	white-space: nowrap;
	line-height: 1.3;
	margin: 0;
	padding: 0;
}
.fb-sub--gold { color: #c9a84c; }

/* =================================================================
   БЕГУЩАЯ СТРОКА (тикер) — тонкие золотистые линии
   ================================================================= */
.fb-ticker {
	position: relative;
	width: 100%;
	overflow: hidden;
	padding: 7px 0;
	border-top: 1px solid rgba(201, 164, 78, .16);
	border-bottom: 1px solid rgba(201, 164, 78, .16);
	background: transparent;
	cursor: grab;
	user-select: none;
	-webkit-user-select: none;
	touch-action: pan-y;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
.fb-ticker:active { cursor: grabbing; }

.fb-ticker__track {
	display: inline-flex;
	align-items: center;
	gap: 26px;
	white-space: nowrap;
	will-change: transform;
	padding-left: 26px;
}
.fb-ticker__item {
	font-size: 12px;
	font-weight: 500;
	color: rgba(255, 255, 255, .60);
	letter-spacing: .02em;
	line-height: 1.4;
}
.fb-ticker__sep {
	font-size: 9px;
	color: rgba(201, 164, 78, .55);
	line-height: 1;
}

/* =================================================================
   АДАПТИВ
   ================================================================= */
@media (max-width: 860px) {
	.fb-inner { gap: 7px; }
	.fb-item  { padding: 9px 12px; gap: 8px; border-radius: 12px; }
	.fb-sub   { display: none; }
	.fb-bar .fb-badge { width: 30px; height: 30px; min-width: 30px; font-size: 15px; }
}
@media (max-width: 600px) {
	.fb-inner { flex-wrap: nowrap; }
	.fb-item  { flex-direction: column; gap: 5px; padding: 8px 6px; border-radius: 12px; }
	.fb-title { font-size: 10px; white-space: normal; text-align: center; line-height: 1.3; }
	.fb-bar .fb-badge { width: 28px; height: 28px; min-width: 28px; font-size: 14px; }
	.fb-bar { padding: 8px 10px; }

	.fb-urgency { padding: 7px 14px; gap: 8px; margin-top: 8px; }
	.fb-urgency-text--full { display: none; }
	.fb-urgency-text--short { display: inline; }
	.fb-pill { display: none !important; }
	/* LIVE-ярлык на мобиле прячем — вместо него говорящий текст */
	.fb-urgency .fb-live-label { display: none; }
}
@media (max-width: 380px) {
	.fb-title { font-size: 9px; }
	.fb-bar .fb-badge { width: 25px; height: 25px; min-width: 25px; font-size: 12px; }
	.fb-item  { padding: 7px 4px; }
	.fb-urgency-text--short { font-size: 11px; }
	.fb-timer { font-size: 12px; }
}

/* Доступность: без анимаций */
@media (prefers-reduced-motion: reduce) {
	.fb-trust, .fb-urgency .fb-dot, .fb-timer { animation: none !important; }
}

/* =================================================================
   БЕЙДЖИ ТОВАРОВ — стеклянные, прозрачные
   ================================================================= */
.pb-wrap {
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 10;
	display: flex;
	flex-direction: column;
	gap: 5px;
	pointer-events: none;
}

.pb-badge {
	display: inline-flex;
	align-items: center;
	gap: 3px;
	padding: 4px 10px 4px 8px;
	border-radius: 100px;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: .02em;
	white-space: nowrap;
	backdrop-filter: blur(12px) saturate(1.3);
	-webkit-backdrop-filter: blur(12px) saturate(1.3);
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, .18),
		0 2px 8px rgba(0, 0, 0, .28);
}

/* 🔥 Хит — красное стекло */
.pb-badge--hit {
	background: rgba(180, 20, 20, .55);
	color: #fff;
	border: 1px solid rgba(255, 110, 110, .40);
	text-shadow: 0 1px 2px rgba(0, 0, 0, .4);
}

/* ✨ Новинка — золотое стекло */
.pb-badge--new {
	background: rgba(150, 110, 0, .52);
	color: #fde68a;
	border: 1px solid rgba(255, 210, 60, .42);
	text-shadow: 0 1px 2px rgba(0, 0, 0, .4);
}

/* ⚡ Акция — тёмно-красное стекло */
.pb-badge--sale {
	background: rgba(120, 10, 10, .58);
	color: #fca5a5;
	border: 1px solid rgba(220, 50, 50, .45);
	text-shadow: 0 1px 2px rgba(0, 0, 0, .4);
}

/* 👑 VIP — золотой градиент */
.pb-badge--vip {
	background: linear-gradient(135deg, rgba(123, 92, 0, .82), rgba(201, 168, 76, .82), rgba(123, 92, 0, .82));
	color: #fff8e1;
	border: 1px solid rgba(255, 220, 100, .55);
	font-weight: 800;
	letter-spacing: .04em;
	text-shadow: 0 1px 2px rgba(0, 0, 0, .35);
}

/* 🌸 Сезон — зелёное стекло */
.pb-badge--season {
	background: rgba(22, 101, 52, .52);
	color: #bbf7d0;
	border: 1px solid rgba(74, 222, 128, .40);
	text-shadow: 0 1px 2px rgba(0, 0, 0, .4);
}

/* 💐 Выбор флориста — розовое стекло */
.pb-badge--pick {
	background: rgba(157, 23, 77, .52);
	color: #fbcfe8;
	border: 1px solid rgba(244, 114, 182, .40);
	text-shadow: 0 1px 2px rgba(0, 0, 0, .4);
}

/* Родительская карточка — relative */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
	position: relative !important;
}

/* Карточка на одиночной странице товара */
.woocommerce div.product .pb-wrap {
	top: 14px;
	left: 14px;
}

/* Галерея на странице товара */
.woocommerce-product-gallery {
	position: relative !important;
}
