/*
 * RevApple — branded wp-login.php styles
 * Replaces the default WordPress login chrome with the RevApple visual system.
 */

:root {
    --ra-paper:        #fafaf6;
    --ra-paper-soft:   #ffffff;
    --ra-ink:          #0c1814;
    --ra-ink-soft:     #2a342e;
    --ra-muted:        #687570;
    --ra-rule:         #e8e6dc;
    --ra-rule-strong:  #c8c4b6;
    --ra-green:        #1d6b3a;
    --ra-green-deep:   #154d29;
    --ra-teal:         #1d5670;
    --ra-teal-deep:    #103a4d;
}

body.login {
    background: var(--ra-paper) !important;
    font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    color: var(--ra-ink) !important;
    -webkit-font-smoothing: antialiased;
}

/* Animated brand stripe at the very top */
body.login::before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg,
        var(--ra-green) 0%,
        var(--ra-green-deep) 35%,
        var(--ra-teal-deep) 65%,
        var(--ra-teal) 100%);
    background-size: 200% 100%;
    animation: ra-login-stripe 18s ease-in-out infinite;
    z-index: 100;
}

@keyframes ra-login-stripe {
    0%, 100% { background-position:   0% 50%; }
    50%      { background-position: 100% 50%; }
}

@media (prefers-reduced-motion: reduce) {
    body.login::before { animation: none; }
}

/* Soft brand-tinted radial wash behind the form */
body.login::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background:
        radial-gradient(ellipse 40% 30% at 85% 12%, rgba(29, 107, 58, 0.10) 0%, transparent 60%),
        radial-gradient(ellipse 40% 30% at 12% 88%, rgba(29, 86, 112, 0.10) 0%, transparent 60%);
}

/* Center column */
#login {
    width: 360px !important;
    padding-top: 7vh !important;
}

/* RevApple mark replaces the WP logo */
.login h1 a {
    background-image: url('logo-mark.png') !important;
    background-size: contain !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    width: 92px !important;
    height: 92px !important;
    margin: 0 auto 8px !important;
    padding: 0 !important;
    text-indent: -9999px !important;
    overflow: hidden !important;
}

/* Wordmark below the mark */
.login h1::after {
    content: "RevApple";
    display: block;
    text-align: center;
    font-family: "Instrument Serif", Georgia, serif;
    font-size: 2rem;
    line-height: 1;
    background: linear-gradient(95deg, var(--ra-green-deep), var(--ra-teal-deep));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: var(--ra-teal-deep);
    margin: 6px 0 24px;
    letter-spacing: -0.01em;
}

.login h1 { text-align: center; }

/* Form card */
.login form {
    background: var(--ra-paper-soft) !important;
    border: 1px solid var(--ra-rule) !important;
    border-radius: 4px !important;
    box-shadow: 0 8px 30px rgba(13, 27, 20, 0.04) !important;
    padding: 32px 30px !important;
    margin-top: 16px !important;
    overflow: visible !important;
}

/* Labels — mono uppercase, like the rest of the site */
.login form .input,
.login form input[type="text"],
.login form input[type="password"],
.login form input[type="email"] {
    background: var(--ra-paper) !important;
    border: 1px solid var(--ra-rule-strong) !important;
    border-radius: 4px !important;
    padding: 12px 14px !important;
    font-family: "Inter", sans-serif !important;
    font-size: 1rem !important;
    color: var(--ra-ink) !important;
    min-height: 48px !important;
    box-shadow: none !important;
    transition: border-color 280ms cubic-bezier(0.22, 1, 0.36, 1),
                box-shadow 280ms cubic-bezier(0.22, 1, 0.36, 1) !important;
}

.login form input[type="text"]:focus,
.login form input[type="password"]:focus,
.login form input[type="email"]:focus,
.login form .input:focus {
    border-color: var(--ra-teal) !important;
    outline: 0 !important;
    box-shadow: 0 0 0 3px rgba(29, 86, 112, 0.14) !important;
}

.login label {
    font-family: "JetBrains Mono", ui-monospace, monospace !important;
    font-size: 0.74rem !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    color: var(--ra-muted) !important;
    font-weight: 400 !important;
}

