/* Dev Global Jobs V69 Dashboard Integrated - Production Additive Layer (69.3.0) */

@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Mono:wght@400;700&display=swap');

:root {
  --v69-bg: #eef4f7;
  --v69-surface: #ffffff;
  --v69-border: #e2e8f0;
  
  --v69-sidebar-bg: #17263a;
  --v69-sidebar-border: rgba(255, 255, 255, 0.1);
  --v69-sidebar-text: #94a3b8;
  --v69-sidebar-active: #17263a;
  --v69-sidebar-active-bg: #22d3ee;
  
  --v69-text-main: #17263a;
  --v69-text-muted: #64748b;
  
  --v69-primary: #10b5d2;
  --v69-primary-hover: #0e9eb8;
  --v69-primary-fg: #ffffff;
  
  --v69-radius-sm: 8px;
  --v69-radius-md: 12px;
  --v69-radius-lg: 16px;
  
  --v69-font-sans: 'DM Sans', system-ui, -apple-system, sans-serif;
  --v69-font-mono: 'Space Mono', monospace;
}

/* Base resets & typography */
html.dgj46-employer-html body,
html.dgj57-admin-html body,
body.dgj57-admin-dashboard,
body.dgj46-employer-post-mode,
.dgj46-app,
#dgj-growth-admin,
.dgj51-admin-overlay,
.dgj46-admin-overlay,
.dgj46-onboard-shell {
  font-family: var(--v69-font-sans) !important;
  background-color: var(--v69-bg) !important;
  color: var(--v69-text-main) !important;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden !important;
  background-image: none !important;
}

/* Override any inline or inherited gradient backgrounds */
body.dgj57-admin-login,
html.dgj46-employer-html,
html.dgj46-employer-html body,
body.dgj46-employer-post-mode {
  background: var(--v69-bg) !important;
}

body.dgj57-admin-dashboard #root > div {
  background: var(--v69-bg) !important;
}

/* ==========================================================================
   LAYOUT FIXES (Grid, Overflow, Sizing)
   ========================================================================== */

.dgj46-app, body.dgj57-admin-dashboard #root > div {
  display: grid !important;
  grid-template-columns: 248px minmax(0, 1fr) !important;
  align-items: start !important;
  background: var(--v69-bg) !important;
  min-height: 100vh !important;
  max-width: 100vw !important;
  overflow-x: hidden !important;
}

.dgj46-main, .dgj57-admin-main {
  min-width: 0 !important;
  max-width: calc(100vw - 248px) !important;
  box-sizing: border-box !important;
  padding-bottom: 60px !important;
  background: transparent !important;
}

/* Responsive grids */
@media (max-width: 1050px) {
  .dgj46-app, body.dgj57-admin-dashboard #root > div { grid-template-columns: 220px minmax(0, 1fr) !important; }
  .dgj46-side, aside.dgj57-admin-sidebar { width: 220px !important; min-width: 220px !important; }
  .dgj46-main, .dgj57-admin-main { max-width: calc(100vw - 220px) !important; }
}
@media (max-width: 760px) {
  .dgj46-app, body.dgj57-admin-dashboard #root > div { display: block !important; }
  .dgj46-side, aside.dgj57-admin-sidebar { width: 100% !important; min-width: 0 !important; height: auto !important; position: relative !important; }
  .dgj46-main, .dgj57-admin-main { max-width: 100vw !important; padding-bottom: 40px !important; }
}

/* ==========================================================================
   SIDEBARS (Employer & Admin)
   ========================================================================== */

.dgj46-side, aside.dgj57-admin-sidebar {
  width: 248px !important;
  min-width: 248px !important;
  background: var(--v69-sidebar-bg) !important;
  border-right: 1px solid var(--v69-sidebar-border) !important;
  padding: 1.5rem 1rem !important;
  position: sticky !important;
  top: 0 !important;
  height: 100vh !important;
  box-shadow: none !important;
  overflow-y: auto !important;
}

