/* ============================================================
   Campbell's Code — Auth shared utilities
   Loaded only on Login / Register via @section Styles.
   ============================================================ */

/* ── Auth form inputs: override site.css global max-width:280px ── */
/* site.css line 1020: input,select,textarea { max-width: 280px }   */
/* This rule is the root cause of inputs appearing shorter than the */
/* card on Login and Register. Scoped to .login-card/.signup-card   */
/* so it does not affect any other page.                            */
.login-card .form-control,
.login-card .input-group,
.signup-card .form-control,
.signup-card .input-group {
    max-width: none !important;
    width: 100% !important;
}

/* ── Validation: remove double-border on input-groups ──────── */
/* Root cause: .login-card/.signup-card .input-error sets         */
/* box-shadow !important on ALL .input-error elements, including  */
/* .input-group wrappers. The inner .form-control + eye-toggle    */
/* already form a complete red border around the group — the      */
/* outer box-shadow on the wrapper is the second unwanted ring.   */
.login-card .input-group.input-error,
.login-card .input-group:has(.input-error),
.signup-card .input-group.input-error,
.signup-card .input-group:has(.input-error) {
    border: none !important;
    box-shadow: none !important;
}

/* ── Spin animation (submit loading state) ─────────────────── */
.cc-spin { animation: ccSpin 1s linear infinite; display: inline-block; }

@keyframes ccSpin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}