/* Operational design system. Loaded after legacy and feature styles. */
:root {
  --background: #f8fafc;
  --background-muted: #f1f5f9;
  --surface: #fff;
  --surface-alt: #fff;
  --text-primary: #0f172a;
  --text-secondary: #64748b;
  --text-support: #475569;
  --text-dark: #0f172a;
  --text-light: #64748b;
  --text: #0f172a;
  --muted: #64748b;
  --border: #e2e8f0;
  --primary: #0f4f55;
  --primary-dark: #083b40;
  --shadow: none;
  --shadow-card: none;
  --radius: 8px;
  --radius-lg: 10px;
}
.indicator-chart-placeholder { min-height: 240px; padding: 14px; }
.indicator-chart-placeholder svg { display: block; width: 100%; height: 180px; }
[data-indicator-source-state].table-panel { padding: 12px 14px; }
/* Text on light surfaces stays opaque; color alone defines its hierarchy. */
body { color: var(--text-primary); font-weight: 500; }
.app-shell .content :is(h1, h2, h3, h4, h5, h6),
.app-shell .topbar-title h1,
#modal-root :is(h1, h2, h3, h4, h5, h6),
.auth-card :is(h1, h2, h3), .registration-section h3 {
  color: var(--text-primary); font-weight: 700;
}
.app-shell :is(.metric-value, .kpi-value, .daily-summary-greeting, .profile-copy strong),
.app-shell .financial-metric > strong, .app-shell .dairy-overview-metric strong,
#modal-root .animal-profile-current-state strong { color: var(--text-primary); font-weight: 700; }
.app-shell :is(label, dt, .muted, .field-hint, .panel-title p, .profile-copy small),
#modal-root :is(dt, .muted, .field-hint),
.auth-card :is(.form-label, .auth-progress, .auth-card-header p, .auth-footer-text, .auth-footer-links) {
  color: var(--text-secondary); opacity: 1;
}
.app-shell .settings-panel .field label { color: var(--text-secondary); font-weight: 500; }
:is(input, textarea)::placeholder { color: var(--text-secondary); opacity: 1; }
.app-shell .insight-card.dismissed, .app-shell .insight-card-dismiss,
.app-shell .month-day.outside { opacity: 1; }
.app-shell .month-day.outside { background: #f8fafc; color: var(--text-secondary); border-style: dashed; }
.app-shell .insight-card.dismissed { border-style: dashed; }
.auth-card .form-input, .auth-card .form-input:focus { color: var(--text-primary); background: #fff; font-weight: 500; }
.auth-card .farm-selection-item { color: var(--text-primary); }
.auth-card .farm-selection-role { color: var(--text-secondary); font-size: .85em; }
.auth-card .verification-status p { color: var(--text-support); font-weight: 500; }
.app-shell :is(.kpi strong, .stat-card strong, .lot-card-head strong, .dashboard-empty strong, .data-empty strong),
#modal-root :is(.animal-profile-title h3, .animal-profile-event-heading strong) { color: var(--text-primary); font-weight: 700; }
.terms-modal :is(h3, h4) { color: var(--text-primary); font-weight: 700; }
.app-shell, .app-shell .main-area, .app-shell .content { background: var(--background); background-image: none; }
.app-shell .sidebar, .mobile-drawer { background: #103e43; background-image: none; box-shadow: none; }
.app-shell .sidebar-header { background: transparent; border-bottom: 1px solid rgba(255,255,255,.12); }
.sidebar .nav, .mobile-drawer .nav { padding-inline: 0; }
.sidebar .nav-button, .mobile-drawer .nav-button {
  min-height: 40px; margin: 0; padding: 9px 16px; border: 0; border-left: 3px solid transparent;
  border-radius: 0; background: transparent; color: rgba(255,255,255,.76); box-shadow: none; transform: none;
  font-size: 14px; font-weight: 500;
}
.sidebar .nav-button:hover, .mobile-drawer .nav-button:hover { background: rgba(255,255,255,.05); color: #fff; transform: none; }
.sidebar .nav-button.active, .mobile-drawer .nav-button.active {
  background: rgba(255,255,255,.08); color: #fff; border-left-color: #fff; box-shadow: none;
}
.sidebar .nav-button::before, .sidebar .nav-button::after { display: none; }
.sidebar .nav-icon, .mobile-drawer .nav-icon { background: none; color: inherit; border: 0; box-shadow: none; width: 22px; height: 22px; }
.sidebar .nav-button .nav-label, .sidebar .nav-button .nav-icon, .mobile-drawer .nav-button .nav-label, .mobile-drawer .nav-button .nav-icon { color: inherit; text-shadow: none; font-weight: 500; }
.sidebar .nav-section > summary { padding: 14px 19px 8px; color: rgba(255,255,255,.6); font-size: 11px; letter-spacing: .06em; }
.app-shell .sidebar-toggle { background: transparent; border: 1px solid rgba(255,255,255,.25); border-radius: 6px; box-shadow: none; }
.app-shell .topbar { background: #fff; background-image: none; box-shadow: none; border-bottom: 1px solid var(--border); backdrop-filter: none; }
.app-shell .topbar-title h1 { font-size: 24px; color: var(--text-primary); letter-spacing: -.02em; }
.app-shell .topbar-title p { font-size: 13px; color: var(--text-secondary); }
.app-shell .topbar-actions { background: #fff; box-shadow: none; border: 0; border-radius: 0; }
.app-shell :is(.topbar-select, .profile-button, .notification-button) { background-color: #fff; border: 1px solid var(--border); border-radius: 6px; box-shadow: none; }
.app-shell :is(#farm-filter, #period-filter) { padding-left: 12px; color: var(--text-primary); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='m1 1 5 5 5-5' fill='none' stroke='%2364748B' stroke-width='2'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 13px center; background-size: 10px; }
.app-shell :is(.profile-avatar, .profile-avatar-fallback) { background: #475569; background-image: none; border-radius: 6px; box-shadow: none; }
.app-shell :is(.page-header, .view-header, .section-header) { background: transparent; background-image: none; box-shadow: none; color: var(--text-primary); }
.app-shell .view :is(h2, h3) { color: var(--text-primary); }
.app-shell .daily-summary { background: var(--surface); background-image: none; color: var(--text-primary); border: 1px solid var(--border); border-radius: 10px; box-shadow: none; padding: clamp(16px, 2vw, 24px); }
.app-shell .daily-summary-greeting { font-size: clamp(24px, 2.1vw, 30px); line-height: 1.2; }
.app-shell :is(.daily-summary-subtitle, .daily-summary-empty, .daily-summary-farm) { color: var(--text-secondary); background: transparent; border: 0; border-radius: 0; padding: 0; font-size: 13px; }
.app-shell .daily-summary-farm { margin: 8px 0 0; font-weight: 500; }
.app-shell .daily-summary-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 8px 16px; margin: 12px 0 0; }
.app-shell .daily-summary-list li { color: #475569; font-size: 13px; }
.app-shell .daily-summary-list li::before { background: #94a3b8; }
.app-shell .daily-summary-list .dot { background: #64748b; }
.app-shell .daily-summary-list .dot.warning { background: #b45309; }
.app-shell .daily-summary-list .dot.error { background: #b91c1c; }
.app-shell :is(.view-toolbar, .pagination, .module-filter-panel) { background: #fff; background-image: none; border-color: var(--border); box-shadow: none; border-radius: 8px; }
.app-shell :is(.view-toolbar, .table-panel, .chart-panel, .dashboard-section-title)::before,
.app-shell :is(.view-toolbar, .table-panel, .chart-panel, .dashboard-section-title)::after { display: none; }
.app-shell .dashboard-section-title { color: var(--text-primary); font-weight: 700; padding-left: 0; font-size: 13px; }
.app-shell .empty-state { background: #fff; border: 1px solid var(--border); border-radius: 8px; }
.app-shell :is(.table-panel, .chart-panel, .metric-card, .kpi, .detail-panel, .module-insight, .insight-card, .financial-metric, .financial-chart, .iatf-module, .agenda-calendar-panel, .document-card) {
  background: #fff; background-image: none; border: 1px solid var(--border); border-radius: 8px; box-shadow: none;
}
.app-shell :is(.metric-card, .kpi, .module-insight)::before,
.app-shell :is(.metric-card, .kpi, .module-insight)::after { display: none; }
.app-shell :is(.metric-card, .kpi) { padding: 14px; min-height: 0; }
.app-shell .dashboard-view .dashboard-grid .metric-card { background: #fff; border: 1px solid var(--border); box-shadow: none; padding: 14px; gap: 10px; }
.app-shell :is(.metric-card, .kpi):hover { transform: none; box-shadow: none; }
.app-shell :is(.metric-value, .kpi-value) { color: var(--text-primary); font-size: 28px; font-weight: 700; }
.app-shell .dashboard-grid .metric-value { color: var(--text-primary); font-size: 28px; }
.app-shell :is(.metric-label, .metric-title, .metric-subtitle, .metric-card small, .kpi-label) { color: var(--text-secondary); font-size: 12px; }
.app-shell .metric-icon { background: transparent; color: #64748b; border: 0; box-shadow: none; }
.app-shell .metric-icon.error { color: #b91c1c; }
.app-shell .metric-icon.warning { color: #a16207; }
.app-shell .metric-icon.success { color: #15803d; }
.app-shell .dashboard-operation-card { background: #fff; border: 1px solid var(--border); border-radius: 8px; box-shadow: none; }
.app-shell .dashboard-operation-card .dashboard-operation-icon { background: transparent; color: #475569; box-shadow: none; }
.app-shell .dashboard-operations { background: #fff; background-image: none; box-shadow: none; border: 1px solid var(--border); border-radius: 8px; padding: 14px; }
.app-shell .dashboard-operations-grid { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 8px; }
.app-shell .dashboard-operation-card { padding: 10px; min-height: 64px; }
.app-shell .dashboard-operation-card strong { white-space: normal; font-size: 13px; }
.app-shell .dashboard-operations-heading > p { display: none; }
.app-shell .button, #modal-root .button { border-radius: 6px; box-shadow: none; background-image: none; min-height: 34px; font-size: 13px; }
.app-shell .button:hover, #modal-root .button:hover { transform: none; box-shadow: none; }
.app-shell .button:not(.primary):not(.danger), #modal-root .button:not(.primary):not(.danger) { background: #fff; color: var(--text-primary); border: 1px solid #cbd5e1; }
.app-shell .button.primary, #modal-root .button.primary { background: var(--primary); color: #fff; border: 1px solid var(--primary); }
.app-shell .button.primary:hover, #modal-root .button.primary:hover { background: var(--primary-dark); }
.app-shell .button.danger, #modal-root .button.danger { color: #b91c1c; background: #fff; border: 1px solid #cbd5e1; }
.app-shell .button:disabled, #modal-root .button:disabled { opacity: .45; cursor: not-allowed; }
.app-shell :is(.chip, .status-chip, .badge) { border-radius: 4px; box-shadow: none; background: #fff; border: 1px solid var(--border); }
.app-shell :is(button, a, summary, input, select):focus-visible, #modal-root :is(button, summary, input, select, textarea):focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }
.app-shell .table-scroll { overflow: auto; }
.app-shell .table-scroll table { display: table; width: 100%; border-collapse: collapse; }
.app-shell .table-scroll thead { display: table-header-group; }
.app-shell .table-scroll tbody { display: table-row-group; }
.app-shell .table-scroll tr { display: table-row; background: #fff; box-shadow: none; border: 0; }
.app-shell .table-scroll tr:hover { background: #f8fafc; }
.app-shell .table-scroll :is(th, td) { display: table-cell; padding: 6px 12px; height: 44px; border: 0; border-bottom: 1px solid var(--border); text-align: left; font-size: 13px; vertical-align: middle; white-space: nowrap; }
.app-shell .table-scroll th { color: var(--text-secondary); background: #f8fafc; font-size: 12px; font-weight: 600; }
.app-shell .table-scroll td::before { display: none; }
.app-shell .table-scroll .numeric { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.app-shell .table-scroll .actions-cell { text-align: right; width: 1%; white-space: nowrap; }
.app-shell .table-actions { flex-wrap: nowrap; gap: 6px; }
.app-shell .table-actions .button { min-height: 30px; height: 30px; padding-block: 4px; }
.row-actions-menu { position: fixed; inset: auto; left: 8px; top: 8px; margin: 0; width: 220px; max-width: calc(100vw - 16px); max-height: min(320px, calc(100dvh - 16px)); overflow-y: auto; padding: 4px; background: #fff; color: var(--text-primary); border: 1px solid #cbd5e1; border-radius: 6px; box-shadow: none; }
.app-shell .row-actions-menu .button { width: 100%; min-height: 36px; height: auto; justify-content: flex-start; padding: 8px; border: 0; text-align: left; white-space: normal; }
.app-shell .row-actions-menu:popover-open { display: grid; gap: 2px; }
.app-shell .row-actions-menu .button:hover:not(:disabled) { background: #f1f5f9; }
.row-actions-menu svg { width: 16px; height: 16px; flex-shrink: 0; }
.app-shell .row-actions-trigger { font-size: 22px; line-height: 1; }
.app-shell .module-insight-list { gap: 10px; }
.app-shell .module-insight { padding: 12px; border-left: 1px solid var(--border); }
.app-shell .module-insight-heading { color: var(--text-primary); font-size: 14px; }
.app-shell .module-insight-context { margin-top: 6px; font-size: 12px; }
.app-shell .module-insight-body { flex: 1; min-width: 0; }
.app-shell .module-insight .button.insight-link, #modal-root .module-insight .button.insight-link { display: block; width: fit-content; margin: 8px 0 0 auto; padding: 0; min-height: 28px; border: 0; border-radius: 0; background: transparent; color: var(--text-primary); font-size: 12px; text-decoration: underline; text-underline-offset: 3px; }
.app-shell .iatf-protocol-row { border: 0; border-bottom: 1px solid var(--border); border-radius: 0; padding: 8px 0; }
.app-shell .iatf-version-row { background: #fff; border-left: 2px solid var(--border); border-radius: 0; padding: 6px 12px; }
.app-shell .iatf-step-day { background: #fff; color: var(--text-primary); border: 1px solid var(--border); border-radius: 4px; }
#modal-root .modal { background: #fff; border: 1px solid var(--border); border-radius: 10px; box-shadow: none; }
#modal-root .modal-backdrop { background: rgba(15,23,42,.35); backdrop-filter: none; }
#modal-root :is(label, .field-hint) { color: #64748b; font-size: 13px; font-weight: 500; }
#modal-root :is(input, select, textarea) { border-color: #cbd5e1; border-radius: 6px; color: #0f172a; background-color: #fff; box-shadow: none; }
#modal-root :is(.modal-header, .modal-footer) { background: #fff; background-image: none; border-color: var(--border); box-shadow: none; }
#modal-root .modal-header h2 { color: var(--text-primary); font-size: 20px; }
#modal-root .modal-body { min-height: 0; overflow-y: auto; }
#modal-root [data-action="close-modal"], #modal-root [data-action="cancel-step-form"] { color: var(--text-primary); background: #fff; border: 1px solid #cbd5e1; box-shadow: none; }
#modal-root [data-action="close-modal"]::before { display: none; }
#modal-root :is(.modal-warning, .notice, .info-banner) { border: 1px solid var(--border); background: #f8fafc; background-image: none; border-radius: 6px; color: #475569; }
#toast-root .toast { background: #fff; border: 1px solid var(--border); border-left: 3px solid #64748b; border-radius: 8px; box-shadow: none; }
#toast-root .toast.success { border-left-color: #15803d; }
#toast-root .toast.error { border-left-color: #b91c1c; }
.app-shell .medicine-module-hero { background: transparent; border: 0; border-radius: 0; box-shadow: none; padding: 0 0 16px; color: #0f172a; }
.app-shell .medicine-module-hero::before, .app-shell .medicine-module-hero::after { display: none; }
.app-shell .medicine-module-hero h2 { color: var(--text-primary); }
.app-shell .medicine-module-hero :is(p, span) { color: var(--text-secondary); }
.app-shell .medicine-module-farm { background: transparent; border: 0; border-radius: 0; }
.app-shell :is(.medicine-catalog-panel, .medicine-search-bar, .medicine-search-controls) { background: #fff; border-color: var(--border); border-radius: 8px; box-shadow: none; }
.app-shell :is(.medicine-module-migration-banner, .iatf-module-migration-banner) { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 12px; background: #f8fafc; color: #475569; border: 1px solid var(--border); border-radius: 6px; }
.app-shell .medicine-stock-filter { display: flex; align-items: center; gap: 12px; margin: 12px 0; font-size: 13px; color: #64748b; }
.app-shell .medicine-catalog-table .medicine-product-row { border: 0; border-radius: 0; padding: 0; }
.app-shell .medicine-catalog-table .status-chip { white-space: nowrap; }
.app-shell .medicine-catalog-table .muted { font-size: 12px; color: #64748b; }
.app-shell .iatf-module-tabs { display: flex; gap: 20px; border: 0; border-bottom: 1px solid var(--border); background: #fff; border-radius: 0; box-shadow: none; padding: 0; }
.app-shell .iatf-module-tab { border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: transparent; color: #64748b; padding: 10px 0; font: inherit; font-size: 14px; cursor: pointer; }
.app-shell .iatf-module-tab[aria-selected="true"] { color: #0f172a; border-bottom-color: #0f4f55; font-weight: 600; }
.app-shell .iatf-application-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.app-shell .iatf-application-filters .button.active { border-color: #64748b; color: #0f172a; background: #fff; }
.app-shell .iatf-protocol-toggle { padding: 0; min-width: 0; gap: 8px; }
.app-shell .iatf-protocol-description { flex-basis: auto; font-size: 12px; }
.app-shell .iatf-version-list { gap: 0; }
.app-shell .iatf-version-row { border-bottom: 1px solid var(--border); }
.app-shell .document-library > .table-panel > h2 { margin: 0; padding: 12px; font-size: 15px; }
.app-shell .medicine-search-controls input { min-width: 0; min-height: 38px; padding: 8px 10px; border: 1px solid #cbd5e1; border-radius: 6px; color: #0f172a; font: inherit; font-size: 13px; }
.app-shell .medicine-catalog-toolbar h3 { color: #0f172a; font-size: 16px; }
.app-shell .medicine-catalog-toolbar, .app-shell .medicine-search-bar { padding: 14px; }
.app-shell .medicine-stock-filter { padding-inline: 14px; }
.app-shell .dairy-module { min-width: 0; }
.app-shell .dairy-module-body > *, .app-shell [data-dairy-grid] { min-width: 0; }
.app-shell :is(.dairy-section-nav, .dairy-subtabs) { gap: 20px; margin-inline: 0; padding: 0; background: #fff; border: 0; border-bottom: 1px solid var(--border); border-radius: 0; box-shadow: none; }
.app-shell :is(.dairy-section-tab, .dairy-subtab) { padding: 10px 0; color: #64748b; background: transparent; border: 0; border-bottom: 2px solid transparent; border-radius: 0; box-shadow: none; font-weight: 500; }
.app-shell :is(.dairy-section-tab, .dairy-subtab).active { color: #0f172a; background: transparent; border-bottom-color: #0f4f55; box-shadow: none; font-weight: 600; }
.app-shell :is(.dairy-section-tab, .dairy-subtab):hover { color: #0f172a; background: transparent; }
.app-shell .dairy-section-tab::before { display: none; }
.app-shell :is(.dairy-operational-overview, .dairy-toolbar, .dairy-table-wrap) { padding: 12px; background: #fff; border: 1px solid var(--border); border-radius: 8px; box-shadow: none; }
.app-shell .dairy-table-wrap { padding: 0; }
.app-shell .dairy-table .dairy-record-row[hidden] { display: none; }
.app-shell .dairy-filter-control { grid-template-columns: minmax(0, 1fr); gap: 4px; padding: 0; border: 0; border-radius: 0; box-shadow: none; background: transparent; }
.app-shell .dairy-filter-control > span, .app-shell .dairy-filter-control select { grid-column: 1; }
.app-shell .dairy-filter-control::before, .app-shell .dairy-filter-control::after { display: none; }
.app-shell .dairy-filter-control > span { color: #64748b; font-size: 12px; text-transform: none; }
.app-shell .dairy-overview-heading h3 { margin: 0; color: #0f172a; font-size: 14px; }
.app-shell .dairy-overview-metric { min-height: 72px; padding: 12px; background: #fff; border: 1px solid var(--border); border-radius: 8px; box-shadow: none; }
.app-shell .dairy-overview-metric::after { display: none; }
.app-shell .dairy-overview-metric strong { font-size: 28px; color: #0f172a; }
.app-shell .dairy-overview-metric span { font-size: 12px; font-weight: 500; color: #64748b; }
.app-shell .dairy-overview-insight { grid-template-columns: minmax(0, 1fr) auto; padding: 10px 12px; border: 1px solid var(--border); border-radius: 8px; background: #fff; }
.app-shell .dairy-overview-insight.error { border-left: 3px solid #b91c1c; }
.app-shell .dairy-overview-insight.warning { border-left: 3px solid #a16207; }
.app-shell .dairy-overview-insight summary { color: #64748b; font-size: 12px; cursor: pointer; }
.app-shell .dairy-overview-insight .button.dairy-insight-link { padding: 0; min-height: 28px; border: 0; background: transparent; color: var(--text-primary); text-decoration: underline; text-underline-offset: 3px; }
.app-shell .dairy-overview-clear { padding: 0; background: #fff; border: 0; color: #64748b; border-radius: 0; }
.app-shell .dairy-module .empty-state { min-height: 100px; background: #fff; border: 1px solid var(--border); border-radius: 8px; }
.app-shell .dairy-module :is(input, select) { border: 1px solid #cbd5e1; border-radius: 6px; background: #fff; color: #0f172a; min-height: 38px; font-size: 13px; padding: 8px; }
.app-shell .dairy-module :is(input, select, button, summary):focus-visible { outline: 2px solid #0f4f55; outline-offset: 3px; }
.app-shell .dairy-table tbody tr td, #modal-root .dairy-table tbody tr td { background: #fff; }
#modal-root .dairy-table-wrap { background: #fff; border: 1px solid var(--border); border-radius: 8px; box-shadow: none; overflow-x: auto; }
#modal-root .dairy-table { display: table; border-collapse: collapse; width: 100%; }
#modal-root .dairy-table :is(th, td) { display: table-cell; height: 44px; padding: 6px 12px; border-bottom: 1px solid var(--border); font-size: 13px; white-space: nowrap; }
#modal-root .dairy-table th { background: #f8fafc; color: #64748b; }
#modal-root .dairy-table tr { display: table-row; }
#modal-root .dairy-table td::before { display: none; }
#modal-root .dairy-table thead { display: table-header-group; }
#modal-root .dairy-table .numeric { text-align: right; font-variant-numeric: tabular-nums; }
#modal-root :is(.dairy-quarter-grid, .dairy-note, .dairy-blocker-list) { background: #fff; border: 1px solid var(--border); border-radius: 8px; box-shadow: none; color: #475569; }
#modal-root .dairy-quarter-cell { min-height: 72px; background: #fff; border: 1px solid var(--border); border-radius: 6px; box-shadow: none; }
#modal-root .dairy-quarter-selector-cell:has(input:checked) { background: #fff; border-color: #0f4f55; box-shadow: none; }
#modal-root .dairy-quarter-cell .dairy-quarter-badge { background: #fff; color: #475569; border: 1px solid var(--border); border-radius: 4px; }
#modal-root .dairy-blocker-list { border-left: 3px solid #b91c1c; }
@media (max-width: 760px) {
  .app-shell .table-scroll table { min-width: 640px; }
  .app-shell .topbar-title h1 { font-size: 22px; }
  .app-shell .dairy-overview-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
  .app-shell .dairy-overview-metric { padding: 8px; }
  .app-shell .dairy-overview-insight { grid-template-columns: minmax(0, 1fr); }
  .app-shell .dairy-insight-link { justify-self: end; }
  #modal-root .dairy-table { min-width: 600px; }
}