.dgj46-side-brand {
  border-bottom: 1px solid var(--v69-sidebar-border) !important;
  padding-bottom: 1.25rem !important;
  margin-bottom: 1.25rem !important;
}
.dgj46-side-brand b { color: #ffffff !important; font-weight: 700 !important; font-size: 1.125rem !important; margin-top: 0 !important; }
.dgj46-side-brand span { color: var(--v69-primary) !important; font-family: var(--v69-font-mono) !important; font-size: 10px !important; }

.dgj46-side-company {
  background: rgba(255,255,255,0.03) !important;
  border: 1px solid var(--v69-sidebar-border) !important;
  border-radius: var(--v69-radius-md) !important;
  padding: 1rem !important;
  margin-bottom: 1.5rem !important;
  box-shadow: none !important;
}
.dgj46-side-company > span { color: var(--v69-primary) !important; font-family: var(--v69-font-mono) !important; font-size: 10px !important; }
.dgj46-side-company b { color: #fff !important; font-weight: 600 !important; margin-top: 4px !important; font-size: 14px !important; }
.dgj46-side-company small { color: var(--v69-sidebar-text) !important; margin-top: 2px !important; }

/* Nav items */
.dgj46-side nav a, .dgj46-side nav button, .dgj57-nav-item {
  color: var(--v69-sidebar-text) !important;
  font-family: var(--v69-font-sans) !important;
  font-weight: 500 !important;
  font-size: 14px !important;
  padding: 10px 14px !important;
  border-radius: var(--v69-radius-sm) !important;
  background: transparent !important;
  border: none !important;
  transition: all 0.2s ease !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  text-align: left !important;
  margin-bottom: 4px !important;
  box-shadow: none !important;
}

.dgj46-side nav a:hover, .dgj46-side nav button:hover, .dgj57-nav-item:hover {
  background: rgba(255, 255, 255, 0.05) !important;
  color: #fff !important;
  transform: none !important;
  box-shadow: none !important;
}

.dgj46-side nav a.active, .dgj46-side nav button.active, .dgj57-nav-item.active, .dgj57-nav-item[aria-current="page"] {
  background: var(--v69-sidebar-active-bg) !important;
  color: var(--v69-sidebar-active) !important;
  font-weight: 600 !important;
  box-shadow: none !important;
}

.dgj57-nav-group {
  color: #64748b !important;
  font-family: var(--v69-font-mono) !important;
  font-size: 10px !important;
  letter-spacing: 0.15em !important;
  margin: 1.5rem 10px 0.5rem !important;
}

/* ==========================================================================
   HEADERS & TOP BAR
   ========================================================================== */

.dgj46-top {
  background: rgba(255, 255, 255, 0.9) !important;
  backdrop-filter: blur(8px) !important;
  border-bottom: 1px solid var(--v69-border) !important;
  padding: 1.25rem 2rem !important;
  min-height: 72px !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 40 !important;
}

#dgj57-command-header {
  background: var(--v69-surface) !important;
  border: 1px solid var(--v69-border) !important;
  border-radius: var(--v69-radius-lg) !important;
  padding: 24px !important;
  margin-bottom: 24px !important;
  box-shadow: 0 4px 20px rgba(23, 38, 58, 0.03) !important;
}
#dgj57-command-header::before { display: none !important; }

.dgj46-top h1, .dgj57-command-line h1 {
  font-family: var(--v69-font-sans) !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  color: var(--v69-text-main) !important;
  margin: 4px 0 0 !important;
}

.dgj46-top span, .dgj57-command-copy > span {
  font-family: var(--v69-font-mono) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  color: var(--v69-primary) !important;
}

/* ==========================================================================
   CARDS, PANELS & CONTAINERS
   ========================================================================== */

.dgj46-content {
  padding: 2rem !important;
  max-width: 1480px !important;
  margin: 0 auto !important;
}

.dgj46-panel, .dgj46-cards > div, .dgj57-table-shell, .dgj57-overview-zone > div, .dgj57-commercial-zone > div, .dgj57-system-zone > div, .dgj46-form, .dgj-g-card {
  background: var(--v69-surface) !important;
  border: 1px solid var(--v69-border) !important;
  border-radius: var(--v69-radius-md) !important;
  box-shadow: 0 2px 10px rgba(23, 38, 58, 0.03) !important;
  color: var(--v69-text-main) !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}

.dgj46-cards > div:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 24px rgba(23, 38, 58, 0.06) !important;
}

.dgj46-panel-head h3, .dgj46-page-head h2 {
  font-family: var(--v69-font-sans) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: var(--v69-text-main) !important;
}

.dgj46-panel-head span, .dgj46-page-head span, .dgj46-hero span, .dgj57-command-meta span {
  font-family: var(--v69-font-mono) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  color: var(--v69-primary) !important;
}

/* ==========================================================================
   BUTTONS
   ========================================================================== */

