:root {
  --ogeday-red: #ef2334;
  --ogeday-red-dark: #9f0715;
  --ogeday-ink: #050607;
  --ogeday-panel: rgba(10, 12, 15, 0.86);
  --ogeday-line: rgba(255, 255, 255, 0.12);
}

html, body.task-login {
  background:
    radial-gradient(circle at 78% 16%, rgba(239, 35, 52, 0.24), transparent 28%),
    radial-gradient(circle at 18% 88%, rgba(0, 180, 170, 0.08), transparent 32%),
    linear-gradient(135deg, #020304 0%, #0a0d10 48%, #030405 100%) !important;
}

body.task-login #layout-content {
  background: transparent !important;
}

body.task-login #login-form {
  background: var(--ogeday-panel) !important;
  border: 1px solid var(--ogeday-line) !important;
  border-radius: 28px !important;
  box-shadow: 0 28px 90px rgba(0, 0, 0, 0.55), 0 0 80px rgba(239, 35, 52, 0.13) !important;
  backdrop-filter: blur(18px);
  padding: 34px !important;
}

body.task-login #login-form::before {
  content: 'OGEDAY güvenli webmail alanı';
  display: block;
  margin: 0 0 18px;
  color: rgba(255, 255, 255, 0.68);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

body.task-login #logo,
body.task-login .login-logo {
  filter: drop-shadow(0 0 24px rgba(239, 35, 52, 0.35));
  max-height: 76px !important;
  margin-bottom: 18px !important;
}

body.task-login input,
body.task-login .form-control {
  background: rgba(255, 255, 255, 0.055) !important;
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
  color: #fff !important;
  border-radius: 14px !important;
}

body.task-login input:focus,
body.task-login .form-control:focus {
  border-color: rgba(239, 35, 52, 0.78) !important;
  box-shadow: 0 0 0 0.2rem rgba(239, 35, 52, 0.22) !important;
}

body.task-login .button,
body.task-login button[type='submit'],
body.task-login .btn-primary {
  background: linear-gradient(135deg, var(--ogeday-red), var(--ogeday-red-dark)) !important;
  border: 0 !important;
  border-radius: 14px !important;
  box-shadow: 0 18px 46px rgba(239, 35, 52, 0.22) !important;
  font-weight: 800 !important;
}

body.task-login #login-footer::before {
  content: '@ogedays.com hesapları ile giriş yapın. Orbions ve diğer domain hesapları bu yüzeyde kabul edilmez.';
  display: block;
  color: rgba(255, 255, 255, 0.52);
  font-size: 12px;
  line-height: 1.45;
  max-width: 360px;
  margin: 20px auto 0;
}

#taskmenu a,
.toolbar a.button,
.listing tbody tr.selected td,
.btn-primary {
  --link: var(--ogeday-red);
}

body.task-login::before {
  content: 'OGEDAY WEBMAIL';
  position: fixed;
  top: 34px;
  left: 40px;
  z-index: 1;
  color: rgba(255, 255, 255, 0.88);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.34em;
  text-transform: uppercase;
}

body.task-login::after {
  content: 'Sadece @ogedays.com posta hesaplari kabul edilir';
  position: fixed;
  right: 40px;
  bottom: 32px;
  z-index: 1;
  color: rgba(255, 255, 255, 0.54);
  font-size: 12px;
  letter-spacing: 0.08em;
}

body.task-login #login-form::after {
  content: 'Orbions webmailinden ayridir. Bu ekran OGEDAY icin ozel olarak sinirlandirilmistir.';
  display: block;
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.48);
  font-size: 12px;
  line-height: 1.5;
}

body.task-login #login-footer,
body.task-login #login-footer a[href*='roundcube'] {
  color: rgba(255, 255, 255, 0.34) !important;
}

@media (max-width: 720px) {
  body.task-login::before {
    top: 18px;
    left: 20px;
    font-size: 10px;
  }

  body.task-login::after {
    left: 20px;
    right: 20px;
    bottom: 18px;
    text-align: center;
  }
}

/* OGEDAY login form polish: neutralize Elastic table/icon layout. */
body.task-login #login-form {
  width: min(430px, calc(100vw - 40px)) !important;
  box-sizing: border-box !important;
  text-align: center !important;
}

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;
  box-sizing: border-box !important;
  border: 0 !important;
  padding: 0 !important;
}

body.task-login #login-form td.title {
  display: none !important;
}

body.task-login #login-form td.input {
  margin: 0 0 14px !important;
}

body.task-login #login-form input.form-control {
  width: 100% !important;
  height: 58px !important;
  min-height: 58px !important;
  padding: 0 20px !important;
  margin: 0 !important;
  font-size: 18px !important;
  line-height: 58px !important;
  text-align: left !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.02) !important;
}

body.task-login #login-form .formbuttons {
  margin: 12px 0 0 !important;
}

body.task-login #login-form button[type='submit'],
body.task-login #login-form .button.mainaction {
  width: 100% !important;
  min-height: 58px !important;
  margin: 0 !important;
  font-size: 17px !important;
  letter-spacing: 0.02em !important;
}

body.task-login #logo {
  display: block !important;
  width: min(260px, 72vw) !important;
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
  margin: 0 auto 28px !important;
}

