/* ============================================
   Bell.IA Custom Theme for Authelia
   Colors: Background #02080e, Text #f4f5f5, Accent #c9fa88
   ============================================ */

/* === Global Background === */
body,
.MuiPaper-root,
.MuiCard-root,
.MuiContainer-root,
.MuiBox-root {
    background-color: #02080e !important;
}

/* === Typography === */
.MuiTypography-root,
.MuiInputLabel-root,
.MuiFormLabel-root,
.MuiListItemText-primary,
.MuiListItemText-secondary,
.MuiChip-label,
.MuiFormControlLabel-label,
.MuiFormHelperText-root,
.MuiTablePagination-root,
p, span, div {
    color: #f4f5f5 !important;
}

/* === Accent Color (Primary) === */
.MuiButton-containedPrimary {
    background-color: #c9fa88 !important;
    color: #02080e !important;
    font-weight: 600 !important;
    text-transform: none !important;
    border-radius: 8px !important;
    box-shadow: 0 0 20px rgba(201, 250, 136, 0.15) !important;
}

.MuiButton-containedPrimary:hover {
    background-color: #b5e67a !important;
    box-shadow: 0 0 30px rgba(201, 250, 136, 0.25) !important;
}

.MuiButton-outlinedPrimary {
    border-color: #c9fa88 !important;
    color: #c9fa88 !important;
    border-radius: 8px !important;
}

.MuiButton-outlinedPrimary:hover {
    background-color: rgba(201, 250, 136, 0.08) !important;
    border-color: #c9fa88 !important;
}

.MuiButton-textPrimary {
    color: #c9fa88 !important;
}

/* === Links === */
a, .MuiLink-root {
    color: #c9fa88 !important;
    text-decoration: none !important;
}

a:hover, .MuiLink-root:hover {
    color: #b5e67a !important;
}

/* === Input Fields === */
.MuiInputBase-root,
.MuiOutlinedInput-root {
    color: #f4f5f5 !important;
    background-color: rgba(255, 255, 255, 0.04) !important;
    border-radius: 8px !important;
}

.MuiOutlinedInput-notchedOutline {
    border-color: #2a2f3a !important;
    border-radius: 8px !important;
}

.MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline {
    border-color: #c9fa88 !important;
}

.MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline {
    border-color: #c9fa88 !important;
    border-width: 2px !important;
}

.MuiInputLabel-root.Mui-focused {
    color: #c9fa88 !important;
}

.MuiInputAdornment-root .MuiIconButton-root {
    color: #c9fa88 !important;
}

/* === Cards & Containers === */
.MuiPaper-root.MuiCard-root,
.MuiPaper-elevation1,
.MuiPaper-elevation2,
.MuiPaper-elevation3 {
    background-color: #0a0f18 !important;
    border: 1px solid #1a2030 !important;
    border-radius: 16px !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3) !important;
}

/* === Tabs === */
.MuiTab-root {
    color: #8a8f9a !important;
    text-transform: none !important;
    font-weight: 500 !important;
}

.MuiTab-root.Mui-selected {
    color: #c9fa88 !important;
    font-weight: 600 !important;
}

.MuiTabs-indicator {
    background-color: #c9fa88 !important;
    height: 3px !important;
    border-radius: 3px !important;
}

/* === Progress & Loading === */
.MuiCircularProgress-root {
    color: #c9fa88 !important;
}

.MuiLinearProgress-bar {
    background-color: #c9fa88 !important;
}

/* === Alert Boxes === */
.MuiAlert-standardSuccess {
    background-color: #0d1f08 !important;
    color: #c9fa88 !important;
    border: 1px solid rgba(201, 250, 136, 0.2) !important;
    border-radius: 12px !important;
}

.MuiAlert-standardError {
    background-color: #1f0808 !important;
    color: #ff6b6b !important;
    border: 1px solid rgba(255, 107, 107, 0.2) !important;
    border-radius: 12px !important;
}

.MuiAlert-standardWarning {
    background-color: #1f1a08 !important;
    color: #ffc107 !important;
    border: 1px solid rgba(255, 193, 7, 0.2) !important;
    border-radius: 12px !important;
}

.MuiAlert-standardInfo {
    background-color: #080f1f !important;
    color: #64b5f6 !important;
    border: 1px solid rgba(100, 181, 246, 0.2) !important;
    border-radius: 12px !important;
}

/* === Checkbox & Radio === */
.MuiCheckbox-colorPrimary.Mui-checked,
.MuiRadio-colorPrimary.Mui-checked {
    color: #c9fa88 !important;
}

/* === Switch === */
.MuiSwitch-colorPrimary.Mui-checked {
    color: #c9fa88 !important;
}

.MuiSwitch-colorPrimary.Mui-checked + .MuiSwitch-track {
    background-color: #c9fa88 !important;
}

/* === Tooltip === */
.MuiTooltip-tooltip {
    background-color: #1a2030 !important;
    color: #f4f5f5 !important;
    border: 1px solid #2a2f3a !important;
    border-radius: 8px !important;
}

/* === Dialog / Modal === */
.MuiDialog-paper {
    background-color: #0a0f18 !important;
    border: 1px solid #1a2030 !important;
    border-radius: 16px !important;
}

/* === Divider === */
.MuiDivider-root {
    border-color: #1a2030 !important;
}

/* === List === */
.MuiListItem-root:hover {
    background-color: rgba(201, 250, 136, 0.04) !important;
}

/* === Badge === */
.MuiBadge-badge {
    background-color: #c9fa88 !important;
    color: #02080e !important;
}

/* === TOTP QR Code container === */
[class*="QRCode"], [class*="qr-code"], canvas {
    border-radius: 12px !important;
}

/* === Footer === */
[class*="powered"], [class*="footer"] {
    color: #3a3f4a !important;
    font-size: 0.75rem !important;
}

/* === Login Page Specific === */
.MuiContainer-maxWidthMd {
    max-width: 480px !important;
}

/* Glow effect on focus */
.MuiOutlinedInput-root.Mui-focused {
    box-shadow: 0 0 12px rgba(201, 250, 136, 0.15) !important;
}

/* Custom scrollbar */
::-webkit-scrollbar {
    width: 6px;
}

::-webkit-scrollbar-track {
    background: #02080e;
}

::-webkit-scrollbar-thumb {
    background: #2a2f3a;
    border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
    background: #c9fa88;
}

/* Selection */
::selection {
    background-color: rgba(201, 250, 136, 0.3);
    color: #f4f5f5;
}

/* Neon glow on buttons */
.MuiButton-containedPrimary:focus-visible {
    outline: 2px solid #c9fa88 !important;
    outline-offset: 2px !important;
}