/* Nextera Vikunja overlay v2 — tokens from hr-app */
@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;600;700&display=swap");

html, body, :root, .app, .no-auth-wrapper {
  /* Force grey/black palette over Vikunja blue primary */
  --primary-h: 220deg !important;
  --primary-s: 13% !important;
  --primary-l: 18% !important;
  --primary-a: 1 !important;
  --primary-hsl: 220, 13%, 18% !important;
  --primary: hsla(220, 13%, 18%, 1) !important;
  --primary-dark: hsla(220, 13%, 10%, 1) !important;
  --primary-light: hsla(220, 13%, 95%, 1) !important;
  --link-h: 220deg !important;
  --link-s: 13% !important;
  --link-l: 18% !important;
  --link: hsla(220, 13%, 18%, 1) !important;
  --link-hover: hsla(220, 13%, 10%, 1) !important;
  --info: hsla(220, 13%, 30%, 1) !important;
  --button-radius: 23px !important;
  /* hr-app tokens */
  --bg-canvas: #DAD1CC;
  --surface: #FFFFFF;
  --text-primary: #010203;
  --text-muted: #98908B;
  --accent-mint: #34E8BC;
  --accent-green: #4CE41E;
  --accent-green-hover: #3CB815;
  --accent-green-text: #010203;
  --bg-header: #010203;
  --bg-row-alt: #F7F2EE;
  --radius-md: 23px;
  --font-sans: "IBM Plex Sans", system-ui, sans-serif;
  --site-background: var(--bg-canvas) !important;
}

html, body, .app, button, input, textarea, select, .button, .has-text-dark, .input {
  font-family: var(--font-sans) !important;
}

body, .app, #app, .main {
  background: var(--bg-canvas) !important;
}

/* Pill buttons override (was 4px) */
.button, .button.is-primary {
  border-radius: var(--radius-md) !important;
  text-transform: none !important;
  font-weight: 600 !important;
  padding: 0.6rem 1.5rem !important;
  min-block-size: 40px !important;
  letter-spacing: -0.005em;
}

/* Login page rebrand */
.no-auth-wrapper .image,
.no-auth-wrapper .image-title,
.no-auth-wrapper > .logo,
.no-auth-wrapper img.logo,
img.logo {
  display: none !important;
}

.no-auth-wrapper {
  background: var(--bg-canvas) !important;
  padding-top: 100px !important;
  min-block-size: 100vh !important;
}

.noauth-container {
  background: var(--surface) !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 24px rgba(0,0,0,0.06) !important;
  max-width: 460px !important;
  margin: 0 auto !important;
  padding: 32px !important;
}

/* Headings */
.noauth-container h1,
.noauth-container .title,
.no-auth-wrapper h1,
h1, h2, .title {
  font-family: var(--font-sans) !important;
  color: var(--text-primary) !important;
  font-weight: 700 !important;
  letter-spacing: -0.025em !important;
}

/* Inputs */
.field .input,
input.input,
.input {
  border-radius: 12px !important;
  border: 1px solid var(--bg-row-alt) !important;
  font-family: var(--font-sans) !important;
  padding: 0.65rem 0.85rem !important;
}
.field .input:focus,
.input:focus {
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 3px rgba(31,41,55,0.08) !important;
}

/* OIDC SSO button — keep lime accent */
[class*="openid"] .button,
.openid-providers .button,
.openid-providers a.button,
button[class*="provider"] {
  background: var(--accent-green) !important;
  background-color: var(--accent-green) !important;
  color: var(--accent-green-text) !important;
  border: none !important;
  border-radius: var(--radius-md) !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em;
}
[class*="openid"] .button:hover {
  background: var(--accent-green-hover) !important;
}

/* Nextera fixed header */
#nextera-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  height: 64px;
  background: var(--surface);
  border-bottom: 1px solid var(--bg-row-alt);
  display: flex;
  align-items: center;
  padding: 0 24px;
  z-index: 9999;
  gap: 12px;
}
#nextera-header .brand {
  display: flex;
  align-items: center;
  gap: 10px;
}
#nextera-header .badge {
  font-size: 11px;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 4px;
  background: var(--text-muted);
  color: #FFFFFF;
  line-height: 1;
  letter-spacing: 0.05em;
}

/* Push main below fixed header */
.app-container,
#app > .main,
.no-auth-wrapper {
  padding-top: 84px !important;
}

/* Subtle link styling */
a, .link {
  color: var(--text-primary) !important;
  text-decoration: none;
}
a:hover {
  color: var(--accent-green-hover) !important;
}

/* Tag green for OIDC label */
.tag.is-primary {
  background-color: var(--text-muted) !important;
}

/* ===== v3 patch: projects list page ===== */

