/* CEA: 7/9/26 — Customer login layout on narrow screens (ShopLOginForm) */

.vp-legacy-content table.customer-login-layout {
  width: 100%;
  max-width: 100%;
}

.vp-legacy-content table.customer-login-form {
  width: 100%;
}

.vp-legacy-content table.customer-login-form td:first-child {
  white-space: nowrap;
  vertical-align: middle;
  padding-right: 0.75rem;
}

@media (max-width: 768px) {
  /* Stack the two main panels; override securechecks-modern table{display:block} collapse */
  .vp-legacy-content table.customer-login-layout {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: visible !important;
  }

  .vp-legacy-content table.customer-login-layout > tbody {
    display: block !important;
    width: 100% !important;
  }

  .vp-legacy-content table.customer-login-layout > tbody > tr.customer-login-headings {
    display: none !important;
  }

  .vp-legacy-content table.customer-login-layout > tbody > tr.customer-login-columns {
    display: block !important;
    width: 100% !important;
  }

  .vp-legacy-content table.customer-login-layout > tbody > tr.customer-login-columns > td {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  .vp-legacy-content table.customer-login-layout > tbody > tr.customer-login-columns > td + td {
    margin-top: 1rem;
  }

  /* Keep label + field on one row inside the login form */
  .vp-legacy-content table.customer-login-form {
    display: table !important;
    width: 100% !important;
    table-layout: fixed;
    overflow-x: visible !important;
  }

  .vp-legacy-content table.customer-login-form tbody {
    display: table-row-group !important;
  }

  .vp-legacy-content table.customer-login-form tr {
    display: table-row !important;
  }

  .vp-legacy-content table.customer-login-form td {
    display: table-cell !important;
    white-space: normal !important;
  }

  .vp-legacy-content table.customer-login-form td[width="30%"],
  .vp-legacy-content table.customer-login-form td:first-child {
    width: 38% !important;
    min-width: 5.5rem;
    white-space: nowrap !important;
  }

  .vp-legacy-content table.customer-login-form input.textarea {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }
}