/*
 * Flowers — тёмный шаблон в палитре fixprice.flowers
 * Тот же акцент #01B5CC и magenta #DF125E на тёмном фоне #073551
 * Подключается последним, без !important
 */

/* ——— Тёмная палитра (те же цвета бренда) ——— */
[data-theme="dark"],
[data-theme="light"] {
  /* Бренд: бирюзовый и маджента без изменений */
  --fp-accent: #01B5CC;
  --fp-accent-hover: #00c4dd;
  --fp-magenta: #DF125E;
  --fp-magenta-soft: rgba(223, 18, 94, 0.25);
  --fp-teal-soft: rgba(1, 181, 204, 0.2);
  /* Тёмные тона на базе #073551 (primary-colors-dark-blue с сайта) */
  --fp-dark-bg: #051a27;
  --fp-dark-bg-2: #073551;
  --fp-dark-surface: #0a2438;
  --fp-dark-surface-2: #0d2840;
  --fp-dark-border: rgba(1, 181, 204, 0.18);
  --fp-dark-border-muted: rgba(255, 255, 255, 0.08);
  /* Текст на тёмном */
  --fp-text: #FBFCFF;
  --fp-text-secondary: rgba(255, 255, 255, 0.65);
  --fp-text-muted: rgba(255, 255, 255, 0.5);
  --fp-radius: 12px;
  --fp-radius-lg: 24px;
  --fp-shadow: 0 4px 24px rgba(0, 0, 0, 0.35);
  --fp-shadow-card: 0 8px 32px rgba(0, 0, 0, 0.4);
  /* Переменные плеера */
  --color-bg: var(--fp-dark-bg);
  --color-bg-gradient: linear-gradient(180deg, #062230 0%, var(--fp-dark-bg) 50%, #041318 100%);
  --color-surface: var(--fp-dark-surface);
  --color-surface-solid: var(--fp-dark-surface);
  --color-surface-2: var(--fp-dark-surface-2);
  --color-primary: var(--fp-accent);
  --color-primary-hover: var(--fp-accent-hover);
  --color-accent: var(--fp-magenta);
  --color-accent-glow: rgba(223, 18, 94, 0.2);
  --color-text: var(--fp-text);
  --color-text-muted: var(--fp-text-secondary);
  --color-border: var(--fp-dark-border);
  --glass-bg: var(--fp-dark-surface);
  --glass-border: var(--fp-dark-border);
  --radius: var(--fp-radius);
  --radius-sm: 8px;
  --shadow: var(--fp-shadow);
  --shadow-glow: 0 0 28px rgba(1, 181, 204, 0.2);
  --transition: 0.25s ease;
  --widget-block-pad: 12px;
  --widget-pad: var(--widget-block-pad);
  --widget-pad-single: var(--widget-block-pad);
  --widget-box-pad: 8px 12px;
  --widget-gap: 10px;
  --widget-gap-sm: 8px;
  --widget-gap-xs: 4px;
  --player-cell-pad: 0.4em;
}

/* ——— Фон плеера ——— */
.player-wrap {
  background: var(--color-bg);
  background-image: var(--color-bg-gradient);
}

.player-wrap::before {
  opacity: 0.06;
}

.player-wrap::after {
  background-image: radial-gradient(ellipse 70% 50% at 20% 10%, rgba(1, 181, 204, 0.08) 0%, transparent 50%),
    radial-gradient(ellipse 50% 40% at 85% 90%, rgba(223, 18, 94, 0.06) 0%, transparent 50%);
  opacity: 1;
}

.player-grid {
  gap: 0.5em;
  padding: 0.5em;
}

/* ——— Карточки — тёмная поверхность, бирюзовая рамка ——— */
.player-cell {
  background: var(--glass-bg);
  backdrop-filter: none;
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  box-shadow: var(--fp-shadow);
  padding: var(--player-cell-pad);
  transition: box-shadow var(--transition), border-color var(--transition);
}

.player-cell:hover {
  box-shadow: var(--fp-shadow-card);
  border-color: var(--fp-accent);
}

.player-wrap[data-cells-rounded="true"] .player-cell {
  border-radius: var(--radius);
}

.player-cell .widget-card,
.player-cell [class*="-inner"].widget-card {
  background: transparent;
  border: none;
  box-shadow: none;
}

/* ——— Время, дата, до закрытия — бирюзовый акцент ——— */
.player-cell.widget-time .widget-time-inner,
.player-cell.widget-date .widget-date-inner,
.player-cell.widget-closing-timer .widget-closing-timer-inner {
  background: var(--fp-teal-soft);
  border: 1px solid rgba(1, 181, 204, 0.35);
  border-radius: var(--radius-sm);
  color: var(--fp-text);
}

.player-cell.widget-time .widget-time-value,
.player-cell.widget-date .widget-date-value {
  color: var(--fp-text);
  font-weight: 700;
}

.player-cell.widget-time .widget-time-inner[data-time-text-custom="1"] .widget-time-value,
.player-cell.widget-time .widget-time-inner[data-time-text-custom="1"] .widget-time-main--custom .widget-time-num {
  color: var(--widget-time-text);
}

.player-cell.widget-time .widget-time-inner[data-time-text-custom="1"] .widget-time-main--custom .widget-time-sep {
  color: var(--widget-time-text);
  opacity: 0.78;
}

.player-cell.widget-time .widget-time-inner[data-time-text-custom="1"] .widget-time-main--custom .widget-time-label-part,
.player-cell.widget-time .widget-time-inner[data-time-text-custom="1"] .widget-time-main--plaque .widget-time-status-label {
  color: var(--widget-time-text);
  opacity: 0.82;
}

.player-cell.widget-time .widget-time-inner[data-time-text-custom="1"] .widget-time-date-line {
  color: var(--widget-time-text);
  opacity: 0.85;
}

.player-cell.widget-time .widget-time-icon::before,
.player-cell.widget-date .widget-date-icon::before {
  background: var(--fp-accent);
  opacity: 1;
}

.player-cell.widget-closing-timer .widget-closing-timer-title {
  color: var(--fp-text);
  font-weight: 600;
}

.player-cell.widget-closing-timer .widget-closing-timer-status-text {
  color: var(--fp-accent);
  font-weight: 600;
}

.player-cell.widget-closing-timer .widget-closing-timer-icon::before {
  background: var(--fp-accent);
}

/* ——— Слайдер ——— */
.player-cell.widget-slider {
  box-shadow: var(--fp-shadow-card);
  border-radius: var(--fp-radius-lg);
  overflow: hidden;
}

.player-cell.widget-slider .widget-slider-inner {
  background: var(--fp-dark-surface-2);
  border: 1px solid var(--fp-dark-border);
  border-radius: var(--fp-radius-lg);
  overflow: hidden;
}

.player-cell.widget-slider .slider-caption {
  background: rgba(7, 53, 81, 0.85);
  color: #FFF;
  padding: 0.7em 1em;
  font-weight: 600;
}

/* ——— Акция дня — маджента на тёмном ——— */
.player-cell.widget-promo {
  box-shadow: var(--fp-shadow-card);
  border-color: var(--fp-magenta-soft);
}

.player-cell.widget-promo .widget-promo-inner {
  background: linear-gradient(165deg, rgba(212, 17, 89, 0.2) 0%, rgba(223, 18, 94, 0.08) 100%);
  border: 1px solid var(--fp-magenta-soft);
  border-radius: var(--radius-sm);
  padding: var(--widget-pad);
}

.player-cell.widget-promo .widget-promo-title {
  color: #FB4A8B;
  font-weight: 700;
  font-size: 1.06em;
}

.player-cell.widget-promo .widget-promo-icon::before {
  color: var(--fp-magenta);
}

.player-cell.widget-promo .widget-promo-item {
  border-bottom-color: rgba(223, 18, 94, 0.2);
}

.player-cell.widget-promo .widget-promo-item-title {
  color: var(--fp-text);
  font-weight: 600;
}

.player-cell.widget-promo .widget-promo-item-text,
.player-cell.widget-promo .widget-promo-until {
  color: var(--fp-text-secondary);
}

/* ——— Приветственный текст — бирюзовый ——— */
.player-cell.widget-custom .widget-custom-inner {
  background: var(--fp-teal-soft);
  border: 1px solid rgba(1, 181, 204, 0.3);
  border-radius: var(--radius-sm);
}

.player-cell.widget-custom .widget-custom-title {
  color: var(--fp-accent);
  font-weight: 700;
}

/* ——— Заказы — суммы маджента ——— */
.player-cell.widget-orders-json .widget-orders-json-inner {
  background: var(--fp-dark-surface-2);
  border: 1px solid var(--fp-dark-border);
  border-radius: var(--radius-sm);
}

.player-cell.widget-orders-json .widget-orders-json-title {
  color: var(--fp-text);
  font-weight: 700;
}

.player-cell.widget-orders-json .widget-orders-json-sum {
  color: #FB4A8B;
  font-weight: 700;
}

.player-cell.widget-orders-json .widget-orders-json-group {
  background: var(--fp-dark-surface);
  border-radius: var(--radius-sm);
  border: 1px solid var(--fp-dark-border-muted);
}

/* ——— Уход за цветами ——— */
.player-cell.widget-flower-care .widget-flower-care-inner {
  background: var(--fp-dark-surface-2);
  border: 1px solid var(--fp-dark-border);
  border-radius: var(--radius-sm);
}

.player-cell.widget-flower-care .widget-flower-care-title {
  color: var(--fp-text);
  font-weight: 700;
}

.player-cell.widget-flower-care .widget-flower-care-item::before {
  background: var(--fp-accent);
  border-radius: 50%;
}

/* ——— Цены на цветы — цены маджента ——— */
.player-cell.widget-flower-prices .widget-flower-prices-inner {
  background: var(--fp-dark-surface-2);
  border: 1px solid var(--fp-dark-border);
  border-radius: var(--radius-sm);
}

.player-cell.widget-flower-prices .widget-flower-prices-title {
  color: var(--fp-text);
  font-weight: 700;
}

.player-cell.widget-flower-prices .widget-flower-prices-price {
  color: #FB4A8B;
  font-weight: 700;
}

/* ——— Популярные букеты — подложка тёмная, цена светлая ——— */
.player-cell.widget-popular-bouquets .widget-popular-bouquets-inner {
  background: var(--fp-dark-surface-2);
  border: 1px solid var(--fp-dark-border);
  border-radius: var(--radius-sm);
}

.player-cell.widget-popular-bouquets .widget-popular-bouquets-title {
  color: var(--fp-text);
  font-weight: 700;
}

.player-cell.widget-popular-bouquets .widget-popular-bouquet-image {
  border-radius: var(--radius-sm) var(--radius-sm) 0 0;
  overflow: hidden;
}

.player-cell.widget-popular-bouquets .widget-popular-bouquet-info {
  background: rgba(7, 53, 81, 0.6);
  border-radius: 0 0 var(--radius-sm) var(--radius-sm);
  border-top: 1px solid var(--fp-dark-border-muted);
}

.player-cell.widget-popular-bouquets .widget-popular-bouquet-price {
  color: #FFF;
  font-weight: 700;
}

/* ——— QR-код — тёмная карточка ——— */
.player-cell.widget-qr-app .widget-qr-app-inner {
  background: var(--fp-dark-surface-2);
  border: 1px solid var(--fp-dark-border);
  border-radius: var(--radius-sm);
}

.player-cell.widget-qr-app .widget-qr-app-title {
  color: var(--fp-text);
  font-weight: 700;
}

.player-cell.widget-qr-app .widget-qr-app-caption {
  color: var(--fp-text-secondary);
}

.player-cell.widget-qr-app .widget-qr-app-code {
  background: var(--fp-dark-bg-2);
  border-radius: 25px;
  padding: 0.75em;
  border: 1px solid var(--fp-dark-border);
}

.player-cell.widget-qr-app .widget-qr-app-code img {
  border-radius: 25px;
  display: block;
}

/* ——— Бегущая строка — бирюзовый как на сайте ——— */
.screen-ticker {
  background: var(--fp-accent);
  color: #FFF;
  border: none;
  font-weight: 600;
}

/* ——— Иконки — бирюзовый акцент ——— */
.player-cell [class*="-icon"].widget-card-icon::before {
  color: var(--fp-accent);
}

.player-cell [class*="-title"] {
  letter-spacing: 0.02em;
}