/**
 * Corporate CSS - OutsidersSolutions Branding
 * Provides styling overrides to match corporate website aesthetics
 * Features: 8px border-radius, smooth transitions, consistent spacing
 *
 * IMPORTANT: These styles should NOT affect the /ssp/viewer route
 */

/* Apply Inter font family to body and common MudBlazor components (not universal selector) */
body:not(.viewer-route) {
    font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    /* Container max-width matching website (max-w-7xl) */
    --max-container-width: 1280px;
}

/* Apply Inter font to MudBlazor typography components */
body:not(.viewer-route) .mud-typography,
body:not(.viewer-route) .mud-button,
body:not(.viewer-route) .mud-input,
body:not(.viewer-route) .mud-select,
body:not(.viewer-route) .mud-menu-item,
body:not(.viewer-route) .mud-list-item,
body:not(.viewer-route) .mud-nav-link,
body:not(.viewer-route) .mud-table,
body:not(.viewer-route) .mud-dialog,
body:not(.viewer-route) .mud-appbar,
body:not(.viewer-route) .mud-drawer {
    font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* Button styling matching website */
body:not(.viewer-route) .mud-button-root {
    border-radius: 8px;
    transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1);
    font-weight: 500;
}

/* Primary button hover - green-700 (#15803d) */
body:not(.viewer-route) .mud-button-filled.mud-button-filled-primary:hover {
    background-color: #15803d !important;
}

body:not(.viewer-route) .mud-button-filled.mud-button-filled-primary:active {
    background-color: #166534 !important;
}

/* MudPaper border-radius override */
body:not(.viewer-route) .mud-paper {
    border-radius: 8px;
}

/* MudCard border-radius */
body:not(.viewer-route) .mud-card {
    border-radius: 8px;
}

/* Input fields border-radius */
body:not(.viewer-route) .mud-input-outlined .mud-input-outlined-border,
body:not(.viewer-route) .mud-input-filled,
body:not(.viewer-route) .mud-select {
    border-radius: 8px;
}

/* Dialog border-radius */
body:not(.viewer-route) .mud-dialog {
    border-radius: 8px;
}

/* Menu and popover border-radius */
body:not(.viewer-route) .mud-popover,
body:not(.viewer-route) .mud-menu {
    border-radius: 8px;
}

/* AppBar refined shadow */
body:not(.viewer-route) .mud-appbar {
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
}

/* Drawer refined shadow */
body:not(.viewer-route) .mud-drawer {
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

/* Smooth transitions for interactive elements */
body:not(.viewer-route) .mud-nav-link,
body:not(.viewer-route) .mud-list-item,
body:not(.viewer-route) .mud-menu-item {
    transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1);
}

/* Container spacing and max-width */
body:not(.viewer-route) .mud-container {
    max-width: var(--max-container-width, 1280px);
}

/* Avatar styling */
body:not(.viewer-route) .mud-avatar {
    transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1);
}

body:not(.viewer-route) .mud-avatar:hover {
    transform: scale(1.05);
}

/* Chip styling */
body:not(.viewer-route) .mud-chip {
    border-radius: 8px;
}

/* Badge styling */
body:not(.viewer-route) .mud-badge {
    border-radius: 8px;
}

/* Table styling */
body:not(.viewer-route) .mud-table {
    border-radius: 8px;
    overflow: hidden;
}

/* Snackbar styling */
body:not(.viewer-route) .mud-snackbar {
    border-radius: 8px;
}

/* Custom utility classes */
body:not(.viewer-route) .corporate-container {
    max-width: var(--max-container-width, 1280px);
    margin-left: auto;
    margin-right: auto;
    padding-left: 1rem;
    padding-right: 1rem;
}

/* Ensure smooth scrolling */
body:not(.viewer-route) {
    scroll-behavior: smooth;
}

/* Focus visible for accessibility */
body:not(.viewer-route) *:focus-visible {
    outline: 2px solid #22c55e;
    outline-offset: 2px;
}

/* User Profile Menu specific styles */
body:not(.viewer-route) .user-profile-menu .mud-menu-item {
    min-height: 44px;
    padding: 8px 16px;
}

body:not(.viewer-route) .user-profile-menu .mud-list-item-icon {
    min-width: 40px;
}

body:not(.viewer-route) .user-profile-menu .mud-divider {
    margin: 4px 0;
}

/* Drawer header styling */
body:not(.viewer-route) .mud-drawer-header {
    padding: 16px;
    border-bottom: 1px solid;
}

/* Light mode drawer header border */
body:not(.viewer-route) .mud-theme-light .mud-drawer-header {
    border-bottom-color: #e5e7eb;
}

/* Dark mode drawer header border */
body:not(.viewer-route) .mud-theme-dark .mud-drawer-header {
    border-bottom-color: #334155;
}