/* Forgot-me checkbox row — keep readable sans, not mono */
.login .forgetmenot label,
.login p.submit label {
    text-transform: none !important;
    letter-spacing: 0 !important;
    font-family: "Inter", sans-serif !important;
    font-size: 0.92rem !important;
    color: var(--ra-ink-soft) !important;
}

.login .forgetmenot { margin-bottom: 18px !important; }

/* Submit button — match site CTA */
.wp-core-ui .button-primary,
.login .button.button-large {
    background: var(--ra-ink) !important;
    border: 1px solid var(--ra-ink) !important;
    color: #fff !important;
    border-radius: 4px !important;
    padding: 12px 22px !important;
    font-family: "Inter", sans-serif !important;
    font-size: 0.95rem !important;
    font-weight: 600 !important;
    letter-spacing: -0.005em !important;
    text-shadow: none !important;
    box-shadow: none !important;
    min-height: 48px !important;
    width: 100% !important;
    transition: background 280ms cubic-bezier(0.22, 1, 0.36, 1),
                border-color 280ms cubic-bezier(0.22, 1, 0.36, 1) !important;
    text-transform: none !important;
    height: auto !important;
    line-height: 1.2 !important;
}

.wp-core-ui .button-primary:hover,
.wp-core-ui .button-primary:focus,
.login .button.button-large:hover {
    background: var(--ra-teal-deep) !important;
    border-color: var(--ra-teal-deep) !important;
    color: #fff !important;
}

/* Below-form links */
.login #nav,
.login #backtoblog {
    text-align: center !important;
    margin: 18px 0 !important;
    padding: 0 16px !important;
}

.login #nav a,
.login #backtoblog a {
    color: var(--ra-ink-soft) !important;
    font-size: 0.92rem !important;
    text-decoration: underline !important;
    text-decoration-color: var(--ra-rule-strong) !important;
    text-underline-offset: 0.22em !important;
    text-decoration-thickness: 1px !important;
    transition: color 280ms cubic-bezier(0.22, 1, 0.36, 1) !important;
}

.login #nav a:hover,
.login #backtoblog a:hover {
    color: var(--ra-teal-deep) !important;
    text-decoration-color: var(--ra-teal) !important;
}

.login .privacy-policy-page-link { margin-top: 24px !important; }

/* Messages */
.login .message {
    border-left: 4px solid var(--ra-teal-deep) !important;
    background: var(--ra-paper-soft) !important;
    box-shadow: 0 4px 14px rgba(13, 27, 20, 0.05) !important;
    border-radius: 2px !important;
    padding: 14px 18px !important;
    font-family: "Inter", sans-serif !important;
    color: var(--ra-ink) !important;
}

.login #login_error {
    border-left: 4px solid #9b2226 !important;
    background: var(--ra-paper-soft) !important;
    color: var(--ra-ink) !important;
    box-shadow: 0 4px 14px rgba(13, 27, 20, 0.05) !important;
    border-radius: 2px !important;
    padding: 14px 18px !important;
    font-family: "Inter", sans-serif !important;
}

/* RevApple footer note */
.ra-login__footer {
    text-align: center !important;
    margin-top: 36px !important;
    font-family: "JetBrains Mono", ui-monospace, monospace !important;
    font-size: 0.72rem !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    color: var(--ra-muted) !important;
}
.ra-login__footer a {
    color: var(--ra-teal-deep) !important;
    text-decoration-color: rgba(29, 86, 112, 0.4);
}
.ra-login__footer a:hover {
    color: var(--ra-green-deep) !important;
}

/* Tighten the language dropdown if present */
.language-switcher {
    text-align: center !important;
    margin-top: 16px !important;
}
.language-switcher select {
    border: 1px solid var(--ra-rule-strong) !important;
    border-radius: 4px !important;
    background: var(--ra-paper-soft) !important;
    color: var(--ra-ink) !important;
    font-family: "Inter", sans-serif !important;
    padding: 6px 10px !important;
}

/* Hide the WP "Powered by" plug if shown */
.login .privacy-policy-page-link a {
    color: var(--ra-muted) !important;
}