/* ── cultivOS Dashboard — Agricultural Precision Platform ── */

* { margin: 0; padding: 0; box-sizing: border-box; }

:root {
    --bg: #fafaf9;
    --surface: #ffffff;
    --text: #1a1a1a;
    --text-muted: #6b7280;
    --green: #16a34a;
    --green-light: #dcfce7;
    --green-dark: #14532d;
    --yellow: #d97706;
    --yellow-light: #fef3c7;
    --red: #dc2626;
    --red-light: #fee2e2;
    --blue: #2563eb;
    --blue-light: #dbeafe;
    --border: #e5e7eb;
    --accent: #16a34a;
    --radius: 12px;
}

body {
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
    background: var(--bg);
    color: var(--text);
    line-height: 1.6;
    overflow-x: hidden;
}

/* ── NAV ── */
nav {
    position: fixed; top: 0; width: 100%; z-index: 100;
    background: rgba(255,255,255,0.92); backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--border);
    padding: 0 24px;
}
.nav-inner {
    max-width: 1200px; margin: 0 auto;
    display: flex; align-items: center; justify-content: space-between;
    height: 56px;
}
.nav-logo {
    font-size: 1.4rem; font-weight: 800; color: var(--green-dark);
    text-decoration: none; letter-spacing: -0.5px;
}
.nav-logo span { color: var(--green); }
.nav-tabs {
    display: flex; gap: 4px; list-style: none;
}
.nav-tab {
    padding: 8px 16px; border: none; border-radius: 8px;
    cursor: pointer; font-size: 0.85rem; font-weight: 500;
    background: transparent; color: var(--text-muted);
    transition: all 0.2s;
}
.nav-tab:hover { background: var(--green-light); color: var(--green-dark); }
.nav-tab.active { background: var(--green); color: #fff; }

@media (max-width: 768px) {
    nav { padding: 0 12px; }
    .nav-inner { gap: 8px; }
    .nav-tabs {
        gap: 2px;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        flex-wrap: nowrap;
        max-width: 55vw;
    }
    .nav-tabs::-webkit-scrollbar { display: none; }
    .nav-tab { padding: 6px 10px; font-size: 0.75rem; white-space: nowrap; flex-shrink: 0; }
    .nav-user-info { font-size: 0.75rem; }
    .nav-username { display: none; }
}
@media (max-width: 480px) {
    .nav-logo { font-size: 1.1rem; }
    .nav-tabs { max-width: 50vw; }
    .nav-tab { padding: 5px 8px; font-size: 0.7rem; }
}

/* ── MAIN CONTAINER ── */
.dashboard {
    max-width: 1200px; margin: 0 auto;
    padding: 72px 16px 40px;
}
@media (max-width: 768px) {
    .dashboard { padding: 64px 12px 32px; }
    .dash-title { font-size: 1.2rem; }
    .stats-strip { grid-template-columns: repeat(2, 1fr); }
    .stat-value { font-size: 1.4rem; }
}
@media (max-width: 480px) {
    .stats-strip { grid-template-columns: 1fr; }
}

/* ── HEADER STRIP ── */
.dash-header {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 24px; flex-wrap: wrap; gap: 12px;
}
.dash-title {
    font-size: 1.5rem; font-weight: 800; letter-spacing: -0.5px;
}
.dash-subtitle {
    font-size: 0.85rem; color: var(--text-muted); margin-top: 2px;
}

/* ── STATS STRIP ── */
.stats-strip {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 12px; margin-bottom: 28px;
}
.stat-card {
    background: var(--surface); border: 1px solid var(--border);
    border-radius: var(--radius); padding: 16px; text-align: center;
    opacity: 0; transform: translateY(10px);
    animation: cultivFadeUp 0.4s ease forwards;
    transition: border-color 0.2s, transform 0.2s, box-shadow 0.2s;
}
.stat-card:hover { border-color: var(--green); transform: translateY(-2px); box-shadow: 0 4px 12px rgba(22,163,74,0.08); }
.stat-card:nth-child(1) { animation-delay: 0.05s; }
.stat-card:nth-child(2) { animation-delay: 0.1s; }
.stat-card:nth-child(3) { animation-delay: 0.15s; }
.stat-card:nth-child(4) { animation-delay: 0.2s; }
.stat-value {
    font-size: 1.8rem; font-weight: 800; color: var(--green-dark);
    font-variant-numeric: tabular-nums;
}
.stat-label {
    font-size: 0.7rem; color: var(--text-muted); margin-top: 2px;
    text-transform: uppercase; letter-spacing: 0.5px;
}

/* ── FARM CARDS ── */
.farm-grid {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 16px; margin-bottom: 28px;
}
.farm-card {
    background: var(--surface); border: 1px solid var(--border);
    border-radius: var(--radius); padding: 20px;
    cursor: pointer; transition: border-color 0.2s, box-shadow 0.2s;
}
.farm-card:hover {
    border-color: var(--green);
    box-shadow: 0 2px 12px rgba(22,163,74,0.1);
}
.farm-card-header {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 12px;
}
.farm-name {
    font-size: 1.1rem; font-weight: 700;
}
.farm-location {
    font-size: 0.8rem; color: var(--text-muted);
}
.farm-meta {
    display: flex; gap: 16px; font-size: 0.8rem; color: var(--text-muted);
    margin-top: 8px;
}
.farm-meta-item {
    display: flex; align-items: center; gap: 4px;
}

/* ── HEALTH BADGE ── */
.health-badge {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 4px 12px; border-radius: 20px;
    font-size: 0.85rem; font-weight: 700;
    font-variant-numeric: tabular-nums;
}
.health-badge.good { background: var(--green-light); color: var(--green-dark); }
.health-badge.warning { background: var(--yellow-light); color: #92400e; }
.health-badge.critical { background: var(--red-light); color: #991b1b; }
.health-badge.none { background: #f3f4f6; color: var(--text-muted); }

/* ── FIELD LIST (drill-down) ── */
.field-panel {
    background: var(--surface); border: 1px solid var(--border);
    border-radius: var(--radius); padding: 20px;
    margin-bottom: 28px;
}
.field-panel-header {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 16px;
}
.field-panel-title {
    font-size: 1.2rem; font-weight: 700;
}
.field-panel-back {
    padding: 6px 14px; border: 1px solid var(--border);
    border-radius: 8px; background: var(--surface); cursor: pointer;
    font-size: 0.8rem; font-weight: 500; color: var(--text-muted);
    transition: all 0.2s;
}
.field-panel-back:hover {
    border-color: var(--green); color: var(--green);
}
.field-panel-actions {
    display: flex; align-items: center; gap: 8px;
}
.export-csv-btn {
    padding: 6px 14px; border: 1px solid var(--border);
    border-radius: 8px; background: var(--surface); cursor: pointer;
    font-size: 0.8rem; font-weight: 600; color: var(--text-muted);
    transition: all 0.2s; white-space: nowrap;
}
.export-csv-btn:hover {
    border-color: var(--green); color: var(--green);
}
.export-csv-btn:disabled {
    opacity: 0.5; cursor: wait;
}

.field-list {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 12px;
}
.field-card {
    background: var(--bg); border: 1px solid var(--border);
    border-radius: 10px; padding: 16px;
    transition: border-color 0.2s, transform 0.2s, box-shadow 0.2s;
    cursor: pointer;
}
.field-card:hover { border-color: var(--green); transform: translateY(-2px); box-shadow: 0 4px 12px rgba(22,163,74,0.08); }
.field-card-header {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 8px;
}
.field-name { font-size: 0.95rem; font-weight: 600; }
.field-crop {
    font-size: 0.75rem; padding: 2px 8px; border-radius: 6px;
    background: var(--blue-light); color: var(--blue);
    font-weight: 600;
}
.field-stats {
    display: flex; gap: 16px; font-size: 0.8rem; color: var(--text-muted);
    margin-top: 8px;
}
.field-stat-label { font-size: 0.7rem; color: var(--text-muted); }
.field-stat-value { font-size: 0.9rem; font-weight: 600; color: var(--text); }

/* Health bar inside field card */
.health-bar {
    height: 6px; border-radius: 3px; background: #e5e7eb;
    margin-top: 10px; overflow: hidden;
}
.health-bar-fill {
    height: 100%; border-radius: 3px;
    transition: width 0.4s ease;
}
.health-bar-fill.good { background: var(--green); }
.health-bar-fill.warning { background: var(--yellow); }
.health-bar-fill.critical { background: var(--red); }

/* ── SPARKLINE ── */
.sparkline {
    display: inline-block; vertical-align: middle; margin-left: 6px;
}
.sparkline-improving { color: var(--green); }
.sparkline-stable { color: var(--yellow); }
.sparkline-declining { color: var(--red); }
.soil-sparkline {
    display: inline-block; vertical-align: middle; margin-left: 4px; opacity: 0.9;
}

/* ── EMPTY STATE ── */
.empty-state {
    text-align: center; padding: 60px 20px;
    color: var(--text-muted);
}
.empty-state-icon {
    font-size: 2.5rem; margin-bottom: 12px; opacity: 0.4;
}
.empty-state-title {
    font-size: 1.1rem; font-weight: 600; margin-bottom: 4px;
    color: var(--text);
}
.empty-state-text {
    font-size: 0.85rem; max-width: 400px; margin: 0 auto;
}

/* ── LOADING ── */
.loading {
    text-align: center; padding: 40px;
    color: var(--text-muted); font-size: 0.9rem;
}
.loading-spinner {
    width: 32px; height: 32px; border: 3px solid var(--border);
    border-top-color: var(--green); border-radius: 50%;
    animation: spin 0.8s linear infinite;
    margin: 0 auto 12px;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ── FARM OWNER ── */
.farm-owner {
    font-size: 0.75rem; color: var(--text-muted); margin-top: 8px;
    font-style: italic;
}

/* ── EXPANDED FIELD CARD (with brain data) ── */
.field-card-expanded {
    background: var(--bg); border: 1px solid var(--border);
    border-radius: 10px; padding: 20px;
    transition: border-color 0.2s;
}
.field-card-expanded:hover { border-color: var(--green); }

.field-section {
    margin-top: 16px; padding-top: 14px;
    border-top: 1px solid var(--border);
}
.field-section-title {
    font-size: 0.75rem; font-weight: 700; text-transform: uppercase;
    letter-spacing: 0.5px; color: var(--green); margin-bottom: 10px;
}

/* ── SOIL GRID ── */
.soil-grid {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
    gap: 8px;
}
.soil-item {
    display: flex; flex-direction: column; gap: 2px;
}
.soil-label {
    font-size: 0.65rem; color: var(--text-muted); text-transform: uppercase;
    letter-spacing: 0.3px;
}
.soil-value {
    font-size: 0.85rem; font-weight: 600;
}

/* ── TREATMENT CARD ── */
.treatment-card {
    background: var(--surface); border: 1px solid var(--border);
    border-radius: 8px; padding: 12px;
    font-size: 0.85rem;
}
.treatment-row {
    margin-bottom: 6px; line-height: 1.4;
}
.treatment-row:last-child { margin-bottom: 0; }
.urgency-inmediata { color: var(--red); font-weight: 700; }
.urgency-esta.semana, .urgency-esta\ semana { color: var(--yellow); font-weight: 600; }

/* ── ROTATION TIMELINE ── */
.rotation-timeline {
    display: flex; flex-direction: column; gap: 8px;
}
.rotation-season {
    display: flex; align-items: flex-start; gap: 12px;
}
.rotation-num {
    width: 28px; height: 28px; border-radius: 50%;
    background: var(--green-light); color: var(--green-dark);
    display: flex; align-items: center; justify-content: center;
    font-size: 0.8rem; font-weight: 700; flex-shrink: 0;
}
.rotation-crop {
    font-size: 0.9rem; font-weight: 600;
}
.rotation-reason {
    font-size: 0.75rem; color: var(--text-muted);
}
.rotation-current {
    margin-bottom: 10px; font-size: 0.9rem;
}
.rotation-label {
    color: var(--text-muted);
}
.rotation-value {
    font-weight: 600; text-transform: capitalize;
}
.rotation-purpose {
    font-size: 0.8rem; color: var(--green-dark); font-style: italic;
}
.rotation-meta {
    display: flex; gap: 8px; font-size: 0.75rem; margin-top: 2px;
}
.rotation-months {
    color: var(--text-muted);
}
.rotation-season-label {
    background: var(--green-light); color: var(--green-dark);
    padding: 1px 6px; border-radius: 4px; font-size: 0.7rem;
}

/* ── FERTILIZER CARDS ── */
.fert-card {
    background: var(--surface); border: 1px solid var(--border);
    border-radius: 10px; padding: 16px;
}
.fert-card:hover { border-color: var(--green); }
.fert-name {
    font-size: 1rem; font-weight: 700; color: var(--green-dark);
    margin-bottom: 6px;
}
.fert-desc {
    font-size: 0.85rem; color: var(--text-muted); margin-bottom: 10px;
    line-height: 1.4;
}
.fert-meta {
    font-size: 0.8rem; color: var(--text);
    display: flex; flex-direction: column; gap: 4px;
}

/* ── RESPONSIVE ── */
@media (max-width: 640px) {
    .dashboard { padding: 64px 12px 32px; }
    .dash-title { font-size: 1.2rem; }
    .farm-grid { grid-template-columns: 1fr; }
    .field-list { grid-template-columns: 1fr; }
    .stats-strip { grid-template-columns: repeat(2, 1fr); }
}

/* ════════════════════════════════════════════════════════════════
   FIELD DETAIL PAGE — /campo — Full Cerebro intelligence view
   ════════════════════════════════════════════════════════════════ */

.campo-header {
    display: flex; align-items: center; gap: 16px;
    margin-bottom: 24px;
}
.campo-download-btn {
    margin-left: auto;
    padding: 8px 18px; border: 1px solid var(--border);
    border-radius: 8px; background: var(--surface); cursor: pointer;
    font-size: 0.85rem; font-weight: 600; color: var(--text-muted);
    transition: all 0.2s; white-space: nowrap;
}
.campo-download-btn:hover {
    border-color: var(--green); color: var(--green);
}
.campo-download-btn:disabled {
    opacity: 0.5; cursor: wait;
}

.campo-grid {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 16px; margin-bottom: 28px;
}
@media (max-width: 768px) {
    .campo-grid { grid-template-columns: 1fr; }
    .campo-header { flex-direction: column; align-items: flex-start; gap: 8px; }
}

.campo-section {
    background: var(--surface); border: 1px solid var(--border);
    border-radius: var(--radius); padding: 20px;
    margin-bottom: 16px;
    opacity: 0; transform: translateY(10px);
    animation: cultivFadeUp 0.4s ease forwards;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.campo-section:hover { border-color: var(--green); box-shadow: 0 2px 12px rgba(22,163,74,0.06); }
.campo-grid .campo-section:nth-child(1) { animation-delay: 0.1s; }
.campo-grid .campo-section:nth-child(2) { animation-delay: 0.18s; }
.campo-grid .campo-section:nth-child(3) { animation-delay: 0.26s; }
.campo-grid .campo-section:nth-child(4) { animation-delay: 0.34s; }
.campo-grid .campo-section:nth-child(5) { animation-delay: 0.42s; }
.campo-grid .campo-section:nth-child(6) { animation-delay: 0.5s; }

.campo-section-title {
    font-size: 0.75rem; font-weight: 700; text-transform: uppercase;
    letter-spacing: 0.5px; color: var(--green); margin-bottom: 12px;
}
.campo-section-subtitle {
    font-size: 0.7rem; color: #888; margin-bottom: 8px;
}

.campo-select {
    font-size: 0.75rem; padding: 2px 8px; border-radius: 4px;
    border: 1px solid var(--border); background: var(--card-bg); color: var(--text);
    cursor: pointer;
}

.campo-section-body {
    font-size: 0.85rem;
}

.campo-chart-container {
    height: 220px; position: relative;
}

.campo-placeholder {
    text-align: center; padding: 20px;
    color: var(--text-muted); font-size: 0.85rem;
}

.campo-data-grid {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 10px;
}

.campo-data-item {
    display: flex; flex-direction: column; gap: 2px;
}

.campo-data-label {
    font-size: 0.65rem; color: var(--text-muted); text-transform: uppercase;
    letter-spacing: 0.3px;
}

.campo-data-value {
    font-size: 0.9rem; font-weight: 600; font-variant-numeric: tabular-nums;
}

.campo-zones { margin-top: 14px; }

.campo-zone-bar {
    display: flex; align-items: center; gap: 8px;
    margin-bottom: 4px;
}

.campo-zone-label {
    font-size: 0.7rem; color: var(--text-muted); min-width: 80px;
}

.campo-zone-track {
    flex: 1; height: 8px; border-radius: 4px;
    background: var(--border); overflow: hidden;
}

.campo-zone-fill {
    height: 100%; border-radius: 4px;
}

.zone-healthy, .zone-saludable { background: var(--green); }
.zone-moderate, .zone-moderado { background: #84cc16; }
.zone-stressed, .zone-estresado { background: var(--yellow); }
.zone-critical, .zone-critico { background: var(--red); }
.zone-dead, .zone-muerto { background: #6b7280; }

.campo-zone-pct {
    font-size: 0.7rem; font-weight: 600; min-width: 32px;
    text-align: right; font-variant-numeric: tabular-nums;
}

.campo-alert-badge {
    display: inline-block; padding: 4px 12px; border-radius: 6px;
    font-size: 0.8rem; font-weight: 700; margin-top: 10px;
}
.campo-alert-badge.critical { background: var(--red-light); color: #991b1b; }
.campo-alert-badge.warning { background: var(--yellow-light); color: #92400e; }

.campo-risk-desc {
    font-size: 0.85rem; color: var(--text-muted); margin-top: 10px;
    line-height: 1.5;
}

.campo-risk-recs { margin-top: 10px; }
.campo-risk-rec {
    font-size: 0.8rem; padding: 4px 0;
    border-bottom: 1px solid var(--border);
    color: var(--text);
}
.campo-risk-rec:last-child { border-bottom: none; }

/* Disease panel — expanded risk items */
.disease-risks-list { margin-top: 12px; }
.disease-riesgo-item {
    background: var(--bg); border: 1px solid var(--border);
    border-radius: 8px; padding: 12px; margin-bottom: 8px;
}
.disease-riesgo-header {
    display: flex; align-items: center; gap: 8px; margin-bottom: 6px;
}
.disease-riesgo-tipo {
    font-weight: 600; font-size: 0.9rem; color: var(--text);
    text-transform: capitalize;
}
.disease-organic-badge {
    font-size: 0.7rem; padding: 2px 8px; border-radius: 10px;
    background: var(--green-light, #065f46); color: #34d399;
    font-weight: 600;
}
.disease-riesgo-desc {
    font-size: 0.82rem; color: var(--text-muted); line-height: 1.4;
}
.disease-riesgo-rec {
    font-size: 0.82rem; color: var(--text); margin-top: 6px;
    padding-top: 6px; border-top: 1px solid var(--border);
}
.disease-weather-ctx {
    margin-top: 10px; font-size: 0.82rem; color: var(--text-muted);
    padding: 8px 12px; background: var(--bg); border-radius: 6px;
}
.disease-nota {
    margin-top: 8px; font-size: 0.8rem; color: var(--text-muted);
    font-style: italic;
}

.campo-treatment-card {
    background: var(--bg); border: 1px solid var(--border);
    border-radius: 8px; padding: 12px; margin-bottom: 8px;
}
.campo-treatment-card:last-child { margin-bottom: 0; }
.campo-treatment-card.treatment-applied {
    border-left: 3px solid var(--color-good);
    opacity: 0.85;
}
.treatment-applied-badge {
    display: inline-block; font-size: 0.7rem; font-weight: 600;
    color: var(--color-good); margin-bottom: 6px;
    text-transform: uppercase; letter-spacing: 0.03em;
}
.treatment-notes { font-size: 0.8rem; color: var(--text-muted); font-style: italic; }
.treatment-apply-section { margin-top: 8px; }
.treatment-apply-btn {
    background: transparent; border: 1px solid var(--accent);
    color: var(--accent); padding: 4px 12px; border-radius: 6px;
    font-size: 0.75rem; cursor: pointer; font-weight: 500;
}
.treatment-apply-btn:hover { background: var(--accent); color: var(--bg); }
.treatment-apply-form {
    margin-top: 8px; padding: 10px; background: var(--card-bg);
    border: 1px solid var(--border); border-radius: 6px;
}
.treatment-apply-form label {
    display: block; font-size: 0.8rem; margin-bottom: 6px; color: var(--text);
}
.treatment-apply-form input[type="date"],
.treatment-apply-form textarea {
    width: 100%; padding: 6px 8px; border: 1px solid var(--border);
    border-radius: 4px; background: var(--bg); color: var(--text);
    font-size: 0.8rem; margin-top: 2px; box-sizing: border-box;
}
.treatment-apply-actions {
    display: flex; gap: 8px; margin-top: 8px;
}
.treatment-confirm-btn {
    background: var(--accent); color: var(--bg); border: none;
    padding: 5px 14px; border-radius: 6px; font-size: 0.75rem;
    cursor: pointer; font-weight: 600;
}
.treatment-confirm-btn:hover { opacity: 0.9; }
.treatment-confirm-btn:disabled { opacity: 0.5; cursor: not-allowed; }
.treatment-cancel-btn {
    background: transparent; border: 1px solid var(--border);
    color: var(--text-muted); padding: 5px 14px; border-radius: 6px;
    font-size: 0.75rem; cursor: pointer;
}
.treatment-cancel-btn:hover { border-color: var(--text); color: var(--text); }
.campo-treatment-row { margin-bottom: 4px; line-height: 1.4; }

.campo-schedule { margin-top: 12px; }
.campo-schedule-day {
    display: flex; justify-content: space-between;
    padding: 6px 0; border-bottom: 1px solid var(--border);
    font-size: 0.8rem;
}
.campo-schedule-day:last-child { border-bottom: none; }
.campo-schedule-date { color: var(--text-muted); }
.campo-schedule-liters { font-weight: 600; font-variant-numeric: tabular-nums; }

/* ── TREATMENT HISTORY TIMELINE ── */
.treatment-timeline { display: flex; flex-direction: column; gap: 0; }
.treatment-timeline-item {
    display: flex; gap: 16px; padding: 12px 0;
    border-bottom: 1px solid var(--border);
}
.treatment-timeline-item:last-child { border-bottom: none; }
.treatment-timeline-date {
    min-width: 80px; font-size: 0.78rem; color: var(--text-muted);
    font-weight: 600; padding-top: 2px;
}
.treatment-timeline-body { flex: 1; }
.treatment-timeline-header {
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
    margin-bottom: 4px;
}
.treatment-timeline-detail { font-size: 0.85rem; line-height: 1.4; color: var(--text); }
.treatment-timeline-notes {
    font-size: 0.8rem; color: var(--text-muted); margin-top: 4px;
    font-style: italic;
}
.organic-badge {
    display: inline-block; font-size: 0.7rem; font-weight: 600;
    padding: 2px 8px; border-radius: 10px;
    background: #166534; color: #bbf7d0;
}

/* ── SOIL HISTORY TIMELINE ── */
.soil-timeline { display: flex; flex-direction: column; gap: 0; }
.soil-timeline-item {
    display: flex; gap: 16px; padding: 12px 0;
    border-bottom: 1px solid var(--border);
}
.soil-timeline-item:last-child { border-bottom: none; }
.soil-timeline-date {
    min-width: 80px; font-size: 0.78rem; color: var(--text-muted);
    font-weight: 600; padding-top: 2px;
}
.soil-timeline-body { flex: 1; }
.soil-timeline-header {
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
    cursor: pointer; user-select: none;
}
.soil-timeline-om { font-size: 0.82rem; color: var(--text-muted); }
.soil-timeline-texture { font-size: 0.82rem; color: var(--text-muted); font-style: italic; }
.soil-timeline-expand { font-size: 0.65rem; color: var(--text-muted); transition: transform 0.2s; }
.soil-timeline-detail {
    display: none; margin-top: 8px;
}
.soil-timeline-detail.open { display: block; }
.soil-timeline-rec {
    font-size: 0.82rem; color: var(--text); margin-top: 8px;
    padding: 6px 10px; border-left: 3px solid var(--accent, #00c896);
    background: rgba(255,255,255,0.03);
}
.soil-timeline-notes {
    font-size: 0.8rem; color: var(--text-muted); margin-top: 4px;
    font-style: italic;
}

/* ── SOIL ENTRY FORM ── */
.soil-entry-form {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 12px;
    padding: 16px 0;
}
.soil-form-field label {
    display: block;
    font-size: 0.8rem;
    color: var(--text-muted);
    margin-bottom: 4px;
    font-weight: 500;
}
.soil-form-field input,
.soil-form-field select,
.soil-form-field textarea {
    width: 100%;
    padding: 8px 10px;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: var(--surface);
    color: var(--text);
    font-size: 0.9rem;
    font-family: inherit;
}
.soil-form-field input:focus,
.soil-form-field select:focus,
.soil-form-field textarea:focus {
    outline: none;
    border-color: var(--green);
    box-shadow: 0 0 0 2px rgba(22, 163, 74, 0.15);
}
.soil-form-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 4px;
}
.soil-submit-btn {
    padding: 8px 20px;
    background: var(--green);
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s;
}
.soil-submit-btn:hover { background: var(--green-dark); }
.soil-submit-btn:disabled { opacity: 0.6; cursor: not-allowed; }
.soil-form-msg { font-size: 0.85rem; }
.soil-form-msg.success { color: var(--green); }
.soil-form-msg.error { color: var(--red); }

/* ── ANOMALY CARDS ── */
.anomaly-card {
    padding: 12px; border-bottom: 1px solid var(--border);
}
.anomaly-card:last-child { border-bottom: none; }
.anomaly-card-header {
    display: flex; align-items: center; gap: 8px; margin-bottom: 6px;
}
.anomaly-type { font-weight: 600; font-size: 0.9rem; }
.anomaly-card-detail {
    display: flex; align-items: center; gap: 12px; margin-bottom: 6px;
    font-size: 0.85rem;
}
.anomaly-metric { color: var(--text-muted); }
.anomaly-drop { font-weight: 700; color: var(--critical); }
.anomaly-card-rec {
    font-size: 0.82rem; line-height: 1.4; color: var(--text);
    background: var(--card-bg); padding: 8px 10px; border-radius: 6px;
    border-left: 3px solid var(--critical);
}
.anomaly-ndvi .anomaly-drop { color: var(--warning, #f59e0b); }
.anomaly-ndvi .anomaly-card-rec { border-left-color: var(--warning, #f59e0b); }

/* ── SEASONAL RISK ALERTS ── */
.seasonal-alerts-header {
    display: flex; align-items: center; gap: 0.75rem;
    margin-bottom: 0.75rem;
}
.seasonal-season-badge {
    background: var(--accent, #00c896); color: #000;
    padding: 0.2rem 0.6rem; border-radius: 4px;
    font-weight: 700; font-size: 0.8rem; text-transform: uppercase;
}
.seasonal-date { color: var(--text-muted, #888); font-size: 0.8rem; }
.seasonal-alerts-list { display: flex; flex-direction: column; gap: 0.5rem; }
.seasonal-alert-card {
    border-left: 3px solid var(--accent, #00c896);
    padding: 0.6rem 0.8rem; border-radius: 4px;
    background: rgba(255,255,255,0.03);
}
.seasonal-alert-card.seasonal-prep { border-left-color: var(--info, #4da6ff); }
.seasonal-alert-card.seasonal-siembra { border-left-color: var(--accent, #00c896); }
.seasonal-alert-card.seasonal-cosecha { border-left-color: var(--warning, #f59e0b); }
.seasonal-alert-card.seasonal-maint { border-left-color: var(--text-muted, #888); }
.seasonal-alert-top {
    display: flex; align-items: center; gap: 0.6rem;
    margin-bottom: 0.3rem; flex-wrap: wrap;
}
.seasonal-alert-crop { font-weight: 700; font-size: 0.9rem; }
.seasonal-alert-type {
    font-size: 0.75rem; padding: 0.1rem 0.4rem;
    border-radius: 3px; background: rgba(255,255,255,0.06);
    color: var(--text-muted, #888);
}
.seasonal-alert-months {
    font-size: 0.75rem; color: var(--text-muted, #888);
    margin-left: auto;
}
.seasonal-alert-message { font-size: 0.85rem; color: var(--text-secondary, #aaa); line-height: 1.4; }

/* ── REGIONAL CONTEXT CARD ── */
.regional-grid {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px; margin-bottom: 12px;
}
.regional-item {
    display: flex; flex-direction: column; gap: 2px;
    padding: 10px 12px; background: var(--surface-alt, #1a1a1a); border-radius: 8px;
}
.regional-label { font-size: 0.75rem; color: var(--muted); text-transform: uppercase; letter-spacing: 0.03em; }
.regional-value { font-size: 0.88rem; color: var(--text); }
.regional-notes {
    font-size: 0.82rem; color: var(--muted); padding: 8px 12px;
    border-left: 3px solid var(--green, #00c896); margin-bottom: 12px;
}
.regional-recs { margin-top: 10px; }
.regional-recs-title { font-size: 0.82rem; font-weight: 600; color: var(--text); margin-bottom: 8px; }
.regional-rec-item {
    padding: 10px 12px; margin-bottom: 8px;
    background: var(--surface-alt, #1a1a1a); border-radius: 8px;
    border-left: 3px solid var(--green, #00c896);
}
.regional-rec-header { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
.regional-rec-urgencia {
    font-size: 0.72rem; padding: 2px 8px; border-radius: 4px; font-weight: 600; text-transform: uppercase;
}
.urgencia-alta { background: var(--red-light, #fee2e2); color: #991b1b; }
.urgencia-media { background: var(--yellow-light, #fef3c7); color: #92400e; }
.urgencia-baja { background: var(--green-light, #dcfce7); color: var(--green-dark, #166534); }
.regional-rec-problema { font-size: 0.82rem; color: var(--text); font-weight: 500; }
.regional-rec-treatment { font-size: 0.82rem; color: var(--muted); margin-bottom: 4px; }
.regional-rec-context { font-size: 0.78rem; color: var(--muted); font-style: italic; }
.regional-rec-cost { font-size: 0.78rem; color: var(--green, #00c896); font-weight: 500; }

/* ── ACTION TIMELINE ── */
.timeline-weather {
    display: flex; gap: 12px; flex-wrap: wrap;
    margin-bottom: 14px; padding-bottom: 12px;
    border-bottom: 1px solid var(--border);
}
.timeline-weather-item {
    font-size: 0.8rem; color: var(--text-muted);
    font-weight: 500;
}
.timeline-rain {
    color: var(--blue); font-weight: 600;
}
.timeline-list {
    display: flex; flex-direction: column; gap: 10px;
}
.timeline-action {
    background: var(--surface); border: 1px solid var(--border);
    border-radius: 8px; padding: 12px;
    transition: border-color 0.2s;
}
.timeline-action:hover { border-color: var(--green); }
.timeline-action-header {
    display: flex; align-items: center; gap: 8px;
    margin-bottom: 6px;
}
.timeline-priority-badge {
    display: inline-block; padding: 2px 8px; border-radius: 4px;
    font-size: 0.7rem; font-weight: 700; text-transform: uppercase;
    letter-spacing: 0.3px;
}
.priority-alta { background: var(--red-light); color: #991b1b; }
.priority-media { background: var(--yellow-light); color: #92400e; }
.priority-baja { background: var(--green-light); color: var(--green-dark); }
.timeline-action-type {
    font-size: 0.75rem; color: var(--text-muted);
    text-transform: capitalize;
}
.timeline-action-desc {
    font-size: 0.85rem; color: var(--text); line-height: 1.5;
}
.timeline-weather-note {
    font-size: 0.8rem; color: var(--blue); margin-top: 6px;
    font-weight: 500;
}
.timeline-action-meta {
    font-size: 0.8rem; color: var(--text-muted); margin-top: 4px;
}

/* ── DATA COMPLETENESS WIDGET ── */
.completeness-header {
    display: flex; align-items: baseline; gap: 8px; margin-bottom: 12px;
}
.completeness-score {
    font-size: 1.6rem; font-weight: 700;
}
.completeness-good { color: var(--green); }
.completeness-warning { color: var(--yellow); }
.completeness-critical { color: var(--red); }
.completeness-label {
    font-size: 0.85rem; color: var(--text-muted);
}
.completeness-sensors {
    display: flex; flex-wrap: wrap; gap: 10px;
}
.completeness-sensor {
    display: flex; align-items: center; gap: 6px;
    padding: 6px 12px; border-radius: 8px;
    font-size: 0.85rem; font-weight: 500;
    background: var(--card-bg); border: 1px solid var(--border);
}
.completeness-dot {
    width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0;
}
.completeness-present .completeness-dot { background: var(--green); }
.completeness-missing .completeness-dot { background: var(--red); }
.completeness-missing { opacity: 0.6; }
.completeness-sensor-label { color: var(--text); }

/* ── CEREBRO INTELLIGENCE SUMMARY ── */
.cerebro-grid {
    display: flex; gap: 20px; align-items: flex-start;
}
.cerebro-hero {
    flex-shrink: 0; text-align: center;
}
.cerebro-score-wrap {
    display: flex; flex-direction: column; align-items: center; gap: 4px;
}
.cerebro-score {
    font-size: 2.2rem; font-weight: 800; line-height: 1;
    padding: 12px 20px; border-radius: 12px;
    font-variant-numeric: tabular-nums;
}
.cerebro-score-label {
    font-size: 0.7rem; text-transform: uppercase; font-weight: 600;
    color: var(--text-muted); letter-spacing: 0.3px;
}
.cerebro-trend-up { color: var(--green); }
.cerebro-trend-down { color: var(--red); }
.cerebro-trend-stable { color: var(--text-muted); }
.cerebro-badges {
    flex: 1; display: flex; flex-wrap: wrap; gap: 10px;
    align-content: flex-start;
}
.cerebro-badge {
    display: flex; flex-direction: column; gap: 2px;
    background: var(--bg); border: 1px solid var(--border);
    border-radius: 8px; padding: 8px 12px;
    min-width: 100px;
}
.cerebro-badge-label {
    font-size: 0.6rem; text-transform: uppercase; font-weight: 700;
    color: var(--text-muted); letter-spacing: 0.3px;
}
.cerebro-confidence {
    display: flex; align-items: center; gap: 6px; margin-top: 8px;
}
.cerebro-conf-label {
    font-size: 0.6rem; text-transform: uppercase; font-weight: 600;
    color: var(--text-muted); letter-spacing: 0.3px;
}
.cerebro-insights {
    margin-top: 14px; display: flex; flex-direction: column; gap: 8px;
    border-top: 1px solid var(--border); padding-top: 12px;
}
.cerebro-insight-item {
    display: flex; gap: 10px; align-items: baseline;
    padding: 8px 12px; border-radius: 8px;
    background: var(--bg); border: 1px solid var(--border);
}
.cerebro-insight-item.cerebro-risk {
    border-left: 3px solid var(--red);
}
.cerebro-insight-item.cerebro-action {
    border-left: 3px solid var(--blue, #3b82f6);
}
.cerebro-insight-label {
    font-size: 0.6rem; text-transform: uppercase; font-weight: 700;
    color: var(--text-muted); letter-spacing: 0.3px;
    white-space: nowrap; min-width: 120px;
}
.cerebro-insight-text {
    font-size: 0.85rem; color: var(--text);
}

/* -- CAMPO RESPONSIVE -- */
@media (max-width: 640px) {
    .campo-grid { grid-template-columns: 1fr; }
    .campo-data-grid { grid-template-columns: repeat(2, 1fr); }
    .campo-header { flex-direction: column; align-items: flex-start; }
    .cerebro-grid { flex-direction: column; }
    .cerebro-badges { gap: 8px; }
    .cerebro-insight-item { flex-direction: column; gap: 4px; }
    .cerebro-insight-label { min-width: unset; }
}

/* ════════════════════════════════════════════════════════════════
   INTELLIGENCE DASHBOARD — Dark theme, data-dense admin/researcher view
   ════════════════════════════════════════════════════════════════ */

.intel-body {
    --intel-bg: #0f1117;
    --intel-surface: #1a1d27;
    --intel-border: #2a2d3a;
    --intel-text: #e5e7eb;
    --intel-muted: #9ca3af;
    background: var(--intel-bg);
    color: var(--intel-text);
}

/* Nav override for dark */
.intel-body nav {
    background: rgba(15,17,23,0.95); backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--intel-border);
}
.intel-logo { color: #e5e7eb !important; }
.intel-logo span { color: var(--green) !important; }
.intel-tab {
    color: var(--intel-muted) !important; text-decoration: none;
    padding: 8px 16px; border-radius: 8px; font-size: 0.85rem; font-weight: 500;
}
.intel-tab:hover { background: rgba(22,163,74,0.15); color: #e5e7eb !important; }
.intel-tab.active { background: var(--green); color: #fff !important; }

/* Main layout */
.intel-dashboard {
    max-width: 1280px; margin: 0 auto;
    padding: 72px 16px 40px;
}
.intel-header {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 24px; flex-wrap: wrap; gap: 12px;
}
.intel-title {
    font-size: 1.5rem; font-weight: 800; letter-spacing: -0.5px;
    color: #f9fafb;
}
.intel-subtitle {
    font-size: 0.85rem; color: var(--intel-muted); margin-top: 2px;
}

/* Stats strip */
.intel-stats-strip {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 12px; margin-bottom: 24px;
}
.intel-stat {
    background: var(--intel-surface); border: 1px solid var(--intel-border);
    border-radius: 10px; padding: 16px; text-align: center;
    opacity: 0; transform: translateY(10px);
    animation: cultivFadeUp 0.4s ease forwards;
    transition: border-color 0.2s, transform 0.2s;
}
.intel-stat:hover { border-color: var(--green); transform: translateY(-2px); }
.intel-stat:nth-child(1) { animation-delay: 0.05s; }
.intel-stat:nth-child(2) { animation-delay: 0.1s; }
.intel-stat:nth-child(3) { animation-delay: 0.15s; }
.intel-stat:nth-child(4) { animation-delay: 0.2s; }
.intel-stat:nth-child(5) { animation-delay: 0.25s; }
.intel-stat:nth-child(6) { animation-delay: 0.3s; }
@keyframes cultivFadeUp { to { opacity: 1; transform: translateY(0); } }
.intel-stat-value {
    font-size: 1.6rem; font-weight: 800; color: #f9fafb;
    font-variant-numeric: tabular-nums;
}
.intel-stat-label {
    font-size: 0.7rem; color: var(--intel-muted); margin-top: 2px;
    text-transform: uppercase; letter-spacing: 0.5px;
}

/* Two-column grid */
.intel-grid {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
    gap: 16px; margin-bottom: 24px;
}
@media (max-width: 768px) {
    .intel-grid { grid-template-columns: 1fr; }
    .intel-dashboard { padding: 64px 12px 32px; }
    .intel-header { flex-direction: column; align-items: flex-start; gap: 12px; }
    .intel-title { font-size: 1.2rem; }
    .intel-stats-strip { grid-template-columns: repeat(2, 1fr); }
    .intel-stat-value { font-size: 1.3rem; }
}
@media (max-width: 480px) {
    .intel-stats-strip { grid-template-columns: 1fr; }
    .intel-panel-body { padding: 12px; }
    .intel-panel-header { padding: 10px 12px; }
}

/* Panel cards */
.intel-panel {
    background: var(--intel-surface); border: 1px solid var(--intel-border);
    border-radius: 10px; overflow: hidden;
    opacity: 0; transform: translateY(12px);
    animation: cultivFadeUp 0.5s ease forwards;
    animation-delay: 0.2s;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.intel-panel:hover { border-color: rgba(22,163,74,0.3); box-shadow: 0 4px 20px rgba(0,0,0,0.2); }
.intel-grid .intel-panel:nth-child(1) { animation-delay: 0.15s; }
.intel-grid .intel-panel:nth-child(2) { animation-delay: 0.25s; }
.intel-grid .intel-panel:nth-child(3) { animation-delay: 0.35s; }
.intel-grid .intel-panel:nth-child(4) { animation-delay: 0.45s; }
.intel-panel-header {
    display: flex; align-items: center; justify-content: space-between;
    padding: 14px 18px; border-bottom: 1px solid var(--intel-border);
}
.intel-panel-title {
    font-size: 0.85rem; font-weight: 700; text-transform: uppercase;
    letter-spacing: 0.5px; color: var(--intel-muted);
}
.intel-panel-body {
    padding: 16px 18px;
}

.intel-badge {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 24px; height: 24px; border-radius: 12px;
    background: var(--red); color: #fff;
    font-size: 0.75rem; font-weight: 700; padding: 0 8px;
}

/* Anomaly cards */
.intel-anomaly-card {
    padding: 12px 0; border-bottom: 1px solid var(--intel-border);
}
.intel-anomaly-card:last-child { border-bottom: none; }
.intel-anomaly-header {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 4px;
}
.intel-anomaly-field { font-weight: 600; font-size: 0.9rem; }
.intel-anomaly-farm { font-size: 0.75rem; color: var(--intel-muted); }
.intel-anomaly-detail {
    font-size: 0.8rem; color: var(--red); margin-top: 4px;
}
.intel-anomaly-history {
    display: flex; gap: 6px; margin-top: 6px;
}
.intel-spark {
    font-size: 0.7rem; font-weight: 700; font-variant-numeric: tabular-nums;
    padding: 2px 6px; border-radius: 4px;
}
.intel-spark.good { background: rgba(22,163,74,0.2); color: var(--green); }
.intel-spark.warning { background: rgba(217,119,6,0.2); color: var(--yellow); }
.intel-spark.critical { background: rgba(220,38,38,0.2); color: var(--red); }

/* Treatment effectiveness cards */
.intel-treatment-card {
    padding: 12px 0; border-bottom: 1px solid var(--intel-border);
}
.intel-treatment-card:last-child { border-bottom: none; }
.intel-treatment-header {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 4px;
}
.intel-treatment-name { font-weight: 600; font-size: 0.9rem; }
.intel-treatment-delta {
    font-weight: 700; font-size: 0.85rem; font-variant-numeric: tabular-nums;
}
.intel-treatment-delta.positive { color: var(--green); }
.intel-treatment-delta.negative { color: var(--red); }
.intel-treatment-field {
    font-size: 0.75rem; color: var(--intel-muted);
}
.intel-treatment-scores {
    display: flex; gap: 16px; font-size: 0.8rem; color: var(--intel-muted);
    margin-top: 4px;
}
.intel-treatment-urgency {
    display: inline-block; margin-top: 6px;
    font-size: 0.7rem; font-weight: 700; text-transform: uppercase;
    letter-spacing: 0.3px; padding: 2px 8px; border-radius: 4px;
}
.intel-treatment-urgency.urgency-inmediata { background: rgba(220,38,38,0.2); color: var(--red); }
.intel-treatment-urgency.urgency-esta-semana { background: rgba(217,119,6,0.2); color: var(--yellow); }
.intel-treatment-urgency.urgency-preventiva { background: rgba(22,163,74,0.2); color: var(--green); }

/* Batch Health Portfolio Grid */
.batch-health-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 12px;
}
.batch-health-card {
    background: var(--intel-card, #1a1a2e);
    border-radius: 8px;
    padding: 14px 12px;
    text-align: center;
    border-left: 3px solid var(--intel-muted, #555);
    transition: transform 0.15s;
}
.batch-health-card:hover { transform: translateY(-2px); }
.batch-health-card.good { border-left-color: var(--color-good, #22c55e); }
.batch-health-card.warning { border-left-color: var(--color-warning, #f0b429); }
.batch-health-card.critical { border-left-color: var(--color-critical, #ef4444); }
.batch-health-score {
    font-size: 1.6rem;
    font-weight: 700;
    margin-bottom: 6px;
}
.batch-health-field {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--intel-text, #e0e0e0);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.batch-health-farm {
    font-size: 0.75rem;
    color: var(--intel-muted, #888);
    margin-bottom: 4px;
}
.batch-health-trend {
    font-size: 0.75rem;
    color: var(--intel-muted, #888);
    margin-top: 4px;
}
.batch-health-trend.good { color: var(--color-good, #22c55e); }
.batch-health-trend.critical { color: var(--color-critical, #ef4444); }
.batch-health-sources {
    display: flex;
    gap: 4px;
    justify-content: center;
    margin-top: 6px;
    flex-wrap: wrap;
}
.batch-health-source {
    font-size: 0.65rem;
    background: rgba(255,255,255,0.08);
    padding: 1px 6px;
    border-radius: 4px;
    color: var(--intel-muted, #888);
}

/* Map placeholder */
.intel-map-placeholder {
    text-align: center; padding: 40px 20px; color: var(--intel-muted);
}
.intel-map-icon { font-size: 2rem; margin-bottom: 8px; opacity: 0.4; }
.intel-map-text { font-size: 0.85rem; }

/* Chart fallback */
.intel-chart-fallback {
    text-align: center; padding: 40px 20px;
    color: var(--intel-muted); font-size: 0.85rem;
}

/* Empty state */
.intel-empty {
    text-align: center; padding: 24px; color: var(--intel-muted);
    font-size: 0.85rem;
}

/* Admin button */
.intel-btn {
    padding: 8px 18px; border: 1px solid var(--intel-border);
    border-radius: 8px; background: var(--intel-surface);
    color: var(--intel-text); cursor: pointer;
    font-size: 0.8rem; font-weight: 600;
    transition: all 0.2s;
}
.intel-btn:hover { border-color: var(--green); color: var(--green); }
.intel-header-actions { display: flex; gap: 8px; align-items: center; }
.intel-btn-export { border-color: var(--green); color: var(--green); }

.intel-admin-bar {
    display: flex; justify-content: flex-end; gap: 8px;
}

/* Dark theme overrides for shared components */
.intel-body .health-badge.good { background: rgba(22,163,74,0.2); color: var(--green); }
.intel-body .health-badge.warning { background: rgba(217,119,6,0.2); color: var(--yellow); }
.intel-body .health-badge.critical { background: rgba(220,38,38,0.2); color: var(--red); }
.intel-body .health-badge.none { background: rgba(255,255,255,0.05); color: var(--intel-muted); }
.intel-body .loading { color: var(--intel-muted); }
.intel-body .loading-spinner { border-color: var(--intel-border); border-top-color: var(--green); }

/* ── INTEL RESPONSIVE ── */
@media (max-width: 640px) {
    .intel-dashboard { padding: 64px 12px 32px; }
    .intel-title { font-size: 1.2rem; }
    .intel-grid { grid-template-columns: 1fr; }
    .intel-stats-strip { grid-template-columns: repeat(2, 1fr); }
}

/* ── WEATHER WIDGET ── */
.weather-widget {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 20px;
    margin-bottom: 20px;
}
.weather-header {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 12px;
}
.weather-title {
    font-weight: 700;
    font-size: 1.1rem;
    color: var(--text);
}
.weather-farm-name {
    font-size: 0.85rem;
    color: var(--text-muted);
}
.weather-now {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 16px;
}
.weather-temp {
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--text);
    line-height: 1.1;
}
.weather-desc {
    font-size: 0.95rem;
    color: var(--text-muted);
    text-transform: capitalize;
}
.weather-details {
    display: flex;
    gap: 24px;
    margin-top: 8px;
}
.weather-detail {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.weather-detail-label {
    font-size: 0.75rem;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.weather-detail-value {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--text);
}
.weather-forecast {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    border-top: 1px solid var(--border);
    padding-top: 16px;
}
.forecast-day {
    text-align: center;
    padding: 12px 8px;
    background: var(--bg);
    border-radius: 8px;
}
.forecast-day-label {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--text-muted);
    text-transform: uppercase;
    margin-bottom: 6px;
}
.forecast-day-temp {
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--text);
}
.forecast-day-desc {
    font-size: 0.8rem;
    color: var(--text-muted);
    margin-top: 2px;
}
.forecast-day-details {
    font-size: 0.7rem;
    color: var(--text-muted);
    margin-top: 4px;
}

/* ── WEATHER RESPONSIVE ── */
@media (max-width: 480px) {
    .weather-forecast { grid-template-columns: 1fr; gap: 8px; }
    .weather-temp { font-size: 1.8rem; }
}

/* ── HEATMAP ── */
.heatmap-container {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 20px;
    margin-bottom: 20px;
}
.heatmap-header {
    margin-bottom: 12px;
}
.heatmap-title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--text);
}
.heatmap-canvas {
    width: 100%;
    min-height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.heatmap-svg {
    max-width: 100%;
    height: auto;
}
.heatmap-circle {
    opacity: 0.85;
    transition: opacity 0.2s;
}
.heatmap-circle:hover {
    opacity: 1;
}
.heatmap-circle.heatmap-good { fill: var(--green); }
.heatmap-circle.heatmap-warning { fill: var(--yellow); }
.heatmap-circle.heatmap-critical { fill: var(--red); }
.heatmap-circle.heatmap-none { fill: #9ca3af; }
.heatmap-label {
    fill: #fff;
    font-size: 11px;
    font-weight: 600;
    text-anchor: middle;
    dominant-baseline: middle;
    pointer-events: none;
}
.heatmap-name {
    fill: var(--text-muted);
    font-size: 9px;
    text-anchor: middle;
    pointer-events: none;
}
.heatmap-legend {
    display: flex;
    gap: 16px;
    margin-top: 12px;
    font-size: 0.8rem;
    color: var(--text-muted);
}
.heatmap-legend-item {
    display: flex;
    align-items: center;
    gap: 4px;
}
.heatmap-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: inline-block;
}
.heatmap-dot.heatmap-good { background: var(--green); }
.heatmap-dot.heatmap-warning { background: var(--yellow); }
.heatmap-dot.heatmap-critical { background: var(--red); }
.heatmap-dot.heatmap-none { background: #9ca3af; }
.heatmap-empty {
    color: var(--text-muted);
    font-size: 0.9rem;
    padding: 24px;
    text-align: center;
}
.heatmap-field { cursor: pointer; }
@media (max-width: 480px) {
    .heatmap-legend { flex-wrap: wrap; gap: 8px; }
}

/* ── NOTIFICATION PANEL ── */
.notification-panel {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 20px;
    margin-bottom: 20px;
}
.notification-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
}
.notification-title {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--text);
}
.notification-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-height: 320px;
    overflow-y: auto;
}
.notification-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 8px;
    border: 1px solid var(--border);
    background: var(--bg);
    transition: opacity 0.2s;
}
.notification-item.acknowledged {
    opacity: 0.5;
}
.notification-severity {
    flex-shrink: 0;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-top: 6px;
}
.notification-severity.severity-alta,
.notification-severity.severity-critical { background: var(--red); }
.notification-severity.severity-media,
.notification-severity.severity-warning { background: var(--yellow); }
.notification-severity.severity-baja,
.notification-severity.severity-info { background: var(--green); }
.notification-body {
    flex: 1;
    min-width: 0;
}
.notification-message {
    font-size: 0.9rem;
    color: var(--text);
    line-height: 1.4;
}
.notification-meta {
    font-size: 0.75rem;
    color: var(--text-muted);
    margin-top: 2px;
}
.notification-ack-btn {
    flex-shrink: 0;
    padding: 4px 10px;
    font-size: 0.75rem;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: var(--surface);
    color: var(--text-muted);
    cursor: pointer;
    transition: background 0.15s;
}
.notification-ack-btn:hover {
    background: var(--green-light);
    color: var(--green-dark);
}
.notification-empty {
    color: var(--text-muted);
    font-size: 0.9rem;
    padding: 12px 0;
    text-align: center;
}

/* ── ALERT HISTORY TIMELINE ── */
.alert-history {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 20px;
    margin-bottom: 20px;
}
.alert-history-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}
.alert-history-title {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--text);
}
.alert-history-count {
    font-size: 0.75rem;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 12px;
    background: var(--border);
    color: var(--text-muted);
}
.alert-history-empty {
    color: var(--text-muted);
    font-size: 0.85rem;
    padding: 12px 0;
    text-align: center;
}
.alert-history-item {
    display: flex;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid var(--border);
}
.alert-history-item:last-child {
    border-bottom: none;
}
.alert-history-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-top: 5px;
    flex-shrink: 0;
}
.alert-history-dot.alert-type-health { background: var(--red); }
.alert-history-dot.alert-type-irrigation { background: var(--blue); }
.alert-history-dot.alert-type-anomaly { background: var(--yellow); }
.alert-history-dot.alert-type-default { background: var(--text-muted); }
.alert-history-content {
    flex: 1;
    min-width: 0;
}
.alert-history-top {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
}
.alert-history-type-badge {
    font-size: 0.7rem;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 10px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.alert-history-type-badge.alert-type-health {
    background: var(--red-light); color: var(--red);
}
.alert-history-type-badge.alert-type-irrigation {
    background: var(--blue-light); color: var(--blue);
}
.alert-history-type-badge.alert-type-anomaly {
    background: var(--yellow-light); color: var(--yellow);
}
.alert-history-type-badge.alert-type-default {
    background: var(--border); color: var(--text-muted);
}
.alert-history-status {
    font-size: 0.7rem;
    font-weight: 500;
}
.alert-status-sent { color: var(--green); }
.alert-status-pending { color: var(--text-muted); }
.alert-history-message {
    font-size: 0.85rem;
    color: var(--text);
    line-height: 1.4;
    margin-bottom: 4px;
}
.alert-history-date {
    font-size: 0.75rem;
    color: var(--text-muted);
}

/* ── ALERT CHECK PANEL ── */
.alert-check-panel {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 16px;
    margin-bottom: 16px;
}
.alert-check-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
}
.alert-check-title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--text);
    margin: 0;
}
.alert-check-btn {
    background: var(--blue);
    color: #fff;
    border: none;
    border-radius: 6px;
    padding: 8px 16px;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: opacity 0.2s;
}
.alert-check-btn:hover { opacity: 0.85; }
.alert-check-btn:disabled { opacity: 0.5; cursor: not-allowed; }
.alert-check-results {
    display: grid;
    gap: 10px;
}
.alert-check-card {
    border-radius: 8px;
    padding: 12px 14px;
    display: flex;
    align-items: flex-start;
    gap: 10px;
}
.alert-check-card.critical {
    background: var(--red-light);
    border: 1px solid rgba(220,38,38,0.2);
}
.alert-check-card.warning {
    background: var(--yellow-light);
    border: 1px solid rgba(217,119,6,0.2);
}
.alert-check-card.info {
    background: var(--blue-light);
    border: 1px solid rgba(37,99,235,0.2);
}
.alert-check-card.ok {
    background: rgba(22,163,74,0.08);
    border: 1px solid rgba(22,163,74,0.2);
}
.alert-check-icon {
    font-size: 1.1rem;
    flex-shrink: 0;
    margin-top: 1px;
}
.alert-check-card.critical .alert-check-icon { color: #991b1b; }
.alert-check-card.warning .alert-check-icon { color: #92400e; }
.alert-check-card.info .alert-check-icon { color: var(--blue); }
.alert-check-card.ok .alert-check-icon { color: var(--green); }
.alert-check-body {
    flex: 1;
}
.alert-check-card-title {
    font-size: 0.85rem;
    font-weight: 600;
    margin-bottom: 4px;
}
.alert-check-card.critical .alert-check-card-title { color: #991b1b; }
.alert-check-card.warning .alert-check-card-title { color: #92400e; }
.alert-check-card.info .alert-check-card-title { color: var(--blue); }
.alert-check-card.ok .alert-check-card-title { color: var(--green); }
.alert-check-card-msg {
    font-size: 0.8rem;
    color: var(--text-muted);
    line-height: 1.4;
}
.alert-check-summary {
    font-size: 0.8rem;
    color: var(--text-muted);
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid var(--border);
}

/* ── SEASONAL TEK CALENDAR ── */
.seasonal-calendar {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 20px;
    margin-bottom: 20px;
}
.seasonal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}
.seasonal-title {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--text);
}
.seasonal-season-badge {
    font-size: 0.75rem;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 20px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.seasonal-season-badge.temporal {
    background: var(--blue-light);
    color: var(--blue);
}
.seasonal-season-badge.secas {
    background: var(--yellow-light);
    color: var(--yellow);
}
.seasonal-group {
    margin-bottom: 14px;
}
.seasonal-group:last-child {
    margin-bottom: 0;
}
.seasonal-group-label {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-muted);
    margin-bottom: 8px;
    padding-bottom: 4px;
    border-bottom: 1px solid var(--border);
}
.seasonal-card {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 8px;
    border: 1px solid var(--border);
    background: var(--bg);
    margin-bottom: 6px;
}
.seasonal-card:last-child {
    margin-bottom: 0;
}
.seasonal-type-dot {
    flex-shrink: 0;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-top: 6px;
}
.seasonal-type-dot.preparacion { background: var(--yellow); }
.seasonal-type-dot.siembra { background: var(--green); }
.seasonal-type-dot.cosecha { background: var(--red); }
.seasonal-type-dot.mantenimiento { background: var(--blue); }
.seasonal-card-body {
    flex: 1;
    min-width: 0;
}
.seasonal-card-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
}
.seasonal-crop-name {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--text);
}
.seasonal-month-range {
    font-size: 0.7rem;
    color: var(--text-muted);
    background: var(--bg);
    border: 1px solid var(--border);
    padding: 1px 6px;
    border-radius: 4px;
}
.seasonal-message {
    font-size: 0.82rem;
    color: var(--text-muted);
    line-height: 1.4;
}
.seasonal-empty {
    color: var(--text-muted);
    font-size: 0.9rem;
    padding: 12px 0;
    text-align: center;
}
.seasonal-legend {
    display: flex;
    gap: 14px;
    margin-top: 12px;
    padding-top: 10px;
    border-top: 1px solid var(--border);
}
.seasonal-legend-item {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 0.7rem;
    color: var(--text-muted);
}

/* ── ALERT CONFIG FORM ── */
.alert-config-btn {
    background: none;
    border: 1px solid var(--border, #333);
    color: var(--text-muted);
    font-size: 1.1rem;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.2s, border-color 0.2s;
}
.alert-config-btn:hover {
    color: var(--green);
    border-color: var(--green);
}
.alert-config-form {
    padding: 12px 16px;
    border-bottom: 1px solid var(--border, #333);
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.alert-config-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.alert-config-row label {
    font-size: 0.85rem;
    color: var(--text-muted);
    flex: 1;
}
.alert-config-row input {
    width: 80px;
    padding: 4px 8px;
    border: 1px solid var(--border, #333);
    border-radius: 4px;
    background: var(--bg, #0a0a0a);
    color: var(--text, #e5e5e5);
    font-size: 0.85rem;
    text-align: right;
}
.alert-config-save {
    align-self: flex-end;
    padding: 6px 16px;
    background: var(--green);
    color: #000;
    border: none;
    border-radius: 6px;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: opacity 0.2s;
}
.alert-config-save:hover {
    opacity: 0.85;
}
.alert-config-save:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ── Regenerative Score Card ── */
.regen-card {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.regen-hero {
    display: flex;
    align-items: baseline;
    gap: 8px;
}
.regen-score {
    font-size: 2.5rem;
    font-weight: 800;
    line-height: 1;
}
.regen-score-label {
    color: var(--text-muted);
    font-size: 1rem;
}
.regen-components {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.regen-component-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 4px;
}
.regen-component-label {
    font-size: 0.85rem;
    color: var(--text);
}
.regen-component-value {
    font-size: 0.8rem;
    color: var(--text-muted);
    font-weight: 600;
}
.regen-bar-track {
    height: 8px;
    background: var(--border);
    border-radius: 4px;
    overflow: hidden;
}
.regen-bar-fill {
    height: 100%;
    border-radius: 4px;
    transition: width 0.3s ease;
}
.regen-bar-good { background: var(--green); }
.regen-bar-warning { background: var(--yellow); }
.regen-bar-critical { background: var(--red); }
.regen-recs {
    border-top: 1px solid var(--border);
    padding-top: 12px;
}
.regen-recs-title {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--text);
    margin-bottom: 8px;
}
.regen-rec-item {
    font-size: 0.83rem;
    color: var(--text-muted);
    padding: 6px 0;
    border-bottom: 1px solid var(--border);
    line-height: 1.4;
}
.regen-rec-item:last-child {
    border-bottom: none;
}

/* ── Seasonal Comparison ── */
.seasonal-card {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.seasonal-metric {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.seasonal-metric-label {
    font-weight: 600;
    font-size: 0.85rem;
    color: var(--text);
}
.seasonal-bars {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.seasonal-bar-row {
    display: flex;
    align-items: center;
    gap: 8px;
}
.seasonal-season-label {
    font-size: 0.75rem;
    color: var(--muted);
    width: 60px;
    flex-shrink: 0;
}
.seasonal-bar-track {
    flex: 1;
    height: 16px;
    background: var(--bg-card);
    border-radius: 4px;
    overflow: hidden;
    border: 1px solid var(--border);
}
.seasonal-bar-fill {
    height: 100%;
    border-radius: 4px;
    transition: width 0.4s ease;
}
.seasonal-temporal {
    background: var(--green);
}
.seasonal-secas {
    background: var(--yellow, #eab308);
}
.seasonal-bar-value {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--text);
    width: 50px;
    text-align: right;
    flex-shrink: 0;
}
.seasonal-meta {
    display: flex;
    gap: 16px;
    padding-top: 8px;
    border-top: 1px solid var(--border);
}
.seasonal-meta-item {
    font-size: 0.75rem;
    color: var(--muted);
}

/* ── Treatment Effectiveness Report ── */
.intel-panel-wide {
    grid-column: 1 / -1;
}
.intel-filter-select {
    background: var(--surface, #141414);
    color: var(--text, #e5e7eb);
    border: 1px solid var(--border, #333);
    border-radius: 6px;
    padding: 4px 10px;
    font-size: 0.8rem;
    font-family: inherit;
    cursor: pointer;
}
.intel-filter-select:focus {
    outline: none;
    border-color: var(--green, #16a34a);
}
.treatment-report-card {
    background: var(--surface, #141414);
    border: 1px solid var(--border, #333);
    border-radius: 8px;
    padding: 14px 16px;
    margin-bottom: 10px;
}
.treatment-report-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}
.treatment-report-name {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--text, #e5e7eb);
}
.treatment-report-apps {
    font-size: 0.75rem;
    color: var(--muted, #9ca3af);
}
.treatment-report-score-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}
.treatment-report-label {
    font-size: 0.75rem;
    color: var(--muted, #9ca3af);
    width: 55px;
    flex-shrink: 0;
}
.treatment-report-score-bar {
    flex: 1;
    height: 8px;
    background: rgba(255,255,255,0.08);
    border-radius: 4px;
    overflow: hidden;
}
.score-bar-fill {
    height: 100%;
    border-radius: 4px;
    transition: width 0.4s ease;
}
.score-bar-fill.good { background: var(--green, #16a34a); }
.score-bar-fill.warning { background: var(--yellow, #eab308); }
.score-bar-fill.critical { background: #ef4444; }
.treatment-report-score-val {
    font-size: 0.8rem;
    font-weight: 600;
    font-family: monospace;
    color: var(--text, #e5e7eb);
    width: 40px;
    text-align: right;
    flex-shrink: 0;
}
.treatment-report-metrics {
    display: flex;
    gap: 20px;
}
.treatment-report-metric {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.treatment-report-metric-label {
    font-size: 0.7rem;
    color: var(--muted, #9ca3af);
}
.treatment-report-metric-value {
    font-size: 0.85rem;
    font-weight: 600;
    font-family: monospace;
    color: var(--text, #e5e7eb);
}
.treatment-report-metric-value.positive { color: var(--green, #16a34a); }
.treatment-report-metric-value.negative { color: #ef4444; }

/* ── Farm Comparison Table ── */
.compare-table {
    width: 100%;
}
.compare-header-row {
    display: grid;
    grid-template-columns: 2fr 0.8fr 1fr 0.8fr 1.2fr 1.5fr 0.8fr;
    gap: 8px;
    padding: 8px 0;
    border-bottom: 2px solid var(--intel-border, #333);
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--intel-muted, #9ca3af);
}
.compare-header-row [data-sort],
.compare-sortable {
    cursor: pointer;
    user-select: none;
}
.compare-header-row [data-sort]:hover,
.compare-sortable:hover {
    color: #e5e7eb;
}
.compare-header-row [data-sort].sort-asc::after {
    content: " \25B2";
    font-size: 0.6rem;
}
.compare-header-row [data-sort].sort-desc::after {
    content: " \25BC";
    font-size: 0.6rem;
}
.compare-row {
    display: grid;
    grid-template-columns: 2fr 0.8fr 1fr 0.8fr 1.2fr 1.5fr 0.8fr;
    gap: 8px;
    padding: 10px 0;
    border-bottom: 1px solid var(--intel-border, #333);
    align-items: center;
    font-size: 0.85rem;
}
.compare-row:last-child { border-bottom: none; }
.compare-cell {
    display: flex;
    align-items: center;
}
.compare-cell-name {
    font-weight: 600;
}
.compare-sortable {
    cursor: pointer;
    user-select: none;
}
.compare-sortable:hover {
    color: var(--intel-accent, #4da6ff);
}
.compare-sortable.sort-asc::after { content: ' \25B2'; font-size: 0.6rem; }
.compare-sortable.sort-desc::after { content: ' \25BC'; font-size: 0.6rem; }
.compare-cell-trend {
    display: flex;
    align-items: center;
    gap: 6px;
}
.compare-trend-label {
    font-size: 0.75rem;
}
.compare-trend-label.good { color: #16a34a; }
.compare-trend-label.critical { color: #ef4444; }
.compare-sparkline svg { display: block; }
.sparkline-line.good { color: #16a34a; }
.sparkline-line.warning { color: #f0b429; }
.sparkline-line.critical { color: #ef4444; }
.sparkline-line.none { color: #666; }
.compare-cell-yield {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.compare-yield-bar {
    width: 100%;
    height: 6px;
    background: var(--intel-border, #333);
    border-radius: 3px;
    overflow: hidden;
}
.intel-header-actions-inline {
    display: flex;
    align-items: center;
    gap: 8px;
}
.intel-btn-sm {
    padding: 4px 10px;
    font-size: 0.75rem;
}
#farm-compare-select {
    min-width: 160px;
    max-height: 80px;
}
#farm-compare-select option {
    padding: 2px 6px;
}

/* ── Onboarding Wizard ── */
.wizard-progress {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    margin-bottom: 24px;
    padding: 0 20px;
}
.wizard-progress-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    opacity: 0.4;
    transition: opacity 0.2s;
}
.wizard-progress-step.active,
.wizard-progress-step.completed { opacity: 1; }
.wizard-progress-num {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--surface, #141414);
    border: 2px solid var(--border, #333);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.85rem;
}
.wizard-progress-step.active .wizard-progress-num {
    border-color: var(--intel-accent, #4da6ff);
    color: var(--intel-accent, #4da6ff);
}
.wizard-progress-step.completed .wizard-progress-num {
    background: var(--intel-accent, #4da6ff);
    border-color: var(--intel-accent, #4da6ff);
    color: #fff;
}
.wizard-progress-label {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--intel-muted, #9ca3af);
}
.wizard-progress-line {
    flex: 1;
    max-width: 80px;
    height: 2px;
    background: var(--border, #333);
    margin: 0 8px;
    margin-bottom: 18px;
}
.wizard-step { display: none; }
.wizard-step-active { display: block; }
.wizard-form { display: flex; flex-direction: column; gap: 16px; }
.wizard-form-row {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}
.wizard-form-group {
    flex: 1;
    min-width: 160px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.wizard-form-group label {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--intel-muted, #9ca3af);
}
.wizard-form-group input,
.wizard-form-group select {
    padding: 8px 10px;
    border: 1px solid var(--border, #333);
    border-radius: 6px;
    background: var(--bg, #0a0a0a);
    color: var(--text, #e5e7eb);
    font-size: 0.85rem;
}
.wizard-form-group input:focus,
.wizard-form-group select:focus {
    outline: none;
    border-color: var(--intel-accent, #4da6ff);
}
.wizard-actions {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid var(--border, #333);
}
.wizard-btn {
    padding: 8px 20px;
    border: 1px solid var(--border, #333);
    border-radius: 6px;
    background: var(--surface, #141414);
    color: var(--text, #e5e7eb);
    font-size: 0.85rem;
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
}
.wizard-btn:hover { border-color: var(--intel-accent, #4da6ff); }
.wizard-btn-next {
    background: var(--intel-accent, #4da6ff);
    color: #fff;
    border-color: var(--intel-accent, #4da6ff);
}
.wizard-btn-finish {
    background: #16a34a;
    color: #fff;
    border-color: #16a34a;
}
.wizard-btn-finish:hover { background: #15803d; }
.wizard-btn-remove {
    align-self: flex-end;
    padding: 6px 10px;
    border: 1px solid #ef4444;
    border-radius: 6px;
    background: transparent;
    color: #ef4444;
    cursor: pointer;
    font-size: 0.8rem;
}
.wizard-btn-remove:hover { background: rgba(239,68,68,0.1); }
.wizard-field-row {
    border: 1px solid var(--border, #333);
    border-radius: 8px;
    padding: 12px;
    margin-bottom: 10px;
    background: var(--surface, #141414);
}
.wizard-fields-list { margin-bottom: 12px; }
.wizard-summary-card {
    background: var(--surface, #141414);
    border: 1px solid var(--border, #333);
    border-radius: 8px;
    padding: 16px;
}
.wizard-summary-card h3 { margin-bottom: 10px; }
.wizard-summary-details {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-bottom: 12px;
    font-size: 0.85rem;
    color: var(--intel-muted, #9ca3af);
}
.wizard-summary-fields {
    list-style: disc;
    padding-left: 20px;
    font-size: 0.85rem;
}
.wizard-summary-fields li { margin-bottom: 4px; }
.wizard-summary-note {
    font-size: 0.85rem;
    color: var(--intel-muted, #9ca3af);
    font-style: italic;
}
.wizard-result {
    border-radius: 8px;
    padding: 16px;
    margin-bottom: 16px;
}
.wizard-result-success {
    background: rgba(22,163,74,0.1);
    border: 1px solid #16a34a;
}
.wizard-result-error {
    background: rgba(239,68,68,0.1);
    border: 1px solid #ef4444;
}
.wizard-result-actions {
    display: flex;
    gap: 10px;
    margin-top: 12px;
}

/* ── TEK Validation ── */
.tek-method-card {
    background: var(--surface, #141414);
    border: 1px solid var(--border, #333);
    border-radius: 8px;
    padding: 14px 16px;
    margin-bottom: 10px;
}
.tek-method-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}
.tek-method-name {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--text, #e5e7eb);
}
.tek-method-feedback {
    font-size: 0.75rem;
    color: var(--muted, #9ca3af);
}
.tek-method-score-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}
.tek-method-label {
    font-size: 0.75rem;
    color: var(--muted, #9ca3af);
    width: 70px;
    flex-shrink: 0;
}
.tek-method-score-bar {
    flex: 1;
    height: 8px;
    background: rgba(255,255,255,0.08);
    border-radius: 4px;
    overflow: hidden;
}
.tek-method-score-val {
    font-size: 0.8rem;
    font-weight: 600;
    font-family: monospace;
    color: var(--text, #e5e7eb);
    width: 40px;
    text-align: right;
    flex-shrink: 0;
}
.tek-method-counts {
    display: flex;
    gap: 16px;
    font-size: 0.78rem;
}
.tek-count-positive {
    color: var(--green, #16a34a);
}
.tek-count-negative {
    color: #ef4444;
}
.tek-method-rating {
    color: var(--muted, #9ca3af);
    margin-left: auto;
}

/* ── Mission Plan ── */
.mission-card {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.mission-header {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.mission-drone-badge,
.mission-type-badge {
    background: var(--surface, #1e1e1e);
    border: 1px solid var(--border, #333);
    border-radius: 6px;
    padding: 4px 10px;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--text, #e5e5e5);
}
.mission-drone-badge {
    border-color: var(--green, #16a34a);
    color: var(--green, #16a34a);
}
.mission-waypoints-summary {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    padding-top: 8px;
    border-top: 1px solid var(--border, #333);
    font-size: 0.8rem;
}

/* -- Intervention Scores -- */
.intervention-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.intervention-card {
    display: flex;
    gap: 12px;
    padding: 12px;
    background: var(--card-bg, #141414);
    border: 1px solid var(--border, #333);
    border-radius: 8px;
}
.intervention-rank {
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--green, #16a34a);
    min-width: 32px;
    display: flex;
    align-items: flex-start;
    padding-top: 2px;
}
.intervention-body {
    flex: 1;
    min-width: 0;
}
.intervention-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
}
.intervention-problema {
    font-weight: 600;
    font-size: 0.95rem;
}
.intervention-tratamiento {
    font-size: 0.85rem;
    color: var(--text-dim, #aaa);
    margin-bottom: 8px;
}
.intervention-metrics {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px 16px;
}
.intervention-metric {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.8rem;
}
.intervention-metric-label {
    color: var(--text-dim, #aaa);
    white-space: nowrap;
}
.intervention-metric-value {
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}
.intervention-score-bar {
    flex: 1;
    height: 6px;
    background: var(--border, #333);
    border-radius: 3px;
    overflow: hidden;
}
.intervention-score-fill {
    height: 100%;
    background: var(--green, #16a34a);
    border-radius: 3px;
    transition: width 0.3s;
}
/* -- Microbiome panel -- */
.microbiome-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}
.microbiome-date {
    font-size: 0.7rem;
    color: var(--muted, #888);
}
.microbiome-history {
    margin-top: 12px;
    border-top: 1px solid var(--border, #333);
    padding-top: 10px;
}
.microbiome-sample {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 3px 0;
    font-size: 0.75rem;
}
.microbiome-sample-rate {
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}
.microbiome-sample-date {
    color: var(--muted, #888);
    margin-left: auto;
}

/* ── GROWTH STAGE ── */
.growth-stage-header {
    display: flex; align-items: center; gap: 10px; margin-bottom: 12px;
}
.growth-crop {
    color: var(--muted, #888); font-size: 0.85rem;
}
.growth-day-count {
    margin-left: auto; font-family: monospace; font-size: 0.85rem;
    font-weight: 700; color: var(--accent, #16a34a);
}
.growth-timeline {
    position: relative; margin-bottom: 20px; padding-bottom: 8px;
}
.growth-timeline-bar {
    display: flex; height: 32px; border-radius: 6px; overflow: hidden;
    border: 1px solid var(--border, #e5e7eb);
}
.growth-timeline-segment {
    display: flex; flex-direction: column; align-items: center;
    justify-content: center; font-size: 0.65rem; gap: 1px;
    transition: opacity 0.3s ease;
}
.growth-timeline-segment.past {
    background: var(--green-light, #dcfce7); color: var(--green-dark, #14532d);
}
.growth-timeline-segment.current {
    background: var(--green, #16a34a); color: #fff; font-weight: 700;
}
.growth-timeline-segment.future {
    background: var(--bg-alt, #f9fafb); color: var(--muted, #888);
}
.growth-timeline-label {
    font-size: 0.6rem; text-transform: uppercase; letter-spacing: 0.03em;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    max-width: 90%; line-height: 1;
}
.growth-timeline-days {
    font-family: monospace; font-size: 0.6rem; opacity: 0.8; line-height: 1;
}
.growth-timeline-needle {
    position: absolute; bottom: 0; width: 2px; height: 40px;
    background: var(--red, #dc2626); border-radius: 1px;
    transform: translateX(-1px);
}
.growth-timeline-needle::after {
    content: ''; position: absolute; bottom: -4px; left: -3px;
    width: 8px; height: 8px; background: var(--red, #dc2626);
    border-radius: 50%;
}
.growth-timeline-details {
    display: flex; flex-direction: column; gap: 4px; margin-bottom: 14px;
}
.growth-timeline-detail {
    display: grid; grid-template-columns: 100px 40px 1fr;
    gap: 8px; font-size: 0.78rem; padding: 4px 8px; border-radius: 4px;
    align-items: center;
}
.growth-timeline-detail.current {
    background: var(--green-light, #dcfce7);
    border-left: 3px solid var(--green, #16a34a);
}
.growth-timeline-detail-name { font-weight: 600; }
.growth-timeline-detail-water {
    font-family: monospace; font-weight: 700; text-align: center;
    padding: 1px 4px; border-radius: 3px; font-size: 0.72rem;
}
.growth-timeline-detail-water.high { color: var(--blue, #2563eb); background: var(--blue-light, #dbeafe); }
.growth-timeline-detail-water.low { color: var(--yellow, #d97706); background: var(--yellow-light, #fef3c7); }
.growth-timeline-detail-water.mid { color: var(--green-dark, #14532d); background: var(--green-light, #dcfce7); }
.growth-timeline-detail-nutrient {
    color: var(--text-muted, #888); font-size: 0.72rem;
}
@media (max-width: 600px) {
    .growth-timeline-label { font-size: 0.5rem; }
    .growth-timeline-detail { grid-template-columns: 80px 35px 1fr; font-size: 0.7rem; }
    .growth-timeline-detail-nutrient { display: none; }
}

/* ── WEATHER FORECAST CARD ── */
.weather-current {
    display: flex; flex-wrap: wrap; align-items: baseline; gap: 12px;
    margin-bottom: 16px; padding-bottom: 12px;
    border-bottom: 1px solid var(--border, #e5e7eb);
}
.weather-current-temp {
    font-size: 2rem; font-weight: 800; color: var(--green-dark, #14532d);
    font-family: monospace;
}
.weather-current-desc {
    font-size: 0.95rem; color: var(--text-muted, #888);
}
.weather-current-details {
    display: flex; gap: 14px; width: 100%; font-size: 0.82rem;
    color: var(--text-muted, #888);
}
.weather-detail { white-space: nowrap; }
.weather-rain { color: var(--blue, #2563eb); font-weight: 600; }
.weather-forecast-title {
    font-size: 0.78rem; font-weight: 600; text-transform: uppercase;
    letter-spacing: 0.05em; color: var(--text-muted, #888); margin-bottom: 10px;
}
.weather-forecast-days {
    display: flex; flex-direction: column; gap: 8px;
}
.weather-day {
    display: grid; grid-template-columns: 80px 1fr 50px auto auto;
    align-items: center; gap: 8px; font-size: 0.82rem;
    padding: 6px 8px; border-radius: 6px;
    background: var(--bg-alt, #f9fafb);
}
.weather-day-rain {
    background: var(--blue-light, #dbeafe);
}
.weather-day-label {
    font-weight: 600; color: var(--text, #333);
}
.weather-day-bar-track {
    height: 6px; background: var(--border, #e5e7eb); border-radius: 3px;
    overflow: hidden;
}
.weather-day-bar {
    height: 100%; background: var(--yellow, #d97706); border-radius: 3px;
    transition: width 0.3s ease;
}
.weather-day-rain .weather-day-bar {
    background: var(--blue, #2563eb);
}
.weather-day-temp {
    font-family: monospace; font-weight: 700; text-align: right;
}
.weather-day-desc {
    color: var(--text-muted, #888); font-size: 0.78rem;
}
.weather-day-rain-amt {
    color: var(--blue, #2563eb); font-weight: 600; font-size: 0.78rem;
}
.weather-day-humidity {
    color: var(--text-muted, #888); font-size: 0.75rem;
}
@media (max-width: 600px) {
    .weather-day {
        grid-template-columns: 70px 1fr 40px;
    }
    .weather-day-desc, .weather-day-humidity { display: none; }
}

/* ── KNOWLEDGE BASE PAGE ── */
.knowledge-body { background: var(--bg); }
.knowledge-dashboard {
    max-width: 1200px; margin: 0 auto;
    padding: 72px 16px 40px;
}
.knowledge-header { margin-bottom: 24px; }
.knowledge-title {
    font-size: 1.5rem; font-weight: 800; letter-spacing: -0.5px;
}
.knowledge-subtitle {
    font-size: 0.9rem; color: var(--text-muted); margin-top: 4px;
}
.knowledge-search-bar { margin-bottom: 28px; }
.knowledge-search-input {
    width: 100%; padding: 12px 16px;
    border: 1px solid var(--border); border-radius: var(--radius);
    font-size: 0.95rem; background: var(--surface); color: var(--text);
    font-family: inherit;
    transition: border-color 0.2s;
}
.knowledge-search-input:focus {
    outline: none; border-color: var(--accent);
}
.knowledge-section { margin-bottom: 32px; }
.knowledge-section-title {
    font-size: 1.15rem; font-weight: 700; margin-bottom: 12px;
    color: var(--text); letter-spacing: -0.3px;
}
.knowledge-grid {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 16px;
}
.knowledge-card {
    background: var(--surface); border: 1px solid var(--border);
    border-radius: var(--radius); padding: 16px;
    transition: box-shadow 0.2s;
}
.knowledge-card:hover { box-shadow: 0 2px 12px rgba(0,0,0,0.06); }
.knowledge-card-header {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 8px; gap: 8px;
}
.knowledge-card-title {
    font-size: 1rem; font-weight: 700; text-transform: capitalize;
}
.knowledge-badge {
    font-size: 0.7rem; font-weight: 600; padding: 2px 8px;
    border-radius: 6px; white-space: nowrap;
}
.knowledge-badge-type {
    background: var(--green-light); color: var(--green-dark);
}
.knowledge-badge-family {
    background: var(--blue-light); color: var(--blue);
}
.knowledge-badge-cost {
    background: var(--yellow-light); color: var(--yellow);
    font-variant-numeric: tabular-nums;
}
.knowledge-card-desc {
    font-size: 0.85rem; color: var(--text); line-height: 1.5;
    margin-bottom: 8px;
}
.knowledge-card-meta {
    display: flex; flex-wrap: wrap; gap: 8px 16px;
    margin-bottom: 6px;
}
.knowledge-meta-item {
    font-size: 0.78rem; color: var(--text-muted);
}
.knowledge-meta-item strong { color: var(--text); }
.knowledge-card-benefits,
.knowledge-card-science,
.knowledge-card-temp,
.knowledge-card-crops {
    font-size: 0.8rem; color: var(--text-muted); margin-top: 6px;
}
.knowledge-card-benefits strong,
.knowledge-card-science strong,
.knowledge-card-temp strong,
.knowledge-card-crops strong { color: var(--text); }
.knowledge-placeholder,
.knowledge-empty {
    font-size: 0.85rem; color: var(--text-muted); padding: 12px 0;
}

/* Disease severity badges */
.severity-high { background: var(--red-light, #fde8e8); color: var(--red, #e53e3e); }
.severity-med { background: var(--yellow-light); color: var(--yellow); }
.severity-low { background: var(--green-light); color: var(--green-dark); }
.knowledge-card-symptoms {
    font-size: 0.8rem; color: var(--text-muted); margin-top: 6px;
}
.knowledge-card-symptoms strong { color: var(--text); }
.knowledge-card-treatments {
    margin-top: 8px; display: flex; flex-wrap: wrap; gap: 6px;
}
.knowledge-card-treatments strong {
    color: var(--text); font-size: 0.8rem; width: 100%;
}
.treatment-tag {
    font-size: 0.75rem; padding: 2px 8px; border-radius: 12px;
    background: var(--surface-hover, #f0f0f0); color: var(--text-muted);
}
.treatment-tag.organic {
    background: var(--green-light); color: var(--green-dark);
}
/* Identify form */
.identify-form {
    display: flex; flex-direction: column; gap: 12px;
    max-width: 500px;
}
.identify-field { display: flex; flex-direction: column; gap: 4px; }
.identify-field label { font-size: 0.85rem; font-weight: 600; color: var(--text); }
.identify-hint { font-size: 0.75rem; color: var(--text-muted); }
.identify-btn {
    align-self: flex-start; background: var(--accent); color: #fff; border: none;
    border-radius: 6px; padding: 8px 20px; font-size: 0.85rem; font-weight: 600;
    cursor: pointer;
}
.identify-btn:hover { opacity: 0.9; }
.identify-results { margin-top: 16px; }
.identify-results-title { font-size: 1rem; font-weight: 700; margin-bottom: 12px; color: var(--text); }
.identify-match {
    background: var(--card-bg, var(--surface)); border: 1px solid var(--border);
    border-radius: 10px; padding: 14px; margin-bottom: 10px;
}
.identify-match-header {
    display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px;
}
.identify-match-header strong { font-size: 0.95rem; color: var(--text); }
.confidence-bar {
    display: inline-block; background: var(--accent); color: #fff;
    font-size: 0.7rem; font-weight: 700; padding: 2px 8px; border-radius: 8px;
    text-align: right; min-width: 36px;
}
.identify-match p { font-size: 0.82rem; color: var(--text-muted); margin: 4px 0; }
.identify-match p strong { color: var(--text); }

@media (max-width: 640px) {
    .knowledge-grid { grid-template-columns: 1fr; }
    .knowledge-title { font-size: 1.25rem; }
}

/* ── Feedback ── */
.feedback-form { padding: 12px 0; display: flex; flex-direction: column; gap: 10px; }
.feedback-form-row { display: flex; gap: 12px; flex-wrap: wrap; align-items: flex-end; }
.feedback-label { display: flex; flex-direction: column; gap: 4px; font-size: 0.8rem; color: var(--text-muted); }
.feedback-wide { flex: 1; min-width: 180px; }
.feedback-input {
    background: var(--surface); border: 1px solid var(--border); border-radius: 6px;
    color: var(--text); padding: 6px 8px; font-size: 0.85rem;
}
.feedback-input:focus { border-color: var(--accent); outline: none; }
.feedback-check { flex-direction: row; align-items: center; gap: 6px; padding-bottom: 4px; }
.feedback-submit {
    align-self: flex-start; background: var(--accent); color: #fff; border: none;
    border-radius: 6px; padding: 8px 16px; font-size: 0.85rem; cursor: pointer;
}
.feedback-submit:hover { opacity: 0.9; }
.feedback-entry {
    border-bottom: 1px solid var(--border); padding: 10px 0;
}
.feedback-entry:last-child { border-bottom: none; }
.feedback-entry-header { display: flex; align-items: center; gap: 10px; margin-bottom: 4px; }
.feedback-stars { color: #f0b429; font-size: 1rem; }
.feedback-date { font-size: 0.75rem; color: var(--text-muted); margin-left: auto; }
.feedback-notes { font-size: 0.85rem; color: var(--text); margin-top: 4px; }
.feedback-alt { font-size: 0.8rem; color: var(--text-muted); margin-top: 2px; font-style: italic; }

/* -- Sensor Fusion Widget -- */
.fusion-panel { display: flex; flex-direction: column; gap: 14px; }
.fusion-confidence-section { display: flex; flex-direction: column; gap: 8px; }
.fusion-confidence-header { display: flex; justify-content: space-between; align-items: center; }
.fusion-confidence-label { font-size: 0.85rem; font-weight: 600; color: var(--text); }
.fusion-confidence-value { font-size: 0.85rem; }
.fusion-confidence-track {
    width: 100%; height: 8px; background: var(--border); border-radius: 4px; overflow: hidden;
}
.fusion-confidence-fill {
    height: 100%; border-radius: 4px; transition: width 0.4s ease;
}
.fusion-confidence-fill.good { background: var(--accent); }
.fusion-confidence-fill.warning { background: #f0b429; }
.fusion-confidence-fill.critical { background: #dc2626; }
.fusion-sensors { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 4px; }
.fusion-sensors-label { font-size: 0.75rem; color: var(--text-muted); margin-right: 4px; }
.fusion-sensor-badge {
    font-size: 0.7rem; padding: 2px 8px; border-radius: 10px; font-weight: 500;
}
.fusion-sensor-badge.active {
    background: var(--green-light); color: var(--green-dark);
}
.fusion-sensor-badge.inactive {
    background: #f3f4f6; color: var(--text-muted); opacity: 0.6;
}
.fusion-assessment {
    font-size: 0.85rem; color: var(--text); line-height: 1.5;
    padding: 10px 12px; background: var(--surface); border: 1px solid var(--border);
    border-radius: 8px;
}
.fusion-contradictions { display: flex; flex-direction: column; gap: 8px; }
.fusion-contradictions-title {
    font-size: 0.8rem; font-weight: 600; color: #dc2626;
}
.fusion-contradiction-card {
    background: var(--red-light); border: 1px solid rgba(220,38,38,0.2);
    border-radius: 8px; padding: 10px 12px;
}
.fusion-contradiction-header { margin-bottom: 4px; }
.fusion-contradiction-sensors {
    font-size: 0.8rem; font-weight: 600; color: #991b1b;
}
.fusion-contradiction-desc {
    font-size: 0.8rem; color: var(--text); line-height: 1.4;
}

/* ── Fusion Overview (Intel Dashboard) ── */
.fusion-overview-summary {
    display: flex; gap: 24px; padding: 12px 0; border-bottom: 1px solid var(--border); margin-bottom: 12px;
}
.fusion-overview-stat { display: flex; flex-direction: column; align-items: center; }
.fusion-overview-stat-value { font-size: 1.4rem; font-weight: 700; color: var(--text); }
.fusion-overview-stat-value.negative { color: #dc2626; }
.fusion-overview-stat-label { font-size: 0.75rem; color: var(--text-muted); }
.fusion-overview-fields { display: flex; flex-direction: column; gap: 10px; }
.fusion-overview-field {
    background: var(--bg); border: 1px solid var(--border); border-radius: 8px; padding: 10px 14px;
}
.fusion-overview-field-header {
    display: flex; align-items: center; gap: 8px; margin-bottom: 6px;
}
.fusion-overview-field-name { font-weight: 600; font-size: 0.9rem; color: var(--text); }
.fusion-overview-field-farm { font-size: 0.8rem; color: var(--text-muted); flex: 1; }
.fusion-overview-field-sensors { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 6px; }
.fusion-overview-contradiction {
    background: rgba(220, 38, 38, 0.08); border-left: 3px solid #dc2626;
    padding: 6px 10px; border-radius: 4px; margin-top: 6px;
}
.fusion-overview-contradiction-tag {
    font-size: 0.75rem; font-weight: 600; color: #991b1b;
}
.fusion-overview-contradiction-desc {
    font-size: 0.8rem; color: var(--text); line-height: 1.4;
}

/* ── Dashboard Summary Panel ── */
.dashboard-summary {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 20px;
    margin-bottom: 20px;
}
.dashboard-summary-header {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 16px;
}
.dashboard-summary-title {
    font-weight: 700;
    font-size: 1.1rem;
    color: var(--text);
    margin: 0;
}
.dashboard-summary-farm-name {
    font-size: 0.85rem;
    color: var(--text-muted);
}
.dashboard-summary-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 16px;
}
.summary-stat {
    text-align: center;
    padding: 12px 8px;
    background: var(--bg);
    border-radius: 8px;
}
.summary-stat-value {
    font-size: 1.6rem;
    font-weight: 800;
    color: var(--text);
    font-family: 'Inter', monospace;
}
.summary-stat-value.health-good { color: var(--accent); }
.summary-stat-value.health-warning { color: #f59e0b; }
.summary-stat-value.health-critical { color: #ef4444; }
.summary-stat-label {
    font-size: 0.75rem;
    color: var(--text-muted);
    margin-top: 4px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.summary-alerts-title {
    font-size: 0.85rem;
    font-weight: 600;
    color: #ef4444;
    margin-bottom: 8px;
}
.summary-alert-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    border-bottom: 1px solid var(--border);
}
.summary-alert-item:last-child { border-bottom: none; }
.summary-alert-name {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--text);
    flex: 1;
}
.summary-alert-score {
    font-size: 0.8rem;
    padding: 2px 8px;
    border-radius: 4px;
}
.summary-alert-trend {
    font-size: 0.8rem;
    color: var(--text-muted);
}
@media (max-width: 600px) {
    .dashboard-summary-stats {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* ── ECONOMIC IMPACT CARD ── */
.economic-impact-panel {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 20px;
    margin-bottom: 16px;
}
.econ-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}
.econ-title {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--text);
    margin: 0;
}
.econ-farm-name {
    font-size: 0.85rem;
    color: var(--text-muted);
}
.econ-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-bottom: 16px;
}
.econ-stat {
    text-align: center;
    padding: 12px 8px;
    background: var(--bg);
    border-radius: 8px;
}
.econ-stat-value {
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--accent);
    font-family: 'JetBrains Mono', monospace;
}
.econ-stat-label {
    font-size: 0.75rem;
    color: var(--text-muted);
    margin-top: 4px;
}
.econ-total {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    background: linear-gradient(135deg, rgba(0,200,150,0.08), rgba(0,200,150,0.02));
    border: 1px solid rgba(0,200,150,0.2);
    border-radius: 8px;
    margin-bottom: 10px;
}
.econ-total-label {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--text);
}
.econ-total-value {
    font-size: 1.4rem;
    font-weight: 800;
    color: var(--accent);
    font-family: 'JetBrains Mono', monospace;
}
.econ-nota {
    font-size: 0.8rem;
    color: var(--text-muted);
    font-style: italic;
}
@media (max-width: 600px) {
    .econ-stats {
        grid-template-columns: 1fr;
    }
}

/* ── SENSOR HISTORY TIMELINE (NDVI, thermal, health drill-down) ── */
.sensor-timeline { display: flex; flex-direction: column; gap: 0; }
.sensor-timeline-item {
    display: flex; gap: 16px; padding: 12px 0;
    border-bottom: 1px solid var(--border);
}
.sensor-timeline-item:last-child { border-bottom: none; }
.sensor-timeline-date {
    min-width: 80px; font-size: 0.78rem; color: var(--text-muted);
    font-weight: 600; padding-top: 2px;
}
.sensor-timeline-body { flex: 1; }
.sensor-timeline-header {
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
    cursor: pointer; user-select: none;
}
.sensor-timeline-header:hover { opacity: 0.85; }
.sensor-timeline-summary { font-size: 0.82rem; color: var(--text-muted); }
.sensor-timeline-expand {
    font-size: 0.65rem; color: var(--text-muted); transition: transform 0.2s;
    margin-left: auto;
}
.sensor-timeline-detail {
    display: none; margin-top: 8px;
}
.sensor-timeline-detail.open { display: block; }
.sensor-timeline-zones {
    margin-top: 8px;
}
.sensor-timeline-alert {
    font-size: 0.8rem; margin-top: 6px;
    padding: 4px 8px; border-radius: 4px;
    display: inline-block;
}
.sensor-latest-label {
    font-size: 0.65rem; text-transform: uppercase; letter-spacing: 0.05em;
    color: var(--text-muted); margin-bottom: 8px;
}
.sensor-history-label {
    font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.05em;
    color: var(--text-muted); margin-top: 16px; margin-bottom: 4px;
    border-top: 1px solid var(--border); padding-top: 12px;
}

/* ── Guided Tour ── */
.tour-overlay {
    position: fixed; top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0, 0, 0, 0.6);
    z-index: 9998;
}
.tour-highlight {
    position: relative;
    z-index: 9999;
    box-shadow: 0 0 0 4px var(--green, #16a34a), 0 0 24px rgba(22, 163, 74, 0.3);
    border-radius: 8px;
}
.tour-tooltip {
    z-index: 10000;
    background: #1a1a2e;
    border: 1px solid #2a2a3a;
    border-radius: 12px;
    padding: 20px;
    max-width: 360px;
    min-width: 260px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
    font-family: 'Inter', system-ui, sans-serif;
    color: #e5e7eb;
}
.tour-tooltip-header {
    display: flex; justify-content: space-between; align-items: center;
    margin-bottom: 8px;
}
.tour-tooltip-counter {
    font-size: 0.7rem; font-weight: 700; text-transform: uppercase;
    letter-spacing: 1px; color: #16a34a;
}
.tour-tooltip-close {
    background: none; border: none; color: #9ca3af; font-size: 1.3rem;
    cursor: pointer; padding: 0 4px; line-height: 1;
}
.tour-tooltip-close:hover { color: #fff; }
.tour-tooltip-title {
    font-size: 1.05rem; font-weight: 700; color: #fff; margin-bottom: 6px;
}
.tour-tooltip-body {
    font-size: 0.85rem; color: #9ca3af; line-height: 1.5; margin-bottom: 16px;
}
.tour-tooltip-nav {
    display: flex; justify-content: space-between; gap: 8px;
}
.tour-tooltip-btn {
    padding: 8px 16px; border-radius: 6px; font-size: 0.8rem;
    font-weight: 600; cursor: pointer; border: none; transition: all 0.2s;
}
.tour-btn-prev {
    background: transparent; color: #9ca3af; border: 1px solid #2a2a3a;
}
.tour-btn-prev:hover:not(:disabled) { border-color: #e5e7eb; color: #e5e7eb; }
.tour-btn-prev:disabled { opacity: 0.3; cursor: not-allowed; }
.tour-btn-next {
    background: #16a34a; color: #fff;
}
.tour-btn-next:hover { background: #15803d; }
@media (max-width: 640px) {
    .tour-tooltip { max-width: calc(100vw - 32px); min-width: 200px; }
}

/* ── Treatment Timing Card ─────────────────────────────────── */
.timing-rain-warning {
    background: rgba(239, 68, 68, 0.15); color: #fca5a5; padding: 8px 12px;
    border-radius: 6px; margin-bottom: 10px; font-size: 0.85rem;
}
.timing-forecast {
    display: flex; gap: 8px; margin-bottom: 12px;
}
.timing-forecast-day {
    flex: 1; background: #1e1e2e; border-radius: 6px; padding: 8px;
    text-align: center; font-size: 0.8rem; color: #9ca3af;
}
.timing-rain-day {
    border: 1px solid rgba(96, 165, 250, 0.4); background: rgba(96, 165, 250, 0.08);
}
.timing-forecast-label { display: block; font-weight: 600; color: #e5e7eb; margin-bottom: 2px; }
.timing-forecast-temp { display: block; }
.timing-forecast-rain { display: block; color: #60a5fa; font-size: 0.75rem; }
.timing-card {
    background: #1e1e2e; border-radius: 8px; padding: 12px;
    margin-bottom: 8px;
}
.timing-card-type {
    font-weight: 600; color: #e5e7eb; margin-bottom: 6px; font-size: 0.9rem;
}
.timing-card-best {
    display: flex; gap: 12px; align-items: baseline; margin-bottom: 6px;
}
.timing-best-day {
    font-size: 1.1rem; font-weight: 700; color: #16a34a;
}
.timing-best-time { color: #9ca3af; font-size: 0.85rem; }
.timing-card-reason { color: #9ca3af; font-size: 0.82rem; margin-bottom: 6px; }
.timing-avoid {
    color: #fca5a5; font-size: 0.82rem; margin-bottom: 6px;
}
.timing-card-treatments { display: flex; flex-wrap: wrap; gap: 4px; }
.timing-treatment-name {
    background: rgba(22, 163, 74, 0.12); color: #86efac; padding: 2px 8px;
    border-radius: 4px; font-size: 0.75rem;
}

/* ── Multi-field comparison table ── */
.field-comparison-panel {
    background: var(--card-bg, #141414); border-radius: 12px; padding: 20px;
    margin: 16px auto; max-width: 1200px; border: 1px solid rgba(255,255,255,0.06);
}
.comparison-header { margin-bottom: 16px; }
.comparison-title { font-size: 1.1rem; font-weight: 600; color: #e5e5e5; margin: 0; }
.comparison-table { width: 100%; border-collapse: collapse; font-size: 0.88rem; }
.comparison-table thead th {
    text-align: left; padding: 10px 12px; color: #888; font-weight: 500;
    border-bottom: 1px solid rgba(255,255,255,0.08); font-size: 0.8rem; text-transform: uppercase;
    letter-spacing: 0.04em;
}
.comparison-sortable { cursor: pointer; user-select: none; white-space: nowrap; }
.comparison-sortable:hover { color: #ccc; }
.comparison-table tbody td {
    padding: 10px 12px; border-bottom: 1px solid rgba(255,255,255,0.04); color: #d4d4d4;
}
.comparison-row:hover { background: rgba(255,255,255,0.03); }
.comparison-field-name { font-weight: 500; color: #e5e5e5; }
.comparison-field-crop { font-size: 0.75rem; color: #888; margin-top: 2px; }
.comparison-completeness { display: flex; align-items: center; gap: 8px; }
.comparison-completeness-bar {
    flex: 1; height: 6px; background: rgba(255,255,255,0.08); border-radius: 3px;
    overflow: hidden; min-width: 40px; max-width: 80px;
}
.comparison-completeness-fill {
    height: 100%; background: var(--play-green, #00c896); border-radius: 3px;
    transition: width 0.3s ease;
}
.comparison-completeness-pct { font-size: 0.78rem; color: #888; min-width: 30px; }
@media (max-width: 640px) {
    .comparison-table { font-size: 0.78rem; }
    .comparison-table thead th, .comparison-table tbody td { padding: 8px 6px; }
}

/* ── Status Dashboard ── */
.status-check-row {
    display: flex; align-items: center; justify-content: space-between;
    padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,0.06);
}
.status-check-row:last-child { border-bottom: none; }
.status-check-label { color: #ccc; font-size: 0.9rem; }
.status-check-indicator {
    width: 12px; height: 12px; border-radius: 50%;
    background: #444; display: inline-block;
}
.status-check-indicator.status-ok { background: var(--play-green, #00c896); }
.status-check-indicator.status-err { background: #e74c3c; }
.status-ts { font-family: 'Inter', monospace; font-size: 0.85rem; }
.status-ts.status-fresh { color: var(--play-green, #00c896); }
.status-ts.status-aging { color: var(--watch-yellow, #f0b429); }
.status-ts.status-stale { color: #666; }
.status-badge-ok { background: var(--play-green, #00c896) !important; color: #000 !important; }
.status-badge-err { background: #e74c3c !important; color: #fff !important; }
.status-ep-badge {
    font-size: 0.78rem; padding: 2px 8px; border-radius: 4px;
    font-family: 'Inter', monospace;
}
.status-ep-ok { background: rgba(0,200,150,0.15); color: var(--play-green, #00c896); }
.status-ep-err { background: rgba(231,76,60,0.15); color: #e74c3c; }

/* -- Weather Forecast Card -- */
.weather-current {
    display: flex; flex-wrap: wrap; align-items: baseline; gap: 12px;
    padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,0.06);
    margin-bottom: 12px;
}
.weather-current-temp { font-size: 2rem; font-weight: 700; color: #f3f4f6; }
.weather-current-desc { font-size: 1rem; color: #9ca3af; }
.weather-current-details { display: flex; gap: 14px; width: 100%; margin-top: 4px; }
.weather-detail { font-size: 0.82rem; color: #9ca3af; }
.weather-rain { color: #60a5fa; font-weight: 600; }
.weather-forecast-title { font-size: 0.82rem; font-weight: 600; color: #6b7280; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 8px; }
.weather-forecast-days { display: flex; flex-direction: column; gap: 6px; }
.weather-day {
    display: grid; grid-template-columns: 80px 1fr 50px 120px auto auto;
    align-items: center; gap: 8px; padding: 6px 0;
    border-bottom: 1px solid rgba(255,255,255,0.04);
}
.weather-day-label { font-weight: 600; color: #e5e7eb; font-size: 0.85rem; }
.weather-day-bar-track { height: 6px; background: rgba(255,255,255,0.06); border-radius: 3px; overflow: hidden; }
.weather-day-bar { height: 100%; background: linear-gradient(90deg, #f59e0b, #ef4444); border-radius: 3px; transition: width 0.3s; }
.weather-day-temp { font-weight: 600; color: #f3f4f6; font-size: 0.88rem; text-align: right; }
.weather-day-desc { color: #9ca3af; font-size: 0.82rem; }
.weather-day-rain-amt { color: #60a5fa; font-size: 0.78rem; font-weight: 600; }
.weather-day-humidity { color: #6b7280; font-size: 0.78rem; }
.weather-day-rain { background: rgba(96,165,250,0.06); border-radius: 4px; padding: 6px 4px; }
@media (max-width: 700px) {
    .weather-day { grid-template-columns: 60px 1fr 40px; gap: 4px; }
    .weather-day-desc, .weather-day-rain-amt, .weather-day-humidity { display: none; }
}

/* === Notification History === */
.notif-filters { display: flex; gap: 12px; margin-bottom: 20px; flex-wrap: wrap; }
.notif-filter-select { background: #1e293b; color: #e5e7eb; border: 1px solid rgba(255,255,255,0.08); border-radius: 8px; padding: 8px 14px; font-size: 0.9rem; cursor: pointer; }
.notif-filter-select:focus { outline: none; border-color: #22c55e; }
.notif-list { display: flex; flex-direction: column; gap: 12px; }
.notif-card { background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06); border-radius: 12px; padding: 16px 20px; border-left: 4px solid #6b7280; }
.notif-card.notif-severity-critical { border-left-color: #ef4444; }
.notif-card.notif-severity-warning { border-left-color: #f59e0b; }
.notif-card.notif-severity-info { border-left-color: #60a5fa; }
.notif-card.notif-acknowledged { opacity: 0.6; }
.notif-card-header { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; flex-wrap: wrap; }
.notif-type-badge { background: rgba(34,197,94,0.12); color: #22c55e; padding: 2px 10px; border-radius: 6px; font-size: 0.78rem; font-weight: 600; }
.notif-severity-badge { padding: 2px 10px; border-radius: 6px; font-size: 0.78rem; font-weight: 600; text-transform: uppercase; }
.notif-severity-badge.notif-severity-critical { background: rgba(239,68,68,0.15); color: #ef4444; }
.notif-severity-badge.notif-severity-warning { background: rgba(245,158,11,0.15); color: #f59e0b; }
.notif-severity-badge.notif-severity-info { background: rgba(96,165,250,0.15); color: #60a5fa; }
.notif-farm-name { color: #9ca3af; font-size: 0.85rem; }
.notif-date { color: #6b7280; font-size: 0.82rem; margin-left: auto; }
.notif-message { color: #d1d5db; font-size: 0.92rem; line-height: 1.5; margin: 0; }
.notif-card-footer { margin-top: 10px; display: flex; justify-content: flex-end; }
.notif-ack-btn { background: rgba(34,197,94,0.1); color: #22c55e; border: 1px solid rgba(34,197,94,0.3); border-radius: 6px; padding: 5px 14px; font-size: 0.82rem; font-weight: 600; cursor: pointer; transition: background 0.15s; }
.notif-ack-btn:hover { background: rgba(34,197,94,0.2); }
.notif-ack-btn:disabled { opacity: 0.5; cursor: not-allowed; }
.notif-ack-badge { background: rgba(34,197,94,0.12); color: #22c55e; padding: 3px 12px; border-radius: 6px; font-size: 0.78rem; font-weight: 600; }
.notif-empty { text-align: center; color: #6b7280; padding: 40px 20px; font-size: 0.95rem; }

/* ── Field Boundary Map ── */
#field-map { height: 320px; width: 100%; border-radius: 8px; z-index: 0; }
@media (max-width: 640px) { #field-map { height: 220px; } }

/* ── Drone Flight Log Table ── */
.flights-table { width: 100%; border-collapse: collapse; font-size: 0.88rem; }
.flights-table thead th {
    text-align: left; padding: 12px 14px; color: #888; font-weight: 500;
    border-bottom: 1px solid rgba(255,255,255,0.08); font-size: 0.8rem; text-transform: uppercase;
    letter-spacing: 0.04em; white-space: nowrap;
}
.flights-table thead th.sortable { cursor: pointer; user-select: none; }
.flights-table thead th.sortable:hover { color: #ccc; }
.flights-table tbody td {
    padding: 10px 14px; border-bottom: 1px solid rgba(255,255,255,0.04); color: #d4d4d4;
}
.flights-table tbody tr:hover { background: rgba(255,255,255,0.03); }
.flights-cell-date { white-space: nowrap; font-weight: 500; color: #e5e5e5; }
.flights-cell-mono { font-family: 'SF Mono', 'Fira Code', monospace; font-size: 0.82rem; }
.flights-drone-badge {
    display: inline-block; padding: 2px 8px; border-radius: 4px; font-size: 0.78rem;
    background: rgba(77, 166, 255, 0.12); color: #4da6ff; white-space: nowrap;
}
.flights-field-link { color: var(--play-green, #00c896); text-decoration: none; }
.flights-field-link:hover { text-decoration: underline; }
.flights-status { font-weight: 500; font-size: 0.82rem; }
.flights-loading, .flights-empty {
    text-align: center; color: #888; padding: 40px 20px; font-size: 0.9rem;
}
@media (max-width: 640px) {
    .flights-table { font-size: 0.78rem; }
    .flights-table thead th, .flights-table tbody td { padding: 8px 6px; }
}

/* == Recommendations Page == */
.recs-cards-grid {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 16px; margin-top: 16px;
}
.recs-card {
    background: var(--card-bg, #141414); border: 1px solid var(--border, #222); border-radius: 10px;
    overflow: hidden; transition: border-color 0.2s;
}
.recs-card:hover { border-color: var(--play-green, #00c896); }
.recs-card-header {
    display: flex; justify-content: space-between; align-items: flex-start; padding: 14px 16px 10px;
    border-bottom: 1px solid var(--border, #222); gap: 8px; flex-wrap: wrap;
}
.recs-card-field { display: flex; flex-direction: column; gap: 2px; }
.recs-field-name { font-weight: 600; font-size: 0.95rem; color: var(--text, #e0e0e0); }
.recs-crop-type { font-size: 0.78rem; color: var(--muted, #888); }
.recs-card-badges { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.recs-badge {
    font-size: 0.72rem; font-weight: 600; padding: 2px 8px; border-radius: 10px;
    text-transform: uppercase; letter-spacing: 0.03em; white-space: nowrap;
}
.recs-badge-urgencia { color: #fff; }
.recs-badge-organic { background: rgba(0, 200, 150, 0.15); color: #00c896; border: 1px solid rgba(0, 200, 150, 0.3); }
.recs-badge-ancestral { background: rgba(77, 166, 255, 0.15); color: #4da6ff; border: 1px solid rgba(77, 166, 255, 0.3); }
.recs-card-body { padding: 12px 16px; display: flex; flex-direction: column; gap: 8px; }
.recs-card-row { display: flex; flex-direction: column; gap: 2px; }
.recs-card-label { font-size: 0.75rem; color: var(--muted, #888); font-weight: 500; text-transform: uppercase; letter-spacing: 0.04em; }
.recs-card-value { font-size: 0.88rem; color: var(--text, #e0e0e0); line-height: 1.4; }
.recs-card-treatment .recs-card-value { color: var(--play-green, #00c896); font-weight: 500; }
.recs-card-footer {
    display: flex; justify-content: space-between; align-items: center; padding: 10px 16px;
    border-top: 1px solid var(--border, #222); gap: 12px; flex-wrap: wrap;
}
.recs-card-cost { font-size: 0.88rem; font-weight: 600; color: var(--play-green, #00c896); }
.recs-card-cost-cad { font-size: 0.78rem; color: var(--muted, #888); }
.recs-health-score { font-weight: 700; }
.recs-region-info {
    background: var(--card-bg, #141414); border: 1px solid var(--border, #222); border-radius: 10px;
    padding: 14px 18px; margin-top: 12px;
}
.recs-region-grid { display: flex; flex-wrap: wrap; gap: 16px 32px; }
.recs-region-item { display: flex; flex-direction: column; gap: 2px; }
.recs-region-notes { flex-basis: 100%; }
.recs-region-label { font-size: 0.72rem; color: var(--muted, #888); text-transform: uppercase; letter-spacing: 0.04em; }
.recs-region-value { font-size: 0.88rem; color: var(--text, #e0e0e0); }
.recs-placeholder, .recs-loading, .recs-empty {
    text-align: center; color: #888; padding: 40px 20px; font-size: 0.9rem; grid-column: 1 / -1;
}
@media (max-width: 640px) {
    .recs-cards-grid { grid-template-columns: 1fr; }
    .recs-card-header { flex-direction: column; }
}

/* ── Management Page ── */
.mgmt-section { background: var(--surface); border-radius: 12px; padding: 24px; margin-bottom: 24px; border: 1px solid var(--border); }
.mgmt-section-title { font-size: 1.1rem; font-weight: 700; margin-bottom: 16px; color: var(--text); }
.mgmt-form { display: flex; flex-direction: column; gap: 12px; }
.mgmt-form-row { display: flex; gap: 12px; flex-wrap: wrap; }
.mgmt-form-group { flex: 1; min-width: 180px; display: flex; flex-direction: column; gap: 4px; }
.mgmt-form-group label { font-size: 0.8rem; font-weight: 600; color: var(--text-muted); }
.mgmt-form-group input,
.mgmt-form-group select {
    padding: 8px 12px; border: 1px solid var(--border); border-radius: 8px;
    background: var(--bg); color: var(--text); font-size: 0.9rem;
}
.mgmt-form-group input:focus,
.mgmt-form-group select:focus { outline: none; border-color: var(--accent); }
.mgmt-form-actions { display: flex; align-items: center; gap: 12px; margin-top: 8px; }
.mgmt-error { color: var(--red); font-size: 0.85rem; }
.mgmt-btn { padding: 8px 20px; border: none; border-radius: 8px; font-weight: 600; font-size: 0.9rem; cursor: pointer; transition: background 0.2s; }
.mgmt-btn-primary { background: var(--accent); color: #fff; }
.mgmt-btn-primary:hover { opacity: 0.9; }
.mgmt-btn-secondary { background: var(--border); color: var(--text); }
.mgmt-btn-secondary:hover { opacity: 0.8; }
.mgmt-btn-danger { background: var(--red); color: #fff; }
.mgmt-btn-danger:hover { opacity: 0.9; }
.mgmt-table-wrap { overflow-x: auto; }
.mgmt-table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
.mgmt-table th { text-align: left; padding: 10px 12px; border-bottom: 2px solid var(--border); color: var(--text-muted); font-weight: 600; font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.04em; }
.mgmt-table td { padding: 10px 12px; border-bottom: 1px solid var(--border); color: var(--text); }
.mgmt-table tr:hover td { background: var(--bg); }
.mgmt-actions-cell { display: flex; gap: 6px; }
.mgmt-btn-sm { padding: 4px 10px; border: none; border-radius: 6px; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: background 0.2s; }
.mgmt-btn-view { background: var(--blue-light); color: var(--blue); }
.mgmt-btn-view:hover { opacity: 0.8; }
.mgmt-btn-edit { background: var(--yellow-light); color: var(--yellow); }
.mgmt-btn-edit:hover { opacity: 0.8; }
.mgmt-btn-delete { background: var(--red-light); color: var(--red); }
.mgmt-btn-delete:hover { opacity: 0.8; }
.mgmt-empty { text-align: center; color: var(--text-muted); padding: 24px; font-size: 0.9rem; }
.mgmt-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.5); display: flex; align-items: center; justify-content: center; z-index: 100; }
.mgmt-dialog { background: var(--surface); border-radius: 12px; padding: 24px; max-width: 400px; width: 90%; border: 1px solid var(--border); }
.mgmt-dialog-wide { max-width: 500px; }
.mgmt-dialog p { margin-bottom: 16px; color: var(--text); font-size: 0.95rem; }
.mgmt-dialog h3 { margin-bottom: 16px; color: var(--text); font-size: 1rem; }
.mgmt-dialog .mgmt-form-group { margin-bottom: 12px; }
.mgmt-dialog-actions { display: flex; gap: 8px; justify-content: flex-end; }
@media (max-width: 640px) {
    .mgmt-form-row { flex-direction: column; }
    .mgmt-actions-cell { flex-direction: column; }
}

/* ── Soil CSV Import ── */
.si-selector-row { display: flex; gap: 16px; flex-wrap: wrap; }
.si-selector-row .mgmt-form-group { flex: 1; min-width: 200px; }
.si-upload-area { padding: 16px 0; }
.si-help-text { color: var(--text-muted); font-size: 0.85rem; margin-bottom: 12px; line-height: 1.5; }
.si-file-input { display: none; }
.si-file-label { display: inline-block; padding: 10px 20px; background: var(--surface); border: 1px dashed var(--border); border-radius: 8px; color: var(--text); cursor: pointer; font-size: 0.9rem; transition: border-color 0.2s; }
.si-file-label:hover { border-color: var(--accent, #00c896); }
.si-preview-wrapper { overflow-x: auto; max-height: 320px; overflow-y: auto; }
.si-status-text { color: var(--text-muted); font-size: 0.85rem; margin-left: 12px; }
.si-results-grid { display: flex; gap: 16px; flex-wrap: wrap; }
.si-result-card { flex: 1; min-width: 140px; padding: 20px; border-radius: 10px; text-align: center; border: 1px solid var(--border); background: var(--surface); }
.si-result-value { display: block; font-size: 2rem; font-weight: 700; margin-bottom: 4px; }
.si-result-imported .si-result-value { color: #00c896; }
.si-result-skipped .si-result-value { color: #f0b429; }
.si-result-errors .si-result-value { color: #e74c3c; }
.si-result-label { color: var(--text-muted); font-size: 0.8rem; }
.si-error-list { display: flex; flex-direction: column; gap: 6px; }
.si-error-row { padding: 8px 12px; background: rgba(231,76,60,0.1); border-radius: 6px; color: #e74c3c; font-size: 0.85rem; }
@media (max-width: 640px) {
    .si-selector-row { flex-direction: column; }
    .si-results-grid { flex-direction: column; }
}

/* ── Treatment Effectiveness Cards ── */
.treatment-effectiveness-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; }
.treatment-effectiveness-card { background: var(--card-bg, #1a1a2e); border: 1px solid var(--border, #2a2a3e); border-radius: 10px; padding: 16px; }
.treatment-effectiveness-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; gap: 8px; }
.treatment-effectiveness-name { font-weight: 600; font-size: 0.95rem; color: var(--text-primary, #fff); }
.treatment-effectiveness-badge { font-size: 0.75rem; padding: 2px 8px; border-radius: 4px; font-weight: 600; }
.treatment-effectiveness-effective { background: rgba(0,200,150,0.15); color: #00c896; }
.treatment-effectiveness-ineffective { background: rgba(231,76,60,0.15); color: #e74c3c; }
.treatment-effectiveness-neutral { background: rgba(150,150,150,0.15); color: #999; }
.treatment-effectiveness-problem { color: var(--text-muted, #888); font-size: 0.85rem; margin-bottom: 12px; }
.treatment-effectiveness-scores { display: flex; align-items: center; justify-content: center; gap: 16px; margin-bottom: 8px; }
.treatment-effectiveness-score-box { text-align: center; }
.treatment-effectiveness-score-label { font-size: 0.7rem; color: var(--text-muted, #888); text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 2px; }
.treatment-effectiveness-score-value { font-size: 1.6rem; font-weight: 700; font-family: 'Courier New', monospace; color: var(--text-primary, #fff); }
.treatment-effectiveness-delta { font-size: 1.4rem; font-weight: 700; font-family: 'Courier New', monospace; padding: 4px 10px; border-radius: 6px; }
.delta-positive { color: #00c896; background: rgba(0,200,150,0.1); }
.delta-negative { color: #e74c3c; background: rgba(231,76,60,0.1); }
.delta-neutral { color: #999; background: rgba(150,150,150,0.1); }
.treatment-effectiveness-date { font-size: 0.8rem; color: var(--text-muted, #888); text-align: right; }

/* ── Economic Impact Page ────────────────────────────────────────── */
.econ-nota { background: rgba(77,166,255,0.08); border: 1px solid rgba(77,166,255,0.2); border-radius: 8px; padding: 12px 16px; margin: 0 0 24px 0; color: #ccc; font-size: 0.95rem; line-height: 1.5; }
.econ-chart-section { background: var(--card-bg, #141414); border-radius: 12px; padding: 24px; margin-bottom: 24px; }
.econ-section-title { font-size: 1.1rem; font-weight: 600; color: var(--text-primary, #fff); margin: 0 0 16px 0; }
.econ-chart-wrapper { position: relative; height: 300px; }
.econ-cards-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; margin-bottom: 24px; }
.econ-card { background: var(--card-bg, #141414); border-radius: 12px; padding: 24px; transition: border-color 0.2s; border: 1px solid rgba(255,255,255,0.06); }
.econ-card:hover { border-color: rgba(77,166,255,0.3); }
.econ-card-icon { font-size: 1.8rem; margin-bottom: 8px; }
.econ-card-title { font-size: 1rem; font-weight: 600; color: var(--text-primary, #fff); margin: 0 0 8px 0; }
.econ-card-desc { font-size: 0.85rem; color: var(--text-muted, #888); line-height: 1.5; margin: 0 0 16px 0; }
.econ-card-value { font-size: 1.4rem; font-weight: 700; font-family: 'Courier New', monospace; color: #00c896; }

/* Alert config sliders */
.alert-slider-group { display: flex; align-items: center; gap: 1rem; margin-top: 0.75rem; }
.alert-slider { flex: 1; accent-color: #00c896; height: 6px; cursor: pointer; }
.alert-slider-val { font-size: 1.3rem; font-weight: 700; font-family: 'Courier New', monospace; color: #fff; min-width: 3rem; text-align: right; }
.alert-save-section { text-align: center; margin: 2rem 0; }

.econ-reference { background: rgba(255,255,255,0.03); border-radius: 8px; padding: 16px; margin-top: 8px; }
.econ-reference p { font-size: 0.8rem; color: var(--text-muted, #888); margin: 0; line-height: 1.5; }

/* ── API Docs Page ──────────────────────────────────────────────── */
.api-quick-links { margin-bottom: 24px; }
.api-links-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; }
.api-link-card { display: block; background: var(--card-bg, #141414); border-radius: 12px; padding: 24px; text-decoration: none; color: inherit; border: 1px solid rgba(255,255,255,0.06); transition: border-color 0.2s, transform 0.15s; }
.api-link-card:hover { border-color: rgba(77,166,255,0.3); transform: translateY(-2px); }
.api-link-icon { font-size: 1.6rem; margin-bottom: 8px; display: block; }
.api-link-card h3 { font-size: 1.05rem; font-weight: 600; color: var(--text-primary, #fff); margin: 0 0 8px 0; }
.api-link-card p { font-size: 0.85rem; color: var(--text-muted, #888); line-height: 1.5; margin: 0; }
.api-categories-section { margin-bottom: 24px; }
.api-categories-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; }
.api-category-card { background: var(--card-bg, #141414); border-radius: 10px; padding: 16px 20px; border: 1px solid rgba(255,255,255,0.06); transition: border-color 0.2s; }
.api-category-card:hover { border-color: rgba(77,166,255,0.2); }
.api-category-header { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.api-category-icon { font-size: 1.2rem; }
.api-category-name { font-size: 0.95rem; font-weight: 600; color: var(--text-primary, #fff); text-transform: capitalize; }
.api-category-count { margin-left: auto; font-size: 0.8rem; font-weight: 500; color: #4da6ff; background: rgba(77,166,255,0.1); padding: 2px 8px; border-radius: 10px; font-family: 'Courier New', monospace; }
.api-category-desc { font-size: 0.82rem; color: var(--text-muted, #888); line-height: 1.4; margin: 0; }
.api-loading { color: var(--text-muted, #888); font-size: 0.9rem; padding: 24px; text-align: center; }

/* ── Timeline page ────────────────────────────────── */
.tl-legend { display: flex; gap: 24px; padding: 12px 0; margin-bottom: 8px; }
.tl-legend-item { display: flex; align-items: center; gap: 8px; font-size: 0.85rem; color: var(--text-muted, #888); }
.tl-dot { width: 12px; height: 12px; border-radius: 50%; display: inline-block; }
.tl-dot-health { background: #00c896; }
.tl-dot-treatment { background: #4da6ff; }

.tl-timeline { position: relative; padding-left: 32px; }
.tl-timeline::before { content: ''; position: absolute; left: 14px; top: 0; bottom: 0; width: 2px; background: rgba(255,255,255,0.08); }

.tl-event { position: relative; margin-bottom: 20px; }
.tl-event-marker { position: absolute; left: -26px; top: 4px; width: 14px; height: 14px; border-radius: 50%; border: 2px solid rgba(255,255,255,0.1); }
.tl-marker-treatment { background: #4da6ff; }

.tl-event-content { background: var(--card-bg, #141414); border-radius: 10px; padding: 16px 20px; border: 1px solid rgba(255,255,255,0.06); transition: border-color 0.2s; }
.tl-event-content:hover { border-color: rgba(255,255,255,0.12); }
.tl-event-health .tl-event-content { border-left: 3px solid #00c896; }
.tl-event-treatment .tl-event-content { border-left: 3px solid #4da6ff; }

.tl-event-date { font-size: 0.78rem; color: var(--text-muted, #888); margin-bottom: 4px; font-family: 'Courier New', monospace; }
.tl-event-title { font-size: 0.95rem; font-weight: 600; color: var(--text-primary, #fff); margin-bottom: 6px; }
.tl-event-detail { font-size: 0.82rem; color: var(--text-muted, #888); margin-bottom: 4px; line-height: 1.4; }

.tl-event-badges { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 6px; }
.tl-badge { font-size: 0.72rem; font-weight: 600; padding: 2px 10px; border-radius: 10px; text-transform: uppercase; }
.tl-badge-organic { background: rgba(0,200,150,0.15); color: #00c896; }
.tl-urgencia-alta { background: rgba(231,76,60,0.15); color: #e74c3c; }
.tl-urgencia-media { background: rgba(240,180,41,0.15); color: #f0b429; }
.tl-urgencia-baja { background: rgba(77,166,255,0.15); color: #4da6ff; }

.tl-breakdown { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.tl-breakdown-item { font-size: 0.75rem; color: var(--text-muted, #888); background: rgba(255,255,255,0.04); padding: 2px 8px; border-radius: 6px; font-family: 'Courier New', monospace; }

.tl-no-data { color: var(--text-muted, #888); font-size: 0.9rem; padding: 24px; text-align: center; }

/* ── Soil History Page ── */
.soil-charts { margin-top: 24px; }
.soil-chart-row { display: flex; gap: 20px; margin-bottom: 20px; flex-wrap: wrap; }
.soil-chart-card { flex: 1; min-width: 300px; background: var(--surface, #1a1f2e); border-radius: 12px; padding: 20px; border: 1px solid rgba(255,255,255,0.06); }
.soil-chart-card canvas { height: 260px !important; }
.soil-chart-wide { flex: 2; min-width: 600px; }
.soil-chart-title { color: var(--text, #f0f0f0); font-size: 0.95rem; font-weight: 600; margin-bottom: 12px; }
.soil-section-title { color: var(--text, #f0f0f0); font-size: 1.05rem; font-weight: 700; margin-bottom: 14px; }
.soil-table-container { margin-top: 24px; background: var(--surface, #1a1f2e); border-radius: 12px; padding: 20px; border: 1px solid rgba(255,255,255,0.06); overflow-x: auto; }
.soil-table { width: 100%; border-collapse: collapse; font-size: 0.88rem; }
.soil-table th { text-align: left; padding: 10px 12px; color: var(--text-muted, #888); font-weight: 600; border-bottom: 1px solid rgba(255,255,255,0.08); text-transform: uppercase; font-size: 0.75rem; letter-spacing: 0.5px; }
.soil-table td { padding: 10px 12px; color: var(--text, #f0f0f0); border-bottom: 1px solid rgba(255,255,255,0.04); }
.soil-table tr:hover td { background: rgba(255,255,255,0.03); }
@media (max-width: 768px) { .soil-chart-wide { min-width: 100%; } .soil-chart-card { min-width: 100%; } }

/* ════════════════════════════════════════════════════════════════
   FOOTER
   ════════════════════════════════════════════════════════════════ */
.cultivos-footer {
    margin-top: 60px;
    padding: 32px 24px;
    border-top: 1px solid var(--border, #e5e7eb);
    text-align: center;
    font-size: 0.78rem;
    color: var(--text-muted, #6b7280);
    line-height: 1.8;
}
.intel-body .cultivos-footer {
    border-color: var(--intel-border, #2a2d3a);
    color: var(--intel-muted, #9ca3af);
}
.cultivos-footer-logo {
    font-weight: 800;
    font-size: 0.9rem;
    color: var(--text, #1a1a1a);
    letter-spacing: -0.3px;
}
.cultivos-footer-logo span { color: var(--green); }
.intel-body .cultivos-footer-logo { color: var(--intel-text, #e5e7eb); }
.cultivos-footer-sep {
    display: inline-block;
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: var(--text-muted, #6b7280);
    vertical-align: middle;
    margin: 0 8px;
}
.intel-body .cultivos-footer-sep { background: var(--intel-muted, #9ca3af); }
.cultivos-footer a { color: var(--green); text-decoration: none; }
.cultivos-footer a:hover { text-decoration: underline; }

/* ════════════════════════════════════════════════════════════════
   LOGIN PAGE
   ════════════════════════════════════════════════════════════════ */
.login-page { display: flex; align-items: center; justify-content: center; min-height: 100vh; }
.login-container { width: 100%; max-width: 400px; padding: 24px; }
.login-logo { text-align: center; margin-bottom: 32px; }
.login-logo h1 { font-size: 2rem; font-weight: 800; letter-spacing: -1px; }
.login-logo h1 span { color: var(--green); }
.login-logo p { color: var(--text-muted); font-size: 0.9rem; margin-top: 4px; }
.login-card {
    background: var(--surface); border: 1px solid var(--border);
    border-radius: var(--radius); padding: 32px 24px;
    animation: cultivFadeUp 0.5s ease forwards;
}
.login-card h2 { font-size: 1.25rem; font-weight: 700; margin-bottom: 24px; text-align: center; }
.login-field { margin-bottom: 16px; }
.login-field label { display: block; font-size: 0.85rem; font-weight: 600; margin-bottom: 6px; color: var(--text-muted); }
.login-field input, .login-field select {
    width: 100%; padding: 10px 12px; border: 1px solid var(--border);
    border-radius: 8px; font-size: 0.95rem; font-family: inherit;
    background: var(--bg); color: var(--text); outline: none; transition: border 0.2s;
}
.login-field input:focus, .login-field select:focus { border-color: var(--green); }
.login-submit {
    width: 100%; padding: 12px; margin-top: 8px;
    background: var(--green); color: #fff; border: none;
    border-radius: 8px; font-size: 1rem; font-weight: 600;
    cursor: pointer; transition: background 0.2s;
}
.login-submit:hover { background: var(--green-dark); }
.login-submit:disabled { opacity: 0.6; cursor: not-allowed; }
.login-error {
    display: none; margin-top: 12px; padding: 10px 12px;
    background: var(--red-light); color: var(--red);
    border-radius: 8px; font-size: 0.85rem; text-align: center;
}
.login-error.visible { display: block; }
.login-toggle { text-align: center; margin-top: 16px; font-size: 0.85rem; color: var(--text-muted); }
.login-toggle a { color: var(--green); cursor: pointer; text-decoration: none; font-weight: 600; }
.login-toggle a:hover { text-decoration: underline; }
.register-fields { display: none; }
.register-fields.visible { display: block; }

@media (max-width: 640px) {
    .cultivos-footer { padding: 24px 16px; font-size: 0.72rem; }
    .cultivos-footer-sep { display: none; }
    .cultivos-footer-logo { display: block; margin-bottom: 6px; }
}