/* =================================================================
   Login Page Styles
   ================================================================= */

/* Remove all padding/margin and ensure gray background on login page */
body.woocommerce-account.logged-out #content,
body.woocommerce-account.logged-out .site-content,
body.woocommerce-account.logged-out .site-main,
body.woocommerce-account.logged-out #primary,
body.woocommerce-account.logged-out .content-area,
body.woocommerce-account.logged-out article,
body.woocommerce-account.logged-out .prose {
  padding: 0 !important;
  margin: 0 !important;
}

body.woocommerce-account.logged-out #content,
body.woocommerce-account.logged-out .site-main,
body.woocommerce-account.logged-out #primary {
  background-color: #f9fafb !important; /* gray-50 - ensure gray, not white */
}

/* Override global max-w-7xl so the full-bleed hero can reach the viewport edges */
body.woocommerce-account.logged-out #primary,
body.woocommerce-account.logged-out .site-main {
  max-width: none !important;
  width: 100% !important;
}

/* Override lg breakpoint padding - base rule uses lg:pt-12 lg:pb-12 */
@media (min-width: 64rem) {
  body.woocommerce-account.logged-out #primary,
  body.woocommerce-account.logged-out .site-main {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
}

/* Ensure login page takes full width and removes grid layout */
body.woocommerce-account.logged-out .woocommerce {
  @apply max-w-none;
  display: block !important;
  grid-template-columns: unset !important;
  gap: unset !important;
}

/* Hide page title on My Account page (both logged-in and logged-out) */
body.woocommerce-account article > header.mb-8,
body.woocommerce-account .entry-header,
body.woocommerce-account .page-header {
  @apply hidden;
}

/* Override WooCommerce form border on My Account login page */
body.woocommerce-account .woocommerce form.login,
body.woocommerce-account .woocommerce form.woocommerce-form-login {
  border: none !important;
  padding: 0;
  margin: 0;
}

/* Style for screen reader only class */
.sr-only {
  @apply absolute w-px h-px p-0 -m-px overflow-hidden whitespace-nowrap border-0;
  clip: rect(0, 0, 0, 0);
}