.dgj46-primary, .dgj-g-btn.primary {
  background: var(--v69-primary) !important;
  color: var(--v69-primary-fg) !important;
  font-family: var(--v69-font-sans) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  border-radius: var(--v69-radius-sm) !important;
  border: none !important;
  padding: 10px 18px !important;
  box-shadow: 0 4px 12px rgba(16, 181, 210, 0.2) !important;
  transition: all 0.2s ease !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.dgj46-primary:hover, .dgj-g-btn.primary:hover {
  background: var(--v69-primary-hover) !important;
  box-shadow: 0 6px 16px rgba(16, 181, 210, 0.3) !important;
  transform: translateY(-1px) !important;
  filter: none !important;
}

.dgj57-quick {
  background: var(--v69-surface) !important;
  color: var(--v69-text-main) !important;
  border: 1px solid var(--v69-border) !important;
  border-radius: var(--v69-radius-sm) !important;
  padding: 12px 16px !important;
  box-shadow: 0 2px 6px rgba(23, 38, 58, 0.04) !important;
  transition: all 0.2s ease !important;
}
.dgj57-quick:hover {
  border-color: var(--v69-primary) !important;
  box-shadow: 0 6px 16px rgba(16, 181, 210, 0.12) !important;
  transform: translateY(-1px) !important;
}
.dgj57-quick svg { stroke: var(--v69-primary) !important; }
.dgj57-quick b { font-family: var(--v69-font-sans) !important; font-size: 13px !important; color: var(--v69-text-main) !important; font-weight: 700 !important; }
.dgj57-quick small { color: var(--v69-text-muted) !important; font-family: var(--v69-font-sans) !important; font-size: 11px !important; margin-top: 4px !important; font-weight: 500 !important; }

/* ==========================================================================
   METRICS & BOOSTS FIX
   ========================================================================== */

.dgj46-performance {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(80px, 1fr)) !important;
  gap: 12px !important;
  min-width: 0 !important;
}
.dgj46-metric {
  background: var(--v69-bg) !important;
  border: 1px solid var(--v69-border) !important;
  border-radius: var(--v69-radius-sm) !important;
  padding: 12px !important;
  text-align: left !important;
  display: flex !important;
  flex-direction: column !important;
}
.dgj46-metric > span {
  align-self: flex-start !important;
  margin-bottom: 8px !important;
  color: var(--v69-primary) !important;
}
.dgj46-metric > span svg {
  width: 18px !important;
  height: 18px !important;
}
.dgj46-metric b {
  font-family: var(--v69-font-mono) !important;
  font-size: 20px !important;
  color: var(--v69-text-main) !important;
}
.dgj46-metric small {
  font-family: var(--v69-font-sans) !important;
  font-size: 10px !important;
  color: var(--v69-text-muted) !important;
  letter-spacing: 0.05em !important;
  margin-top: 4px !important;
}
.dgj46-performance.big .dgj46-metric { padding: 16px !important; }
.dgj46-performance.big .dgj46-metric b { font-size: 28px !important; }

.dgj46-allow {
  gap: 12px !important;
}
.dgj46-allow > div {
  background: var(--v69-bg) !important;
  border: 1px solid var(--v69-border) !important;
  border-radius: var(--v69-radius-md) !important;
  padding: 16px !important;
}
.dgj46-allow b { color: var(--v69-primary) !important; font-size: 28px !important; font-family: var(--v69-font-mono) !important; }

/* ==========================================================================
   FORMS & INPUTS
   ========================================================================== */

.dgj46-form input, .dgj46-form select, .dgj46-modal input, .dgj46-modal select, .dgj-g-form input, .dgj-g-form select {
  background: var(--v69-surface) !important;
  border: 1px solid var(--v69-border) !important;
  border-radius: var(--v69-radius-sm) !important;
  color: var(--v69-text-main) !important;
  font-family: var(--v69-font-sans) !important;
  font-size: 13px !important;
  padding: 10px 14px !important;
  height: auto !important;
  min-height: 42px !important;
  box-sizing: border-box !important;
}
.dgj46-form input:focus, .dgj46-form select:focus, .dgj46-modal input:focus, .dgj46-modal select:focus, .dgj-g-form input:focus, .dgj-g-form select:focus {
  border-color: var(--v69-primary) !important;
  box-shadow: 0 0 0 3px rgba(16, 181, 210, 0.2) !important;
  outline: none !important;
}
.dgj46-form label, .dgj46-modal label {
  color: var(--v69-text-main) !important;
  font-weight: 600 !important;
  font-size: 12px !important;
}

/* ==========================================================================
   TABLES & LISTS
   ========================================================================== */

