/* ============================================================================
   SMG MUDBLAZOR OVERRIDES
   This file ensures SMG design system takes precedence over MudBlazor defaults
   Load this AFTER smg.global.css
   ============================================================================ */

/* ============================================================================
   GLOBAL BACKGROUND & TEXT COLOR OVERRIDES
   ============================================================================ */

/* Force SMG dark background everywhere */
body,
html,
#app,
.mud-drawer-container,
.mud-drawer,
.mud-drawer-content,
.mud-drawer-responsive,
.mud-appbar,
.mud-main-content,
.mud-container,
.mud-paper,
.mud-dialog,
.mud-popover {
    background-color: var(--smg-bg-primary) !important;
    color: var(--smg-white) !important;
}

/* Override MudBlazor's default text colors */
.mud-typography,
.mud-typography-body1,
.mud-typography-body2,
.mud-input,
.mud-input-slot,
.mud-select,
.mud-button-root {
    color: var(--smg-white) !important;
}

/* ============================================================================
   MUDBLAZOR COMPONENT OVERRIDES
   ============================================================================ */

/* MudDrawer */
.mud-drawer {
    background: var(--smg-bg-secondary) !important;
    border-right: 1px solid var(--smg-border-secondary) !important;
}

.mud-drawer-open-responsive-lg-left {
    width: 280px !important;
}

.mud-drawer .mud-drawer-content {
    background: var(--smg-bg-secondary) !important;
}

/* MudAppBar */
.mud-appbar,
.mud-appbar-dense {
    background: var(--smg-bg-secondary) !important;
    color: var(--smg-white) !important;
    box-shadow: none !important;
}

/* MudButton */
.mud-button-root {
    font-family: var(--smg-font-family) !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
    font-weight: 600 !important;
}

.mud-button-filled-primary {
    background: linear-gradient(135deg, var(--smg-green-primary) 0%, var(--smg-green-dark) 100%) !important;
    color: var(--smg-white) !important;
}

/* MudIconButton */
.mud-icon-button {
    color: var(--smg-green-primary) !important;
}

.mud-icon-button:hover {
    background-color: rgba(22, 163, 74, 0.1) !important;
}

/* MudBadge */
.mud-badge-dot,
.mud-badge-default {
    background-color: var(--smg-green-primary) !important;
}

.mud-badge-error {
    background-color: var(--smg-error) !important;
}

/* MudInput */
.mud-input-root {
    background: rgba(10, 10, 10, 0.6) !important;
    border: 1px solid var(--smg-border-secondary) !important;
}

.mud-input-slot {
    color: var(--smg-white) !important;
}

.mud-input-root:hover {
    border-color: var(--smg-border-primary) !important;
}

.mud-input-root.mud-focused {
    border-color: var(--smg-border-hover) !important;
}

/* MudSelect */
.mud-select {
    background: rgba(10, 10, 10, 0.6) !important;
}

.mud-select .mud-input-slot {
    color: var(--smg-white) !important;
}

/* MudTable */
.mud-table {
    background: var(--smg-bg-secondary) !important;
}

.mud-table-head {
    background: rgba(22, 163, 74, 0.05) !important;
}

.mud-table-head .mud-table-cell {
    color: var(--smg-green-primary) !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
}

.mud-table-cell {
    color: var(--smg-white) !important;
    border-bottom: 1px solid var(--smg-border-tertiary) !important;
}

.mud-table-row:hover {
    background: rgba(22, 163, 74, 0.05) !important;
}

/* MudDialog */
.mud-dialog {
    background: var(--smg-bg-secondary) !important;
}

.mud-dialog-title {
    color: var(--smg-white) !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
}

/* MudCard */
.mud-card {
    background: var(--smg-bg-secondary) !important;
    border: 1px solid var(--smg-border-secondary) !important;
}

.mud-card-header,
.mud-card-content {
    color: var(--smg-white) !important;
}

