/* ===== Loading exclusivo do REGISTER ===== */
    .reg-loading-overlay {
        position: fixed;
        inset: 0;
        display: none;
        /* fica invisível até o submit */
        align-items: center;
        justify-content: center;
        z-index: 9999;
        background: rgba(0, 0, 0, .55);
        backdrop-filter: blur(2px);
    }

    body.reg-is-loading .reg-loading-overlay {
        display: flex;
    }

    .reg-loading-card {
        background: #111827;
        /* cinza-900 */
        color: #fff;
        border-radius: 14px;
        padding: 18px 22px;
        min-width: 260px;
        text-align: center;
        box-shadow: 0 10px 32px rgba(0, 0, 0, .35);
        border: 1px solid rgba(255, 255, 255, .08);
    }

    .reg-loading-spinner {
        width: 42px;
        height: 42px;
        border: 4px solid #ffffff33;
        border-top-color: #dba736;
        /* seu dourado */
        border-radius: 50%;
        margin: 8px auto 14px auto;
        animation: regspin .9s linear infinite;
    }

    @keyframes regspin {
        to {
            transform: rotate(360deg);
        }
    }

    /* Estado visual do botão enquanto envia (só nesta página) */
    .form-wrapper button[aria-busy="true"],
    .form-wrapper input[type="submit"][aria-busy="true"] {
        opacity: .7 !important;
        cursor: not-allowed !important;
        filter: grayscale(.2);
    }


    /* =========================================================
   REGISTER — DARK MODE (colar no final do base.css)
   Escopo: página de cadastro (register.html)
   Mantém consistência com os tokens já existentes do Q7Lab.
   ========================================================= */

    /* ---------- Container do formulário ---------- */
    [data-theme="dark"] .form-wrapper {
        background: var(--card);
        color: var(--text);
        border: 1px solid var(--card-border);
        box-shadow: var(--elev);
        border-radius: 14px;
        padding: 20px 22px;
        max-width: 720px;
        margin: 18px auto;
    }

    /* Título */
    [data-theme="dark"] .form-wrapper h2 {
        color: #ffffff;
        font-weight: 800;
        letter-spacing: .2px;
        margin: 4px 0 12px;
    }

    /* Mensagem informativa (o <p> amarelo do register.html) 
   — usa !important para sobrepor o style inline */
    [data-theme="dark"] .form-wrapper>p:first-of-type {
        background: #0f1623 !important;
        /* perto do --rk-card */
        color: var(--muted) !important;
        border: 1px solid var(--card-border) !important;
        border-radius: 10px !important;
    }

    /* ---------- Campos ---------- */
    [data-theme="dark"] .form-wrapper label {
        color: var(--muted);
        font-weight: 600;
    }

    [data-theme="dark"] .form-wrapper input[type="text"],
    [data-theme="dark"] .form-wrapper input[type="email"],
    [data-theme="dark"] .form-wrapper input[type="password"],
    [data-theme="dark"] .form-wrapper input[type="tel"],
    [data-theme="dark"] .form-wrapper input[type="url"],
    [data-theme="dark"] .form-wrapper select,
    [data-theme="dark"] .form-wrapper textarea {
        background: var(--input-bg);
        color: var(--text);
        border: 1px solid var(--input-border);
        border-radius: 10px;
        padding: 10px 12px;
        width: 100%;
        outline: none;
        box-shadow: none;
        transition: box-shadow .15s ease, border-color .15s ease, filter .12s ease;
    }

    [data-theme="dark"] .form-wrapper input::placeholder,
    [data-theme="dark"] .form-wrapper textarea::placeholder {
        color: var(--muted);
    }

    [data-theme="dark"] .form-wrapper input:focus,
    [data-theme="dark"] .form-wrapper select:focus,
    [data-theme="dark"] .form-wrapper textarea:focus {
        border-color: #38bdf8;
        box-shadow: 0 0 0 3px rgba(56, 189, 248, .35);
        filter: brightness(1.03);
    }

    /* Ajuda/erros (allauth) */
    [data-theme="dark"] .form-wrapper .helptext {
        color: var(--muted);
        font-size: .92rem;
    }

    [data-theme="dark"] .form-wrapper ul.errorlist {
        list-style: none;
        margin: 6px 0 0;
        padding: 0;
    }

    [data-theme="dark"] .form-wrapper ul.errorlist li {
        background: rgba(239, 68, 68, .12);
        color: #f87171;
        border: 1px solid rgba(239, 68, 68, .25);
        border-radius: 8px;
        padding: 8px 10px;
        font-weight: 600;
    }

    /* Checkbox / radio */
    [data-theme="dark"] .form-wrapper input[type="checkbox"],
    [data-theme="dark"] .form-wrapper input[type="radio"] {
        accent-color: var(--ql-blue, #0d6efd);
    }

    /* Links auxiliares (login, termos, etc.) */
    [data-theme="dark"] .form-wrapper a {
        color: var(--link);
        text-underline-offset: 2px;
    }

    [data-theme="dark"] .form-wrapper a:hover {
        color: var(--link-hover);
    }

    /* ---------- Botões ---------- */
    [data-theme="dark"] .form-wrapper button,
    [data-theme="dark"] .form-wrapper input[type="submit"] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: .5ch;
        background: var(--ql-blue, #0d6efd);
        color: #fff;
        border: 1px solid rgba(255, 255, 255, .12);
        border-radius: 10px;
        padding: 10px 14px;
        font-weight: 800;
        letter-spacing: .2px;
        cursor: pointer;
        box-shadow: 0 6px 18px rgba(13, 110, 253, .22);
        transition: transform .06s ease, filter .12s ease, box-shadow .12s ease;
    }

    [data-theme="dark"] .form-wrapper button:hover,
    [data-theme="dark"] .form-wrapper input[type="submit"]:hover {
        filter: brightness(1.05);
        transform: translateY(-1px);
    }

    [data-theme="dark"] .form-wrapper button:active,
    [data-theme="dark"] .form-wrapper input[type="submit"]:active {
        transform: translateY(0);
        box-shadow: 0 3px 12px rgba(13, 110, 253, .18);
    }

    /* Estado ocupado (sincroniza com JS que põe aria-busy="true") */
    [data-theme="dark"] .form-wrapper [aria-busy="true"] {
        opacity: .72;
        cursor: not-allowed;
        filter: grayscale(.2);
    }

    /* Botões secundários/ghost (se existirem) */
    [data-theme="dark"] .form-wrapper .btn-ghost {
        background: transparent;
        color: var(--text);
        border: 1px dashed var(--card-border);
    }

    [data-theme="dark"] .form-wrapper .btn-ghost:hover {
        background: rgba(255, 255, 255, .05);
    }

    /* ---------- Layout de grupos ---------- */
    [data-theme="dark"] .form-wrapper .form-group,
    [data-theme="dark"] .form-wrapper .field,
    [data-theme="dark"] .form-wrapper .control-group {
        margin-bottom: 12px;
    }

    /* ---------- Overlay de loading exclusivo do REGISTER ---------- */
    /* (movido do <style> inline do register.html para centralizar no base.css) */
    [data-theme="dark"] .reg-loading-overlay {
        position: fixed;
        inset: 0;
        display: none;
        align-items: center;
        justify-content: center;
        z-index: 9999;
        background: rgba(0, 0, 0, .55);
        backdrop-filter: blur(2px);
    }

    body.reg-is-loading .reg-loading-overlay {
        display: flex;
    }

    [data-theme="dark"] .reg-loading-card {
        background: #111827;
        color: #fff;
        border-radius: 14px;
        padding: 18px 22px;
        min-width: 260px;
        text-align: center;
        box-shadow: 0 10px 32px rgba(0, 0, 0, .35);
        border: 1px solid rgba(255, 255, 255, .08);
    }

    [data-theme="dark"] .reg-loading-spinner {
        width: 42px;
        height: 42px;
        border: 4px solid #ffffff33;
        border-top-color: #dba736;
        /* dourado da marca */
        border-radius: 50%;
        margin: 8px auto 14px auto;
        animation: regspin .9s linear infinite;
    }

    @keyframes regspin {
        to {
            transform: rotate(360deg);
        }
    }

    /* ---------- Acessibilidade ---------- */
    [data-theme="dark"] .form-wrapper :is(button, .btn, a.button, input, select, textarea):focus-visible {
        box-shadow: 0 0 0 3px rgba(56, 189, 248, .45);
        border-color: #38bdf8;
    }

    /* Pequenos espaçamentos finais */
    @media (max-width: 560px) {
        [data-theme="dark"] .form-wrapper {
            padding: 16px;
            border-radius: 12px;
        }
    }