/* Перший шар — кабінет клієнта (спільний модуль sg-cabinet) у наших кольорах, 02.10.2026.
   Модуль бере кольори й форми з токенів --ys-* — віддаємо йому наші: зелений акцент замість
   жовтого (текст на ньому білий), синій «острів», наші заокруглення замість зрізаних кутів. */
body{
  --ys-page:var(--fl-page);--ys-card:var(--fl-card);--ys-tint:var(--fl-green-lt);--ys-line:var(--fl-line);--ys-ink:var(--fl-ink);
  --ys-island:var(--fl-navy);--ys-muted:var(--fl-muted);--ys-yellow:var(--fl-green);--ys-yellow-dk:var(--fl-green-dk);
  --ys-green:var(--fl-green-dk);--ys-green-bg:var(--fl-green-lt);--ys-coral:var(--fl-coral);--ys-coral-bg:var(--fl-coral-lt);
  --ys-r:var(--fl-r-card);--ys-r-sm:var(--fl-r-btn);--ys-clip:0px;--ys-clip-sm:0px;--ys-font-h:var(--fl-h);
}
.sg-cab,.sg-cab-user{--sgc-mono:var(--fl-m);font-family:var(--fl-b)}

/* шрифти: наш Plus Jakarta Sans замість Montserrat */
.sg-cab-h{font-family:var(--fl-h);font-weight:800;font-size:clamp(22px,2.4vw,28px);letter-spacing:-.02em;line-height:1.2}
.sg-cab-h mark{background:linear-gradient(transparent 60%,rgba(107,240,140,.55) 60%,rgba(107,240,140,.55) 92%,transparent 92%)}
.sg-cab-h3,.sg-cab-tile .sg-cab-tile__t,.sg-cab-mgr__name,.sg-cab-hero__mgr b{font-family:var(--fl-h)}
.sg-cab-tile>b,.sg-cab-big,.sg-cab-hero__h,.sg-cab-hero__stat b,.sg-cab-mgr__ava,.sg-cab-hero__ava{font-family:var(--fl-h);letter-spacing:-.02em}
.sg-cab-tile>b{font-size:26px}
.sg-cab-lead{font-size:17px;color:var(--fl-muted)}
.sg-cab-mono{font-family:var(--fl-m)}

