/* =============================================================================
   tema.css — оформление FleurLab для конструктора и панели флориста
   (2026-09-17, по макетам владельца).

   Палитра снята с логотипа (буквы #ED6E82) и с макетов первого экрана:
   коралловые кнопки, светло-розовые подложки, тёмно-сливовый текст там,
   где его много читать. Шрифты: Boogaloo — заголовки, кнопки и метки
   заглавными, как на макете; Nunito — обычный текст.

   Файл только ПЕРЕОПРЕДЕЛЯЕТ переменные и несколько правил страницы,
   разметка и код не тронуты. Подключён последним в <head>, поэтому
   побеждает встроенные стили. Снять оформление — удалить строку
   подключения, вернётся прежняя бежевая гамма.
   ============================================================================= */
@import url('https://fonts.googleapis.com/css2?family=Boogaloo&family=Nunito:wght@400;600;700;800&display=swap');

:root{
  --bg:#FFFBFC; --bg2:#FDEFF3; --bg3:#F5D6DF;
  --text:#4A2634; --text2:#8C5E6E; --text3:#B38A99;
  --accent:#E96A80; --accent-light:#FCE0E7;
  --green:#EE8398; --green-dark:#DC5B74; --green-light:#FDE7EC;
  --danger:#C9404F; --danger-light:#FCE6E9;
  --font-display:'Boogaloo','Nunito',system-ui,sans-serif;
  --font-body:'Nunito',system-ui,sans-serif;
  --fl-koral:#ED6E82; --fl-knopka:#DC5B74; --fl-knopka-hover:#C94C65;
  --fl-panel:#F8C7D3;
}

/* Boogaloo существует в одном начертании: без этого браузер рисует
   поддельный жирный, и буквы расплываются */
h1,h2,h3,.md h2,.fd h2,.pay-sec h3{font-weight:400;letter-spacing:.02em}

/* ---------------------------------------------------------- кнопки */
.ba,.bp{background:var(--fl-knopka);border-radius:16px;font-family:var(--font-display);
  font-weight:400;text-transform:uppercase;letter-spacing:.05em;font-size:18px;
  box-shadow:0 6px 16px rgba(220,91,116,.28);transition:background .15s ease, transform .15s ease}
.bp{font-size:20px}
.ba:hover,.bp:hover{background:var(--fl-knopka-hover)}
.ba:active,.bp:active{transform:translateY(1px)}
.ba:disabled,.bp:disabled{box-shadow:none}

/* вкладки и выбор */
.stab{font-family:var(--font-display);font-size:15px;letter-spacing:.04em;text-transform:uppercase;
  border-color:var(--bg3);color:var(--text2)}
.stab.active{background:var(--fl-koral);border-color:var(--fl-koral);color:#fff}
.snb{font-family:var(--font-display);font-size:15px;letter-spacing:.05em;text-transform:uppercase}
.snb.active{color:var(--fl-knopka)}
.fc:hover{border-color:var(--fl-koral)}
.fc .ab{background:var(--fl-koral)}
.qb{border-color:var(--bg3);color:var(--fl-knopka)}
.cb{border-color:var(--bg3);color:var(--text)}
.cb.dg{color:var(--danger)}
.fl input:focus,.fl select:focus,.fl textarea:focus{border-color:var(--fl-koral);
  box-shadow:0 0 0 3px var(--accent-light)}
.ct{border-top-color:var(--fl-koral)}
.ctp,.pay-grand{color:var(--fl-knopka)}
.prs .pr,.prs .lb{color:var(--fl-knopka)}

/* кнопки поверх сцены: «Commander» — коралловая, прочие — стекло */
.bt{font-family:var(--font-display);letter-spacing:.05em;text-transform:uppercase;font-size:15px}
.bt.ac{background:rgba(237,110,130,.92);border-color:rgba(255,255,255,.35);color:#fff}
.bt.ac:hover{background:#DC5B74}
@media(max-width:480px){.bt{font-size:13px}}

/* сумма букета в кружке (web/src/price-badge.js задаёт стиль строкой) */
#__priceBadge{background:rgba(237,110,130,.94)!important;border-color:rgba(255,255,255,.45)!important;
  font-family:var(--font-display)!important}

/* обучение: кнопки показа в цвет сайта */
#tut-next,#tut-go{background:var(--fl-knopka)!important;color:#fff!important;
  font-family:var(--font-display)!important;letter-spacing:.04em;text-transform:uppercase}

/* поиск цветка */
.fsrch input:focus,.fsi:focus{border-color:var(--fl-koral)!important;outline:none}

/* ------------------------------------------------- панель флориста */
.tab{font-family:var(--font-display);font-weight:400;letter-spacing:.04em;text-transform:uppercase;font-size:15px}
.tab.active,.btn.ok{background:var(--fl-knopka)}
.btn{font-family:var(--font-display);letter-spacing:.05em;text-transform:uppercase;font-size:15px;
  border-radius:14px}
.btn:not(.ghost):not(.warn):not(.ok){background:var(--fl-knopka)}
.btn.ghost{border-color:var(--bg3);color:var(--text2)}