/*
 * Live password requirement checklist.
 *
 * Ships with resources/views/partials/password-rules.blade.php and
 * assets/js/password-rules.js, so the three travel together. These rules used
 * to live only in vendor-dashboard.css, which the public site never loads - so
 * inside the signup modal the checklist had no styling at all and simply
 * inherited the modal's `text-center`, arriving as centred grey text.
 */

.password-rules-box {
    margin-top: 10px;
    padding: 12px 14px;
    border: 1px solid #e5e9f2;
    border-radius: 12px;
    background: #fafbfc;
    /* A checklist reads down its left edge. Several of the places this appears
     * centre their contents (the signup modal, some cards), and it must not
     * follow them. */
    text-align: left;
}

[dir="rtl"] .password-rules-box {
    text-align: right;
}

.password-rules-title {
    margin: 0 0 8px;
    font-size: 14px;
    font-weight: 600;
    color: #1f2937;
}

.password-rules-list {
    margin: 0;
    padding-left: 0;
    list-style: none;
    display: grid;
    gap: 6px;
    font-size: 13px;
}

.password-rules-list li {
    transition: color 0.15s ease;
    font-size: 13px;
    line-height: 1.4;
    color: #d9534f;
}

.password-rules-list li.is-valid {
    color: #23a455;
}

.password-rules-list li.is-invalid {
    color: #d33b3b;
}