/* OpenMetadata Custom Theme - Microsoft-inspired Design */

/* Import modern fonts */
@import url('https://fonts.googleapis.com/css2?family=Segoe+UI:wght@300;400;600;700&display=swap');

/* Root variables - Dark & White Professional Theme */
:root {
  /* Primary colors - Black/White */
  --primary-color: #000000;
  --primary-hover: #333333;
  --primary-light: #F5F5F5;
  
  /* Background colors */
  --bg-primary: #FFFFFF;
  --bg-secondary: #F8F9FA;
  --bg-tertiary: #F0F0F0;
  --bg-hover: #E8E8E8;
  
  /* Text colors */
  --text-primary: #000000;
  --text-secondary: #4A4A4A;
  --text-tertiary: #6C6C6C;
  
  /* Accent colors - Grayscale */
  --accent-dark: #1A1A1A;
  --accent-green: #2D7A2D;
  --accent-orange: #CC5500;
  --accent-gray: #666666;
  
  /* Borders and shadows */
  --border-color: #E0E0E0;
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.08);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.12);
  --shadow-lg: 0 10px 30px rgba(0,0,0,0.18);
  
  /* Border radius - Removed for flat design */
  --radius-sm: 0px;
  --radius-md: 0px;
  --radius-lg: 0px;
}

/* Global font override */
body,
html,
* {
  font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', Arial, sans-serif !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Smooth scrolling */
html {
  scroll-behavior: smooth;
}

/* Main container with modern spacing */
body {
  background: var(--bg-secondary) !important;
  color: var(--text-primary) !important;
}

/* Header/Navbar styling */
.navbar,
.ant-layout-header {
  background: var(--bg-primary) !important;
  box-shadow: var(--shadow-sm) !important;
  border-bottom: 1px solid var(--border-color) !important;
  backdrop-filter: blur(20px);
}

/* Sidebar styling */
.ant-layout-sider {
  background: var(--bg-primary) !important;
  box-shadow: var(--shadow-md) !important;
  border-right: 1px solid var(--border-color) !important;
}

/* Menu items with hover effect */
.ant-menu-item,
.ant-menu-submenu-title {
  border-radius: 0px !important;
  margin: 4px 8px !important;
}

.ant-menu-item:hover,
.ant-menu-submenu-title:hover {
  background: var(--bg-hover) !important;
  color: var(--primary-color) !important;
}

.ant-menu-item-selected {
  background: var(--primary-light) !important;
  color: var(--primary-color) !important;
  font-weight: 600 !important;
}

/* Primary buttons - Microsoft style */
.ant-btn-primary,
button[class*="primary"] {
  background: var(--primary-color) !important;
  border: none !important;
  border-radius: 0px !important;
  box-shadow: none !important;
  font-weight: 600 !important;
}

.ant-btn-primary:hover {
  background: var(--primary-hover) !important;
}

/* Cards with modern elevation */
.ant-card,
.card {
  background: var(--bg-primary) !important;
  border: 1px solid var(--border-color) !important;
  border-radius: 0px !important;
  box-shadow: none !important;
}

.ant-card:hover,
.card:hover {
  border-color: var(--text-secondary) !important;
}

/* Card headers */
.ant-card-head {
  background: var(--bg-tertiary) !important;
  border-bottom: 1px solid var(--border-color) !important;
  border-radius: 0px !important;
  font-weight: 600 !important;
  color: var(--text-primary) !important;
}

/* Tables with modern styling */
.ant-table {
  background: var(--bg-primary) !important;
  border-radius: 0px !important;
  overflow: hidden;
}

.ant-table-thead > tr > th {
  background: var(--bg-tertiary) !important;
  border-bottom: 2px solid var(--border-color) !important;
  font-weight: 600 !important;
  color: var(--text-primary) !important;
}

.ant-table-tbody > tr:hover > td {
  background: var(--bg-hover) !important;
}

/* Input fields with modern look */
.ant-input,
.ant-select-selector,
.ant-picker {
  border: 1px solid var(--border-color) !important;
  border-radius: var(--radius-sm) !important;
  transition: all 0.2s ease !important;
}

.ant-input:hover,
.ant-select-selector:hover,
.ant-picker:hover {
  border-color: var(--primary-color) !important;
}

.ant-input:focus,
.ant-select-selector:focus,
.ant-picker-focused {
  border-color: var(--primary-color) !important;
  box-shadow: 0 0 0 2px rgba(0, 120, 212, 0.1) !important;
}

/* Tags with Dark & White colors */
.ant-tag {
  border-radius: var(--radius-sm) !important;
  border: none !important;
  font-weight: 500 !important;
  padding: 4px 12px !important;
}

.ant-tag-blue {
  background: #F0F0F0 !important;
  color: #1A1A1A !important;
}

.ant-tag-green {
  background: #E8F5E8 !important;
  color: var(--accent-green) !important;
}

.ant-tag-orange {
  background: #FFF3E0 !important;
  color: var(--accent-orange) !important;
}

.ant-tag-purple {
  background: #F5F5F5 !important;
  color: var(--accent-gray) !important;
}

/* Modal dialogs */
.ant-modal-content {
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--shadow-lg) !important;
  overflow: hidden;
}