/* кнопки: зелені з білим текстом, як «Придбати» на сайті */
.sg-cab-btn:not(.sg-cab-btn--line){background:var(--fl-green)!important;color:#fff!important;border-radius:var(--fl-r-btn);box-shadow:0 1px 0 rgba(20,110,40,.22)}
.sg-cab-btn:not(.sg-cab-btn--line):hover{background:var(--fl-green-dk)!important}
.sg-cab-btn--line{box-shadow:inset 0 0 0 1.5px var(--fl-line)!important;color:var(--fl-ink)!important;border-radius:var(--fl-r-btn);background:#fff!important}
.sg-cab-btn--line:hover{box-shadow:inset 0 0 0 1.5px var(--fl-green)!important;background:var(--fl-green-lt)!important;color:var(--fl-green-dk)!important}
.sg-cab-sqrow .sg-cab-btn{box-shadow:inset 0 0 0 2px var(--fl-navy)!important;background:transparent!important;color:var(--fl-navy)!important}
.sg-cab-seg a.is-on{background:var(--fl-green);color:#fff!important}
.sg-cab-seg a:not(.is-on):hover{background:#fff}
.sg-cab-hero__ava{color:var(--fl-green-dk)}
.sg-cab-y{color:var(--fl-neon)!important}

/* дрібниці теми Yellow Square, зашиті в модулі бежевим */
.sg-cab-chip{background:var(--fl-tint2)}
.sg-cab-chip--ok{background:var(--fl-green-lt)}
.sg-cab-chip--bad{background:var(--fl-coral-lt)}
.sg-cab-chip--soft{background:var(--fl-amber-lt)}
.sg-cab-bar{background:var(--fl-tint2)}
.sg-cab-bar--dark{background:rgba(255,255,255,.14)}
.sg-cab-ava{background:var(--fl-green-lt);color:var(--fl-green-dk)}
.sg-cab-user{border-radius:var(--fl-r-card);box-shadow:var(--fl-shadow)}
.sg-cab-island{background:radial-gradient(420px 220px at 90% 0%,rgba(107,240,140,.20),transparent 70%),var(--fl-navy)}
a.sg-cab-tile:hover{background:var(--fl-green-lt);border-color:#BFE7C6!important}
.sg-cab-pcard:hover{border-color:#BFE7C6;box-shadow:var(--fl-shadow-hi)}
.sg-cab a:not(.sg-cab-btn):not(.sg-cab-tile):not(.sg-cab-orow){color:var(--fl-green-dk)}
.sg-cab-orow:hover .sg-cab-orow__main b{color:var(--fl-green-dk)}
.sg-cab-favbtn.is-on{background:var(--fl-green-lt);border-color:var(--fl-green)}
.sg-cab-favbtn:hover{background:var(--fl-green-lt)}

/* поля форм — як на оформленні */
.sg-cab input[type=text],.sg-cab input[type=email],.sg-cab input[type=number],.sg-cab input[type=tel],
.sg-cab textarea,.sg-cab select{border:1px solid var(--fl-line);border-radius:var(--fl-r-btn);background:#fff;font:inherit;font-size:16px;padding:10px 12px;box-shadow:none}
.sg-cab input:focus,.sg-cab textarea:focus,.sg-cab select:focus{outline:none!important;border-color:var(--fl-green)!important;box-shadow:0 0 0 3px rgba(46,168,60,.15)}

/* ── Розкладка. Astra і fl.css ставлять колонки флоатами (меню 25% / вміст 72%), модуль чекає грід:
      картка користувача над меню, вміст праворуч на всю висоту. ── */
body.woocommerce-account.logged-in .woocommerce{display:grid;grid-template-columns:290px minmax(0,1fr);gap:16px 28px;align-items:start}
body.woocommerce-account.logged-in .woocommerce::before,body.woocommerce-account.logged-in .woocommerce::after{display:none!important;content:none!important}
body.woocommerce-account.logged-in .woocommerce-MyAccount-navigation,
body.woocommerce-account.logged-in .woocommerce-MyAccount-content{float:none!important;width:auto!important;margin:0!important;min-width:0}
body.woocommerce-account .woocommerce > .sg-cab-user{margin:0}
body.woocommerce-account .woocommerce > .woocommerce-notices-wrapper{grid-column:1 / -1}
/* модуль складає в одну колонку з 1100px (як тема YS), у нас дві колонки тримаються до 900px */
@media (min-width:901px) and (max-width:1100px){
  body.woocommerce-account .woocommerce:has(> .sg-cab-user){grid-template-rows:auto minmax(0,1fr)}
  body.woocommerce-account .woocommerce > .sg-cab-user{grid-column:1;grid-row:1}
  body.woocommerce-account .woocommerce > .sg-cab-user ~ .woocommerce-MyAccount-navigation{grid-column:1;grid-row:2}
  body.woocommerce-account .woocommerce > .sg-cab-user ~ .woocommerce-MyAccount-content{grid-column:2;grid-row:1 / span 2}
  body.woocommerce-account.logged-in .woocommerce{grid-template-columns:250px minmax(0,1fr);gap:16px 22px}
}
@media (max-width:900px){
  body.woocommerce-account.logged-in .woocommerce{grid-template-columns:minmax(0,1fr)}
  body.woocommerce-account.logged-in .woocommerce > *{grid-column:1!important;grid-row:auto!important}
  /* меню на телефоні — горизонтальна стрічка, щоб не займало пів екрана */
  body.woocommerce-account .woocommerce-MyAccount-navigation ul{display:flex;flex-direction:row;overflow-x:auto;scrollbar-width:none;gap:6px;padding:8px;
    -webkit-overflow-scrolling:touch;scroll-snap-type:x proximity}
  body.woocommerce-account .woocommerce-MyAccount-navigation ul::-webkit-scrollbar{display:none}
  body.woocommerce-account .woocommerce-MyAccount-navigation li{flex:0 0 auto;scroll-snap-align:start}
  body.woocommerce-account .woocommerce-MyAccount-navigation li a{white-space:nowrap;padding:9px 14px;border-radius:999px;font-size:14px}
}

/* ── Огляд: плитки й острів у наших відступах ── */
.sg-cab-tiles{gap:14px}
@media (max-width:560px){
  .sg-cab-tile>b{font-size:22px}
  .sg-cab-big{font-size:34px}
  .sg-cab-hero__h{font-size:24px}
}

/* ── Сторінка «Для бізнесу»: ширше за звичайну текстову сторінку (840px) ── */
body.fl-bizpage .fl-page,body.fl-bizpage .fl-article{max-width:1120px}
body.fl-bizpage .sg-cab--page{max-width:none}
body.fl-bizpage .sg-cab-ben{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:18px 0}
@media (max-width:1000px){ body.fl-bizpage .sg-cab-ben{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:520px){ body.fl-bizpage .sg-cab-ben{grid-template-columns:minmax(0,1fr)} }
/* заголовок сторінки — в одну лінію з ширшим блоком */
body.fl-bizpage .entry-header{max-width:1120px!important;margin-inline:auto;padding-inline:0!important}
/* картки переваг на телефоні — без порожнього низу */
@media (max-width:640px){ body.fl-bizpage .sg-cab-ben .sg-cab-tile{min-height:0} }
/* заголовок кабінету («Кабінет», «Замовлення»…) — по лівому краю ширшого кабінету, не вузької текстової колонки */
@media (min-width:901px){ body.woocommerce-account.logged-in .entry-header{max-width:none!important;padding-inline:var(--fl-gut)!important;margin-inline:0} }