/* ============================================================================
 * MelóPont — „További lehetőségek” (három pötty) gomb (KEBAB-01, 2026.10.12)
 * László a három látványtervből a C-t választotta, módosítva: lekerekített négyzet a néző
 * szerepkörének halvány színében — munkavállalónál kék, cégnél zöld (html[data-mp-role],
 * az mp-early.js teszi ki a mentett szerepkörből; ismeretlen szerepkörnél kék).
 * Használat: <button class="mp-kebab" aria-label="…" aria-expanded="false"> + MP_KEBAB ikon.
 * Nyitott menünél (aria-expanded="true") teli szín, fehér pöttyök.
 * Nagyítás: a mérete a betűméret-szorzóval nő (legfeljebb 52 px), sosem zsugorodik.
 * Helyek: Közösség bejegyzés-kártyái (community.js), Üzenetek fejléce (messages.html).
 * ========================================================================== */
:root {
  --mp-kebab-blue-bd: #BFD6EE;
  --mp-kebab-green-bd: #A9D8BD;
}
.mp-kebab {
  --kb-bg: var(--mp-blue-light, #E8F0FE);
  --kb-bd: var(--mp-kebab-blue-bd);
  --kb-fg: var(--mp-blue, #0A66C2);
  box-sizing: border-box; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  width: min(calc(44px * var(--mp-fs, 1)), 52px); height: min(calc(44px * var(--mp-fs, 1)), 52px);
  min-width: 44px; min-height: 44px; margin: 0; padding: 0;
  border: 1px solid var(--kb-bd); border-radius: 12px;
  background: var(--kb-bg); color: var(--kb-fg);
  cursor: pointer; transition: background-color .15s, color .15s, border-color .15s;
  -webkit-tap-highlight-color: transparent;
}
html[data-mp-role="company"] .mp-kebab {
  --kb-bg: var(--mp-green-light, #E8F5E9);
  --kb-bd: var(--mp-kebab-green-bd);
  --kb-fg: var(--mp-green, #057642);
}
.mp-kebab svg { display: block; width: min(calc(22px * var(--mp-fs, 1)), 26px); height: min(calc(22px * var(--mp-fs, 1)), 26px); flex-shrink: 0; }
.mp-kebab:hover { border-color: var(--kb-fg); }
.mp-kebab[aria-expanded="true"] { background: var(--kb-fg); border-color: var(--kb-fg); color: var(--mp-white, #FFFFFF); }
.mp-kebab:focus-visible { outline: 3px solid var(--kb-fg); outline-offset: 2px; }