/**
 * Login screen styles.
 *
 * The login screen is WordPress's own, so this file adds to core's login
 * stylesheet rather than replacing it: the plugin's controls are styled to sit
 * inside the standard form, and everything else on the screen keeps the look
 * the site already has. Layout only. Every control is a real link, button or
 * input, so the screen stays usable and keyboard-navigable with the stylesheet
 * missing.
 */

/* Hide WordPress registration link from login form */
.wp-login-register {
    display: none !important;
}

/* The methods offered alongside the standard form. */

.aiplugin5010-methods-wrap {
    margin: 16px 0 0;
}

.aiplugin5010-methods {
    list-style: none;
    margin: 0;
    padding: 0;
}

.aiplugin5010-method-item {
    margin: 0 0 10px;
}

.aiplugin5010-method {
    display: block;
    box-sizing: border-box;
    width: 100%;
    min-height: 46px;
    padding: 12px 16px;
    border: 1px solid #c3c4c7;
    border-radius: 4px;
    background: #fff;
    text-decoration: none;
    color: #1d2327;
}

.aiplugin5010-method:hover,
.aiplugin5010-method:focus {
    border-color: #2271b1;
    background: #f6f7f7;
}

.aiplugin5010-method:focus-visible {
    outline: 2px solid #2271b1;
    outline-offset: 1px;
}

.aiplugin5010-method-label {
    display: block;
    font-weight: 600;
    font-size: 15px;
}

.aiplugin5010-method-description {
    display: block;
    margin-top: 2px;
    font-size: 13px;
    color: #50575e;
}

/* The email method's own control. It is a button rather than a link, because
   what it selects is the form on this same screen, so it is styled to match the
   hand-offs it stands among rather than the buttons it is made of.

   Its mark and its wording sit centred as one group, the same way a provider's
   button - "Login with Google", printed by the plugin that owns it - carries
   its own, so the two read as one row of choices and not as one control and
   one label. */

.aiplugin5010-method-button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    text-align: center;
    font: inherit;
    cursor: pointer;
}

.aiplugin5010-method-icon {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    color: #50575e;
}

/* Label and subtitle stack, so a method that has both keeps them one above the
   other rather than side by side in the row the button lays out. */

.aiplugin5010-method-text {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

/* The staged flow.

   Every step of it is server-rendered markup that the script hides and shows
   with the `hidden` attribute, so this rule has to win against whatever display
   value core gives those elements - otherwise a step that has been put away
   stays on the screen. */

#loginform [hidden] {
    display: none !important;
}

/* A login button another plugin printed outside the form - after it, or in the
   login footer - belongs to the first step like every other method, so the flow
   puts it away with them. It is outside the rule above, and its own plugin gave
   it a display value of its own, which the `hidden` attribute alone loses to. */

[data-aiplugin5010-external][hidden] {
    display: none !important;
}

/* Password and Email Link: the two ways on from a finished address. */

.aiplugin5010-choices {
    display: flex;
    gap: 8px;
    margin: 12px 0 0;
}

.aiplugin5010-choice {
    flex: 1 1 0;
    padding: 10px 12px;
    border: 1px solid #2271b1;
    border-radius: 4px;
    background: #fff;
    color: #2271b1;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
    cursor: pointer;
}

.aiplugin5010-choice--primary {
    background: #2271b1;
    color: #fff;
}

.aiplugin5010-choice:hover,
.aiplugin5010-choice:focus {
    border-color: #135e96;
}

.aiplugin5010-choice--primary:hover,
.aiplugin5010-choice--primary:focus {
    background: #135e96;
}

.aiplugin5010-choice:focus-visible {
    outline: 2px solid #2271b1;
    outline-offset: 1px;
}

/* The way back to the list of methods. */

.aiplugin5010-back-row {
    margin: 0 0 12px;
    font-size: 13px;
}

.aiplugin5010-back-button {
    padding: 0;
    border: 0;
    background: none;
    color: #2271b1;
    font-size: inherit;
    line-height: inherit;
    cursor: pointer;
}

/* Get Link: a submit button for the login form, standing where core's
   lost-password link stands. */

.login #nav .aiplugin5010-getlink {
    padding: 0;
    border: 0;
    background: none;
    font-size: inherit;
    line-height: inherit;
    cursor: pointer;
}

.aiplugin5010-hint {
    margin: 12px 0 0;
    font-size: 13px;
    color: #50575e;
}

/* The screens the plugin renders itself: set password, registration, the
   report step and the standardized notice. */

.aiplugin5010-screen {
    margin: 0;
}

.aiplugin5010-heading {
    font-size: 18px;
    font-weight: 600;
    margin: 0 0 16px;
    color: #1d2327;
}

.aiplugin5010-lead {
    margin: 0 0 16px;
    color: #50575e;
}

.aiplugin5010-back {
    margin: 16px 0 0;
    font-size: 13px;
}

.aiplugin5010-message {
    margin-bottom: 16px;
}

#aiplugin5010-register-form label,
#aiplugin5010-setpass-form label {
    display: block;
    margin-bottom: 4px;
    font-weight: 600;
}

#aiplugin5010-register-form .input,
#aiplugin5010-setpass-form .input {
    width: 100%;
    box-sizing: border-box;
}

#nav{display: none !important;}