/* ============================================================
   PRE-DASHBOARD AUTH THEME — Dark Amber
   Scoped to .fi-simple-layout so it NEVER affects dashboard.
   Uses Filament v4 class names.
   ============================================================ */

/* ---------- Background ---------- */
.fi-simple-layout {
    background: #0f172a !important;
    min-height: 100vh;
}

/* ---------- Card Container ---------- */
.fi-simple-layout .fi-simple-main-ctn {
    max-width: 400px !important;
}

.fi-simple-layout .fi-simple-main {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
    border-radius: 1rem !important;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.25) !important;
    padding: 2.5rem !important;
}

/* ---------- Form Spacing ---------- */
.fi-simple-layout .fi-fo-field-wrp + .fi-fo-field-wrp {
    margin-top: 0.25rem !important;
}

.fi-simple-layout form > .fi-btn,
.fi-simple-layout form > div > .fi-btn {
    margin-top: 1.5rem !important;
}

.fi-simple-layout .fi-form-actions {
    margin-top: 1.75rem !important;
}

/* ---------- Brand / Heading ---------- */
.fi-simple-layout .fi-simple-header {
    text-align: center !important;
    margin-bottom: 0.25rem !important;
}

.fi-simple-layout .fi-simple-header-heading {
    color: #f1f5f9 !important;
    font-size: 1.5rem !important;
    font-weight: 600 !important;
}

.fi-simple-layout .fi-simple-header-subheading {
    color: #94a3b8 !important;
    font-size: 0.8125rem !important;
    margin-top: 0.125rem !important;
}

/* ---------- Brand Logo / Name ---------- */
.fi-simple-layout .fi-logo {
    display: flex !important;
    justify-content: center !important;
    margin-bottom: 0.5rem !important;
}

.fi-simple-layout .fi-logo span,
.fi-simple-layout .fi-logo a {
    color: #f59e0b !important;
    font-size: 0.875rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
}

/* ---------- Form Labels (Filament v4) ---------- */
.fi-simple-layout .fi-fo-field-label,
.fi-simple-layout .fi-fo-field-label-content,
.fi-simple-layout .fi-fo-field-label-col,
.fi-simple-layout .fi-fo-field-label span,
.fi-simple-layout label.fi-fo-field-label,
.fi-simple-layout .fi-fo-field-wrp-label label,
.fi-simple-layout .fi-fo-field-wrp-label,
.fi-simple-layout label,
.fi-simple-layout [class*="label"] {
    color: #e2e8f0 !important;
}

.fi-simple-layout .fi-fo-field-label {
    font-size: 0.8125rem !important;
    font-weight: 500 !important;
}

/* Required asterisk */
.fi-simple-layout .fi-fo-field-label-required-mark {
    color: #f87171 !important;
}

/* ---------- Checkbox / Remember Me ---------- */
.fi-simple-layout .fi-fo-field-wrp span,
.fi-simple-layout .fi-checkbox label span,
.fi-simple-layout .fi-fo-field-label-content {
    color: #e2e8f0 !important;
}

/* ---------- Input Fields ---------- */
.fi-simple-layout .fi-input-wrp {
    background: #0f172a !important;
    border: 1px solid #334155 !important;
    border-radius: 0.5rem !important;
    transition: border-color 0.2s ease !important;
}

.fi-simple-layout .fi-input-wrp:focus-within {
    border-color: #f59e0b !important;
    box-shadow: 0 0 0 2px rgba(245, 158, 11, 0.15) !important;
}

.fi-simple-layout .fi-input,
.fi-simple-layout input {
    color: #f1f5f9 !important;
    background: transparent !important;
    font-size: 0.875rem !important;
}

.fi-simple-layout .fi-input::placeholder,
.fi-simple-layout input::placeholder {
    color: #475569 !important;
}

/* ---------- Primary Button ---------- */
.fi-simple-layout .fi-btn-primary {
    background: #f59e0b !important;
    color: #0f172a !important;
    font-weight: 600 !important;
    font-size: 0.875rem !important;
    border-radius: 0.5rem !important;
    border: none !important;
    padding: 0.625rem 1.25rem !important;
    transition: background 0.2s ease !important;
}

.fi-simple-layout .fi-btn-primary:hover {
    background: #d97706 !important;
}

/* ---------- Links ---------- */
.fi-simple-layout .fi-link {
    color: #f59e0b !important;
    font-size: 0.8125rem !important;
}

.fi-simple-layout .fi-link:hover {
    color: #fbbf24 !important;
}

/* ---------- Checkbox ---------- */
.fi-simple-layout .fi-checkbox-input {
    border-color: #475569 !important;
    background: #0f172a !important;
}

