/* ============================================================
   manna_global.css — V7 글로벌 시각 보정
   생성: 2026-05-10 (Phase 4-1 시각 시정)
   목적: style.css 사이드바 네이비 → 올리브 그린 override
         body/앱 배경 → 크림 override
         layout: !important 금지 (background/color 한정)
   ============================================================ */

/* ── 사이드바 배경/텍스트 (style.css .sidebar { background: var(--color-primary) } 무력화) ── */
.sidebar,
#sidebar {
  background: var(--color-sidebar-bg) !important;      /* #3D4828 올리브 그린 */
  color: var(--color-sidebar-text) !important;          /* #FFFFFF */
}

.sidebar-header {
  border-bottom-color: rgba(255, 255, 255, 0.10) !important;
}

.sidebar-title {
  color: var(--color-sidebar-text) !important;
}

.sidebar-version {
  background: rgba(255, 255, 255, 0.15) !important;
  color: var(--color-sidebar-text) !important;
}

.sidebar-menu .menu-item,
.sidebar a,
.menu-item {
  color: var(--color-sidebar-text-muted) !important;
}

.menu-item:hover {
  background: var(--color-sidebar-active-bg) !important;
  color: var(--color-sidebar-text) !important;
}

.menu-item.active {
  background: var(--color-sidebar-active-bg) !important;
  color: var(--color-sidebar-text) !important;
  border-left-color: var(--color-highlight) !important;
}

.sidebar-footer {
  border-top-color: rgba(255, 255, 255, 0.10) !important;
}

.sidebar-user {
  color: var(--color-sidebar-text-muted) !important;
}

.logout-btn {
  background: rgba(255, 255, 255, 0.15) !important;
  color: var(--color-sidebar-text) !important;
}

.logout-btn:hover {
  background: rgba(255, 255, 255, 0.25) !important;
}

/* ── 메인 영역 배경 — 크림 (#F8F4ED) ── */
body,
#app,
#content,
.main-content {
  background: var(--color-bg) !important;   /* #F8F4ED */
}

/* ── 로그인 화면은 기존 그라디언트 유지 (로그인 박스 제외) ── */
.login-container {
  background: linear-gradient(135deg, var(--color-primary) 0%, #2D5A35 100%) !important;
}

/* ===================================================
   phase4-1 디자인 디테일 매칭 [20260510]
   =================================================== */

/* === 사이드바 헤더 (mn-sidebar-head) === */
.mn-sidebar-head {
  padding: var(--space-5) var(--space-4) var(--space-3);
  display: flex;
  align-items: center;
  gap: var(--space-3);
}
.mn-seal {
  width: 36px; height: 36px;
  background: var(--color-primary);
  color: #FFF;
  font-weight: 700;
  font-size: 15px;
  display: grid;
  place-items: center;
  border-radius: var(--radius-sm);
  box-shadow: 0 2px 4px rgba(0,0,0,0.15);
  flex-shrink: 0;
}
.mn-brand-name {
  font-size: var(--font-size-lg);
  font-weight: 700;
  letter-spacing: -0.3px;
  color: var(--color-sidebar-text);
}
.mn-brand-sub {
  font-size: 10px;
  letter-spacing: 1px;
  color: var(--color-sidebar-text-muted);
  margin-top: 2px;
}
.mn-admin-tag {
  margin: 0 var(--space-4) var(--space-3);
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  padding: 4px var(--space-3);
  background: rgba(201, 123, 90, 0.18);
  color: #E5A98A;
  font-size: var(--font-size-xs);
  font-weight: 500;
  border-radius: var(--radius-full);
  width: fit-content;
}
.mn-admin-tag .mn-ver {
  color: var(--color-sidebar-text-muted);
  margin-left: auto;
  padding-left: var(--space-2);
  border-left: 1px solid rgba(255,255,255,0.15);
}

/* === 사이드바 하단 mood === */
.mn-sidebar-foot {
  padding: var(--space-4);
  background: rgba(0,0,0,0.15);
  border-top: 1px solid rgba(255,255,255,0.06);
  margin-top: var(--space-3);
}
.mn-clock-time {
  font-size: var(--font-size-xl);
  font-weight: 700;
  letter-spacing: -0.3px;
  color: var(--color-sidebar-text);
}
.mn-clock-date {
  font-size: var(--font-size-xs);
  color: var(--color-sidebar-text-muted);
  margin-top: 2px;
}
.mn-grain-row {
  display: flex;
  gap: 4px;
  margin: var(--space-3) 0 var(--space-2);
  opacity: 0.5;
  color: var(--color-sidebar-text);
}
.mn-mood-quote {
  font-size: var(--font-size-xs);
  color: var(--color-sidebar-text-muted);
  font-style: italic;
  line-height: 1.5;
}

/* === 글로벌 폰트·자간 === */
body {
  font-family: var(--font-family) !important;
  letter-spacing: -0.2px;
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, .panel-title, .topbar-title { letter-spacing: -0.4px; font-weight: 700; }
.kpi-num { letter-spacing: -1px; font-weight: 700; }

/* === 사이드바 flex 레이아웃 === */
.sidebar { display: flex; flex-direction: column; }
.sidebar-menu, #sidebar-menu, .sidebar nav { flex: 1; overflow-y: auto; }