/* BbVs CI: visual layer based on the frontpage design. Layout and interactions stay in style.css. */
:root {
  --bg: #242824;
  --bg-soft: #f5f7f1;
  --surface: #ffffff;
  --surface-strong: #ffffff;
  --surface-muted: #f5f7f1;
  --line: #dce1d7;
  --line-strong: #bac9ad;
  --text: #242824;
  --muted: #5b625b;
  --muted-strong: #3f483e;
  --accent: #4b7e1c;
  --accent-strong: #365b14;
  --accent-bright: #4c9d00;
  --accent-green: #4c9d00;
  --accent-soft: #edf2e7;
  --accent-soft-strong: #e3edda;
  --bbvs-green: #4b7e1c;
  --bbvs-green-light: #edf2e7;
  --shadow: 0 3px 16px rgba(36, 40, 36, .045);
  --radius: 3px;
  --radius-sm: 3px;
}

body {
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.6;
  background: #f5f7f1;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, .metric-value {
  font-family: Arial, Helvetica, sans-serif;
  letter-spacing: -.035em;
  line-height: 1.18;
}

a { text-underline-offset: 4px; }
:where(a, button, input, select, textarea, summary):focus-visible {
  outline: 2px solid #4b7e1c;
  outline-offset: 3px;
}

.eyebrow {
  color: #4b7e1c;
  font-size: 10px;
  letter-spacing: .16em;
  font-weight: 700;
}

.sidebar {
  background: #fff;
  color: #242824;
  border-right: 1px solid #dce1d7;
  backdrop-filter: none;
}

.brand h1 { color: #242824; font-size: 20px; font-weight: 500; }
.brand-logo { filter: none; }
.sidebar .eyebrow { color: #4b7e1c; }
.sidebar p, .sidebar .sidebar-foot, .sidebar-legal { color: #5b625b; }
.sidebar-legal a { color: #3f483e; }
.sidebar-legal a:hover { color: #4b7e1c; }
.sidebar-project-group {
  border-color: #dce1d7;
  background: #f5f7f1;
  border-radius: 3px;
}
.sidebar-link, .sidebar-form .sidebar-link {
  color: #3f483e;
  border-radius: 3px;
}
.sidebar-link:hover, .sidebar-form .sidebar-link:hover {
  background: #edf2e7;
  border-color: #d4deca;
  color: #365b14;
}
.sidebar-link.active, .sidebar-form .sidebar-link.active {
  background: #edf2e7;
  color: #365b14;
  border-color: #b0c69b;
  box-shadow: inset 3px 0 #4b7e1c;
  font-weight: 600;
}
.sidebar-parent::after { color: #6d7768; }
.sidebar-sublink { color: #5b625b; }
.sidebar-form .sidebar-sublink { padding-left: 24px; }
.sidebar-sublink::before { background: #a9bc97; }

.topbar {
  padding-bottom: 20px;
  border-bottom: 1px solid #dce1d7;
}
.topbar h1 { font-size: clamp(27px, 2.5vw, 36px); font-weight: 500; letter-spacing: -.045em; }
.topbar-copy p { color: #5b625b; }
.user-chip {
  background: #fff;
  border-color: #dce1d7;
  backdrop-filter: none;
  border-radius: 3px;
}
.page-header h2 { font-size: clamp(26px, 2.4vw, 34px); font-weight: 500; letter-spacing: -.04em; }
.card-title h2, .card-title h3 { font-weight: 500; }

.card, .card.soft, .summary-strip > div, .note-strip,
.document-row, .mini-stat, .gantt-admin-row {
  background: #fff;
  border-color: #dce1d7;
  border-radius: 3px;
  box-shadow: none;
  backdrop-filter: none;
}
.metric-card.highlight {
  background: #edf2e7;
  border-color: #cbdabf;
}
.metric-value { font-weight: 500; }
.hero-card {
  background: #4b7e1c;
  border-color: #4b7e1c;
}
.hero-card .eyebrow, .hero-card p { color: #f5f7f1; }

button:not([class]):not(.danger), .primary-link {
  background: #4b7e1c;
  border-radius: 3px;
  box-shadow: none;
  color: #fff;
}
button:not([class]):not(.danger):hover, .primary-link:hover {
  background: #365b14;
}
.secondary, .tab, .tag, .status-badge, input, select, textarea,
.table-wrap, .document-row, .mini-stat, .user-chip {
  border-radius: 3px;
}
.secondary, .tab {
  background: #fff;
  border-color: #dce1d7;
  color: #3f483e;
  box-shadow: none;
}
.secondary:hover, .tab:hover { border-color: #a9bc97; color: #365b14; }
.tab.active { background: #edf2e7; border-color: #b0c69b; color: #365b14; }
.tag, .status-badge { background: #f5f7f1; }
.metric-trend, .help-popover { border-radius: 3px; }
.progress-bar { background: #4b7e1c; }
.gantt-track { background: #edf2e7; }
.gantt-bar { background: #4b7e1c; }
.gantt-bar.done { background: #4c9d00; }
.gantt-admin-row { background: #f5f7f1; }
.rights-row, .people-rights-row { border-radius: 3px; }
.explorer-rail { background: #f5f7f1; }
thead th { background: #f5f7f1; }
th, td { border-bottom-color: #dce1d7; }
tbody tr:hover td { background: #f5f7f1; }
.breadcrumb-link { color: #4b7e1c; }
.breadcrumb-link:hover { color: #365b14; }
.breadcrumb-current { color: #242824; }
.login-preview-page .page { background: #f5f7f1; }
.login-preview-page .page::before { display: none; }
.login-preview-card, .login-preview-panel, .login-preview-form {
  border: 1px solid #dce1d7;
  border-top: 3px solid #4b7e1c;
  border-radius: 3px;
  box-shadow: none;
}
.login-preview-intro h2, .login-preview-card h3, .login-preview-panel h2 {
  font-weight: 500;
  letter-spacing: -.035em;
}
.login-preview-number, .login-preview-panel-number { border-radius: 3px; }
.login-preview-info-box { border-radius: 3px; }

.todo-hint, .todo-hint-item { border-radius: 3px; box-shadow: none; }
.todo-hint-item { background: #fff; border-color: #dce1d7; border-left-color: #4b7e1c; }
.todo-hint-item.overdue { background: #fdf3f1; border-color: #f2d5d0; border-left-color: #b42318; }
.todo-hint-overdue-tag { background: #fdf3f1; color: #b42318; }
.todo-hint-date { color: #3f483e; }
button.todo-hint-project { border-radius: 3px; box-shadow: none; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; }
}