/* MudChip */
.mud-chip {
    background: rgba(22, 163, 74, 0.15) !important;
    color: var(--smg-green-primary) !important;
    font-weight: 700 !important;
}

/* MudPaper */
.mud-paper {
    background: var(--smg-bg-secondary) !important;
    color: var(--smg-white) !important;
}

/* MudList */
.mud-list {
    background: var(--smg-bg-secondary) !important;
}

.mud-list-item {
    color: var(--smg-white) !important;
}

.mud-list-item:hover {
    background: rgba(22, 163, 74, 0.1) !important;
}

/* MudMenu */
.mud-menu,
.mud-popover-root {
    background: var(--smg-bg-secondary) !important;
    border: 1px solid var(--smg-border-primary) !important;
}

.mud-menu .mud-list-item {
    color: var(--smg-white) !important;
}

/* MudTabs */
.mud-tabs {
    background: transparent !important;
}

.mud-tab {
    color: var(--smg-gray-300) !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
}

.mud-tab.mud-tab-active {
    color: var(--smg-green-primary) !important;
}

.mud-tabs-toolbar {
    background: transparent !important;
    border-bottom: 1px solid var(--smg-border-secondary) !important;
}

/* MudNavMenu */
.mud-navmenu {
    background: transparent !important;
}

.mud-nav-link {
    color: var(--smg-white) !important;
}

.mud-nav-link:hover {
    background: rgba(22, 163, 74, 0.1) !important;
}

.mud-nav-link-active {
    color: var(--smg-green-primary) !important;
    background: rgba(22, 163, 74, 0.15) !important;
}

/* ============================================================================
   FORM ELEMENTS
   ============================================================================ */

.mud-input-label {
    color: var(--smg-gray-300) !important;
    font-weight: 600 !important;
    letter-spacing: 0.05em !important;
}

.mud-input-helper-text {
    color: var(--smg-gray-400) !important;
}

/* Checkbox */
.mud-checkbox .mud-checkbox-label {
    color: var(--smg-white) !important;
}

.mud-checkbox .mud-icon-root {
    color: var(--smg-green-primary) !important;
}

/* Radio */
.mud-radio .mud-radio-label {
    color: var(--smg-white) !important;
}

.mud-radio .mud-icon-root {
    color: var(--smg-green-primary) !important;
}

/* Switch */
.mud-switch .mud-switch-label {
    color: var(--smg-white) !important;
}

.mud-switch .mud-switch-thumb {
    background-color: var(--smg-green-primary) !important;
}

/* ============================================================================
   UTILITY OVERRIDES
   ============================================================================ */

/* Scrollbar for MudBlazor components */
.mud-drawer-content::-webkit-scrollbar,
.mud-dialog-content::-webkit-scrollbar,
.mud-list::-webkit-scrollbar {
    width: 4px;
}

.mud-drawer-content::-webkit-scrollbar-thumb,
.mud-dialog-content::-webkit-scrollbar-thumb,
.mud-list::-webkit-scrollbar-thumb {
    background: rgba(22, 163, 74, 0.3);
    border-radius: 2px;
}

/* Ripple effect color */
.mud-ripple {
    background-color: rgba(22, 163, 74, 0.3) !important;
}

/* Focus visible */
.mud-button-root:focus-visible,
.mud-icon-button:focus-visible,
.mud-input-root:focus-visible {
    outline: 2px solid var(--smg-green-primary) !important;
    outline-offset: 2px !important;
}

/* Disabled state */
.mud-button-root.mud-disabled,
.mud-input-root.mud-disabled {
    opacity: 0.5 !important;
    cursor: not-allowed !important;
}

/* ============================================================================
   RESPONSIVE OVERRIDES
   ============================================================================ */

@media (max-width: 1279px) {
    .mud-drawer-open-responsive-lg-left {
        width: 260px !important;
    }
}

@media (max-width: 767px) {
    .mud-drawer-open-responsive-lg-left {
        width: 240px !important;
    }
}