/* Project cards: salatovy lime accent, black text */
.project-card {
  background: var(--accent-green) !important;
  background-color: var(--accent-green) !important;
  background-image: none !important;
  color: var(--text-primary) !important;
  border-inline-start: none !important;
}
.project-card .project-background {
  display: none !important;
}
.project-card .project-title,
.project-card.has-light-text .project-title,
.project-card.has-background .project-title {
  color: var(--text-primary) !important;
  text-shadow: none !important;
}
.project-card .saved-filter-icon,
.project-card .favorite {
  color: var(--text-primary) !important;
}

/* Action buttons (top-right: Создать фильтр / Создать проект) */
.action-buttons .button,
.action-buttons .button.is-primary,
.project-header .action-buttons a.button {
  background: #98908B !important;
  background-color: #98908B !important;
  color: var(--accent-green) !important;
  --button-text-color: var(--accent-green) !important;
  border: none !important;
}
.action-buttons .button:hover,
.action-buttons .button.is-primary:hover {
  background: #7E7672 !important;
  background-color: #7E7672 !important;
  color: var(--accent-green) !important;
}
.action-buttons .button .icon,
.action-buttons .button svg {
  color: var(--accent-green) !important;
  fill: var(--accent-green) !important;
}

/* Catch-all: any remaining white-on-dark text on this page → dark */
.content .has-text-white,
.project-card .has-text-white {
  color: var(--text-primary) !important;
}

/* ===== v4 patch: bronze gradient + font everywhere ===== */

/* Token: bronze (nextera.ru hero cards) */
:root, html, body, .app, .no-auth-wrapper {
  --bronze-1: #C8A695;
  --bronze-2: #8E6E5E;
  --bronze-grad: linear-gradient(135deg, #C8A695 0%, #8E6E5E 100%);
  --bronze-grad-soft: linear-gradient(135deg, #BFA08F 0%, #9B7D6D 100%);
}

/* Force IBM Plex on every single element */
*, *::before, *::after,
.button, .input, .field, .tag, .title, .subtitle,
h1, h2, h3, h4, h5, h6,
.menu-list a, .menu-label, .project-title, .task-title,
[class*="kanban"], [class*="bucket"], [class*="task"], [class*="filter"] {
  font-family: "IBM Plex Sans", system-ui, -apple-system, sans-serif !important;
}

/* Project cards → bronze gradient (replacing the lime from v3) */
.project-card {
  background: var(--bronze-grad) !important;
  background-color: var(--bronze-2) !important;
  background-image: var(--bronze-grad) !important;
  color: #FFFFFF !important;
  border-inline-start: none !important;
}
.project-card .project-title,
.project-card.has-light-text .project-title,
.project-card.has-background .project-title {
  color: #FFFFFF !important;
  font-weight: 700 !important;
  text-shadow: none !important;
}
.project-card .saved-filter-icon,
.project-card .favorite,
.project-card .icon {
  color: #FFFFFF !important;
}

/* "Показать архив" checkbox label → readable dark */
.fancycheckbox,
.fancycheckbox span,
.fancycheckbox .check,
.fancycheckbox label,
.project-header .fancycheckbox {
  color: var(--text-primary) !important;
}
.fancycheckbox * {
  color: var(--text-primary) !important;
}

/* Kanban view (inside project): bronze for buckets + toolbar */
.kanban .bucket,
.bucket,
[class*="kanban"] .bucket {
  background: var(--bronze-grad-soft) !important;
  color: #FFFFFF !important;
}
.bucket .bucket-header,
.bucket .title,
.bucket-header input {
  color: #FFFFFF !important;
  background: transparent !important;
}
.bucket .new-task-button,
.bucket .add-task,
.bucket button[class*="add"],
.bucket .new-task {
  background: rgba(255,255,255,0.12) !important;
  color: #FFFFFF !important;
  border: 1px dashed rgba(255,255,255,0.4) !important;
  border-radius: var(--radius-md) !important;
}

/* View switcher tabs (Список / Гант / Таблица / Канбан) → bronze */
.project-view-switcher,
.switch-view,
.switch-view-container,
[class*="view-switcher"],
.tabs ul,
.tabs {
  background: var(--bronze-grad-soft) !important;
  border-radius: var(--radius-md) !important;
  color: #FFFFFF !important;
}
.tabs li a,
.tabs li,
[class*="view-switcher"] a,
[class*="view-switcher"] button {
  color: rgba(255,255,255,0.7) !important;
  border-color: transparent !important;
}
.tabs li.is-active a,
[class*="view-switcher"] .is-active,
[class*="view-switcher"] .router-link-active {
  background: rgba(255,255,255,0.15) !important;
  color: #FFFFFF !important;
  border-color: transparent !important;
}

/* "+ Создать колонку" button (kanban toolbar) — match action-buttons style */
.kanban .new-bucket button,
.kanban-create-bucket,
button[class*="new-bucket"],
button[class*="create-bucket"] {
  background: #98908B !important;
  color: var(--accent-green) !important;
  --button-text-color: var(--accent-green) !important;
  border: none !important;
  border-radius: var(--radius-md) !important;
}