.dgj57-table-shell, .dgj-g-table-wrap {
  overflow-x: auto !important;
}
.dgj57-table-shell table, .dgj-g-table {
  width: 100% !important;
  min-width: 800px !important;
  border-collapse: collapse !important;
}
.dgj57-table-shell thead th, .dgj-g-table th {
  background: var(--v69-bg) !important;
  color: var(--v69-text-muted) !important;
  font-family: var(--v69-font-mono) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  border-bottom: 1px solid var(--v69-border) !important;
  padding: 12px 16px !important;
  text-transform: uppercase !important;
  text-align: left !important;
}
.dgj57-table-shell tbody td, .dgj-g-table td {
  border-bottom: 1px solid var(--v69-border) !important;
  padding: 12px 16px !important;
  color: var(--v69-text-main) !important;
  font-family: var(--v69-font-sans) !important;
  font-size: 13px !important;
  vertical-align: middle !important;
}

.dgj46-job, .dgj46-table > div {
  border-top: 1px solid var(--v69-border) !important;
  padding: 16px 8px !important;
}
.dgj46-job:first-child, .dgj46-table > div:first-child { border-top: none !important; }
.dgj46-job h3 { font-size: 16px !important; color: var(--v69-text-main) !important; font-weight: 700 !important; }
.dgj46-job p { color: var(--v69-text-muted) !important; }

.dgj46-job-actions button, .dgj46-job-actions a {
  background: var(--v69-surface) !important;
  border: 1px solid var(--v69-border) !important;
  color: var(--v69-text-main) !important;
  font-family: var(--v69-font-sans) !important;
  font-weight: 600 !important;
  border-radius: var(--v69-radius-sm) !important;
  box-shadow: 0 2px 6px rgba(23, 38, 58, 0.04) !important;
  padding: 6px 12px !important;
  text-decoration: none !important;
  min-height: auto !important;
}
.dgj46-job-actions button:hover, .dgj46-job-actions a:hover {
  background: var(--v69-bg) !important;
  border-color: #cbd5e1 !important;
}
.dgj46-job-actions .premium {
  color: #b45309 !important;
  background: #fffbeb !important;
  border-color: #fde68a !important;
}

/* ==========================================================================
   GROWTH SUITE UNIFICATION (White Executive Chrome)
   ========================================================================== */

#dgj-growth-admin {
  width: 100% !important;
  max-width: 1480px !important;
  margin: 0 auto !important;
  padding: 0 24px 48px !important;
  box-sizing: border-box !important;
}
#dgj-growth-admin .dgj-g-shell {
  background: var(--v69-surface) !important;
  border: 1px solid var(--v69-border) !important;
  border-radius: var(--v69-radius-md) !important;
  box-shadow: 0 4px 20px rgba(23, 38, 58, 0.05) !important;
}
#dgj-growth-admin .dgj-g-head {
  background: var(--v69-surface) !important;
  border-bottom: 1px solid var(--v69-border) !important;
  color: var(--v69-text-main) !important;
}
#dgj-growth-admin .dgj-g-head h2 { color: var(--v69-text-main) !important; font-family: var(--v69-font-sans) !important; font-weight: 700 !important; }
#dgj-growth-admin .dgj-g-head p { color: var(--v69-text-muted) !important; }
#dgj-growth-admin .dgj-g-badge {
  background: var(--v69-bg) !important;
  color: var(--v69-text-muted) !important;
  border: 1px solid var(--v69-border) !important;
  font-family: var(--v69-font-mono) !important;
}
#dgj-growth-admin .dgj-g-body { background: transparent !important; }
#dgj-growth-admin .dgj-g-card,
#dgj-growth-admin .dgj-g-table-wrap,
#dgj-growth-admin .dgj-g-history-list > div,
#dgj-growth-admin .dgj-g-import {
  background: var(--v69-surface) !important;
  border: 1px solid var(--v69-border) !important;
  box-shadow: 0 2px 8px rgba(23, 38, 58, 0.03) !important;
  border-radius: var(--v69-radius-md) !important;
}
#dgj-growth-admin .dgj-g-card b,
#dgj-growth-admin .dgj-g-table strong,
#dgj-growth-admin .dgj-g-history-list a {
  color: var(--v69-text-main) !important;
}
#dgj-growth-admin .dgj-g-card span,
#dgj-growth-admin .dgj-g-table td,
#dgj-growth-admin .dgj-g-history-list small,
#dgj-growth-admin .dgj-g-muted,
#dgj-growth-admin .dgj-g-history summary,
#dgj-growth-admin .dgj-g-alert,
#dgj-growth-admin .dgj-g-import p {
  color: var(--v69-text-muted) !important;
}
#dgj-growth-admin .dgj-g-tab {
  background: var(--v69-surface) !important;
  border: 1px solid var(--v69-border) !important;
  color: var(--v69-text-main) !important;
  border-radius: var(--v69-radius-sm) !important;
  font-weight: 600 !important;
  transition: all 0.2s ease !important;
}
#dgj-growth-admin .dgj-g-tab.active {
  background: var(--v69-primary) !important;
  border-color: var(--v69-primary) !important;
  color: #fff !important;
}

