/* =====================================================================
   CREONIO — AUTH PAGES
   =====================================================================
   Login, register, forgot/reset password, status pages (check-email, verify result).
   Requires css/base.css to be loaded first (design tokens, resets,
   and shared micro-components live there).
   ===================================================================== */

/* -------------------- CREONIO LOGIN &REGISTER --------------------*/
/* -----------------------------------------------------------------*/

.authform-container {
    max-width: 380px;
    width: 100%;
    margin: 5rem auto;
    background: var(--cardblue);
    padding: 2.25rem 2rem;
    border-radius: var(--radius-lg);
    border: 1px solid var(--border-soft);
    box-shadow: var(--shadow-pop);
}

.authform-container h3 {
    margin-bottom: 1rem;
    text-transform: uppercase;
    background: var(--gradient-brand);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    display: inline-block;
}

.authform-container p {
    margin-top: 1rem;
    color: var(--text-dim);
}

/* STATUS PAGES (check-email, verify result) - centered, icon-led variant
   of the auth card, used for one-off "here's what happened" screens */

.status-page {
    text-align: center;
}

.status-icon {
    font-size: 2.75rem;
    line-height: 1;
    margin-bottom: 1rem;
}

.status-page h3 {
    display: block;
}

.status-lede {
    color: var(--text) !important;
    font-size: 1.05rem;
    line-height: 1.6;
}

.status-lede strong {
    color: var(--btnblue);
}

.authform-group {
    margin-bottom: 1rem;
}


/* Buttons inside the auth forms are full-width; this used to be a bare
   `button { width:100%; margin-top:0.5rem }` rule which leaked into every
   button on the site (table delete buttons, top-bar mini buttons, etc. were
   all being silently stretched to 100% width). Scoping it fixes that. */
.authform-container button,
.authform-group button {
    width: 100%;
    margin-top: 0.5rem;
}

#loginMessage,
#registerMessage {
    margin-top: 1rem;
    color: var(--alarmred);
    font-size: 0.9rem;
}

/* ----------------------------------------------------------*/
/* -------------------- CREATORS' PAGES -------------------- */
/* ----------------------------------------------------------*/

/* -------------------- DASHBOARD -------------------- */