/* MAVIR Production — light workspace / dark navigation.
   Loaded AFTER the original styles.css, so business screens keep their markup. */

:root {
  color-scheme: light;
  --bg: #f4f1e9;
  --panel: #fbfaf6;
  --panel-2: #f1eee6;
  --line: #ddd9cf;
  --line-soft: #e8e4da;
  --text: #17211f;
  --muted: #687570;
  --accent: #15956f;
  --accent-soft: rgba(21,149,111,.10);
  --amber: #d69b28;
  --red: #dd4a4a;
  --blue: #3188c9;

  --mavir-deep: #0d2a25;
  --mavir-deep-2: #123a33;
  --mavir-paper: #f4f1e9;
  --mavir-card: #fbfaf6;
  --mavir-gold: #d5a12d;
  --mavir-ink: #17211f;
  --mavir-shadow: 0 8px 28px rgba(24, 35, 31, .055);
}

body {
  background: var(--mavir-paper);
  color: var(--mavir-ink);
}

/* Keep login dark and intentional */
.login-screen {
  color-scheme: dark;
  --bg: #091713;
  --panel: #0e211c;
  --panel-2: #142a24;
  --line: #294038;
  --line-soft: #1b332c;
  --text: #edf4f1;
  --muted: #91a39d;
  --accent: #e0ad32;
  --accent-soft: rgba(224,173,50,.12);
  background: #091713;
  color: #edf4f1;
}
.login-panel { background: #0b1714; }
.login-card input { background: #0d1d18; color: #fff; }
.login-card .button.primary { background: #dca832; border-color: #dca832; color: #10241f; }

.app-shell { grid-template-columns: 224px 1fr; background: var(--mavir-paper); }

/* Sidebar */
.sidebar {
  padding: 16px 10px 14px;
  background: var(--mavir-deep);
  border-right: 0;
  color: #eef6f2;
}
.sidebar-brand { padding: 0 5px 20px; gap: 10px; }
.sidebar-brand .brand-mark.small {
  width: 36px; height: 36px; border-radius: 11px;
  background: #dfac32;
  color: #17342d;
  box-shadow: none;
}
.sidebar-brand strong {
  color: #fff;
  font-size: 13px;
  letter-spacing: .18em;
}
.sidebar-brand span {
  color: #8fa8a0;
  margin-top: 3px;
  font-size: 9px;
  letter-spacing: .13em;
}
.nav-label {
  padding: 14px 7px 6px;
  color: #627f76;
  font-size: 8px;
  letter-spacing: .18em;
}
nav { gap: 2px; }
.nav-item {
  grid-template-columns: 23px 1fr auto;
  min-height: 38px;
  gap: 7px;
  padding: 8px 10px;
  border-radius: 12px;
  color: #c7d7d2;
}
.nav-item i { font-size: 15px; color: #bfd1cb; }
.nav-item span { font-size: 11px; font-weight: 600; }
.nav-item:hover { background: rgba(255,255,255,.055); color: #fff; }
.nav-item.active {
  background: rgba(255,255,255,.105);
  color: #fff;
}
.nav-item.active i { color: #fff; }
.nav-item b {
  padding: 0;
  background: transparent;
  color: #18d298;
  font-size: 0;
}
.nav-item b::after {
  content: "";
  display: block;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: #18d298;
}
.sidebar-foot { padding: 12px 0 0; border-top: 0; }
.integration-card {
  margin: 0 0 12px;
  padding: 10px;
  border: 1px solid #799087;
  border-radius: 14px;
  color: #dce8e4;
  font-size: 9px;
}
.integration-card > span { display: block; margin-bottom: 8px; }
.integration-card > div { display: flex; flex-wrap: wrap; gap: 5px; }
.integration-card b {
  padding: 4px 7px;
  border: 1px solid #83988f;
  border-radius: 999px;
  color: #bcd0ca;
  font-size: 8px;
  font-weight: 600;
}
.server-dot { padding: 0 6px; color: #7f9d93; font-size: 9px; }
.server-dot span { width: 6px; height: 6px; box-shadow: none; }
.app-version { padding: 0 6px; color: #58786d; font-size: 8px; }

/* Light application chrome */
.main-area { background: var(--mavir-paper); color: var(--mavir-ink); }
.topbar {
  height: 64px;
  padding: 0 22px;
  background: rgba(244,241,233,.97);
  border-bottom: 1px solid #dcd8ce;
}
.topbar-copy { display: flex; flex-direction: column; justify-content: center; }
.topbar-kicker {
  color: #8a7756;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.topbar h2 { margin-top: 3px; color: #1b2522; font-size: 16px; letter-spacing: -.02em; }
.topbar p { display: none; }
.topbar-actions { display: flex; align-items: center; gap: 10px; }
.system-pill {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 5px 8px;
  border: 1px solid #cfe3d8;
  border-radius: 999px;
  background: #edf8f2;
  color: #16835f;
  font-size: 8px;
  font-weight: 700;
}
.system-pill i { width: 5px; height: 5px; border-radius: 50%; background: #19b581; }
.user-menu {
  padding: 5px 8px 5px 6px;
  border: 1px solid #dcd8cf;
  border-radius: 14px;
  background: rgba(255,255,255,.56);
}
.user-avatar {
  width: 29px; height: 29px;
  border-radius: 10px;
  background: var(--mavir-deep);
  color: #fff;
  font-size: 10px;
}
.user-menu strong { color: #28312f; font-size: 9px; }
.user-menu span { color: #79827f; font-size: 8px; }
.icon-button {
  width: 30px; height: 30px;
  border-color: #d8d3c9;
  background: rgba(255,255,255,.45);
  color: #65716d;
}
.icon-button:hover { background: #fff; color: #23332f; }

.content { padding: 24px 24px 50px; }

/* Generic light treatment for existing business views */
.page-actions .copy h3,
.panel-head h3,
.section-title h3,
.recipe-card h4,
.modal h3 { color: #1d2825; }
.page-actions .copy p,
.panel-head span,
.section-title span,
.muted { color: var(--muted); }

.panel,
.table-wrap,
.recipe-card,
.version-card,
.journal-filters,
.batch-bottom-grid > section {
  background: var(--mavir-card);
  border-color: var(--line);
  box-shadow: var(--mavir-shadow);
}
.panel-head { border-color: var(--line-soft); }
table { background: var(--mavir-card); }
th { background: #f0ede5; color: #7a817d; }
td { border-color: #ebe6dc; color: #28332f; }
tbody tr:hover { background: #f7f4ed; }

input, select, textarea {
  border-color: #d8d3c9;
  background: #fffdf9;
  color: #26312e;
}
label { color: #6e7773; }

.button {
  border-color: #d9d4ca;
  background: #f6f3ec;
  color: #26312e;
}
.button:hover { background: #eeeae0; }
.button.primary { background: var(--mavir-deep); border-color: var(--mavir-deep); color: #fff; }
.button.primary:hover { background: #17483f; }

.modal-backdrop { background: rgba(12,27,23,.48); }
.modal {
  background: #fbfaf6;
  color: #23302c;
  border-color: #d9d4c9;
  box-shadow: 0 28px 90px rgba(28,43,38,.22);
}
.modal > header,
.form-footer { border-color: #e4dfd5; }

.settings-tabs,
.display-switch { background: #eeebe3; border-color: #dad5cb; }
.settings-tab.active,
.display-switch button.active { background: #fff; color: var(--mavir-deep); }

/* Keep operator / wall display dark */
.operator-console,
.wall-display,
body.production-kiosk,
body.production-kiosk .main-area,
body.production-kiosk .content {
  color-scheme: dark;
}

/* ========= DASHBOARD ========= */
.dashboard-v1 { max-width: 1400px; margin: 0 auto; }
.dashboard-intro {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 24px;
  margin-bottom: 17px;
}
.dashboard-intro .kicker {
  color: #b07b19;
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.dashboard-intro p {
  max-width: 640px;
  margin: 7px 0 0;
  color: #687570;
  font-size: 11px;
  line-height: 1.65;
}
.dashboard-line-button {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 9px 12px;
  border: 0;
  border-radius: 11px;
  background: var(--mavir-deep);
  color: #fff;
  font-size: 10px;
  font-weight: 750;
  cursor: pointer;
}
.dashboard-role-switch {
  display: inline-flex; gap: 3px;
  margin-bottom: 18px;
  padding: 3px;
  border: 1px solid #ded9cf;
  border-radius: 999px;
  background: #f8f6f0;
  box-shadow: 0 2px 8px rgba(26,38,34,.035);
}
.dashboard-role-switch button {
  padding: 5px 13px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #7b837f;
  font-size: 9px;
  cursor: pointer;
}
.dashboard-role-switch button.active {
  background: #fff;
  color: #23312d;
  box-shadow: 0 1px 3px rgba(20,30,27,.10);
}
.dashboard-kpis {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 13px;
  margin-bottom: 16px;
}
.dashboard-kpi {
  min-height: 148px;
  padding: 17px;
  border: 1px solid #dcd8cf;
  border-radius: 16px;
  background: rgba(255,255,255,.65);
  box-shadow: var(--mavir-shadow);
}
.dashboard-kpi .label {
  color: #69736f;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.dashboard-kpi .ico {
  width: 27px; height: 27px;
  display: grid; place-items: center;
  margin: 9px 0 12px;
  border-radius: 50%;
  font-size: 13px;
}
.dashboard-kpi .ico.green { background: #ebf8f1; color: #16976e; }
.dashboard-kpi .ico.gold { background: #fff5dd; color: #cc8c11; }
.dashboard-kpi .ico.blue { background: #eaf5fc; color: #2688c8; }
.dashboard-kpi .ico.red { background: #fff0f1; color: #d94e57; }
.dashboard-kpi strong {
  color: #14211e;
  font-size: 27px;
  line-height: 1;
  letter-spacing: -.035em;
}
.dashboard-kpi strong small {
  margin-left: 3px;
  color: #54625d;
  font-size: 10px;
  font-weight: 600;
}
.dashboard-kpi .hint {
  margin-top: 8px;
  color: #697670;
  font-size: 8px;
}
.dashboard-kpi .hint b { color: #188964; }

.dashboard-main-grid {
  display: grid;
  grid-template-columns: minmax(0,1.72fr) minmax(320px,.93fr);
  gap: 16px;
  margin-bottom: 16px;
}
.dashboard-card {
  border: 1px solid #dcd8cf;
  border-radius: 16px;
  background: rgba(255,255,255,.68);
  box-shadow: var(--mavir-shadow);
}
.chart-card { min-height: 355px; padding: 18px 19px 13px; }
.card-title { margin: 0; color: #1d2925; font-size: 12px; }
.card-subtitle { margin-top: 3px; color: #7a837f; font-size: 8px; }
.chart-badge {
  display: inline-flex;
  margin-top: 7px;
  padding: 3px 7px;
  border: 1px solid #ddd7cc;
  border-radius: 999px;
  background: #fff;
  color: #3d4945;
  font-size: 8px;
}
.production-chart {
  width: 100%;
  height: 250px;
  margin-top: 5px;
  overflow: visible;
}
.production-chart text { font-family: inherit; fill: #7c8682; font-size: 8px; }
.production-chart .grid { stroke: #dedbd2; stroke-dasharray: 3 4; stroke-width: 1; }
.production-chart .plan { fill: none; stroke: #d7951a; stroke-width: 1.6; stroke-dasharray: 4 4; }
.production-chart .fact { fill: none; stroke: #0f6554; stroke-width: 2.2; }
.production-chart .area { fill: url(#areaFill); opacity: .64; }

.line-card {
  min-height: 355px;
  padding: 20px;
  background: #153f37;
  color: #fff;
}
.line-card .line-kicker {
  color: #d3a139;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .14em;
}
.line-card h3 { margin: 8px 0 0; font-size: 16px; }
.line-status {
  display: inline-flex; align-items: center; gap: 6px;
  width: 100%;
  margin: 8px 0 18px;
  padding: 7px 10px;
  border-radius: 999px;
  background: #0e6a56;
  color: #baf1de;
  font-size: 8px;
}
.line-status::before { content:""; width:5px; height:5px; border-radius:50%; background:#2ce1a4; }
.current-process {
  padding: 17px;
  border: 1px solid #b5cac3;
  border-radius: 14px;
  background: rgba(255,255,255,.045);
}
.current-process .step-label {
  color: #83aaa0;
  font-size: 8px;
  font-weight: 750;
  letter-spacing: .14em;
}
.current-process h4 { margin: 11px 0 4px; font-size: 14px; }
.current-process p { margin: 0; color: #a8c0b9; font-size: 9px; }
.current-process .timer {
  display: flex; align-items: end; justify-content: space-between;
  margin-top: 20px;
}
.current-process .timer strong {
  font-family: ui-monospace,SFMono-Regular,Consolas,monospace;
  font-size: 27px;
  letter-spacing: -.04em;
}
.current-process .timer span { color: #83a69d; font-size: 8px; }
.line-progress {
  height: 7px;
  margin-top: 10px;
  overflow: hidden;
  border-radius: 99px;
  background: rgba(255,255,255,.13);
}
.line-progress i { display:block; width:66%; height:100%; background:#e2ad37; }
.line-meta {
  display:grid;
  grid-template-columns:1fr auto;
  gap:7px 12px;
  margin-top:17px;
  font-size:9px;
}
.line-meta span { color:#7fa69b; }
.line-meta b { color:#fff; text-align:right; }

.dashboard-bottom-grid {
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:16px;
}
.dashboard-bottom-grid .dashboard-card { min-height: 245px; padding: 18px; }
.dashboard-bottom-grid header {
  display:flex; align-items:flex-start; justify-content:space-between; gap:16px;
  margin-bottom:12px;
}
.dashboard-bottom-grid header h3 { margin:0 0 3px; font-size:12px; }
.dashboard-bottom-grid header span { color:#7a837f; font-size:8px; }

.attention-list { display:grid; gap:9px; margin-top:22px; }
.attention-item {
  display:grid;
  grid-template-columns: 33px 1fr auto;
  gap:11px;
  align-items:center;
  padding:11px;
  border:1px solid #e0d9cd;
  border-radius:13px;
}
.attention-item.red { background:#fff8f8; }
.attention-item.gold { background:#fffbf0; }
.attention-item .icon {
  width:30px; height:30px;
  display:grid; place-items:center;
  border-radius:50%;
  font-size:13px;
}
.attention-item.red .icon { background:#ffe9ea; color:#d84851; }
.attention-item.gold .icon { background:#fff0cd; color:#c6820d; }
.attention-item strong { display:block; font-size:10px; color:#202c28; }
.attention-item small { display:block; margin-top:3px; color:#76807c; font-size:8px; }
.mini-badge {
  padding:4px 7px;
  border:1px solid currentColor;
  border-radius:999px;
  font-size:8px;
}
.mini-badge.red { color:#d84a52; background:#fff; }
.mini-badge.gold { color:#bd790d; background:#fffdf8; }

.queue-count {
  padding:4px 7px;
  border:1px solid #dcd7cd;
  border-radius:999px;
  color:#46514d !important;
  background:#fff;
}
.queue-list { display:grid; gap:0; margin-top:8px; }
.queue-row {
  display:grid;
  grid-template-columns: 52px 1fr auto;
  gap:10px;
  align-items:center;
  padding:12px 5px;
}
.queue-row + .queue-row { border-top:1px solid #eee9df; }
.queue-row time {
  color:#17231f;
  font-family:ui-monospace,SFMono-Regular,Consolas,monospace;
  font-size:10px;
  font-weight:800;
}
.queue-row strong { display:block; color:#1e2b27; font-size:10px; }
.queue-row small { display:block; margin-top:2px; color:#7a837f; font-size:8px; }
.queue-status {
  padding:4px 7px;
  border:1px solid;
  border-radius:999px;
  background:#fff;
  font-size:8px;
}
.queue-status.green { border-color:#b9decf; color:#178862; background:#f0faf5; }
.queue-status.blue { border-color:#c7dff1; color:#247bb5; background:#f2f9fd; }
.queue-status.gold { border-color:#ead5a8; color:#aa741b; background:#fffaf0; }

@media (max-width: 1100px) {
  .dashboard-main-grid { grid-template-columns: 1fr; }
  .line-card { min-height: auto; }
}
@media (max-width: 900px) {
  .dashboard-kpis { grid-template-columns: repeat(2,1fr); }
  .dashboard-bottom-grid { grid-template-columns:1fr; }
  .system-pill { display:none; }
}
@media (max-width: 780px) {
  .app-shell { grid-template-columns:72px 1fr; }
  .topbar-actions .user-menu { border:0; background:transparent; padding:0; }
  .content { padding:18px; }
  .dashboard-intro { flex-direction:column; }
}
@media (max-width: 560px) {
  .dashboard-kpis { grid-template-columns:1fr; }
  .dashboard-main-grid { grid-template-columns:1fr; }
  .chart-card { padding:14px; }
}

/* ========= v1.1 — contrast, logo, typography ========= */

/* SVG brand: place web/assets/mavir-production.svg */
.sidebar-brand {
  min-height: 48px;
  padding: 2px 7px 20px;
  justify-content: flex-start;
}
.sidebar-logo {
  display: block;
  width: 190px;
  max-width: 100%;
  height: 50px;
  object-fit: contain;
  object-position: left center;
}

/* Sidebar was intentionally too compact in v1; make it readable at arm's length. */
.nav-label {
  padding: 16px 9px 7px;
  font-size: 9.5px;
  line-height: 1.2;
}
.nav-item {
  min-height: 43px;
  padding: 10px 11px;
  border-radius: 12px;
}
.nav-item i {
  font-size: 17px;
}
.nav-item span {
  font-size: 13px;
  line-height: 1.25;
  font-weight: 620;
}
.integration-card {
  font-size: 10px;
}
.integration-card b {
  font-size: 9px;
}
.server-dot {
  font-size: 10px;
}
.app-version {
  font-size: 9px;
}

/* Slightly larger application copy without making controls bulky. */
.topbar-kicker {
  font-size: 9px;
}
.topbar h2 {
  font-size: 17px;
}
.user-menu strong {
  font-size: 10px;
}
.user-menu span {
  font-size: 9px;
}
.page-actions .copy h3 {
  font-size: 21px;
}
.page-actions .copy p,
.section-title span,
.panel-head span {
  font-size: 13px;
}
.button {
  font-size: 13px;
}
table td {
  font-size: 13.5px;
}
table th {
  font-size: 10.5px;
}

/* Warehouse and legacy KPI cards:
   v1 inherited the old dark card background while text became light-theme dark.
   Force these cards into the light workspace palette. */
.metric-card {
  background: var(--mavir-card);
  border-color: var(--line);
  box-shadow: var(--mavir-shadow);
}
.metric-card .metric-head {
  color: #687570;
}
.metric-card .metric-icon {
  background: #eaf7f1;
  color: var(--accent);
}
.metric-card strong {
  color: #17211f;
}
.metric-card small {
  color: #697570;
}
.metric-card .muted {
  color: #697570;
}

/* A little more contrast for warehouse KPI helper/status text. */
.warehouse-metrics .metric-card strong,
.warehouse-metrics .metric-card .metric-head,
.warehouse-metrics .metric-card small {
  opacity: 1;
}

/* Keep compact sidebar behaviour on tablets/phones while still showing the mark. */
@media (max-width: 780px) {
  .sidebar-brand {
    justify-content: center;
    padding: 0 0 20px;
  }
  .sidebar-logo {
    width: 42px;
    height: 42px;
    object-fit: contain;
    object-position: center;
  }
}

/* ========= v1.4 — совместимость с ядром 0.6.5 ========= */

.component-row,
.supply-item-row,
.historical-component-row,
.batch-facts > div,
.batch-bottom-grid > section,
.attachment-row,
.profile-photo-panel,
.section-access label,
.touch-check-list label,
.process-step-row,
.tech-route > div {
  border-color: #e2ddd3;
  background: #fffdf9;
  color: #26312e;
}

.process-step-row {
  border-color: rgba(21, 149, 111, .25);
}

.process-order {
  background: #efebe2;
}

.process-order button {
  color: #67736f;
}

.process-confirm,
.section-access,
.touch-check-list,
.brand-preview {
  border-color: #ddd8ce;
}

.profile-photo-panel,
.branding-grid .panel,
.trash-grid .panel {
  box-shadow: var(--mavir-shadow);
}

.role-preview {
  border-color: rgba(49, 136, 201, .22);
  background: rgba(49, 136, 201, .07);
  color: #246b9d;
}

.status.archived,
.status.inactive,
.result-badge.not_evaluated {
  background: #ebe8e0;
  color: #66716d;
}

.archive-warning {
  border-color: rgba(132, 92, 193, .25);
  background: rgba(132, 92, 193, .07);
  color: #62438f;
}

.settings-tab,
.display-switch button {
  color: #65716d;
}

.branding-grid code,
.brand-preview code,
.code {
  color: #167b5e;
}

/* Крупная типографика пользователя сохраняется и на реальном дашборде 0.6.5. */
.ops-dashboard {
  font-size: 15px;
}

.ops-kpi strong {
  font-size: clamp(32px, 2.35vw, 42px);
}

.ops-kpi > span,
.ops-kpi small,
.ops-card header span,
.ops-attention span,
.ops-queue span,
.ops-footnote {
  font-size: 11px;
}

.ops-card header h3,
.ops-attention strong,
.ops-queue strong {
  font-size: 14px;
}

.ops-line-card > h3 {
  font-size: 23px;
}

@media (max-width: 780px) {
  .sidebar-logo {
    width: 42px;
    height: 42px;
    object-fit: cover;
    object-position: left;
  }
}

/* ========= v1.2 — Operator console dark theme =========
   Management stays light; operator workplace / line display stay intentionally dark. */

.operator-console,
.wall-display,
body.production-kiosk,
body.production-kiosk .main-area,
body.production-kiosk .content {
  --op-bg: #08171d;
  --op-panel: #0e2027;
  --op-panel-2: #12272e;
  --op-line: #294047;
  --op-line-soft: #1c333a;
  --op-text: #f3f6f4;
  --op-muted: #8fa5a0;
  --op-green: #18a77e;
  --op-green-bright: #20c997;
  --op-gold: #d7a12b;
  --op-red: #f26b6b;

  background: var(--op-bg);
  color: var(--op-text);
}

/* Header / batch identity */
.operator-console .console-kicker,
.operator-console .console-head h2,
.operator-console .console-head h2 em,
.operator-console .console-head p {
  opacity: 1;
}
.operator-console .console-kicker {
  color: var(--op-green-bright);
}
.operator-console .console-head h2 {
  color: var(--op-text);
}
.operator-console .console-head h2 em {
  color: var(--op-green-bright);
}
.operator-console .console-head p {
  color: var(--op-muted);
}

/* Progress */
.operator-console .console-progress {
  color: var(--op-muted);
}
.operator-console .console-progress > div {
  background: #18313a;
}
.operator-console .console-progress i {
  background: linear-gradient(90deg, #149975, var(--op-green-bright));
}
.operator-console .console-progress b {
  color: #b8c9c4;
}

/* Current step */
.operator-console .current-step-card {
  border-color: rgba(32,201,151,.34);
  background:
    radial-gradient(circle at 100% 0, rgba(32,201,151,.09), transparent 42%),
    #0d1e23;
}
.operator-console .current-step-card.is-paused {
  border-color: rgba(215,161,43,.72);
  background:
    radial-gradient(circle at 100% 0, rgba(215,161,43,.10), transparent 42%),
    #17170f;
}
.operator-console .step-number {
  background: var(--op-green);
  color: #04130f;
}
.operator-console .step-main > span,
.operator-console .step-clock > span {
  color: #789890;
}
.operator-console .step-main h3 {
  color: var(--op-text);
}
.operator-console .step-main .dose {
  color: var(--op-green-bright);
}
.operator-console .step-main p {
  color: #b1c2bd;
}
.operator-console .step-clock strong {
  color: var(--op-text);
}
.operator-console .step-clock strong.overrun {
  color: var(--op-red);
}
.operator-console .step-clock small {
  color: #8da49e;
}
.operator-console .step-clock small b {
  color: #d7e1de;
}

/* Input area: intentionally light, unmistakably editable */
.operator-console .operator-entry label {
  color: #9eb1ab;
}
.operator-console .operator-entry input {
  min-height: 56px;
  border: 1px solid #cfcac0;
  background: #f5f3ed;
  color: #101917;
  font-size: 18px;
  font-weight: 750;
  box-shadow: none;
}
.operator-console .operator-entry input::placeholder {
  color: #6f7773;
  opacity: 1;
}
.operator-console .operator-entry input:focus {
  border-color: var(--op-green-bright);
  box-shadow: 0 0 0 3px rgba(32,201,151,.14);
}

/* Main operator buttons */
.operator-console .touch-button {
  min-height: 62px;
  border-color: #9ab0aa;
  background: #12252c;
  color: #f2f6f4;
}
.operator-console .touch-button:hover {
  background: #173039;
}
.operator-console .touch-button.primary {
  border-color: var(--op-green);
  background: var(--op-green);
  color: #04130f;
}
.operator-console .touch-button.primary:hover {
  background: #1db88d;
}
.operator-console .touch-button.pause {
  border-color: rgba(215,161,43,.65);
  background: rgba(215,161,43,.10);
  color: #f1c75f;
}
.operator-console .touch-button:disabled {
  border-color: #41575d;
  background: #102027;
  color: #62777b;
  opacity: 1;
}

/* Next step strip */
.operator-console .next-step {
  border: 1px solid var(--op-line-soft);
  background: #0d2027;
}
.operator-console .next-step > span {
  color: #78938c;
}
.operator-console .next-step strong {
  color: #dce7e3;
}
.operator-console .next-step b {
  color: #f0f5f3;
}

/* Step navigator */
.operator-console .step-strip > div {
  border-color: #40545a;
  background: #0b1a20;
  color: #9aada8;
}
.operator-console .step-strip > div.in_progress {
  border-color: rgba(32,201,151,.70);
  background: rgba(32,201,151,.11);
  color: var(--op-green-bright);
}
.operator-console .step-strip > div.completed {
  border-color: #3e5d55;
  background: #0d211d;
  color: #7faaa0;
}
.operator-console .step-strip i,
.operator-console .step-strip span {
  color: inherit;
}

/* Queue / waiting states inside operator workplace */
.operator-console .empty-console h2,
.operator-console .planned-batch strong {
  color: var(--op-text);
}
.operator-console .empty-console p,
.operator-console .planned-batch small {
  color: var(--op-muted);
}
.operator-console .planned-batch {
  border-color: var(--op-line);
  background: #0c1d23;
  color: var(--op-text);
}
.operator-console .planned-batch:hover {
  border-color: rgba(32,201,151,.65);
}
.operator-console .planned-batch b {
  color: var(--op-green-bright);
}

/* Status chips in operator zone */
.operator-console .status.in_progress,
.operator-console .status.completed,
.operator-console .status.posted {
  color: #4be0b3;
  background: rgba(32,201,151,.13);
}
.operator-console .status.paused,
.operator-console .status.warning {
  color: #f1c75f;
  background: rgba(215,161,43,.13);
}
.operator-console .status.cancelled {
  color: #ff8585;
  background: rgba(242,107,107,.12);
}

/* Fullscreen kiosk — no light-theme leakage */
body.production-kiosk {
  background: var(--op-bg);
  color: var(--op-text);
}
body.production-kiosk .operator-console {
  background: var(--op-bg);
}
body.production-kiosk .content {
  background: var(--op-bg);
}

/* Wall display remains darker than operator console */
.wall-display {
  background:
    radial-gradient(circle at 100% 0, rgba(32,201,151,.12), transparent 34%),
    #050d11;
}
.wall-display .wall-brand,
.wall-display .wall-step-number strong,
.wall-display .wall-current > div:nth-child(2) > p {
  color: var(--op-green-bright);
}
.wall-display .wall-product h2,
.wall-display .wall-current h3,
.wall-display .wall-timer strong,
.wall-display .wall-next strong {
  color: var(--op-text);
}
.wall-display .wall-product p,
.wall-display .wall-current > div:nth-child(2) > small,
.wall-display .wall-timer small,
.wall-display .wall-next span,
.wall-display > footer {
  color: var(--op-muted);
}
.wall-display .wall-next {
  border-color: var(--op-line-soft);
  background: rgba(255,255,255,.025);
}

/* Keep contrast on smaller touch screens */
@media (max-width: 780px) {
  .operator-console .step-main h3 {
    font-size: 22px;
  }
  .operator-console .step-main .dose {
    font-size: 32px;
  }
  .operator-console .touch-button {
    min-height: 66px;
    font-size: 16px;
  }
}

/* ========= v1.3 — Dashboard readability / typography scale ========= */

/* General dashboard scale */
.dashboard-v1 {
  max-width: 1500px;
}

.dashboard-intro {
  margin-bottom: 20px;
}

.dashboard-intro .kicker {
  font-size: 11px;
}

.dashboard-intro p {
  max-width: 760px;
  font-size: 14px;
  line-height: 1.55;
}

.dashboard-line-button {
  padding: 11px 15px;
  font-size: 12px;
}

.dashboard-role-switch {
  margin-bottom: 20px;
}

.dashboard-role-switch button {
  padding: 7px 15px;
  font-size: 11px;
}

/* KPI cards */
.dashboard-kpis {
  gap: 15px;
  margin-bottom: 18px;
}

.dashboard-kpi {
  min-height: 166px;
  padding: 20px;
}

.dashboard-kpi .label {
  font-size: 11px;
  letter-spacing: .12em;
}

.dashboard-kpi .ico {
  width: 31px;
  height: 31px;
  margin: 10px 0 14px;
  font-size: 15px;
}

.dashboard-kpi strong {
  font-size: 39px;
}

.dashboard-kpi strong small {
  margin-left: 5px;
  font-size: 13px;
}

.dashboard-kpi .hint {
  margin-top: 11px;
  font-size: 11px;
}

/* Main dashboard row */
.dashboard-main-grid {
  gap: 18px;
  margin-bottom: 18px;
}

.chart-card {
  min-height: 345px;
  padding: 20px 22px 14px;
}

.card-title {
  font-size: 17px;
}

.card-subtitle {
  margin-top: 4px;
  font-size: 11px;
}

.chart-badge {
  margin-top: 9px;
  padding: 4px 8px;
  font-size: 10px;
}

/* Chart: less dead area, more readable content */
.production-chart {
  height: 235px;
  margin-top: 8px;
}

.production-chart text {
  font-size: 11px;
}

.production-chart .grid {
  stroke-width: 1.1;
}

.production-chart .plan {
  stroke-width: 2;
}

.production-chart .fact {
  stroke-width: 2.6;
}

/* Active production card */
.line-card {
  min-height: 345px;
  padding: 22px;
}

.line-card .line-kicker {
  font-size: 10px;
}

.line-card h3 {
  margin-top: 9px;
  font-size: 20px;
}

.line-status {
  margin: 10px 0 18px;
  padding: 8px 11px;
  font-size: 10px;
}

.current-process {
  padding: 19px;
}

.current-process .step-label {
  font-size: 10px;
}

.current-process h4 {
  margin: 12px 0 5px;
  font-size: 18px;
}

.current-process p {
  font-size: 11px;
}

.current-process .timer {
  margin-top: 22px;
}

.current-process .timer strong {
  font-size: 36px;
}

.current-process .timer span {
  font-size: 10px;
}

.line-progress {
  height: 8px;
  margin-top: 12px;
}

.line-meta {
  margin-top: 19px;
  gap: 9px 14px;
  font-size: 11px;
}

/* Bottom dashboard panels */
.dashboard-bottom-grid {
  gap: 18px;
}

.dashboard-bottom-grid .dashboard-card {
  min-height: 255px;
  padding: 20px;
}

.dashboard-bottom-grid header {
  margin-bottom: 14px;
}

.dashboard-bottom-grid header h3 {
  margin-bottom: 4px;
  font-size: 16px;
}

.dashboard-bottom-grid header span {
  font-size: 11px;
}

.attention-list {
  gap: 10px;
  margin-top: 18px;
}

.attention-item {
  grid-template-columns: 38px 1fr auto;
  gap: 12px;
  padding: 13px;
}

.attention-item .icon {
  width: 34px;
  height: 34px;
  font-size: 15px;
}

.attention-item strong {
  font-size: 13px;
}

.attention-item small {
  margin-top: 4px;
  font-size: 11px;
}

.mini-badge {
  padding: 5px 8px;
  font-size: 10px;
}

.queue-count {
  padding: 5px 8px;
  font-size: 10px !important;
}

.queue-row {
  grid-template-columns: 60px 1fr auto;
  gap: 12px;
  padding: 14px 6px;
}

.queue-row time {
  font-size: 12px;
}

.queue-row strong {
  font-size: 13px;
}

.queue-row small {
  margin-top: 3px;
  font-size: 11px;
}

.queue-status {
  padding: 5px 8px;
  font-size: 10px;
}

/* Header readability */
.topbar-kicker {
  font-size: 10px;
}

.topbar h2 {
  font-size: 18px;
}

.system-pill {
  font-size: 10px;
}

.user-menu strong {
  font-size: 11px;
}

.user-menu span {
  font-size: 10px;
}

/* Readability floor for dashboard: avoid microscopic UI text */
.dashboard-v1 * {
  -webkit-font-smoothing: antialiased;
}

@media (min-width: 1500px) {
  .content {
    padding-left: 30px;
    padding-right: 30px;
  }

  .dashboard-v1 {
    max-width: none;
  }

  .dashboard-kpi strong {
    font-size: 42px;
  }

  .line-card h3 {
    font-size: 21px;
  }

  .current-process h4 {
    font-size: 19px;
  }
}

@media (max-width: 900px) {
  .dashboard-intro p {
    font-size: 13px;
  }

  .dashboard-kpi strong {
    font-size: 35px;
  }

  .production-chart {
    height: 220px;
  }
}