/* Postfy Mail - login ekrani: solda kurumsal alan, sagda form */

body.task-login {
  --pf-bg: #ffffff;
  --pf-text: #0f172a;
  --pf-muted: #64748b;
  --pf-faint: #94a3b8;
  --pf-line: #e2e8f0;
  --pf-input-bg: #ffffff;
  --pf-input-border: #cbd5e1;
  --pf-accent: #4f46e5;
  --pf-accent-hover: #4338ca;
  --pf-ring: rgba(79, 70, 229, .18);
  --pf-side-bg: #0b1220;
  --pf-side-text: #e2e8f0;
  --pf-side-muted: #94a3b8;
  background: var(--pf-bg) !important;
  margin: 0;
  min-height: 100vh;
  overflow-x: hidden;
  font-feature-settings: "cv11", "ss01";
}

html.dark-mode body.task-login {
  --pf-bg: #0f172a;
  --pf-text: #f1f5f9;
  --pf-muted: #94a3b8;
  --pf-faint: #64748b;
  --pf-line: #1e293b;
  --pf-input-bg: #0b1220;
  --pf-input-border: #334155;
  --pf-accent: #6366f1;
  --pf-accent-hover: #818cf8;
  --pf-ring: rgba(99, 102, 241, .3);
  --pf-side-bg: #020617;
}

/* Iki sutunlu iskelet */
body.task-login #layout {
  display: flex !important;
  min-height: 100vh;
  width: 100%;
  background: transparent !important;
}

/* Sol alan */
#pf-side {
  flex: 0 0 46%;
  max-width: 640px;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 3rem 3.5rem;
  color: var(--pf-side-text);
  background:
    radial-gradient(60rem 40rem at -10% -20%, rgba(79, 70, 229, .35), transparent 60%),
    radial-gradient(40rem 30rem at 110% 120%, rgba(56, 189, 248, .12), transparent 60%),
    var(--pf-side-bg);
  overflow: hidden;
}
#pf-side::before {
  /* ince izgara deseni */
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255, 255, 255, .04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .04) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, .9), transparent 85%);
  -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, .9), transparent 85%);
  pointer-events: none;
}
#pf-side > * { position: relative; }

.pf-brand { display: flex; align-items: center; gap: .75rem; font-weight: 600; font-size: 1rem; letter-spacing: -.01em; }
.pf-brand img { width: 2.25rem; height: 2.25rem; }

.pf-pitch h2 {
  font-size: clamp(2rem, 3.2vw, 2.75rem);
  line-height: 1.1;
  font-weight: 700;
  letter-spacing: -.03em;
  margin: 0 0 1rem;
  color: #fff;
}
.pf-pitch p { font-size: 1.05rem; color: var(--pf-side-muted); margin: 0 0 2.25rem; max-width: 26rem; }
.pf-pitch ul { list-style: none; padding: 0; margin: 0; display: grid; gap: .9rem; }
.pf-pitch li { display: flex; align-items: center; gap: .7rem; font-size: .95rem; color: var(--pf-side-text); }
.pf-pitch li svg { width: 1.25rem; height: 1.25rem; flex: none; fill: none; stroke: #818cf8; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }

.pf-side-foot { display: grid; gap: .35rem; font-size: .8rem; color: var(--pf-side-muted); }
.pf-side-foot strong { color: var(--pf-side-text); font-weight: 600; font-size: .875rem; }

/* Sag alan */
body.task-login #layout-content {
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: auto !important;
  max-width: none !important;
  min-height: 100vh;
  height: auto !important;
  margin: 0 !important;
  padding: 3rem 1.5rem !important;
  background: var(--pf-bg) !important;
  border: 0 !important;
  box-shadow: none !important;
  text-align: left;
}

/* Elastic'in kendi logosu: sag tarafta gerek yok */
body.task-login #logo { display: none !important; }

#pf-intro, body.task-login #login-form { width: 100%; max-width: 22rem; }
#pf-intro { margin-bottom: 2rem; }
#pf-intro .pf-mobile-logo { display: none; width: 2.75rem; height: 2.75rem; margin-bottom: 1.5rem; }
#pf-intro h1 {
  font-size: 1.6rem;
  font-weight: 700;
  letter-spacing: -.025em;
  color: var(--pf-text);
  margin: 0 0 .5rem;
}
#pf-intro p { font-size: .925rem; line-height: 1.5; color: var(--pf-muted); margin: 0; }

body.task-login #login-form {
  position: static !important;
  top: auto !important;
  margin: 0 !important;
  text-align: left;
}
body.task-login #login-form table,
body.task-login #login-form tbody,
body.task-login #login-form tr,
body.task-login #login-form td { display: block !important; width: 100% !important; padding: 0 !important; border: 0 !important; }
body.task-login #login-form tr { margin-bottom: 1.15rem; }

body.task-login #login-form td.title {
  font-size: .825rem;
  font-weight: 600;
  color: var(--pf-text);
  margin-bottom: .45rem;
  text-align: left;
}
body.task-login #login-form td.title label { color: inherit; margin: 0; }

body.task-login #login-form input.form-control {
  width: 100% !important;
  height: auto !important;
  padding: .75rem .9rem !important;
  font-size: .95rem !important;
  color: var(--pf-text) !important;
  background: var(--pf-input-bg) !important;
  border: 1px solid var(--pf-input-border) !important;
  border-radius: .6rem !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .04) !important;
  transition: border-color .15s, box-shadow .15s;
}
body.task-login #login-form input.form-control::placeholder { color: var(--pf-faint); }
body.task-login #login-form input.form-control:focus {
  outline: none !important;
  border-color: var(--pf-accent) !important;
  box-shadow: 0 0 0 3px var(--pf-ring) !important;
}
body.task-login #login-form .input-group-prepend,
body.task-login #login-form .input-group-text { display: none !important; }
body.task-login #login-form .input-group > .form-control { border-radius: .6rem !important; }

body.task-login #login-form .formbuttons { margin: 1.6rem 0 0 !important; padding: 0 !important; }
body.task-login #rcmloginsubmit {
  width: 100% !important;
  padding: .8rem 1rem !important;
  font-size: .95rem !important;
  font-weight: 600 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  color: #fff !important;
  background: var(--pf-accent) !important;
  border: 0 !important;
  border-radius: .6rem !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .1) !important;
  transition: background-color .15s;
}
body.task-login #rcmloginsubmit:hover { background: var(--pf-accent-hover) !important; }
body.task-login #rcmloginsubmit:focus-visible { outline: 3px solid var(--pf-ring) !important; outline-offset: 2px; }

#pf-secure {
  display: flex;
  align-items: flex-start;
  gap: .5rem;
  margin: 1.5rem 0 0;
  padding-top: 1.25rem;
  border-top: 1px solid var(--pf-line);
  font-size: .8rem;
  line-height: 1.45;
  color: var(--pf-muted);
}
#pf-secure svg { width: 1rem; height: 1rem; flex: none; margin-top: .1rem; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }

body.task-login #login-footer { display: none !important; }
body.task-login #messagestack { z-index: 10; }

/* Tablet ve mobil: sol alan gizlenir */
@media (max-width: 900px) {
  #pf-side { display: none; }
  #pf-intro .pf-mobile-logo { display: block; }
  body.task-login #layout { width: 100vw !important; max-width: 100vw; overflow: hidden; }
  body.task-login #layout-content {
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    align-items: stretch;
    justify-content: flex-start;
    padding: 14vh 1.5rem 2.5rem !important;
  }
  #pf-intro, body.task-login #login-form { max-width: 22rem; margin-left: auto !important; margin-right: auto !important; }
}
