/* Modal aktualnego menu — niezależny od styli kart z gridu diet. */
body.mcp-scroll-locked { overflow: hidden; }

.mcp-modal {
  align-items: center;
  display: flex;
  inset: 0;
  justify-content: center;
  opacity: 0;
  padding: 18px;
  pointer-events: none;
  position: fixed;
  transition: opacity .2s ease;
  visibility: hidden;
  z-index: 99999;
}
.mcp-modal.mcp-open { opacity: 1; pointer-events: auto; visibility: visible; }
.mcp-backdrop { background: rgba(20, 29, 21, .62); inset: 0; position: absolute; }
.mcp-dialog {
  background: #fff;
  border-radius: 26px;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .3);
  max-height: min(960px, calc(100vh - 36px));
  max-width: 1240px;
  overflow: auto;
  position: relative;
  transform: translateY(14px) scale(.985);
  transition: transform .2s ease;
  width: min(1240px, 100%);
}
.mcp-open .mcp-dialog { transform: translateY(0) scale(1); }
.mcp-header {
  align-items: center;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  padding: 24px 28px 8px;
}
.mcp-title { color: #253527; font: 700 22px/1.2 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif; margin: 0; }
.mcp-close {
  align-items: center;
  background: #253527;
  border: 0;
  border-radius: 50%;
  color: #fff;
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 auto;
  height: 42px;
  justify-content: center;
  padding: 0;
  width: 42px;
}
.mcp-close:hover { background: #1c2a1e; }
.mcp-close:focus-visible { outline: 3px solid #eab6d3; outline-offset: 3px; }
.mcp-close svg { height: 20px; width: 20px; }
.mcp-content { padding: 0 28px 28px; }
.mcp-content [data-menu-carousel] { margin: 0; max-width: none; }

@media (max-width: 639px) {
  /* Pełny ekran od góry; zawartość okna przewija się pionowo. */
  .mcp-modal { align-items: stretch; height: 100vh; height: 100dvh; padding: 0; }
  .mcp-dialog {
    border-radius: 0;
    height: 100vh;
    height: 100dvh;
    max-height: none;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
  .mcp-header { padding: 20px 18px 6px; }
  .mcp-title { font-size: 19px; }
  .mcp-content { padding: 0 18px 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .mcp-modal, .mcp-dialog { transition: none; }
}