/* ============================================================
   ELYQO — BusinessOpenStatusCard
   ТЗ «Статус работы бизнеса внутри публичной карточки» §2, §14–§19.

   Блок живёт внутри identity-карточки бизнеса, занимает всю её ширину и
   не создаёт собственной прокрутки: раскрытый график увеличивает высоту
   документа, а не прячет строки во внутренний скролл (§17).
   ============================================================ */
.bsc{
  --bsc-bg:#F3F7F4; --bsc-line:#D8E8DE; --bsc-ink:#14361F; --bsc-accent:#1E9E57;
  --bsc-badge-bg:#1FA45C; --bsc-badge-ink:#FFFFFF;
  border:1px solid var(--bsc-line); background:var(--bsc-bg); color:var(--bsc-ink);
  border-radius:16px; margin:14px 0 0; overflow:hidden;
  font-family:inherit;
}
/* OPEN — светло-зелёная (§4). Свечение мягкое и статичное: мигание запрещено (§19). */
.bsc--open{ --bsc-bg:#F0FAF3; --bsc-line:#CBEBD8; --bsc-ink:#14361F; --bsc-accent:#199150;
  --bsc-badge-bg:#1FA45C; box-shadow:0 0 0 3px rgba(31,164,92,.06); }
/* CLOSES SOON — тёплый янтарь, не тревога (§7) */
.bsc--soon{ --bsc-bg:#FFF8EC; --bsc-line:#F3E0BC; --bsc-ink:#4A3410; --bsc-accent:#B87400;
  --bsc-badge-bg:#C98212; }
/* CLOSED — мягкий коралловый, не аварийный (§5) */
.bsc--closed{ --bsc-bg:#FEF4F4; --bsc-line:#F6DADA; --bsc-ink:#4A1F1F; --bsc-accent:#C6453F;
  --bsc-badge-bg:#FFFFFF; --bsc-badge-ink:#B3352F; }
/* TEMPORARILY CLOSED — красно-серый нейтральный (§22) */
.bsc--temp{ --bsc-bg:#F7F4F4; --bsc-line:#E4DCDC; --bsc-ink:#3B2C2C; --bsc-accent:#9B6060;
  --bsc-badge-bg:#FFFFFF; --bsc-badge-ink:#7A4A4A; }
/* HOURS UNKNOWN — серо-фиолетовый, красного здесь быть не должно (§23) */
.bsc--unknown{ --bsc-bg:#F5F4FA; --bsc-line:#E2DFF0; --bsc-ink:#2E2A45; --bsc-accent:#6C5CE0;
  --bsc-badge-bg:#FFFFFF; --bsc-badge-ink:#4B3FBF; }

/* Сетка задана областями, а не порядком: на узком экране плашка уходит на
   свою строку под заголовок (§14), но шеврон остаётся в первой строке
   справа — иначе он уезжал бы вниз вместе с плашкой. */
.bsc-head{
  display:grid; grid-template-columns:auto minmax(0,1fr) auto;
  grid-template-areas:"ico txt chev" ". badge badge";
  align-items:center; gap:10px 12px; width:100%; padding:14px 14px; min-height:44px;
  background:none; border:0; text-align:left; color:inherit; font:inherit; cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.bsc-ico{ grid-area:ico } .bsc-txt{ grid-area:txt }
.bsc-badge,.bsc-badge--two{ grid-area:badge; justify-self:start }
.bsc-chev{ grid-area:chev }
.bsc-head:not(:has(.bsc-badge)){ grid-template-areas:"ico txt chev" }
.bsc-head.is-static{ cursor:default; }
.bsc-head:focus-visible{ outline:2px solid var(--bsc-accent); outline-offset:-3px; border-radius:14px; }

.bsc-ico{
  width:42px; height:42px; flex:0 0 42px; border-radius:13px; display:grid; place-items:center;
  background:rgba(255,255,255,.75); color:var(--bsc-accent); border:1px solid var(--bsc-line);
}
.bsc-ico .bsc-i{ width:22px; height:22px; display:block; }

.bsc-txt{ min-width:0; display:flex; flex-direction:column; gap:2px; }
.bsc-title{ font-size:19px; font-weight:700; line-height:1.2; letter-spacing:-.01em; color:var(--bsc-accent); }
/* break-word, а не anywhere: anywhere рвал слова посередине —
   «następujący|ch godzinach» на 390px. */
.bsc-sub{ font-size:13.5px; line-height:1.35; color:var(--bsc-ink); opacity:.72;
  overflow-wrap:break-word; }

/* Ограничение «не шире ~42%» (§14) живёт на КОЛОНКЕ сетки, а не на самой
   плашке: у элемента в grid-области проценты считаются от этой области, и
   max-width:42% давал 42% от собственной ячейки — плашку обрезало до «Do». */
.bsc-badge{
  flex:0 0 auto;
  background:var(--bsc-badge-bg); color:var(--bsc-badge-ink,#fff);
  border-radius:999px; padding:9px 15px; font-size:13.5px; font-weight:700;
  white-space:nowrap; text-align:center;
}
.bsc-badge--two{ display:flex; flex-direction:column; gap:1px; border-radius:14px; padding:7px 14px;
  background:var(--bsc-badge-bg); border:1px solid var(--bsc-line); }
.bsc-badge--two .t{ font-size:11.5px; font-weight:600; opacity:.75; white-space:nowrap; }
.bsc-badge--two .b{ font-size:16px; font-weight:800; line-height:1.1; }

.bsc-chev{ width:20px; height:20px; flex:0 0 20px; color:var(--bsc-ink); opacity:.5;
  transition:transform .18s cubic-bezier(.22,1,.36,1); }    /* §19: 160–220 ms */
.bsc.is-open .bsc-chev{ transform:rotate(90deg); }

/* ---- строка фактов: 1–3 колонки по доступной ширине (§14) ---- */
.bsc-facts{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:2px 0; border-top:1px solid var(--bsc-line); background:rgba(255,255,255,.42);
}
.bsc-fact{ display:flex; align-items:center; gap:10px; padding:11px 14px; min-width:0; }
.bsc-fact + .bsc-fact{ box-shadow:inset 1px 0 0 var(--bsc-line); }
.bsc-fi{ width:20px; height:20px; flex:0 0 20px; color:var(--bsc-accent); opacity:.85; }
.bsc-ft{ min-width:0; display:flex; flex-direction:column; }
.bsc-ft .k{ font-size:11.5px; line-height:1.25; color:var(--bsc-ink); opacity:.62; }
.bsc-ft .v{ font-size:13.5px; font-weight:700; line-height:1.3; overflow-wrap:anywhere; }

/* ---- недельный график: раскрывается внутри карточки, без вложенного скролла ---- */
.bsc-sched{ border-top:1px solid var(--bsc-line); padding:10px 14px 13px;
  background:rgba(255,255,255,.55); animation:bsc-open .2s ease both; }   /* §19: 180–240 ms */
.bsc-sched[hidden]{ display:none; }
@keyframes bsc-open{ from{ opacity:0; transform:translateY(-4px) } to{ opacity:1; transform:none } }
.bsc-sched-t{ font-size:11.5px; font-weight:800; text-transform:uppercase; letter-spacing:.05em;
  opacity:.55; margin:2px 0 7px; }
.bsc-row{ display:flex; align-items:baseline; justify-content:space-between; gap:14px;
  padding:5px 0; font-size:13.5px; }
.bsc-row + .bsc-row{ border-top:1px dashed var(--bsc-line); }
.bsc-day{ opacity:.78; }
.bsc-val{ font-weight:700; text-align:right; }
.bsc-val.is-off{ font-weight:600; opacity:.55; }
.bsc-row.is-today .bsc-day,
.bsc-row.is-today .bsc-val{ color:var(--bsc-accent); opacity:1; }
.bsc-row.is-today .bsc-day{ font-weight:700; }

/* ---- с 560px плашка помещается рядом с заголовком ---- */
@media (min-width:560px){
  /* fit-content(42%), а не minmax(0,42%): minmax задаёт предел РОСТА, и
     колонка раздувалась до 42% даже под короткую плашку, отбирая место у
     заголовка. fit-content — «по содержимому, но не шире 42%» (§14). */
  .bsc-head{ grid-template-columns:auto minmax(0,1fr) fit-content(42%) auto;
             grid-template-areas:"ico txt badge chev"; }
  .bsc-badge,.bsc-badge--two{ justify-self:end }
  .bsc-head:not(:has(.bsc-badge)){ grid-template-columns:auto minmax(0,1fr) auto;
             grid-template-areas:"ico txt chev" }
}
@media (max-width:374px){
  .bsc-head{ gap:9px 10px; padding:13px 12px }
  .bsc-title{ font-size:18px }
}
@media (max-width:559px){
  .bsc-facts{ grid-template-columns:1fr; }
  .bsc-fact + .bsc-fact{ box-shadow:inset 0 1px 0 var(--bsc-line); }
}
/* ---- планшет и десктоп: ширину задаёт карточка бизнеса, а не окно (§15, §16) ---- */
@media (min-width:768px){
  .bsc-title{ font-size:20px; }
  .bsc-head{ padding:15px 16px; }
  .bsc-fact{ padding:12px 16px; }
  .bsc-sched{ padding:12px 16px 15px; }
}
@media (prefers-reduced-motion:reduce){
  .bsc-chev{ transition:none }
  .bsc-sched{ animation:none }
}
