/*
 * Ops Board — login screen ("Access Terminal") styles.
 * Scoped entirely to body.login so it never leaks into the front end or admin.
 */

body.login {
  background:
    linear-gradient(#232a20 1px, transparent 1px) 0 0 / 100% 44px,
    linear-gradient(90deg, #232a20 1px, transparent 1px) 0 0 / 44px 100%,
    #0a0d0a;
  font-family: 'IBM Plex Sans', -apple-system, sans-serif;
}

body.login * {
  box-sizing: border-box;
}

/* Fixed clock, top right of the viewport */
body.login::before {
  content: "";
}

.opsboard-login-clock {
  position: fixed;
  top: 20px;
  right: 24px;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 12px;
  letter-spacing: 0.08em;
  color: #ffb000;
  text-align: right;
  z-index: 50;
}

.opsboard-login-clock .label {
  display: block;
  color: #8b9187;
  font-size: 9px;
  letter-spacing: 0.15em;
}

.opsboard-login-status {
  position: fixed;
  top: 20px;
  left: 24px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #8b9187;
  z-index: 50;
}

.opsboard-login-status .dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #3ddc84;
  box-shadow: 0 0 8px #3ddc84;
}

/* Logo / site name area */
#login h1 {
  text-align: center;
}

#login h1 a {
  background-image: none !important;
  width: auto !important;
  height: auto !important;
  display: inline-block;
  text-indent: 0 !important;
  font-family: 'Oswald', sans-serif;
  font-weight: 600;
  font-size: 24px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #e6e6de !important;
  padding-bottom: 6px;
}

#login h1::before {
  content: "// Authentication Required";
  display: block;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #8b9187;
  margin-bottom: 10px;
}

/* The login box itself, with bracket-frame corners matching the site's thumbnails */
#login {
  padding: 90px 0 0;
  width: 360px;
}

#loginform {
  position: relative;
  background: #12160f;
  border: 1px solid #232a20;
  padding: 26px 24px 20px;
  box-shadow: none;
}

#loginform::before,
#loginform::after {
  content: "";
  position: absolute;
  width: 20px;
  height: 20px;
  pointer-events: none;
}

#loginform::before {
  top: -1px;
  left: -1px;
  border-top: 2px solid #ffb000;
  border-left: 2px solid #ffb000;
}

#loginform::after {
  bottom: -1px;
  right: -1px;
  border-bottom: 2px solid #ffb000;
  border-right: 2px solid #ffb000;
}

#loginform label {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10.5px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #8b9187;
}

#loginform input[type="text"],
#loginform input[type="password"] {
  background: #0a0d0a;
  border: 1px solid #232a20;
  border-radius: 0;
  color: #e6e6de;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 14px;
  padding: 10px 12px;
  box-shadow: none;
}

#loginform input[type="text"]:focus,
#loginform input[type="password"]:focus {
  border-color: #ffb000;
  box-shadow: 0 0 0 1px #ffb000;
  outline: none;
}

.forgetmenot label {
  color: #8b9187;
  font-family: 'IBM Plex Sans', sans-serif;
  text-transform: none;
  letter-spacing: normal;
  font-size: 13px;
}

/* Submit button */
.wp-core-ui .button-primary {
  width: 100%;
  background: transparent;
  border: 1px solid #ffb000;
  color: #ffb000;
  border-radius: 0;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-shadow: none;
  box-shadow: none;
  padding: 10px 14px;
  height: auto;
}

.wp-core-ui .button-primary:hover,
.wp-core-ui .button-primary:focus {
  background: rgba(255, 176, 0, 0.1);
  border-color: #ffb000;
  color: #ffb000;
  box-shadow: none;
}

/* Links below the form (lost password, back to site) */
#nav, #backtoblog {
  text-align: center;
  margin-top: 16px;
}

#nav a, #backtoblog a {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #8b9187;
}

#nav a:hover, #backtoblog a:hover {
  color: #ffb000;
}

/* Error / success messages, styled like priority tags */
#login_error,
#login .message,
#login .success {
  background: #12160f;
  border: 1px solid #232a20;
  border-left: 3px solid #d6432b;
  border-radius: 0;
  color: #e6e6de;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 12px;
  letter-spacing: 0.02em;
  box-shadow: none;
  padding: 12px 14px;
}

#login .message,
#login .success {
  border-left-color: #3ddc84;
}

/* Checkbox accent */
#loginform input[type="checkbox"] {
  accent-color: #ffb000;
}

/* Language switcher + privacy link, de-emphasized */
#language-switcher,
.privacy-policy-page-link {
  text-align: center;
}

.privacy-policy-page-link a {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10px;
  color: #8b9187;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
