/* km-login.css — Giriş sayfası için tema uyumlu stiller */

/* Wrapper: kart + brand */
.km-auth-card-wrap {
  display: flex;
  gap: 28px;
  align-items: flex-start;
  justify-content: center;
  padding: 18px 12px;
}

/* Brand (sol) */
.km-auth-brand {
  flex: 0 0 240px;
  display:flex;
  align-items:flex-start;
  justify-content:flex-start;
}
.km-auth-brand .km-brand { text-decoration:none; color:inherit; }
.km-auth-brand .km-brand-title { display:block; font-weight:900; font-size:20px; color:#111; }
.km-auth-brand .km-brand-tag { display:block; font-size:13px; color:rgba(0,0,0,0.7); margin-top:4px; }

/* Card */
.km-auth-card {
  flex: 1 1 560px;
  background: #fff;
  border-radius: 14px;
  padding: 22px;
  box-shadow: 0 18px 48px rgba(0,0,0,0.12);
  max-width: 620px;
  box-sizing: border-box;
}

.km-auth-title {
  margin: 0 0 8px;
  font-size: 26px;
  font-weight: 800;
  color: #111;
}

/* intro text */
.km-auth-intro p {
  margin: 0 0 14px;
  color: #444;
  line-height: 1.45;
  font-size: 14px;
}

/* Login form fields (wp_login_form uses IDs set in template) */
#km-loginform { display:block; }
#km-loginform p { margin: 8px 0; }
#km-loginform label { display:block; font-weight:700; font-size:13px; margin-bottom:6px; color:#333; }
#km-loginform input[type="text"],
#km-loginform input[type="password"],
#km-loginform input[type="email"] {
  width:100%;
  padding:10px 12px;
  border:1px solid #e6e6e6;
  border-radius:10px;
  font-size:14px;
  box-sizing:border-box;
}
#km-loginform .login-remember { display:flex; align-items:center; gap:8px; margin-top:6px; color:#555; }
#km-wp-submit, #km-wp-submit.button {
  background:#111;
  color:#fff;
  border:0;
  padding:10px 16px;
  border-radius:999px;
  font-weight:700;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:8px;
  box-shadow: 0 10px 28px rgba(0,0,0,0.14);
}

/* links row */
.km-auth-links { margin-top:14px; font-size:14px; color:#0b5d91; display:flex; gap:10px; align-items:center; }
.km-auth-links a { color:#0b5d91; text-decoration:underline; }
.km-auth-links .km-dot { color:#888; font-weight:700; }

/* Accessibility / small polish */
#km-loginform input:focus { outline: 3px solid rgba(11,93,145,0.12); outline-offset:2px; }

/* Small screens: stack brand above card and center */
@media (max-width: 980px) {
  .km-auth-card-wrap { flex-direction: column; gap: 14px; align-items: center; padding: 12px; }
  .km-auth-brand { order: -1; flex: 0 0 auto; text-align:center; }
  .km-auth-card { width:100%; padding:16px; max-width:640px; }
  .km-auth-title { text-align:left; font-size:22px; }
}

/* Very small phones: tighter paddings */
@media (max-width: 520px) {
  .km-container { padding-left:16px; padding-right:16px; }
  .km-auth-card { padding:14px; border-radius:12px; }
  .km-auth-title { font-size:20px; }
  #km-wp-submit { width:100%; justify-content:center; }
  .km-auth-links { justify-content:flex-start; gap:8px; font-size:13px; }
}

/* Ensure header topbar doesn't overlap form on small fixed header */
body.km-topbar-fixed .km-container { margin-top: calc(var(--km-topbar-height,76px) + 8px); }

/* If login form prints error messages (wp-login-form does not by default on frontend),
   they will be visible and styled here */
.km-auth-card .login-errors, .km-auth-card .message {
  margin-bottom:12px;
  padding:10px 12px;
  border-radius:10px;
  background: #fff3f3;
  color: #8b1a1a;
  border:1px solid rgba(139,26,26,0.08);
}