.fi-simple-layout .fi-checkbox-input:checked {
    background-color: #f59e0b !important;
    border-color: #f59e0b !important;
}

/* ---------- Helper / Description Text ---------- */
.fi-simple-layout .fi-fo-field-wrp .text-sm,
.fi-simple-layout .fi-fo-field-helper-text {
    color: #94a3b8 !important;
}

/* ---------- Error Messages ---------- */
.fi-simple-layout .fi-fo-field-error-message,
.fi-simple-layout .fi-fo-field-wrp-error-message {
    color: #f87171 !important;
}

/* ---------- Gray Button ---------- */
.fi-simple-layout .fi-btn-gray,
.fi-simple-layout .fi-btn[color="gray"] {
    background: #1e293b !important;
    color: #94a3b8 !important;
    border: 1px solid #334155 !important;
    border-radius: 0.5rem !important;
}

.fi-simple-layout .fi-btn-gray:hover,
.fi-simple-layout .fi-btn[color="gray"]:hover {
    background: #334155 !important;
    color: #f1f5f9 !important;
}

/* ---------- Sections ---------- */
.fi-simple-layout .fi-section {
    background: #0f172a !important;
    border: 1px solid #334155 !important;
    border-radius: 0.75rem !important;
}

.fi-simple-layout .fi-section-header-heading {
    color: #f1f5f9 !important;
}

.fi-simple-layout .fi-section-header-description {
    color: #94a3b8 !important;
}

/* ---------- Badges ---------- */
.fi-simple-layout .fi-badge-success {
    background: rgba(34, 197, 94, 0.12) !important;
    color: #4ade80 !important;
}

.fi-simple-layout .fi-badge-warning {
    background: rgba(245, 158, 11, 0.12) !important;
    color: #fbbf24 !important;
}

/* ---------- All Text Inside Auth Card ---------- */
.fi-simple-layout .fi-simple-main,
.fi-simple-layout .fi-simple-main *,
.fi-simple-layout .fi-simple-page * {
    color: #e2e8f0;
}

/* ---------- Button Overrides (MUST come after wildcard) ---------- */
/* Filament v4 uses: fi-btn.fi-color-primary, fi-bg-color-*, fi-text-color-* */
.fi-simple-layout .fi-btn.fi-color-primary,
.fi-simple-layout .fi-btn.fi-color-primary *,
.fi-simple-layout .fi-btn.fi-color-primary .fi-btn-label,
.fi-simple-layout .fi-btn.fi-color-primary span,
.fi-simple-layout .fi-btn-primary,
.fi-simple-layout .fi-btn-primary *,
.fi-simple-layout button[type="submit"].fi-btn,
.fi-simple-layout button[type="submit"].fi-btn * {
    color: #0f172a !important;
    background-color: #f59e0b !important;
}

.fi-simple-layout .fi-btn.fi-color-primary:hover,
.fi-simple-layout .fi-btn-primary:hover,
.fi-simple-layout button[type="submit"].fi-btn:hover {
    background-color: #d97706 !important;
}

/* Button label/icon should not have background */
.fi-simple-layout .fi-btn.fi-color-primary span,
.fi-simple-layout .fi-btn.fi-color-primary .fi-btn-label,
.fi-simple-layout .fi-btn-primary span,
.fi-simple-layout button[type="submit"].fi-btn span {
    background-color: transparent !important;
    color: #0f172a !important;
}

/* Button loading spinner */
.fi-simple-layout .fi-btn.fi-color-primary svg,
.fi-simple-layout button[type="submit"].fi-btn svg {
    color: #0f172a !important;
    background-color: transparent !important;
}

/* ---------- Subheading / Helper Text ---------- */
.fi-simple-layout .fi-simple-header-subheading,
.fi-simple-layout .fi-fo-field-helper-text {
    color: #94a3b8 !important;
}

/* ---------- Required Mark ---------- */
.fi-simple-layout .fi-fo-field-label-required-mark {
    color: #f87171 !important;
}

/* ---------- Links ---------- */
.fi-simple-layout .fi-link,
.fi-simple-layout .fi-link *,
.fi-simple-layout a[class*="fi-link"] {
    color: #f59e0b !important;
}

/* ---------- Footer ---------- */
.fi-simple-layout .fi-simple-footer,
.fi-simple-layout .fi-simple-footer * {
    color: #475569 !important;
    font-size: 0.75rem !important;
}

/* ---------- Toggle Password Icon ---------- */
.fi-simple-layout .fi-input-wrp button,
.fi-simple-layout .fi-input-wrp button svg,
.fi-simple-layout .fi-icon-btn svg {
    color: #94a3b8 !important;
    background: transparent !important;
}