body.task-login #layout-content {
  min-height: 100vh !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 72px 20px 54px !important;
}

body.task-login #layout-content > .box,
body.task-login #layout-content > div {
  max-width: 460px !important;
}

body.task-login #login-footer {
  margin-top: 22px !important;
  text-align: center !important;
}

body.task-login #login-footer::before {
  margin: 18px auto 0 !important;
}

@media (max-width: 720px) {
  body.task-login #login-form {
    width: min(390px, calc(100vw - 28px)) !important;
    border-radius: 24px !important;
    padding: 28px !important;
  }

  body.task-login #login-form input.form-control,
  body.task-login #login-form button[type='submit'] {
    height: 54px !important;
    min-height: 54px !important;
    font-size: 16px !important;
  }

  body.task-login #logo {
    width: min(230px, 76vw) !important;
    margin-bottom: 22px !important;
  }
}

body.task-login #login-form.ogeday-polished tr {
  display: block !important;
  margin: 0 0 14px !important;
}

body.task-login #login-form.ogeday-polished td.title,
body.task-login #login-form.ogeday-polished label[for='rcmloginuser'],
body.task-login #login-form.ogeday-polished label[for='rcmloginpwd'] {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
}

body.task-login #login-form.ogeday-polished td.input {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
}

body.task-login #login-form.ogeday-polished #rcmloginuser,
body.task-login #login-form.ogeday-polished #rcmloginpwd {
  border-radius: 16px !important;
}

body.task-login #login-form.ogeday-polished .input-group-prepend,
body.task-login #login-form.ogeday-polished .input-group-text.icon,
body.task-login #login-form.ogeday-polished .icon.user,
body.task-login #login-form.ogeday-polished .icon.pass {
  display: none !important;
  width: 0 !important;
  min-width: 0 !important;
  max-width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  overflow: hidden !important;
}

body.task-login #login-form.ogeday-polished td.input.input-group,
body.task-login #login-form.ogeday-polished .input-group.input-group-lg {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
}

body.task-login #login-form.ogeday-polished .input-group > .form-control,
body.task-login #login-form.ogeday-polished .input-group-lg > .form-control {
  display: block !important;
  width: 100% !important;
  border-radius: 16px !important;
}

/* OGEDAY clean login copy and visible wordmark pass. */
body.task-login #login-form::before {
  content: 'Ogeday Webmail' !important;
  margin-bottom: 22px !important;
  color: rgba(255, 255, 255, 0.9) !important;
  font-size: 14px !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
}

body.task-login #login-form::after,
body.task-login #login-footer::before,
body.task-login::after {
  content: none !important;
  display: none !important;
}

body.task-login #login-footer {
  display: none !important;
}

body.task-login #ogeday-logo-wordmark {
  margin: -16px auto 34px !important;
  text-align: center !important;
  pointer-events: none !important;
}

body.task-login #ogeday-logo-wordmark .ogeday-wordmark-title {
  color: rgba(255, 255, 255, 0.96) !important;
  font-size: 24px !important;
  font-weight: 900 !important;
  letter-spacing: 0.38em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  text-shadow: 0 0 26px rgba(239, 35, 52, 0.18) !important;
}

body.task-login #ogeday-logo-wordmark .ogeday-wordmark-subtitle {
  margin-top: 10px !important;
  color: rgba(255, 255, 255, 0.5) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.28em !important;
  text-transform: uppercase !important;
}

body.task-login #logo {
  margin-bottom: 18px !important;
}

@media (max-width: 720px) {
  body.task-login #ogeday-logo-wordmark .ogeday-wordmark-title {
    font-size: 20px !important;
    letter-spacing: 0.3em !important;
  }

  body.task-login #ogeday-logo-wordmark .ogeday-wordmark-subtitle {
    font-size: 9px !important;
    letter-spacing: 0.18em !important;
  }
}


/* Final wordmark alignment pass. */
body.task-login #login-form::before {
  content: 'Ogeday Webmail' !important;
  text-transform: none !important;
  letter-spacing: 0.08em !important;
  font-size: 16px !important;
  font-weight: 800 !important;
}

body.task-login #logo {
  width: min(260px, 72vw) !important;
  height: 128px !important;
  object-fit: cover !important;
  object-position: top center !important;
  margin: 0 auto 12px !important;
}

body.task-login #ogeday-logo-wordmark {
  margin: 0 auto 34px !important;
}

body.task-login #ogeday-logo-wordmark .ogeday-wordmark-title {
  font-size: 23px !important;
  letter-spacing: 0.34em !important;
}

body.task-login #ogeday-logo-wordmark .ogeday-wordmark-subtitle {
  margin-top: 9px !important;
  color: rgba(255, 255, 255, 0.56) !important;
}

@media (max-width: 720px) {
  body.task-login #login-form::before {
    font-size: 15px !important;
  }

  body.task-login #logo {
    width: min(230px, 76vw) !important;
    height: 114px !important;
  }

  body.task-login #ogeday-logo-wordmark {
    margin-bottom: 28px !important;
  }
}

/* Neutralize Elastic's relative logo offset so wordmark sits under the mark. */
body.task-login #logo {
  position: static !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  display: block !important;
}