/* ==========================================================================
   ENTERPRISE OVERLAYS (Admin Sub-Consoles)
   ========================================================================== */

.dgj57-enterprise-overlay {
  background: rgba(238, 244, 247, 0.95) !important;
  backdrop-filter: blur(8px) !important;
  color: var(--v69-text-main) !important;
}
.dgj57-enterprise-overlay .dgj46-admin-head,
.dgj57-enterprise-overlay .dgj51-admin-head,
.dgj57-enterprise-overlay .dgj45-admin-top {
  background: var(--v69-surface) !important;
  border-bottom: 1px solid var(--v69-border) !important;
  color: var(--v69-text-main) !important;
}
.dgj57-enterprise-overlay .dgj46-admin-head h2, .dgj57-enterprise-overlay .dgj51-admin-head h2 { 
  color: var(--v69-text-main) !important; 
  font-family: var(--v69-font-sans) !important;
  font-weight: 700 !important; 
}
.dgj57-enterprise-overlay .dgj46-admin-head p, .dgj57-enterprise-overlay .dgj51-admin-head p { 
  color: var(--v69-text-muted) !important; 
}
.dgj57-enterprise-overlay .dgj46-admin-head button, .dgj57-enterprise-overlay .dgj51-admin-head button { 
  background: var(--v69-bg) !important;
  color: var(--v69-text-main) !important;
  border: 1px solid var(--v69-border) !important;
}
.dgj57-enterprise-overlay .dgj46-admin-body,
.dgj57-enterprise-overlay .dgj51-admin-body,
.dgj57-enterprise-overlay .dgj45-admin-body {
  background: transparent !important;
}
.dgj57-enterprise-overlay .dgj45-summary > div, 
.dgj57-enterprise-overlay .dgj51-admin-cards > div,
.dgj57-enterprise-overlay .dgj45-table-wrap, 
.dgj57-enterprise-overlay .dgj51-admin-table,
.dgj57-enterprise-overlay .dgj46-admin-table {
  background: var(--v69-surface) !important;
  border: 1px solid var(--v69-border) !important;
  border-radius: var(--v69-radius-md) !important;
  box-shadow: 0 4px 16px rgba(23, 38, 58, 0.04) !important;
}
.dgj57-enterprise-overlay .dgj45-table-wrap > div,
.dgj57-enterprise-overlay .dgj51-admin-table > div,
.dgj57-enterprise-overlay .dgj46-admin-table > div {
  border-top: 1px solid var(--v69-border) !important;
  color: var(--v69-text-main) !important;
}
.dgj57-enterprise-overlay .head {
  background: var(--v69-bg) !important;
  color: var(--v69-text-muted) !important;
  font-family: var(--v69-font-mono) !important;
  border-top: none !important;
}
.dgj57-enterprise-overlay .dgj46-admin-table b, .dgj57-enterprise-overlay .dgj51-admin-table b { color: var(--v69-text-main) !important; }
.dgj57-enterprise-overlay .dgj46-admin-table small, .dgj57-enterprise-overlay .dgj51-admin-table small { color: var(--v69-text-muted) !important; }
.dgj57-enterprise-overlay .dgj46-admin-table a, .dgj57-enterprise-overlay .dgj51-admin-table a { color: var(--v69-primary) !important; }

/* ==========================================================================
   STATUS PILLS & BADGES
   ========================================================================== */
.dgj46-status, .dgj-g-pill, .dgj46-job-tags span {
  border-radius: 99px !important;
  font-weight: 700 !important;
  padding: 4px 10px !important;
  font-size: 10px !important;
  letter-spacing: 0.05em !important;
  background: var(--v69-bg) !important;
  color: var(--v69-text-main) !important;
  border: 1px solid var(--v69-border) !important;
  text-transform: capitalize !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.dgj46-status.published, .dgj46-status.active, .dgj-g-pill.green {
  background: #f0fdf4 !important;
  color: #15803d !important;
  border-color: #bbf7d0 !important;
}
.dgj46-status.pending, .dgj46-status.processing, .dgj-g-pill.orange {
  background: #fffbeb !important;
  color: #b45309 !important;
  border-color: #fde68a !important;
}
.dgj46-status.rejected, .dgj46-status.revoked {
  background: #fef2f2 !important;
  color: #b91c1c !important;
  border-color: #fecaca !important;
}
