/* Strona logowania w stylu motywu DJ Sawik (ładowana przez includes/login.php). */
:root {
    --ink: #0a0908;
    --panel: #141210;
    --gold: #c9a24a;
    --gold-hi: #e7c877;
    --cream: #f0eae0;
    --muted: #a79f92;
    --line: rgba(201, 162, 74, 0.28);
}

html,
body.login {
    background-color: var(--ink);
}

body.login {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 100vh;
    background-image:
        radial-gradient(60vmax 60vmax at 100% 0%, rgba(232, 137, 43, 0.2), rgba(232, 137, 43, 0) 70%),
        radial-gradient(60vmax 60vmax at 0% 100%, rgba(232, 137, 43, 0.16), rgba(232, 137, 43, 0) 70%),
        linear-gradient(rgba(10, 9, 8, 0.86), rgba(10, 9, 8, 0.86)),
        var(--login-bg);
    background-size: auto, auto, auto, cover;
    background-position: center;
    background-attachment: fixed;
    color: var(--cream);
    font-family: "Instrument Sans", "Segoe UI", sans-serif;
    font-size: 15px;
}

.login #login {
    width: min(24rem, calc(100% - 2.5rem));
    padding: 3rem 0 2rem;
}

/* Logo */
.login h1 a {
    width: 100%;
    height: 7.5rem;
    margin: 0 auto 1.75rem;
    background-image: var(--login-logo);
    background-size: contain;
    background-position: center;
}

.login h1 a:focus {
    box-shadow: none;
    outline: 2px solid var(--gold-hi);
    outline-offset: 4px;
}

/* Formularz */
.login form {
    margin-top: 0;
    padding: 2.25rem 2rem 2rem;
    background: rgba(20, 18, 16, 0.86);
    border: 1px solid var(--line);
    border-radius: 0;
    box-shadow: none;
}

.login label {
    margin-bottom: 0.5rem;
    font-size: 0.72rem;
    font-weight: 400;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--gold);
}

.login form .input,
.login input[type="text"],
.login input[type="password"],
.login input[type="email"] {
    margin: 0 0 1.5rem;
    padding: 0.7rem 0;
    background: transparent;
    border: 0;
    border-bottom: 1px solid rgba(240, 234, 224, 0.28);
    border-radius: 0;
    box-shadow: none;
    font-family: inherit;
    font-size: 1.05rem;
    color: var(--cream);
}

.login form .input:focus,
.login input[type="text"]:focus,
.login input[type="password"]:focus,
.login input[type="email"]:focus {
    border-color: var(--gold);
    box-shadow: none;
    outline: 0;
}

/* Podpowiedzi przeglądarki nie mogą wybielać ciemnych pól. */
.login input:-webkit-autofill {
    -webkit-text-fill-color: var(--cream);
    caret-color: var(--cream);
    box-shadow: 0 0 0 100px var(--panel) inset;
}

.login .wp-pwd {
    margin-bottom: 0;
}

.login .button.wp-hide-pw {
    height: 2.75rem;
    color: var(--gold);
}

.login .button.wp-hide-pw:hover,
.login .button.wp-hide-pw:focus {
    background: transparent;
    border-color: transparent;
    box-shadow: none;
    color: var(--gold-hi);
    outline: 1px solid var(--gold-hi);
}

.login .forgetmenot {
    margin-top: 0.4rem;
}

.login .forgetmenot label {
    margin: 0;
    letter-spacing: 0.08em;
    text-transform: none;
    font-size: 0.85rem;
    color: var(--muted);
}

.login input[type="checkbox"] {
    width: 1.1rem;
    height: 1.1rem;
    background: transparent;
    border: 1px solid var(--line);
    border-radius: 0;
    box-shadow: none;
}

.login input[type="checkbox"]:checked::before {
    content: "";
    display: block;
    width: 0.6rem;
    height: 0.6rem;
    margin: 0.19rem;
    background: var(--gold);
}

.login input[type="checkbox"]:focus {
    border-color: var(--gold);
    box-shadow: none;
    outline: 2px solid var(--gold-hi);
    outline-offset: 2px;
}

/* Przyciski */
.login .button-primary,
.login .button.button-large {
    float: none;
    width: 100%;
    height: auto;
    min-height: 0;
    margin-top: 1.5rem;
    padding: 1rem 1.5rem;
    background: var(--gold);
    border: 1px solid var(--gold);
    border-radius: 0;
    box-shadow: none;
    font-family: inherit;
    font-size: 0.78rem;
    font-weight: 500;
    letter-spacing: 0.28em;
    line-height: 1.4;
    text-shadow: none;
    text-transform: uppercase;
    color: var(--ink);
    transition: background-color 0.25s ease, border-color 0.25s ease;
}

.login .button-primary:hover,
.login .button-primary:focus,
.login .button.button-large:hover,
.login .button.button-large:focus {
    background: var(--gold-hi);
    border-color: var(--gold-hi);
    box-shadow: none;
    color: var(--ink);
}

.login .button-primary:focus-visible {
    outline: 2px solid var(--gold-hi);
    outline-offset: 3px;
}

.login .admin-email__actions .button-primary,
.login .reset-pass-submit .button {
    width: auto;
}

/* Linki pod formularzem */
.login #nav,
.login #backtoblog {
    margin: 1.25rem 0 0;
    padding: 0;
    text-align: center;
    font-size: 0.85rem;
    color: var(--muted);
}

.login #nav a,
.login #backtoblog a,
.login .privacy-policy-link,
.login a {
    color: var(--muted);
    transition: color 0.25s ease;
}

.login #nav a:hover,
.login #backtoblog a:hover,
.login .privacy-policy-link:hover,
.login a:hover,
.login a:focus {
    box-shadow: none;
    color: var(--gold);
}

.login .privacy-policy-page-link {
    margin: 2rem 0 0;
}

/* Komunikaty */
.login .message,
.login .notice,
.login .success,
.login #login_error {
    margin: 0 0 1.25rem;
    padding: 1rem 1.25rem;
    background: rgba(20, 18, 16, 0.86);
    border: 0;
    border-left: 1px solid var(--gold);
    box-shadow: none;
    color: var(--cream);
}

.login #login_error {
    border-left-color: #e0714f;
}

.login .message a,
.login .notice a,
.login #login_error a {
    color: var(--gold);
}

/* Wybór języka */
.login .language-switcher {
    margin-top: 1.5rem;
    padding: 0;
}

.login .language-switcher select,
.login select {
    background-color: var(--panel);
    border: 1px solid var(--line);
    border-radius: 0;
    color: var(--cream);
}

.login .language-switcher form {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

.login .language-switcher label {
    margin: 0;
}

.login .language-switcher .button,
.login .language-switcher .button:hover,
.login .language-switcher .button:focus {
    width: auto;
    margin: 0;
    padding: 0.4rem 1rem;
    background: transparent;
    border: 1px solid var(--line);
    letter-spacing: 0.12em;
    color: var(--gold);
}

.login .language-switcher .button:hover,
.login .language-switcher .button:focus {
    border-color: var(--gold);
    color: var(--gold-hi);
}

.login .dashicons-translation {
    color: var(--gold);
}

/* Tryb interim (okno ponownego logowania w panelu) */
.interim-login.login h1 a {
    height: 5rem;
}