/* This action rail belongs to the menu route only. The age/menu lock hides
   both actions, while their wrapper owns the initial inert state. */
.menu-floating-actions {
  display: none;
}

[data-editorial="menu"] .menu-constructor-preview {
  display: block;
  grid-column: 2;
  grid-row: 1;
  align-self: center;
  min-width: 0;
  max-width: 100%;
}

[data-editorial="menu"] .menu-constructor-preview:focus-visible {
  outline: 2px solid var(--page-gold);
  outline-offset: 5px;
}

@media (max-width: 760px) {
  [data-editorial="menu"] .menu-constructor-preview {
    grid-column: 1;
  }
}

@media (max-width: 860px) {
  .menu-floating-actions {
    position: fixed;
    z-index: 50;
    right: max(14px, env(safe-area-inset-right));
    bottom: calc(16px + env(safe-area-inset-bottom));
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    width: 430px;
    max-width: calc(100% - max(14px, env(safe-area-inset-left)) - max(14px, env(safe-area-inset-right)));
  }

  .menu-floating-actions > .section-page__button {
    position: static;
    display: inline-flex;
    flex: 1 1 auto;
    gap: 8px;
    width: auto;
    min-width: 0;
    max-width: 100%;
    min-height: 48px;
    padding: 12px;
    background: rgba(14, 12, 9, .98);
    box-shadow: 0 8px 28px rgba(0, 0, 0, .32);
    font-size: .68rem;
    letter-spacing: .08em;
    text-align: center;
    text-wrap: balance;
  }

  .menu-floating-actions > .section-page__button:hover {
    background: var(--page-gold);
    color: #100c06;
  }

  [data-editorial="menu"] ~ .section-page__footer {
    padding-bottom: calc(150px + env(safe-area-inset-bottom));
  }
}

body.age-locked .menu-floating-actions {
  display: none;
}

@media (max-width: 860px) {
  .menu-floating-actions { gap: 0; padding: 5px; border: 1px solid #d4ad674d; border-radius: 999px; background: #10100e; }
  .menu-floating-actions > .section-page__button { border: 0; border-radius: 999px; box-shadow: none; font-size: .7rem; letter-spacing: .035em; }
  .menu-floating-actions > .section-page__button:first-child { background: #d4ad67; color: #080807; }
  .menu-floating-actions > .section-page__button:focus-visible { outline: 2px solid #f1d79c; outline-offset: 3px; }
}