/* AOClub signup progressive enhancement: the unenhanced form stays in document flow. */
#aoclub-signup-backdrop[hidden], #aoclub-signup-close[hidden] { display: none !important; }
#signup-form[hidden] { display: none !important; }
#aoclub-signup-backdrop { position: fixed; inset: 0; z-index: 9998; background: rgba(10, 18, 26, .58); }
#aoclub-signup-open { display: inline-block; margin: 14px 10px; padding: 10px 18px; background: #bf2234; color: #fff; font-weight: bold; text-decoration: none; }
#signup-form.aoclub-modal-active {
  position: fixed; z-index: 9999; top: 50%; left: 50%; transform: translate(-50%, -50%);
  display: block; width: min(700px, calc(100vw - 32px)); max-height: calc(100vh - 32px);
  overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain;
  padding: 48px 20px 20px; box-sizing: border-box; background: #fff;
  box-shadow: 0 18px 70px rgba(0, 0, 0, .4); border-radius: 10px;
}
#signup-form.aoclub-modal-active > .grid_3 { display: none !important; }
#signup-form.aoclub-modal-active > .grid_9 { float: none; display: block; width: 100%; max-width: 100%; margin: 0; box-sizing: border-box; }
#signup-form.aoclub-modal-active .style-comment-form .input-comment { display: none; }
#signup-form.aoclub-modal-active .style-comment-form .input { margin-left: 0; }
#signup-form.aoclub-modal-active .style-comment-form .input > label { display: block; float: none; width: auto; margin: 0 0 4px; }
#signup-form.aoclub-modal-active .style-comment-form .input .comment { display: block; }
#signup-form.aoclub-modal-active .style-comment-form .input input { max-width: 100%; box-sizing: border-box; }
#signup-form.aoclub-modal-active .style-box, #signup-form.aoclub-modal-active .am-form { max-width: 100%; box-sizing: border-box; }
#signup-form.aoclub-modal-active .products-overview { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; width: 100%; box-sizing: border-box; }
#signup-form.aoclub-modal-active .products-overview .product { float: none; width: auto; min-width: 0; margin: 0; }
#signup-form.aoclub-modal-active .products-overview .product .title { max-width: 100%; }
#aoclub-signup-close:not([hidden]) { position: absolute; top: 9px; right: 10px; z-index: 1; width: 35px; height: 35px; border: 0; border-radius: 50%; background: #eee; color: #222; font-size: 28px; line-height: 30px; cursor: pointer; }
#aoclub-signup-close:focus-visible, #aoclub-signup-open:focus-visible { outline: 3px solid #105aaf; outline-offset: 2px; }
@media (max-width: 599px) {
  #signup-form.aoclub-modal-active { top: 0; left: 0; transform: none; width: 100vw; max-height: none; height: 100dvh; padding: 48px 12px 20px; border-radius: 0; box-shadow: none; }
  #signup-form.aoclub-modal-active .products-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #signup-form.aoclub-modal-active input[type="text"], #signup-form.aoclub-modal-active input[type="password"], #signup-form.aoclub-modal-active input[type="email"], #signup-form.aoclub-modal-active select { max-width: 100%; box-sizing: border-box; }
}
