/*!
 * OWEB WC Skin — MY ACCOUNT page.
 * Two layouts:
 *   logged-in : sidebar nav (inline-start) + content card — applied ONLY to the
 *               .woocommerce wrapper that actually contains the account nav
 *               (Elementor adds .woocommerce to unrelated widgets, e.g. swipers,
 *               so the bare ".woocommerce-account .woocommerce" selector is unsafe).
 *   logged-out: #customer_login → two clean cards (התחברות | הרשמה).
 * Relies on oweb-wc-base.css for the palette and form-field styling.
 * RTL-first / logical properties.
 */

/* ── logged-in: nav | content grid ─────────────────────────────────── */
.woocommerce-account .woocommerce:has(> .woocommerce-MyAccount-navigation) {
  display: grid;
  grid-template-columns: 248px minmax(0, 1fr);
  gap: 28px;
  align-items: start;
}

.woocommerce-account .woocommerce:has(> .woocommerce-MyAccount-navigation)::before,
.woocommerce-account .woocommerce:has(> .woocommerce-MyAccount-navigation)::after {
  content: none;
}

.woocommerce-account .woocommerce > .woocommerce-MyAccount-navigation {
  grid-column: 1;
  grid-row: 1;
  float: none;
  width: auto;
  background: var(--oweb-card);
  border: 1px solid var(--oweb-line);
  border-radius: var(--oweb-radius);
  padding: 10px;
  box-shadow: var(--oweb-shadow);
}

.woocommerce-account .woocommerce > .woocommerce-MyAccount-content {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
  float: none;
  width: auto;
  background: var(--oweb-card);
  border: 1px solid var(--oweb-line);
  border-radius: var(--oweb-radius);
  padding: 28px 30px;
  box-shadow: var(--oweb-shadow);
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.woocommerce-account .woocommerce-MyAccount-navigation li {
  border: 0;
  margin: 0;
}

.woocommerce-account .woocommerce-MyAccount-navigation li a {
  display: block;
  padding: 12px 14px;
  border-radius: 9px;
  color: var(--oweb-ink);
  text-decoration: none;
  font-weight: 600;
  font-size: 14.5px;
  transition: background var(--oweb-dur) var(--oweb-ease), color var(--oweb-dur) var(--oweb-ease);
}

/* the theme paints the active link white-on-light → force readable accent */
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover {
  background: rgba(62, 106, 225, .08) !important;
  color: var(--oweb-accent) !important;
}

/* ── logged-out: login | register cards ────────────────────────────── */
.woocommerce-account #customer_login {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 28px;
  align-items: start;
  max-width: 920px;
  margin-inline: auto;
}

/* the theme/WC clearfix pseudos become invisible grid items and scramble
   auto-placement (same as the payment-method radio bug) → remove + place explicitly */
.woocommerce-account #customer_login::before,
.woocommerce-account #customer_login::after {
  content: none;
}

.woocommerce-account #customer_login > .col-1,
.woocommerce-account #customer_login > .u-column1 {
  grid-column: 1;
  grid-row: 1;
}

.woocommerce-account #customer_login > .col-2,
.woocommerce-account #customer_login > .u-column2 {
  grid-column: 2;
  grid-row: 1;
}

.woocommerce-account #customer_login .u-column1,
.woocommerce-account #customer_login .u-column2,
.woocommerce-account #customer_login .col-1,
.woocommerce-account #customer_login .col-2 {
  float: none;
  width: 100%;
  max-width: none;
  padding: 26px 28px;
  background: var(--oweb-card);
  border: 1px solid var(--oweb-line);
  border-radius: var(--oweb-radius);
  box-shadow: var(--oweb-shadow);
}

.woocommerce-account #customer_login h2 {
  margin: 0 0 18px;
  font-size: 19px;
  font-weight: 800;
  letter-spacing: -.01em;
  text-align: start;
}

.woocommerce-account #customer_login .form-row {
  width: 100%;
  float: none;
}

.woocommerce-account #customer_login input.input-text {
  width: 100%;
  box-sizing: border-box;
}

.woocommerce-account #customer_login button.button,
.woocommerce-account #customer_login .woocommerce-button {
  display: block;
  width: 100%;
  padding: 13px 18px;
  border: 0;
  border-radius: 11px;
  background: linear-gradient(180deg, var(--oweb-accent-2), var(--oweb-accent));
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
  transition: transform var(--oweb-dur) var(--oweb-ease), box-shadow var(--oweb-dur) var(--oweb-ease);
}

.woocommerce-account #customer_login button.button:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(62, 106, 225, .3);
}

.woocommerce-account #customer_login .lost_password {
  margin: 12px 0 0;
  font-size: 13px;
}

.woocommerce-account #customer_login .lost_password a {
  color: var(--oweb-accent);
  font-weight: 600;
}

.woocommerce-account #customer_login .woocommerce-form-login__rememberme {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 0 0 12px;
}

.woocommerce-account #customer_login .woocommerce-privacy-policy-text {
  font-size: 12.5px;
  color: var(--oweb-muted);
  line-height: 1.55;
}

/* registration: "a link will be emailed" note */
.woocommerce-account #customer_login .woocommerce-form-register p {
  font-size: 13.5px;
  line-height: 1.55;
}

.woocommerce-account .woocommerce-form-login,
.woocommerce-account .woocommerce-form-register {
  border: 0;
  padding: 0;
  margin: 0;
  max-width: none;
}

/* generic account content niceties */
.woocommerce-account .woocommerce-MyAccount-content a {
  color: var(--oweb-accent);
}

.woocommerce-account .col2-set .col-1,
.woocommerce-account .col2-set .col-2 {
  float: none;
  padding: 0;
}

/* ── responsive ────────────────────────────────────────────────────── */
@media (max-width: 900px) {
  .woocommerce-account .woocommerce:has(> .woocommerce-MyAccount-navigation) {
    grid-template-columns: 1fr;
  }

  .woocommerce-account .woocommerce > .woocommerce-MyAccount-navigation,
  .woocommerce-account .woocommerce > .woocommerce-MyAccount-content {
    grid-column: 1;
  }

  .woocommerce-account #customer_login {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .woocommerce-account .woocommerce > .woocommerce-MyAccount-content {
    padding: 18px;
  }

  .woocommerce-account #customer_login .u-column1,
  .woocommerce-account #customer_login .u-column2,
  .woocommerce-account #customer_login .col-1,
  .woocommerce-account #customer_login .col-2 {
    padding: 20px;
  }
}