/* pill63 — Start selling | Order for myself — LIVE shop 50 /en/ only v=2
   Beats d56menu.css: html.d56-en .ma .ma-r { areas:"logo ic" "s s" } */

body.ma,
.ma{
  --tg-pill-ink:#111;
  --tg-pill-fill:#141311;
  --tg-pill-line:#111;
  --tg-pill-h:40px;
}

/* Mobile: insert pill row between logo and search.
   d56 hides hamburger and uses 2-col "logo ic" / "s s" — extend that. */
@media (max-width:767px){
  html.d56-en .ma .ma-r,
  html.d56-en body.ma .ma-r,
  html.tgm-on body.ma .ma-r,
  body.ma .ma-r{
    display:grid !important;
    grid-template-columns:1fr auto !important;
    grid-template-areas:
      "logo ic"
      "pill pill"
      "s s" !important;
    gap:6px 6px !important;
    padding:6px 10px 10px !important;
    align-items:center;
  }
  /* Fallback if d56 not on (classic 3-col with hamburger) */
  html:not(.d56-en) body.ma .ma-r{
    grid-template-columns:44px 1fr auto !important;
    grid-template-areas:
      "mb logo ic"
      "pill pill pill"
      "s s s" !important;
  }
  html.d56-en .ma .tg-pill,
  html.d56-en body.ma .tg-pill,
  body.ma .tg-pill,
  html.tgm-on .tg-pill{
    grid-area:pill !important;
    display:flex !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
  }
  html.d56-en .ma form.ma-s,
  body.ma form.ma-s{
    grid-area:s !important;
    width:100% !important;
  }
}

@media (min-width:768px){
  body.ma .tg-pill,
  html.tgm-on .tg-pill,
  html.d56-en .ma .tg-pill,
  .ma .tg-pill{display:none !important;}
}

.ma .tg-pill,
body.ma .tg-pill{
  box-sizing:border-box;
  height:var(--tg-pill-h);
  border:1.5px solid var(--tg-pill-line,#111);
  border-radius:999px;
  background:#fff;
  padding:3px;
  gap:0;
  align-items:stretch;
  justify-content:stretch;
  margin:0;
}

.ma .tg-pill[hidden]{display:none !important;}

.ma .tg-pill__btn{
  flex:1 1 0;
  min-width:0;
  appearance:none;
  -webkit-appearance:none;
  border:0;
  background:transparent;
  color:var(--tg-pill-ink,#111);
  border-radius:999px;
  font-family:Outfit,Inter,system-ui,sans-serif;
  font-weight:700;
  font-size:13px;
  letter-spacing:-.01em;
  line-height:1.15;
  padding:0 8px;
  cursor:pointer;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  transition:background .15s ease, color .15s ease;
}

.ma .tg-pill__btn[aria-pressed="true"]{
  background:var(--tg-pill-fill,#141311);
  color:#fff;
}

.ma .tg-pill__btn:focus-visible{
  outline:2px solid #E6010B;
  outline-offset:2px;
}

@media (max-width:374px){
  .ma .tg-pill__btn{font-size:12px; padding:0 6px;}
}

.ma .tg-pill-note,
body.ma .tg-pill-note{
  display:none;
  margin:0;
  padding:6px 10px 0;
  font:500 12px/1.35 Inter,system-ui,sans-serif;
  color:#555;
}
body.ma.tg-mode-sell .tg-pill-note,
.ma.tg-mode-sell .tg-pill-note{display:block;}
body.ma.tg-mode-sell .tg-pill-note a{color:#111; font-weight:700; text-decoration:underline;}

.ma .ma-s input[name="s"]::placeholder{color:#888;}