.ant-modal-header {
  background: var(--bg-tertiary) !important;
  border-bottom: 1px solid var(--border-color) !important;
  padding: 20px 24px !important;
}

.ant-modal-title {
  font-weight: 600 !important;
  font-size: 18px !important;
  color: var(--text-primary) !important;
}

/* Breadcrumbs */
.ant-breadcrumb {
  font-size: 14px !important;
}

.ant-breadcrumb-link {
  color: var(--text-secondary) !important;
  transition: color 0.2s ease !important;
}

.ant-breadcrumb-link:hover {
  color: var(--primary-color) !important;
}

/* Search bar */
.ant-input-search {
  border-radius: var(--radius-md) !important;
}

.ant-input-search-button {
  background: var(--primary-color) !important;
  border-radius: 0 var(--radius-md) var(--radius-md) 0 !important;
}

/* Badges and notifications */
.ant-badge-count {
  background: var(--accent-orange) !important;
  box-shadow: var(--shadow-sm) !important;
}

/* Alerts with dark/white theme */
.ant-alert {
  border-radius: var(--radius-md) !important;
  border: none !important;
}

.ant-alert-success {
  background: #E8F5E8 !important;
  color: var(--accent-green) !important;
}

.ant-alert-info {
  background: #F5F5F5 !important;
  color: #1A1A1A !important;
}

.ant-alert-warning {
  background: #FFF3E0 !important;
  color: var(--accent-orange) !important;
}

.ant-alert-error {
  background: #FFEBEE !important;
  color: #C62828 !important;
}

/* Dropdown menus */
.ant-dropdown-menu {
  border-radius: var(--radius-md) !important;
  box-shadow: var(--shadow-lg) !important;
  border: 1px solid var(--border-color) !important;
  padding: 8px !important;
}

.ant-dropdown-menu-item {
  border-radius: var(--radius-sm) !important;
  margin: 2px 0 !important;
  transition: all 0.2s ease !important;
}

.ant-dropdown-menu-item:hover {
  background: var(--bg-hover) !important;
  color: var(--primary-color) !important;
}

/* Tabs */
.ant-tabs-tab {
  padding: 12px 16px !important;
  transition: all 0.2s ease !important;
}

.ant-tabs-tab:hover {
  color: var(--primary-color) !important;
}

.ant-tabs-tab-active {
  color: var(--primary-color) !important;
  font-weight: 600 !important;
}

.ant-tabs-ink-bar {
  background: var(--primary-color) !important;
  height: 3px !important;
}

/* Tooltips */
.ant-tooltip-inner {
  background: var(--text-primary) !important;
  border-radius: var(--radius-sm) !important;
  padding: 8px 12px !important;
}

/* Progress bars */
.ant-progress-bg {
  background: var(--primary-color) !important;
}

/* Scrollbars */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: var(--bg-secondary);
}

::-webkit-scrollbar-thumb {
  background: var(--border-color);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--text-tertiary);
}

/* Loading spinner */
.ant-spin-dot-item {
  background: var(--primary-color) !important;
}

/* Dividers */
.ant-divider {
  border-color: var(--border-color) !important;
}

/* Page titles */
h1, h2, h3, h4, h5, h6 {
  color: var(--text-primary) !important;
  font-weight: 600 !important;
}

/* Links */
a {
  color: var(--primary-color) !important;
  transition: color 0.2s ease !important;
}

a:hover {
  color: var(--primary-hover) !important;
  text-decoration: underline;
}

/* Minimal transitions - no animations */
* {
  transition: none !important;
  animation: none !important;
}

/* Glassmorphism effect for header */
.ant-layout-header {
  background: rgba(255, 255, 255, 0.95) !important;
  backdrop-filter: saturate(180%) blur(20px);
}

/* Modern focus styles */
*:focus-visible {
  outline: 2px solid var(--primary-color) !important;
  outline-offset: 2px !important;
  border-radius: var(--radius-sm);
}