/* =========================================
   YOUREPORTS.COM - AUTH PAGES
   Dark theme for authentication flows
   ========================================= */

/* CSS Variables - Dark Theme (matching fulfillment) */
:root {
    --auth-bg-dark: #1a1a2e;
    --auth-bg-card: #16213e;
    --auth-text-main: #eee;
    --auth-text-muted: #ccc;
    --auth-border: #2a3a5e;
    --auth-accent-yellow: #feca57;
    --auth-accent-purple: #667eea;
    --auth-accent-purple-dark: #764ba2;
}

/* Body Background */
body {
    background-color: var(--auth-bg-dark);
    color: var(--auth-text-main);
    min-height: 100vh;
}

/* Auth Container - Centered Layout */
.auth-container {
    min-height: calc(100vh - 56px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
}

/* Bootstrap Card - Dark Theme */
.card {
    background-color: var(--auth-bg-card);
    border: 1px solid var(--auth-border);
    color: var(--auth-text-main);
}

.card-title,
.card-header {
    color: #fff;
}

/* Form Controls - Dark Theme */
.form-label {
    color: var(--auth-text-muted);
    font-weight: 500;
}

.form-control,
.form-select {
    background-color: var(--auth-bg-dark);
    border: 2px solid var(--auth-border);
    color: #fff;
}

.form-control:focus,
.form-select:focus {
    background-color: var(--auth-bg-dark);
    border-color: var(--auth-accent-yellow);
    color: #fff;
    box-shadow: 0 0 0 0.2rem rgba(254, 202, 87, 0.25);
}

.form-control::placeholder {
    color: #666;
}

.form-text {
    color: #888;
}

/* Buttons - Dark Theme */
.btn-primary {
    background: linear-gradient(135deg, var(--auth-accent-purple), var(--auth-accent-purple-dark));
    border: none;
    color: white;
    font-weight: 600;
}

.btn-primary:hover {
    background: linear-gradient(135deg, var(--auth-accent-purple-dark), var(--auth-accent-purple));
    color: white;
}

.btn-primary:disabled {
    opacity: 0.6;
}

/* Links - Dark Theme */
a {
    color: var(--auth-accent-yellow);
}

a:hover {
    color: #ffdb4d;
}

.text-muted {
    color: var(--auth-text-muted) !important;
}

/* Bootstrap Alerts - Dark Theme */
.alert {
    border: none;
}

.alert-success {
    background-color: #0d4f3c;
    color: #a3e4c1;
}

.alert-danger,
.alert-error {
    background-color: #5c1e1e;
    color: #f8b4b4;
}

.alert-warning {
    background-color: #5c4a1e;
    color: #f8e4b4;
}

.alert-info {
    background-color: rgba(102, 126, 234, 0.2);
    color: #a3c4e4;
}

/* Icons */
.page-icon {
    font-size: 3rem;
    color: var(--auth-accent-yellow);
    margin-bottom: 1rem;
}

/* Crispy Forms Compatibility */
.asteriskField {
    display: none;
}

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

/* List Group - Dark Theme */
.list-group-item {
    background-color: var(--auth-bg-dark);
    border-color: var(--auth-border);
    color: var(--auth-text-main);
}

.form-check-input {
    background-color: var(--auth-bg-dark);
    border-color: var(--auth-border);
}

.form-check-input:checked {
    background-color: var(--auth-accent-purple);
    border-color: var(--auth-accent-purple);
}
