/* ── Auth Page — beiti.co.il Budget Manager ──────── */
@import url('https://fonts.googleapis.com/css2?family=Heebo:wght@400;500;600;700;800&display=swap');

#nbm-auth-page {
  font-family: 'Heebo', sans-serif;
  direction: rtl;
  min-height: 100vh;
  background: #FAF8F2;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px 16px;
  color: #1F1B14;
}

/* ── Wrap ── */
.nbm-auth-wrap {
  width: 100%;
  max-width: 420px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
}

/* ── Header ── */
.nbm-auth-header {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}
.nbm-auth-logo-img {
  height: 48px !important;
  width: auto !important;
  max-height: 48px !important;
  max-width: 220px !important;
  object-fit: contain;
  border-radius: 12px;
}
.nbm-auth-title {
  font-size: 1.35rem;
  font-weight: 800;
  color: #1F1B14;
  margin: 0;
}
.nbm-auth-sub {
  font-size: .85rem;
  color: #8B826E;
  margin: 0;
}

/* ── Card ── */
.nbm-auth-card {
  width: 100%;
  background: #FFFFFF;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 14px;
  padding: 28px 28px 24px;
  box-shadow: 0 8px 28px rgba(0,0,0,.07);
}

/* ── Tabs ── */
.nbm-auth-tabs {
  display: flex;
  gap: 2px;
  background: #F4F1E8;
  border-radius: 8px;
  padding: 4px;
  margin-bottom: 24px;
}
.nbm-auth-tab {
  flex: 1;
  font-family: 'Heebo', sans-serif;
  font-size: .875rem;
  font-weight: 600;
  color: #8B826E;
  background: none;
  border: none;
  padding: 9px 14px;
  border-radius: 6px;
  cursor: pointer;
  transition: all .15s ease;
  text-align: center;
}
.nbm-auth-tab:hover { color: #5A5345; }
.nbm-auth-tab.active {
  background: #F0C944;
  color: #1a1200;
  font-weight: 700;
}

/* ── Pane ── */
.nbm-auth-pane {}

/* ── Error ── */
.nbm-auth-error {
  background: rgba(208,72,72,.10);
  border: 1px solid rgba(208,72,72,.28);
  border-radius: 6px;
  padding: 10px 14px;
  font-size: .85rem;
  color: #d04848;
  margin-bottom: 16px;
}

/* ── Form ── */
.nbm-auth-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.nbm-auth-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.nbm-auth-label {
  font-size: .78rem;
  font-weight: 700;
  color: #5A5345;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.nbm-auth-input {
  width: 100%;
  background: #F4F1E8;
  border: 1.5px solid rgba(0,0,0,.12);
  border-radius: 7px;
  color: #1F1B14;
  font-family: 'Heebo', sans-serif;
  font-size: .9rem;
  padding: 10px 14px;
  outline: none;
  transition: border-color .15s ease;
  direction: ltr;
  text-align: left;
}
/* RTL fields (name) */
.nbm-auth-input[name="user_login"],
.nbm-auth-input[name="log"] {
  direction: rtl;
  text-align: right;
}
.nbm-auth-input:focus {
  border-color: #F0C944;
}

/* Password wrapper */
.nbm-pw-wrap {
  position: relative;
}
.nbm-pw-wrap .nbm-auth-input {
  padding-left: 40px;
}
.nbm-pw-eye {
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  cursor: pointer;
  font-size: 1rem;
  color: #8B826E;
  line-height: 1;
  padding: 2px;
  transition: color .15s;
}
.nbm-pw-eye:hover { color: #5A5345; }

/* Password match message */
.nbm-pw-match-msg {
  font-size: .78rem;
  font-weight: 600;
  margin-top: 3px;
  min-height: 18px;
  display: block;
}

/* Extras row (remember + forgot) */
.nbm-auth-extras {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: -4px;
}
.nbm-auth-check {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: .82rem;
  color: #8B826E;
  cursor: pointer;
}
.nbm-auth-check input[type="checkbox"] {
  accent-color: #F0C944;
  width: 14px;
  height: 14px;
}
.nbm-auth-link-small {
  font-size: .82rem;
  color: #B8860B;
  text-decoration: none;
  font-weight: 500;
}
.nbm-auth-link-small:hover { text-decoration: underline; }

/* Submit buttons */
.nbm-auth-submit {
  width: 100%;
  background: #F0C944;
  color: #1a1200;
  border: none;
  border-radius: 7px;
  font-family: 'Heebo', sans-serif;
  font-size: 1rem;
  font-weight: 800;
  padding: 12px 20px;
  cursor: pointer;
  transition: background .15s ease, transform .1s ease;
  margin-top: 4px;
}
.nbm-auth-submit:hover {
  background: #d4b020;
  transform: translateY(-1px);
}
.nbm-auth-submit:disabled {
  opacity: .5;
  cursor: not-allowed;
  transform: none;
}
/* Register submit — secondary style */
.nbm-auth-submit-sec {
  background: #F4F1E8;
  color: #B8860B;
  border: 1.5px solid rgba(240,201,68,.55);
}
.nbm-auth-submit-sec:hover {
  background: #EDE9DE;
  border-color: rgba(240,201,68,.8);
}

/* Switch link */
.nbm-auth-switch {
  margin: 16px 0 0;
  text-align: center;
  font-size: .85rem;
  color: #8B826E;
}
.nbm-switch-btn {
  background: none;
  border: none;
  color: #B8860B;
  font-family: 'Heebo', sans-serif;
  font-size: .85rem;
  font-weight: 700;
  cursor: pointer;
  text-decoration: underline;
  padding: 0;
}

/* ── Feature strip ── */
.nbm-auth-features {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: center;
}
.nbm-auth-feat {
  display: flex;
  align-items: center;
  gap: 5px;
  background: #F4F1E8;
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 20px;
  padding: 5px 12px;
  font-size: .78rem;
  color: #8B826E;
}

/* ── Responsive ── */
@media (max-width: 480px) {
  .nbm-auth-card { padding: 20px 18px; }
  .nbm-auth-wrap { gap: 18px; }
}