/* GrainGenius - Cash App Style (Emily Approved) */
:root {
    --primary-green: #16A34A;
    --secondary-green: #15803D;
    --accent-green: #22C55E;
    --light-green: #F0FDF4;
    --pop-red: #DC2626;
    --soft-red: #FEE2E2;
    --bg-main: #F8FAFC;
    --bg-cream: #F8FAFC;
    --card-bg: #FFFFFF;
    --text-dark: #0F172A;
    --text-medium: #475569;
    --text-light: #64748B;
    --border: #E2E8F0;
    --white: #FFFFFF;
    --shadow: 0 1px 3px rgba(0,0,0,0.08);
    --shadow-lg: 0 4px 12px rgba(0,0,0,0.08);
    --radius: 20px;
    --radius-sm: 16px;
    --radius-pill: 28px;
}

/* ─── Cash App: Hero Sections ─── */
.hero-section {
  background: var(--primary-green);
  color: #fff;
  padding: 24px 24px 36px;
  text-align: center;
  border-radius: 0 0 32px 32px;
}
.hero-section-left {
  background: var(--primary-green);
  color: #fff;
  padding: 24px 24px 36px;
  text-align: left;
  border-radius: 0 0 32px 32px;
}
.hero-icon { font-size: 40px; margin-bottom: 8px; }
.hero-label { font-size: 13px; font-weight: 600; opacity: 0.85; text-transform: uppercase; letter-spacing: 1px; }
.hero-big { font-size: 42px; font-weight: 900; margin: 4px 0; font-family: 'Inter', sans-serif; }
.hero-sub { font-size: 15px; opacity: 0.9; }
.hero-btn {
  display: inline-block; margin-top: 20px; padding: 14px 40px;
  background: #fff; color: var(--primary-green); font-weight: 800;
  font-size: 15px; border-radius: var(--radius-pill); border: none;
  cursor: pointer; transition: transform 0.15s ease;
}
.hero-btn:active { transform: scale(0.97); }

/* ─── Cash App: 2-Column Tile Grid ─── */
.tile-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  padding: 20px;
}
.tile-card {
  background: #fff;
  border-radius: var(--radius);
  padding: 20px 16px;
  text-align: center;
  border: 1px solid var(--border);
  cursor: pointer;
  transition: transform 0.15s ease;
}
.tile-card:active { transform: scale(0.97); }
.tile-card-icon { font-size: 28px; margin-bottom: 8px; }
.tile-card-label { font-size: 14px; font-weight: 700; color: var(--text-dark); font-family: 'Inter', sans-serif; }
.tile-card-value { font-size: 12px; color: var(--text-light); margin-top: 4px; font-family: 'Inter', sans-serif; }
.tile-card-badge {
  display: inline-block; font-size: 10px; font-weight: 700;
  padding: 2px 8px; border-radius: 8px; margin-top: 6px;
}
.badge-green { background: #DCFCE7; color: var(--primary-green); }
.badge-red { background: #FEE2E2; color: var(--pop-red); }
.badge-blue { background: #DBEAFE; color: #2563EB; }

/* ─── Cash App: Section Headers ─── */
.section-title-cash {
  font-size: 13px;
  font-weight: 700;
  color: #94A3B8;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 12px;
  font-family: 'Inter', sans-serif;
}

/* ─── Cash App: Quote Bar ─── */
.quote-bar {
  margin: 0 20px 20px;
  padding: 12px 16px;
  background: #F1F5F9;
  border-radius: 20px;
  font-size: 12px;
  color: var(--text-light);
  font-style: italic;
  text-align: center;
  font-family: 'Inter', sans-serif;
}

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

body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    background: var(--bg-main);
    color: var(--text-dark);
    min-height: 100vh;
    min-height: 100dvh;
}

#app {
    max-width: 430px;
    margin: 0 auto;
    min-height: 100vh;
    min-height: 100dvh;
    background: var(--white);
    border-bottom: 1px solid var(--border);
    position: relative;
    overflow: hidden;
}

.screen {
    display: none;
    min-height: 100vh;
    min-height: 100dvh;
    padding-bottom: 80px;
}

.screen.active {
    display: flex;
    flex-direction: column;
}

/* Welcome Screen */
#welcome-screen {
    background: var(--white);
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 40px 24px;
}

.logo-bubble {
    width: 120px;
    height: 120px;
    background: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

.corn-icon {
    font-size: 64px;
    display: none;
}

.logo-bubble img.app-logo {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#welcome-screen h1 {
    font-size: 32px;
    font-weight: 700;
    color: var(--primary-green);
    margin-bottom: 8px;
}

.tagline {
    font-size: 18px;
    font-weight: 600;
    color: var(--text-medium);
    margin-bottom: 8px;
}

.subtext {
    font-size: 14px;
    color: var(--text-light);
    margin-bottom: 40px;
}

.btn-primary {
    background: var(--primary-green);
    color: var(--white);
    border: none;
    padding: 14px 32px;
    border-radius: var(--radius-pill);
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    box-shadow: 0 2px 8px rgba(22, 163, 74, 0.25);
    transition: all 0.15s ease;
    font-family: 'Inter', sans-serif;
    min-height: 44px;
}
.btn-primary:active { transform: scale(0.97); }

.btn-primary:hover {
    transform: translateY(-2px);
}

.btn-primary .arrow {
    font-size: 20px;
}

.demo-note {
    margin-top: 24px;
    font-size: 12px;
    color: var(--text-light);
}

/* Progress Bar */
.progress-bar {
    height: 4px;
    background: #E2E8F0;
    width: 100%;
}

.progress-fill {
    height: 100%;
    background: var(--primary-green);
    transition: width 0.3s;
}

/* Onboarding Screens */
.onboarding-content {
    flex: 1;
    padding: 24px;
    overflow-y: auto;
}

.step-badge {
    display: inline-block;
    background: var(--light-green);
    color: var(--secondary-green);
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    margin-bottom: 16px;
}

.onboarding-content h2 {
    font-size: 28px;
    font-weight: 700;
    margin-bottom: 8px;
    color: var(--text-dark);
}

.step-desc {
    font-size: 14px;
    color: var(--text-light);
    margin-bottom: 32px;
}

/* Form Elements */
.input-group {
    margin-bottom: 24px;
}

.input-group label {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: var(--text-medium);
    margin-bottom: 8px;
}

.input-group input,
.input-group select {
    width: 100%;
    padding: 16px;
    border: 1px solid #E2E8F0;
    border-radius: 8px;
    font-size: 16px;
    transition: border-color 0.2s;
}

.input-group input:focus,
.input-group select:focus {
    outline: none;
    border-color: var(--primary-green);
}

.radius-slider {
    display: flex;
    align-items: center;
    gap: 16px;
}

.radius-slider input[type="range"] {
    flex: 1;
}

.radius-value {
    font-weight: 600;
    color: var(--secondary-green);
    min-width: 80px;
}

/* Buttons */
.button-row {
    display: flex;
    gap: 12px;
    margin-top: auto;
    padding-top: 24px;
}

.btn-secondary {
    flex: 1;
    background: var(--white);
    color: var(--text-dark);
    border: 1px solid var(--border);
    padding: 14px 16px;
    border-radius: var(--radius-pill);
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s ease;
    font-family: 'Inter', sans-serif;
    min-height: 44px;
}
.btn-secondary:active { transform: scale(0.97); }

.btn-text {
    background: none;
    border: none;
    color: var(--secondary-green);
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    margin: 16px 0;
}

.btn-large {
    width: 100%;
    justify-content: center;
}

/* Dashboard */
#screen-dashboard {
    background: var(--bg-cream);
}

.dashboard-content {
    padding: 24px;
    padding-bottom: 120px;
    flex: 1;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.icon-btn {
    background: none;
    border: none;
    font-size: 20px;
    cursor: pointer;
    padding: 8px;
    color: var(--text-medium);
    transition: color 0.2s ease;
}
.icon-btn:hover { color: var(--text-dark); }
.icon-btn svg { display: block; }

/* Price Cards */
section {
    margin-bottom: 24px;
}

section h2 {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 16px;
    color: var(--text-dark);
}

.price-cards {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.price-card {
    background: var(--white);
    border-radius: 16px;
    padding: 20px;
    border-bottom: 1px solid var(--border);
    transition: box-shadow 0.2s ease;
}
.price-card:hover { box-shadow: 0 2px 8px rgba(0,0,0,0.04); }

.price-card.corn {
    border-left: 4px solid var(--secondary-green);
}

.price-card.soy {
    border-left: 4px solid var(--text-light);
}

.price-header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 8px;
}

.price-crop {
    font-size: 12px;
    font-weight: 600;
}

.price-contract {
    font-size: 11px;
    color: var(--text-light);
}

.price-value {
    font-size: 28px;
    font-weight: 700;
    margin-bottom: 4px;
}

.price-change {
    font-size: 12px;
    font-weight: 600;
    margin-bottom: 8px;
}

.price-change.up {
    color: var(--secondary-green);
}

.price-change.down {
    color: var(--pop-red);
}

.price-context {
    font-size: 11px;
}

.context-below {
    color: var(--pop-red);
    font-weight: 600;
}

.context-above {
    color: var(--secondary-green);
    font-weight: 600;
}

/* Price benchmarking zones */
.price-bench { font-size: 11px; margin-top: 4px; font-weight: 600; }
.price-card.bench-green { border-top: 3px solid #4caf50; }
.price-card.bench-yellow { border-top: 3px solid #94A3B8; }
.price-card.bench-red { border-top: 3px solid #f44336; }
.cop-detail { font-size: 10px; color: #999; margin-left: 4px; }
.profit-per-acre { font-size: 11px; margin-top: 2px; font-weight: 600; }
.profit-per-acre.profit-positive { color: #2e7d32; }
.profit-per-acre.profit-negative { color: #c62828; }

/* Price card expand/collapse */
.price-expand-chevron {
  font-size: 10px;
  color: var(--text-light);
  transition: transform 0.25s ease;
}
.price-expanded .price-expand-chevron { transform: rotate(180deg); }
.price-expanded-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease, opacity 0.25s ease;
  opacity: 0;
  border-top: 1px solid var(--border);
  margin-top: 0;
}
.price-expanded .price-expanded-content {
  max-height: 300px;
  opacity: 1;
  margin-top: 10px;
  padding-top: 10px;
}
.price-detail-row {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  padding: 4px 0;
  color: var(--text-medium);
}
.price-detail-row span:last-child { font-weight: 600; color: var(--text-dark); }
.price-detail-note {
  font-size: 11px;
  color: var(--text-light);
  font-style: italic;
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px solid var(--border);
}

/* Weather Card */
.weather-card { background: var(--white); border-radius: var(--radius); padding: 16px; border-bottom: 1px solid var(--border); }
.weather-current { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.weather-main { display: flex; align-items: center; gap: 8px; }
.weather-icon-lg { font-size: 32px; }
.weather-temp { font-size: 28px; font-weight: 700; color: var(--primary-green); }
.weather-details { display: flex; flex-direction: column; gap: 2px; font-size: 12px; color: #666; text-align: right; }
.weather-spray { font-size: 12px; padding: 6px 10px; border-radius: 6px; margin-bottom: 12px; font-weight: 500; }
.weather-spray.spray-good { background: #e8f5e9; color: #2e7d32; }
.weather-spray.spray-poor { background: #FEE2E2; color: #DC2626; }
.weather-forecast { display: flex; justify-content: space-between; gap: 4px; }
.forecast-day { display: flex; flex-direction: column; align-items: center; gap: 2px; flex: 1; }
.forecast-name { font-size: 11px; font-weight: 600; color: #666; }
.forecast-icon { font-size: 18px; }
.forecast-temps { font-size: 11px; color: #333; }
.forecast-rain { font-size: 10px; color: #1565c0; font-weight: 500; }
.weather-location { font-size: 12px; color: #999; }

/* Weather expandable */
.weather-chevron { font-size: 14px; color: #999; transition: transform 0.2s; margin-left: 8px; }
.weather-expanded .weather-chevron { transform: rotate(180deg); }
.weather-expanded-content { display: none; margin-top: 12px; border-top: 1px solid #eee; padding-top: 12px; }
.weather-expanded .weather-expanded-content { display: block; }
.weather-detail-header { display: grid; grid-template-columns: 50px 28px 70px 42px 56px 36px; gap: 4px; font-size: 10px; font-weight: 600; color: #999; text-transform: uppercase; padding-bottom: 6px; border-bottom: 1px solid #f0f0f0; margin-bottom: 4px; }
.weather-detail-row { display: grid; grid-template-columns: 50px 28px 70px 42px 56px 36px; gap: 4px; align-items: center; padding: 6px 0; border-bottom: 1px solid #f8f8f8; font-size: 13px; }
.wd-day { font-weight: 600; color: #333; }
.wd-icon { font-size: 16px; }
.wd-temps { color: #333; }
.wd-precip { color: #1565c0; }
.wd-wind { color: #666; font-size: 12px; }
.wd-spray-dot { display: inline-block; }
.spray-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
.dot-green { background: #16A34A; }
.dot-red { background: #DC2626; }
.spray-calendar { margin-top: 16px; background: #f8faf8; border-radius: 8px; padding: 12px; }
.spray-cal-title { font-size: 12px; font-weight: 600; color: #333; margin-bottom: 8px; }
.spray-cal-row { display: flex; justify-content: space-between; gap: 4px; }
.spray-cal-day { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.spray-cal-label { font-size: 10px; color: #666; font-weight: 500; }
.spray-cal-legend { font-size: 10px; color: #999; margin-top: 8px; display: flex; align-items: center; gap: 4px; }

/* Dashboard Greeting */
.dashboard-greeting {
  font-size: 22px;
  font-weight: 700;
  color: var(--text-dark);
  padding: 0 0 4px;
}

/* Section Dividers */
.dash-divider {
  height: 1px;
  background: #E2E8F0;
  margin: 4px 0 16px;
}

/* View All Links */
.view-all-link {
  font-size: 13px;
  font-weight: 600;
  color: var(--primary-green);
  text-decoration: none;
  white-space: nowrap;
}
.view-all-link:hover { text-decoration: underline; }

/* Daily Inspiration */
.daily-inspiration { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 16px; background: #F8FAFC; border-radius: 8px; margin-bottom: 8px; }
.inspiration-text { font-size: 13px; font-style: italic; color: #64748B; text-align: center; line-height: 1.4; }
.inspiration-dismiss { background: none; border: none; color: #94A3B8; font-size: 18px; cursor: pointer; padding: 0 4px; line-height: 1; flex-shrink: 0; }

/* Pace Indicator */
.pace-indicator {
  font-size: 12px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 16px;
  white-space: nowrap;
}
.pace-on { background: #DCFCE7; color: #15803D; }
.pace-behind { background: #F1F5F9; color: #475569; }

/* Position detail label */
.sold-label-detail {
  font-size: 13px;
  color: var(--text-medium);
  font-weight: 500;
}

/* Recent Notifications on Dashboard */
.recent-notif-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 12px;
  background: var(--white);
  border-radius: 8px;
  margin-bottom: 8px;
  border: 1px solid var(--border);
  cursor: pointer;
}
.recent-notif-item.notif-unread { border-left: 3px solid #3B82F6; }
.recent-notif-icon { font-size: 14px; flex-shrink: 0; margin-top: 1px; }
.recent-notif-content { flex: 1; min-width: 0; }
.recent-notif-title { font-size: 13px; font-weight: 600; color: var(--text-dark); }
.recent-notif-body { font-size: 12px; color: var(--text-light); margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.recent-notif-time { font-size: 11px; color: var(--text-light); flex-shrink: 0; white-space: nowrap; }

/* Weather Outlooks */
.weather-outlook-section { margin-top: 16px; display: flex; flex-direction: column; gap: 10px; }
.weather-outlook-card { background: #F8FAFC; border: 1px solid #E2E8F0; border-radius: 8px; padding: 12px; }
.outlook-header { font-size: 13px; font-weight: 700; color: #0F172A; margin-bottom: 6px; }
.outlook-text { font-size: 12px; color: #64748B; line-height: 1.5; margin: 0; }
.outlook-source { font-size: 10px; color: #94A3B8; margin-top: 4px; }

/* Farmers Almanac */
.almanac-section { margin-top: 14px; background: #F8FAFC; border: 1px solid #E2E8F0; border-radius: 8px; padding: 12px; }
.almanac-header { font-size: 13px; font-weight: 700; color: #0F172A; margin-bottom: 6px; }
.almanac-text { font-size: 12px; color: #64748B; line-height: 1.5; margin: 0 0 8px 0; }
.almanac-disclaimer { font-size: 10px; color: #94A3B8; font-style: italic; }

/* Soil Temperature */
.soil-temp-section { margin-top: 14px; background: #F8FAFC; border: 1px solid #E2E8F0; border-radius: 8px; padding: 12px; }
.soil-temp-title { font-size: 13px; font-weight: 700; color: #0F172A; margin-bottom: 8px; }
.soil-temp-readings { display: flex; gap: 20px; margin-bottom: 8px; }
.soil-temp-row { display: flex; align-items: center; gap: 6px; }
.soil-depth { font-size: 12px; color: #64748B; font-weight: 500; }
.soil-value { font-size: 14px; font-weight: 700; color: #0F172A; }
.soil-threshold { font-size: 12px; padding: 6px 10px; border-radius: 6px; font-weight: 500; }
.soil-threshold.soil-good { background: #e8f5e9; color: #2e7d32; }
.soil-threshold.soil-marginal { background: #E0F2FE; color: #1565c0; }
.soil-threshold.soil-cold { background: #EFF6FF; color: #1E40AF; }
.soil-threshold.soil-unknown { background: #F1F5F9; color: #64748B; }
.soil-source { font-size: 10px; color: #94A3B8; margin-top: 6px; }
.soil-trend { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; font-size: 12px; }
.soil-trend-label { color: #64748B; font-weight: 500; }
.soil-trend-dir { font-weight: 700; }
.soil-trend-dir.soil-warming { color: #DC2626; }
.soil-trend-dir.soil-cooling { color: #1565c0; }
.soil-trend-vals { color: #94A3B8; font-size: 11px; }
.soil-alert { font-size: 12px; padding: 8px 10px; border-radius: 6px; font-weight: 500; background: #F0FDF4; color: #15803D; margin-bottom: 8px; border: 1px solid #BBF7D0; }

/* Ag Activity Badges */
.ag-badges-row { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.ag-badge { font-size: 11px; font-weight: 600; padding: 3px 8px; border-radius: 6px; white-space: nowrap; }
.ag-badge.ag-ok { background: #F0FDF4; color: #15803D; }
.ag-badge.ag-no { background: #F8FAFC; color: #64748B; }
.ag-badge.ag-warn { background: #FEF2F2; color: #DC2626; }

/* Weather Tabs */
.weather-tab-bar { display: flex; gap: 0; border-bottom: 1px solid #E2E8F0; margin-bottom: 12px; }
.weather-tab { background: none; border: none; padding: 8px 14px; font-size: 13px; font-weight: 600; color: #64748B; cursor: pointer; border-bottom: 2px solid transparent; min-height: 44px; font-family: 'Inter', -apple-system, sans-serif; }
.weather-tab.weather-tab-active { color: #15803D; border-bottom-color: #16A34A; }

/* Ag Activity Cards */
.ag-act-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.ag-act-card { background: #F8FAFC; border: 1px solid #E2E8F0; border-radius: 8px; padding: 10px; display: flex; flex-direction: column; gap: 4px; }
.ag-act-card.ag-act-ok { background: #F0FDF4; border-color: #BBF7D0; }
.ag-act-card.ag-act-no { background: #F8FAFC; border-color: #E2E8F0; }
.ag-act-card.ag-act-warn { background: #FEF2F2; border-color: #FECACA; }
.ag-act-label { font-size: 11px; font-weight: 700; color: #0F172A; text-transform: uppercase; letter-spacing: 0.3px; }
.ag-act-text { font-size: 12px; color: #64748B; line-height: 1.4; }

/* Burn Ban Toggle */
.burn-ban-toggle { margin-top: 12px; padding: 10px; background: #F8FAFC; border-radius: 8px; }
.burn-ban-label { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #0F172A; cursor: pointer; min-height: 44px; }
.burn-ban-label input[type="checkbox"] { width: 18px; height: 18px; accent-color: #16A34A; }

/* Ag Calendar */
.ag-cal-legend { display: flex; gap: 10px; margin-bottom: 10px; flex-wrap: wrap; }
.ag-cal-legend-item { font-size: 11px; font-weight: 600; color: #64748B; padding: 2px 8px; background: #F1F5F9; border-radius: 4px; }
.ag-cal-grid { display: flex; flex-direction: column; gap: 6px; }
.ag-cal-day { background: #fff; border: 1px solid #E2E8F0; border-radius: 8px; padding: 10px; cursor: pointer; }
.ag-cal-day-header { font-size: 13px; font-weight: 600; color: #0F172A; margin-bottom: 6px; }
.ag-cal-icons { display: flex; flex-wrap: wrap; gap: 6px; }
.ag-cal-icon { font-size: 11px; padding: 2px 6px; border-radius: 4px; white-space: nowrap; }
.ag-cal-icon.ag-cal-ok { background: #F0FDF4; color: #15803D; }
.ag-cal-icon.ag-cal-no { background: #F8FAFC; color: #94A3B8; }
.ag-cal-detail { display: none; margin-top: 8px; padding-top: 8px; border-top: 1px solid #E2E8F0; }
.ag-cal-detail.ag-cal-detail-open { display: block; }
.ag-cal-detail-row { display: flex; justify-content: space-between; padding: 4px 0; font-size: 12px; color: #334155; }
.ag-cal-detail-label { font-weight: 600; color: #0F172A; }

/* Elevator Detail */
.elevator-detail { padding: 4px 0; }
.elevator-detail-header h3 { font-size: 18px; font-weight: 700; color: var(--text-dark); margin: 0 0 2px 0; }
.elevator-detail-company { font-size: 13px; color: var(--text-light); margin-bottom: 6px; }
.elevator-detail-meta { display: flex; gap: 12px; font-size: 12px; color: var(--text-medium); margin-bottom: 12px; }
.elevator-detail-address { font-size: 12px; color: var(--text-medium); background: var(--bg-main); padding: 8px 10px; border-radius: 6px; margin-bottom: 12px; }
.elevator-detail-price-box { background: #F0FDF4; border: 1px solid #BBF7D0; border-radius: 16px; padding: 14px; text-align: center; margin-bottom: 14px; }
.elevator-detail-commodity { font-size: 13px; color: var(--text-medium); margin-bottom: 4px; }
.elevator-detail-price { font-size: 28px; font-weight: 800; color: var(--primary-green); }
.elevator-detail-delivery { font-size: 12px; color: var(--text-light); margin-top: 2px; }
.elevator-detail-actions { display: flex; flex-direction: column; gap: 8px; margin-bottom: 12px; }
.btn-call-sell { display: block; text-align: center; padding: 14px; background: var(--primary-green); color: white; font-size: 16px; font-weight: 700; border-radius: 16px; text-decoration: none; letter-spacing: 0.3px; }
.btn-call-sell:active { background: #15803d; }
.btn-email-elevator { display: block; text-align: center; padding: 10px; background: var(--white); color: var(--text-dark); font-size: 14px; font-weight: 600; border-radius: 16px; border: 1.5px solid var(--border); text-decoration: none; }
.btn-map-elevator { display: block; text-align: center; padding: 10px; background: var(--white); color: var(--text-dark); font-size: 14px; font-weight: 600; border-radius: 16px; border: 1.5px solid var(--border); text-decoration: none; }
.elevator-detail-phone { font-size: 12px; color: var(--text-light); text-align: center; margin-bottom: 10px; }
.elevator-detail-close { width: 100%; margin-top: 4px; }

/* Insurance Cards */
.insurance-card { background: var(--white); border-radius: var(--radius); padding: 14px; border-bottom: 1px solid var(--border); margin-bottom: 10px; }
.insurance-card.insurance-above { border-left: 3px solid #4caf50; }
.insurance-card.insurance-below { border-left: 3px solid #f44336; }
.insurance-header { font-weight: 700; font-size: 15px; margin-bottom: 8px; }
.insurance-details { display: flex; flex-direction: column; gap: 4px; }
.insurance-row { display: flex; justify-content: space-between; font-size: 13px; color: #555; }
.insurance-row.insurance-highlight { font-weight: 700; color: #333; }
.insurance-row.insurance-status span.insurance-above { color: #2e7d32; font-weight: 600; }
.insurance-row.insurance-status span.insurance-below { color: #c62828; font-weight: 600; }
.insurance-row.insurance-trigger { font-size: 11px; color: #888; margin-top: 4px; }
.insurance-year { font-size: 12px; color: #999; }

/* Notification Dropdown */
.notif-badge { position: absolute; top: -2px; right: -2px; background: #f44336; color: white; font-size: 10px; min-width: 16px; height: 16px; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-weight: 700; }
.notif-dropdown { position: absolute; top: 100%; right: 0; width: 320px; max-height: 400px; background: white; border-radius: 20px; box-shadow: 0 8px 32px rgba(0,0,0,0.15); z-index: 1000; overflow: hidden; }
.notif-dropdown-header { display: flex; justify-content: space-between; align-items: center; padding: 12px 16px; border-bottom: 1px solid #eee; font-weight: 600; font-size: 14px; }
.notif-dropdown-list { max-height: 340px; overflow-y: auto; }
.notif-item { display: flex; gap: 10px; padding: 10px 16px; border-bottom: 1px solid #f5f5f5; cursor: pointer; border-left: 4px solid transparent; }
.notif-item:hover { background: #f9f9f9; }
.notif-item.notif-unread { background: #f0f7ff; }
.notif-item.notif-urgent { border-left-color: #DC2626; background: #FEF2F2; }
.notif-item.notif-urgent .notif-title { font-weight: 700; color: #991B1B; }
.notif-item.notif-urgent.notif-unread { background: #FEE2E2; }
.notif-item.notif-alert { border-left-color: #2563EB; }
.notif-item.notif-alert.notif-unread { background: #EFF6FF; }
.notif-item.notif-update { border-left-color: #16A34A; }
.notif-item.notif-update.notif-unread { background: #F0FDF4; }
.notif-icon { font-size: 18px; flex-shrink: 0; padding-top: 2px; }
.notif-content { flex: 1; min-width: 0; }
.notif-title { font-size: 13px; font-weight: 600; color: #333; }
.notif-body { font-size: 12px; color: #666; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.notif-time { font-size: 11px; color: #999; margin-top: 2px; }

/* ─── Notification History ─── */
.notif-history-item {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 12px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  margin-bottom: 6px;
  cursor: pointer;
  transition: background 0.15s;
  font-family: 'Inter', sans-serif;
}
.notif-history-item:hover { background: #f8fafc; }
.notif-history-item.notif-unread { background: #f0f7ff; border-left: 3px solid #3b82f6; }
.notif-history-left { display: flex; gap: 10px; flex: 1; min-width: 0; }
.notif-history-meta { font-size: 11px; color: #94a3b8; margin-top: 4px; font-family: 'Inter', sans-serif; }
.notif-type-badge {
  font-size: 10px; font-weight: 600; color: #64748b;
  background: #f1f5f9; border-radius: 4px; padding: 1px 6px;
  text-transform: uppercase; letter-spacing: 0.5px;
  font-family: 'Inter', sans-serif;
}
.notif-dismiss-btn {
  background: none; border: none; color: #94a3b8; cursor: pointer;
  font-size: 14px; padding: 4px; flex-shrink: 0;
}
.notif-dismiss-btn:hover { color: #dc2626; }
.notif-filter-btn {
  cursor: pointer; transition: background 0.15s;
}
.notif-filter-btn.active {
  background: #3b82f6; color: #fff; border-color: #3b82f6;
}

/* Signal Card */
.signal-card {
    background: var(--white);
    border-radius: var(--radius);
    padding: 20px;
    border: 1px solid var(--border);
    box-shadow: var(--shadow);
}

.signal-header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 16px;
}

.confidence-badges {
    display: flex;
    gap: 8px;
    align-items: center;
}

.stars {
    font-size: 14px;
}

.confidence-label {
    background: var(--soft-red);
    color: var(--pop-red);
    padding: 4px 8px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 600;
}

.signal-time {
    font-size: 12px;
    color: var(--text-light);
}

.signal-card h3 {
    font-size: 18px;
    margin-bottom: 16px;
}

.signal-details {
    margin-bottom: 16px;
}

.detail-row {
    display: flex;
    justify-content: space-between;
    padding: 8px 0;
    border-bottom: 1px solid #E2E8F0;
}

.detail-row .label {
    color: var(--text-light);
    font-size: 14px;
}

.detail-row .value {
    font-weight: 600;
    font-size: 14px;
}

.signal-reasoning {
    background: var(--light-green);
    border-radius: var(--radius-sm);
    padding: 16px;
    margin-bottom: 16px;
}

.signal-reasoning h4 {
    font-size: 14px;
    margin-bottom: 8px;
}

.signal-reasoning ul {
    list-style: none;
}

.signal-reasoning li {
    font-size: 13px;
    padding: 4px 0;
}

.signal-actions {
    display: flex;
    gap: 12px;
}

.btn-action {
    flex: 1;
    padding: 14px;
    border-radius: 9999px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    border: none;
}

.btn-action.sold {
    background: var(--secondary-green);
    color: var(--white);
    font-size: 15px;
    font-weight: 700;
    padding: 16px;
}

.btn-action.pass {
    background: var(--white);
    color: var(--text-medium);
    border: 2px solid #E2E8F0;
}

/* Sell Signal Engine Cards */
#sell-signal-cards {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 16px;
}

.sse-card {
    background: var(--white);
    border-radius: var(--radius);
    padding: 16px;
    border-left: 4px solid #94A3B8;
}

.sse-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

.sse-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.3px;
}

.sse-crop {
    font-size: 13px;
    color: var(--text-medium);
    font-weight: 500;
}

.sse-text {
    font-size: 14px;
    line-height: 1.5;
    color: var(--text-dark);
    margin: 0 0 12px 0;
    font-weight: 500;
}

.sse-meta {
    display: flex;
    gap: 16px;
    font-size: 12px;
    color: var(--text-light);
    margin-bottom: 10px;
    flex-wrap: wrap;
}

.sse-meta strong {
    color: var(--text-dark);
}

.sse-factors {
    list-style: none;
    padding: 0;
    margin: 0 0 12px 0;
    background: rgba(0,0,0,0.02);
    border-radius: var(--radius-sm);
    padding: 10px 12px;
}

.sse-factors li {
    font-size: 12px;
    color: var(--text-medium);
    padding: 3px 0;
    line-height: 1.4;
}

.sse-actions {
    display: flex;
    gap: 10px;
    margin-top: 4px;
}

/* Recommended Actions (signal cards) */
.sse-actions-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 10px;
    padding: 10px 12px;
    background: rgba(0,0,0,0.02);
    border-radius: var(--radius-sm);
}

.sse-action-row {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: var(--text-medium);
    line-height: 1.4;
}

.sse-action-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.3px;
    text-transform: uppercase;
    white-space: nowrap;
    min-width: 44px;
    text-align: center;
}

.sse-action-badge.cash { background: #E8F5E9; color: #2E7D32; }
.sse-action-badge.hta { background: #E3F2FD; color: #1565C0; }
.sse-action-badge.basis { background: #F3E5F5; color: #7B1FA2; }
.sse-action-badge.fence { background: #F1F5F9; color: #334155; }

.sse-action-detail {
    flex: 1;
    font-size: 12px;
    color: var(--text-medium);
}

/* Sell Schedule Cards */
.sell-schedule-card {
    background: var(--white);
    border-radius: var(--radius);
    padding: 14px 16px;
    margin-bottom: 10px;
    border: 1px solid var(--border);
}

.sell-schedule-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.sell-schedule-crop {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-dark);
}

.sell-schedule-pace {
    font-size: 11px;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 16px;
}

.sell-schedule-pace.behind { background: #FEE2E2; color: #DC2626; }
.sell-schedule-pace.on-pace { background: #DCFCE7; color: #16A34A; }

.sell-schedule-bar {
    height: 6px;
    border-radius: 3px;
    background: #F1F5F9;
    position: relative;
    margin-bottom: 8px;
}

.sell-schedule-bar-fill {
    height: 100%;
    border-radius: 3px;
    background: var(--primary-green);
    transition: width 0.3s ease;
}

.sell-schedule-bar .target-line {
    position: absolute;
    top: -3px;
    width: 2px;
    height: 12px;
    background: #DC2626;
    border-radius: 1px;
}

.sell-schedule-stats {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    font-size: 12px;
    color: var(--text-light);
    margin-bottom: 6px;
}

.sell-schedule-stats strong {
    color: var(--text-dark);
}

.sell-schedule-rec {
    font-size: 13px;
    color: var(--text-dark);
    line-height: 1.5;
    padding: 8px 10px;
    background: #F0FDF4;
    border-radius: var(--radius-sm);
    border-left: 3px solid var(--primary-green);
    font-weight: 500;
}

.sell-schedule-seasonal {
    font-size: 11px;
    color: var(--text-light);
    margin-top: 6px;
    font-style: italic;
}

/* My Positions Detail */
.pos-detail-card {
    background: var(--white);
    border-radius: var(--radius);
    padding: 14px 16px;
    margin-bottom: 10px;
    border: 1px solid var(--border);
}

.pos-detail-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.pos-detail-type {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    color: var(--text-dark);
}

.pos-detail-type-badge {
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.3px;
    text-transform: uppercase;
}

.pos-detail-type-badge.cash { background: #E8F5E9; color: #2E7D32; }
.pos-detail-type-badge.hta { background: #E3F2FD; color: #1565C0; }
.pos-detail-type-badge.basis { background: #F3E5F5; color: #7B1FA2; }

.pos-detail-qty {
    font-size: 13px;
    color: var(--text-medium);
    font-weight: 600;
}

.pos-detail-rows {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.pos-detail-row {
    display: flex;
    justify-content: space-between;
    font-size: 12px;
    color: var(--text-light);
    padding: 2px 0;
}

.pos-detail-row span:last-child {
    font-weight: 600;
    color: var(--text-dark);
}

.pos-detail-value-note {
    font-size: 12px;
    color: var(--text-dark);
    line-height: 1.5;
    padding: 8px 10px;
    background: #F8FAFC;
    border-radius: var(--radius-sm);
    border-left: 3px solid #3B82F6;
    margin-top: 8px;
    font-weight: 500;
}

.pos-detail-gain { color: #16A34A !important; }
.pos-detail-loss { color: #DC2626 !important; }

.pos-detail-totals {
    background: var(--white);
    border-radius: var(--radius);
    padding: 14px 16px;
    margin-top: 10px;
    border: 1px solid var(--border);
}

.pos-detail-totals h3 {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-dark);
    margin: 0 0 8px 0;
}

.pos-detail-total-row {
    display: flex;
    justify-content: space-between;
    font-size: 13px;
    padding: 4px 0;
    color: var(--text-medium);
}

.pos-detail-total-row span:last-child {
    font-weight: 700;
    color: var(--text-dark);
}

/* Bottom Navigation */
.bottom-nav {
    position: fixed;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    max-width: 430px;
    box-shadow: 0 -4px 12px rgba(0,0,0,0.06);
    background: var(--white);
    display: flex;
    justify-content: space-around;
    padding: 10px 0 max(10px, env(safe-area-inset-bottom, 8px));
    border-top: none;
    z-index: 100;
}

.nav-item {
    background: none;
    border: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    min-height: 56px;
    justify-content: center;
    cursor: pointer;
    color: var(--text-light);
    transition: color 0.15s ease;
}

.nav-item.active {
    color: var(--primary-green);
    font-weight: 600;
}

.nav-icon {
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.nav-icon svg { display: block; }

.nav-label {
    font-size: 11px;
    font-weight: 500;
}
.nav-item.active .nav-icon svg { stroke: var(--primary-green); }

/* ─── Legal Disclaimer Banner ─────────────────────── */
.legal-disclaimer {
    position: fixed;
    bottom: 56px;
    left: 0;
    right: 0;
    background: var(--bg-main, #F8FAFC);
    color: var(--text-light, #94A3B8);
    font-size: 9px;
    text-align: center;
    padding: 3px 14px;
    z-index: 99;
    line-height: 1.3;
    opacity: 0.7;
}
.legal-disclaimer a {
    color: var(--primary-green, #16A34A);
    text-decoration: underline;
}

/* ─── Billing Toggle (Subscription Modal) ─────────── */
.billing-toggle {
    display: flex;
    justify-content: center;
    gap: 4px;
    margin-bottom: 20px;
    background: #F1F5F9;
    border-radius: 16px;
    padding: 4px;
}
.billing-toggle-btn {
    flex: 1;
    padding: 8px 16px;
    border: none;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    background: transparent;
    color: var(--text-light, #64748B);
    transition: all 0.2s;
}
.billing-toggle-btn.active {
    background: #fff;
    color: var(--text-dark, #0F172A);
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}
.billing-save-badge {
    display: inline-block;
    background: var(--primary-green, #16A34A);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    padding: 1px 5px;
    border-radius: 4px;
    margin-left: 3px;
    vertical-align: middle;
}
.sub-plan-crossed {
    font-size: 13px;
    color: #94A3B8;
    margin-top: 2px;
}
.sub-plan-savings {
    font-size: 12px;
    color: var(--primary-green, #16A34A);
    font-weight: 600;
    margin-top: 2px;
}
.sub-plan-badge-value {
    background: var(--primary-green, #16A34A) !important;
    color: #fff !important;
}

/* ─── Signal Disclaimer ───────────────────────────── */
.signal-disclaimer {
    font-size: 11px;
    color: var(--text-light, #64748B);
    text-align: center;
    padding: 4px 8px;
    line-height: 1.3;
    margin-top: 4px;
}

/* ─── Fields Tab Bar (Pill Style) ──────────────────────────────── */
.fields-tab-bar {
    display: flex;
    gap: 8px;
    padding: 4px 12px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    background: transparent;
    border-bottom: none;
}
.fields-tab-bar::-webkit-scrollbar { display: none; }

.fields-tab {
    flex-shrink: 0;
    background: transparent;
    border: 1px solid var(--border);
    padding: 8px 20px;
    font-size: 13px;
    font-weight: 600;
    color: #64748B;
    cursor: pointer;
    border-radius: 9999px;
    transition: all 0.2s;
    white-space: nowrap;
}

.fields-tab.active {
    color: #fff;
    background: #16A34A;
    border-color: #16A34A;
}

.fields-tab-content {
    padding-bottom: 80px;
}
/* ════════════════════════════════════════════════════
   ADDITIONAL STYLES — Onboarding & Dashboard v2
════════════════════════════════════════════════════ */

/* Welcome inner layout */
.welcome-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  min-height: 100dvh;
  padding: 40px 24px;
  text-align: center;
  background: var(--white);
}

/* Demo button on welcome */
.btn-demo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 320px;
  margin-top: 12px;
  padding: 14px 24px;
  background: var(--white);
  color: var(--primary-green);
  border: 2px solid var(--primary-green);
  border-radius: var(--radius);
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.15s;
}
.btn-demo:hover {
  background: var(--light-green);
}

/* Demo mode banner */
.demo-banner {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 9999;
  background: var(--primary-green);
  color: var(--white);
  text-align: center;
  padding: 8px 40px 8px 16px;
  font-size: 13px;
  font-weight: 500;
}
.demo-banner span {
  font-weight: 700;
}
.demo-banner.hidden { display: none; }
.demo-banner-close {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  color: var(--white);
  font-size: 18px;
  cursor: pointer;
  padding: 4px 8px;
}
body.has-demo-banner .screen.active {
  padding-top: 40px;
}
body.has-demo-banner .onboarding-header {
  top: 40px;
}
body.has-demo-banner .dashboard-header {
  margin-top: 40px;
}

/* Password toggle */
.password-wrapper {
  position: relative;
  display: flex;
  align-items: center;
}
.password-wrapper input {
  flex: 1;
  padding-right: 60px;
}
.password-toggle {
  position: absolute;
  right: 8px;
  background: none;
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 4px 10px;
  font-size: 12px;
  font-weight: 600;
  color: var(--text-medium);
  cursor: pointer;
  transition: all 0.15s;
}
.password-toggle:hover {
  color: var(--primary-green);
  border-color: var(--primary-green);
}

/* Onboarding header bar */
.onboarding-header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 20px 8px;
  background: var(--white);
  border-bottom: 1px solid #f0f0f0;
}

.btn-back {
  background: none;
  border: none;
  font-size: 24px;
  cursor: pointer;
  color: #000;
  padding: 0;
  min-width: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.step-counter {
  font-size: 12px;
  color: var(--text-light);
  white-space: nowrap;
  flex-shrink: 0;
}

.ob-step {
  display: flex;
  flex-direction: column;
  min-height: calc(100vh - 72px);
}

.ob-step.hidden { display: none; }

.ob-footer {
  padding: 16px 24px 32px;
  background: var(--white);
}

/* Form helpers */
.green-text { color: var(--secondary-green); }
.red-text { color: var(--pop-red); }

.slider-min, .slider-max {
  font-size: 12px;
  color: var(--text-light);
  white-space: nowrap;
}

.input-with-unit {
  display: flex;
  align-items: center;
  border: 2px solid #E2E8F0;
  border-radius: var(--radius-sm);
  overflow: hidden;
}
.input-with-unit .unit {
  padding: 0 10px;
  background: #f5f5f5;
  color: var(--text-medium);
  font-size: 14px;
  border-right: 1px solid #E2E8F0;
  line-height: 52px;
}
.input-with-unit .unit-suffix {
  padding: 0 10px;
  background: #f5f5f5;
  color: var(--text-medium);
  font-size: 14px;
  border-left: 1px solid #E2E8F0;
  line-height: 52px;
}
.input-with-unit input {
  flex: 1;
  border: none;
  padding: 16px;
  font-size: 16px;
}
.input-with-unit input:focus { outline: none; }

/* Crop rows */
.crop-row {
  background: var(--white);
  border: 1px solid #e8e8e8;
  border-radius: var(--radius-sm);
  padding: 16px;
  margin-bottom: 12px;
}
.crop-row-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
}
.crop-emoji { font-size: 24px; }
.crop-select {
  flex: 1;
  padding: 10px;
  border: 2px solid #E2E8F0;
  border-radius: var(--radius-sm);
  font-size: 15px;
}
.btn-remove-crop {
  background: #f5f5f5;
  border: none;
  width: 32px; height: 32px;
  border-radius: 50%;
  cursor: pointer;
  font-size: 14px;
  color: var(--text-light);
}
.btn-add-crop {
  width: 100%;
  padding: 14px;
  border: 2px dashed #ccc;
  border-radius: var(--radius-sm);
  background: none;
  color: var(--secondary-green);
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  margin-top: 4px;
}

.form-row {
  display: flex;
  gap: 12px;
}
.form-row .input-group { flex: 1; }

/* Production step */
.prod-section {
  background: var(--white);
  border: 1px solid #e8e8e8;
  border-radius: var(--radius-sm);
  padding: 16px;
  margin-bottom: 16px;
}
.prod-section h3 {
  font-size: 16px;
  color: var(--primary-green);
  margin-bottom: 12px;
}
.max-bu-display {
  background: var(--light-green);
  color: var(--secondary-green);
  padding: 8px 12px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  margin-top: 8px;
}

/* Info box */
.info-box {
  background: #F0FDF4;
  border-left: 4px solid #94A3B8;
  padding: 12px 16px;
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  font-size: 13px;
  line-height: 1.5;
  margin-top: 8px;
}

/* Toggle */
.toggle-row { display: flex; align-items: center; gap: 12px; }
.toggle { position: relative; display: inline-block; width: 48px; height: 28px; }
.toggle input { opacity: 0; width: 0; height: 0; }
.toggle-slider {
  position: absolute; cursor: pointer;
  top: 0; left: 0; right: 0; bottom: 0;
  background: #ccc; border-radius: 28px; transition: 0.3s;
}
.toggle-slider::before {
  content: ''; position: absolute;
  width: 20px; height: 20px;
  left: 4px; bottom: 4px;
  background: white; border-radius: 50%; transition: 0.3s;
}
.toggle input:checked + .toggle-slider { background: var(--secondary-green); }
.toggle input:checked + .toggle-slider::before { transform: translateX(20px); }
.toggle-label { font-size: 14px; color: var(--text-medium); }

/* Comfort cards */
.comfort-options { display: flex; flex-direction: column; gap: 12px; }
.comfort-card {
  border: 2px solid #E2E8F0;
  border-radius: var(--radius-sm);
  padding: 16px;
  cursor: pointer;
  transition: all 0.2s;
  display: flex;
  align-items: center;
  gap: 12px;
}
.comfort-card.selected {
  border-color: var(--secondary-green);
  background: var(--light-green);
}
.comfort-icon { font-size: 28px; }
.comfort-label { font-weight: 600; font-size: 15px; }
.comfort-desc { font-size: 13px; color: var(--text-light); margin-top: 2px; }
.comfort-card > div { display: flex; flex-direction: column; }

/* Compact comfort for settings */
.compact-options { flex-direction: row !important; }
.comfort-card.compact {
  flex-direction: column;
  flex: 1;
  text-align: center;
  padding: 12px 8px;
  gap: 4px;
}
.comfort-card.compact .comfort-icon { font-size: 20px; }
.comfort-card.compact .comfort-label { font-size: 12px; }

/* Outlook pills */
.outlook-options { display: flex; gap: 8px; }
.outlook-pill {
  flex: 1;
  padding: 12px 8px;
  border: 2px solid #E2E8F0;
  border-radius: var(--radius-sm);
  text-align: center;
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
  transition: all 0.2s;
}
.outlook-pill.selected {
  border-color: var(--secondary-green);
  background: var(--light-green);
  color: var(--secondary-green);
}

/* Alert preferences */
.checkbox-group { display: flex; flex-direction: column; gap: 12px; }
.checkbox-row { display: flex; align-items: center; gap: 10px; font-size: 15px; cursor: pointer; }
.checkbox-row input[type="checkbox"] { width: 20px; height: 20px; cursor: pointer; }

.quiet-hours-row { display: flex; align-items: center; gap: 12px; }
.quiet-hours-row select { flex: 1; padding: 12px; border: 2px solid #E2E8F0; border-radius: var(--radius-sm); font-size: 15px; }
.quiet-to { color: var(--text-light); font-size: 14px; }

/* Existing positions in onboarding */
.position-row {
  background: var(--white);
  border: 1px solid #e8e8e8;
  border-radius: var(--radius-sm);
  padding: 16px;
  margin-bottom: 12px;
}
.pos-row-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.pos-row-header strong { font-size: 14px; color: var(--text-medium); }

/* Dashboard header */
.dashboard-header {
  background: var(--white);
  padding: 16px 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid var(--border);
  position: sticky;
  top: 0;
  z-index: 10;
}
.header-left { display: flex; align-items: center; gap: 10px; }
.header-left h1 { font-size: 20px; font-weight: 700; color: var(--text-dark); }
.header-right { display: flex; gap: 8px; }

/* Section headers */
.section-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}
.section-header h2 { font-size: 18px; font-weight: 700; letter-spacing: -0.02em; }
.price-updated { font-size: 11px; color: var(--text-light); }
.price-updated.stale { color: #E53935; font-weight: 600; }
.stale-warning { color: #E53935; animation: pulse-stale 2s infinite; }
@keyframes pulse-stale { 0%,100% { opacity: 1; } 50% { opacity: 0.6; } }
.market-closed-tag { font-size: 10px; color: #999; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 2px; }

/* Refresh button */
.btn-refresh-prices {
  background: none; border: 1px solid #ddd; border-radius: 50%;
  width: 28px; height: 28px; font-size: 16px; cursor: pointer;
  color: var(--text-light); display: flex; align-items: center; justify-content: center;
  transition: transform 0.3s, color 0.2s;
}
.btn-refresh-prices svg { display: block; }
.btn-refresh-prices:hover { color: var(--primary-green); border-color: var(--primary-green); }
.btn-refresh-prices.spinning { animation: spin-refresh 1s linear infinite; color: var(--primary-green); }
@keyframes spin-refresh { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

/* Price data warning banner */
.price-data-warning {
  background: #FFF8E1; border: 1px solid #FFE082; border-radius: 6px;
  padding: 8px 12px; font-size: 13px; color: #F57F17; margin-bottom: 8px;
}

/* 5-Day Price History Panel */
.price-history-panel {
  background: #fff; border: 1px solid #eee; border-radius: 8px;
  margin-top: 8px; overflow: hidden;
}
.price-history-content { padding: 12px; }
.price-history-header {
  display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px;
}
.price-history-header h3 { font-size: 15px; font-weight: 600; margin: 0; }
.price-history-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: 6px 0; border-bottom: 1px solid #f5f5f5;
}
.price-history-row:last-child { border-bottom: none; }
.ph-date { font-size: 13px; color: var(--text-light); min-width: 100px; }
.ph-price { font-size: 15px; font-weight: 600; }
.ph-change { font-size: 13px; font-weight: 600; min-width: 60px; text-align: right; }
.ph-change.up { color: #10B981; }
.ph-change.down { color: #EF4444; }

/* Price history button in expanded card */
.btn-price-history {
  display: block; width: 100%; margin-top: 8px; padding: 6px 0;
  background: #f8f9fa; border: 1px solid #e9ecef; border-radius: 6px;
  font-size: 13px; font-weight: 600; color: var(--primary-green); cursor: pointer;
}
.btn-price-history:hover { background: #e8f5e9; }

.btn-text-sm {
  background: none;
  border: none;
  color: var(--secondary-green);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  padding: 4px 8px;
}

/* Skeleton loading */
.skeleton-card { background: #f8f8f8; border-radius: 16px; }
.skeleton-line, .skeleton {
  height: 16px;
  background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
  background-size: 400px 100%;
  animation: shimmer 1.5s infinite;
  border-radius: 8px;
  margin-bottom: 8px;
}
.skeleton-line.short { width: 60%; }
@keyframes shimmer { 0% { background-position: -200px 0; } 100% { background-position: 200px 0; } }

/* Position summary cards */
/* ─── Position Summary Bubble + Accordion ──────────────────────────────── */
.pos-summary-bubble { background: #FFF; border-radius: 12px; border: 1px solid #E2E8F0; overflow: hidden; }
.pos-bubble-header { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; cursor: pointer; gap: 12px; }
.pos-bubble-left { display: flex; align-items: center; gap: 12px; }
.pos-bubble-pct { font-size: 28px; font-weight: 700; color: #1E293B; min-width: 50px; }
.pos-bubble-title { font-size: 14px; font-weight: 600; color: #1E293B; }
.pos-bubble-sub { font-size: 12px; color: #64748B; margin-top: 2px; }
.pos-bubble-right { display: flex; align-items: center; gap: 8px; }
.pos-bubble-chevron { font-size: 12px; color: #94A3B8; transition: transform 0.2s; }
.pos-expanded .pos-bubble-chevron { transform: rotate(180deg); }
.pos-bubble-bar { padding: 0 16px 12px; }
.pos-bubble-bar .sold-bar { height: 6px; border-radius: 3px; }
.pos-accordion { display: none; border-top: 1px solid #E2E8F0; }
.pos-expanded .pos-accordion { display: block; }
.pos-accordion-item { border-bottom: 1px solid #F1F5F9; }
.pos-accordion-item:last-child { border-bottom: none; }
.pos-accordion-header { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; cursor: pointer; }
.pos-acc-left { display: flex; align-items: center; gap: 8px; }
.pos-acc-pct { font-size: 12px; color: #64748B; background: #F1F5F9; padding: 2px 8px; border-radius: 10px; }
.pos-acc-right { display: flex; align-items: center; gap: 6px; }
.pos-acc-chevron { font-size: 10px; color: #94A3B8; transition: transform 0.2s; }
.pos-acc-open .pos-acc-chevron { transform: rotate(180deg); }
.pos-accordion-body { display: none; padding: 0 16px 14px; }
.pos-acc-open .pos-accordion-body { display: block; }
.pace-sm { font-size: 12px; }
.pos-contracts-visible { display: block; margin-top: 8px; }
.pos-no-contracts { font-size: 12px; color: #94A3B8; margin-top: 8px; font-style: italic; }
.pos-acc-action { display: block; margin-top: 10px; background: none; border: none; color: #16A34A; font-size: 13px; font-weight: 600; cursor: pointer; padding: 0; }

.position-summary-card {
  background: var(--white);
  border-radius: var(--radius);
  padding: 16px;
  border: 1px solid var(--border);
  margin-bottom: 12px;
}
.pos-card-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 12px;
}
.pos-crop-name { font-size: 16px; font-weight: 700; display: block; }
.pos-pct-sold { font-size: 14px; font-weight: 700; color: var(--secondary-green); }
.tag {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 16px;
  font-size: 11px;
  font-weight: 600;
  background: #f0f0f0;
  color: var(--text-medium);
  margin-top: 4px;
}

/* Sold bar */
.sold-bar-wrap { margin-bottom: 8px; }
.sold-bar {
  height: 8px;
  background: var(--border);
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: 4px;
}
.sold-bar-fill {
  height: 100%;
  background: var(--primary-green);
  border-radius: 4px;
  transition: width 0.6s ease;
}
.sold-bar-fill.near-full { background: var(--primary-green); }
.sold-bar-labels { display: flex; justify-content: space-between; }
.sold-label { font-size: 11px; color: var(--text-light); }
.pos-remaining { font-size: 13px; margin: 6px 0; }
.pos-breakdown { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 6px; }
.pos-tag {
  padding: 3px 8px;
  border-radius: 16px;
  font-size: 11px;
  font-weight: 600;
}
.pos-tag.cash { background: #E8F5E9; color: var(--secondary-green); }
.pos-tag.hta { background: #E3F2FD; color: #1976D2; }
.pos-tag.basis { background: #EFF6FF; color: #1D4ED8; }

/* Position contracts expand/collapse */
.pos-card-left { flex: 1; }
.pos-avg-price { font-size: 13px; margin: 4px 0; }
.pos-revenue-remaining { font-size: 12px; color: var(--text-light); margin: 2px 0; }
.pos-contracts-toggle {
  display: flex; justify-content: space-between; align-items: center;
  font-size: 12px; font-weight: 600; color: var(--text-light);
  cursor: pointer; padding: 8px 0 4px; margin-top: 6px;
  border-top: 1px solid var(--border);
}
.pos-contracts-chevron {
  font-size: 10px; transition: transform 0.25s ease;
}
.pos-contracts-open .pos-contracts-chevron { transform: rotate(180deg); }
.pos-contracts-list {
  max-height: 0; overflow: hidden;
  transition: max-height 0.3s ease, opacity 0.25s ease;
  opacity: 0;
}
.pos-contracts-open .pos-contracts-list {
  max-height: 500px; opacity: 1;
}
.pos-contract-row {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 0; font-size: 12px;
  border-bottom: 1px solid #f0f0f0;
}
.pos-contract-row:last-child { border-bottom: none; }
.pos-contract-type {
  padding: 2px 6px; border-radius: 4px; font-size: 10px;
  font-weight: 700; text-transform: uppercase;
  background: #f0f0f0; color: var(--text-medium);
}
.pos-contract-type.cash { background: #E8F5E9; color: var(--secondary-green); }
.pos-contract-type.hta { background: #E3F2FD; color: #1976D2; }
.pos-contract-type.basis { background: #EFF6FF; color: #1D4ED8; }
.pos-contract-bu { font-weight: 600; }
.pos-contract-price { color: var(--secondary-green); font-weight: 600; }
.pos-contract-delivery { color: var(--text-light); font-size: 11px; margin-left: auto; }

/* Basis cards */
/* Crop Icons — Black outlined circles with letters (Emily approved) */
.crop-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border: 2px solid #0F172A;
  border-radius: 50%;
  font-size: 11px;
  font-weight: 800;
  color: #0F172A;
  font-family: 'Inter', sans-serif;
  flex-shrink: 0;
  line-height: 1;
}
.crop-icon.corn { /* C */ }
.crop-icon.soybeans { /* S */ }
.crop-icon.wheat { /* W */ }
.crop-icon-lg {
  width: 28px;
  height: 28px;
  font-size: 14px;
  border-width: 2.5px;
}

/* Elevator Display — Clean White */
.elevator-section { margin-bottom: 16px; }
.elevator-section-title { font-size: 14px; font-weight: 700; color: var(--text-dark); margin-bottom: 8px; display: flex; align-items: center; gap: 8px; }
.crop-tag { font-size: 11px; font-weight: 600; color: var(--text-light); background: var(--bg-main); border: 1px solid var(--border); padding: 2px 8px; border-radius: 16px; }
.elevator-row { display: flex; justify-content: space-between; align-items: center; padding: 10px 12px; background: var(--white); border: 1px solid var(--border); border-radius: 16px; margin-bottom: 6px; }
.elevator-row.elevator-best { border-color: var(--primary-green); border-width: 2px; }
.elevator-row-left { display: flex; align-items: center; gap: 6px; flex: 1; }
.elevator-row-right { display: flex; align-items: center; gap: 12px; }
.badge-best { background: var(--primary-green); color: white; font-size: 10px; font-weight: 700; padding: 2px 6px; border-radius: 4px; letter-spacing: 0.5px; }
.badge-home { background: transparent; color: var(--text-dark); font-size: 10px; font-weight: 700; padding: 1px 5px; border-radius: 4px; border: 1.5px solid var(--text-dark); letter-spacing: 0.5px; }
.elevator-name { font-size: 13px; font-weight: 500; color: var(--text-dark); }
.elevator-distance { font-size: 12px; color: var(--text-light); }
.elevator-price { font-size: 15px; font-weight: 700; color: var(--text-dark); min-width: 60px; text-align: right; }
.elevator-price.price-best { color: var(--primary-green); }
.elevator-updated { font-size: 11px; color: var(--text-light); text-align: center; margin-top: 8px; }

/* Legacy basis cards (kept for basis board screen) */
.basis-card {
  background: var(--white);
  border-radius: var(--radius-sm);
  padding: 14px;
  margin-bottom: 10px;
  border: 1px solid var(--border);
}
.basis-card.best-basis { border: 2px solid var(--primary-green); }
.basis-card-header { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.best-tag { background: var(--primary-green); color: white; padding: 2px 8px; border-radius: 16px; font-size: 11px; font-weight: 700; }
.basis-name { font-weight: 600; font-size: 14px; flex: 1; }
.basis-distance { font-size: 12px; color: var(--text-light); }
.basis-details { display: flex; gap: 16px; font-size: 13px; color: var(--text-medium); margin-bottom: 6px; }
.basis-net { font-size: 15px; font-weight: 600; }

/* Sub-screens (positions, prices, settings) */
.sub-header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 20px;
  background: var(--white);
  border-bottom: 1px solid var(--border);
  position: sticky;
  top: 0;
  z-index: 10;
}
.sub-header h2 { flex: 1; font-size: 18px; }
.sub-content {
  padding: 16px 20px 160px;
  overflow-y: auto;
  flex: 1;
}

/* Position list items */
/* Position tabs */
.pos-tabs {
  display: flex;
  gap: 0;
  border-bottom: 1px solid var(--border);
  margin-bottom: 16px;
}
.pos-tab {
  flex: 1;
  padding: 12px 8px;
  border: none;
  background: none;
  font-size: 14px;
  font-weight: 600;
  font-family: 'Inter', sans-serif;
  color: var(--text-light);
  cursor: pointer;
  border-bottom: 2px solid transparent;
  transition: all 0.15s;
}
.pos-tab.active {
  color: var(--primary-green);
  border-bottom-color: var(--primary-green);
}
.pli-contract-num {
  font-size: 12px;
  color: var(--text-light);
  margin-bottom: 4px;
  font-family: 'Inter', sans-serif;
}

/* Accounting cards */
.acct-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 16px 20px;
  margin-bottom: 12px;
}
.acct-card-title {
  font-size: 15px;
  font-weight: 700;
  color: var(--text-dark);
  margin-bottom: 12px;
  font-family: 'Inter', sans-serif;
}
.acct-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 6px 0;
  font-size: 13px;
  color: var(--text-medium);
  font-family: 'Inter', sans-serif;
}
.acct-row span:last-child {
  font-weight: 600;
  color: var(--text-dark);
}
.acct-warn { color: #CA8A04 !important; }
.acct-divider {
  height: 1px;
  background: #F3F4F6;
  margin: 8px 0;
}
.acct-progress {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 8px 0;
  font-size: 12px;
  color: var(--text-light);
  font-weight: 600;
}
.acct-bar {
  flex: 1;
  height: 8px;
  background: #E2E8F0;
  border-radius: 4px;
  overflow: hidden;
}
.acct-fill {
  height: 100%;
  background: var(--primary-green);
  border-radius: 4px;
  transition: width 0.3s;
}

/* P&L summary */
.pnl-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 20px;
  margin-bottom: 12px;
  text-align: center;
}
.pnl-summary { padding: 24px 20px; }
.pnl-big-number {
  font-size: 42px;
  font-weight: 800;
  line-height: 1;
  font-family: 'Inter', sans-serif;
}
.pnl-label {
  font-size: 14px;
  color: var(--text-light);
  margin-top: 6px;
}

/* Contract type badges */
.pli-type.min_price { background: #F1F5F9; color: #475569; }
.pli-type.call { background: #E0E7FF; color: #3730A3; }
.pli-type.put { background: #FCE7F3; color: #9D174D; }
.pli-type.reown { background: #F3F4F6; color: #374151; }

.position-list-item {
  background: var(--white);
  border-radius: var(--radius-sm);
  padding: 14px;
  margin-bottom: 10px;
  border-bottom: 1px solid var(--border);
}
.pli-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.pli-crop { font-weight: 600; font-size: 15px; }
.pli-type { font-size: 11px; font-weight: 700; }
.pli-type.cash { background: #E8F5E9; color: var(--secondary-green); }
.pli-type.hta { background: #E3F2FD; color: #1976D2; }
.pli-type.basis { background: #EFF6FF; color: #1D4ED8; }
.pli-details { display: flex; gap: 12px; align-items: center; font-size: 14px; }
.pli-qty { font-weight: 600; }
.pli-price { font-weight: 600; }
.pli-delivery { color: var(--text-light); font-size: 12px; }
.pli-location { font-size: 12px; color: var(--text-light); margin-top: 4px; }
.pli-status { font-size: 11px; margin-top: 6px; font-weight: 600; }
.status-active { color: var(--secondary-green); }
.status-delivered { color: var(--text-light); }
.status-cancelled { color: var(--pop-red); text-decoration: line-through; }

/* Position list delivery progress */
.pli-delivery-progress { margin-top: 8px; }
.pli-delivery-label { font-size: 11px; color: var(--text-light); margin-bottom: 3px; }
.pli-delivery-bar { width: 100%; height: 6px; background: #E2E8F0; border-radius: 3px; overflow: hidden; }
.pli-delivery-fill { height: 100%; background: var(--secondary-green); border-radius: 3px; transition: width 0.3s ease; }
.position-list-item { cursor: pointer; }
.position-list-item:active { background: #F8FAFC; }

/* Contract detail screen */
.cd-summary { background: var(--white); border-radius: var(--radius-sm); padding: 16px; margin-bottom: 16px; border-bottom: 1px solid var(--border); }
.cd-summary-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.cd-summary-header h3 { font-size: 18px; font-weight: 700; margin: 0; }
.cd-summary-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.cd-summary-item .cd-label { font-size: 11px; color: var(--text-light); text-transform: uppercase; letter-spacing: 0.5px; }
.cd-summary-item .cd-value { font-size: 15px; font-weight: 600; }

/* Lifecycle progress bar */
.cd-lifecycle { background: var(--white); border-radius: var(--radius-sm); padding: 16px; margin-bottom: 16px; border-bottom: 1px solid var(--border); }
.cd-lifecycle h4 { font-size: 14px; font-weight: 600; margin: 0 0 12px 0; }
.lifecycle-bar { display: flex; align-items: center; gap: 0; margin-bottom: 8px; }
.lifecycle-step { flex: 1; height: 8px; background: #E2E8F0; position: relative; }
.lifecycle-step:first-child { border-radius: 4px 0 0 4px; }
.lifecycle-step:last-child { border-radius: 0 4px 4px 0; }
.lifecycle-step.active { background: var(--secondary-green); }
.lifecycle-step.partial { background: linear-gradient(90deg, var(--secondary-green) 50%, #E2E8F0 50%); }
.lifecycle-labels { display: flex; justify-content: space-between; }
.lifecycle-labels span { font-size: 10px; color: #94A3B8; text-align: center; flex: 1; }
.lifecycle-labels span.active { color: var(--secondary-green); font-weight: 600; }

/* Contract detail sections */
.cd-section { background: var(--white); border-radius: var(--radius-sm); padding: 16px; margin-bottom: 16px; border-bottom: 1px solid var(--border); }
.cd-section h4 { font-size: 14px; font-weight: 600; margin: 0 0 12px 0; display: flex; justify-content: space-between; align-items: center; }
.cd-ticket { display: flex; justify-content: space-between; align-items: center; padding: 10px 0; border-bottom: 1px solid #F1F5F9; }
.cd-ticket:last-child { border-bottom: none; }
.cd-ticket-date { font-size: 13px; font-weight: 600; }
.cd-ticket-info { font-size: 12px; color: var(--text-light); }
.cd-ticket-bu { font-size: 15px; font-weight: 700; color: var(--secondary-green); }
.cd-payment-row { display: flex; justify-content: space-between; padding: 8px 0; font-size: 14px; }
.cd-payment-row .cd-label { color: var(--text-light); }
.cd-payment-row .cd-value { font-weight: 600; }
.cd-notes { font-size: 14px; color: var(--text-body); line-height: 1.5; }

/* Prices detail */
.prices-detail-card {
  background: var(--white);
  border-radius: var(--radius);
  padding: 20px;
  margin-bottom: 16px;
  border-bottom: 1px solid var(--border);
}
.pd-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.pd-header h3 { font-size: 18px; }
.pd-contract { font-size: 13px; color: var(--text-light); }
.pd-price { font-size: 36px; font-weight: 700; margin-bottom: 4px; }
.pd-change { font-size: 14px; font-weight: 600; margin-bottom: 16px; }
.pd-change.up { color: var(--secondary-green); }
.pd-change.down { color: var(--pop-red); }
.pd-details { border-top: 1px solid #f0f0f0; padding-top: 12px; }
.pd-row { display: flex; justify-content: space-between; padding: 6px 0; font-size: 14px; }

/* Settings */
.settings-section {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 16px;
  margin-bottom: 16px;
}
.settings-section h3 { font-size: 14px; font-weight: 700; color: var(--text-light); text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 12px; }
.settings-row { display: flex; justify-content: space-between; align-items: center; padding: 10px 0; border-bottom: 1px solid #f5f5f5; }
.settings-row:last-child { border-bottom: none; }
.settings-label { font-size: 14px; color: var(--text-medium); }
.settings-value { font-size: 14px; font-weight: 500; color: var(--text-dark); max-width: 60%; text-align: right; }
.settings-crop-row { display: flex; justify-content: space-between; padding: 8px 0; font-size: 14px; }
.settings-hint { font-size: 12px; color: var(--text-light); margin-bottom: 12px; }
.danger-zone { border: 1px solid #FFCDD2; }

/* Forward Tracker Widget */
.forward-commodity { margin-bottom: 16px; }
.forward-commodity-header {
  font-size: 14px; font-weight: 700; margin-bottom: 8px;
  display: flex; align-items: center; gap: 6px;
}
.forward-years {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px;
}
.forward-year-card {
  background: var(--white); border-radius: var(--radius-sm);
  padding: 12px; position: relative;
  border: 1px solid var(--border);
}
.forward-year-top {
  display: flex; justify-content: space-between; align-items: flex-start;
}
.forward-ring { flex-shrink: 0; }
.forward-year-card.trigger-hit { border-color: var(--accent-green); border-width: 2px; }
.forward-year-label {
  font-size: 11px; font-weight: 700; color: var(--text-light);
  text-transform: uppercase; letter-spacing: 0.5px;
}
.forward-year-contract {
  font-size: 10px; color: var(--text-light); margin-bottom: 6px;
}
.forward-year-price {
  font-size: 18px; font-weight: 800; color: var(--text-dark);
}
.forward-year-change {
  font-size: 11px; margin-top: 2px;
}
.forward-year-change.up { color: var(--secondary-green); }
.forward-year-change.down { color: var(--pop-red); }
.forward-sold-bar {
  height: 6px; background: #eee; border-radius: 3px; margin-top: 8px; overflow: hidden;
}
.forward-sold-fill {
  height: 100%; background: var(--primary-green); border-radius: 3px;
  transition: width 0.3s;
}
.forward-sold-label {
  font-size: 11px; color: var(--text-light); margin-top: 4px;
  display: flex; justify-content: space-between;
}
.forward-trigger-badge {
  display: inline-block; font-size: 10px; font-weight: 700;
  padding: 2px 6px; border-radius: 8px; margin-top: 6px;
}
.forward-trigger-badge.hit { background: var(--light-green); color: var(--secondary-green); }
.forward-trigger-badge.waiting { background: #f5f5f5; color: var(--text-light); }
.forward-no-crop {
  font-size: 10px; color: #CBD5E1; font-style: italic;
  margin-top: 4px;
}

/* Trigger price settings rows */
.trigger-row {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 0; border-bottom: 1px solid #f0f0f0;
}
.trigger-info { flex: 1; }
.trigger-commodity-label { font-size: 14px; font-weight: 600; }
.trigger-price-label { font-size: 13px; color: var(--text-light); }
.trigger-status { font-size: 11px; margin-top: 2px; }
.trigger-status.hit { color: var(--secondary-green); font-weight: 600; }
.trigger-status.waiting { color: var(--text-light); }
.btn-danger {
  width: 100%;
  padding: 14px;
  background: none;
  border: 2px solid var(--pop-red);
  color: var(--pop-red);
  border-radius: var(--radius-sm);
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
}

/* Modal */
.modal { position: fixed; inset: 0; z-index: 100; }
.modal.hidden { display: none; }
.modal-overlay { position: absolute; inset: 0; background: rgba(0,0,0,0.5); }
.modal-card {
  position: absolute;
  bottom: 0; left: 50%;
  transform: translateX(-50%);
  width: 100%;
  max-width: 430px;
  background: var(--white);
  border-radius: 24px 24px 0 0;
  box-shadow: 0 -8px 32px rgba(0,0,0,0.15);
  max-height: 85vh;
  overflow-y: auto;
}
.modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 20px 16px;
  border-bottom: 1px solid var(--border);
}
.modal-header h3 { font-size: 18px; }
.modal-close { background: none; border: none; font-size: 20px; cursor: pointer; color: var(--text-light); }
.modal-body { padding: 16px 20px; }
.modal-footer {
  display: flex;
  gap: 12px;
  padding: 12px 20px 32px;
  border-top: 1px solid #E2E8F0;
}
.modal-footer .btn-secondary { flex: 1; }
.modal-footer .btn-primary { flex: 2; justify-content: center; }

/* Toast */
.toast {
  position: fixed;
  bottom: 80px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--text-dark);
  color: white;
  padding: 12px 20px;
  border-radius: var(--radius);
  font-size: 14px;
  font-weight: 500;
  z-index: 200;
  max-width: 340px;
  text-align: center;
  box-shadow: 0 4px 16px rgba(0,0,0,0.2);
  transition: opacity 0.3s;
}
.toast.hidden { display: none; }
.toast-success { background: var(--secondary-green); }
.toast-error { background: var(--pop-red); }
.toast-info { background: #1976D2; }

/* Empty state */
.empty-state {
  text-align: center;
  padding: 32px 16px;
  color: var(--text-light);
  font-size: 14px;
  line-height: 1.6;
}
.empty-state.small { padding: 12px 0; }

/* Price card wheat variant */
.price-card.wheat { border-left: 4px solid #8B7355; }

/* Notification badge */
.notif-badge {
  position: absolute;
  top: 0; right: 0;
  background: var(--pop-red);
  color: white;
  font-size: 10px;
  font-weight: 700;
  min-width: 18px;
  height: 18px;
  border-radius: 9px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 4px;
}

/* Market closed tag */
.market-closed-tag {
  font-size: 10px;
  font-weight: 600;
  color: var(--text-light);
  background: #f0f0f0;
  display: inline-block;
  padding: 2px 6px;
  border-radius: 4px;
  margin-bottom: 4px;
}

/* Signal refresh row */
.signal-refresh-row {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 8px;
}

/* Watch signal border */
.signal-card.watch-border { border-color: #94A3B8; }
.signal-card.fyi-border { border-color: var(--accent-green); }

/* Target marker on sold bar */
.target-marker {
  position: absolute;
  top: -2px;
  width: 0;
  height: 12px;
  border-left: 2px dotted var(--pop-red);
  z-index: 1;
}

/* Avg price & revenue lines */
.pos-avg-price, .pos-revenue, .pos-revenue-remaining {
  font-size: 12px;
  color: var(--text-medium);
  margin-top: 4px;
  line-height: 1.4;
}
.pos-revenue strong, .pos-revenue-remaining strong { color: var(--secondary-green); }

/* Delete button in settings */
.btn-text-sm.red-text { color: var(--pop-red); }

/* Hidden utility */
.hidden { display: none !important; }

/* ════════════════════════════════════════════════════
   PLAN SCREEN — Marketing Calendar
════════════════════════════════════════════════════ */

/* ─── Marketing Plan v2 ───────────────────────────────────────────────────── */

/* Crop year tabs */
.plan-year-tabs {
  display: flex;
  gap: 0;
  margin-bottom: 16px;
  border-radius: var(--radius-sm);
  overflow: hidden;
  border: 2px solid var(--secondary-green);
}
.plan-year-tab {
  flex: 1;
  padding: 10px 16px;
  border: none;
  background: var(--white);
  color: var(--secondary-green);
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  text-align: center;
}
.plan-year-tab.active {
  background: var(--secondary-green);
  color: var(--white);
}
.plan-year-tab:not(:last-child) {
  border-right: 1px solid var(--secondary-green);
}

/* Style selector */
.plan-style-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #F8FAFC;
  border-radius: var(--radius-sm);
  padding: 10px 14px;
  margin-bottom: 16px;
  font-size: 13px;
}
.plan-style-label {
  color: var(--text-light);
  font-weight: 500;
}
.plan-style-value {
  font-weight: 700;
  color: var(--primary-green);
  text-transform: capitalize;
}
.plan-style-change {
  color: var(--secondary-green);
  font-weight: 600;
  font-size: 12px;
  cursor: pointer;
  background: none;
  border: none;
  text-decoration: underline;
}

/* Urgency banner */
.plan-urgency-banner {
  background: var(--soft-red);
  border: 1px solid var(--pop-red);
  border-radius: var(--radius-sm);
  padding: 12px 14px;
  margin-bottom: 12px;
  font-size: 13px;
  font-weight: 600;
  color: #B71C1C;
  line-height: 1.4;
}
.plan-urgency-banner.high {
  background: #EFF6FF;
  border-color: #3B82F6;
  color: #1D4ED8;
}

/* Crop card */
.plan-crop-card {
  background: var(--white);
  border-radius: var(--radius);
  padding: 16px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 16px;
}
.plan-crop-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}
.plan-crop-name { font-size: 16px; font-weight: 700; }
.plan-status-badge {
  padding: 4px 10px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 700;
}
.plan-status-badge.on_track { background: var(--light-green); color: var(--secondary-green); }
.plan-status-badge.on-track { background: var(--light-green); color: var(--secondary-green); }
.plan-status-badge.ahead { background: #E3F2FD; color: #1565C0; }
.plan-status-badge.behind { background: var(--soft-red); color: var(--pop-red); }

/* Progress bar with target marker */
.plan-progress-wrap { margin-bottom: 10px; position: relative; }
.plan-progress-bar {
  height: 14px;
  background: #E2E8F0;
  border-radius: 7px;
  overflow: hidden;
  display: flex;
  position: relative;
}
.plan-progress-sold {
  height: 100%;
  background: var(--primary-green);
  transition: width 0.6s ease;
  border-radius: 7px 0 0 7px;
}
.plan-progress-covered {
  height: 100%;
  background: linear-gradient(90deg, #42A5F5, #1976D2);
  transition: width 0.6s ease;
}
.plan-target-marker {
  position: absolute;
  top: -3px;
  width: 3px;
  height: 20px;
  background: var(--pop-red);
  border-radius: 2px;
  z-index: 2;
}
.plan-target-marker::after {
  content: attr(data-label);
  position: absolute;
  top: -16px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 10px;
  font-weight: 700;
  color: var(--pop-red);
  white-space: nowrap;
}
.plan-progress-labels {
  display: flex;
  justify-content: space-between;
  margin-top: 4px;
}
.plan-progress-label { font-size: 11px; color: var(--text-light); }
.plan-progress-label.green { color: var(--secondary-green); font-weight: 600; }
.plan-progress-label.blue { color: #1976D2; font-weight: 600; }
.plan-progress-label.red { color: var(--pop-red); font-weight: 600; }

/* Stats row */
.plan-stats-row {
  display: flex;
  gap: 6px;
  margin-top: 10px;
  font-size: 12px;
  color: var(--text-medium);
}
.plan-stat { flex: 1; text-align: center; }
.plan-stat-value { font-weight: 700; font-size: 15px; display: block; color: var(--text-dark); }
.plan-stat-label { font-size: 10px; color: var(--text-light); }

/* Pace message */
.plan-pace-msg {
  margin-top: 10px;
  font-size: 12px;
  color: var(--text-medium);
  line-height: 1.4;
  padding: 8px 10px;
  background: #FAFAFA;
  border-radius: 8px;
}
.plan-pace-msg.behind { background: #EFF6FF; color: #1D4ED8; }
.plan-pace-msg.ahead { background: #E3F2FD; color: #1565C0; }
.plan-pace-msg.on_track { background: var(--light-green); color: var(--secondary-green); }

/* Positions list */
.plan-positions { margin-top: 12px; }
.plan-positions-header {
  font-size: 12px;
  font-weight: 700;
  color: var(--text-medium);
  margin-bottom: 6px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.plan-position-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 6px 0;
  font-size: 12px;
  border-bottom: 1px solid #f0f0f0;
}
.plan-position-row:last-child { border-bottom: none; }
.plan-position-type {
  background: #f0f0f0;
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
}
.plan-position-type.cash { background: var(--light-green); color: var(--secondary-green); }
.plan-position-type.hta { background: #E3F2FD; color: #1565C0; }
.plan-position-type.basis { background: #EFF6FF; color: #1D4ED8; }

/* Style modal */
.plan-style-options {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.plan-style-option {
  border: 2px solid #E2E8F0;
  border-radius: var(--radius-sm);
  padding: 14px;
  cursor: pointer;
  background: var(--white);
  text-align: left;
}
.plan-style-option.selected {
  border-color: var(--secondary-green);
  background: var(--light-green);
}
.plan-style-option-name {
  font-weight: 700;
  font-size: 15px;
  color: var(--primary-green);
  margin-bottom: 4px;
}
.plan-style-option-desc {
  font-size: 12px;
  color: var(--text-medium);
  line-height: 1.4;
}

/* ─── Trial Banner ─────────────────────────────────────────────────────── */
.trial-banner {
  position: fixed;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  max-width: 430px;
  z-index: 9000;
  padding: 6px 16px;
  text-align: center;
  font-size: 12px;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}
.trial-banner.active {
  background: var(--primary-green);
  color: white;
}
.trial-banner.expiring {
  background: var(--pop-red);
  color: white;
}
.trial-banner .trial-upgrade-btn {
  background: rgba(255,255,255,0.25);
  border: 1px solid rgba(255,255,255,0.5);
  border-radius: 6px;
  padding: 3px 10px;
  color: white;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}
.trial-banner.hidden { display: none; }

/* Push content down when trial banner is visible */
body.has-trial-banner #app { padding-top: 32px; }
body.has-trial-banner .dashboard-header { padding-top: 4px; }
body.has-trial-banner .sub-header { margin-top: 0; }

/* ─── Upgrade Wall ─────────────────────────────────────────────────────── */
.upgrade-wall {
  position: fixed;
  inset: 0;
  z-index: 10000;
  background: rgba(0,0,0,0.85);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}
.upgrade-wall.hidden { display: none; }
.upgrade-wall-content {
  background: var(--white);
  border-radius: var(--radius);
  padding: 32px 24px;
  max-width: 400px;
  width: 100%;
  text-align: center;
}
.upgrade-wall-icon { font-size: 48px; margin-bottom: 12px; }
.upgrade-wall-content h2 {
  font-size: 22px;
  color: var(--primary-green);
  margin-bottom: 8px;
}
.upgrade-wall-content p {
  font-size: 14px;
  color: var(--text-medium);
  margin-bottom: 20px;
}
.upgrade-plans {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.upgrade-plan-card {
  border: 2px solid #E2E8F0;
  border-radius: var(--radius-sm);
  padding: 14px;
  cursor: pointer;
  text-align: left;
  background: var(--white);
  transition: border-color 0.2s;
}
.upgrade-plan-card:hover { border-color: var(--secondary-green); }
.upgrade-plan-card.recommended {
  border-color: var(--secondary-green);
  background: var(--light-green);
}
.upgrade-plan-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 6px;
}
.upgrade-plan-name { font-weight: 700; font-size: 16px; color: var(--primary-green); }
.upgrade-plan-price { font-weight: 700; font-size: 16px; color: var(--text-dark); }
.upgrade-plan-features {
  font-size: 12px;
  color: var(--text-medium);
  line-height: 1.5;
}
.upgrade-plan-badge {
  font-size: 10px;
  background: var(--secondary-green);
  color: white;
  padding: 2px 6px;
  border-radius: 4px;
  font-weight: 700;
  margin-left: 8px;
}

/* ─── Subscription Modal ──────────────────────────────────────────────── */
.modal-card-wide { max-width: 460px; }
.sub-plans-grid { display: flex; flex-direction: column; gap: 12px; margin-bottom: 16px; }
.sub-plan-card {
  border: 2px solid #E2E8F0;
  border-radius: var(--radius-sm);
  padding: 16px;
  position: relative;
  background: var(--white);
  transition: border-color 0.2s;
}
.sub-plan-card:hover { border-color: var(--secondary-green); }
.sub-plan-popular {
  border-color: var(--secondary-green);
  background: var(--light-green);
}
.sub-plan-current { border-color: var(--primary-green); }
.sub-plan-badge {
  position: absolute; top: -10px; right: 12px;
  background: var(--secondary-green); color: white;
  font-size: 10px; font-weight: 700;
  padding: 2px 8px; border-radius: 4px;
  letter-spacing: 0.5px;
}
.sub-plan-name { font-size: 18px; font-weight: 700; color: var(--text-dark); }
.sub-plan-price { margin: 4px 0 10px; }
.sub-plan-amount { font-size: 28px; font-weight: 800; color: var(--primary-green); }
.sub-plan-period { font-size: 14px; color: var(--text-medium); }
.sub-plan-features { margin-bottom: 12px; }
.sub-plan-feature {
  font-size: 13px; color: var(--text-medium);
  padding: 2px 0; padding-left: 16px;
  position: relative;
}
.sub-plan-feature::before {
  content: '\2713'; position: absolute; left: 0;
  color: var(--primary-green); font-weight: 700;
}
.sub-plan-btn {
  width: 100%; padding: 10px;
  border: none; border-radius: 8px;
  font-size: 14px; font-weight: 700; cursor: pointer;
  background: var(--primary-green); color: white;
  transition: background 0.2s;
}
.sub-plan-btn:hover { background: var(--dark-green); }
.sub-plan-btn-current {
  background: #E2E8F0; color: var(--text-medium);
  cursor: default;
}
.sub-plan-btn-current:hover { background: #E2E8F0; }

/* Advisory teaser */
.sub-advisory-teaser {
  display: flex; align-items: center; justify-content: space-between;
  background: #F8FAFC; border: 1px dashed #CBD5E1;
  border-radius: var(--radius-sm);
  padding: 14px 16px; margin-bottom: 12px;
  opacity: 0.7;
}
.sub-advisory-name { font-weight: 700; font-size: 15px; color: var(--text-dark); }
.sub-advisory-price { font-size: 13px; color: var(--primary-green); font-weight: 600; }
.sub-advisory-desc { font-size: 12px; color: var(--text-light); margin-top: 2px; }
.sub-advisory-btn {
  background: none; border: 1px solid var(--primary-green);
  color: var(--primary-green); font-size: 12px; font-weight: 600;
  padding: 6px 12px; border-radius: 6px; cursor: pointer;
  white-space: nowrap; flex-shrink: 0; margin-left: 12px;
}
.sub-advisory-btn:hover { background: var(--light-green); }

/* Waitlist form */
.sub-waitlist-form {
  background: #F0FDF4; border: 1px solid #BBF7D0;
  border-radius: var(--radius-sm);
  padding: 14px; margin-top: 8px;
  display: flex; gap: 8px; align-items: flex-end;
}
.sub-waitlist-form.hidden { display: none; }
.sub-waitlist-form .input-group { flex: 1; margin: 0; }
.sub-waitlist-form .input-group label { font-size: 12px; }

/* Manage subscription link */
.sub-manage-btn {
  display: block; width: 100%; text-align: center;
  margin-top: 12px; padding: 10px;
  background: none; border: 1px solid #E2E8F0;
  border-radius: 8px; color: var(--text-medium);
  font-size: 13px; cursor: pointer;
}
.sub-manage-btn:hover { border-color: var(--primary-green); color: var(--primary-green); }

/* Welcome screen trial note */
.welcome-trial-note {
  font-size: 14px; color: var(--primary-green);
  font-weight: 600; margin: 4px 0 16px;
  letter-spacing: -0.2px;
}

/* Rich chat cards */
.chat-bubble.chat-card {
  max-width: 90%;
  padding: 0;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 20px;
  overflow: hidden;
}
.chat-card-header {
  padding: 10px 16px;
  background: #F8FAFC;
  border-bottom: 1px solid var(--border);
  font-size: 13px;
  font-weight: 700;
  color: var(--text-dark);
  font-family: 'Inter', sans-serif;
}
.chat-card-body {
  padding: 12px 16px;
  font-size: 13px;
  line-height: 1.6;
  color: var(--text-medium);
}
.chat-card-body strong {
  color: var(--text-dark);
}

/* Voice input button */
.chat-voice-btn {
  width: 40px;
  height: 40px;
  background: none;
  border: 1px solid var(--border);
  border-radius: 50%;
  cursor: pointer;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--text-medium);
  transition: all 0.15s;
}
.chat-voice-btn:hover {
  background: #F1F5F9;
}
.chat-voice-btn.recording {
  background: #FEE2E2;
  border-color: #EF4444;
  color: #EF4444;
  animation: voicePulse 1.5s infinite;
}
@keyframes voicePulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(239,68,68,0.3); }
  50% { box-shadow: 0 0 0 8px rgba(239,68,68,0); }
}

/* Chat limit banner */
.chat-limit-banner {
  padding: 8px 14px;
  background: #EFF6FF;
  border: 1px solid #BFDBFE;
  border-radius: 8px;
  font-size: 12px;
  color: #1D4ED8;
  text-align: center;
  margin: 8px 12px;
  font-weight: 600;
}
.chat-limit-banner a {
  color: #1565C0;
  text-decoration: underline;
  cursor: pointer;
}

/* Onboarding calendar step */
.ob-calendar-section {
  background: var(--white);
  border: 1px solid #e8e8e8;
  border-radius: var(--radius-sm);
  padding: 16px;
  margin-bottom: 16px;
}
.ob-calendar-section h3 {
  font-size: 15px;
  color: var(--primary-green);
}
.ob-cal-row {
  display: flex;
  gap: 6px;
  align-items: center;
  margin-bottom: 8px;
}
.ob-cal-row select { flex: 0 0 auto; width: 70px; padding: 8px 4px; border: 2px solid #E2E8F0; border-radius: 8px; font-size: 13px; }
.ob-cal-row input[type="text"] { padding: 8px 4px; border: 2px solid #E2E8F0; border-radius: 8px; font-size: 13px; text-align: center; }
.ob-cal-row input[type="number"] { padding: 8px 4px; border: 2px solid #E2E8F0; border-radius: 8px; font-size: 13px; text-align: center; }
.ob-bu-label { font-size: 11px; color: var(--text-light); min-width: 55px; text-align: right; }

/* ════════════════════════════════════════════════════
   UPLOAD BUTTONS
════════════════════════════════════════════════════ */

.upload-actions {
  display: flex;
  gap: 10px;
  margin-bottom: 16px;
}
.btn-upload {
  flex: 1;
  padding: 14px 12px;
  border: 2px dashed #ccc;
  border-radius: var(--radius-sm);
  background: none;
  color: var(--secondary-green);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  text-align: center;
}
.btn-upload:active { background: var(--light-green); }

/* Confidence indicator */
.confidence-indicator {
  display: inline-block;
  padding: 3px 8px;
  border-radius: 8px;
  font-size: 11px;
  font-weight: 700;
}
.confidence-high { background: var(--light-green); color: var(--secondary-green); }
.confidence-medium { background: #EFF6FF; color: #1D4ED8; }
.confidence-low { background: var(--soft-red); color: var(--pop-red); }

/* Upload loading spinner */
.upload-spinner {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 40px;
  gap: 12px;
}
.spinner {
  width: 40px; height: 40px;
  border: 4px solid #E2E8F0;
  border-top-color: var(--secondary-green);
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ════════════════════════════════════════════════════
   CHAT SCREEN — Bobbie Agent
════════════════════════════════════════════════════ */

#screen-agent {
  display: none;
  flex-direction: column;
  height: 100vh;
  height: 100dvh;
  overflow: hidden;
}
#screen-agent.active { display: flex; }
#screen-agent .bottom-nav {
  position: relative;
  left: auto;
  transform: none;
  flex-shrink: 0;
}
#screen-agent .chat-chips { flex-shrink: 0; }

.chat-header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 20px;
  background: var(--white);
  border-bottom: 1px solid var(--border);
  position: sticky;
  top: 0;
  z-index: 10;
}
.chat-avatar {
  width: 44px; height: 44px;
  background: var(--primary-green);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-size: 20px;
  font-weight: 700;
  flex-shrink: 0;
}
.chat-header-info { display: flex; flex-direction: column; }
.chat-header-name { font-size: 16px; font-weight: 700; color: var(--text-dark); }
.chat-header-subtitle { font-size: 12px; color: var(--text-light); }

.chat-messages {
  flex: 1;
  overflow-y: auto;
  padding: 16px 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 0;
}

.chat-bubble {
  max-width: 80%;
  padding: 12px 16px;
  border-radius: 20px;
  font-size: 14px;
  line-height: 1.5;
  word-wrap: break-word;
  white-space: pre-wrap;
  font-family: 'Inter', sans-serif;
}
.chat-bubble.user {
  align-self: flex-end;
  background: var(--border);
  color: var(--text-dark);
  border-bottom-right-radius: 4px;
}
.chat-bubble.assistant {
  align-self: flex-start;
  background: var(--primary-green);
  color: #fff;
  border-bottom-left-radius: 4px;
}

.chat-chips {
  display: flex;
  gap: 8px;
  padding: 8px 20px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  background: var(--white);
}
.chip {
  flex-shrink: 0;
  padding: 8px 16px;
  border: 1.5px solid var(--primary-green);
  border-radius: 20px;
  background: #fff;
  color: var(--primary-green);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.15s ease;
  font-family: 'Inter', sans-serif;
}
.chip:active { background: var(--light-green); transform: scale(0.97); }

.chat-input-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 20px;
  padding-bottom: max(12px, env(safe-area-inset-bottom));
  background: var(--white);
  border-top: 1px solid var(--border);
  flex-shrink: 0;
}
.chat-input-bar input {
  flex: 1;
  padding: 12px 16px;
  border: 1px solid var(--border);
  border-radius: 24px;
  font-size: 15px;
  outline: none;
}
.chat-input-bar input:focus { border-color: var(--accent-green); }
.chat-send {
  width: 44px; height: 44px;
  background: var(--primary-green);
  color: white;
  border: none;
  border-radius: 50%;
  font-size: 20px;
  font-weight: 700;
  cursor: pointer;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Typing indicator */
.typing-indicator {
  align-self: flex-start;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
  background: #F1F5F9;
  border-radius: 16px;
  border-bottom-left-radius: 4px;
}
.typing-dots { display: flex; gap: 4px; align-items: center; }
.typing-label { font-size: 12px; color: var(--text-light); }
.typing-dot {
  width: 8px; height: 8px;
  background: var(--text-light);
  border-radius: 50%;
  animation: typingBounce 1.4s infinite ease-in-out;
}
.typing-dot:nth-child(2) { animation-delay: 0.2s; }
.typing-dot:nth-child(3) { animation-delay: 0.4s; }
@keyframes typingBounce {
  0%, 80%, 100% { transform: translateY(0); }
  40% { transform: translateY(-6px); }
}

/* ════════════════════════════════════════════════════
   CROP DOCTOR
════════════════════════════════════════════════════ */

/* ─── Plant Doctor: Camera Nav Button ───────────────── */
.nav-camera .nav-icon {
  font-size: 24px;
  background: var(--primary-green);
  color: var(--white);
  width: 44px;
  height: 44px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: -18px;
  box-shadow: 0 1px 4px rgba(0,0,0,0.08);
}
.nav-camera .nav-label {
  color: var(--primary-green);
  font-weight: 600;
}

/* Plant Doctor home CTA */
.plant-doctor-cta {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px;
  background: var(--light-green);
  border-radius: var(--radius);
  border: 1px solid var(--accent-green);
  cursor: pointer;
  transition: transform 0.15s;
}
.plant-doctor-cta:active { transform: scale(0.98); }
.plant-doctor-cta-icon { font-size: 40px; flex-shrink: 0; }
.plant-doctor-cta-text h3 { font-size: 16px; font-weight: 700; color: var(--primary-green); margin-bottom: 2px; }
.plant-doctor-cta-text p { font-size: 13px; color: var(--text-medium); line-height: 1.4; }
.plant-doctor-cta .arrow { font-size: 18px; color: var(--accent-green); margin-left: auto; flex-shrink: 0; }

/* Scan limit banner */
.scan-limit-banner {
  padding: 8px 14px;
  border-radius: 8px;
  font-size: 13px;
  margin-bottom: 12px;
  text-align: center;
}
.scan-limit-banner.warn { background: #EFF6FF; color: #1D4ED8; border: 1px solid #BFDBFE; }
.scan-limit-banner.ok { background: var(--light-green); color: var(--secondary-green); }
.scan-limit-banner.blocked { background: var(--soft-red); color: var(--pop-red); border: 1px solid #FFCDD2; }

/* Field selector in doctor */
.doctor-field-select {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
}
.doctor-field-select label { font-size: 14px; font-weight: 600; color: var(--text-medium); white-space: nowrap; }
.doctor-field-select select {
  flex: 1;
  padding: 8px 12px;
  border: 1px solid #ddd;
  border-radius: 8px;
  font-size: 14px;
  background: var(--white);
}

/* Ask Bobbie more button */
.diagnosis-actions {
  display: flex;
  gap: 10px;
}
.diagnosis-actions .btn-secondary {
  flex: 1;
  padding: 10px;
  font-size: 14px;
  border: 1px solid var(--accent-green);
  border-radius: 16px;
  background: var(--white);
  color: var(--primary-green);
  font-weight: 600;
  cursor: pointer;
}

.doctor-upload-area { margin-bottom: 16px; }

/* Scan Mode Selector */
.scan-mode-selector { margin-bottom: 14px; }
.scan-mode-label { font-size: 13px; font-weight: 600; color: var(--text-light); margin-bottom: 8px; display: block; }
.scan-mode-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}
.scan-mode-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 10px 6px;
  border: 1.5px solid var(--border);
  border-radius: var(--radius);
  background: var(--bg-card);
  font-size: 13px;
  font-weight: 500;
  color: var(--text-dark);
  cursor: pointer;
  transition: all 0.15s;
}
.scan-mode-btn:active { transform: scale(0.97); }
.scan-mode-btn.active {
  border-color: var(--accent-green);
  background: var(--light-green);
  color: var(--accent-green);
  font-weight: 600;
}

.doctor-upload-box {
  border: 2px dashed var(--accent-green);
  border-radius: var(--radius);
  padding: 32px 20px;
  text-align: center;
  cursor: pointer;
  transition: background 0.2s;
}
.doctor-upload-box:active { background: var(--light-green); }
.doctor-upload-icon { font-size: 48px; margin-bottom: 8px; }
.doctor-upload-label { font-size: 16px; font-weight: 600; color: var(--text-dark); margin-bottom: 4px; }
.doctor-upload-hint { font-size: 13px; color: var(--text-light); }

/* Diagnosis result card */
.diagnosis-card {
  background: var(--white);
  border-radius: var(--radius);
  padding: 16px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 16px;
}
.diagnosis-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}
.diagnosis-disease { font-size: 16px; font-weight: 700; }
.severity-badge {
  padding: 4px 10px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 700;
}
.severity-low { background: var(--light-green); color: var(--secondary-green); }
.severity-moderate { background: #EFF6FF; color: #1D4ED8; }
.severity-severe { background: var(--soft-red); color: var(--pop-red); }
.severity-critical { background: var(--soft-red); color: var(--pop-red); }

.diagnosis-section { margin-bottom: 12px; }
.diagnosis-section-title {
  font-size: 12px;
  font-weight: 700;
  color: var(--text-light);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 4px;
}
.diagnosis-section-text {
  font-size: 14px;
  color: var(--text-dark);
  line-height: 1.5;
}

.urgency-badge {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 700;
  margin-top: 8px;
}
.urgency-immediate { background: var(--soft-red); color: var(--pop-red); }
.urgency-this_week { background: #EFF6FF; color: #1D4ED8; }
.urgency-monitor { background: #E3F2FD; color: #1976D2; }
.urgency-none { background: var(--light-green); color: var(--secondary-green); }

.diagnosis-title { font-size: 17px; font-weight: 700; margin: 0 0 6px; }
.diagnosis-text { font-size: 14px; color: #555; line-height: 1.5; margin: 0 0 8px; }
.diagnosis-treatment,
.diagnosis-prevention {
  margin-top: 10px;
  padding: 12px;
  border-radius: 8px;
  font-size: 14px;
  line-height: 1.5;
}
.diagnosis-treatment { background: #f0f9f0; }
.diagnosis-prevention { background: #f0f5ff; }
.diagnosis-urgency { margin-top: 8px; }
.confidence-badge {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-light);
  background: var(--bg-gray);
  padding: 3px 8px;
  border-radius: 16px;
}

/* Economics impact grid */
.diagnosis-econ {
  margin: 14px 0;
  padding: 14px;
  background: #FAFAFA;
  border-radius: 16px;
  border: 1px solid var(--border);
}
.econ-title {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--text-light);
  margin-bottom: 10px;
}
.econ-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}
.econ-item {
  text-align: center;
  padding: 10px 4px;
  border-radius: 8px;
}
.econ-loss { background: var(--soft-red); }
.econ-cost { background: #E3F2FD; }
.econ-roi { background: #E8F5E9; }
.econ-value {
  font-size: 20px;
  font-weight: 800;
  line-height: 1.2;
}
.econ-loss .econ-value { color: var(--pop-red); }
.econ-cost .econ-value { color: #1565C0; }
.econ-roi .econ-value { color: #2E7D32; }
.econ-label {
  font-size: 11px;
  color: #777;
  margin-top: 4px;
  line-height: 1.3;
}

/* Diagnosis history items */
.diag-history-item {
  background: var(--white);
  border-radius: var(--radius-sm);
  padding: 12px;
  margin-bottom: 8px;
  border-bottom: 1px solid var(--border);
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 12px;
}
.diag-history-dot {
  width: 10px; height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}
.diag-history-info { flex: 1; }
.diag-history-name { font-size: 14px; font-weight: 600; }
.diag-history-date { font-size: 11px; color: var(--text-light); }
.diag-history-severity { font-size: 11px; font-weight: 600; }

/* ════════════════════════════════════════════════════
   FIELD MAP
════════════════════════════════════════════════════ */

.field-upload-row { margin-bottom: 16px; }

.field-card {
  background: var(--white);
  border-radius: var(--radius-sm);
  padding: 14px;
  margin-bottom: 10px;
  border-bottom: 1px solid var(--border);
  cursor: pointer;
}
.field-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 6px;
}
.field-card-name { font-size: 15px; font-weight: 600; }
.field-card-acres { font-size: 14px; font-weight: 600; color: var(--secondary-green); }
.field-card-details {
  display: flex;
  gap: 12px;
  font-size: 12px;
  color: var(--text-light);
}
.field-card-crop {
  font-size: 12px;
  color: var(--text-medium);
  margin-top: 4px;
}
.field-fsa-badge {
  display: inline-block;
  padding: 2px 6px;
  background: var(--light-green);
  color: var(--secondary-green);
  border-radius: 6px;
  font-size: 10px;
  font-weight: 700;
  margin-left: 8px;
}

/* ─── My Farm Summary & Cards ─── */
.farm-summary {
  margin-bottom: 16px;
}
.farm-summary-row {
  display: flex;
  gap: 8px;
}
.farm-stat {
  flex: 1;
  background: #fff;
  border: 1px solid #E2E8F0;
  border-radius: 16px;
  padding: 12px 8px;
  text-align: center;
}
.farm-stat-value {
  font-size: 20px;
  font-weight: 700;
  color: #0F172A;
  font-family: 'Inter', sans-serif;
}
.farm-stat-label {
  font-size: 11px;
  color: #64748B;
  margin-top: 2px;
  font-family: 'Inter', sans-serif;
}

.farm-field-card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 14px 16px;
  margin-bottom: 12px;
  cursor: pointer;
  transition: transform 0.15s ease;
}
.farm-field-card:active {
  transform: scale(0.97);
}
.farm-field-card-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 8px;
}
.farm-field-name {
  display: flex;
  align-items: center;
  gap: 10px;
}
.farm-field-icon {
  font-size: 22px;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #F0FDF4;
  border-radius: 8px;
}
.farm-field-title {
  font-size: 15px;
  font-weight: 600;
  color: #0F172A;
  font-family: 'Inter', sans-serif;
}
.farm-field-subtitle {
  font-size: 12px;
  color: #64748B;
  margin-top: 1px;
  font-family: 'Inter', sans-serif;
}
.farm-field-acres {
  font-size: 15px;
  font-weight: 700;
  color: #16A34A;
  white-space: nowrap;
  font-family: 'Inter', sans-serif;
}
.farm-field-card-details {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.farm-field-tag {
  font-size: 12px;
  color: #64748B;
  background: #F8FAFC;
  border: 1px solid #E2E8F0;
  border-radius: 6px;
  padding: 3px 8px;
  font-family: 'Inter', sans-serif;
}
.farm-field-status {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-left: auto;
}

/* ─── Set Location Button on Field Cards ─── */
.btn-set-location {
  display: block;
  width: 100%;
  margin-top: 8px;
  padding: 6px 0;
  font-size: 13px;
  font-weight: 500;
  color: #3b82f6;
  background: #f0f7ff;
  border: 1px solid #dbeafe;
  border-radius: 6px;
  cursor: pointer;
  font-family: 'Inter', sans-serif;
  transition: background 0.15s;
}
.btn-set-location:hover {
  background: #dbeafe;
}

/* ─── Field Pin Labels on Map ─── */
.field-pin-label {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 4px;
  padding: 2px 6px;
  font-size: 11px;
  font-weight: 600;
  color: #1e293b;
  box-shadow: 0 1px 3px rgba(0,0,0,0.1);
  white-space: nowrap;
  font-family: 'Inter', sans-serif;
}
.field-pin-label::before {
  border-top-color: #e2e8f0;
}

/* ─── Crop Pin Icon ─── */
.crop-pin {
  background: transparent;
  border: none;
}

/* ─── 3-Year Crop Rotation Planner ─── */
.rotation-legend {
  display: flex;
  gap: 16px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}
.rotation-legend-item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: #475569;
  font-family: 'Inter', sans-serif;
}
.rotation-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  display: inline-block;
}
.rotation-grid {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.rotation-header-row {
  display: grid;
  grid-template-columns: 120px repeat(3, 1fr);
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
  font-weight: 600;
  font-size: 13px;
  color: #1e293b;
  font-family: 'Inter', sans-serif;
}
.rotation-header-row .rotation-field-cell,
.rotation-header-row .rotation-year-cell {
  padding: 10px 8px;
  text-align: center;
}
.rotation-header-row .rotation-field-cell {
  text-align: left;
}
.rotation-row {
  display: grid;
  grid-template-columns: 120px repeat(3, 1fr);
  border-bottom: 1px solid #f1f5f9;
  align-items: stretch;
}
.rotation-row:last-child {
  border-bottom: none;
}
.rotation-field-cell {
  padding: 8px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.rotation-field-name {
  font-size: 13px;
  font-weight: 600;
  color: #1e293b;
  font-family: 'Inter', sans-serif;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rotation-field-acres {
  font-size: 11px;
  color: #94a3b8;
  font-family: 'Inter', sans-serif;
}
.rotation-cell {
  padding: 8px 6px;
  cursor: pointer;
  transition: background 0.15s;
  background: #fff;
  display: flex;
  flex-direction: column;
  gap: 2px;
  border-bottom: 1px solid #f1f5f9;
}
.rotation-cell:hover {
  background: #f0f7ff;
}
.rotation-crop-label {
  font-size: 13px;
  font-weight: 600;
  color: #1e293b;
  font-family: 'Inter', sans-serif;
}
.rotation-econ {
  font-size: 11px;
  font-weight: 500;
  font-family: 'Inter', sans-serif;
}
.rotation-warn {
  font-size: 10px;
  color: #dc2626;
  font-weight: 500;
  font-family: 'Inter', sans-serif;
}
.rotation-summary-row {
  display: grid;
  grid-template-columns: 120px repeat(3, 1fr);
  background: #f8fafc;
  border-top: 2px solid #e2e8f0;
}
.rotation-summary-cell {
  padding: 8px 6px;
  font-size: 12px;
  font-weight: 500;
  font-family: 'Inter', sans-serif;
  text-align: left;
}
.rotation-warnings {
  margin-top: 16px;
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 8px;
  padding: 12px;
}
.rotation-warnings-title {
  font-size: 14px;
  font-weight: 600;
  color: #991b1b;
  margin-bottom: 8px;
  font-family: 'Inter', sans-serif;
}
.rotation-warning-item {
  font-size: 13px;
  color: #7f1d1d;
  margin-bottom: 4px;
  font-family: 'Inter', sans-serif;
}

/* ─── Soil Depletion Section ─── */
.rotation-depletion-section {
  background: #F0FDF4;
  border: 1px solid #86EFAC;
  border-radius: 12px;
  padding: 14px 16px;
  margin-top: 16px;
  font-family: 'Inter', sans-serif;
}
.rotation-depletion-title {
  font-size: 14px;
  font-weight: 700;
  color: #166534;
  margin-bottom: 4px;
}
.rotation-depletion-note {
  font-size: 12px;
  color: #4ade80;
  color: #15803d;
  margin-bottom: 10px;
}
.rotation-depletion-table {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.rotation-depletion-header {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr 2fr;
  gap: 8px;
  font-size: 11px;
  font-weight: 700;
  color: #166534;
  padding: 4px 6px;
  border-bottom: 1px solid #86EFAC;
}
.rotation-depletion-row {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr 2fr;
  gap: 8px;
  font-size: 12px;
  color: #374151;
  padding: 4px 6px;
  border-radius: 6px;
}
.rotation-depletion-row:nth-child(even) {
  background: #DCFCE7;
}

/* ─── Farm Quick Links ─── */
.farm-quick-links {
  margin-top: 20px;
  margin-bottom: 12px;
}
.farm-quick-links-title {
  font-size: 13px;
  font-weight: 600;
  color: #64748B;
  margin-bottom: 8px;
  font-family: 'Inter', sans-serif;
}
.farm-quick-links-row {
  display: flex;
  gap: 8px;
}
.farm-quick-link {
  flex: 1;
  background: #fff;
  border: 1px solid #E2E8F0;
  border-radius: 16px;
  padding: 14px 8px;
  font-size: 13px;
  font-weight: 500;
  color: #0F172A;
  text-align: center;
  cursor: pointer;
  font-family: 'Inter', sans-serif;
  transition: background 0.15s;
}
.farm-quick-link:active {
  background: #F0FDF4;
}

/* ─── Field Map ─── */
.field-map-container {
  height: 220px;
  border-radius: var(--radius-sm);
  overflow: hidden;
  margin-bottom: 12px;
  background: #e8f0e8;
  position: relative;
}
.field-map-container.empty-map {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--text-light);
  font-size: 14px;
}

/* FSA parse status */
.fsa-parse-status {
  background: var(--light-green);
  border-radius: var(--radius-sm);
  padding: 12px;
  margin-bottom: 12px;
  text-align: center;
}
.fsa-parse-status.loading {
  background: #DBEAFE;
  color: #1E40AF;
}
.fsa-parse-status.error {
  background: #f8d7da;
  color: #721c24;
}

/* FSA review modal */
.fsa-review-summary {
  background: var(--light-green);
  border-radius: var(--radius-sm);
  padding: 12px;
  margin-bottom: 12px;
}
.fsa-review-summary h4 { margin: 0 0 8px; font-size: 15px; }
.fsa-review-summary .fsa-meta {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  font-size: 13px;
  color: var(--text-medium);
}
.fsa-field-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 0;
  border-bottom: 1px solid var(--border);
}
.fsa-field-info { flex: 1; }
.fsa-field-name { font-weight: 600; font-size: 14px; }
.fsa-field-detail { font-size: 12px; color: var(--text-light); margin-top: 2px; }
.fsa-field-acres { font-weight: 600; color: var(--secondary-green); font-size: 14px; }

/* Field card enhancements */
.field-card-body {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.field-detail {
  font-size: 12px;
  color: var(--text-light);
  background: var(--bg);
  padding: 2px 8px;
  border-radius: 16px;
}
.field-card-notes {
  font-size: 12px;
  color: var(--text-light);
  margin-top: 6px;
  font-style: italic;
}
.fsa-badge {
  display: inline-block;
  padding: 2px 6px;
  background: var(--light-green);
  color: var(--secondary-green);
  border-radius: 6px;
  font-size: 10px;
  font-weight: 700;
  margin-left: 8px;
}
.parsed-badge {
  display: inline-block;
  padding: 2px 6px;
  background: #e3f2fd;
  color: #1565c0;
  border-radius: 6px;
  font-size: 10px;
  font-weight: 700;
  margin-left: 4px;
}

/* ─── Login ────────────────────────────────────────────────────────────── */
.login-form {
  width: 100%;
  max-width: 340px;
  margin: 0 auto;
  text-align: left;
}
.login-form .input-group {
  margin-bottom: 14px;
}
.login-error {
  color: #dc2626;
  font-size: 13px;
  padding: 8px 12px;
  background: #fee2e2;
  border-radius: 8px;
  margin-bottom: 12px;
}

/* ─── Disclaimer ───────────────────────────────────────────────────────── */
.disclaimer-box {
  margin-top: 20px;
  padding: 14px;
  background: #F8FAFC;
  border: 1px solid #E2E8F0;
  border-radius: 16px;
}
.disclaimer-check {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.disclaimer-check input[type="checkbox"] {
  margin-top: 3px;
  flex-shrink: 0;
  width: 18px;
  height: 18px;
}
.disclaimer-text {
  font-size: 11px;
  line-height: 1.5;
  color: var(--text-medium);
}

/* ─── Legal Footer ─────────────────────────────────────────────────────── */
.legal-footer {
  position: fixed;
  bottom: 56px;
  left: 0;
  right: 0;
  text-align: center;
  font-size: 9px;
  color: var(--text-light);
  padding: 4px 12px;
  background: rgba(248,250,252,0.95);
  z-index: 50;
  line-height: 1.4;
  pointer-events: none;
}

/* ─── Markets Overview ─────────────────────────────────────────────────── */
.market-section {
  margin-bottom: 20px;
}
.market-section-title {
  font-size: 15px;
  font-weight: 700;
  color: var(--text-dark);
  margin-bottom: 10px;
}
/* ─── Weekly Recap Cards ─── */
/* ─── Ag Content / Podcast Cards ─── */
.ag-content-card {
  min-width: 200px;
  max-width: 220px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  cursor: pointer;
  transition: transform 0.15s ease;
  flex-shrink: 0;
}
.ag-content-card:active { transform: scale(0.97); }
.ag-content-thumb {
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ag-content-info { padding: 10px 12px; }
.ag-content-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-dark);
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-family: 'Inter', sans-serif;
}
.ag-content-meta {
  font-size: 11px;
  color: var(--text-light);
  margin-top: 4px;
  font-family: 'Inter', sans-serif;
}

.weekly-recap-card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 14px 16px;
  margin-bottom: 10px;
}
.weekly-recap-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}
.weekly-recap-date {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-dark);
  font-family: 'Inter', sans-serif;
}
.weekly-recap-signal {
  font-size: 11px;
  font-weight: 700;
  padding: 2px 10px;
  border-radius: 8px;
  background: #f1f5f9;
  color: #64748b;
  font-family: 'Inter', sans-serif;
}
.weekly-recap-signal.signal-sell {
  background: #fef2f2;
  color: #dc2626;
}
.weekly-recap-prices {
  display: flex;
  gap: 16px;
  margin-bottom: 6px;
}
.weekly-recap-price {
  font-size: 15px;
  font-weight: 700;
  color: var(--text-dark);
  font-family: 'Inter', sans-serif;
}
.weekly-recap-chg {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-light);
}
.weekly-recap-position {
  font-size: 12px;
  color: var(--text-light);
  font-family: 'Inter', sans-serif;
}

.market-summary-row {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding-bottom: 4px;
  margin-bottom: 16px;
  -webkit-overflow-scrolling: touch;
}
.market-summary-card {
  flex: 0 0 auto;
  min-width: 120px;
  padding: 10px 12px;
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 16px;
}
.market-summary-label {
  font-size: 11px;
  color: var(--text-light);
  font-weight: 600;
  margin-bottom: 4px;
}
.market-summary-price {
  font-size: 18px;
  font-weight: 700;
  color: var(--text-dark);
}
.market-summary-change {
  font-size: 12px;
  font-weight: 600;
  margin-top: 2px;
}
.market-summary-change.up { color: #16A34A; }
.market-summary-change.down { color: #DC2626; }
.market-summary-change.flat { color: var(--text-light); }

/* Market Calendar */
.market-calendar-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 16px;
  margin-bottom: 6px;
}
.market-cal-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}
.market-cal-dot.high { background: #DC2626; }
.market-cal-dot.medium { background: #94A3B8; }
.market-cal-body {
  flex: 1;
  min-width: 0;
}
.market-cal-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-dark);
}
.market-cal-meta {
  font-size: 11px;
  color: var(--text-light);
  margin-top: 2px;
}
.market-cal-days {
  font-size: 12px;
  font-weight: 700;
  color: var(--text-dark);
  flex-shrink: 0;
  text-align: right;
  min-width: 40px;
}

/* Market News */
.market-news-card {
  padding: 10px 12px;
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 16px;
  margin-bottom: 6px;
}
.market-news-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-dark);
  margin-bottom: 2px;
}
.market-news-time {
  font-size: 11px;
  color: var(--text-light);
}

/* ─── Basis Board ──────────────────────────────────────────────────────── */
.basis-board-tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 16px;
  padding: 4px 0;
}
.basis-tab {
  flex: 1;
  padding: 8px 20px;
  border: 1px solid var(--border);
  border-radius: 9999px;
  background: transparent;
  font-size: 14px;
  font-weight: 600;
  color: #64748B;
  cursor: pointer;
  text-align: center;
  transition: all 0.2s;
}
.basis-tab.active {
  border-color: #16A34A;
  background: #16A34A;
  color: #fff;
}
.basis-board-table {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.basis-board-row {
  display: flex;
  align-items: center;
  padding: 12px;
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 16px;
  cursor: pointer;
  transition: box-shadow 0.15s;
}
.basis-board-row:hover {
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}
.basis-board-row.best-row {
  border-color: var(--primary-green);
  background: #f0fdf4;
}
.basis-row-left {
  flex: 1;
  min-width: 0;
}
.basis-row-name {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-dark);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.basis-row-meta {
  font-size: 11px;
  color: var(--text-light);
  margin-top: 2px;
}
.basis-row-mid {
  width: 68px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.sparkline {
  display: block;
}
.basis-row-right {
  width: 60px;
  text-align: right;
  flex-shrink: 0;
}
.basis-value {
  font-size: 15px;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 6px;
  display: inline-block;
}
.basis-value.basis-strong {
  color: #15803d;
  background: #dcfce7;
}
.basis-value.basis-weak {
  color: #475569;
  background: #f1f5f9;
}
.basis-value.basis-very-weak {
  color: #dc2626;
  background: #fee2e2;
}
.basis-value.basis-unknown {
  color: var(--text-light);
}
.basis-cash {
  font-size: 11px;
  color: var(--text-light);
  margin-top: 2px;
}
.source-tag {
  display: inline-block;
  padding: 1px 4px;
  border-radius: 3px;
  font-size: 9px;
  font-weight: 700;
  margin-left: 4px;
  vertical-align: middle;
}
.source-tag.barchart {
  background: #e0e7ff;
  color: #4338ca;
}
.source-tag.local {
  background: #f1f5f9;
  color: #475569;
}
.source-tag.farmbucks {
  background: #f0fdf4;
  color: #15803d;
}
.badge-home-sm {
  display: inline-block;
  padding: 1px 4px;
  border: 1.5px solid var(--text-dark);
  border-radius: 3px;
  font-size: 9px;
  font-weight: 700;
  margin-right: 4px;
  vertical-align: middle;
  color: var(--text-dark);
}
.best-tag-sm {
  display: inline-block;
  padding: 1px 5px;
  background: var(--primary-green);
  color: white;
  border-radius: 4px;
  font-size: 9px;
  font-weight: 700;
  margin-right: 4px;
  vertical-align: middle;
}
.basis-board-timestamp {
  text-align: center;
  font-size: 11px;
  color: var(--text-light);
  margin-top: 12px;
  padding-bottom: 120px;
}

/* ─── Basis Tracker ───────────────────────────────────────────────────── */
.basis-tracker-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.basis-tracker-card {
  padding: 12px;
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 16px;
}
.basis-tracker-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 6px;
}
.basis-tracker-name {
  font-size: 13px;
  font-weight: 700;
  color: var(--text-dark);
}
.basis-tracker-trend {
  font-size: 12px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 6px;
}
.basis-tracker-trend.strengthening {
  color: #15803d;
  background: #dcfce7;
}
.basis-tracker-trend.weakening {
  color: #dc2626;
  background: #fee2e2;
}
.basis-tracker-trend.neutral {
  color: #475569;
  background: #f1f5f9;
}
.basis-tracker-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 4px 0;
}
.basis-tracker-label {
  font-size: 12px;
  color: var(--text-light);
}
.basis-tracker-value {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-dark);
}
.basis-tracker-diff {
  font-size: 12px;
  font-weight: 600;
  margin-top: 4px;
  padding: 4px 8px;
  border-radius: 6px;
}
.basis-tracker-diff.stronger {
  color: #15803d;
  background: #f0fdf4;
}
.basis-tracker-diff.weaker {
  color: #dc2626;
  background: #fef2f2;
}
.basis-tracker-rec {
  font-size: 11px;
  color: var(--text-medium);
  margin-top: 6px;
  padding: 6px 8px;
  background: #f8fafc;
  border-radius: 6px;
  border-left: 3px solid var(--border);
}
.basis-tracker-rec.rec-sell {
  border-left-color: #16A34A;
}
.basis-tracker-rec.rec-wait {
  border-left-color: #64748B;
}

/* Basis Education Card */
.basis-edu-card {
  padding: 14px;
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 16px;
}
.basis-edu-title {
  font-size: 13px;
  font-weight: 700;
  color: var(--text-dark);
  margin-bottom: 4px;
}
.basis-edu-body {
  font-size: 12px;
  color: var(--text-medium);
  line-height: 1.5;
}
.basis-edu-strategies {
  margin-top: 6px;
}
.basis-strategy {
  font-size: 12px;
  color: var(--text-medium);
  padding: 4px 0;
  line-height: 1.4;
}
.basis-strategy-name {
  font-weight: 700;
  color: var(--text-dark);
}

/* ─── FieldView Integration ───────────────────────────────────────────── */
.fieldview-banner {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border-radius: var(--radius-sm);
  border: 2px solid var(--border);
  margin-top: 8px;
}
.fieldview-banner.disconnected {
  background: #f8faf8;
  border-color: #d1d5db;
}
.fieldview-banner.connected {
  background: #f0fdf4;
  border-color: var(--primary-green);
}
.fv-banner-icon { font-size: 28px; flex-shrink: 0; }
.fv-banner-text { flex: 1; min-width: 0; }
.fv-banner-title { font-weight: 600; font-size: 14px; }
.fv-banner-sub { font-size: 12px; color: var(--text-light); margin-top: 2px; }
.fv-banner-meta { font-size: 11px; color: var(--text-light); margin-top: 4px; }
.fv-banner-actions { display: flex; gap: 8px; flex-direction: column; align-items: flex-end; }
.btn-sm { padding: 6px 14px; font-size: 13px; }
.btn-text-danger {
  background: none; border: none; color: #dc2626;
  font-size: 12px; cursor: pointer; padding: 4px;
}
.fieldview-badge {
  display: inline-block;
  padding: 2px 6px;
  background: #dbeafe;
  color: #1d4ed8;
  border-radius: 6px;
  font-size: 10px;
  font-weight: 700;
  margin-left: 4px;
}
.fv-sync-spinner {
  display: inline-block;
  width: 14px; height: 14px;
  border: 2px solid #ccc;
  border-top-color: var(--primary-green);
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ─── Field Detail Modal ─────────────────────────────────────────────── */
.modal-card-tall { max-height: 85vh; }
.field-detail-map {
  height: 180px;
  border-radius: var(--radius-sm);
  overflow: hidden;
  margin-bottom: 12px;
  background: #e8f0e8;
}
/* ─── Field Detail Tabs ─── */
.fd-tabs {
  display: flex;
  gap: 0;
  background: var(--border);
  border-radius: var(--radius-sm);
  padding: 3px;
  margin-bottom: 16px;
}
.fd-tab {
  flex: 1;
  padding: 8px 4px;
  border: none;
  border-radius: 14px;
  background: transparent;
  font-weight: 600;
  font-size: 12px;
  color: var(--text-medium);
  cursor: pointer;
  transition: all 0.15s;
  font-family: 'Inter', sans-serif;
  min-height: 36px;
}
.fd-tab.active {
  background: var(--white);
  color: var(--text-dark);
  box-shadow: var(--shadow);
}

.agronomic-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 12px;
}
.agronomic-card {
  background: var(--bg);
  border-radius: var(--radius-sm);
  padding: 10px;
}
.agronomic-label { font-size: 11px; color: var(--text-light); text-transform: uppercase; }
.agronomic-value { font-size: 15px; font-weight: 600; margin-top: 2px; }
.irrigation-card {
  background: #e0f2fe;
  border-radius: var(--radius-sm);
  padding: 12px;
  margin-bottom: 12px;
}
.irrigation-card h4 { font-size: 13px; margin: 0 0 6px; }
.irrigation-detail { font-size: 12px; color: var(--text-medium); }

/* Yield Chart */
.yield-chart { margin-bottom: 12px; }
.yield-chart h4 { font-size: 13px; margin: 0 0 8px; }
.yield-bars {
  display: flex;
  align-items: flex-end;
  gap: 6px;
  height: 100px;
}
.yield-bar-wrapper {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100%;
}
.yield-bar {
  width: 100%;
  border-radius: 4px 4px 0 0;
  min-height: 4px;
  margin-top: auto;
  transition: height 0.3s;
}
.yield-bar-label {
  font-size: 10px;
  color: var(--text-light);
  margin-top: 4px;
}
.yield-bar-val {
  font-size: 10px;
  font-weight: 600;
  margin-bottom: 2px;
}

/* Map layer toggle */
.map-layer-toggle {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 1000;
  background: white;
  border-radius: 6px;
  box-shadow: 0 1px 4px rgba(0,0,0,0.2);
  padding: 6px 8px;
  display: flex;
  gap: 4px;
}
.map-layer-btn {
  padding: 4px 8px;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: white;
  font-size: 11px;
  cursor: pointer;
}
.map-layer-btn.active {
  background: var(--primary-green);
  color: white;
  border-color: var(--primary-green);
}

/* ─── Farm Vault ──────────────────────────────────────────────────────── */
.vault-tier-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 700;
  margin-bottom: 12px;
}
.vault-tier-badge.starter { background: #e5e7eb; color: #374151; }
.vault-tier-badge.pro { background: #dbeafe; color: #1d4ed8; }
.vault-tier-badge.commander { background: var(--light-green); color: var(--secondary-green); }

.vault-farm-selector {
  margin-bottom: 12px;
}
.vault-farm-selector select {
  width: 100%;
  padding: 10px 12px;
  border: 2px solid var(--border);
  border-radius: var(--radius-sm);
  font-size: 14px;
  background: var(--card-bg);
}

.vault-categories {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 4px 0;
  margin-bottom: 12px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.vault-cat-btn {
  padding: 8px 20px;
  border: 1px solid var(--border);
  border-radius: 9999px;
  background: transparent;
  font-size: 12px;
  font-weight: 600;
  color: #64748B;
  white-space: nowrap;
  cursor: pointer;
  transition: all 0.15s;
}
.vault-cat-btn.active,
.vault-cat-btn.active:focus,
.vault-cat-btn.active:active {
  background: #16A34A !important;
  color: #fff !important;
  border-color: #16A34A !important;
  opacity: 1 !important;
}
.vault-cat-btn:active {
  opacity: 0.8;
}

.vault-upload-row { margin-bottom: 12px; }

.vault-doc-card {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 12px;
  margin-bottom: 8px;
  cursor: pointer;
  transition: box-shadow 0.15s;
}
.vault-doc-card:hover { box-shadow: 0 2px 8px rgba(0,0,0,0.08); }
.vault-doc-header {
  display: flex;
  align-items: center;
  gap: 10px;
}
.vault-doc-icon { font-size: 24px; flex-shrink: 0; }
.vault-doc-info { flex: 1; min-width: 0; }
.vault-doc-name {
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.vault-doc-meta {
  font-size: 11px;
  color: var(--text-light);
  margin-top: 2px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.vault-doc-cat {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 4px;
  font-size: 10px;
  font-weight: 600;
  background: #f3f4f6;
  color: var(--text-medium);
}
.vault-doc-ai {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 4px;
  font-size: 10px;
  font-weight: 700;
  background: var(--light-green);
  color: var(--secondary-green);
}
.vault-doc-summary {
  font-size: 12px;
  color: var(--text-medium);
  margin-top: 6px;
  line-height: 1.4;
}
.vault-doc-count {
  text-align: center;
  font-size: 11px;
  color: var(--text-light);
  margin-top: 8px;
  padding-bottom: 120px;
}

.vault-tier-note {
  font-size: 12px;
  color: var(--text-light);
  padding: 8px;
  background: var(--bg);
  border-radius: var(--radius-sm);
  margin-top: 8px;
}

.vault-doc-field {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 4px;
  font-size: 10px;
  font-weight: 600;
  background: #dbeafe;
  color: #1d4ed8;
}
.vault-doc-actions {
  display: flex;
  gap: 8px;
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--border);
}
.vault-doc-actions button {
  flex: 1;
  padding: 6px 8px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--card-bg);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.15s;
}
.vault-doc-actions button:hover {
  background: var(--bg-main);
}
.vault-doc-actions button.btn-vault-delete {
  color: var(--pop-red);
  border-color: var(--pop-red);
}
.vault-doc-actions button.btn-vault-delete:hover {
  background: var(--soft-red);
}

/* Tier info card in settings */
.tier-info-card {
  padding: 14px;
  border-radius: var(--radius-sm);
  border: 2px solid var(--border);
  margin-top: 8px;
}
.tier-info-card .tier-name { font-weight: 700; font-size: 16px; }
.tier-info-card .tier-price { font-size: 14px; color: var(--text-medium); }
.tier-info-card .tier-features { font-size: 12px; color: var(--text-light); margin-top: 8px; line-height: 1.6; }
.tier-upgrade-btn {
  margin-top: 10px;
  padding: 8px 16px;
  background: var(--primary-green);
  color: white;
  border: none;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}
.current-plan-card { margin-bottom: 16px; }
.trial-countdown-inline { color: #1565c0; font-weight: 600; margin-top: 4px; font-size: 13px; }
.plan-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 12px; }
.plan-card { background: #fafafa; border: 2px solid #E2E8F0; border-radius: 20px; padding: 14px 10px; text-align: center; position: relative; }
.plan-card.plan-active { border-color: var(--primary-green); background: #f0f7e6; }
.plan-card.plan-popular { border-color: var(--primary-green); }
.plan-popular-badge { position: absolute; top: -10px; left: 50%; transform: translateX(-50%); background: var(--primary-green); color: white; font-size: 10px; font-weight: 700; padding: 2px 8px; border-radius: 8px; white-space: nowrap; }
.plan-name { font-weight: 700; font-size: 14px; margin-bottom: 4px; }
.plan-price { font-size: 22px; font-weight: 800; color: var(--primary-green); }
.plan-price span { font-size: 12px; font-weight: 400; color: #999; }
.plan-features { font-size: 11px; color: #666; text-align: left; margin: 10px 0; line-height: 1.5; }
.plan-btn { width: 100%; padding: 8px; border: none; border-radius: 8px; font-size: 12px; font-weight: 600; cursor: pointer; background: var(--primary-green); color: white; }
.plan-btn.plan-btn-current { background: #E2E8F0; color: #666; cursor: default; }
.plan-btn.plan-btn-coming { background: #f1f5f9; color: #94A3B8; cursor: default; }
.plan-advisory-teaser { background: #f8fafc; border: 1px solid var(--border); border-radius: 20px; padding: 14px; margin-top: 12px; text-align: center; }
.plan-advisory-teaser .plan-name { color: var(--text-dark); }
.plan-advisory-teaser .plan-desc { font-size: 12px; color: #666; margin: 6px 0 10px; }

/* Category icons */
.cat-icon { font-size: 16px; }

/* ─── Equipment Fleet ─────────────────────────────────────────────────── */
.equip-costs-summary {
  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px;
  padding: 14px; background: var(--light-green); border-radius: var(--radius); margin-bottom: 16px;
}
.equip-cost-stat { text-align: center; }
.equip-cost-stat-value { font-size: 18px; font-weight: 700; color: var(--primary-green); }
.equip-cost-stat-label { font-size: 10px; color: var(--text-light); text-transform: uppercase; letter-spacing: 0.5px; }

.equip-alerts-bar {
  display: flex; gap: 8px; overflow-x: auto; padding: 0 0 12px; margin-bottom: 4px;
  -webkit-overflow-scrolling: touch; scrollbar-width: none;
}
.equip-alerts-bar::-webkit-scrollbar { display: none; }
.equip-alert-chip {
  flex-shrink: 0; padding: 8px 14px; background: #FFF3E0; border-radius: 16px;
  font-size: 12px; font-weight: 600; color: #E65100; cursor: pointer; white-space: nowrap;
  border: 1px solid #FFE0B2;
}
.equip-alert-chip.urgent { background: #FFEBEE; color: #C62828; border-color: #FFCDD2; }

.equip-card {
  display: flex; flex-direction: column; gap: 0;
  padding: 0; background: var(--white); border-radius: var(--radius);
  border: 1px solid var(--border); margin-bottom: 12px; cursor: pointer;
  transition: transform 0.15s; overflow: hidden;
}
.equip-card:active { transform: scale(0.98); }
.equip-card-top {
  display: flex; align-items: center; gap: 12px; padding: 14px 14px 10px;
}
.equip-icon { font-size: 32px; flex-shrink: 0; }
.equip-info { flex: 1; min-width: 0; }
.equip-name { font-size: 15px; font-weight: 700; color: var(--text-dark); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.equip-meta { font-size: 12px; color: var(--text-light); margin-top: 2px; }
.equip-status-badge {
  padding: 3px 10px; border-radius: 16px; font-size: 11px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.3px; flex-shrink: 0;
}
.equip-status-badge.active { background: #E8F5E9; color: #2E7D32; }
.equip-status-badge.needs-service { background: #E3F2FD; color: #1565C0; }
.equip-status-badge.in-shop { background: #FFEBEE; color: #C62828; }

.equip-card-bottom {
  display: flex; align-items: center; gap: 10px; padding: 0 14px 12px;
}
.equip-hours-block {
  display: flex; align-items: baseline; gap: 4px; flex-shrink: 0; min-width: 80px;
}
.equip-hours-val { font-size: 16px; font-weight: 700; color: var(--primary-green); }
.equip-hours-unit { font-size: 11px; color: var(--text-light); font-weight: 500; }
.equip-service-bar-wrap { flex: 1; min-width: 0; }
.equip-service-label { font-size: 10px; color: var(--text-light); margin-bottom: 3px; display: flex; justify-content: space-between; }
.equip-service-bar {
  height: 6px; background: #E0E0E0; border-radius: 3px; overflow: hidden;
}
.equip-service-fill {
  height: 100%; border-radius: 3px; transition: width 0.3s;
}
.equip-service-fill.green { background: #4CAF50; }
.equip-service-fill.yellow { background: #FFC107; }
.equip-service-fill.red { background: #F44336; }

/* Legacy dot status (kept for compat) */
.equip-status {
  width: 12px; height: 12px; border-radius: 50%; flex-shrink: 0;
}
.equip-status.good { background: #4caf50; }
.equip-status.service_due { background: #3B82F6; }
.equip-status.needs_repair { background: #f44336; }
.equip-status.out_of_service { background: #9e9e9e; }
.equip-hours {
  font-size: 14px; font-weight: 700; color: var(--primary-green);
  text-align: right;
}
.equip-hours-label { font-size: 10px; color: var(--text-light); font-weight: 400; }

/* Equipment detail sections */
.equip-detail-section { margin-bottom: 20px; }
.equip-detail-section h4 { font-size: 14px; font-weight: 700; color: var(--text-medium); margin-bottom: 8px; border-bottom: 1px solid #eee; padding-bottom: 4px; }
.equip-detail-row { display: flex; justify-content: space-between; padding: 6px 0; font-size: 14px; }
.equip-detail-label { color: var(--text-light); }
.equip-detail-value { font-weight: 600; }
.equip-detail-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.equip-detail-actions button {
  flex: 1; min-width: 80px; padding: 10px; border-radius: 16px;
  font-size: 13px; font-weight: 600; cursor: pointer; border: 1px solid var(--accent-green);
}
.equip-detail-progress {
  margin: 16px 0; padding: 14px; background: #F5F5F5; border-radius: 16px;
}
.equip-detail-progress-label {
  display: flex; justify-content: space-between; font-size: 12px; color: var(--text-light); margin-bottom: 6px;
}
.equip-detail-progress-bar {
  height: 10px; background: #E0E0E0; border-radius: 5px; overflow: hidden;
}
.equip-detail-progress-fill {
  height: 100%; border-radius: 5px; transition: width 0.3s;
}
.equip-detail-cost-badge {
  display: inline-block; padding: 6px 14px; background: #FFF3E0; border-radius: 8px;
  font-size: 13px; font-weight: 600; color: #E65100; margin-top: 8px;
}

/* Service log items */
.service-log-item {
  display: flex; justify-content: space-between; align-items: center;
  padding: 10px; background: #f9f9f9; border-radius: 8px; margin-bottom: 6px; font-size: 13px;
}
.service-log-info { flex: 1; }
.service-log-type { font-weight: 600; color: var(--text-dark); }
.service-log-meta { font-size: 11px; color: var(--text-light); margin-top: 2px; }
.service-log-cost { font-weight: 700; color: var(--primary-green); font-size: 14px; }

/* Maintenance & repair items */
.maint-item, .repair-item {
  padding: 10px; background: #f9f9f9; border-radius: 8px; margin-bottom: 8px; font-size: 13px;
}
.maint-item-header, .repair-item-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 4px; }
.maint-item-type { font-weight: 600; text-transform: capitalize; }
.maint-status-badge {
  padding: 2px 8px; border-radius: 16px; font-size: 11px; font-weight: 600;
}
.maint-status-badge.overdue { background: var(--soft-red); color: var(--pop-red); }
.maint-status-badge.ok { background: var(--light-green); color: var(--secondary-green); }
.maint-complete-btn {
  padding: 4px 10px; font-size: 11px; background: var(--accent-green); color: white;
  border: none; border-radius: 6px; cursor: pointer; margin-top: 4px;
}

/* Hours log item */
.hours-item {
  display: flex; justify-content: space-between; padding: 8px 0; border-bottom: 1px solid #f0f0f0; font-size: 13px;
}

/* ─── Lease Vault ────────────────────────────────────────────────────── */
.lease-summary-card {
  display: grid; grid-template-columns: 1fr 1fr; gap: 10px;
  padding: 14px; background: var(--light-green);
  border-radius: var(--radius); margin-bottom: 16px;
}
.lease-stat { text-align: center; }
.lease-stat-value { font-size: 20px; font-weight: 700; color: var(--primary-green); }
.lease-stat-label { font-size: 11px; color: var(--text-light); }

.lease-card {
  padding: 14px; background: var(--white); border-radius: var(--radius);
  border-bottom: 1px solid var(--border); margin-bottom: 10px; cursor: pointer;
  transition: transform 0.15s; border-left: 4px solid var(--accent-green);
}
.lease-card:active { transform: scale(0.98); }
.lease-card.expiring { border-left-color: #3B82F6; }
.lease-card.expired { border-left-color: var(--pop-red); opacity: 0.7; }
.lease-card-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 4px; }
.lease-landlord { font-size: 15px; font-weight: 700; }
.lease-field-name { font-size: 13px; color: var(--text-light); margin-left: 6px; }
.lease-badge {
  padding: 2px 8px; border-radius: 16px; font-size: 11px; font-weight: 600; white-space: nowrap;
  display: inline-flex; align-items: center; gap: 4px;
}
.lease-dot {
  width: 7px; height: 7px; border-radius: 50%; display: inline-block; flex-shrink: 0;
}
.lease-dot.active { background: #16A34A; }
.lease-dot.expiring { background: #3B82F6; }
.lease-dot.expired { background: #DC2626; }
.lease-badge.active { background: var(--light-green); color: var(--secondary-green); }
.lease-badge.expiring { background: #EFF6FF; color: #1D4ED8; }
.lease-badge.expired { background: var(--soft-red); color: var(--pop-red); }
.lease-card-meta {
  display: flex; gap: 8px; flex-wrap: wrap; font-size: 12px; color: var(--text-medium);
  margin-bottom: 4px;
}
.lease-card-meta span:not(:last-child)::after { content: '\00b7'; margin-left: 8px; color: var(--border); }
.lease-card-days { font-size: 12px; color: var(--text-light); }
.lease-card-details { font-size: 13px; color: var(--text-medium); line-height: 1.6; }

/* Lease detail */
.lease-detail-section { margin-bottom: 20px; }
.lease-detail-section h4 { font-size: 14px; font-weight: 700; color: var(--text-medium); margin-bottom: 8px; border-bottom: 1px solid #eee; padding-bottom: 4px; }
.lease-detail-row { display: flex; justify-content: space-between; padding: 6px 0; font-size: 14px; }
.lease-detail-label { color: var(--text-light); }
.lease-detail-value { font-weight: 600; }
.lease-detail-actions { display: flex; gap: 8px; flex-wrap: wrap; margin: 16px 0; }
.lease-detail-actions button {
  flex: 1; min-width: 100px; padding: 10px; border-radius: 16px;
  font-size: 13px; font-weight: 600; cursor: pointer; border: 1px solid var(--accent-green);
}
.payment-item {
  display: flex; justify-content: space-between; align-items: center;
  padding: 8px 0; border-bottom: 1px solid #f0f0f0; font-size: 13px;
}
.payment-amount { font-weight: 700; color: var(--primary-green); }

/* Modal full height */
.modal-full { max-height: 85vh; overflow-y: auto; }

/* Input row for side-by-side fields */
.input-row { display: flex; gap: 10px; }
.input-group.half { flex: 1; }

/* ─── Soil Tests ──────────────────────────────────────────────────────────── */
.soil-upload-area { margin-bottom: 16px; }
.soil-field-select { margin-bottom: 10px; }
.soil-field-select label { font-size: 13px; color: var(--text-medium); margin-right: 8px; }
.soil-field-select select { width: 100%; padding: 8px; border-radius: var(--radius-sm); border: 1px solid var(--border); font-size: 14px; }
.soil-crop-row { display: flex; gap: 10px; margin-bottom: 12px; }
.soil-upload-box {
  border: 2px dashed var(--primary-green);
  border-radius: var(--radius-sm);
  padding: 24px 16px;
  text-align: center;
  cursor: pointer;
  transition: background 0.2s;
}
.soil-upload-box:active { background: var(--light-green); }
.soil-badge {
  display: inline-block;
  padding: 2px 8px;
  background: #e0f2fe;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 600;
  color: #1e40af;
}
.soil-test-card:hover { background: #f0f9ff !important; }

/* Soil test zone display */
.soil-field-group {
  background: var(--card-bg);
  border-radius: var(--radius);
  border: 1px solid var(--border);
  margin-bottom: 12px;
  overflow: hidden;
}
.soil-field-header {
  padding: 12px 14px;
  border-bottom: 1px solid var(--border);
  background: #f8fafc;
}
.soil-zone-card {
  padding: 10px 14px;
  border-bottom: 1px solid #f1f5f9;
  cursor: pointer;
  transition: background 0.15s;
}
.soil-zone-card:last-child { border-bottom: none; }
.soil-zone-card:hover { background: #f0fdf4; }
.soil-zone-name {
  font-weight: 600;
  font-size: 13px;
  margin-bottom: 6px;
  color: var(--text-dark);
}
.soil-nutrient-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.soil-nutrient-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 8px;
  border: 1.5px solid;
  border-radius: 16px;
  font-size: 11px;
  background: #fff;
}
.soil-level-tag {
  font-size: 9px;
  font-weight: 700;
  color: #fff;
  padding: 1px 5px;
  border-radius: 8px;
  letter-spacing: 0.3px;
}
.soil-rec-text {
  margin-top: 6px;
  font-size: 12px;
  color: var(--text-medium);
  font-style: italic;
  line-height: 1.4;
}
.soil-detail-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 14px;
}
.soil-detail-card {
  background: #f8fafc;
  border-radius: 8px;
  padding: 10px 12px;
}
.soil-detail-label { font-size: 11px; color: var(--text-light); }
.soil-detail-value { font-size: 18px; font-weight: 700; color: var(--text-dark); }
.soil-detail-level { font-size: 11px; font-weight: 600; margin-top: 2px; }
.soil-rec-box {
  background: #fffbeb;
  border: 1px solid #CBD5E1;
  border-radius: 8px;
  padding: 10px 12px;
  margin-bottom: 14px;
}
.soil-ranges-ref {
  background: #f1f5f9;
  border-radius: 8px;
  padding: 8px 12px;
  margin-top: 12px;
}

/* ─── Soil Test Assignment & Fert Recs ──────────────────────────────────── */
.soil-assign-info {
  background: var(--light-green);
  border-radius: 8px;
  padding: 10px 14px;
  font-size: 13px;
  font-weight: 600;
  color: var(--secondary-green);
  margin-bottom: 16px;
}
.soil-assign-banner {
  background: #f1f5f9;
  border: 1px dashed var(--border);
  border-radius: 8px;
  padding: 10px 14px;
  font-size: 13px;
  cursor: pointer;
  margin-bottom: 14px;
  color: var(--text-medium);
}
.soil-assign-banner:active { background: #e2e8f0; }
.soil-action-row {
  display: flex;
  gap: 8px;
  margin-bottom: 14px;
}
.soil-fert-card {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  overflow: hidden;
  margin-top: 14px;
}
.soil-fert-header {
  padding: 12px 14px;
  border-bottom: 1px solid var(--border);
}
.soil-fert-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 14px;
  border-bottom: 1px solid #f1f5f9;
}
.soil-fert-info { flex: 1; }
.soil-fert-nutrient { font-weight: 600; font-size: 13px; color: var(--text-dark); }
.soil-fert-product { font-size: 11px; color: var(--text-light); margin-top: 1px; }
.soil-fert-rate { font-size: 11px; color: var(--text-medium); margin-top: 1px; }
.soil-fert-note { font-size: 11px; color: var(--text-light); font-style: italic; margin-top: 2px; }
.soil-fert-cost { font-weight: 700; font-size: 14px; color: var(--primary-green); white-space: nowrap; margin-left: 12px; }
.soil-fert-total {
  display: flex;
  justify-content: space-between;
  padding: 12px 14px;
  font-weight: 700;
  font-size: 15px;
  border-top: 1px solid var(--border);
}
.soil-fert-source {
  padding: 6px 14px 10px;
  font-size: 10px;
  color: var(--text-light);
}
.soil-fert-empty {
  background: var(--light-green);
  border-radius: 8px;
  padding: 14px;
  text-align: center;
}

/* ─── Nutrient Education Expandable Cards ──────────────────────────────── */
.soil-fert-row { cursor: pointer; transition: background 0.15s; }
.soil-fert-row:active { background: #f8fafc; }
.soil-fert-chevron {
  font-size: 12px; color: var(--text-light); margin-left: 8px;
  transition: transform 0.25s ease;
  flex-shrink: 0;
}
.soil-fert-chevron.open { transform: rotate(90deg); }
.soil-fert-expand {
  max-height: 0; overflow: hidden;
  transition: max-height 0.35s ease;
}
.soil-fert-expand.open { max-height: 1200px; }
.nutrient-edu-card {
  padding: 14px;
  background: #f8fafc;
  border-bottom: 1px solid var(--border);
}
.nutrient-edu-card h4 {
  font-size: 13px; font-weight: 700; color: var(--text-dark);
  margin: 0 0 6px 0;
}
.nutrient-edu-what {
  font-size: 12px; color: var(--text-medium); line-height: 1.5;
  margin-bottom: 12px;
}
.nutrient-edu-section-title {
  font-size: 11px; font-weight: 700; color: var(--text-light);
  text-transform: uppercase; letter-spacing: 0.5px;
  margin: 12px 0 6px 0;
}
.nutrient-edu-symptoms {
  display: flex; flex-direction: column; gap: 4px;
  margin-bottom: 12px;
}
.nutrient-edu-symptom {
  font-size: 11px; color: var(--text-medium); line-height: 1.4;
}
.nutrient-edu-symptom strong {
  color: var(--text-dark); font-weight: 600;
}
.nutrient-edu-table {
  width: 100%; border-collapse: collapse;
  font-size: 11px; margin-bottom: 10px;
}
.nutrient-edu-table th {
  text-align: left; font-weight: 600; color: var(--text-dark);
  padding: 6px 8px; border-bottom: 1px solid var(--border);
  background: #fff; font-size: 10px; text-transform: uppercase;
  letter-spacing: 0.3px;
}
.nutrient-edu-table td {
  padding: 5px 8px; border-bottom: 1px solid #f1f5f9;
  color: var(--text-medium); vertical-align: top;
}
.nutrient-edu-table tr.best-value td {
  background: #f0fdf4; color: var(--secondary-green); font-weight: 600;
}
.best-value-badge {
  display: inline-block; font-size: 9px; font-weight: 700;
  background: var(--primary-green); color: #fff;
  padding: 1px 5px; border-radius: 4px; margin-left: 4px;
  vertical-align: middle;
}
.nutrient-edu-tips {
  font-size: 11px; color: var(--text-medium); line-height: 1.5;
  background: #fff; border-radius: 6px; padding: 8px 10px;
  border: 1px solid #f1f5f9; margin-bottom: 8px;
}
.nutrient-edu-warning {
  font-size: 11px; color: var(--pop-red); line-height: 1.4;
  background: var(--soft-red); border-radius: 6px; padding: 8px 10px;
  font-weight: 500;
}
.soil-fert-micro-divider {
  padding: 6px 14px; font-size: 11px; color: var(--text-light);
  font-weight: 600; text-align: center; letter-spacing: 1px;
  border-bottom: 1px solid #f1f5f9;
}

/* ─── Budget Tier Badges & Cost-to-Skip ────────────────────────────────── */
.fert-tier-divider {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 14px 4px; font-size: 11px; font-weight: 700;
  letter-spacing: 0.5px; text-transform: uppercase;
}
.fert-tier-divider::after {
  content: ''; flex: 1; height: 1px; background: #e2e8f0;
}
.fert-tier-badge {
  display: inline-block; font-size: 9px; font-weight: 700;
  padding: 2px 6px; border-radius: 4px; color: #fff;
  vertical-align: middle; margin-left: 6px; letter-spacing: 0.3px;
}
.fert-tier-badge.must-have { background: #dc2626; }
.fert-tier-badge.should-have { background: #2563eb; }
.fert-tier-badge.nice-to-have { background: #16a34a; }
.fert-skip-cost {
  font-size: 10px; color: #dc2626; margin-top: 2px; font-weight: 500;
}
.fert-roi-good { color: #16a34a; }
.fert-budget-summary {
  padding: 12px 14px; border-top: 1px solid var(--border);
  background: #f8fafc;
}
.fert-budget-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: 4px 0; font-size: 13px;
}
.fert-budget-row.active {
  font-weight: 700; font-size: 14px; color: var(--text-dark);
}
.fert-budget-label { display: flex; align-items: center; gap: 6px; }
.fert-budget-dot {
  width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0;
}
.fert-budget-tip {
  margin-top: 10px; padding: 8px 10px; background: #fff;
  border: 1px solid #e2e8f0; border-radius: 6px;
  font-size: 11px; color: var(--text-medium); line-height: 1.5;
}
.fert-roi-tag {
  display: inline-block; font-size: 9px; font-weight: 600;
  padding: 1px 5px; border-radius: 4px; margin-left: 4px;
  vertical-align: middle;
}
.fert-roi-tag.positive { background: #f0fdf4; color: #16a34a; }
.fert-roi-tag.negative { background: #fef2f2; color: #dc2626; }

/* ─── Timing Group Headers & Badges ──────────────────────────────────── */
.fert-timing-group-header {
  display: flex; align-items: center; gap: 8px;
  padding: 10px 14px 6px; border-top: 1px solid #e2e8f0;
}
.fert-timing-group-header:first-child { border-top: none; }
.fert-timing-group-label {
  flex: 1; font-size: 12px; font-weight: 600; color: var(--text-medium);
}
.fert-timing-group-cost {
  font-size: 12px; font-weight: 700; color: var(--primary-green); white-space: nowrap;
}
.fert-timing-badge {
  display: inline-block; font-size: 9px; font-weight: 700;
  padding: 2px 6px; border-radius: 4px; color: #fff;
  letter-spacing: 0.3px; white-space: nowrap;
}
.fert-timing-fall { background: #92400e; }
.fert-timing-pre-plant { background: #1d4ed8; }
.fert-timing-at-plant { background: #15803d; }
.fert-timing-sidedress { background: #7c3aed; }
.fert-timing-fertigation { background: #0891b2; }
.fert-timing-foliar { background: #b91c1c; }

.fert-analysis-tag {
  display: inline-block; font-size: 9px; font-weight: 600;
  padding: 1px 5px; border-radius: 3px;
  background: #f1f5f9; color: var(--text-medium);
  margin-left: 4px; vertical-align: middle;
}
.soil-fert-method {
  font-size: 10px; color: var(--text-light); margin-top: 1px;
}
.fert-alt-section {
  padding: 10px 14px; background: #f8fafc; border-bottom: 1px solid var(--border);
}

/* ─── Cash Flow Summary ──────────────────────────────────────────────── */
.fert-cashflow-summary {
  padding: 12px 14px; border-top: 1px solid var(--border); background: #fff;
}

/* ─── Yield Upsell ───────────────────────────────────────────────────── */
.fert-upsell-toggle {
  display: flex; justify-content: space-between; align-items: center;
  padding: 12px 14px; cursor: pointer; border-top: 1px solid var(--border);
  font-size: 13px; font-weight: 600; color: var(--text-medium);
}
.fert-upsell-toggle:active { background: #f8fafc; }
.fert-upsell-body {
  max-height: 0; overflow: hidden; transition: max-height 0.35s ease;
  padding: 0 14px;
}
.fert-upsell-body.open {
  max-height: 400px; padding: 0 14px 14px;
}
.fert-upsell-compare {
  display: flex; align-items: center; gap: 8px; margin-bottom: 12px;
}
.fert-upsell-col {
  flex: 1; background: #f8fafc; border-radius: 8px; padding: 10px; text-align: center;
}
.fert-upsell-arrow {
  font-size: 12px; font-weight: 700; color: var(--text-light); flex-shrink: 0;
}
.fert-upsell-label {
  font-size: 10px; color: var(--text-light); text-transform: uppercase;
  letter-spacing: 0.3px; margin-bottom: 2px;
}
.fert-upsell-goal {
  font-size: 18px; font-weight: 700; color: var(--text-dark);
}
.fert-upsell-val {
  font-size: 12px; color: var(--text-medium); margin-top: 2px;
}
.fert-upsell-math {
  background: #f8fafc; border-radius: 8px; padding: 10px 12px;
}
.fert-upsell-verdict {
  margin-top: 8px; padding: 6px 10px; border-radius: 6px;
  font-size: 13px; font-weight: 700;
}
.fert-upsell-verdict.positive {
  background: #f0fdf4; color: #16a34a;
}
.fert-upsell-verdict.neutral {
  background: #f1f5f9; color: var(--text-medium);
}

/* ─── Rescue Recommendation Card ─────────────────────────────────────── */
.rescue-rec-card {
  margin-top: 10px; padding: 12px; background: #fff;
  border: 1px solid #e2e8f0; border-radius: 8px;
  border-left: 4px solid #dc2626;
}
.rescue-rec-header {
  font-size: 12px; font-weight: 700; color: #dc2626;
  text-transform: uppercase; letter-spacing: 0.3px; margin-bottom: 6px;
}
.rescue-rec-product {
  font-size: 14px; font-weight: 600; color: var(--text-dark); margin-bottom: 4px;
}
.rescue-rec-detail {
  font-size: 12px; color: var(--text-medium); line-height: 1.5;
}
.rescue-rec-chronic {
  margin-top: 8px; padding: 8px 10px; background: #fefce8;
  border: 1px solid #CBD5E1; border-radius: 6px;
  font-size: 11px; color: #92400e; line-height: 1.4; font-weight: 500;
}

/* ─── Input Cost Tracker ─────────────────────────────────────────────────── */
.expense-summary-card {
  margin: 12px 16px 8px;
  background: var(--primary-green);
  border-radius: 14px;
  padding: 16px;
  color: #fff;
}
.expense-summary-empty {
  text-align: center;
  padding: 20px;
  color: rgba(255,255,255,0.7);
  font-size: 14px;
}
.expense-summary-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 14px;
}
.expense-summary-label {
  font-size: 12px;
  opacity: 0.8;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.expense-summary-value {
  font-size: 28px;
  font-weight: 800;
  margin-top: 2px;
}
.expense-summary-metrics {
  display: flex;
  gap: 16px;
}
.expense-metric {
  text-align: center;
  background: rgba(255,255,255,0.15);
  border-radius: 16px;
  padding: 8px 14px;
}
.expense-metric-val {
  font-size: 18px;
  font-weight: 700;
}
.expense-metric-label {
  font-size: 11px;
  opacity: 0.8;
  margin-top: 2px;
}
.expense-cat-breakdown {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.expense-cat-row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
}
.expense-cat-label {
  width: 90px;
  flex-shrink: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.expense-cat-bar-track {
  flex: 1;
  height: 6px;
  background: rgba(255,255,255,0.2);
  border-radius: 3px;
  overflow: hidden;
}
.expense-cat-bar-fill {
  height: 100%;
  background: rgba(255,255,255,0.7);
  border-radius: 3px;
  transition: width 0.3s;
}
.expense-cat-amount {
  width: 60px;
  text-align: right;
  font-weight: 600;
  flex-shrink: 0;
}
.expense-crop-grid {
  display: flex;
  gap: 8px;
  margin-top: 12px;
}
.expense-crop-card {
  flex: 1;
  background: rgba(255,255,255,0.12);
  border-radius: 16px;
  padding: 10px;
  text-align: center;
}
.expense-crop-name {
  font-weight: 700;
  font-size: 13px;
  margin-bottom: 4px;
}
.expense-crop-stat {
  font-size: 11px;
  opacity: 0.85;
  margin-top: 2px;
}
.expense-filter-row {
  display: flex;
  gap: 8px;
  padding: 8px 16px;
}
.expense-filter-row select {
  flex: 1;
  padding: 8px 10px;
  border-radius: 8px;
  border: 1px solid #ddd;
  font-size: 13px;
  background: #fff;
}
.expense-card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 16px;
  margin: 0 16px 6px;
  background: #fff;
  border-radius: 16px;
  border: 1px solid #eee;
  cursor: pointer;
  transition: background 0.15s;
}
.expense-card:active {
  background: #f5f5f5;
}
.expense-card-left {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
  min-width: 0;
}
.expense-card-icon {
  font-size: 22px;
  flex-shrink: 0;
}
.expense-card-info {
  min-width: 0;
}
.expense-card-desc {
  font-weight: 600;
  font-size: 14px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.expense-card-meta {
  font-size: 11px;
  color: #888;
  margin-top: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.expense-card-right {
  text-align: right;
  flex-shrink: 0;
  margin-left: 8px;
}
.expense-card-amount {
  font-weight: 700;
  font-size: 15px;
  color: #d32f2f;
}
.expense-card-peracre {
  font-size: 11px;
  color: #888;
  margin-top: 2px;
}
.btn-danger {
  background: #d32f2f;
  color: #fff;
  border: none;
  padding: 10px;
  border-radius: 16px;
  font-weight: 600;
  cursor: pointer;
}
.btn-danger:active {
  background: #b71c1c;
}

/* ─── Expense Screen (dedicated) ───────────────────────────────────────── */
.sub-header-actions {
  display: flex;
  gap: 8px;
  align-items: center;
}
.exp-filter-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}
.exp-filter-row select {
  padding: 6px 10px;
  border-radius: 8px;
  border: 1px solid #E2E8F0;
  font-size: 13px;
  background: #fff;
  font-weight: 500;
  min-height: 44px;
}
.exp-view-tabs {
  display: flex;
  gap: 4px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  flex: 1;
}
.exp-view-tabs::-webkit-scrollbar { display: none; }
.exp-view-tab {
  flex-shrink: 0;
  padding: 8px 12px;
  border-radius: 8px;
  border: 1px solid #E2E8F0;
  background: #fff;
  font-size: 11px;
  font-weight: 600;
  color: #64748B;
  cursor: pointer;
  transition: all 0.15s;
  min-height: 44px;
  display: flex;
  align-items: center;
}
.exp-view-tab.active {
  background: #16A34A;
  color: #fff;
  border-color: #16A34A;
}
/* Monthly Trend Chart */
.exp-trend-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}
.exp-trend-title {
  font-size: 13px;
  font-weight: 600;
  color: #1a1a1a;
}
.exp-trend-ytd {
  font-size: 12px;
  font-weight: 600;
  color: #16A34A;
}
.exp-trend-chart {
  display: flex;
  gap: 2px;
  align-items: flex-end;
  height: 80px;
  padding: 0 2px;
  margin-bottom: 14px;
}
.exp-trend-col {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 0;
}
.exp-trend-val {
  font-size: 9px;
  font-weight: 600;
  color: #64748B;
  margin-bottom: 2px;
  min-height: 12px;
}
.exp-trend-bar-track {
  width: 100%;
  height: 50px;
  display: flex;
  align-items: flex-end;
}
.exp-trend-bar {
  width: 100%;
  background: #16A34A;
  border-radius: 3px 3px 0 0;
  min-height: 2px;
  transition: height 0.3s ease;
}
.exp-trend-label {
  font-size: 9px;
  color: #999;
  margin-top: 3px;
  font-weight: 500;
}
/* Schedule F Report */
.sf-report {
  background: #fff;
  border-radius: 20px;
  border: 1px solid #f0f0f0;
  overflow: hidden;
}
.sf-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 16px;
  border-bottom: 1px solid #f0f0f0;
}
.sf-header h3 {
  font-size: 15px;
  font-weight: 700;
  color: #1a1a1a;
  margin: 0;
}
.sf-year {
  font-size: 12px;
  font-weight: 500;
  color: #64748B;
}
.sf-section-title {
  font-size: 11px;
  font-weight: 700;
  color: #64748B;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 10px 16px 4px;
}
.sf-lines {
  padding: 0 16px;
}
.sf-line {
  display: flex;
  align-items: center;
  padding: 7px 0;
  border-bottom: 1px solid #f8f8f8;
  color: #999;
  font-size: 13px;
}
.sf-line.sf-has-amount {
  color: #1a1a1a;
}
.sf-line-num {
  width: 55px;
  flex-shrink: 0;
  font-size: 11px;
  font-weight: 500;
  color: #64748B;
}
.sf-line-name {
  flex: 1;
  font-weight: 500;
}
.sf-line-amount {
  font-weight: 600;
  min-width: 70px;
  text-align: right;
}
.sf-subtotal {
  display: flex;
  justify-content: space-between;
  padding: 10px 16px;
  font-weight: 600;
  font-size: 14px;
  border-top: 2px solid #e2e8f0;
  color: #1a1a1a;
}
.sf-grand-total {
  display: flex;
  justify-content: space-between;
  padding: 12px 16px;
  font-weight: 700;
  font-size: 16px;
  background: #f8faf8;
  color: #1a1a1a;
}
/* Field P&L Report */
.fpl-report { padding: 0; }
.fpl-header {
  margin-bottom: 10px;
}
.fpl-header h3 {
  font-size: 15px;
  font-weight: 700;
  color: #1a1a1a;
  margin: 0;
}
.fpl-card {
  background: #fff;
  border-radius: 20px;
  border: 1px solid #f0f0f0;
  padding: 14px 16px;
  margin-bottom: 10px;
}
.fpl-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
.fpl-field-name {
  font-weight: 700;
  font-size: 15px;
  color: #1a1a1a;
}
.fpl-acres {
  font-size: 12px;
  color: #64748B;
  font-weight: 500;
}
.fpl-card-rows { }
.fpl-row {
  display: flex;
  justify-content: space-between;
  padding: 4px 0;
  font-size: 13px;
  color: #475569;
}
.fpl-row.fpl-net {
  font-weight: 700;
  font-size: 14px;
  border-top: 1px solid #e2e8f0;
  padding-top: 8px;
  margin-top: 4px;
}
.fpl-val {
  font-weight: 600;
}
.fpl-peracre {
  font-size: 11px;
  color: #64748B;
  margin-top: 6px;
  font-weight: 500;
}
/* Landlord Report */
.lr-report { padding: 0; }
.lr-header {
  margin-bottom: 10px;
}
.lr-header h3 {
  font-size: 15px;
  font-weight: 700;
  color: #1a1a1a;
  margin: 0;
}
.lr-field-card {
  background: #fff;
  border-radius: 20px;
  border: 1px solid #f0f0f0;
  padding: 14px 16px;
  margin-bottom: 10px;
}
.lr-field-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 4px;
}
.lr-field-name {
  font-weight: 700;
  font-size: 15px;
  color: #1a1a1a;
}
.lr-field-total {
  font-weight: 700;
  font-size: 15px;
  color: #1a1a1a;
}
.lr-field-acres {
  font-size: 12px;
  color: #64748B;
  margin-bottom: 8px;
}
.lr-cats { }
.lr-cat-row {
  display: flex;
  justify-content: space-between;
  padding: 5px 0;
  font-size: 13px;
  color: #475569;
  border-bottom: 1px solid #f8f8f8;
}
.lr-cat-row:last-child { border-bottom: none; }
/* Expense card code badge */
.exp-card-code-badge {
  font-size: 10px;
  font-weight: 700;
  padding: 4px 8px;
  border-radius: 6px;
  min-width: 34px;
  text-align: center;
  flex-shrink: 0;
}
.exp-card-recurring {
  font-size: 9px;
  font-weight: 700;
  padding: 1px 5px;
  border-radius: 3px;
  background: #e8f5e9;
  color: #16A34A;
}
.exp-screen-summary {
  padding: 0 0 8px;
}
.exp-summary-empty {
  text-align: center;
  color: #999;
  padding: 20px 0;
  font-size: 14px;
}
.exp-summary-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: 14px 16px;
  background: #f8faf8;
  border-radius: 20px;
  margin-bottom: 10px;
}
.exp-summary-total-label {
  font-size: 12px;
  color: #888;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}
.exp-summary-total-value {
  font-size: 28px;
  font-weight: 700;
  color: #1a1a1a;
  margin-top: 2px;
}
.exp-summary-kpis {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  padding-top: 4px;
}
.exp-kpi {
  text-align: center;
}
.exp-kpi-val {
  font-size: 18px;
  font-weight: 700;
  color: #333;
}
.exp-kpi-label {
  font-size: 11px;
  color: #888;
  display: block;
  margin-top: 1px;
}
.exp-cat-breakdown {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 0 2px;
}
.exp-cat-row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
}
.exp-cat-badge {
  font-size: 10px;
  font-weight: 600;
  padding: 2px 6px;
  border-radius: 4px;
  min-width: 36px;
  text-align: center;
  flex-shrink: 0;
}
.exp-cat-name {
  width: 70px;
  flex-shrink: 0;
  font-weight: 500;
  color: #555;
}
.exp-cat-bar-track {
  flex: 1;
  height: 8px;
  background: #f0f0f0;
  border-radius: 4px;
  overflow: hidden;
}
.exp-cat-bar-fill {
  height: 100%;
  border-radius: 4px;
  transition: width 0.3s ease;
}
.exp-cat-total {
  font-weight: 600;
  color: #333;
  min-width: 60px;
  text-align: right;
}
.exp-screen-filters {
  padding: 10px 0 6px;
}
.exp-filter-year {
  margin-bottom: 8px;
}
.exp-filter-year select {
  padding: 6px 10px;
  border-radius: 8px;
  border: 1px solid #E2E8F0;
  font-size: 13px;
  background: #fff;
  font-weight: 500;
}
.exp-filter-tabs {
  display: flex;
  overflow-x: auto;
  gap: 8px;
  padding: 4px 0;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.exp-filter-tabs::-webkit-scrollbar { display: none; }
.exp-tab {
  flex-shrink: 0;
  padding: 8px 20px;
  border-radius: 9999px;
  border: 1px solid var(--border);
  background: transparent;
  font-size: 12px;
  font-weight: 600;
  color: #64748B;
  cursor: pointer;
  transition: all 0.15s;
}
.exp-tab.active {
  background: #16A34A;
  color: #fff;
  border-color: #16A34A;
}
.exp-tab:active {
  transform: scale(0.96);
}
.exp-card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 14px;
  background: #fff;
  border-radius: 20px;
  border: 1px solid #f0f0f0;
  margin-bottom: 8px;
  cursor: pointer;
  transition: background 0.15s;
}
.exp-card:active {
  background: #fafafa;
}
.exp-card-left {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
  min-width: 0;
}
.exp-card-icon {
  font-size: 22px;
  flex-shrink: 0;
}
.exp-card-body {
  min-width: 0;
}
.exp-card-desc {
  font-weight: 600;
  font-size: 14px;
  color: #1a1a1a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.exp-card-meta {
  font-size: 12px;
  color: #999;
  margin-top: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.exp-card-right {
  text-align: right;
  flex-shrink: 0;
  margin-left: 8px;
}
.exp-card-amount {
  font-weight: 700;
  font-size: 15px;
  color: #1a1a1a;
}
.exp-card-tags {
  display: flex;
  align-items: center;
  gap: 4px;
  justify-content: flex-end;
  margin-top: 3px;
}
.exp-card-cat-badge {
  font-size: 9px;
  font-weight: 600;
  padding: 1px 5px;
  border-radius: 3px;
}
.exp-card-receipt-icon {
  font-size: 14px;
}

/* ─── Employee Time Clock & Payroll ─────────────────────────────────────── */

/* Today summary bar */
.emp-today-summary {
  margin-bottom: 16px;
}
.emp-summary-row {
  display: flex;
  gap: 12px;
  justify-content: space-around;
  background: var(--card-bg);
  border-radius: var(--radius-sm);
  padding: 14px 16px;
  box-shadow: var(--shadow);
  margin-bottom: 8px;
}
.emp-summary-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.emp-summary-val {
  font-weight: 800;
  font-size: 22px;
  color: var(--primary-green);
}
.emp-summary-lbl {
  font-size: 11px;
  color: var(--text-light);
  font-weight: 600;
}
.emp-on-clock-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 4px;
}
.emp-on-clock-chip {
  font-size: 12px;
  padding: 4px 10px;
  background: #ECFDF5;
  border-radius: 20px;
  color: #059669;
  font-weight: 600;
}

/* Status dots */
.status-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: inline-block;
  flex-shrink: 0;
}
.status-dot-green {
  background: #10B981;
  box-shadow: 0 0 6px rgba(16, 185, 129, 0.4);
}
.status-dot-gray {
  background: #CBD5E1;
}

/* Role badge */
.emp-role-badge {
  font-size: 10px;
  padding: 2px 6px;
  border-radius: 6px;
  background: #EFF6FF;
  color: #3B82F6;
  font-weight: 600;
}

/* Phone & shift info */
.emp-phone {
  font-size: 12px;
  color: var(--text-light);
  margin-bottom: 4px;
  margin-left: 16px;
}
.emp-shift-since {
  font-size: 12px;
  color: #059669;
  font-weight: 600;
  margin-bottom: 6px;
  margin-left: 16px;
}
.emp-status-active {
  color: #059669;
  font-weight: 600;
}

.emp-sub-tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 16px;
  background: transparent;
  border-radius: 0;
  padding: 4px 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.emp-sub-tab {
  flex-shrink: 0;
  padding: 8px 20px;
  border: 1px solid var(--border);
  background: transparent;
  border-radius: 9999px;
  font-size: 13px;
  font-weight: 600;
  color: #64748B;
  cursor: pointer;
  transition: all 0.15s;
}
.emp-sub-tab.active {
  background: #16A34A;
  color: #fff;
  border-color: #16A34A;
  box-shadow: none;
}

.emp-card {
  background: var(--card-bg);
  border-radius: var(--radius-sm);
  padding: 14px 16px;
  margin-bottom: 10px;
  box-shadow: var(--shadow);
  cursor: pointer;
  transition: box-shadow 0.15s;
}
.emp-card:active { box-shadow: var(--shadow-lg); }

.emp-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
.emp-name-status {
  display: flex;
  align-items: center;
  gap: 6px;
}
.emp-status-dot { font-size: 12px; }
.emp-name-status strong { font-size: 15px; }
.emp-type-badge {
  font-size: 10px;
  padding: 2px 6px;
  border-radius: 6px;
  background: var(--light-green);
  color: var(--secondary-green);
  font-weight: 600;
}
.emp-status-label {
  font-size: 12px;
  color: var(--text-light);
}

.emp-card-stats {
  display: flex;
  gap: 16px;
  margin-bottom: 10px;
}
.emp-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.emp-stat-val {
  font-weight: 700;
  font-size: 16px;
  color: var(--text-dark);
}
.emp-stat-lbl {
  font-size: 11px;
  color: var(--text-light);
}

.emp-card-actions {
  display: flex;
  justify-content: flex-end;
}

.btn-clock-in {
  background: var(--primary-green);
  color: white;
  border: none;
  padding: 8px 20px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}
.btn-clock-out, .btn-clock-out-btn {
  background: var(--pop-red);
  color: white;
  border: none;
  padding: 8px 20px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}

/* Timesheet rows */
.timesheet-header {
  font-size: 14px;
  font-weight: 700;
  color: var(--text-dark);
  margin-bottom: 12px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.timesheet-row {
  display: grid;
  grid-template-columns: auto 1fr auto auto auto;
  gap: 8px;
  align-items: center;
  padding: 10px 12px;
  background: var(--card-bg);
  border-radius: 16px;
  margin-bottom: 6px;
  box-shadow: var(--shadow);
  font-size: 12px;
}
.ts-date { color: var(--text-light); font-weight: 600; min-width: 60px; }
.ts-name { font-weight: 600; color: var(--text-dark); }
.ts-task { color: var(--text-medium); text-transform: capitalize; }
.ts-time { color: var(--text-light); white-space: nowrap; }
.ts-hours { font-weight: 700; color: var(--primary-green); min-width: 50px; text-align: right; }

/* Payroll summary */
.payroll-summary-card {
  background: linear-gradient(135deg, var(--primary-green), var(--secondary-green));
  color: white;
  border-radius: var(--radius);
  padding: 20px;
  margin-bottom: 12px;
}
.payroll-period {
  font-size: 12px;
  opacity: 0.85;
  margin-bottom: 12px;
}
.payroll-totals {
  display: flex;
  justify-content: space-between;
}
.payroll-total-item {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.payroll-val {
  font-size: 18px;
  font-weight: 700;
}
.payroll-lbl {
  font-size: 11px;
  opacity: 0.8;
}
.payroll-disclaimer {
  font-size: 11px;
  color: var(--text-light);
  text-align: center;
  margin-bottom: 12px;
  font-style: italic;
}
.payroll-line-card {
  background: var(--card-bg);
  border-radius: var(--radius-sm);
  padding: 12px 14px;
  margin-bottom: 8px;
  box-shadow: var(--shadow);
}
.payroll-emp-name {
  font-weight: 700;
  font-size: 14px;
  margin-bottom: 6px;
}
.payroll-line-stats {
  display: flex;
  gap: 12px;
  font-size: 12px;
  color: var(--text-medium);
  flex-wrap: wrap;
}
.payroll-line-stats strong {
  color: var(--text-dark);
}

.input-row {
  display: flex;
  gap: 10px;
}

/* ─── Yield Tracking ──────────────────────────────────────────────────────── */

.yield-controls, .seed-controls {
  display: flex;
  gap: 8px;
  padding: 0 0 12px;
}
.yield-controls select, .seed-controls select {
  flex: 1;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 13px;
  background: #fff;
}

.yield-summary-card, .seed-summary-card {
  background: linear-gradient(135deg, #f0f9ff, #e8f5e9);
  border-radius: 20px;
  padding: 14px;
  margin-bottom: 14px;
  border: 1px solid #d0e8d0;
}
.yield-summary-header, .seed-summary-header {
  font-weight: 600;
  font-size: 14px;
  color: var(--text-dark);
  margin-bottom: 10px;
}
.yield-summary-grid, .seed-summary-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.yield-summary-item, .seed-summary-item {
  flex: 1 1 140px;
  background: #fff;
  border-radius: 8px;
  padding: 10px;
  border: 1px solid #E2E8F0;
}
.yield-summary-crop, .seed-summary-crop {
  font-weight: 600;
  font-size: 13px;
  margin-bottom: 4px;
}
.yield-summary-stat {
  font-size: 13px;
  color: var(--text-dark);
}
.yield-stat-val {
  font-weight: 700;
  color: var(--primary-green);
  font-size: 16px;
}
.yield-summary-range {
  font-size: 11px;
  color: var(--text-light);
  margin-top: 2px;
}
.yield-summary-field {
  font-size: 11px;
  color: var(--text-light);
  margin-top: 2px;
}

.yield-card, .seed-card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 12px 14px;
  margin-bottom: 8px;
  cursor: pointer;
  transition: background 0.15s;
}
.yield-card:hover, .seed-card:hover {
  background: #f8fdf8;
}
.yield-card-header, .seed-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 6px;
}
.yield-card-crop, .seed-card-crop {
  font-weight: 600;
  font-size: 14px;
  color: var(--text-dark);
}
.yield-card-value {
  font-weight: 700;
  font-size: 15px;
  color: var(--primary-green);
}
.seed-card-hybrid {
  font-weight: 600;
  font-size: 13px;
  color: var(--primary-green);
}
.yield-card-details, .seed-card-details {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  margin-bottom: 4px;
}
.yield-detail, .seed-detail {
  font-size: 12px;
  color: var(--text-light);
}
.seed-card-cost {
  display: flex;
  gap: 12px;
  margin-top: 4px;
}
.seed-cost-total {
  font-weight: 700;
  font-size: 14px;
  color: var(--text-dark);
}
.seed-cost-bag {
  font-size: 12px;
  color: var(--text-light);
}
.yield-card-notes, .seed-card-notes {
  font-size: 12px;
  color: var(--text-light);
  margin-top: 4px;
  font-style: italic;
}

/* Seed summary stats */
.seed-summary-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
}
.seed-stat {
  font-size: 12px;
  color: var(--text-light);
}
.seed-stat-val {
  font-weight: 700;
  color: var(--text-dark);
  font-size: 13px;
}

/* Hybrid Performance Cards */
.hybrid-card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 12px 14px;
  margin-bottom: 8px;
}
.hybrid-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 6px;
}
.hybrid-name {
  font-weight: 700;
  font-size: 14px;
  color: var(--text-dark);
}
.hybrid-crop {
  font-size: 12px;
  color: var(--text-light);
}
.hybrid-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
}
.hybrid-stat {
  font-size: 12px;
  color: var(--text-light);
}
.hybrid-stat-val {
  font-weight: 700;
  color: var(--primary-green);
  font-size: 14px;
}
.hybrid-fields {
  font-size: 11px;
  color: var(--text-light);
  margin-top: 4px;
}

/* ─── Bin Tracker ─────────────────────────────────────────────────────────── */
.bins-summary-card {
  background: var(--card-bg);
  border-radius: var(--radius-sm);
  padding: 16px;
  margin-bottom: 16px;
  box-shadow: var(--shadow);
  display: flex;
  justify-content: space-between;
  gap: 8px;
}
.bins-summary-stat {
  text-align: center;
  flex: 1;
}
.bins-summary-stat .stat-value {
  font-size: 20px;
  font-weight: 700;
  color: var(--text-dark);
}
.bins-summary-stat .stat-label {
  font-size: 12px;
  color: var(--text-light);
  margin-top: 2px;
}

.bin-card {
  background: var(--card-bg);
  border-radius: var(--radius-sm);
  padding: 16px;
  margin-bottom: 12px;
  box-shadow: var(--shadow);
  display: flex;
  gap: 16px;
  align-items: stretch;
  position: relative;
}
.bin-card .bin-gauge-wrap {
  width: 48px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.bin-gauge {
  width: 40px;
  height: 100px;
  background: #F1F5F9;
  border-radius: 20px;
  position: relative;
  overflow: hidden;
  border: 2px solid var(--border);
}
.bin-gauge-fill {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  border-radius: 0 0 18px 18px;
  background: linear-gradient(180deg, #22C55E 0%, #16A34A 100%);
  transition: height 0.5s ease;
}
.bin-gauge-fill.level-high {
  background: linear-gradient(180deg, #94A3B8 0%, #64748B 100%);
}
.bin-gauge-fill.level-full {
  background: linear-gradient(180deg, #EF4444 0%, #DC2626 100%);
}
.bin-gauge-pct {
  font-size: 13px;
  font-weight: 700;
  color: var(--text-dark);
  margin-top: 6px;
}
.bin-info {
  flex: 1;
  min-width: 0;
}
.bin-info .bin-name {
  font-size: 16px;
  font-weight: 700;
  color: var(--text-dark);
  margin-bottom: 4px;
}
.bin-info .bin-commodity {
  font-size: 13px;
  color: var(--text-medium);
  margin-bottom: 8px;
  text-transform: capitalize;
}
.bin-info .bin-detail-row {
  display: flex;
  justify-content: space-between;
  font-size: 13px;
  color: var(--text-medium);
  margin-bottom: 3px;
}
.bin-info .bin-detail-row .detail-label {
  color: var(--text-light);
}
.bin-info .bin-detail-row .detail-value {
  font-weight: 600;
  color: var(--text-dark);
}
.bin-info .bin-updated {
  font-size: 11px;
  color: var(--text-light);
  margin-top: 6px;
}
.bin-card-actions {
  position: absolute;
  top: 12px;
  right: 12px;
  display: flex;
  gap: 6px;
}
.bin-card-actions button {
  background: none;
  border: none;
  font-size: 16px;
  cursor: pointer;
  padding: 2px;
  opacity: 0.5;
}
.bin-card-actions button:hover {
  opacity: 1;
}
.bin-actions-row {
  display: flex;
  gap: 8px;
  margin-top: 16px;
}
.bin-actions-row .btn-delivery {
  flex: 1;
  padding: 10px 16px;
  background: var(--primary-green);
  color: #fff;
  border: none;
  border-radius: var(--radius-sm);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
}

/* Bin card tap hint */
.bin-card {
  cursor: pointer;
}

/* Per-bin Load In / Outload buttons */
.bin-card-buttons {
  display: flex;
  gap: 8px;
  margin: -4px 0 12px;
  padding: 0 4px;
}
.bin-card-buttons .btn-load-in,
.bin-card-buttons .btn-outload {
  flex: 1;
  padding: 10px 0;
  border: none;
  border-radius: var(--radius-sm);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  min-height: 44px;
}
.bin-card-buttons .btn-load-in {
  background: var(--primary-green);
  color: #fff;
}
.bin-card-buttons .btn-outload {
  background: #fff;
  color: var(--text-dark);
  border: 1px solid #E2E8F0;
}

/* Moisture color coding */
.moisture-green { color: #16A34A; font-weight: 700; }
.moisture-yellow { color: #CA8A04; font-weight: 700; }
.moisture-red { color: #DC2626; font-weight: 700; }

/* Drying alert */
.bin-drying-alert {
  margin-top: 6px;
  padding: 6px 10px;
  background: #FEF2F2;
  border: 1px solid #FECACA;
  border-radius: 8px;
  font-size: 12px;
  color: #DC2626;
  font-weight: 600;
}

/* Scale toggle in modals */
.bin-scale-toggle {
  margin-bottom: 16px !important;
}
.bin-scale-toggle .toggle-label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 500;
  cursor: pointer;
  color: var(--text-dark);
}
.bin-scale-toggle .toggle-label input[type="checkbox"] {
  width: 20px;
  height: 20px;
  accent-color: var(--primary-green);
}

/* Snap scale ticket button */
.btn-snap-ticket {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 12px 16px;
  background: #F8FAFC;
  border: 2px dashed #CBD5E1;
  border-radius: var(--radius-sm);
  font-size: 14px;
  font-weight: 600;
  color: var(--text-medium);
  cursor: pointer;
  min-height: 44px;
}
.btn-snap-ticket:active {
  background: #F1F5F9;
}

/* Ticket preview */
.ticket-preview {
  margin-top: 8px;
}
.ticket-preview img {
  width: 100%;
  max-height: 120px;
  object-fit: cover;
  border-radius: 8px;
  border: 1px solid #E2E8F0;
}

/* Bin info display in outload modal */
.bin-info-display {
  padding: 12px 16px;
  background: #F8FAFC;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 600;
  color: var(--text-dark);
  border: 1px solid #E2E8F0;
}

/* Outload primary button */
.btn-primary.btn-outload {
  background: var(--primary-green);
}

/* ─── Bin History ──────────────────────────────────────────────────── */
.bin-history-list {
  max-height: 60vh;
  overflow-y: auto;
}
.bin-hist-row {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid #F1F5F9;
}
.bin-hist-row:last-child {
  border-bottom: none;
}
.hist-direction {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
  flex-shrink: 0;
}
.hist-in .hist-direction {
  background: #DCFCE7;
  color: #16A34A;
}
.hist-out .hist-direction {
  background: #F1F5F9;
  color: #64748B;
}
.hist-details {
  flex: 1;
  min-width: 0;
}
.hist-main {
  font-size: 15px;
  color: var(--text-dark);
}
.hist-moisture {
  font-size: 13px;
  color: var(--text-medium);
  margin-left: 6px;
}
.hist-sub {
  font-size: 13px;
  color: var(--text-light);
  margin-top: 2px;
}
.hist-notes {
  font-size: 12px;
  color: var(--text-light);
  font-style: italic;
  margin-top: 2px;
}
.hist-right {
  text-align: right;
  flex-shrink: 0;
}
.hist-running {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-medium);
}
.hist-ticket-thumb {
  width: 40px;
  height: 40px;
  object-fit: cover;
  border-radius: 6px;
  margin-top: 4px;
  border: 1px solid #E2E8F0;
}

/* ─── Delivery Log ────────────────────────────────────────────────── */
.delivery-log-filters {
  display: flex;
  gap: 8px;
  margin: 12px 0;
  padding: 4px 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.delivery-log-filters::-webkit-scrollbar { display: none; }
.delivery-log-filters .filter-tab {
  padding: 8px 20px;
  border: 1px solid var(--border);
  border-radius: 9999px;
  background: transparent;
  font-size: 13px;
  font-weight: 600;
  color: #64748B;
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.15s;
}
.delivery-log-filters .filter-tab.active {
  background: #16A34A;
  color: #fff;
  border-color: #16A34A;
}
.delivery-card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 14px 16px;
  margin-bottom: 10px;
}
.delivery-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}
.delivery-card-date {
  font-size: 13px;
  color: var(--text-secondary);
  font-weight: 500;
}
.delivery-card-status {
  font-size: 11px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 16px;
  text-transform: uppercase;
}
.delivery-card-status.in_transit { background: #F1F5F9; color: #475569; }
.delivery-card-status.delivered { background: #DBEAFE; color: #1E40AF; }
.delivery-card-status.settled { background: #D1FAE5; color: #065F46; }
.delivery-card-crop {
  font-size: 15px;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 6px;
  text-transform: capitalize;
}
.delivery-card-route {
  font-size: 13px;
  color: var(--text-secondary);
  margin-bottom: 8px;
}
.delivery-card-stats {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 4px;
  margin-bottom: 8px;
}
.delivery-card-stats .dstat {
  text-align: center;
}
.delivery-card-stats .dstat-val {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-primary);
}
.delivery-card-stats .dstat-lbl {
  font-size: 11px;
  color: var(--text-secondary);
}
.delivery-card-meta {
  font-size: 12px;
  color: var(--text-secondary);
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.delivery-card-actions {
  display: flex;
  justify-content: flex-end;
  gap: 4px;
  margin-top: 8px;
}
.delivery-card-actions button {
  background: none;
  border: none;
  font-size: 16px;
  cursor: pointer;
  padding: 4px;
  opacity: 0.6;
}
.delivery-card-actions button:hover { opacity: 1; }

/* ─── Shop Landing (Paylocity-style icon grid) ────────────────────── */
.shop-section-label {
  font-size: 13px;
  font-weight: 600;
  color: #64748B;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 8px 4px 8px;
}
.shop-divider {
  height: 1px;
  background: #E2E8F0;
  margin: 8px 0 4px;
}
.shop-recents-row {
  display: flex;
  gap: 20px;
  padding: 4px 0 8px;
}
.shop-icon-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  padding: 8px 0;
}
.shop-icon-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: transform 0.15s ease;
}
.shop-icon-item:active {
  transform: scale(0.97);
}
.shop-icon-circle {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
}
/* Pastel circle colors for shop icons */
.shop-icon-circle.bg-green { background: #DCFCE7; }
.shop-icon-circle.bg-blue { background: #DBEAFE; }
.shop-icon-circle.bg-purple { background: #EDE9FE; }
.shop-icon-circle.bg-rose { background: #FFE4E6; }
.shop-icon-circle.bg-teal { background: #CCFBF1; }
.shop-icon-circle.bg-slate { background: #F1F5F9; }
.shop-icon-label {
  font-size: 12px;
  color: #0F172A;
  text-align: center;
  line-height: 1.2;
  max-width: 72px;
  word-wrap: break-word;
}
.shop-icon-item.coming-soon .shop-icon-circle {
  opacity: 0.5;
}
.shop-icon-item.coming-soon .shop-icon-label {
  color: #94A3B8;
}

/* ─── Insurance Claim Tracker ─────────────────────────────────────── */
.claim-card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 16px;
  margin-bottom: 12px;
  cursor: pointer;
  transition: transform 0.15s ease;
}
.claim-card:active { transform: scale(0.97); }
.claim-card-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 12px;
}
.claim-card-number {
  font-weight: 700;
  font-size: 15px;
  color: #0F172A;
}
.claim-card-badge {
  font-size: 11px;
  font-weight: 600;
  padding: 3px 8px;
  border-radius: 20px;
  white-space: nowrap;
}
.claim-badge-filed { background: #DBEAFE; color: #1D4ED8; }
.claim-badge-adjuster_assigned { background: #F1F5F9; color: #475569; }
.claim-badge-field_inspected { background: #FED7AA; color: #9A3412; }
.claim-badge-under_review { background: #E9D5FF; color: #6B21A8; }
.claim-badge-approved { background: #D1FAE5; color: #065F46; }
.claim-badge-payment_received { background: #A7F3D0; color: #064E3B; }
.claim-card-details {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px 16px;
  font-size: 13px;
  margin-bottom: 14px;
}
.claim-detail-label {
  color: #64748B;
}
.claim-detail-value {
  color: #0F172A;
  font-weight: 500;
  text-align: right;
}
.claim-progress-container {
  margin-bottom: 10px;
}
.claim-progress-bar {
  width: 100%;
  height: 10px;
  background: #E2E8F0;
  border-radius: 5px;
  overflow: hidden;
  margin-bottom: 8px;
}
.claim-progress-fill {
  height: 100%;
  background: #16A34A;
  border-radius: 5px;
  transition: width 0.4s ease;
}
.claim-progress-steps {
  display: flex;
  justify-content: space-between;
  font-size: 10px;
  color: #94A3B8;
}
.claim-progress-steps span {
  text-align: center;
  flex: 1;
  position: relative;
}
.claim-progress-steps span.completed {
  color: #16A34A;
  font-weight: 600;
}
.claim-progress-steps span.current {
  color: #0F172A;
  font-weight: 700;
}
.claim-explanation {
  background: #F0FDF4;
  border-radius: 8px;
  padding: 10px 12px;
  font-size: 13px;
  color: #374151;
  line-height: 1.5;
  margin-top: 10px;
}
.claim-explanation-label {
  font-weight: 600;
  font-size: 11px;
  color: #16A34A;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 4px;
}
.claim-delete-btn {
  background: none;
  border: none;
  color: #DC2626;
  font-size: 12px;
  cursor: pointer;
  padding: 4px 0;
  margin-top: 8px;
}

/* ─── Insurance Policy Dashboard ─── */
.ins-section-title {
  font-size: 15px;
  font-weight: 700;
  color: #1e293b;
  margin: 16px 0 10px;
  font-family: 'Inter', sans-serif;
}
.ins-policy-grid {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 16px;
}
.ins-policy-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 20px;
  padding: 12px;
}
.ins-policy-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
.ins-policy-crop {
  font-size: 16px;
  font-weight: 700;
  color: #1e293b;
  font-family: 'Inter', sans-serif;
}
.ins-policy-plan {
  font-size: 13px;
  font-weight: 600;
  color: #3b82f6;
  background: #eff6ff;
  padding: 3px 10px;
  border-radius: 6px;
  font-family: 'Inter', sans-serif;
}
.ins-policy-grid-inner {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}
.ins-policy-stat {
  text-align: center;
}
.ins-policy-stat-val {
  font-size: 14px;
  font-weight: 700;
  color: #1e293b;
  font-family: 'Inter', sans-serif;
}
.ins-policy-stat-lbl {
  font-size: 11px;
  color: #94a3b8;
  font-family: 'Inter', sans-serif;
}
/* ─── Agent Card ─── */
.ins-agent-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 20px;
  padding: 12px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}
.ins-agent-name {
  font-size: 15px;
  font-weight: 700;
  color: #1e293b;
  font-family: 'Inter', sans-serif;
}
.ins-agent-company {
  font-size: 12px;
  color: #64748b;
  font-family: 'Inter', sans-serif;
}
.ins-agent-actions {
  display: flex;
  gap: 8px;
}
.ins-agent-btn {
  padding: 6px 14px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  background: #eff6ff;
  color: #3b82f6;
  font-family: 'Inter', sans-serif;
}
/* ─── Loss Calculator ─── */
.ins-calc-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 20px;
  padding: 16px;
  margin-bottom: 16px;
}
.ins-calc-result {
  margin-top: 8px;
}
.ins-calc-formula {
  font-size: 12px;
  color: #64748b;
  font-family: 'Inter', sans-serif;
  margin-bottom: 4px;
}
.ins-calc-payment {
  font-size: 18px;
  color: #16a34a;
  font-family: 'Inter', sans-serif;
  margin-bottom: 4px;
}
.ins-calc-detail {
  font-size: 12px;
  color: #94a3b8;
  font-family: 'Inter', sans-serif;
}
.ins-calc-no-loss {
  font-size: 13px;
  color: #64748b;
  background: #f0fdf4;
  padding: 8px 12px;
  border-radius: 8px;
  font-family: 'Inter', sans-serif;
}
/* ─── Claim Detail Extras ─── */
.ins-adjuster-card {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 10px 12px;
  font-size: 13px;
  color: #475569;
  margin-bottom: 12px;
  font-family: 'Inter', sans-serif;
}
.ins-adjuster-card a {
  color: #3b82f6;
  text-decoration: none;
}
.ins-timeline {
  margin-bottom: 12px;
}
.ins-timeline h4 {
  font-size: 14px;
  font-weight: 600;
  color: #1e293b;
  margin-bottom: 8px;
  font-family: 'Inter', sans-serif;
}
.ins-timeline-item {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 6px 0;
  border-left: 2px solid #e2e8f0;
  padding-left: 12px;
  margin-left: 4px;
  font-size: 13px;
  color: #1e293b;
  font-family: 'Inter', sans-serif;
}
.ins-timeline-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #3b82f6;
  margin-top: 4px;
  flex-shrink: 0;
  margin-left: -18px;
}
.ins-photos { margin-bottom: 12px; }
.ins-photos h4 { font-size: 14px; font-weight: 600; color: #1e293b; margin-bottom: 8px; font-family: 'Inter', sans-serif; }
.ins-photos-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.ins-photo-item { border-radius: 8px; overflow: hidden; border: 1px solid #e2e8f0; }
.ins-photo-item img { width: 100%; height: 80px; object-fit: cover; display: block; }
.ins-comm-log { margin-bottom: 12px; }
.ins-comm-log h4 { font-size: 14px; font-weight: 600; color: #1e293b; margin-bottom: 8px; font-family: 'Inter', sans-serif; }
.ins-log-item { background: #f8fafc; border-radius: 8px; padding: 8px 10px; margin-bottom: 6px; font-size: 13px; color: #475569; font-family: 'Inter', sans-serif; }
.claim-badge-draft { background: #f1f5f9; color: #475569; }
.claim-badge-settled { background: #d1fae5; color: #065f46; }

/* ─── Yield Tracker Screen ──────────────────────────────────────────────── */

.yt-summary-card {
  background: #fff;
  border: 1px solid #E2E8F0;
  border-radius: 20px;
  padding: 16px;
  margin-bottom: 16px;
}

.yt-summary-title {
  font-size: 15px;
  font-weight: 700;
  color: #1E293B;
  margin-bottom: 12px;
}

.yt-vs-county {
  font-size: 11px;
  color: #64748B;
  margin-top: 2px;
}

.yt-above {
  color: #16A34A !important;
  font-weight: 600;
}

.yt-below {
  color: #DC2626 !important;
  font-weight: 600;
}

.yt-section-title {
  font-size: 14px;
  font-weight: 700;
  color: #1E293B;
  margin-bottom: 10px;
}

.yt-field-card {
  background: #fff;
  border: 1px solid #E2E8F0;
  border-radius: 16px;
  padding: 14px 16px;
  margin-bottom: 10px;
  cursor: pointer;
  transition: box-shadow 0.15s;
}

.yt-field-card:active {
  box-shadow: 0 0 0 2px rgba(22,163,74,0.2);
}

.yt-field-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}

.yt-field-name {
  font-size: 15px;
  font-weight: 700;
  color: #1E293B;
}

.yt-field-meta {
  font-size: 13px;
  color: #64748B;
}

.yt-field-yields {
  display: flex;
  gap: 8px;
}

.yt-yield-col {
  flex: 1;
  text-align: center;
}

.yt-yield-label {
  font-size: 11px;
  color: #94A3B8;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 2px;
}

.yt-yield-value {
  font-size: 14px;
  color: #1E293B;
}

/* Text-based bar chart */
.yt-chart {
  background: #fff;
  border: 1px solid #E2E8F0;
  border-radius: 16px;
  padding: 12px 16px;
}

.yt-chart-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 0;
}

.yt-chart-year {
  font-size: 13px;
  font-weight: 600;
  color: #64748B;
  min-width: 38px;
}

.yt-bar-track {
  flex: 1;
  height: 20px;
  background: #F1F5F9;
  border-radius: 4px;
  overflow: hidden;
}

.yt-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, #16A34A, #22C55E);
  border-radius: 4px;
  transition: width 0.3s;
}

.yt-bar-label {
  font-size: 13px;
  font-weight: 600;
  color: #1E293B;
  min-width: 55px;
  text-align: right;
}

.yt-county-line {
  font-size: 12px;
  color: #94A3B8;
  text-align: center;
  margin-top: 6px;
  margin-bottom: 4px;
}

/* ════════════════════════════════════════════════════
   CROP DOCTOR STANDALONE SCREEN
════════════════════════════════════════════════════ */
.cd-take-photo-btn {
  width: 100%;
  font-size: 18px;
  padding: 18px;
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}
.cd-desc-row { margin-top: 12px; }
.cd-desc-input {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  font-size: 14px;
  background: var(--card-bg);
  box-sizing: border-box;
}
.cd-field-row { margin-top: 10px; display: flex; gap: 8px; }
.cd-field-row select {
  flex: 1;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  font-size: 14px;
  background: var(--card-bg);
  min-height: 44px;
}
#cd-growth-stage { flex: 0 0 140px; }
.cd-preview {
  margin-top: 16px;
  text-align: center;
}
.cd-preview img {
  max-width: 100%;
  max-height: 200px;
  border-radius: var(--radius-sm);
  object-fit: cover;
}

/* Diagnosis history cards */
.cd-history-card {
  background: var(--card-bg);
  border-radius: var(--radius-sm);
  padding: 14px;
  margin-bottom: 10px;
  border: 1px solid var(--border);
  cursor: pointer;
}
.cd-history-card-top {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}
.cd-history-thumb {
  width: 48px;
  height: 48px;
  border-radius: 8px;
  object-fit: cover;
  flex-shrink: 0;
  background: #f1f5f9;
}
.cd-history-thumb-placeholder {
  width: 48px;
  height: 48px;
  border-radius: 8px;
  flex-shrink: 0;
  background: #f1f5f9;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
}
.cd-history-info { flex: 1; min-width: 0; }
.cd-history-name {
  font-size: 15px;
  font-weight: 700;
  color: var(--text-dark);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cd-history-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: var(--text-light);
  margin-top: 2px;
}
.cd-history-field { color: var(--text-medium); font-weight: 500; }
.cd-severity-dots {
  display: inline-flex;
  gap: 3px;
  margin-left: auto;
}
.cd-severity-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #E2E8F0;
}
.cd-severity-dot.filled { background: #DC2626; }
.cd-severity-dot.filled.sev-1 { background: #22C55E; }
.cd-severity-dot.filled.sev-2 { background: #3B82F6; }
.cd-severity-dot.filled.sev-3 { background: #F43F5E; }
.cd-severity-dot.filled.sev-4 { background: #EF4444; }
.cd-severity-dot.filled.sev-5 { background: #DC2626; }

/* Expandable treatment text */
.cd-treatment-toggle {
  font-size: 13px;
  color: var(--primary-green);
  font-weight: 600;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-top: 6px;
}
.cd-treatment-body {
  display: none;
  margin-top: 8px;
  padding: 10px 12px;
  background: #f0f9f0;
  border-radius: 8px;
  font-size: 13px;
  line-height: 1.5;
  color: var(--text-dark);
}
.cd-treatment-body.expanded { display: block; }

/* Confidence badge in cards */
.cd-confidence {
  font-size: 11px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 16px;
  background: #EFF6FF;
  color: #3B82F6;
}
.cd-confidence.high { background: #F0FDF4; color: #16A34A; }
.cd-confidence.low { background: #FEF2F2; color: #DC2626; }

.header-icon { font-size: 20px; }

/* Growth stage badge */
.cd-growth-badge {
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 20px;
  background: #EFF6FF;
  color: #2563EB;
  margin-top: 4px;
}

/* Soil cross-reference card */
.soil-crossref-card {
  margin-top: 12px;
  padding: 12px 14px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  font-size: 13px;
  line-height: 1.5;
}
.soil-crossref-title {
  font-weight: 700;
  font-size: 13px;
  color: #1e293b;
  margin-bottom: 6px;
}
.soil-crossref-rescue {
  margin-top: 6px;
  padding: 8px 10px;
  background: #fef2f2;
  border-radius: 6px;
  color: #dc2626;
  font-weight: 600;
  font-size: 12px;
}

/* ─── Scouting Timeline (field detail) ───────────────────────────────── */
.scouting-timeline-section {
  margin-top: 16px;
}
.scouting-timeline-title {
  font-size: 15px;
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 10px;
  padding: 0;
}
.scout-timeline-entry {
  display: flex;
  gap: 10px;
  padding: 12px 0;
  border-bottom: 1px solid #f1f5f9;
}
.scout-timeline-entry:last-child { border-bottom: none; }
.scout-thumb-placeholder {
  width: 44px;
  height: 44px;
  border-radius: 8px;
  flex-shrink: 0;
  background: #f1f5f9;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
}
.scout-timeline-info { flex: 1; min-width: 0; }
.scout-timeline-top {
  display: flex;
  align-items: center;
  gap: 8px;
}
.scout-timeline-diag {
  font-size: 14px;
  font-weight: 700;
  color: #1e293b;
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.scout-severity-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}
.scout-timeline-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: #64748b;
  margin-top: 3px;
}
.scout-stage-badge {
  font-size: 11px;
  font-weight: 700;
  padding: 1px 8px;
  border-radius: 16px;
  background: #EFF6FF;
  color: #2563EB;
}
.scout-timeline-notes {
  margin: 4px 0 0;
  font-size: 12px;
  color: #64748b;
  line-height: 1.4;
}

/* ─── Marketing Plan Screen ───────────────────────────────────────────── */
.mplan-section {
  background: var(--card-bg);
  border-radius: var(--radius-sm);
  padding: 16px;
  margin-bottom: 12px;
  box-shadow: var(--shadow);
}
.mplan-section-title {
  font-size: 15px;
  font-weight: 700;
  color: var(--text-dark);
  margin: 0 0 12px;
}

/* Timeline */
.mplan-timeline-wrap {
  position: relative;
  margin-bottom: 8px;
}
.mplan-timeline-bar {
  position: relative;
  height: 48px;
  background: #F1F5F9;
  border-radius: 8px;
  overflow: visible;
}
.mplan-phase-band {
  position: absolute;
  top: 0;
  height: 100%;
  border-radius: 4px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding-bottom: 6px;
}
.mplan-phase-label {
  font-size: 9px;
  font-weight: 700;
  white-space: nowrap;
}
.mplan-target-mark {
  position: absolute;
  top: -2px;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
}
.mplan-target-mark span {
  font-size: 9px;
  font-weight: 700;
  color: var(--text-dark);
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 1px 4px;
}
.mplan-target-mark::after {
  content: '';
  width: 2px;
  height: 48px;
  background: var(--text-light);
  opacity: 0.4;
}
.mplan-now-marker {
  position: absolute;
  top: -6px;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: 2;
}
.mplan-now-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--pop-red);
  border: 2px solid var(--white);
  box-shadow: 0 0 0 2px var(--pop-red);
}
.mplan-now-label {
  font-size: 9px;
  font-weight: 700;
  color: var(--pop-red);
  margin-top: 2px;
}
.mplan-month-row {
  position: relative;
  height: 20px;
  margin-top: 4px;
}
.mplan-month-tick {
  position: absolute;
  transform: translateX(-50%);
  font-size: 9px;
  color: var(--text-light);
  font-weight: 500;
}
.mplan-phase-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 4px;
}
.mplan-legend-item {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  color: var(--text-medium);
}
.mplan-legend-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}

/* Schedule Table */
.mplan-crop-table {
  margin-bottom: 14px;
}
.mplan-crop-label {
  font-size: 14px;
  font-weight: 700;
  color: var(--text-dark);
  margin-bottom: 6px;
}
.mplan-table-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.mplan-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
  min-width: 360px;
}
.mplan-table th {
  text-align: left;
  padding: 6px 8px;
  font-weight: 600;
  color: var(--text-medium);
  border-bottom: 2px solid var(--border);
  white-space: nowrap;
}
.mplan-table td {
  padding: 5px 8px;
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
}
.mplan-current-row {
  background: #FEF9C3 !important;
  font-weight: 600;
}
.mplan-on-pace td { color: var(--primary-green); }
.mplan-behind td { color: var(--pop-red); }
.mplan-ahead td { color: #3B82F6; }

/* Strategy Cards */
.mplan-strategy-card {
  background: var(--bg-main);
  border-radius: 8px;
  padding: 12px 14px;
  margin-bottom: 8px;
}
.mplan-strategy-header {
  font-size: 13px;
  font-weight: 700;
  color: var(--text-dark);
  margin-bottom: 4px;
}
.mplan-strategy-desc {
  font-size: 12px;
  color: var(--text-medium);
  margin: 0;
  line-height: 1.4;
}

/* Contract Recommendations */
.mplan-rec-banner {
  display: flex;
  align-items: center;
  gap: 8px;
  background: #F0FDF4;
  border: 1px solid #BBF7D0;
  border-radius: 8px;
  padding: 10px 12px;
  margin-bottom: 12px;
  font-size: 13px;
  color: var(--text-dark);
}
.mplan-rec-icon {
  font-size: 18px;
  flex-shrink: 0;
}
.mplan-contract-bar {
  display: flex;
  border-radius: 6px;
  overflow: hidden;
  height: 28px;
  margin-bottom: 8px;
}
.mplan-cbar-seg {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
}
.mplan-contract-legend {
  display: flex;
  gap: 12px;
  margin-bottom: 12px;
}
.mplan-contract-card {
  background: var(--bg-main);
  border-radius: 8px;
  padding: 10px 12px;
  margin-bottom: 6px;
}
.mplan-contract-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
}
.mplan-contract-type {
  font-size: 10px;
  font-weight: 700;
  color: #fff;
  padding: 2px 8px;
  border-radius: 4px;
}
.mplan-contract-name {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-dark);
}
.mplan-contract-desc {
  font-size: 12px;
  color: var(--text-dark);
  margin: 0 0 2px;
}
.mplan-contract-when {
  font-size: 11px;
  color: var(--text-light);
  margin: 0;
  font-style: italic;
}

/* ─── Tier-Locked Sections ─────────────────────────────────────────────── */
.tier-locked {
  position: relative;
  overflow: hidden;
  pointer-events: none;
  user-select: none;
}
.tier-locked > *:not(.tier-locked-overlay) {
  filter: blur(4px);
}
.tier-locked-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.6);
  z-index: 10;
  pointer-events: auto;
  gap: 8px;
}
.tier-locked-overlay .tier-lock-icon {
  font-size: 24px;
}
.tier-locked-overlay .tier-upgrade-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 20px;
  background: var(--primary-green);
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(22, 163, 74, 0.3);
}
.tier-locked-overlay .tier-upgrade-btn:active {
  transform: scale(0.97);
}
.tier-locked-overlay .tier-upgrade-hint {
  font-size: 12px;
  color: var(--text-light);
}

/* ═══════════════════════════════════════════════════════════════════
   USDA Reports Screen
   ═══════════════════════════════════════════════════════════════════ */

.usda-banner-card {
  display: flex;
  align-items: center;
  gap: 12px;
  background: linear-gradient(135deg, #F1F5F9, #E2E8F0);
  border: 1px solid #CBD5E1;
  border-radius: var(--radius-sm);
  padding: 14px 16px;
  margin: 16px 16px 0;
}

.usda-banner-icon { font-size: 24px; }

.usda-banner-text {
  font-size: 14px;
  color: var(--text-dark);
  line-height: 1.4;
}

.usda-report-card {
  background: var(--card-bg);
  border-radius: var(--radius-sm);
  padding: 16px;
  margin-bottom: 12px;
  box-shadow: var(--shadow);
  cursor: pointer;
  transition: box-shadow 0.2s, transform 0.2s;
}

.usda-report-card:hover {
  box-shadow: var(--shadow-lg);
  transform: translateY(-1px);
}

.usda-card-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 10px;
}

.usda-card-name {
  font-weight: 700;
  font-size: 15px;
  color: var(--text-dark);
}

.usda-card-date {
  font-size: 13px;
  color: var(--text-medium);
  margin-top: 2px;
}

.usda-card-countdown {
  font-weight: 700;
  font-size: 14px;
  padding: 4px 10px;
  border-radius: 8px;
  white-space: nowrap;
  flex-shrink: 0;
}

.usda-days-urgent {
  background: #FEE2E2;
  color: #DC2626;
}

.usda-days-normal {
  background: #F0F9FF;
  color: #2563EB;
}

.usda-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-bottom: 10px;
}

.usda-impact {
  font-size: 12px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 6px;
}

.usda-impact.high {
  background: #FEE2E2;
  color: #DC2626;
}

.usda-impact.medium {
  background: #DBEAFE;
  color: #2563EB;
}

.usda-hist-impact {
  font-size: 12px;
  color: var(--text-medium);
  font-style: italic;
}

.usda-card-watch {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--border);
}

.usda-watch-title {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-medium);
  margin-bottom: 4px;
}

.usda-card-watch ul {
  margin: 0;
  padding-left: 18px;
}

.usda-card-watch li {
  font-size: 13px;
  color: var(--text-medium);
  line-height: 1.5;
}

.usda-card-hint {
  margin-top: 10px;
  font-size: 12px;
  color: var(--primary-green);
  font-weight: 600;
  text-align: right;
}

/* Report Day Guide */
.usda-guide-phase {
  background: var(--card-bg);
  border-radius: var(--radius-sm);
  padding: 14px 16px;
  margin-bottom: 10px;
  box-shadow: var(--shadow);
}

.usda-guide-title {
  font-weight: 700;
  font-size: 15px;
  color: var(--text-dark);
  margin-bottom: 8px;
}

.usda-guide-list {
  margin: 0;
  padding-left: 18px;
}

.usda-guide-list li {
  font-size: 13px;
  color: var(--text-medium);
  line-height: 1.6;
  margin-bottom: 4px;
}

/* Report Detail Modal */
.usda-detail-section {
  margin-bottom: 20px;
}

.usda-detail-section h4 {
  font-size: 15px;
  font-weight: 700;
  margin: 0 0 8px 0;
  color: var(--text-dark);
}

.usda-detail-section p {
  font-size: 14px;
  line-height: 1.6;
  color: var(--text-medium);
  margin: 0;
}

.usda-moves-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.usda-moves-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

.usda-moves-table th {
  text-align: left;
  padding: 8px 6px;
  border-bottom: 2px solid var(--border);
  font-weight: 600;
  color: var(--text-dark);
  white-space: nowrap;
}

.usda-moves-table td {
  padding: 8px 6px;
  border-bottom: 1px solid var(--border);
  color: var(--text-medium);
}

.usda-moves-table .text-green { color: #16A34A; font-weight: 600; }
.usda-moves-table .text-red { color: #DC2626; font-weight: 600; }

/* ═══════════════════════════════════════════════════════════════════
   Mobile-First Responsive Polish
   ═══════════════════════════════════════════════════════════════════ */

/* ─── Base mobile fixes (all screens) ─────────────────────────────── */

/* Ensure all screens have bottom nav clearance */
.screen {
  padding-bottom: 80px;
}

/* Prevent horizontal overflow everywhere */
#app {
  overflow-x: hidden;
}

.dashboard-content,
.screen {
  overflow-x: hidden;
}

/* Minimum touch target for all interactive elements */
.nav-item {
  min-width: 44px;
  min-height: 44px;
  padding: 6px 4px;
}

.icon-btn {
  min-width: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Modal full-width on mobile */
.modal-card {
  max-width: 100%;
  border-radius: var(--radius) var(--radius) 0 0;
}

.modal-footer {
  padding-bottom: max(32px, calc(env(safe-area-inset-bottom) + 12px));
}

/* Ensure text doesn't overflow cards */
.elevator-name,
.pli-crop,
.pos-crop-name,
.claim-card-number,
.outlook-text,
.almanac-text {
  overflow: hidden;
  text-overflow: ellipsis;
}

.elevator-name {
  white-space: nowrap;
}

/* Weather detail grid — fit within 375px screen (343px content area) */
.weather-detail-header,
.weather-detail-row {
  grid-template-columns: 44px 24px 62px 38px 50px 32px;
  gap: 3px;
  font-size: 12px;
}

.weather-detail-header {
  font-size: 9px;
}

/* Elevator rows — prevent overflow */
.elevator-row {
  flex-wrap: nowrap;
  gap: 4px;
}

.elevator-row-left {
  min-width: 0;
  overflow: hidden;
}

/* Chat input sticks above nav */
#screen-agent {
  padding-bottom: 0;
}

#screen-agent .chat-input-bar {
  position: sticky;
  bottom: 0;
  z-index: 5;
}

/* ─── Phone breakpoint (≤480px) ───────────────────────────────────── */
@media (max-width: 480px) {
  /* Dashboard content padding */
  .dashboard-content {
    padding: 16px;
    padding-bottom: 100px;
  }

  /* Price cards stack on very narrow or stay 2-col */
  .price-cards {
    gap: 8px;
  }

  .price-card {
    padding: 12px;
  }

  /* Shop icon grid — 4 columns on phones */
  .shop-icon-grid {
    gap: 14px 4px;
  }

  /* Position progress bars fit screen */
  .sold-bar-wrap {
    max-width: 100%;
  }

  .pos-breakdown {
    flex-wrap: wrap;
  }

  /* Contract detail grid */
  .cd-summary-grid {
    gap: 8px;
  }

  /* Weather card no overflow */
  .weather-card {
    overflow: hidden;
  }

  .weather-expanded-content {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* Spray calendar fit */
  .spray-cal-row {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 4px;
  }

  /* Section headers */
  section h2 {
    font-size: 16px;
  }

  /* Signal cards */
  .signal-card {
    padding: 14px;
  }

  .signal-actions {
    gap: 8px;
  }

  .btn-action {
    padding: 12px;
    font-size: 13px;
  }

  /* Claim card details — stack on narrow */
  .claim-card-details {
    grid-template-columns: 1fr 1fr;
    gap: 4px 12px;
    font-size: 12px;
  }

  /* Settings rows */
  .settings-row {
    flex-wrap: wrap;
    gap: 4px;
  }

  /* Elevator detail modal */
  .elevator-detail-price {
    font-size: 24px;
  }

  /* Prices detail */
  .pd-price {
    font-size: 30px;
  }

  /* Onboarding padding */
  .onboarding-body {
    padding-left: 16px;
    padding-right: 16px;
  }
}

/* ─── Very small phones (≤380px) ──────────────────────────────────── */
@media (max-width: 380px) {
  .shop-icon-grid {
    gap: 12px 2px;
  }
  .shop-icon-circle {
    width: 52px;
    height: 52px;
    font-size: 20px;
  }
  .shop-icon-label {
    font-size: 11px;
  }

  .price-cards {
    grid-template-columns: 1fr;
  }

  .dashboard-content {
    padding: 12px;
    padding-bottom: 100px;
  }

  .weather-detail-header,
  .weather-detail-row {
    grid-template-columns: 38px 22px 56px 34px 44px 28px;
    gap: 2px;
    font-size: 11px;
  }

  .weather-detail-header {
    font-size: 8px;
  }

  .pos-contract-row {
    flex-wrap: wrap;
    gap: 4px;
  }

  .elevator-row {
    padding: 8px 10px;
  }

  .elevator-name {
    font-size: 12px;
  }

  .elevator-price {
    font-size: 14px;
    min-width: 50px;
  }
}

/* ─── Tablet breakpoint (≤768px) ──────────────────────────────────── */
@media (max-width: 768px) and (min-width: 481px) {
  /* Shop icon grid stays 4-col on tablets */
}

/* ─── Profit Calculator ──────────────────────────────────────────── */
.pc-crop-toggle {
    display: flex;
    gap: 8px;
    margin-bottom: 12px;
}
.pc-crop-btn {
    flex: 1;
    padding: 10px;
    border: 2px solid var(--border);
    border-radius: 20px;
    background: white;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}
.pc-crop-btn.active {
    border-color: var(--primary-green);
    background: #F0FDF4;
    color: var(--secondary-green);
}
.pc-scenarios {
    display: flex;
    gap: 6px;
    margin-bottom: 12px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.pc-scenario-btn {
    flex-shrink: 0;
    padding: 6px 12px;
    border: 1.5px solid var(--border);
    border-radius: 20px;
    background: white;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-medium);
    cursor: pointer;
    transition: all 0.2s;
    white-space: nowrap;
}
.pc-scenario-btn.active {
    border-color: var(--primary-green);
    background: var(--primary-green);
    color: white;
}
.pc-input-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}
.pc-input-group label {
    display: block;
    font-size: 11px;
    font-weight: 600;
    color: var(--text-light);
    margin-bottom: 4px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}
.pc-input-group input {
    width: 100%;
    padding: 10px;
    border: 1.5px solid var(--border);
    border-radius: 16px;
    font-size: 16px;
    font-weight: 600;
    text-align: center;
    color: var(--text-dark);
}
.pc-input-group input:focus {
    outline: none;
    border-color: var(--primary-green);
    background: #F0FDF4;
}
.pc-flex-badge {
    margin-top: 10px;
    padding: 6px 10px;
    background: #F1F5F9;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    color: #475569;
    text-align: center;
}
.pc-slider-wrap {
    padding: 4px 0;
}
.pc-slider-track {
    position: relative;
    padding: 8px 0;
}
.pc-slider-track input[type="range"] {
    width: 100%;
    -webkit-appearance: none;
    appearance: none;
    height: 6px;
    border-radius: 3px;
    background: linear-gradient(90deg, #DC2626 0%, #64748B 40%, #22C55E 70%, #16A34A 100%);
    outline: none;
}
.pc-slider-track input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: white;
    border: 3px solid var(--primary-green);
    box-shadow: 0 2px 6px rgba(0,0,0,0.15);
    cursor: pointer;
}
.pc-be-marker {
    position: absolute;
    top: 0;
    width: 2px;
    height: 100%;
    background: #DC2626;
    pointer-events: none;
    transition: left 0.15s;
}
.pc-be-marker::after {
    content: 'BE';
    position: absolute;
    top: -16px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 9px;
    font-weight: 700;
    color: #DC2626;
    background: #FEE2E2;
    padding: 1px 4px;
    border-radius: 4px;
}
.pc-slider-labels {
    display: flex;
    justify-content: space-between;
    font-size: 11px;
    color: var(--text-light);
    margin-top: 4px;
}
.pc-result-row {
    display: flex;
    justify-content: space-between;
    padding: 6px 0;
    font-size: 13px;
    color: var(--text-medium);
    border-bottom: 1px solid #F1F5F9;
}
.pc-result-row .pc-val {
    font-weight: 600;
    color: var(--text-dark);
}
.pc-result-big {
    text-align: center;
    padding: 16px 0;
    margin: 8px 0;
    border-radius: 20px;
}
.pc-result-big.profit {
    background: #F0FDF4;
}
.pc-result-big.loss {
    background: #FEF2F2;
}
.pc-result-label {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 4px;
}
.pc-result-big.profit .pc-result-label { color: var(--secondary-green); }
.pc-result-big.loss .pc-result-label { color: #DC2626; }
.pc-result-amount {
    font-size: 36px;
    font-weight: 800;
    line-height: 1.1;
}
.pc-result-big.profit .pc-result-amount { color: var(--primary-green); }
.pc-result-big.loss .pc-result-amount { color: #DC2626; }
.pc-metrics-row {
    display: flex;
    gap: 8px;
    margin-top: 4px;
}
.pc-metric {
    flex: 1;
    text-align: center;
    padding: 10px 4px;
    background: #F8FAFC;
    border-radius: 16px;
}
.pc-metric-label {
    font-size: 10px;
    font-weight: 600;
    color: var(--text-light);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: 4px;
}
.pc-metric-value {
    font-size: 16px;
    font-weight: 700;
    color: var(--text-dark);
}
.pc-metric-value.profit { color: var(--primary-green); }
.pc-metric-value.loss { color: #DC2626; }
.pc-flex-callout {
    background: #FFFBEB;
    border: 1.5px solid #FCD34D;
    border-radius: 20px;
    padding: 12px 14px;
    margin-bottom: 12px;
}
.pc-flex-title {
    font-size: 13px;
    font-weight: 700;
    color: #92400E;
    margin-bottom: 4px;
}
.pc-flex-text {
    font-size: 12px;
    color: #78350F;
    line-height: 1.5;
}

/* ─── FSA Program Advisor ─────────────────────────────────────────── */
.fsa-program-tabs {
    display: flex;
    gap: 0;
    background: var(--border);
    border-radius: var(--radius-sm);
    padding: 3px;
    margin-bottom: 16px;
}
.fsa-tab {
    flex: 1;
    padding: 10px 8px;
    border: none;
    border-radius: 16px;
    background: transparent;
    font-weight: 600;
    font-size: 14px;
    color: var(--text-medium);
    cursor: pointer;
    transition: all 0.2s;
}
.fsa-tab.active {
    background: var(--card-bg);
    color: var(--text-dark);
    box-shadow: var(--shadow);
}

/* ─── FSA Deadline Tracker ─── */
.fsa-deadline-card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 16px;
  margin-bottom: 12px;
  transition: transform 0.15s ease;
}
.fsa-deadline-card.fsa-deadline-past {
  opacity: 0.5;
}
.fsa-deadline-header {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 12px;
}
.fsa-deadline-icon {
  font-size: 28px;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--light-green);
  border-radius: 50%;
  flex-shrink: 0;
}
.fsa-deadline-header-text {
  flex: 1;
  min-width: 0;
}
.fsa-deadline-title {
  font-size: 15px;
  font-weight: 700;
  color: var(--text-dark);
  font-family: 'Inter', sans-serif;
}
.fsa-deadline-date {
  font-size: 13px;
  color: var(--text-light);
  margin-top: 2px;
  font-family: 'Inter', sans-serif;
}
.fsa-deadline-badge {
  font-size: 12px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 8px;
  white-space: nowrap;
  flex-shrink: 0;
  font-family: 'Inter', sans-serif;
}
.fsa-deadline-countdown {
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin-bottom: 12px;
  padding: 8px 0;
}
.fsa-deadline-days-num {
  font-size: 36px;
  font-weight: 900;
  color: var(--primary-green);
  font-family: 'Inter', sans-serif;
  line-height: 1;
}
.fsa-deadline-days-label {
  font-size: 16px;
  font-weight: 600;
  color: var(--text-light);
  font-family: 'Inter', sans-serif;
}
.fsa-deadline-body {
  margin-bottom: 12px;
}
.fsa-deadline-section {
  margin-bottom: 10px;
  font-size: 13px;
  color: var(--text-medium);
  line-height: 1.5;
  font-family: 'Inter', sans-serif;
}
.fsa-deadline-section-label {
  font-size: 11px;
  font-weight: 700;
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 4px;
  font-family: 'Inter', sans-serif;
}
.fsa-deadline-actions {
  display: flex;
  gap: 8px;
}
.fsa-farm-card {
    background: var(--card-bg);
    border-radius: var(--radius);
    padding: 16px;
    margin-bottom: 12px;
    box-shadow: var(--shadow);
    border: 1px solid var(--border);
}
.fsa-farm-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 12px;
}
.fsa-farm-title {
    font-weight: 700;
    font-size: 16px;
    color: var(--text-dark);
}
.fsa-farm-subtitle {
    font-size: 13px;
    color: var(--text-light);
    margin-top: 2px;
}
.fsa-badge {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}
.fsa-badge.plc {
    background: #EFF6FF;
    color: #1D4ED8;
}
.fsa-badge.arc {
    background: var(--light-green);
    color: var(--secondary-green);
}
.fsa-badge.close {
    background: #F1F5F9;
    color: var(--text-medium);
}
.fsa-program-label {
    font-size: 11px;
    font-weight: 600;
    color: var(--text-light);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 4px;
}
.fsa-compare-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-top: 12px;
}
.fsa-compare-box {
    background: var(--bg-main);
    border-radius: var(--radius-sm);
    padding: 12px;
    text-align: center;
}
.fsa-compare-box.winner {
    border: 2px solid var(--primary-green);
    background: var(--light-green);
}
.fsa-compare-label {
    font-size: 12px;
    font-weight: 600;
    color: var(--text-light);
    margin-bottom: 4px;
}
.fsa-compare-value {
    font-size: 20px;
    font-weight: 800;
    color: var(--text-dark);
}
.fsa-crop-section {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border);
}
.fsa-crop-title {
    font-size: 14px;
    font-weight: 700;
    color: var(--text-dark);
    margin-bottom: 8px;
}
.fsa-detail-row {
    display: flex;
    justify-content: space-between;
    font-size: 13px;
    padding: 3px 0;
}
.fsa-detail-row .label {
    color: var(--text-light);
}
.fsa-detail-row .value {
    font-weight: 600;
    color: var(--text-dark);
}
.fsa-doc-card {
    background: var(--card-bg);
    border-radius: var(--radius-sm);
    padding: 14px;
    margin-bottom: 10px;
    box-shadow: var(--shadow);
    display: flex;
    align-items: center;
    gap: 12px;
    border: 1px solid var(--border);
}
.fsa-doc-icon {
    font-size: 28px;
    flex-shrink: 0;
}
.fsa-doc-info {
    flex: 1;
    min-width: 0;
}
.fsa-doc-title {
    font-weight: 600;
    font-size: 14px;
    color: var(--text-dark);
}
.fsa-doc-meta {
    font-size: 12px;
    color: var(--text-light);
    margin-top: 2px;
}

/* ─── Irrigation Advisor ──────────────────────────────────────────── */
.irrig-filter-tabs {
  display: flex; gap: 8px; padding: 12px 16px 0;
}
.irrig-tab {
  padding: 6px 16px; border-radius: 20px; border: 1px solid var(--border);
  background: var(--card-bg); color: var(--text-medium); font-size: 13px;
  font-weight: 500; cursor: pointer; transition: all 0.2s;
}
.irrig-tab.active {
  background: var(--primary-green); color: #fff; border-color: var(--primary-green);
}
.irrig-summary-row {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px;
  padding: 12px 16px;
}
.irrig-stat {
  text-align: center; background: var(--card-bg); border-radius: var(--radius-sm);
  padding: 10px 4px; border: 1px solid var(--border);
}
.irrig-stat-value {
  font-size: 20px; font-weight: 700; color: var(--text-dark);
}
.irrig-stat-label {
  font-size: 11px; color: var(--text-light); margin-top: 2px;
}
.irrig-field-card {
  background: var(--card-bg); border: 1px solid var(--border);
  border-radius: var(--radius-sm); margin: 0 16px 10px; padding: 14px;
  cursor: pointer; transition: box-shadow 0.2s;
}
.irrig-field-card:hover { box-shadow: var(--shadow-lg); }
.irrig-field-top {
  display: flex; justify-content: space-between; align-items: flex-start;
}
.irrig-field-name {
  font-weight: 600; font-size: 15px; color: var(--text-dark);
}
.irrig-field-meta {
  font-size: 12px; color: var(--text-light); margin-top: 2px;
}
.irrig-field-rec {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 4px 10px; border-radius: 20px; font-size: 12px;
  font-weight: 600; color: #fff; white-space: nowrap;
}
.irrig-field-stats {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px;
  margin-top: 10px;
}
.irrig-mini-stat { text-align: center; }
.irrig-mini-label {
  display: block; font-size: 10px; color: var(--text-light); text-transform: uppercase;
  letter-spacing: 0.3px;
}
.irrig-mini-value {
  font-size: 14px; font-weight: 600; color: var(--text-dark);
}
.irrig-field-detail {
  max-height: 0; overflow: hidden; transition: max-height 0.3s ease;
}
.irrig-expanded .irrig-field-detail {
  max-height: 400px; margin-top: 12px; padding-top: 12px;
  border-top: 1px solid var(--border);
}
.irrig-detail-row {
  display: flex; justify-content: space-between; padding: 4px 0;
  font-size: 13px; color: var(--text-medium);
}
.irrig-detail-row span:last-child {
  font-weight: 500; color: var(--text-dark);
}
.irrig-detail-actions {
  display: flex; gap: 8px; margin-top: 12px;
}
.btn-sm {
  padding: 6px 14px; font-size: 13px; border-radius: 8px;
}

/* ─── Onboarding: Radio Cards (Marketing Goal) ────────────────────── */
.ob-goal-options {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.radio-card {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 16px;
    border: 1.5px solid var(--border);
    border-radius: var(--radius-sm);
    background: var(--card-bg);
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s;
}
.radio-card:has(input:checked) {
    border-color: var(--primary-green);
    background: var(--light-green);
}
.radio-card input[type="radio"] {
    margin-top: 3px;
    accent-color: var(--primary-green);
}
.radio-card-content {
    flex: 1;
}
.radio-card-title {
    font-size: 14px;
    font-weight: 700;
    color: var(--text-dark);
    margin-bottom: 2px;
}
.radio-card-desc {
    font-size: 12px;
    color: var(--text-medium);
    line-height: 1.4;
}

/* ─── Onboarding: Marketing Methods ──────────────────────────────── */
.ob-marketing-methods .checkbox-row {
    padding: 10px 0;
    border-bottom: 1px solid var(--border);
}
.ob-marketing-methods .checkbox-row:last-child {
    border-bottom: none;
}

/* ─── Onboarding: Delivery Location Rows ─────────────────────────── */
.ob-loc-row {
    background: var(--bg-main);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    padding: 10px 12px;
    margin-bottom: 8px;
}

/* ─── Profit Calc: Tab Toggle ────────────────────────────────────── */
.pc-tab-toggle {
    display: flex;
    gap: 0;
    background: var(--border);
    border-radius: var(--radius-sm);
    padding: 3px;
    margin-bottom: 12px;
}
.pc-tab-btn {
    flex: 1;
    padding: 8px 0;
    border: none;
    border-radius: 16px;
    background: transparent;
    font-size: 13px;
    font-weight: 600;
    color: var(--text-medium);
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}
.pc-tab-btn.active {
    background: var(--card-bg);
    color: var(--text-dark);
    box-shadow: var(--shadow);
}

/* ─── Fence Strategy: Outcome Table ──────────────────────────────── */
.fence-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
}
.fence-table th {
    text-align: left;
    padding: 6px 8px;
    border-bottom: 2px solid var(--border);
    font-weight: 700;
    color: var(--text-medium);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.fence-table td {
    padding: 8px 8px;
    border-bottom: 1px solid var(--border);
    color: var(--text-dark);
}
.fence-table tr:last-child td {
    border-bottom: none;
}
.fence-table .profit { color: var(--primary-green); }
.fence-table .loss { color: #DC2626; }

/* ─── Soil Filter Banner ─────────────────────────────────────────── */
.soil-filter-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px;
  margin-bottom: 12px;
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  border-radius: 16px;
}
.soil-filter-banner span {
  font-weight: 700;
  font-size: 15px;
  color: var(--text-dark);
}
.soil-filter-banner .btn-secondary {
  padding: 4px 12px;
  font-size: 12px;
  min-height: 32px;
}

/* ─── Responsive for wider screens ────────────────────────────────── */
@media (min-width: 430px) {
  .bottom-nav { max-width: 430px; }
}

/* Fix: soil test modals and shop screens need bottom padding for nav bar */
.modal-content { padding-bottom: 100px; }
#screen-fields .tab-content { padding-bottom: 100px; }
.soil-field-group:last-child { padding-bottom: 80px; }

/* ─── Crop Lifecycle Tracker ──────────────────────────────────────── */
.cl-field-tabs {
    display: flex;
    gap: 8px;
    padding: 16px 16px 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.cl-field-pill {
    flex-shrink: 0;
    padding: 8px 16px;
    border-radius: 20px;
    border: 1px solid var(--border);
    background: var(--white);
    font-size: 13px;
    font-weight: 500;
    font-family: 'Inter', sans-serif;
    color: var(--text-medium);
    min-height: 44px;
    display: flex;
    align-items: center;
    cursor: pointer;
    transition: all 0.15s;
}
.cl-field-pill.active {
    background: var(--primary-green);
    color: white;
    border-color: var(--primary-green);
}

/* Timeline */
.cl-timeline-bar {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 20px 12px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.cl-timeline-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    min-width: 52px;
    position: relative;
}
.cl-timeline-dot {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--white);
    border: 2px solid var(--border);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-light);
    transition: all 0.2s;
    z-index: 1;
}
.cl-timeline-step.done .cl-timeline-dot {
    background: var(--primary-green);
    border-color: var(--primary-green);
    color: white;
    font-size: 13px;
}
.cl-timeline-step.active .cl-timeline-dot {
    border-color: var(--primary-green);
    color: var(--primary-green);
    box-shadow: 0 0 0 3px rgba(22,163,74,0.15);
}
.cl-timeline-step.active.done .cl-timeline-dot {
    color: white;
}
.cl-timeline-label {
    font-size: 10px;
    color: var(--text-light);
    margin-top: 6px;
    text-align: center;
    white-space: nowrap;
}
.cl-timeline-step.active .cl-timeline-label {
    color: var(--primary-green);
    font-weight: 600;
}
.cl-timeline-line {
    width: 16px;
    height: 2px;
    background: var(--border);
    margin-top: 15px;
    flex-shrink: 0;
}
.cl-timeline-step.done + .cl-timeline-line {
    background: var(--primary-green);
}

/* Cards */
.cl-card {
    background: var(--white);
    border-radius: var(--radius);
    padding: 20px;
    margin: 0 16px 16px;
    box-shadow: var(--shadow);
}
.cl-card-title {
    font-size: 16px;
    font-weight: 700;
    color: var(--text-dark);
    margin: 0 0 16px;
}
.cl-card .input-group {
    margin-bottom: 12px;
}

/* Stand count calculator box */
.cl-calc-box {
    background: var(--light-green);
    border-radius: var(--radius-sm);
    padding: 16px;
    margin: 12px 0;
}
.cl-calc-title {
    font-size: 13px;
    font-weight: 600;
    color: var(--secondary-green);
    margin: 0 0 4px;
}

/* Stats */
.cl-stat-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
    font-size: 14px;
    color: var(--text-medium);
    border-bottom: 1px solid var(--border);
}
.cl-stat-row:last-child { border-bottom: none; }
.cl-stat-value { font-weight: 700; font-size: 15px; }
.cl-stat-value.green { color: var(--primary-green); }
.cl-stat-value.yellow { color: #CA8A04; }
.cl-stat-value.red { color: var(--pop-red); }

/* Method rows */
.cl-method-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 12px;
    margin-bottom: 4px;
    background: var(--bg-main);
    border-radius: 8px;
    font-size: 13px;
    color: var(--text-medium);
}
.cl-method-row span:last-child {
    font-weight: 600;
    color: var(--text-dark);
}

/* Big yield display */
.cl-big-yield {
    font-size: 48px;
    font-weight: 800;
    color: var(--text-dark);
    text-align: center;
    padding: 8px 0 4px;
    line-height: 1;
}
.cl-yield-unit {
    font-size: 16px;
    font-weight: 500;
    color: var(--text-light);
}

/* Range bar */
.cl-range-bar-container { padding: 8px 0 16px; }
.cl-range-labels {
    display: flex;
    justify-content: space-between;
    font-size: 11px;
    color: var(--text-light);
    margin-bottom: 4px;
}
.cl-range-bar {
    height: 8px;
    background: var(--border);
    border-radius: 4px;
    position: relative;
    overflow: visible;
}
.cl-range-fill {
    position: absolute;
    top: 0;
    bottom: 0;
    border-radius: 4px;
}
.cl-range-marker {
    position: absolute;
    top: -4px;
    width: 16px;
    height: 16px;
    background: var(--primary-green);
    border: 2px solid white;
    border-radius: 50%;
    box-shadow: var(--shadow);
    transform: translateX(-50%);
}

/* Weather events */
.cl-weather-event {
    background: var(--bg-main);
    border-radius: var(--radius-sm);
    padding: 12px;
    margin-bottom: 8px;
}
.cl-weather-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 14px;
    font-weight: 600;
    color: var(--text-dark);
}
.cl-damage {
    font-size: 13px;
    font-weight: 600;
    color: var(--pop-red);
}
.cl-divider {
    height: 1px;
    background: var(--border);
    margin: 16px 0;
}

#screen-crop-lifecycle .sub-content {
    padding-bottom: 100px;
}

/* ─── Lifecycle Report Tab ─────────────────────────────────────────────── */
.cl-report {
    padding: 0 16px 24px;
}
.cl-report-header {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 20px;
    margin-bottom: 16px;
    text-align: center;
}
.cl-report-subtitle {
    font-size: 14px;
    color: var(--text-medium);
    margin-top: 6px;
    font-family: 'Inter', sans-serif;
}
.cl-report-na {
    color: #9CA3AF;
    font-style: italic;
    font-size: 13px;
}

/* Report timeline */
.cl-report-timeline {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 16px 0 20px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.cl-report-tl-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 64px;
}
.cl-report-tl-dot {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 2px solid #D1D5DB;
    background: var(--white);
    transition: all 0.2s;
}
.cl-report-tl-step.filled .cl-report-tl-dot {
    background: var(--primary-green);
    border-color: var(--primary-green);
}
.cl-report-tl-label {
    font-size: 11px;
    font-weight: 600;
    color: var(--text-medium);
    margin-top: 6px;
    text-align: center;
    white-space: nowrap;
}
.cl-report-tl-step.filled .cl-report-tl-label {
    color: var(--text-dark);
}
.cl-report-tl-date {
    font-size: 10px;
    color: var(--text-light);
    margin-top: 2px;
    text-align: center;
    white-space: nowrap;
}
.cl-report-tl-line {
    width: 20px;
    height: 2px;
    background: #D1D5DB;
    margin-top: 6px;
    flex-shrink: 0;
}

/* Report cards */
.cl-report-grid {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.cl-report-card {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 16px 20px;
}
.cl-report-card-title {
    font-size: 14px;
    font-weight: 700;
    color: var(--text-dark);
    margin: 0 0 12px;
    font-family: 'Inter', sans-serif;
}
.cl-report-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 7px 0;
    font-size: 13px;
    color: var(--text-medium);
    border-bottom: 1px solid #F3F4F6;
    font-family: 'Inter', sans-serif;
}
.cl-report-row:last-child {
    border-bottom: none;
}
.cl-report-row span:last-child {
    font-weight: 600;
    color: var(--text-dark);
    text-align: right;
}
.cl-report-row-bold {
    font-weight: 700 !important;
    background: #F9FAFB;
    margin: 0 -20px;
    padding: 7px 20px !important;
}
.cl-report-row-bold span {
    font-weight: 700 !important;
    color: var(--text-dark) !important;
}

/* Performance card */
.cl-report-perf {
    text-align: center;
}
.cl-report-perf-number {
    font-size: 48px;
    font-weight: 800;
    line-height: 1;
    margin: 4px 0;
    font-family: 'Inter', sans-serif;
}
.cl-report-perf-label {
    font-size: 13px;
    color: var(--text-light);
    margin-bottom: 12px;
}

/* Report actions */
.cl-report-actions {
    display: flex;
    gap: 12px;
    margin-top: 20px;
}
.cl-report-actions button {
    flex: 1;
    min-height: 44px;
    font-family: 'Inter', sans-serif;
}
.btn-outline {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    padding: 10px 16px;
    font-size: 14px;
    font-weight: 600;
    color: var(--text-dark);
    cursor: pointer;
    transition: all 0.15s;
}
.btn-outline:hover {
    background: #F9FAFB;
    border-color: var(--text-light);
}

/* Print styles */
@media print {
    body * {
        visibility: hidden;
    }
    #screen-crop-lifecycle,
    #screen-crop-lifecycle * {
        visibility: visible;
    }
    #screen-crop-lifecycle {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
    }
    .cl-field-tabs,
    .cl-timeline-bar,
    .cl-report-actions,
    .bottom-nav,
    .top-bar {
        display: none !important;
    }
    .cl-report {
        padding: 0;
    }
    .cl-report-card {
        break-inside: avoid;
        border: 1px solid #E5E7EB;
        box-shadow: none;
    }
    .cl-report-header {
        box-shadow: none;
        border: 1px solid #E5E7EB;
    }
}

/* ─── Supplier Contact Cards ───────────────────────────────────────────── */
.supplier-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px;
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    margin-bottom: 8px;
}
.supplier-card-info { flex: 1; min-width: 0; }
.supplier-card-name { font-weight: 600; font-size: 15px; color: var(--text-dark); }
.supplier-card-company { font-size: 13px; color: var(--text-medium); margin-top: 2px; }
.supplier-card-role { font-size: 12px; color: var(--text-light); margin-top: 2px; }
.supplier-card-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; margin-left: 12px; }
.supplier-call-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    background: var(--primary-green);
    border-radius: 50%;
    text-decoration: none;
    flex-shrink: 0;
}
.supplier-call-btn:active { background: var(--secondary-green); }
.supplier-call-btn.inline {
    width: auto;
    height: auto;
    border-radius: 8px;
    padding: 6px 14px;
    font-size: 14px;
    font-weight: 600;
    color: #fff;
    gap: 6px;
}
.supplier-edit-btn, .supplier-del-btn {
    background: none;
    border: none;
    color: var(--text-light);
    cursor: pointer;
    padding: 6px;
    border-radius: 6px;
    min-width: 32px;
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.supplier-edit-btn:hover { color: var(--primary-green); background: var(--light-green); }
.supplier-del-btn:hover { color: var(--pop-red); background: var(--soft-red); }

/* Crop doctor contact CTA */
.diagnosis-contact-cta {
    margin-top: 12px;
    padding: 10px 14px;
    background: var(--light-green);
    border-radius: 16px;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: wrap;
}

/* Onboarding contacts grid */
.ob-contacts-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-top: 12px;
}
.ob-contact-card {
    padding: 12px;
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.ob-contact-role {
    font-size: 12px;
    font-weight: 600;
    color: var(--text-medium);
    margin-bottom: 2px;
}
.ob-contact-card input {
    width: 100%;
    padding: 6px 8px;
    border: 1px solid var(--border);
    border-radius: 6px;
    font-size: 13px;
    font-family: 'Inter', sans-serif;
}

/* ─── Ag Pride Snippet ─────────────────────────────────────────────────── */
.ag-pride-snippet {
    font-size: 12px;
    color: var(--text-light);
    text-align: center;
    padding: 4px 16px 8px;
    line-height: 1.4;
}

/* ═══ LOADING SPINNER ═══ */
.loading-spinner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 48px 20px;
  color: #718096;
  font-size: 14px;
  gap: 12px;
}
.spinner {
  width: 32px;
  height: 32px;
  border: 3px solid #E2E8F0;
  border-top-color: #2D8C4E;
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}
@keyframes spin {
  to { transform: rotate(360deg); }
}

/* ═══ DEFINITIVE BOTTOM PADDING FIX ═══ */
/* Bottom nav is ~70px. Add 160px padding to EVERYTHING that scrolls vertically */
.app-content { padding-bottom: 160px !important; }
.screen { padding-bottom: 160px !important; }
[id^="screen-"] { padding-bottom: 160px !important; min-height: calc(100vh - 60px); }
[id^="screen-"] .tab-content { padding-bottom: 160px !important; }
[id^="screen-"] .sub-content { padding-bottom: 160px !important; }
.modal-body { padding-bottom: 160px !important; }
.modal-content { padding-bottom: 160px !important; }
.modal-full { padding-bottom: 160px !important; }
.tab-content { padding-bottom: 160px !important; }
.sub-content { padding-bottom: 160px !important; }
.soil-test-detail { padding-bottom: 160px !important; }
#soil-test-detail-body { padding-bottom: 160px !important; }
#claims-list { padding-bottom: 160px !important; }
#st-list { padding-bottom: 80px !important; }
.legal-disclaimer { margin-bottom: 80px; }

/* ─── Universal Upload Modal ───────────────────────────────────────────── */
.upload-btns-row {
  display: flex; gap: 12px; margin-bottom: 16px;
}
.upload-option-btn {
  flex: 1; display: flex; flex-direction: column; align-items: center; gap: 8px;
  padding: 20px 12px; border: 2px dashed #CBD5E1; border-radius: 20px;
  background: #F8FAFC; color: #475569; font-size: 14px; font-weight: 600;
  cursor: pointer; transition: all 0.15s;
}
.upload-option-btn:active { background: #E2E8F0; border-color: #94A3B8; }
.upload-preview {
  margin-top: 12px; border-radius: 16px; overflow: hidden;
  border: 1px solid #E2E8F0; background: #F8FAFC; text-align: center;
}
.upload-preview img {
  max-width: 100%; max-height: 200px; object-fit: contain; display: block; margin: 0 auto;
}
.upload-preview .upload-file-info {
  padding: 12px; font-size: 13px; color: #475569; display: flex; align-items: center; gap: 8px;
}
.upload-preview .upload-file-info svg { flex-shrink: 0; }
.upload-progress {
  margin-top: 12px; text-align: center;
}
.upload-progress-bar {
  width: 100%; height: 6px; background: #E2E8F0; border-radius: 3px; overflow: hidden;
}
.upload-progress-fill {
  height: 100%; background: #2D8C4E; border-radius: 3px; width: 0%;
  transition: width 0.3s ease;
}
.upload-progress span {
  font-size: 12px; color: #64748B; margin-top: 6px; display: inline-block;
}

/* Upload attach buttons in modals */
.btn-attach-upload {
  display: flex; align-items: center; gap: 6px; width: 100%;
  padding: 10px 14px; border: 2px dashed #CBD5E1; border-radius: 16px;
  background: #F8FAFC; color: #475569; font-size: 13px; font-weight: 600;
  cursor: pointer; transition: all 0.15s; margin-bottom: 8px;
}
.btn-attach-upload:active { background: #E2E8F0; border-color: #94A3B8; }
.btn-attach-upload svg { flex-shrink: 0; }

/* Photo badge on cards */
.card-photo-badge {
  display: inline-flex; align-items: center; gap: 3px;
  font-size: 11px; color: #64748B; background: #F1F5F9; border-radius: 6px;
  padding: 2px 6px; margin-left: 6px;
}
.card-photo-badge svg { width: 12px; height: 12px; }

/* Upload thumbnail on equipment cards */
.equip-card-photo {
  width: 48px; height: 48px; border-radius: 8px; object-fit: cover;
  border: 1px solid #E2E8F0; flex-shrink: 0;
}

/* ─── Landlord Report ──────────────────────────────────────────────────────── */
.lr-report {
  font-family: 'Inter', sans-serif;
  background: #fff;
  color: #1a1a1a;
  padding: 32px 24px;
  max-width: 720px;
  margin: 0 auto;
}
.lr-header {
  text-align: center;
  border-bottom: 2px solid #1a1a1a;
  padding-bottom: 16px;
  margin-bottom: 24px;
}
.lr-header h1 {
  font-size: 22px;
  font-weight: 700;
  margin: 0 0 4px;
  color: #1a1a1a;
}
.lr-header .lr-subtitle {
  font-size: 14px;
  color: #555;
  margin: 0;
}
.lr-header .lr-date {
  font-size: 12px;
  color: #888;
  margin-top: 6px;
}
.lr-section {
  margin-bottom: 20px;
}
.lr-section h2 {
  font-size: 15px;
  font-weight: 700;
  color: #1a1a1a;
  border-bottom: 1px solid #ddd;
  padding-bottom: 6px;
  margin: 0 0 10px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.lr-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 16px;
}
.lr-row {
  display: flex;
  justify-content: space-between;
  padding: 4px 0;
  font-size: 13px;
  border-bottom: 1px solid #f0f0f0;
}
.lr-row .lr-label { color: #666; }
.lr-row .lr-value { font-weight: 600; color: #1a1a1a; text-align: right; }
.lr-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
  margin-top: 8px;
}
.lr-table th {
  text-align: left;
  font-weight: 600;
  padding: 6px 8px;
  border-bottom: 2px solid #ddd;
  color: #333;
  font-size: 12px;
}
.lr-table td {
  padding: 5px 8px;
  border-bottom: 1px solid #f0f0f0;
}
.lr-table tr:last-child td { border-bottom: none; }
.lr-footer {
  text-align: center;
  margin-top: 24px;
  padding-top: 16px;
  border-top: 2px solid #1a1a1a;
  font-size: 12px;
  color: #888;
}
.lr-ai-section {
  white-space: pre-wrap;
  font-size: 13px;
  line-height: 1.7;
  color: #333;
  padding: 12px;
  background: #fafafa;
  border-radius: 8px;
  margin-top: 8px;
}

/* ═══ REPORT CENTER STYLES ═══ */
.rpt-card-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}
.rpt-report-card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 20px;
  padding: 16px;
  display: flex;
  align-items: flex-start;
  gap: 14px;
  cursor: pointer;
  transition: transform 0.15s ease;
}
.rpt-report-card:active { transform: scale(0.98); }
.rpt-report-icon {
  width: 48px;
  height: 48px;
  min-width: 48px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  background: #F1F5F9;
}
.rpt-report-info { flex: 1; min-width: 0; }
.rpt-report-title {
  font-size: 15px;
  font-weight: 700;
  color: var(--text-dark);
  font-family: 'Inter', sans-serif;
  margin-bottom: 3px;
}
.rpt-report-desc {
  font-size: 12px;
  color: var(--text-light);
  line-height: 1.4;
}
.rpt-report-arrow {
  color: var(--text-light);
  font-size: 18px;
  align-self: center;
}

/* Report detail cards */
.rpt-card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 20px;
  padding: 16px;
  margin-bottom: 12px;
}
.rpt-title {
  font-size: 16px;
  font-weight: 700;
  color: var(--text-dark);
  font-family: 'Inter', sans-serif;
  margin-bottom: 10px;
}
.rpt-subtitle {
  font-size: 13px;
  font-weight: 700;
  color: var(--text-medium);
  margin-bottom: 6px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.rpt-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 6px 0;
  border-bottom: 1px solid #F1F5F9;
  font-size: 14px;
  color: var(--text-dark);
  gap: 8px;
}
.rpt-row:last-child { border-bottom: none; }
.rpt-row span:first-child { color: var(--text-medium); }
.rpt-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.rpt-table th {
  text-align: left;
  font-weight: 600;
  color: var(--text-medium);
  padding: 6px 4px;
  border-bottom: 2px solid var(--border);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}
.rpt-table td {
  padding: 6px 4px;
  border-bottom: 1px solid #F8FAFC;
  color: var(--text-dark);
}
.rpt-bar-chart { margin: 8px 0; }
.rpt-bar-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
  font-size: 12px;
}
.rpt-bar-label {
  min-width: 60px;
  color: var(--text-medium);
  text-align: right;
}
.rpt-bar-track {
  flex: 1;
  height: 18px;
  background: #F1F5F9;
  border-radius: 9px;
  overflow: hidden;
}
.rpt-bar-fill {
  height: 100%;
  background: var(--primary-green);
  border-radius: 9px;
  min-width: 2px;
  display: flex;
  align-items: center;
  padding-left: 6px;
  font-size: 10px;
  font-weight: 600;
  color: #fff;
}
.rpt-highlight-good {
  background: #F0FDF4;
  border-left: 3px solid var(--primary-green);
  padding: 8px 12px;
  border-radius: 8px;
  margin: 6px 0;
  font-size: 13px;
}
.rpt-highlight-bad {
  background: #FEF2F2;
  border-left: 3px solid #DC2626;
  padding: 8px 12px;
  border-radius: 8px;
  margin: 6px 0;
  font-size: 13px;
}
.rpt-position-bar {
  height: 24px;
  background: #F1F5F9;
  border-radius: 12px;
  overflow: hidden;
  position: relative;
  margin: 8px 0;
}
.rpt-position-fill {
  height: 100%;
  background: var(--primary-green);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
  color: #fff;
}
.rpt-position-target {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 2px;
  background: var(--text-dark);
}

/* Export dropdown */
.rpt-export-dropdown {
  position: absolute;
  top: 52px;
  right: 16px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: var(--shadow-lg);
  z-index: 100;
  overflow: hidden;
}
.rpt-export-option {
  display: block;
  width: 100%;
  padding: 12px 24px;
  border: none;
  background: none;
  font-size: 14px;
  font-family: 'Inter', sans-serif;
  color: var(--text-dark);
  cursor: pointer;
  text-align: left;
  min-height: 44px;
}
.rpt-export-option:hover { background: #F8FAFC; }
.rpt-export-option + .rpt-export-option { border-top: 1px solid #F1F5F9; }

/* Print header (hidden on screen) */
.rpt-print-header { display: none; }

/* ═══ UNIVERSAL PRINT STYLES ═══ */
@media print {
  /* Hide navigation, header, back buttons, and interactive elements */
  .bottom-nav,
  .top-bar,
  .sub-header .btn-back,
  .btn-text-sm,
  .nav-item,
  #toast,
  .demo-banner,
  .modal-overlay,
  .modal-footer,
  .btn-primary:not(.print-keep),
  .btn-secondary:not(.print-keep),
  .btn-danger,
  .btn-attach-upload,
  .legal-disclaimer,
  .card-photo-badge,
  .rpt-export-dropdown,
  #rpt-export-btn,
  #rv-export-btn,
  #rv-export-dropdown,
  .sub-header {
    display: none !important;
  }

  /* Show print header */
  .rpt-print-header {
    display: flex !important;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
    border-bottom: 2px solid #000;
    margin-bottom: 16px;
  }
  .rpt-print-logo {
    font-size: 24px;
    font-weight: 900;
    font-family: 'Inter', sans-serif;
    color: #000;
  }
  .rpt-print-date {
    font-size: 12px;
    color: #666;
  }

  /* Reset padding for print */
  .screen, [id^="screen-"], .sub-content, .tab-content, .modal-body, .modal-content {
    padding-bottom: 0 !important;
    overflow: visible !important;
  }

  /* Clean card styling for print */
  .modal-card {
    box-shadow: none !important;
    border-radius: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Report card styling for print */
  .rpt-card {
    border: 1px solid #ccc !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    break-inside: avoid;
    margin-bottom: 8px;
  }
  .rpt-report-card { display: none !important; }
  .rpt-bar-fill { background: #333 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .rpt-position-fill { background: #333 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .rpt-highlight-good { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .rpt-highlight-bad { -webkit-print-color-adjust: exact; print-color-adjust: exact; }

  /* Landlord report print */
  #modal-landlord-report,
  #modal-landlord-report * { visibility: visible !important; }
  #modal-landlord-report {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
  }
  .lr-report {
    padding: 20px;
    max-width: 100%;
  }

  /* Page break handling */
  .claim-card, .lease-card, .equip-card, .position-list-item, .rpt-card {
    break-inside: avoid;
  }

  body {
    font-family: 'Inter', -apple-system, sans-serif !important;
    color: #000 !important;
    background: #fff !important;
  }

  /* Full width for report detail */
  #screen-farm-report-detail .sub-content,
  #screen-report-viewer .sub-content {
    background: #fff !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  /* Hide report center cards when printing report viewer */
  #screen-report-center { display: none !important; }
}

/* ─── Employee Detail View ─────────────────────────────────────────── */

.emp-detail-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 20px;
  padding: 16px;
  margin-bottom: 12px;
}
.emp-detail-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 0;
  border-bottom: 1px solid #f1f5f9;
  font-size: 14px;
}
.emp-detail-row:last-child { border-bottom: none; }
.emp-detail-label {
  color: #64748b;
  font-weight: 500;
}
.emp-detail-row a {
  color: #3b82f6;
  text-decoration: none;
}
.emp-detail-status-badge {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 600;
  text-transform: capitalize;
}
.emp-status-active { background: #dcfce7; color: #166534; }
.emp-status-inactive { background: #F1F5F9; color: #475569; }
.emp-status-terminated { background: #fee2e2; color: #991b1b; }

.emp-hours-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin: 12px 0;
}
.emp-hours-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 20px;
  padding: 14px;
  text-align: center;
}
.emp-hours-val {
  display: block;
  font-size: 22px;
  font-weight: 700;
  color: #1e293b;
}
.emp-hours-lbl {
  display: block;
  font-size: 12px;
  color: #64748b;
  margin-top: 2px;
}

.emp-history-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  margin-bottom: 6px;
  font-size: 13px;
}
.emp-history-row.has-gps { cursor: pointer; }
.emp-history-row.has-gps:active { background: #f8fafc; }
.emp-history-date { font-weight: 600; color: #1e293b; min-width: 80px; }
.emp-history-time { flex: 1; color: #475569; }
.emp-history-hrs { font-weight: 600; color: #1e293b; }
.emp-gps-pin { font-size: 14px; }
.emp-map-pin { background: none !important; border: none !important; }

/* ─── Clock GPS Status ─────────────────────────────────────────── */

.clock-gps-status {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  background: #f8fafc;
  border-radius: 8px;
  font-size: 13px;
  color: #64748b;
  margin-top: 8px;
}
.clock-gps-status.gps-acquired {
  background: #f0fdf4;
  color: #166534;
}
.gps-icon { font-size: 16px; }

/* ─── Task Cards ─────────────────────────────────────────────────── */

.task-filter-row {
  display: flex;
  gap: 6px;
  margin-bottom: 12px;
}
.task-filter-btn {
  padding: 6px 14px;
  border-radius: 20px;
  border: 1px solid #e2e8f0;
  background: #fff;
  font-size: 13px;
  font-weight: 500;
  color: #64748b;
  cursor: pointer;
}
.task-filter-btn.active {
  background: #1e293b;
  color: #fff;
  border-color: #1e293b;
}
.task-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 20px;
  padding: 14px;
  margin-bottom: 8px;
  cursor: pointer;
  transition: box-shadow 0.15s;
}
.task-card:active { box-shadow: 0 0 0 2px rgba(59,130,246,0.2); }
.task-card.task-completed { opacity: 0.6; }
.task-card-top {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.task-check {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  border: 2px solid #cbd5e1;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 700;
  color: #fff;
  cursor: pointer;
  flex-shrink: 0;
  margin-top: 2px;
}
.task-check.checked {
  background: #22c55e;
  border-color: #22c55e;
}
.task-card-body { flex: 1; }
.task-description {
  font-size: 14px;
  font-weight: 500;
  color: #1e293b;
  line-height: 1.4;
}
.task-completed .task-description {
  text-decoration: line-through;
  color: #94a3b8;
}
.task-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
}
.task-assignee, .task-field, .task-due {
  font-size: 11px;
  padding: 2px 8px;
  border-radius: 16px;
  background: #f1f5f9;
  color: #475569;
}
.task-due.overdue {
  background: #fef2f2;
  color: #dc2626;
  font-weight: 600;
}
.task-priority-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
  margin-top: 6px;
}
.task-priority-high { background: #ef4444; }
.task-priority-medium { background: #64748B; }
.task-priority-low { background: #94a3b8; }
.task-photo-indicator {
  font-size: 12px;
  margin-left: 34px;
}

/* ─── Employee Login Button ────────────────────────────────────── */

.employee-login-divider {
  position: relative;
  text-align: center;
  margin: 16px 0 12px;
  color: #94a3b8;
  font-size: 13px;
}
.employee-login-divider::before,
.employee-login-divider::after {
  content: '';
  position: absolute;
  top: 50%;
  width: 40%;
  height: 1px;
  background: #e2e8f0;
}
.employee-login-divider::before { left: 0; }
.employee-login-divider::after { right: 0; }
.employee-login-divider span {
  background: #fff;
  padding: 0 12px;
}
.btn-employee-login {
  width: 100%;
  padding: 12px;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  background: #f8fafc;
  color: #475569;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
}
.btn-employee-login:active { background: #f1f5f9; }
.employee-login-hint {
  font-size: 11px;
  color: #94a3b8;
  text-align: center;
  margin-top: 6px;
}

/* ─── Employee Mode: hide financial screens ───────────────────── */

body.employee-mode #screen-dashboard .dash-positions,
body.employee-mode #screen-dashboard .dash-prices,
body.employee-mode #screen-dashboard .dash-signals,
body.employee-mode #screen-positions,
body.employee-mode #screen-prices,
body.employee-mode #screen-plan,
body.employee-mode #screen-marketing-plan,
body.employee-mode #screen-leases,
body.employee-mode #screen-expenses,
body.employee-mode #screen-profit-calc,
body.employee-mode #screen-contract-detail {
  display: none !important;
}

/* ─── Spray Advisor ────────────────────────────────────────────────────── */
.spray-section { margin-bottom: 20px; }
.spray-label { font-weight: 600; font-size: 15px; color: #1e293b; margin-bottom: 8px; display: block; }
.spray-select { width: 100%; padding: 12px 14px; border: 1px solid #e2e8f0; border-radius: 16px; font-size: 15px; background: #fff; min-height: 44px; font-family: 'Inter', sans-serif; }
.spray-field-info { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 16px; padding: 12px 14px; margin-top: 8px; font-size: 13px; color: #475569; }
.spray-field-info div { margin-bottom: 2px; }
.spray-timing-tabs { display: flex; gap: 8px; }
.spray-tab { flex: 1; padding: 10px 8px; border: 1px solid #e2e8f0; border-radius: 16px; background: #fff; font-size: 13px; font-weight: 500; color: #64748b; cursor: pointer; text-align: center; min-height: 44px; font-family: 'Inter', sans-serif; transition: all 0.15s; }
.spray-tab.active { background: #16A34A; color: #fff; border-color: #16A34A; }
.spray-weed-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.spray-weed-item { display: flex; flex-direction: column; padding: 10px 12px; border: 1.5px solid #e2e8f0; border-radius: 16px; background: #fff; cursor: pointer; position: relative; transition: all 0.15s; min-height: 44px; }
.spray-weed-item:has(input:checked) { border-color: #16A34A; background: #f0fdf4; }
.spray-weed-item.weed-critical { border-left: 3px solid #dc2626; }
.spray-weed-item.weed-high { border-left: 3px solid #f97316; }
.spray-weed-item.weed-moderate { border-left: 3px solid #eab308; }
.spray-weed-cb { position: absolute; top: 10px; right: 10px; width: 18px; height: 18px; accent-color: #16A34A; }
.spray-weed-name { font-weight: 600; font-size: 13px; color: #1e293b; margin-bottom: 2px; padding-right: 24px; }
.spray-weed-sci { font-size: 11px; color: #94a3b8; font-style: italic; }
.spray-weed-season { font-size: 11px; color: #64748b; margin-top: 4px; }
.spray-generate-btn { width: 100%; margin: 16px 0; min-height: 48px; font-size: 16px; font-weight: 600; }
.spray-results { margin-top: 16px; }
.spray-warnings { background: #fefce8; border: 1px solid #fde047; border-radius: 16px; padding: 12px; margin-bottom: 16px; }
.spray-warning-item { font-size: 13px; color: #854d0e; padding: 4px 0; }
.spray-recs-header { font-weight: 700; font-size: 16px; color: #1e293b; margin-bottom: 12px; }
.spray-rec-card { border: 1px solid #e2e8f0; border-radius: 20px; padding: 14px; margin-bottom: 12px; background: #fff; }
.spray-rec-card.spray-rec-safe { border-left: 4px solid #16A34A; }
.spray-rec-card.spray-rec-danger { border-left: 4px solid #dc2626; background: #fef2f2; }
.spray-crop-kill { background: #dc2626; color: #fff; padding: 8px 12px; border-radius: 8px; font-weight: 700; font-size: 13px; margin-bottom: 10px; }
.spray-rec-name { font-weight: 700; font-size: 15px; color: #1e293b; }
.spray-rec-ai { font-size: 12px; color: #64748b; margin-top: 2px; }
.spray-rec-meta { display: flex; justify-content: space-between; margin-top: 8px; font-size: 13px; color: #475569; }
.spray-rec-cost { font-weight: 600; color: #16A34A; }
.spray-rec-controls { font-size: 12px; color: #64748b; margin-top: 6px; }
.spray-residual { margin-top: 8px; background: #f1f5f9; border-radius: 6px; height: 22px; position: relative; overflow: hidden; }
.spray-residual-bar { height: 100%; background: linear-gradient(90deg, #16A34A, #22C55E); border-radius: 6px; }
.spray-residual span { position: absolute; right: 8px; top: 3px; font-size: 11px; color: #475569; font-weight: 500; }
.spray-rec-warning { font-size: 12px; color: #b45309; margin-top: 6px; padding: 4px 0; }
.spray-rec-trait { font-size: 12px; color: #7c3aed; margin-top: 4px; font-weight: 500; }
.spray-cost-est { background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: 16px; padding: 12px 14px; margin-top: 16px; font-size: 14px; color: #166534; }
.spray-window-banner { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 20px; background: #f0fdf4; border: 1px solid #bbf7d0; margin-bottom: 20px; }
.spray-window-banner.spray-window-bad { background: #fef2f2; border-color: #fecaca; }
.spray-window-icon { font-size: 24px; }
.spray-window-text { font-size: 14px; color: #1e293b; }
.spray-window-text strong { display: block; margin-bottom: 2px; }
.spray-window-detail { font-size: 12px; color: #64748b; }
.spray-scout-card { border: 1px solid #e2e8f0; border-radius: 16px; padding: 12px; margin-bottom: 8px; background: #fff; }
.spray-scout-top { display: flex; justify-content: space-between; align-items: center; }
.spray-scout-pressure { font-size: 11px; font-weight: 700; }
.spray-scout-field { font-size: 12px; color: #64748b; margin-top: 4px; }
.spray-scout-notes { font-size: 13px; color: #475569; margin-top: 4px; }
.spray-scout-date { font-size: 11px; color: #94a3b8; margin-top: 6px; }
.spray-scout-photo { max-width: 100%; border-radius: 8px; margin-top: 8px; max-height: 200px; object-fit: cover; }

/* ─── Crop Health (NDVI Placeholder) ──────────────────────────────────── */
.crop-health-card { background: #fff; border: 1px solid var(--border); border-radius: 20px; padding: 14px 16px; margin-top: 12px; }
.crop-health-card h4 { font-size: 14px; font-weight: 700; color: var(--text-dark); margin: 0 0 10px; }
.crop-health-scale { position: relative; margin-bottom: 8px; }
.crop-health-bar { height: 10px; border-radius: 5px; background: linear-gradient(to right, #dc2626, #eab308, #22c55e); }
.crop-health-labels { display: flex; justify-content: space-between; font-size: 10px; color: var(--text-light); margin-top: 3px; }
.crop-health-status { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--text-medium); margin-top: 6px; }
.crop-health-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.crop-health-upsell { font-size: 11px; color: var(--text-light); margin-top: 8px; padding: 8px 10px; background: #f8fafc; border-radius: 8px; border: 1px dashed var(--border); }

/* ─── Rainfall Chart ─────────────────────────────────────────────────── */
.rainfall-section { background: #fff; border: 1px solid var(--border); border-radius: 20px; padding: 14px 16px; margin-top: 12px; }
.rainfall-section h4 { font-size: 14px; font-weight: 700; color: var(--text-dark); margin: 0 0 10px; }
.rain-chart { display: flex; align-items: flex-end; gap: 2px; height: 80px; background: #f8fafc; border-radius: 8px; padding: 6px 4px; }
.rain-bar-col { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; }
.rain-bar { width: 100%; min-width: 3px; border-radius: 2px 2px 0 0; transition: height 0.3s; }
.rain-stats { display: flex; gap: 8px; margin-top: 10px; }
.rain-stat { flex: 1; text-align: center; background: #f8fafc; border-radius: 8px; padding: 8px 4px; }
.rain-stat-value { font-size: 16px; font-weight: 700; color: var(--text-dark); }
.rain-stat-label { font-size: 10px; color: var(--text-light); margin-top: 2px; }
.rain-vs-normal { font-size: 12px; color: var(--text-medium); margin-top: 8px; text-align: center; }
.rain-alert { background: #eff6ff; border: 1px solid #bfdbfe; border-radius: 8px; padding: 8px 12px; margin-top: 8px; font-size: 12px; color: #1e40af; }
.rain-drought-alert { background: #fef2f2; border: 1px solid #fecaca; border-radius: 8px; padding: 8px 12px; margin-top: 8px; font-size: 12px; color: #991b1b; }

/* ─── Activity Timeline (Field Detail) ───────────────────────────────── */
.activity-timeline-section { background: #fff; border: 1px solid var(--border); border-radius: 20px; padding: 14px 16px; margin-top: 12px; }
.activity-timeline-section h4 { font-size: 14px; font-weight: 700; color: var(--text-dark); margin: 0 0 10px; }
.activity-tl-entry { display: flex; gap: 10px; padding: 10px 0; border-bottom: 1px solid #f1f5f9; }
.activity-tl-entry:last-child { border-bottom: none; }
.activity-tl-icon { width: 36px; height: 36px; border-radius: 50%; background: #f1f5f9; display: flex; align-items: center; justify-content: center; font-size: 18px; flex-shrink: 0; }
.activity-tl-content { flex: 1; min-width: 0; }
.activity-tl-header { display: flex; justify-content: space-between; align-items: center; }
.activity-tl-type { font-size: 13px; font-weight: 600; color: var(--text-dark); }
.activity-tl-date { font-size: 11px; color: var(--text-light); }
.activity-tl-inputs { font-size: 12px; color: var(--primary-green); font-weight: 500; margin-top: 2px; }
.activity-tl-meta { font-size: 11px; color: var(--text-light); margin-top: 2px; }
.activity-tl-notes { font-size: 12px; color: var(--text-medium); margin-top: 3px; }

/* ─── Activity Log Screen ────────────────────────────────────────────── */
.activity-filter-row { display: flex; gap: 6px; overflow-x: auto; padding: 0 0 10px; -webkit-overflow-scrolling: touch; }
.activity-filter-chip { display: inline-flex; align-items: center; gap: 4px; padding: 6px 12px; border-radius: 20px; border: 1px solid var(--border); background: #fff; font-size: 12px; font-weight: 500; color: var(--text-medium); cursor: pointer; white-space: nowrap; min-height: 32px; font-family: 'Inter', sans-serif; }
.activity-filter-chip.active { background: var(--primary-green); color: #fff; border-color: var(--primary-green); }
.activity-log-card { display: flex; gap: 10px; padding: 12px 14px; background: #fff; border: 1px solid var(--border); border-radius: 20px; margin-bottom: 8px; align-items: flex-start; }
.activity-log-icon { width: 40px; height: 40px; border-radius: 50%; background: #f1f5f9; display: flex; align-items: center; justify-content: center; font-size: 20px; flex-shrink: 0; }
.activity-log-info { flex: 1; min-width: 0; }
.activity-log-top { display: flex; justify-content: space-between; align-items: center; }
.activity-log-type { font-size: 14px; font-weight: 600; color: var(--text-dark); }
.activity-log-date { font-size: 12px; color: var(--text-light); }
.activity-log-field { font-size: 12px; color: var(--primary-green); font-weight: 500; margin-top: 2px; }
.activity-log-inputs { font-size: 12px; color: var(--text-medium); margin-top: 2px; }
.activity-log-meta { font-size: 11px; color: var(--text-light); margin-top: 2px; }
.activity-log-notes { font-size: 12px; color: var(--text-medium); margin-top: 3px; }
.activity-log-delete { background: none; border: none; color: var(--text-light); cursor: pointer; font-size: 14px; padding: 4px; min-width: 28px; min-height: 28px; }
.activity-log-delete:hover { color: #dc2626; }

/* ─── Leaflet Layer Control Override ─────────────────────────────────── */
.leaflet-control-layers { border-radius: 16px !important; border: 1px solid var(--border) !important; box-shadow: var(--shadow) !important; }
.leaflet-control-layers-toggle { width: 32px !important; height: 32px !important; }
.leaflet-control-layers label { font-size: 13px; font-family: 'Inter', sans-serif; }

/* ─── Rally Watch ──────────────────────────────────────────────────── */
/* ─── Price Probability (redesigned) ──────────────────────────────────── */

/* Summary card on dashboard */
.rp-summary-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 20px;
  padding: 20px;
  cursor: pointer;
  transition: all 0.15s;
}
.rp-summary-card:active { transform: scale(0.98); }
.rp-summary-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}
.rp-summary-title {
  font-size: 14px;
  font-weight: 700;
  color: var(--text-dark);
  font-family: 'Inter', sans-serif;
}
.rp-summary-badge {
  font-size: 11px;
  font-weight: 600;
  color: var(--primary-green);
  background: var(--light-green);
  padding: 3px 10px;
  border-radius: 12px;
}
.rp-summary-gauges {
  display: flex;
  justify-content: center;
  gap: 32px;
  margin-bottom: 14px;
}
.rp-gauge { text-align: center; }
.rp-gauge-ring {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: conic-gradient(var(--clr) calc(var(--pct) * 1%), var(--border) 0);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 6px;
}
.rp-gauge-value {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  font-weight: 800;
  color: var(--text-dark);
  font-family: 'Inter', sans-serif;
}
.rp-gauge-label {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-medium);
}
.rp-ratio-mini {
  text-align: center;
  font-size: 13px;
  color: var(--text-medium);
  margin-bottom: 8px;
}
.rp-summary-cta {
  text-align: center;
  font-size: 12px;
  font-weight: 600;
  color: var(--primary-green);
  margin-top: 4px;
}

/* Detail screen cards */
.rp-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 20px;
  padding: 20px;
  margin-bottom: 16px;
}
.rp-card-title {
  font-size: 16px;
  font-weight: 700;
  color: var(--text-dark);
  margin: 0 0 4px;
  font-family: 'Inter', sans-serif;
}
.rp-card-subtitle {
  font-size: 12px;
  color: var(--text-light);
  margin-bottom: 14px;
}

/* Probability tier bars */
.rp-tier-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 0;
  min-height: 44px;
  cursor: pointer;
  border-bottom: 1px solid var(--border-light);
}
.rp-tier-row:last-child { border-bottom: none; }
.rp-tier-row:active { background: var(--bg-alt); border-radius: 8px; }
.rp-tier-price {
  font-size: 14px;
  font-weight: 700;
  color: var(--text-dark);
  min-width: 55px;
  font-family: 'Inter', sans-serif;
}
.rp-tier-bar-track {
  flex: 1;
  height: 10px;
  background: var(--border-light);
  border-radius: 5px;
  overflow: hidden;
}
.rp-tier-bar-fill {
  height: 100%;
  border-radius: 5px;
  width: 0;
  transition: width 0.8s ease-out;
  transition-delay: var(--delay, 0ms);
}
.rp-tier-pct {
  font-size: 14px;
  font-weight: 700;
  min-width: 40px;
  text-align: right;
  font-family: 'Inter', sans-serif;
}

/* Ratio gauge */
.rp-ratio-gauge { text-align: center; margin-bottom: 16px; }
.rp-ratio-big {
  font-size: 48px;
  font-weight: 800;
  color: var(--text-dark);
  line-height: 1;
  font-family: 'Inter', sans-serif;
}
.rp-ratio-interp {
  font-size: 13px;
  color: var(--text-medium);
  margin-top: 4px;
}
.rp-ratio-scale { margin-top: 12px; }
.rp-ratio-scale-track {
  height: 8px;
  background: linear-gradient(90deg, #16A34A 0%, #E2E8F0 50%, #2563EB 100%);
  border-radius: 4px;
  position: relative;
  margin-bottom: 6px;
}
.rp-ratio-scale-marker {
  position: absolute;
  top: -4px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 2px solid var(--white);
  box-shadow: 0 1px 3px rgba(0,0,0,0.2);
  transform: translateX(-50%);
}
.rp-ratio-cur { background: var(--primary-green); }
.rp-ratio-avg { background: var(--text-light); }
.rp-ratio-scale-labels {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  color: var(--text-light);
}
.rp-ratio-scale-legend {
  display: flex;
  gap: 16px;
  justify-content: center;
  margin-top: 8px;
  font-size: 11px;
  color: var(--text-light);
}
.rp-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-right: 4px;
  vertical-align: middle;
}

/* Correlated table */
.rp-corr-table { margin-top: 8px; }
.rp-corr-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 0;
  font-size: 14px;
  border-bottom: 1px solid var(--border-light);
}
.rp-corr-row:last-child { border-bottom: none; }
.rp-corr-corn { font-weight: 700; color: var(--text-dark); min-width: 80px; }
.rp-corr-arrow { color: var(--text-light); }
.rp-corr-range { color: var(--text-medium); }

/* Factors */
.rp-factor {
  padding: 10px 0;
  border-bottom: 1px solid var(--border-light);
}
.rp-factor:last-child { border-bottom: none; }
.rp-factor-header {
  display: flex;
  justify-content: space-between;
  font-size: 13px;
  font-weight: 600;
  color: var(--text-dark);
  margin-bottom: 6px;
}
.rp-factor-score { color: var(--primary-green); }
.rp-factor-bar {
  height: 6px;
  background: var(--border-light);
  border-radius: 3px;
  overflow: hidden;
  margin-bottom: 4px;
}
.rp-factor-fill {
  height: 100%;
  background: var(--primary-green);
  border-radius: 3px;
  width: 0;
  transition: width 0.6s ease-out;
}
.rp-factor-expl {
  font-size: 12px;
  color: var(--text-light);
  line-height: 1.4;
}

/* Scenarios */
.rp-scenario {
  padding: 12px 0;
  border-bottom: 1px solid var(--border-light);
}
.rp-scenario:last-child { border-bottom: none; }
.rp-scenario-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 4px;
}
.rp-scenario-name { font-size: 14px; font-weight: 600; color: var(--text-dark); }
.rp-scenario-pct {
  font-size: 13px;
  font-weight: 700;
  color: var(--primary-green);
  background: var(--light-green);
  padding: 2px 8px;
  border-radius: 10px;
}
.rp-scenario-prices { font-size: 13px; color: var(--text-medium); }

/* Parallels */
.rp-parallel {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 0;
  font-size: 13px;
  border-bottom: 1px solid var(--border-light);
}
.rp-parallel:last-child { border-bottom: none; }
.rp-parallel-year { font-weight: 700; min-width: 36px; color: var(--text-dark); }
.rp-parallel-bar {
  flex: 1;
  height: 6px;
  background: var(--border-light);
  border-radius: 3px;
  overflow: hidden;
}
.rp-parallel-fill {
  height: 100%;
  background: var(--primary-green);
  border-radius: 3px;
}
.rp-parallel-pct { min-width: 30px; text-align: right; color: var(--text-medium); }
.rp-parallel-result { min-width: 20px; text-align: center; }

/* Cycle */
.rp-cycle-row {
  display: flex;
  justify-content: space-between;
  padding: 8px 0;
  font-size: 14px;
  border-bottom: 1px solid var(--border-light);
}
.rp-cycle-row:last-child { border-bottom: none; }
.rp-cycle-row span:first-child { color: var(--text-light); }
.rp-cycle-row span:last-child { font-weight: 600; color: var(--text-dark); }

/* Tier detail modal */
.rp-tier-detail-section {
  margin-bottom: 16px;
}
.rp-tier-detail-section h4 {
  font-size: 14px;
  font-weight: 700;
  color: var(--text-dark);
  margin: 0 0 6px;
}
.rp-tier-detail-section p {
  font-size: 14px;
  color: var(--text-medium);
  line-height: 1.5;
  margin: 0;
}

/* Disclaimer */
.rp-disclaimer {
  font-size: 11px;
  color: var(--text-light);
  text-align: center;
  padding: 16px 20px;
  line-height: 1.5;
  font-style: italic;
}

/* ─── Spread & Seasonal Analysis ─────────────────────────────────────── */
.spread-seasonal-wrap {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.seasonal-insight {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 14px;
}
.seasonal-insight-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}
.seasonal-insight-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-dark);
}
.seasonal-row {
  display: flex;
  gap: 8px;
  padding: 6px 0;
  font-size: 13px;
  color: var(--text-mid);
  border-bottom: 1px solid #F1F5F9;
}
.seasonal-row:last-child { border-bottom: none; }
.seasonal-emoji {
  font-weight: 600;
  color: var(--text-dark);
  min-width: 48px;
}
.seasonal-text { flex: 1; }
.seasonal-best {
  font-size: 12px;
  color: var(--text-light);
  margin-top: 8px;
}
.seasonal-best strong {
  color: var(--primary-green);
}
.seasonal-heatmap {
  margin-top: 10px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.seasonal-heatmap-row {
  display: flex;
  align-items: center;
  gap: 2px;
}
.seasonal-heatmap-label {
  font-size: 11px;
  font-weight: 600;
  color: var(--text-light);
  width: 36px;
  text-align: right;
  padding-right: 4px;
}
.seasonal-heatmap-cell {
  flex: 1;
  text-align: center;
  font-size: 10px;
  font-weight: 600;
  color: #fff;
  padding: 3px 0;
  border-radius: 3px;
  min-width: 18px;
}
.seasonal-heatmap-cell.current {
  outline: 2px solid var(--text-dark);
  outline-offset: -1px;
}
.spread-analysis {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 14px;
}
.spread-analysis-header {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-dark);
  margin-bottom: 10px;
}
.spread-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 0;
}
.spread-label {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-dark);
  min-width: 42px;
}
.spread-prices {
  flex: 1;
  font-size: 12px;
  color: var(--text-light);
}
.spread-value {
  font-size: 14px;
  font-weight: 700;
  font-family: 'Inter', sans-serif;
}
.spread-desc {
  font-size: 12px;
  color: var(--text-mid);
  padding: 0 0 8px;
  border-bottom: 1px solid #F1F5F9;
}
.spread-desc:last-child { border-bottom: none; }

/* ─── Work Orders ─────────────────────────────────────────────────────── */
.wo-filter-tabs {
  display: flex;
  gap: 8px;
  padding: 0 0 12px;
}
.wo-tab {
  flex: 1;
  padding: 10px 18px;
  border-radius: 20px;
  border: 1px solid var(--border);
  background: var(--white);
  font-size: 13px;
  font-weight: 600;
  font-family: 'Inter', sans-serif;
  color: var(--text-medium);
  cursor: pointer;
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.wo-tab.active {
  background: var(--primary-green);
  color: var(--white);
  border-color: var(--primary-green);
}

.wo-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 14px 16px;
  margin-bottom: 10px;
  cursor: pointer;
}
.wo-card:active { opacity: 0.9; }
.wo-card-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}
.wo-card-icon { font-size: 18px; }
.wo-card-title { flex: 1; font-size: 15px; font-weight: 600; color: var(--text-dark); }
.wo-priority-badge {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--white);
  padding: 3px 8px;
  border-radius: 8px;
  letter-spacing: 0.5px;
}
.wo-card-meta {
  display: flex;
  gap: 12px;
  font-size: 12px;
  color: var(--text-light);
  flex-wrap: wrap;
}
.wo-card-status {
  font-size: 12px;
  font-weight: 600;
  margin-top: 6px;
  text-transform: capitalize;
}
.wo-card-status.status-open { color: var(--primary-green); }
.wo-card-status.status-in-progress { color: #2563EB; }
.wo-card-status.status-done { color: var(--text-light); }

.wo-detail h3 { font-size: 18px; font-weight: 700; margin-bottom: 16px; }
.wo-detail-row {
  display: flex;
  justify-content: space-between;
  padding: 8px 0;
  font-size: 14px;
  border-bottom: 1px solid var(--border-light);
}
.wo-detail-row span:first-child { color: var(--text-light); }
.wo-detail-row span:last-child { font-weight: 600; color: var(--text-dark); }
.wo-detail-desc {
  font-size: 14px;
  color: var(--text-medium);
  padding: 12px 0;
  line-height: 1.5;
  border-bottom: 1px solid var(--border-light);
}

/* ─── Field Notes ─────────────────────────────────────────────────────── */
.fn-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 14px 16px;
  margin-bottom: 10px;
}
.fn-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 6px;
}
.fn-card-badge {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-medium);
  background: var(--bg-alt);
  padding: 3px 10px;
  border-radius: 12px;
}
.fn-card-date {
  font-size: 12px;
  color: var(--text-light);
}
.fn-card-field {
  font-size: 12px;
  color: var(--text-light);
  margin-bottom: 6px;
}
.fn-card-text {
  font-size: 14px;
  color: var(--text-dark);
  line-height: 1.5;
}

/* ─── Accounting System ──────────────────────────────────────────────────── */
.acct-tab {
  flex-shrink: 0;
  padding: 8px 14px;
  border-radius: 20px;
  border: 1px solid #E2E8F0;
  background: #fff;
  color: #64748B;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.15s;
  min-height: 44px;
  display: flex;
  align-items: center;
  font-family: 'Inter', -apple-system, sans-serif;
}
.acct-tab.active {
  background: #111;
  color: #fff;
  border-color: #111;
}
.acct-summary-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 16px;
}
.acct-card {
  background: #fff;
  border-radius: 16px;
  padding: 16px;
  border: 1px solid #E2E8F0;
}
.acct-card-label {
  font-size: 12px;
  color: #94A3B8;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 4px;
}
.acct-card-value {
  font-size: 22px;
  font-weight: 700;
  color: #0F172A;
  font-family: 'Inter', -apple-system, sans-serif;
}
.acct-card-value.positive { color: #16A34A; }
.acct-card-value.negative { color: #DC2626; }
.acct-card-sub {
  font-size: 12px;
  color: #94A3B8;
  margin-top: 2px;
}
.acct-card-wide {
  grid-column: 1 / -1;
}
.acct-section {
  background: #fff;
  border-radius: 16px;
  border: 1px solid #E2E8F0;
  margin-bottom: 12px;
  overflow: hidden;
}
.acct-section-header {
  padding: 14px 16px;
  font-size: 14px;
  font-weight: 600;
  color: #0F172A;
  border-bottom: 1px solid #F1F5F9;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.acct-row {
  padding: 10px 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #F8FAFC;
  font-size: 14px;
  min-height: 44px;
}
.acct-row:last-child { border-bottom: none; }
.acct-row-label {
  color: #475569;
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.acct-row-value {
  font-weight: 600;
  color: #0F172A;
  flex-shrink: 0;
  margin-left: 12px;
}
.acct-row-sub {
  font-size: 12px;
  color: #94A3B8;
}
.acct-bar-row {
  padding: 8px 16px;
  border-bottom: 1px solid #F8FAFC;
}
.acct-bar-labels {
  display: flex;
  justify-content: space-between;
  font-size: 13px;
  margin-bottom: 4px;
}
.acct-bar-track {
  height: 8px;
  background: #F1F5F9;
  border-radius: 4px;
  overflow: hidden;
}
.acct-bar-fill {
  height: 100%;
  border-radius: 4px;
  transition: width 0.3s;
}
.acct-bar-fill.green { background: #16A34A; }
.acct-bar-fill.yellow { background: #EAB308; }
.acct-bar-fill.red { background: #DC2626; }
.acct-bar-fill.blue { background: #3B82F6; }
.acct-month-chart {
  display: flex;
  align-items: flex-end;
  gap: 3px;
  height: 100px;
  padding: 12px 16px;
}
.acct-month-bar-group {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}
.acct-month-bars {
  display: flex;
  gap: 1px;
  align-items: flex-end;
  width: 100%;
  height: 80px;
}
.acct-month-bar {
  flex: 1;
  border-radius: 2px 2px 0 0;
  min-height: 1px;
}
.acct-month-bar.income { background: #16A34A; }
.acct-month-bar.expense { background: #E2E8F0; }
.acct-month-label {
  font-size: 10px;
  color: #94A3B8;
}
.acct-income-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 16px;
  border-bottom: 1px solid #F1F5F9;
  min-height: 44px;
}
.acct-income-item:last-child { border-bottom: none; }
.acct-income-left {
  flex: 1;
  min-width: 0;
}
.acct-income-desc {
  font-size: 14px;
  color: #0F172A;
  font-weight: 500;
}
.acct-income-meta {
  font-size: 12px;
  color: #94A3B8;
  margin-top: 2px;
}
.acct-income-amount {
  font-size: 16px;
  font-weight: 600;
  color: #16A34A;
  flex-shrink: 0;
  margin-left: 12px;
}
.acct-field-card {
  background: #fff;
  border-radius: 16px;
  border: 1px solid #E2E8F0;
  padding: 16px;
  margin-bottom: 10px;
}
.acct-field-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 8px;
}
.acct-field-name {
  font-size: 16px;
  font-weight: 600;
  color: #0F172A;
}
.acct-field-net {
  font-size: 18px;
  font-weight: 700;
}
.acct-field-metrics {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 8px;
  margin-bottom: 10px;
}
.acct-field-metric {
  text-align: center;
}
.acct-field-metric-label {
  font-size: 11px;
  color: #94A3B8;
  text-transform: uppercase;
}
.acct-field-metric-value {
  font-size: 14px;
  font-weight: 600;
  color: #0F172A;
}
.acct-cf-row {
  display: grid;
  grid-template-columns: 50px 1fr 1fr 1fr;
  gap: 8px;
  padding: 8px 12px;
  font-size: 13px;
  border-bottom: 1px solid #F8FAFC;
  align-items: center;
}
.acct-cf-row.header {
  font-weight: 600;
  color: #64748B;
  font-size: 11px;
  text-transform: uppercase;
}
.acct-cf-tight {
  background: #FEF2F2;
}
.acct-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 10px;
  font-size: 11px;
  font-weight: 600;
}
.acct-badge.over { background: #FEE2E2; color: #DC2626; }
.acct-badge.under { background: #DCFCE7; color: #16A34A; }
.acct-badge.at { background: #F1F5F9; color: #64748B; }
.acct-reconcile-btn {
  width: 28px;
  height: 28px;
  border-radius: 6px;
  border: 2px solid #CBD5E1;
  background: #fff;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  flex-shrink: 0;
}
.acct-reconcile-btn.reconciled {
  background: #16A34A;
  border-color: #16A34A;
  color: #fff;
}
.acct-add-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  padding: 12px;
  border-radius: 12px;
  border: 2px dashed #CBD5E1;
  background: #fff;
  color: #64748B;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  min-height: 44px;
  margin-bottom: 12px;
  transition: all 0.15s;
}
.acct-add-btn:active { background: #F8FAFC; }
.acct-sf-line {
  display: flex;
  justify-content: space-between;
  padding: 8px 16px;
  border-bottom: 1px solid #F8FAFC;
  font-size: 14px;
  min-height: 40px;
  align-items: center;
}
.acct-sf-line-num {
  color: #94A3B8;
  font-size: 12px;
  width: 60px;
  flex-shrink: 0;
}
.acct-sf-line-name {
  flex: 1;
  color: #475569;
}
.acct-sf-line-amount {
  font-weight: 600;
  color: #0F172A;
  flex-shrink: 0;
  margin-left: 12px;
}
.acct-sf-total {
  display: flex;
  justify-content: space-between;
  padding: 12px 16px;
  font-size: 15px;
  font-weight: 700;
  background: #F8FAFC;
  border-top: 2px solid #E2E8F0;
}

/* ─── FSA Deadlines ───────────────────────────────────────────────────── */
.dl-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 16px;
  margin-bottom: 12px;
  border-left: 4px solid var(--primary-green);
}
.dl-card.dl-critical { border-left-color: #DC2626; }
.dl-card.dl-warning { border-left-color: #CA8A04; }
.dl-card.dl-ok { border-left-color: var(--primary-green); }
.dl-card.dl-past { border-left-color: var(--text-light); opacity: 0.6; }
.dl-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}
.dl-countdown {
  font-size: 14px;
  font-weight: 700;
  font-family: 'Inter', sans-serif;
}
.dl-critical .dl-countdown { color: #DC2626; }
.dl-warning .dl-countdown { color: #CA8A04; }
.dl-ok .dl-countdown { color: var(--primary-green); }
.dl-date {
  font-size: 12px;
  color: var(--text-light);
}
.dl-title {
  font-size: 16px;
  font-weight: 700;
  color: var(--text-dark);
  margin-bottom: 6px;
}
.dl-desc {
  font-size: 13px;
  color: var(--text-medium);
  line-height: 1.5;
  margin-bottom: 8px;
}
.dl-actions {
  font-size: 12px;
  color: var(--text-medium);
  background: var(--bg-alt);
  padding: 10px 12px;
  border-radius: 8px;
  line-height: 1.5;
}

/* ─── Weekly Digests ──────────────────────────────────────────────────── */
.digest-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  margin-bottom: 12px;
  overflow: hidden;
}
.digest-header {
  padding: 12px 16px;
  background: var(--bg-alt);
  font-size: 13px;
  font-weight: 700;
  color: var(--text-dark);
  border-bottom: 1px solid var(--border);
  font-family: 'Inter', sans-serif;
}
.digest-body {
  padding: 14px 16px;
  font-size: 14px;
  line-height: 1.7;
  color: var(--text-dark);
  font-family: 'Inter', sans-serif;
}

/* ─── USDA Bids ───────────────────────────────────────────────────────── */
.usda-region-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  margin-bottom: 12px;
  overflow: hidden;
}
.usda-region-title {
  padding: 12px 16px;
  background: var(--bg-alt);
  font-size: 14px;
  font-weight: 700;
  color: var(--text-dark);
  border-bottom: 1px solid var(--border);
  font-family: 'Inter', sans-serif;
}
.usda-bid-row {
  display: flex;
  align-items: center;
  padding: 10px 16px;
  border-bottom: 1px solid var(--border-light);
  font-size: 14px;
}
.usda-bid-row:last-child { border-bottom: none; }
.usda-bid-commodity {
  flex: 1;
  font-weight: 600;
  color: var(--text-dark);
  text-transform: capitalize;
}
.usda-bid-price {
  font-weight: 700;
  color: var(--primary-green);
  margin-right: 16px;
}
.usda-bid-basis {
  font-size: 13px;
  color: var(--text-light);
  min-width: 50px;
  text-align: right;
}
.usda-source {
  text-align: center;
  font-size: 11px;
  color: var(--text-light);
  padding: 12px;
  font-style: italic;
}

/* ─── Cost of Production Benchmarking ─────────────────────────────────────── */
.cop-summary-card {
  background: #fff;
  border-radius: 16px;
  border: 1px solid #E2E8F0;
  padding: 20px;
  margin-bottom: 12px;
}
.cop-summary-title {
  font-size: 11px;
  font-weight: 600;
  color: #94A3B8;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 12px;
}
.cop-summary-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}
.cop-summary-crop {
  font-size: 16px;
  font-weight: 700;
  color: #0F172A;
}
.cop-summary-value {
  font-size: 24px;
  font-weight: 700;
  color: #0F172A;
  font-family: 'Inter', -apple-system, sans-serif;
}
.cop-summary-compare {
  font-size: 13px;
  font-weight: 600;
  margin-top: 6px;
  text-align: right;
}
.cop-breakeven-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid #F1F5F9;
  font-size: 14px;
  color: #0F172A;
}
.cop-section {
  margin-bottom: 16px;
}
.cop-section-title {
  font-size: 11px;
  font-weight: 600;
  color: #94A3B8;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 8px;
}
.cop-cat-card {
  background: #fff;
  border-radius: 14px;
  border: 1px solid #E2E8F0;
  padding: 14px 16px;
  margin-bottom: 8px;
}
.cop-cat-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}
.cop-cat-label {
  font-size: 14px;
  font-weight: 600;
  color: #0F172A;
}
.cop-cat-value {
  font-size: 16px;
  font-weight: 700;
  color: #0F172A;
  font-family: 'Inter', -apple-system, sans-serif;
}
.cop-cat-compare {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: #64748B;
  margin-bottom: 10px;
}
.cop-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 10px;
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
}
.cop-range-bar-wrap {
  position: relative;
}
.cop-range-bar {
  position: relative;
  height: 8px;
  background: #F1F5F9;
  border-radius: 4px;
  overflow: visible;
}
.cop-range-fill {
  height: 100%;
  border-radius: 4px;
  transition: width 0.3s ease;
}
.cop-range-avg-marker {
  position: absolute;
  top: -3px;
  width: 2px;
  height: 14px;
  background: #0F172A;
  border-radius: 1px;
  transform: translateX(-50%);
}
.cop-range-labels {
  display: flex;
  justify-content: space-between;
  font-size: 10px;
  color: #94A3B8;
  margin-top: 4px;
  position: relative;
}
.cop-range-labels span:nth-child(2) {
  position: absolute;
  transform: translateX(-50%);
}
.cop-trend-card {
  background: #fff;
  border-radius: 14px;
  border: 1px solid #E2E8F0;
  padding: 14px 16px;
  margin-bottom: 8px;
}
.cop-trend-label {
  font-size: 13px;
  font-weight: 600;
  color: #0F172A;
  margin-bottom: 10px;
}
.cop-trend-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 3px;
}
.cop-trend-year {
  font-size: 11px;
  color: #64748B;
  width: 32px;
  flex-shrink: 0;
  text-align: right;
}
.cop-trend-bar-wrap {
  flex: 1;
  height: 10px;
  background: #F8FAFC;
  border-radius: 5px;
  overflow: hidden;
}
.cop-trend-bar {
  height: 100%;
  border-radius: 5px;
  transition: width 0.3s ease;
}
.cop-trend-val {
  font-size: 11px;
  color: #0F172A;
  font-weight: 600;
  width: 44px;
  flex-shrink: 0;
  text-align: right;
  font-family: 'Inter', -apple-system, sans-serif;
}
.cop-field-card {
  background: #fff;
  border-radius: 14px;
  border: 1px solid #E2E8F0;
  padding: 14px 16px;
  margin-bottom: 8px;
}
.cop-field-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.cop-field-name {
  font-size: 14px;
  font-weight: 600;
  color: #0F172A;
}
.cop-field-value {
  font-size: 16px;
  font-weight: 700;
  font-family: 'Inter', -apple-system, sans-serif;
}
.cop-field-meta {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  color: #64748B;
  margin-top: 4px;
}
.cop-field-alert {
  background: #FEE2E2;
  color: #DC2626;
  font-size: 12px;
  font-weight: 500;
  padding: 6px 10px;
  border-radius: 8px;
  margin-top: 8px;
}
.cop-whatif-card {
  background: #fff;
  border-radius: 14px;
  border: 1px solid #E2E8F0;
  padding: 16px;
}
.cop-whatif-output {
  background: #F8FAFC;
  border-radius: 10px;
  padding: 12px;
}
.cop-whatif-line {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 13px;
  color: #0F172A;
  padding: 4px 0;
}
.cop-whatif-line + .cop-whatif-line {
  border-top: 1px solid #E2E8F0;
}
/* Inline benchmark badge for expense entry */
.cop-inline-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  font-weight: 500;
  padding: 3px 10px;
  border-radius: 10px;
  margin-top: 4px;
}
.cop-inline-badge.above { background: #FEE2E2; color: #DC2626; }
.cop-inline-badge.below { background: #F0FDF4; color: #16A34A; }
.cop-inline-badge.near  { background: #F1F5F9; color: #64748B; }

/* ─── Bin Management Extended ─────────────────────────────────────────── */
.bin-action-bar {
  display: flex;
  gap: 8px;
  margin-bottom: 16px;
}
.bin-action-btn {
  flex: 1;
  padding: 12px 8px;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  font-size: 13px;
  font-weight: 600;
  font-family: 'Inter', sans-serif;
  color: var(--text-dark);
  cursor: pointer;
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  transition: all 0.15s;
}
.bin-action-btn:active { transform: scale(0.97); background: var(--bg-alt); }

/* Dryer Calculator Results */
.dryer-result-card {
  background: var(--bg-alt);
  border-radius: var(--radius);
  padding: 16px;
}
.dryer-result-row {
  display: flex;
  justify-content: space-between;
  padding: 8px 0;
  font-size: 14px;
  border-bottom: 1px solid var(--border-light);
}
.dryer-result-row:last-of-type { border-bottom: none; }
.dryer-result-row span { color: var(--text-medium); }
.dryer-result-row strong { color: var(--text-dark); }
.dryer-recommendation {
  text-align: center;
  font-size: 16px;
  font-weight: 700;
  padding: 12px 0 0;
  font-family: 'Inter', sans-serif;
}

/* Inventory Modal */
.inv-hero {
  text-align: center;
  padding: 16px 0;
}
.inv-big {
  font-size: 36px;
  font-weight: 800;
  color: var(--text-dark);
  font-family: 'Inter', sans-serif;
}
.inv-label {
  font-size: 14px;
  color: var(--text-light);
  margin-top: 4px;
}
.inv-stats {
  display: flex;
  gap: 8px;
  margin-bottom: 16px;
}
.inv-stat {
  flex: 1;
  text-align: center;
  background: var(--bg-alt);
  border-radius: var(--radius-sm);
  padding: 12px 8px;
}
.inv-stat-val {
  font-size: 16px;
  font-weight: 700;
  color: var(--text-dark);
  font-family: 'Inter', sans-serif;
}
.inv-stat-lbl {
  font-size: 11px;
  color: var(--text-light);
  margin-top: 2px;
}
.inv-comm-row {
  display: flex;
  justify-content: space-between;
  padding: 10px 0;
  font-size: 14px;
  border-bottom: 1px solid var(--border-light);
}
.inv-comm-row:last-child { border-bottom: none; }
.inv-comm-row span:first-child { text-transform: capitalize; font-weight: 600; color: var(--text-dark); }
.inv-comm-row span:last-child { color: var(--text-medium); }

/* ─── FSA Urgent Banner ───────────────────────────────────────────────── */
.fsa-banner {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  margin: 0 16px 8px;
  border-radius: var(--radius);
  cursor: pointer;
  min-height: 44px;
  font-family: 'Inter', sans-serif;
  transition: all 0.15s;
}
.fsa-banner:active { transform: scale(0.98); }
.fsa-banner-red {
  background: #FEE2E2;
  border: 1px solid #FECACA;
  color: #991B1B;
}
.fsa-banner-yellow {
  background: #FEF9C3;
  border: 1px solid #FDE68A;
  color: #92400E;
}
.fsa-banner-days {
  font-size: 13px;
  font-weight: 800;
  min-width: 50px;
}
.fsa-banner-text {
  flex: 1;
  font-size: 13px;
  font-weight: 600;
}
.fsa-banner-arrow {
  font-size: 16px;
  font-weight: 700;
}

/* ─── This Week in Ag Cards ───────────────────────────────────────────── */
.ag-content-scroll {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  padding: 0 0 8px;
  scroll-snap-type: x mandatory;
}
.ag-content-scroll::-webkit-scrollbar { display: none; }
.ag-card {
  flex-shrink: 0;
  width: 200px;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 14px;
  text-decoration: none;
  color: inherit;
  scroll-snap-align: start;
  transition: all 0.15s;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ag-card:active { transform: scale(0.97); }
.ag-card-cat {
  font-size: 11px;
  font-weight: 600;
  color: var(--primary-green);
  text-transform: capitalize;
}
.ag-card-title {
  font-size: 13px;
  font-weight: 700;
  color: var(--text-dark);
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.ag-card-meta {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  color: var(--text-light);
  margin-top: auto;
}
.ag-card-source { font-weight: 600; }
.ag-card-dur { color: var(--text-muted); }

/* ─── Bin Management v2 ──────────────────────────────────────────────────── */

/* Summary grid */
.bm-summary-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  background: var(--card-bg);
  border-radius: var(--radius-sm);
  padding: 16px;
  box-shadow: var(--shadow);
}
.bm-summary-item { text-align: center; }
.bm-summary-val {
  font-size: 18px;
  font-weight: 700;
  color: var(--text-dark);
}
.bm-summary-lbl {
  font-size: 11px;
  color: var(--text-light);
  margin-top: 2px;
}

/* Bin card with SVG visual */
.bm-bin-card {
  background: var(--card-bg);
  border-radius: var(--radius-sm);
  padding: 14px;
  margin-bottom: 10px;
  box-shadow: var(--shadow);
  display: flex;
  gap: 14px;
  align-items: flex-start;
  position: relative;
  cursor: pointer;
}
.bm-bin-visual {
  width: 56px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.bin-svg-visual {
  width: 56px;
  height: 80px;
}
.bm-bin-pct {
  font-size: 13px;
  font-weight: 700;
  color: var(--text-dark);
  margin-top: 4px;
  text-align: center;
}
.bm-bin-info { flex: 1; min-width: 0; }
.bm-bin-name {
  font-size: 16px;
  font-weight: 700;
  color: var(--text-dark);
  margin-bottom: 2px;
}
.bm-bin-commodity {
  font-size: 13px;
  color: var(--text-medium);
  margin-bottom: 8px;
}

/* Fill bar */
.bm-bin-fill-bar { margin-bottom: 6px; }
.bm-fill-track {
  width: 100%;
  height: 8px;
  background: #F1F5F9;
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: 4px;
}
.bm-fill-bar-inner {
  height: 100%;
  border-radius: 4px;
  background: linear-gradient(90deg, #22C55E 0%, #16A34A 100%);
  transition: width 0.5s ease;
}
.bm-fill-bar-inner.level-high {
  background: linear-gradient(90deg, #94A3B8 0%, #64748B 100%);
}
.bm-fill-bar-inner.level-full {
  background: linear-gradient(90deg, #EF4444 0%, #DC2626 100%);
}
.bm-fill-text {
  font-size: 12px;
  color: var(--text-medium);
  font-weight: 500;
}

/* Bin detail tags */
.bm-bin-details {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 4px;
}
.bm-bin-details span {
  font-size: 12px;
  padding: 2px 8px;
  background: #F8FAFC;
  border-radius: 4px;
  color: var(--text-medium);
  border: 1px solid #E2E8F0;
}
.bm-bin-value {
  font-size: 15px;
  font-weight: 700;
  color: #16A34A;
  margin-top: 4px;
}

/* Moisture classes */
.moisture-ok { color: #16A34A !important; font-weight: 600; }
.moisture-warn { color: #CA8A04 !important; font-weight: 700; }
.moisture-danger { color: #DC2626 !important; font-weight: 700; }

/* Bin actions */
.bm-bin-actions {
  position: absolute;
  top: 10px;
  right: 10px;
  display: flex;
  gap: 4px;
}
.bm-icon-btn {
  background: none;
  border: none;
  font-size: 14px;
  cursor: pointer;
  padding: 4px;
  opacity: 0.5;
  min-width: 32px;
  min-height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.bm-icon-btn:hover { opacity: 1; }

/* Per-bin buttons */
.bm-bin-btns {
  display: flex;
  gap: 8px;
  margin: -4px 0 12px;
  padding: 0 4px;
}
.bm-btn-load, .bm-btn-outload {
  flex: 1;
  padding: 10px 0;
  border: none;
  border-radius: var(--radius-sm);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  min-height: 44px;
}
.bm-btn-load {
  background: var(--primary-green);
  color: #fff;
}
.bm-btn-outload {
  background: #fff;
  color: var(--text-dark);
  border: 1px solid #E2E8F0;
}

/* ─── Dryer Calculator v2 ────────────────────────────────────────────────── */
.bm-section-header {
  font-size: 14px;
  font-weight: 700;
  color: var(--text-dark);
  margin-bottom: 10px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.bm-dryer-result {
  background: #F8FAFC;
  border-radius: var(--radius-sm);
  padding: 16px;
  border: 1px solid #E2E8F0;
}
.bm-rec-badge {
  display: inline-block;
  padding: 8px 24px;
  border-radius: 8px;
  font-size: 20px;
  font-weight: 800;
  letter-spacing: 1px;
  margin-bottom: 10px;
}
.bm-rec-dry {
  background: #DCFCE7;
  color: #16A34A;
  border: 2px solid #22C55E;
}
.bm-rec-wet {
  background: #FEF2F2;
  color: #DC2626;
  border: 2px solid #EF4444;
}
.bm-rec-reasoning {
  font-size: 13px;
  color: var(--text-medium);
  margin-bottom: 16px;
  line-height: 1.5;
}
.bm-dryer-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.bm-dryer-stat {
  text-align: center;
  background: #fff;
  padding: 10px;
  border-radius: 8px;
  border: 1px solid #E2E8F0;
}
.bm-ds-val {
  font-size: 18px;
  font-weight: 700;
  color: var(--text-dark);
}
.bm-ds-lbl {
  font-size: 11px;
  color: var(--text-light);
  margin-top: 2px;
}

/* ─── Auger Flow Tracker ─────────────────────────────────────────────────── */
.bm-auger-card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px;
  background: #F8FAFC;
  border-radius: 8px;
  margin-bottom: 8px;
  border: 1px solid #E2E8F0;
}
.bm-auger-info { flex: 1; }
.bm-auger-info strong {
  display: block;
  font-size: 15px;
  color: var(--text-dark);
}
.bm-auger-info span {
  font-size: 12px;
  color: var(--text-light);
}
.bm-auger-actions { display: flex; gap: 4px; }

/* Timer display */
.bm-timer-display {
  text-align: center;
  padding: 20px;
  background: #0F172A;
  border-radius: 12px;
  margin: 12px 0;
}
.bm-timer-time {
  font-family: 'Courier New', monospace;
  font-size: 48px;
  font-weight: 700;
  color: #22C55E;
  letter-spacing: 4px;
  line-height: 1;
}
.bm-timer-bushels {
  font-size: 16px;
  color: #94A3B8;
  margin-top: 8px;
  font-weight: 500;
}
.bm-timer-btns {
  display: flex;
  gap: 12px;
  margin-bottom: 12px;
}
.bm-btn-start {
  flex: 1;
  min-height: 48px;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 2px;
}
.bm-btn-stop {
  flex: 1;
  min-height: 48px;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 2px;
  background: #DC2626 !important;
  color: #fff !important;
  border: none !important;
}

/* Scale ticket parsed result */
.bm-ticket-parsed {
  background: #F0FDF4;
  border: 1px solid #BBF7D0;
  border-radius: 8px;
  padding: 12px;
  font-size: 13px;
  color: var(--text-dark);
  margin-top: 8px;
}
.bm-tp-title {
  font-weight: 700;
  color: #16A34A;
  margin-bottom: 6px;
}
.bm-ticket-row {
  margin-bottom: 8px;
}

/* Transfer history rows */
.bm-transfer-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 0;
  border-bottom: 1px solid #F1F5F9;
  font-size: 13px;
}
.bm-transfer-row:last-child { border-bottom: none; }
.bm-xfer-dir {
  font-weight: 600;
  color: var(--text-dark);
  text-transform: capitalize;
}
.bm-xfer-detail { color: var(--text-medium); }
.bm-xfer-date { color: var(--text-light); font-size: 12px; }

/* ─── Inventory Screen ───────────────────────────────────────────────────── */
.bm-inv-hero {
  text-align: center;
  padding: 20px 0;
}
.bm-inv-big {
  font-size: 32px;
  font-weight: 800;
  color: var(--text-dark);
}
.bm-inv-sub {
  font-size: 14px;
  color: var(--text-light);
  margin-top: 4px;
}
.bm-inv-stats {
  display: flex;
  justify-content: space-around;
  gap: 12px;
  padding: 16px;
  background: #F8FAFC;
  border-radius: 12px;
  margin-bottom: 16px;
}
.bm-inv-stat { text-align: center; flex: 1; }
.bm-inv-sv {
  font-size: 16px;
  font-weight: 700;
  color: var(--text-dark);
}
.bm-inv-sl {
  font-size: 11px;
  color: var(--text-light);
  margin-top: 2px;
}

/* Commodity bar chart */
.bm-inv-bar-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}
.bm-inv-bar-label {
  width: 80px;
  font-size: 13px;
  font-weight: 600;
  color: var(--text-dark);
  text-align: right;
}
.bm-inv-bar-track {
  flex: 1;
  height: 20px;
  background: #F1F5F9;
  border-radius: 10px;
  overflow: hidden;
}
.bm-inv-bar-fill {
  height: 100%;
  border-radius: 10px;
  transition: width 0.5s ease;
}
.bm-inv-bar-val {
  width: 90px;
  font-size: 12px;
  font-weight: 600;
  color: var(--text-medium);
}

/* Per-bin table */
.bm-inv-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
  margin-top: 8px;
}
.bm-inv-table th {
  text-align: left;
  padding: 6px 4px;
  border-bottom: 2px solid #E2E8F0;
  font-weight: 700;
  color: var(--text-dark);
  font-size: 11px;
  white-space: nowrap;
}
.bm-inv-table td {
  padding: 8px 4px;
  border-bottom: 1px solid #F1F5F9;
  color: var(--text-medium);
}
.bm-inv-table tr:last-child td { border-bottom: none; }

.bm-inv-cost-summary {
  margin-top: 16px;
  padding: 12px;
  background: #FEF2F2;
  border-radius: 8px;
  font-size: 14px;
  color: var(--text-dark);
  text-align: center;
}

/* Bin action bar */
.bin-action-bar {
  display: flex;
  gap: 8px;
  margin-bottom: 12px;
}
.bin-action-btn {
  flex: 1;
  padding: 10px 8px;
  background: #F8FAFC;
  border: 1px solid #E2E8F0;
  border-radius: var(--radius-sm);
  font-size: 13px;
  font-weight: 600;
  color: var(--text-dark);
  cursor: pointer;
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
.bin-action-btn:active {
  background: #F1F5F9;
}

/* ─── VR Prescription ──────────────────────────────────────────────────────── */
.vr-steps { margin-bottom: 20px; }
.vr-step-indicator {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  margin-bottom: 8px;
}
.vr-step-dot {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: #e5e7eb;
  color: #9ca3af;
  display: flex; align-items: center; justify-content: center;
  font-size: 14px; font-weight: 700;
  transition: all 0.2s;
}
.vr-step-dot.active { background: #16a34a; color: #fff; }
.vr-step-dot.completed { background: #22c55e; color: #fff; }
.vr-step-line {
  width: 40px; height: 3px;
  background: #e5e7eb;
  margin: 0 4px;
}
.vr-step-labels {
  display: flex;
  justify-content: center;
  gap: 32px;
  font-size: 12px;
  color: #9ca3af;
}
.vr-step-labels span.active { color: #16a34a; font-weight: 600; }

.vr-setup-form { padding: 4px 0; }
.vr-setup-form .field-label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: #374151;
  margin-bottom: 4px;
}
.vr-setup-form .form-input {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  font-size: 15px;
  background: #fff;
  box-sizing: border-box;
}

.vr-type-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 8px;
}
.vr-type-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 10px 4px;
  border: 2px solid #e5e7eb;
  border-radius: 10px;
  background: #fff;
  font-size: 11px;
  font-weight: 600;
  color: #6b7280;
  cursor: pointer;
  transition: all 0.15s;
  min-height: 44px;
}
.vr-type-btn.active {
  border-color: #16a34a;
  color: #16a34a;
  background: #f0fdf4;
}
.vr-type-icon {
  width: 28px; height: 28px;
  border-radius: 50%;
  background: #f3f4f6;
  display: flex; align-items: center; justify-content: center;
  font-size: 13px; font-weight: 800;
}
.vr-type-btn.active .vr-type-icon {
  background: #16a34a;
  color: #fff;
}

.vr-zone-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.vr-zone-table th {
  background: #f9fafb;
  padding: 8px 6px;
  text-align: left;
  font-weight: 600;
  color: #6b7280;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border-bottom: 2px solid #e5e7eb;
}
.vr-zone-table td {
  padding: 8px 6px;
  border-bottom: 1px solid #f3f4f6;
  color: #374151;
}
.vr-rate-input {
  padding: 4px 6px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 600;
  color: #16a34a;
  background: #f0fdf4;
}

.vr-summary-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-bottom: 12px;
}
.vr-summary-card {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  padding: 12px 8px;
  text-align: center;
}
.vr-summary-value {
  font-size: 18px;
  font-weight: 700;
  color: #111827;
}
.vr-summary-label {
  font-size: 11px;
  color: #9ca3af;
  margin-top: 2px;
}

.vr-savings-callout {
  background: linear-gradient(135deg, #dcfce7, #bbf7d0);
  border: 2px solid #16a34a;
  border-radius: 12px;
  padding: 16px;
  text-align: center;
  margin-bottom: 12px;
}
.vr-savings-amount {
  font-size: 22px;
  font-weight: 800;
  color: #15803d;
}
.vr-savings-total {
  font-size: 14px;
  color: #166534;
  margin-top: 4px;
  font-weight: 500;
}

.vr-insight-card {
  background: #fffbeb;
  border: 1px solid #fde68a;
  border-radius: 10px;
  padding: 14px;
  margin-bottom: 12px;
}

.vr-brand-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.vr-brand-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 14px 8px;
  border: 2px solid #e5e7eb;
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
  transition: all 0.15s;
  min-height: 44px;
}
.vr-brand-card.active {
  box-shadow: 0 0 0 2px rgba(22, 163, 74, 0.3);
  transform: scale(1.02);
}
.vr-brand-logo {
  width: 36px; height: 36px;
  border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 800;
}
.vr-brand-name {
  font-size: 12px;
  font-weight: 700;
  color: #374151;
  text-align: center;
}
.vr-brand-sub {
  font-size: 10px;
  color: #9ca3af;
}

.vr-instructions-box {
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  padding: 14px;
}

.vr-history-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 0;
  border-bottom: 1px solid #f3f4f6;
  cursor: pointer;
  min-height: 44px;
}
.vr-history-item:active { background: #f9fafb; }

.vr-zone-label { background: none !important; border: none !important; }

@media print {
  .vr-savings-callout { border: 2px solid #000; }
  .bottom-nav, .sub-header { display: none; }
}

@media (max-width: 400px) {
  .vr-type-grid { grid-template-columns: repeat(3, 1fr); }
  .vr-brand-grid { grid-template-columns: repeat(2, 1fr); }
  .vr-summary-cards { grid-template-columns: repeat(2, 1fr); }
}

/* ─── Soil Sampling System ────────────────────────────────────────────── */
.ss-tabs {
  display: flex;
  gap: 0;
  border-bottom: 1px solid var(--border);
  margin-bottom: 16px;
}
.ss-tab {
  flex: 1;
  padding: 12px 8px;
  border: none;
  background: none;
  font-size: 13px;
  font-weight: 600;
  font-family: 'Inter', sans-serif;
  color: var(--text-light);
  cursor: pointer;
  border-bottom: 2px solid transparent;
  min-height: 44px;
}
.ss-tab.active {
  color: var(--primary-green);
  border-bottom-color: var(--primary-green);
}
.ss-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 16px;
  margin-bottom: 12px;
}
.ss-card-title {
  font-size: 16px;
  font-weight: 700;
  color: var(--text-dark);
  margin: 0 0 12px;
  font-family: 'Inter', sans-serif;
}

/* Grid points */
.ss-grid-header {
  font-size: 16px;
  font-weight: 700;
  color: var(--text-dark);
}
.ss-grid-meta {
  font-size: 13px;
  color: var(--text-light);
  margin-top: 4px;
}
.ss-point-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 12px 14px;
  margin-bottom: 8px;
}
.ss-point-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 6px;
}
.ss-point-num {
  font-size: 16px;
  font-weight: 800;
  color: var(--text-dark);
  font-family: 'Inter', sans-serif;
}
.ss-point-terrain {
  font-size: 11px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 10px;
  text-transform: capitalize;
}
.ss-terrain-hilltop { background: #FEE2E2; color: #991B1B; }
.ss-terrain-draw-valley { background: #DBEAFE; color: #1E40AF; }
.ss-terrain-slope { background: #FEF3C7; color: #92400E; }
.ss-terrain-mid-slope { background: var(--light-green); color: var(--secondary-green); }
.ss-point-instruction {
  font-size: 13px;
  color: var(--text-dark);
  font-weight: 600;
  margin-bottom: 4px;
}
.ss-point-note {
  font-size: 12px;
  color: var(--text-medium);
  font-style: italic;
  margin-bottom: 4px;
}
.ss-point-depth {
  font-size: 12px;
  color: var(--text-light);
}
.ss-point-gps {
  font-size: 11px;
  color: var(--text-muted);
  font-family: monospace;
  margin-top: 4px;
}

/* Equipment & labs */
.ss-equip-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 0;
  font-size: 13px;
  border-bottom: 1px solid var(--border-light);
}
.ss-equip-row:last-child { border-bottom: none; }
.ss-equip-level {
  font-size: 11px;
  font-weight: 700;
  min-width: 60px;
  color: var(--primary-green);
}
.ss-equip-price {
  margin-left: auto;
  font-weight: 600;
  color: var(--text-dark);
}
.ss-lab-row {
  padding: 10px 0;
  border-bottom: 1px solid var(--border-light);
}
.ss-lab-row:last-child { border-bottom: none; }
.ss-lab-name {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-dark);
}
.ss-lab-meta {
  font-size: 12px;
  color: var(--text-light);
  margin-top: 2px;
}

/* Tissue sampling guide */
.ss-tissue-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 16px;
  margin-bottom: 12px;
}
.ss-tissue-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}
.ss-tissue-stage {
  font-size: 16px;
  font-weight: 800;
  color: var(--primary-green);
  font-family: 'Inter', sans-serif;
}
.ss-tissue-window {
  font-size: 12px;
  color: var(--text-light);
  background: var(--bg-alt);
  padding: 3px 10px;
  border-radius: 10px;
}
.ss-tissue-timing {
  font-size: 13px;
  color: var(--text-medium);
  margin-bottom: 10px;
}
.ss-tissue-section {
  font-size: 13px;
  color: var(--text-medium);
  line-height: 1.5;
  margin-bottom: 6px;
}
.ss-tissue-section strong { color: var(--text-dark); }
.ss-tissue-nutrients {
  font-size: 12px;
  font-weight: 600;
  color: var(--primary-green);
  margin: 8px 0;
}
.ss-bobbie-says {
  font-size: 13px;
  color: var(--text-dark);
  background: var(--light-green);
  padding: 10px 12px;
  border-radius: 8px;
  line-height: 1.5;
  margin-top: 8px;
}

/* Interpretation results */
.ss-interp-row {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 12px 14px;
  margin-bottom: 8px;
}
.ss-interp-nutrient {
  font-size: 15px;
  font-weight: 700;
  color: var(--text-dark);
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
}
.ss-interp-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}
.ss-interp-value {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-dark);
}
.ss-interp-status {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.5px;
  margin: 4px 0;
}
.ss-interp-range {
  font-size: 11px;
  color: var(--text-light);
}
.ss-interp-action {
  font-size: 12px;
  color: var(--text-medium);
  margin-top: 6px;
  line-height: 1.4;
}

/* ─── Coming Soon Badge ─────────────────────────────────────────────────────── */
.coming-soon-badge {
  display: inline-block;
  background: #E2E8F0;
  color: #64748B;
  font-size: 10px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 10px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-left: 8px;
}
.sampling-option-disabled {
  opacity: 0.5;
  pointer-events: none;
  position: relative;
}

/* ─── Soil Sampling Grid Generator + GPS Nav ────────────────────────────────── */
.ss-field-info-card {
  background: #F0FDF4;
  border: 1px solid #BBF7D0;
  border-radius: 10px;
  padding: 10px 14px;
  margin: 8px 0;
}
.ss-field-info-name {
  font-weight: 700;
  font-size: 15px;
  color: #166534;
}
.ss-field-info-meta {
  font-size: 12px;
  color: #15803D;
  margin-top: 2px;
}

.ss-option-group {
  margin-top: 16px;
}
.ss-option-label {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-dark);
  margin-bottom: 8px;
  display: block;
}
.ss-radio-group {
  display: flex;
  gap: 8px;
}
.ss-radio {
  flex: 1;
  cursor: pointer;
}
.ss-radio input { display: none; }
.ss-radio-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 10px 8px;
  border: 2px solid #E2E8F0;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  color: var(--text-dark);
  text-align: center;
  transition: all 0.15s;
}
.ss-radio-box small {
  font-size: 11px;
  font-weight: 400;
  color: var(--text-medium);
  margin-top: 2px;
}
.ss-radio input:checked + .ss-radio-box {
  border-color: #16A34A;
  background: #F0FDF4;
  color: #166534;
}

.ss-method-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ss-method-option {
  cursor: pointer;
}
.ss-method-option input { display: none; }
.ss-method-box {
  display: block;
  padding: 12px 14px;
  border: 2px solid #E2E8F0;
  border-radius: 10px;
  transition: all 0.15s;
}
.ss-method-name {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-dark);
  display: block;
}
.ss-method-desc {
  font-size: 12px;
  color: var(--text-medium);
  margin-top: 2px;
  display: block;
}
.ss-method-option input:checked + .ss-method-box {
  border-color: #16A34A;
  background: #F0FDF4;
}

.ss-generate-btn {
  width: 100%;
  min-height: 48px;
  margin-top: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 16px;
  font-weight: 600;
}

/* Grid Generation Results */
.ss-gen-summary {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px;
  background: #F0FDF4;
  border: 1px solid #BBF7D0;
  border-radius: 12px;
  margin: 12px 0;
}
.ss-gen-summary-title {
  font-weight: 700;
  font-size: 15px;
  color: #166534;
}
.ss-gen-summary-meta {
  font-size: 12px;
  color: #15803D;
  margin-top: 2px;
}
.ss-cost-card {
  background: var(--card-bg);
  border: 1px solid var(--border-color);
  border-radius: 12px;
  padding: 14px;
  text-align: center;
  margin-bottom: 12px;
}
.ss-cost-label {
  font-size: 12px;
  color: var(--text-medium);
  font-weight: 500;
}
.ss-cost-value {
  font-size: 22px;
  font-weight: 700;
  color: var(--text-dark);
  margin: 4px 0;
}
.ss-cost-note {
  font-size: 11px;
  color: var(--text-light);
}
.ss-start-btn {
  width: 100%;
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 16px;
  font-weight: 600;
}

/* Grid History */
.ss-section-title {
  font-size: 14px;
  font-weight: 700;
  color: var(--text-dark);
  margin: 16px 0 8px;
}
.ss-history-card {
  background: var(--card-bg);
  border: 1px solid var(--border-color);
  border-radius: 12px;
  padding: 12px 14px;
  margin-bottom: 8px;
  cursor: pointer;
  transition: background 0.15s;
}
.ss-history-card:active {
  background: #F1F5F9;
}
.ss-history-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.ss-history-date {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-dark);
}
.ss-status-badge {
  font-size: 10px;
  font-weight: 600;
  color: #fff;
  padding: 2px 8px;
  border-radius: 10px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.ss-history-meta {
  font-size: 12px;
  color: var(--text-medium);
  margin-top: 4px;
}
.ss-history-lab {
  font-size: 11px;
  color: #8B5CF6;
  margin-top: 4px;
}

/* ─── Map Markers ───────────────────────────────────────────────────────────── */
.ss-marker-circle {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  box-shadow: 0 2px 6px rgba(0,0,0,0.2);
}
.ss-map-marker-uncollected .ss-marker-circle {
  background: #fff;
  border: 2px solid #3B82F6;
  color: #3B82F6;
}
.ss-map-marker-collected .ss-marker-circle {
  background: #16A34A;
  border: 2px solid #fff;
  color: #fff;
}
.ss-map-marker-target .ss-marker-circle {
  background: #3B82F6;
  border: 2px solid #fff;
  color: #fff;
  animation: ss-pulse 1.5s ease-in-out infinite;
  width: 36px;
  height: 36px;
  font-size: 11px;
}
.ss-map-marker-skipped .ss-marker-circle {
  background: #FEF3C7;
  border: 2px solid #F59E0B;
  color: #92400E;
}

@keyframes ss-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.4); }
  50% { box-shadow: 0 0 0 12px rgba(59, 130, 246, 0); }
}

/* User GPS Position */
.ss-user-position {
  z-index: 1000 !important;
}
.ss-user-dot {
  width: 16px;
  height: 16px;
  background: #3B82F6;
  border-radius: 50%;
  border: 3px solid #fff;
  box-shadow: 0 2px 6px rgba(0,0,0,0.3);
  position: relative;
}
.ss-user-dot-pulse {
  position: absolute;
  top: -8px;
  left: -8px;
  width: 32px;
  height: 32px;
  background: rgba(59, 130, 246, 0.2);
  border-radius: 50%;
  animation: ss-user-pulse 2s ease-out infinite;
}
@keyframes ss-user-pulse {
  0% { transform: scale(0.5); opacity: 1; }
  100% { transform: scale(2); opacity: 0; }
}

/* ─── Collection Mode ───────────────────────────────────────────────────────── */
.ss-collect-map {
  width: 100%;
  height: 300px;
  border-radius: 12px;
  overflow: hidden;
  margin-bottom: 12px;
}
.ss-collect-progress {
  margin-bottom: 12px;
}
.ss-progress-bar-outer {
  height: 8px;
  background: #E2E8F0;
  border-radius: 4px;
  overflow: hidden;
}
.ss-progress-bar-fill {
  height: 100%;
  background: #16A34A;
  border-radius: 4px;
  transition: width 0.3s;
}
.ss-progress-text {
  font-size: 12px;
  color: var(--text-medium);
  text-align: center;
  margin-top: 4px;
}

/* Navigation Panel */
.ss-nav-panel {
  background: var(--card-bg);
  border: 1px solid var(--border-color);
  border-radius: 16px;
  padding: 16px;
  box-shadow: 0 -4px 16px rgba(0,0,0,0.06);
}
.ss-nav-loading, .ss-nav-error {
  text-align: center;
  padding: 16px;
  color: var(--text-medium);
  font-size: 14px;
}
.ss-nav-error {
  color: #DC2626;
}
.ss-nav-complete {
  text-align: center;
  padding: 16px;
  color: #16A34A;
  font-weight: 600;
  font-size: 16px;
}
/* ─── GPS Navigator Progress Bar ─── */
.ss-progress-bar {
  height: 28px;
  background: #e2e8f0;
  border-radius: 14px;
  overflow: hidden;
  position: relative;
  margin-bottom: 10px;
}
.ss-progress-fill {
  height: 100%;
  background: #16A34A;
  border-radius: 14px;
  transition: width 0.4s ease;
}
.ss-progress-text {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
  color: #1e293b;
  font-family: 'Inter', sans-serif;
}
/* ─── Coming Soon Cards ─── */
.ss-coming-soon-card {
  display: flex;
  align-items: center;
  gap: 12px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 12px 16px;
  margin-bottom: 8px;
  opacity: 0.7;
}
.ss-cs-icon { font-size: 24px; flex-shrink: 0; }
.ss-cs-info { flex: 1; min-width: 0; }
.ss-cs-name { font-size: 14px; font-weight: 600; color: #1e293b; font-family: 'Inter', sans-serif; }
.ss-cs-desc { font-size: 12px; color: #94a3b8; font-family: 'Inter', sans-serif; }
.ss-nav-target {
  text-align: center;
  margin-bottom: 16px;
}
.ss-nav-label-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}
.ss-nav-point-label {
  font-size: 24px;
  font-weight: 800;
  color: var(--text-dark);
  background: #EBF4FF;
  padding: 4px 16px;
  border-radius: 8px;
}
.ss-nav-distance {
  font-size: 24px;
  font-weight: 700;
  color: #16A34A;
}
.ss-nav-direction {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-top: 8px;
}
.ss-nav-arrow {
  transition: transform 0.3s ease;
}
.ss-nav-compass {
  font-size: 18px;
  font-weight: 600;
  color: var(--text-medium);
}
.ss-nav-buttons {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ss-collect-btn {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 16px;
  font-weight: 700;
  width: 100%;
}
.ss-nav-secondary {
  display: flex;
  gap: 8px;
}
.ss-skip-btn, .ss-note-btn {
  flex: 1;
  min-height: 44px;
  font-size: 14px;
}
.ss-collect-actions {
  margin-top: 12px;
}
.ss-finish-btn {
  width: 100%;
  min-height: 44px;
}

/* ─── Summary ───────────────────────────────────────────────────────────────── */
.ss-summary-header {
  text-align: center;
  padding: 20px 0;
}
.ss-summary-header h3 {
  font-size: 20px;
  font-weight: 700;
  color: var(--text-dark);
  margin: 8px 0 0;
}
.ss-summary-map {
  width: 100%;
  height: 220px;
  border-radius: 12px;
  overflow: hidden;
  margin-bottom: 16px;
}
.ss-summary-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  margin-bottom: 16px;
}
.ss-stat {
  background: var(--card-bg);
  border: 1px solid var(--border-color);
  border-radius: 10px;
  padding: 10px 8px;
  text-align: center;
}
.ss-stat-value {
  font-size: 18px;
  font-weight: 700;
  color: var(--text-dark);
}
.ss-stat-label {
  font-size: 11px;
  color: var(--text-medium);
  margin-top: 2px;
}
.ss-lab-section {
  background: var(--card-bg);
  border: 1px solid var(--border-color);
  border-radius: 12px;
  padding: 16px;
  margin-bottom: 12px;
}

/* ─── Gen Map Container ─────────────────────────────────────────────────────── */
.ss-gen-map {
  border-radius: 12px;
  overflow: hidden;
}

/* ─── Topo Variability Map Markers ─────────────────────────────────────────── */
.ss-map-marker-topo-high .ss-marker-circle {
  background: #FEE2E2;
  border: 2px solid #DC2626;
  color: #991B1B;
}
.ss-map-marker-topo-moderate .ss-marker-circle {
  background: #FEF3C7;
  border: 2px solid #D97706;
  color: #92400E;
}
.ss-map-marker-topo-uniform .ss-marker-circle {
  background: #F0FDF4;
  border: 2px solid #16A34A;
  color: #166534;
}
.ss-topo-btn {
  width: 100%;
  min-height: 44px;
  margin: 12px 0 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 600;
}
.ss-topo-unavailable {
  opacity: 0.5;
  cursor: not-allowed;
}
.ss-topo-legend {
  display: flex;
  justify-content: center;
  gap: 16px;
  padding: 8px 0;
  font-size: 12px;
  color: var(--text-medium);
}
.ss-topo-legend-item {
  display: flex;
  align-items: center;
  gap: 4px;
}
.ss-topo-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: inline-block;
}
.ss-topo-red { background: #DC2626; }
.ss-topo-yellow { background: #D97706; }
.ss-topo-green { background: #16A34A; }
.ss-topo-badge-unavailable {
  text-align: center;
  padding: 8px;
  font-size: 12px;
  color: #64748B;
}

/* ─── Equipment Recommendations ────────────────────────────────────────────── */
.ss-equip-panel {
  margin: 16px 0;
}
.ss-equip-cards {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 12px;
}
.ss-equip-card {
  background: #FFF;
  border: 1px solid #E2E8F0;
  border-radius: 12px;
  padding: 14px 16px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.ss-equip-standard {
  border-color: #16A34A;
  background: #F0FDF4;
}
.ss-equip-medal {
  font-size: 28px;
  flex-shrink: 0;
}
.ss-equip-tier {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #64748B;
}
.ss-equip-rec-badge {
  background: #16A34A;
  color: #FFF;
  font-size: 9px;
  padding: 2px 6px;
  border-radius: 8px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  margin-left: 4px;
}
.ss-equip-name {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-dark);
  margin-top: 2px;
}
.ss-equip-desc {
  font-size: 12px;
  color: var(--text-medium);
  margin-top: 1px;
}
.ss-equip-price-tag {
  margin-left: auto;
  font-size: 18px;
  font-weight: 700;
  color: var(--text-dark);
  flex-shrink: 0;
}

/* Supplies checklist */
.ss-supplies-card {
  background: #FFF;
  border: 1px solid #E2E8F0;
  border-radius: 12px;
  padding: 14px 16px;
  margin-bottom: 8px;
}
.ss-supplies-title, .ss-technique-title {
  font-size: 13px;
  font-weight: 700;
  color: var(--text-dark);
  margin: 0 0 8px;
}
.ss-checklist-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 0;
  font-size: 13px;
  color: var(--text-dark);
  cursor: pointer;
}
.ss-checklist-item input[type="checkbox"] {
  width: 18px;
  height: 18px;
  accent-color: #16A34A;
  flex-shrink: 0;
}

/* Technique reminder */
.ss-technique-card {
  background: #F0FDF4;
  border: 1px solid #BBF7D0;
  border-radius: 12px;
  padding: 14px 16px;
}
.ss-technique-text {
  font-size: 13px;
  color: #166534;
  line-height: 1.5;
  margin: 0;
}

/* ─── Lab Finder Cards ─────────────────────────────────────────────────────── */
.ss-lab-tip {
  font-size: 12px;
  color: #64748B;
  margin-bottom: 12px;
  font-style: italic;
}
.ss-lab-card {
  background: #FFF;
  border: 1px solid #E2E8F0;
  border-radius: 12px;
  padding: 14px 16px;
  margin-bottom: 8px;
}
.ss-lab-card-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.ss-lab-card-name {
  font-size: 15px;
  font-weight: 700;
  color: var(--text-dark);
}
.ss-lab-card-city {
  font-size: 12px;
  color: var(--text-medium);
  margin-top: 2px;
}
.ss-lab-card-price {
  font-size: 20px;
  font-weight: 700;
  color: #16A34A;
  flex-shrink: 0;
}
.ss-lab-card-price small {
  font-size: 11px;
  font-weight: 400;
  color: var(--text-medium);
}
.ss-lab-card-meta {
  display: flex;
  gap: 12px;
  font-size: 11px;
  color: var(--text-light);
  margin: 8px 0;
  flex-wrap: wrap;
}
.ss-lab-card-actions {
  display: flex;
  gap: 8px;
  margin-top: 8px;
}
.ss-lab-call-btn, .ss-lab-web-btn {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 38px;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  border-radius: 8px;
}

/* ─── Tissue Sampling Shell Cards ──────────────────────────────────────────── */
.ss-tissue-shell-card {
  background: #F8FAFC;
  border: 1px solid #E2E8F0;
  border-radius: 12px;
  padding: 16px;
  margin-bottom: 8px;
  position: relative;
  opacity: 0.7;
}
.ss-tissue-shell-overlay {
  position: absolute;
  top: 10px;
  right: 10px;
}
.ss-tissue-shell-stage {
  font-size: 15px;
  font-weight: 700;
  color: #64748B;
  margin-bottom: 4px;
}
.ss-tissue-shell-desc {
  font-size: 13px;
  color: #94A3B8;
  margin-bottom: 4px;
}
.ss-tissue-shell-what {
  font-size: 12px;
  font-weight: 600;
  color: #94A3B8;
}

/* ─── Lab Results Interpreter Shell ────────────────────────────────────────── */
.ss-lab-results-preview {
  background: #F8FAFC;
  border: 1px solid #E2E8F0;
  border-radius: 12px;
  padding: 16px;
  position: relative;
  overflow: hidden;
}
.ss-lab-results-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(248, 250, 252, 0.85);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  z-index: 2;
  padding: 20px;
}
.ss-lab-results-lock {
  font-size: 32px;
  margin-bottom: 8px;
}
.ss-lab-results-coming {
  font-size: 18px;
  font-weight: 700;
  color: #64748B;
  margin-bottom: 8px;
}
.ss-lab-results-desc {
  font-size: 13px;
  color: #94A3B8;
  text-align: center;
  margin-bottom: 12px;
  line-height: 1.4;
}
.ss-lab-upload-btn-shell {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px;
  background: #E2E8F0;
  border-radius: 10px;
  color: #94A3B8;
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 16px;
}
.ss-nutrient-preview {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ss-nutrient-bar-row {
  display: flex;
  align-items: center;
  gap: 8px;
}
.ss-nutrient-name {
  font-size: 12px;
  font-weight: 600;
  color: #64748B;
  min-width: 80px;
}
.ss-nutrient-bar-track {
  flex: 1;
  height: 8px;
  background: #E2E8F0;
  border-radius: 4px;
  overflow: hidden;
}
.ss-nutrient-bar-fill {
  height: 100%;
  border-radius: 4px;
  transition: width 0.5s;
}
.ss-nutrient-status {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.03em;
  min-width: 65px;
  text-align: right;
}

/* ─── Notify Toggle ────────────────────────────────────────────────────────── */
.ss-notify-toggle {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  font-size: 13px;
  color: var(--text-medium);
}
.ss-notify-toggle input[type="checkbox"] {
  width: 18px;
  height: 18px;
  accent-color: #16A34A;
}

/* ─── Coming Soon Cards Grid ───────────────────────────────────────────────── */
.ss-cs-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}
.ss-cs-card {
  background: #F8FAFC;
  border: 1px solid #E2E8F0;
  border-radius: 12px;
  padding: 14px;
  text-align: center;
}
.ss-cs-lock {
  font-size: 20px;
  margin-bottom: 4px;
}
.ss-cs-name {
  font-size: 12px;
  font-weight: 700;
  color: #64748B;
  margin-bottom: 2px;
  line-height: 1.3;
}
.ss-cs-desc {
  font-size: 11px;
  color: #94A3B8;
  margin-bottom: 8px;
  line-height: 1.3;
}
.ss-cs-count {
  font-size: 10px;
  color: #16A34A;
  font-weight: 600;
  margin-top: 4px;
  min-height: 14px;
}

/* ─── Print Styles ─────────────────────────────────────────────────────────── */
@media print {
  .ss-nav-panel, .bottom-nav, .sub-header, .ss-tabs,
  .ss-collect-actions, .ss-lab-section button,
  .ss-equip-panel, .ss-coming-soon-grid, .ss-cs-grid,
  .legal-footer, .legal-disclaimer { display: none !important; }
  .ss-summary-map { height: 300px !important; }
  .screen { position: static !important; }
  body { overflow: visible !important; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   TISSUE SAMPLING SYSTEM
   ═══════════════════════════════════════════════════════════════════════════ */

.ts-card {
  background: var(--bg-card, #FFF);
  border-radius: 12px;
  padding: 16px;
  margin-bottom: 12px;
  border: 1px solid var(--border-light, #E2E8F0);
}

.ts-card-title {
  font-size: 16px;
  font-weight: 700;
  color: var(--text-dark, #0F172A);
  margin: 0 0 12px;
}

.ts-form-row {
  display: flex;
  gap: 12px;
  margin-bottom: 8px;
}
.ts-form-row .input-group { flex: 1; }

.ts-section-header {
  font-size: 14px;
  font-weight: 700;
  color: var(--text-dark, #0F172A);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin: 16px 0 8px;
  padding: 0 4px;
}

.ts-hint {
  text-align: center;
  color: var(--text-medium, #64748B);
  font-size: 14px;
  padding: 24px 16px;
}

/* ─── GDD Progress ────────────────────────────────────────────────────────── */
.ts-gdd-card { position: relative; }

.ts-gdd-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}

.ts-gdd-label {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-medium, #64748B);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.ts-gdd-value {
  font-size: 24px;
  font-weight: 700;
  color: var(--text-dark, #0F172A);
}

.ts-gdd-bar-container {
  position: relative;
  height: 16px;
  background: var(--bg-main, #F1F5F9);
  border-radius: 8px;
  overflow: visible;
  margin-bottom: 16px;
}

.ts-gdd-bar {
  height: 100%;
  background: linear-gradient(90deg, #16A34A 0%, #22C55E 100%);
  border-radius: 8px;
  transition: width 0.6s ease;
  min-width: 4px;
}

.ts-gdd-marker {
  position: absolute;
  top: -8px;
  transform: translateX(-50%);
  font-size: 14px;
  z-index: 2;
}
.ts-gdd-marker.past { opacity: 0.4; }
.ts-gdd-marker.current { animation: ts-pulse 1.5s ease-in-out infinite; }
.ts-gdd-marker.future { opacity: 0.6; }

@keyframes ts-pulse {
  0%, 100% { transform: translateX(-50%) scale(1); }
  50% { transform: translateX(-50%) scale(1.3); }
}

/* ─── Stage Timeline ──────────────────────────────────────────────────────── */
.ts-stage-timeline {
  display: flex;
  justify-content: space-between;
  position: relative;
  padding: 0 4px;
  margin-bottom: 12px;
}

.ts-stage-timeline::before {
  content: '';
  position: absolute;
  top: 6px;
  left: 8px;
  right: 8px;
  height: 2px;
  background: var(--border-light, #E2E8F0);
}

.ts-timeline-node {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  z-index: 1;
}

.ts-timeline-dot {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: 2px solid var(--border-light, #E2E8F0);
  background: var(--bg-card, #FFF);
  margin-bottom: 4px;
}

.ts-timeline-node.past .ts-timeline-dot {
  background: #94A3B8;
  border-color: #94A3B8;
}

.ts-timeline-node.current .ts-timeline-dot {
  background: #16A34A;
  border-color: #16A34A;
  box-shadow: 0 0 0 4px rgba(22, 163, 74, 0.2);
  animation: ts-pulse-dot 1.5s ease-in-out infinite;
}

@keyframes ts-pulse-dot {
  0%, 100% { box-shadow: 0 0 0 4px rgba(22, 163, 74, 0.2); }
  50% { box-shadow: 0 0 0 8px rgba(22, 163, 74, 0.1); }
}

.ts-timeline-node.sampling .ts-timeline-dot {
  width: 16px;
  height: 16px;
}

.ts-timeline-label {
  font-size: 10px;
  font-weight: 600;
  color: var(--text-medium, #64748B);
}

.ts-timeline-node.current .ts-timeline-label {
  color: #16A34A;
  font-weight: 700;
}

.ts-current-stage {
  font-size: 14px;
  color: var(--text-dark, #0F172A);
  text-align: center;
}

.ts-next-info {
  font-size: 13px;
  color: var(--text-medium, #64748B);
  text-align: center;
  margin-top: 4px;
}

/* ─── Stage Cards ─────────────────────────────────────────────────────────── */
.ts-stage-card {
  background: var(--bg-card, #FFF);
  border-radius: 12px;
  padding: 16px;
  margin-bottom: 12px;
  border: 1px solid var(--border-light, #E2E8F0);
}

.ts-stage-current {
  border: 2px solid #16A34A;
  box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.08);
}

.ts-stage-past { border-left: 4px solid #94A3B8; }

.ts-stage-future {
  background: var(--bg-main, #F8FAFC);
  opacity: 0.75;
}

.ts-stage-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}

.ts-stage-name {
  font-size: 16px;
  font-weight: 700;
  color: var(--text-dark, #0F172A);
}

.ts-stage-badge {
  font-size: 11px;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 12px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.ts-badge-current { background: #DCFCE7; color: #166534; }
.ts-badge-past { background: #F1F5F9; color: #475569; }
.ts-badge-future { background: #F1F5F9; color: #94A3B8; }

.ts-stage-gdd {
  font-size: 12px;
  color: var(--text-medium, #64748B);
  margin-bottom: 8px;
}

.ts-instructions {
  background: var(--bg-main, #F8FAFC);
  border-radius: 8px;
  padding: 12px;
  margin-bottom: 8px;
}

.ts-instr-row {
  font-size: 13px;
  color: var(--text-dark, #334155);
  line-height: 1.5;
  margin-bottom: 4px;
}
.ts-instr-row strong { color: var(--text-dark, #0F172A); }

.ts-stage-why {
  font-size: 13px;
  color: var(--text-dark, #334155);
  line-height: 1.5;
  margin-bottom: 8px;
}

.ts-stage-reminder {
  font-size: 13px;
  color: var(--text-medium, #94A3B8);
  font-style: italic;
  margin-top: 8px;
}

.ts-stage-actions {
  display: flex;
  gap: 8px;
  margin-top: 8px;
}

.ts-event-badge {
  font-size: 13px;
  color: #16A34A;
  font-weight: 600;
  margin-top: 8px;
  padding: 6px 12px;
  background: #DCFCE7;
  border-radius: 8px;
  text-align: center;
}

/* ─── Events History ──────────────────────────────────────────────────────── */
.ts-event-card {
  background: var(--bg-card, #FFF);
  border-radius: 10px;
  padding: 12px 16px;
  margin-bottom: 8px;
  border: 1px solid var(--border-light, #E2E8F0);
}

.ts-ev-done { border-left: 4px solid #16A34A; }
.ts-ev-sent { border-left: 4px solid #2563EB; }
.ts-ev-pending { border-left: 4px solid #CA8A04; }

.ts-event-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 14px;
  font-weight: 600;
  color: var(--text-dark, #0F172A);
}

.ts-event-status {
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  color: var(--text-medium, #64748B);
}

.ts-event-meta {
  font-size: 12px;
  color: var(--text-medium, #64748B);
  margin-top: 4px;
}

.ts-event-actions {
  display: flex;
  gap: 8px;
  margin-top: 8px;
}

.btn-sm {
  font-size: 12px;
  padding: 6px 12px;
  min-height: 32px;
}

/* ─── Upload Options ──────────────────────────────────────────────────────── */
.ts-upload-options {
  display: flex;
  gap: 8px;
}

.ts-upload-btn {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 16px 8px;
  background: var(--bg-main, #F8FAFC);
  border: 2px dashed var(--border-light, #CBD5E1);
  border-radius: 10px;
  cursor: pointer;
  font-size: 12px;
  font-weight: 600;
  color: var(--text-dark, #334155);
  transition: all 0.2s;
  min-height: 44px;
}

.ts-upload-btn:hover, .ts-upload-btn:active {
  border-color: #2563EB;
  background: #EFF6FF;
}

.ts-upload-icon { font-size: 24px; }

/* ─── Loading ─────────────────────────────────────────────────────────────── */
.ts-loading-card {
  padding: 32px 16px;
}

/* ─── Nutrient Results ────────────────────────────────────────────────────── */
.ts-nutrient-card {
  background: var(--bg-card, #FFF);
  border-radius: 10px;
  padding: 14px 16px;
  margin-bottom: 8px;
  border: 1px solid var(--border-light, #E2E8F0);
}

.ts-nutrient-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}

.ts-nutrient-name {
  font-size: 12px;
  font-weight: 700;
  color: var(--text-dark, #0F172A);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.ts-nutrient-value {
  font-size: 13px;
  color: var(--text-dark, #334155);
}

.ts-nutrient-bar-wrap {
  margin-bottom: 6px;
}

.ts-nutrient-bar {
  display: flex;
  height: 12px;
  border-radius: 6px;
  overflow: hidden;
  position: relative;
  background: var(--bg-main, #F1F5F9);
}

.ts-bar-section { height: 100%; min-width: 2px; }
.ts-bar-deficient { background: #DC2626; }
.ts-bar-low { background: #CA8A04; }
.ts-bar-optimum { background: #16A34A; }
.ts-bar-high { background: #2563EB; }
.ts-bar-excessive { background: #4B5563; }

.ts-bar-marker {
  position: absolute;
  top: -4px;
  width: 4px;
  height: 20px;
  background: var(--text-dark, #0F172A);
  border-radius: 2px;
  transform: translateX(-50%);
  box-shadow: 0 0 0 2px var(--bg-card, #FFF);
}

.ts-nutrient-status {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 2px;
}

.ts-nutrient-range {
  font-size: 12px;
  color: var(--text-medium, #94A3B8);
}

/* ─── Recommendations ─────────────────────────────────────────────────────── */
.ts-recommendation {
  margin-top: 8px;
  padding: 10px 12px;
  background: #FFFBEB;
  border-radius: 8px;
  border: 1px solid #FDE68A;
}

.ts-rec-warning {
  font-size: 13px;
  font-weight: 600;
  color: #92400E;
  margin-bottom: 4px;
}

.ts-rec-detail {
  font-size: 12px;
  color: #78716C;
  line-height: 1.6;
}

.ts-rec-verdict {
  font-size: 13px;
  font-weight: 700;
  margin-top: 6px;
  padding: 4px 8px;
  border-radius: 6px;
  display: inline-block;
}

.ts-go { background: #DCFCE7; color: #166534; }
.ts-nogo { background: #FEE2E2; color: #991B1B; }

/* ─── Insight Banner ──────────────────────────────────────────────────────── */
.ts-insight-card {
  margin-bottom: 12px;
}

.ts-insight-label {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--text-medium, #64748B);
  margin-bottom: 6px;
}

.ts-insight-text {
  font-size: 14px;
  color: var(--text-dark, #334155);
  line-height: 1.6;
}

/* ─── Summary Panel ───────────────────────────────────────────────────────── */
.ts-summary-card { margin-top: 12px; }

.ts-summary-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 12px;
}

.ts-summary-item {
  text-align: center;
  padding: 8px;
  background: var(--bg-main, #F8FAFC);
  border-radius: 8px;
}

.ts-summary-label {
  font-size: 11px;
  font-weight: 600;
  color: var(--text-medium, #64748B);
  text-transform: uppercase;
  letter-spacing: 0.3px;
  margin-bottom: 4px;
}

.ts-summary-value {
  font-size: 18px;
  font-weight: 700;
  color: var(--text-dark, #0F172A);
}

.ts-positive { color: #16A34A !important; }
.ts-negative { color: #DC2626 !important; }

.ts-action-items {
  font-size: 13px;
  color: var(--text-dark, #334155);
  line-height: 1.6;
}
.ts-action-items ul {
  margin: 4px 0 0 16px;
  padding: 0;
}
.ts-action-items li { margin-bottom: 2px; }

/* ─── Trends ──────────────────────────────────────────────────────────────── */
.ts-trend-card { padding: 16px; }

.ts-trend-title {
  font-size: 14px;
  font-weight: 700;
  color: var(--text-dark, #0F172A);
  margin: 0 0 12px;
}

.ts-trend-chart {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  height: 120px;
  padding: 0 4px;
}

.ts-trend-bar-wrap {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100%;
  justify-content: flex-end;
}

.ts-trend-bar {
  width: 100%;
  max-width: 40px;
  border-radius: 4px 4px 0 0;
  transition: height 0.3s;
}

.ts-trend-val {
  font-size: 10px;
  font-weight: 700;
  color: var(--text-dark, #334155);
  margin-top: 4px;
}

.ts-trend-date {
  font-size: 9px;
  color: var(--text-medium, #94A3B8);
  margin-top: 2px;
  white-space: nowrap;
}

.ts-warning-card {
  background: #FEF3C7;
  border: 1px solid #F59E0B;
  color: #92400E;
  font-size: 13px;
  line-height: 1.5;
}

/* ─── Coming Soon Cards ───────────────────────────────────────────────────── */
.ts-coming-soon-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.ts-coming-card {
  background: var(--bg-main, #F8FAFC);
  border: 1px solid var(--border-light, #E2E8F0);
  border-radius: 10px;
  padding: 14px;
  text-align: center;
  opacity: 0.85;
}

.ts-coming-lock {
  font-size: 20px;
  margin-bottom: 6px;
}

.ts-coming-name {
  font-size: 13px;
  font-weight: 700;
  color: var(--text-dark, #334155);
  margin-bottom: 4px;
}

.ts-coming-desc {
  font-size: 11px;
  color: var(--text-medium, #94A3B8);
  line-height: 1.4;
  margin-bottom: 8px;
}

.ts-coming-toggle {
  display: flex;
  align-items: center;
  gap: 6px;
  justify-content: center;
  cursor: pointer;
}

.ts-coming-toggle input[type="checkbox"] {
  width: 18px;
  height: 18px;
  accent-color: #16A34A;
}

.ts-toggle-label {
  font-size: 11px;
  color: var(--text-medium, #64748B);
}

/* ─── Nutrient Grid (Manual Entry) ────────────────────────────────────────── */
.ts-nutrient-grid .input-group {
  margin-bottom: 0;
}

/* ─── Print Styles for Tissue Sampling ────────────────────────────────────── */
@media print {
  .ts-upload-options, .ts-stage-actions, .ts-coming-soon-grid,
  .ts-event-actions, .bottom-nav, .sub-header button,
  #ts-manual-form, .ts-upload-btn { display: none !important; }
  .ts-card, .ts-nutrient-card, .ts-stage-card {
    break-inside: avoid;
    box-shadow: none;
  }
  .ts-summary-card { border: 2px solid #0F172A; }
  #screen-tissue-sampling { position: static !important; }
  body { overflow: visible !important; }
}

/* ─── NRD Compliance ──────────────────────────────────────────────────── */
.ss-nrd-banner {
  background: #FEE2E2;
  border: 1px solid #FECACA;
  border-left: 4px solid #DC2626;
  border-radius: var(--radius);
  padding: 14px 16px;
  margin-bottom: 12px;
}
.ss-nrd-alert {
  font-size: 14px;
  font-weight: 700;
  color: #991B1B;
  margin-bottom: 6px;
}
.ss-nrd-desc {
  font-size: 13px;
  color: #7F1D1D;
  line-height: 1.5;
  margin-bottom: 6px;
}
.ss-nrd-contact {
  font-size: 12px;
  color: #991B1B;
}
.ss-nrd-lab-note {
  font-size: 12px;
  color: #7F1D1D;
  background: rgba(255,255,255,0.5);
  padding: 8px 10px;
  border-radius: 6px;
  margin: 8px 0;
  line-height: 1.4;
}
.ss-crop-note {
  font-size: 13px;
  color: var(--text-medium);
  background: var(--bg-alt);
  padding: 10px 14px;
  border-radius: var(--radius-sm);
  margin-bottom: 12px;
  line-height: 1.4;
}

/* Sampling presets */
.ss-preset {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 12px 14px;
  margin-bottom: 8px;
  cursor: pointer;
  transition: all 0.15s;
  min-height: 44px;
}
.ss-preset:active { background: var(--bg-alt); }
.ss-preset-required {
  border-color: #DC2626;
  border-left: 4px solid #DC2626;
}
.ss-preset-recommended {
  border-color: var(--primary-green);
  border-left: 4px solid var(--primary-green);
}
.ss-preset-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
}
.ss-preset-icon { font-size: 16px; }
.ss-preset-label {
  font-size: 14px;
  font-weight: 700;
  color: var(--text-dark);
  font-family: 'Inter', sans-serif;
}
.ss-preset-desc {
  font-size: 12px;
  color: var(--text-medium);
  line-height: 1.4;
}
.ss-preset-nrd {
  font-size: 11px;
  color: #991B1B;
  font-weight: 600;
  margin-top: 4px;
}

/* Two-depth sampling cards */
.ss-depth-card {
  background: var(--bg-alt);
  border-radius: 8px;
  padding: 10px 12px;
  margin: 6px 0;
  border-left: 3px solid var(--primary-green);
}
.ss-depth-header {
  font-size: 13px;
  color: var(--text-dark);
  margin-bottom: 4px;
}
.ss-depth-label {
  font-size: 11px;
  color: var(--text-light);
  font-family: monospace;
}
.ss-depth-instr {
  font-size: 12px;
  color: var(--text-medium);
  line-height: 1.4;
  margin-bottom: 4px;
}
.ss-depth-tool {
  font-size: 11px;
  color: var(--text-light);
  font-style: italic;
}

/* Disclaimer */
.ss-disclaimer {
  font-size: 11px;
  color: var(--text-light);
  padding: 16px;
  line-height: 1.5;
  text-align: center;
  font-style: italic;
  border-top: 1px solid var(--border);
  margin-top: 16px;
}

/* ─── Trial Countdown Banner ──────────────────────────────────────────── */
.trial-banner {
  text-align: center;
  padding: 10px 16px;
  font-size: 13px;
  font-weight: 600;
  font-family: 'Inter', sans-serif;
  border-radius: var(--radius-sm);
  margin: 8px 0 12px;
}
.trial-green {
  background: var(--light-green);
  color: var(--secondary-green);
}
.trial-yellow {
  background: #FEF9C3;
  color: #92400E;
}
.trial-red {
  background: #FEE2E2;
  color: #991B1B;
}
.trial-demo {
  background: #DBEAFE;
  color: #1E40AF;
}

/* ─── Market Benchmark Zones ──────────────────────────────────────────── */
.bench-badge {
  font-size: 11px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 8px;
  margin-top: 6px;
  display: inline-block;
  font-family: 'Inter', sans-serif;
}
.bench-badge-green { background: #DCFCE7; color: #166534; }
.bench-badge-yellow { background: #FEF9C3; color: #854D0E; }
.bench-badge-red { background: #FEE2E2; color: #991B1B; }
.price-card.bench-green { border-left: 3px solid #16A34A; }
.price-card.bench-yellow { border-left: 3px solid #CA8A04; }
.price-card.bench-red { border-left: 3px solid #DC2626; }

/* Loading screen tagline */
.loading-spinner::after {
  content: "Know more. Grow more. 🌽";
  display: block;
  font-size: 11px;
  color: var(--text-light);
  margin-top: 8px;
  font-family: "Inter", sans-serif;
  font-style: italic;
}
.ob-tagline {
  font-size: 11px;
  color: var(--text-light);
  font-style: italic;
  text-align: center;
  margin-top: 4px;
}
.header-tagline {
  font-size: 10px;
  color: var(--text-light);
  font-weight: 400;
  display: block;
  margin-top: -2px;
  letter-spacing: 0.3px;
}

/* ─── What-If Scenario Builder ────────────────────────────────────────────── */
.mplan-section-desc { font-size: 13px; color: var(--text-medium); margin: 0 0 12px; }
.whatif-crop-tabs { display: flex; gap: 6px; margin-bottom: 14px; }
.whatif-tab { padding: 8px 14px; border-radius: 20px; border: 1px solid var(--border); background: #fff; font-size: 13px; font-weight: 600; cursor: pointer; color: var(--text-medium); min-height: 44px; }
.whatif-tab.active { background: var(--primary-green); color: #fff; border-color: var(--primary-green); }
.whatif-row-header { display: grid; grid-template-columns: 80px 1fr 1fr; gap: 8px; font-size: 11px; font-weight: 600; text-transform: uppercase; color: var(--text-light); margin-bottom: 6px; padding: 0 4px; }
.whatif-row { display: grid; grid-template-columns: 80px 1fr 1fr; gap: 8px; margin-bottom: 8px; align-items: center; }
.whatif-tranche-label { font-size: 12px; color: var(--text-medium); font-weight: 500; }
.whatif-pct, .whatif-price { padding: 8px 10px; border: 1px solid var(--border); border-radius: 8px; font-size: 14px; width: 100%; min-height: 40px; text-align: center; }
.whatif-add-btn { background: none; border: 1px dashed var(--border); color: var(--text-medium); padding: 8px 14px; border-radius: 8px; font-size: 13px; cursor: pointer; margin-top: 4px; width: 100%; min-height: 40px; }
.whatif-warning { background: #FEF9C3; color: #854D0E; padding: 8px 12px; border-radius: 8px; font-size: 12px; margin-bottom: 10px; }
.whatif-result { margin-top: 14px; }
.whatif-result-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 10px; }
.whatif-result-card { background: #F8FAFC; border-radius: 12px; padding: 12px; text-align: center; border: 1px solid var(--border); }
.whatif-result-val { font-size: 20px; font-weight: 800; margin-bottom: 4px; }
.whatif-result-lbl { font-size: 11px; color: var(--text-light); font-weight: 500; }
.whatif-total { padding: 12px 16px; border-radius: 10px; font-size: 14px; font-weight: 700; text-align: center; }
.whatif-profit { background: #DCFCE7; color: #166534; }
.whatif-loss { background: #FEE2E2; color: #991B1B; }

/* ─── Storage Payoff Calculator ──────────────────────────────────────────── */
.storage-calc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 14px; }
.storage-calc-group { display: flex; flex-direction: column; gap: 4px; }
.storage-calc-label { font-size: 11px; font-weight: 600; color: var(--text-medium); text-transform: uppercase; }
.storage-calc-input { padding: 10px; border: 1px solid var(--border); border-radius: 8px; font-size: 14px; width: 100%; min-height: 40px; }
.storage-result-verdict { padding: 12px 16px; border-radius: 10px; font-size: 14px; font-weight: 700; text-align: center; margin-bottom: 12px; }
.storage-verdict-yes { background: #DCFCE7; color: #166534; }
.storage-verdict-no { background: #FEE2E2; color: #991B1B; }
.storage-result-breakdown { background: #F8FAFC; border-radius: 12px; padding: 12px; }
.storage-result-row { display: flex; justify-content: space-between; align-items: center; padding: 6px 0; border-bottom: 1px solid var(--border); font-size: 13px; color: var(--text-medium); }
.storage-result-row:last-child { border-bottom: none; }
.storage-result-total { font-weight: 700; color: var(--text-dark); }

/* ─── COT Report (Fund Positioning) ─────────────────────────────────────── */
.cot-report { }
.cot-header-meta { font-size: 11px; color: var(--text-light); margin-bottom: 10px; font-style: italic; }
.cot-crop-card { background: #fff; border-radius: 14px; padding: 14px; margin-bottom: 10px; border: 1px solid var(--border); }
.cot-crop-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.cot-crop-name { font-size: 14px; font-weight: 700; color: var(--text-dark); }
.cot-signal-badge { font-size: 11px; font-weight: 600; padding: 3px 8px; border-radius: 20px; }
.cot-rows { margin-bottom: 10px; }
.cot-row { display: flex; justify-content: space-between; font-size: 13px; color: var(--text-medium); padding: 3px 0; border-bottom: 1px solid var(--border); }
.cot-row:last-child { border-bottom: none; }
.cot-bar-wrap { margin-bottom: 8px; }
.cot-bar-label { display: flex; justify-content: space-between; font-size: 10px; color: var(--text-light); margin-bottom: 4px; }
.cot-bar-bg { height: 8px; background: #F1F5F9; border-radius: 4px; overflow: hidden; }
.cot-bar-fill { height: 100%; border-radius: 4px; }
.cot-note { font-size: 12px; color: var(--text-medium); font-style: italic; line-height: 1.5; }
.cot-edu { background: #F8FAFC; border-radius: 12px; padding: 12px; margin-top: 8px; }
.cot-edu-title { font-size: 12px; font-weight: 700; color: var(--text-dark); margin-bottom: 6px; }
.cot-edu-body { font-size: 12px; color: var(--text-medium); line-height: 1.6; }

/* ─── Crop Doctor — Field Scouting Timeline ──────────────────────────────── */
.cd-field-timeline-header { font-size: 13px; font-weight: 700; color: var(--text-dark); margin-bottom: 8px; display: flex; align-items: center; gap: 6px; }
.cd-timeline-count { background: #E2E8F0; color: #64748B; font-size: 11px; padding: 1px 7px; border-radius: 20px; font-weight: 600; }
.cd-field-timeline { position: relative; padding-left: 20px; border-left: 2px solid #E2E8F0; margin-left: 6px; }
.cd-timeline-entry { display: flex; align-items: flex-start; gap: 10px; padding: 6px 0; position: relative; }
.cd-timeline-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; margin-left: -25px; margin-top: 3px; border: 2px solid #fff; box-shadow: 0 0 0 1px #CBD5E1; }
.cd-timeline-info { flex: 1; min-width: 0; }
.cd-timeline-name { font-size: 13px; font-weight: 600; color: var(--text-dark); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cd-timeline-meta { font-size: 11px; color: var(--text-light); margin-top: 2px; }
.cd-timeline-notes { font-size: 11px; color: #64748B; margin-top: 2px; font-style: italic; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ─── Scale Ticket OCR Summary ───────────────────────────────────────────── */
.ticket-ocr-summary { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.ticket-ocr-summary span { background: #E8F5E9; color: #2E7D32; font-size: 11px; padding: 2px 8px; border-radius: 12px; font-weight: 600; }

/* ─── Employee Portal (PIN Timeclock) ────────────────────────────────────── */
.ep-welcome { text-align: center; margin-bottom: 24px; }
.ep-farm-name { font-size: 22px; font-weight: 800; color: var(--text-dark); }
.ep-instruction { font-size: 14px; color: var(--text-light); margin-top: 4px; }
.ep-pin-display { display: flex; justify-content: center; gap: 12px; margin: 20px 0 12px; }
.ep-pin-dot { width: 16px; height: 16px; border-radius: 50%; border: 2px solid var(--primary-green); background: transparent; transition: background 0.15s; }
.ep-pin-dot.filled { background: var(--primary-green); }
.ep-pin-error { text-align: center; color: #dc2626; font-size: 13px; padding: 8px; margin-bottom: 8px; }
.ep-keypad { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; max-width: 280px; margin: 0 auto; }
.ep-key { background: #fff; border: 1px solid var(--border); border-radius: 14px; padding: 18px; font-size: 22px; font-weight: 600; color: var(--text-dark); cursor: pointer; box-shadow: 0 1px 3px rgba(0,0,0,.06); transition: background 0.1s; -webkit-tap-highlight-color: transparent; }
.ep-key:active { background: #F1F5F9; }
.ep-key-clear { font-size: 13px; font-weight: 700; color: #64748B; }
.ep-key-del { font-size: 18px; color: #64748B; }
.ep-greeting { text-align: center; margin-bottom: 20px; }
.ep-greeting-name { font-size: 24px; font-weight: 800; color: var(--text-dark); }
.ep-greeting-time { font-size: 14px; color: var(--text-light); margin-top: 4px; }
.ep-status-card { background: #fff; border-radius: 16px; padding: 20px; text-align: center; margin-bottom: 20px; border: 1px solid var(--border); }
.ep-status-badge { display: inline-block; padding: 4px 14px; border-radius: 20px; font-size: 13px; font-weight: 700; margin-bottom: 10px; }
.ep-status-in { background: #DCFCE7; color: #16a34a; }
.ep-status-out { background: #F1F5F9; color: #64748B; }
.ep-status-since { font-size: 16px; color: var(--text-dark); font-weight: 600; }
.ep-status-hours { font-size: 13px; color: var(--text-light); margin-top: 4px; }
.ep-action-btns { display: flex; flex-direction: column; gap: 12px; max-width: 280px; margin: 0 auto 16px; }
.ep-action-btn { padding: 18px; border-radius: 14px; font-size: 18px; font-weight: 700; border: none; cursor: pointer; }
.ep-btn-in { background: var(--primary-green); color: #fff; }
.ep-btn-out { background: #ef4444; color: #fff; }
.ep-back-btn { display: block; text-align: center; width: 100%; max-width: 280px; margin: 0 auto; background: none; border: none; color: var(--text-light); font-size: 14px; cursor: pointer; padding: 8px; }
.ep-task-form { background: #F8FAFC; border-radius: 14px; padding: 14px; margin-bottom: 4px; }
.ep-label { font-size: 12px; font-weight: 600; color: var(--text-light); text-transform: uppercase; letter-spacing: 0.04em; display: block; }
.ep-select { width: 100%; padding: 10px 12px; border: 1.5px solid var(--border); border-radius: 10px; font-size: 15px; background: #fff; color: var(--text-dark); margin-top: 4px; }
.ep-input { width: 100%; padding: 10px 12px; border: 1.5px solid var(--border); border-radius: 10px; font-size: 15px; background: #fff; color: var(--text-dark); margin-top: 4px; }

/* ─── Onboarding — Risk Profile + Forward Contracts ─────────────────────── */
.ob-risk-options { display: flex; gap: 10px; margin-top: 8px; }
.ob-risk-card { flex: 1; background: #fff; border: 2px solid var(--border); border-radius: 14px; padding: 12px 8px; text-align: center; cursor: pointer; transition: border-color 0.15s; }
.ob-risk-card.selected { border-color: var(--primary-green); background: #F0FDF4; }
.ob-risk-icon { font-size: 24px; margin-bottom: 4px; }
.ob-risk-label { font-size: 13px; font-weight: 700; color: var(--text-dark); }
.ob-risk-desc { font-size: 11px; color: var(--text-light); margin-top: 3px; line-height: 1.3; }
.ob-fwd-row { margin-bottom: 8px; }
.ob-fwd-row-inner { display: flex; gap: 6px; align-items: center; }
.ob-fwd-row-inner input, .ob-fwd-row-inner select { padding: 6px 8px; border: 1px solid var(--border); border-radius: 8px; font-size: 13px; }

/* ─── Weekly Scouting Workflow ───────────────────────────────────────────── */
.sw-field-row { display: flex; justify-content: space-between; align-items: center; background: var(--card-bg); border-radius: 12px; padding: 12px 14px; margin-bottom: 8px; border: 1px solid var(--border); }
.sw-sev-btn { flex: 1; padding: 8px 4px; border-radius: 8px; border: 2px solid var(--border); background: #fff; font-size: 11px; font-weight: 600; cursor: pointer; text-align: center; color: var(--text-dark); transition: all 0.15s; }
.sw-sev-btn.selected { border-color: var(--primary-green); background: #F0FDF4; color: var(--primary-green); }
.sw-sev-btn[data-sev="severe"].selected { border-color: #f44336; background: #FEF2F2; color: #f44336; }
.sw-sev-btn[data-sev="critical"].selected { border-color: #9c27b0; background: #FDF4FF; color: #9c27b0; }
.sw-sev-btn[data-sev="moderate"].selected { border-color: #3B82F6; background: #EFF6FF; color: #3B82F6; }

/* ─── Field Coverage Mapping ─────────────────────────────────────────────── */
.fc-section-label { font-size: 11px; font-weight: 700; color: var(--text-light); text-transform: uppercase; letter-spacing: 0.06em; margin-bottom: 6px; }
.fc-op-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 4px; }
.fc-op-btn { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 10px 6px; background: var(--card-bg); border: 2px solid var(--border); border-radius: 12px; cursor: pointer; font-size: 12px; font-weight: 600; color: var(--text-dark); transition: all 0.15s; }
.fc-op-btn.active { border-color: var(--primary-green); background: #F0FDF4; color: var(--primary-green); }
.fc-width-btn { width: 44px; height: 44px; border-radius: 50%; border: 2px solid var(--border); background: var(--card-bg); font-size: 22px; font-weight: 700; cursor: pointer; display: flex; align-items: center; justify-content: center; color: var(--text-dark); }
.fc-preset-btn { padding: 6px 10px; border-radius: 20px; border: 1px solid var(--border); background: var(--card-bg); font-size: 12px; font-weight: 600; cursor: pointer; color: var(--text-dark); transition: all 0.1s; }
.fc-preset-btn:active { background: var(--primary-green); color: #fff; border-color: var(--primary-green); }
.fc-stats-bar { display: flex; background: var(--card-bg); border-bottom: 1px solid var(--border); padding: 10px 0; }
.fc-stat { flex: 1; text-align: center; padding: 4px 0; border-right: 1px solid var(--border); }
.fc-stat:last-child { border-right: none; }
.fc-stat-value { font-size: 20px; font-weight: 800; color: var(--primary-green); line-height: 1.1; }
.fc-stat-label { font-size: 10px; color: var(--text-light); text-transform: uppercase; letter-spacing: 0.04em; margin-top: 2px; }
.fc-history-row { display: flex; justify-content: space-between; align-items: center; background: var(--card-bg); border: 1px solid var(--border); border-radius: 10px; padding: 10px 12px; margin-bottom: 6px; }

/* ─── Seasonal Price Chart ───────────────────────────────────────────────── */
.sc-tab { padding: 4px 10px; border-radius: 12px; border: 1px solid var(--border); background: var(--card-bg); font-size: 12px; font-weight: 600; cursor: pointer; color: var(--text-dark); transition: all 0.15s; }
.sc-tab.active { background: var(--primary-green); color: #fff; border-color: var(--primary-green); }

/* ─── Crop Insurance Analyzer ───────────────────────────────────────────── */
.ci-urgent-banner { display: flex; align-items: flex-start; gap: 10px; background: #FEF3C7; border: 1px solid #F59E0B; border-radius: 12px; padding: 12px 14px; margin-bottom: 16px; }
.ci-urgent-icon { font-size: 1.4em; flex-shrink: 0; margin-top: 2px; }
.ci-urgent-text { font-size: 13px; color: #92400E; line-height: 1.4; }
.ci-urgent-text strong { display: block; font-size: 14px; margin-bottom: 2px; }
.ci-section { background: var(--card-bg); border-radius: 14px; padding: 14px 14px 16px; margin-bottom: 14px; border: 1px solid var(--border); }
.ci-section-title { font-size: 15px; font-weight: 700; color: var(--text-dark); margin-bottom: 6px; }
.ci-section-desc { font-size: 12px; color: var(--text-light); margin-bottom: 10px; line-height: 1.4; }
.ci-summary-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ci-summary-card { background: #F8FAFC; border: 1px solid var(--border); border-radius: 10px; padding: 12px; }
.ci-summary-crop { font-size: 15px; font-weight: 700; color: var(--text-dark); margin-bottom: 4px; }
.ci-summary-aph { font-size: 13px; font-weight: 600; color: #334155; }
.ci-summary-price, .ci-summary-market, .ci-summary-acres { font-size: 12px; color: var(--text-light); margin-top: 2px; }
.ci-table-wrap { overflow-x: auto; }
.ci-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.ci-table th { background: #F1F5F9; font-size: 11px; font-weight: 700; color: var(--text-light); text-transform: uppercase; letter-spacing: 0.04em; padding: 6px 8px; text-align: left; }
.ci-table td { padding: 7px 8px; border-top: 1px solid var(--border); color: var(--text-dark); }
.ci-table tr.ci-rec-row { background: #F0FDF4; }
.ci-rec-badge { display: inline-block; background: #16a34a; color: #fff; font-size: 10px; font-weight: 700; padding: 1px 6px; border-radius: 8px; margin-left: 6px; vertical-align: middle; }
.ci-edu-card { display: flex; flex-direction: column; gap: 10px; }
.ci-edu-item { background: #F8FAFC; border-left: 3px solid var(--primary-green); border-radius: 8px; padding: 10px 12px; }
.ci-edu-title { font-size: 13px; font-weight: 700; color: var(--text-dark); margin-bottom: 4px; }
.ci-edu-body { font-size: 12px; color: var(--text-medium); line-height: 1.4; }
.ci-floor-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ci-floor-card { background: linear-gradient(135deg, #F0FDF4, #DCFCE7); border: 1px solid #86EFAC; border-radius: 12px; padding: 12px; text-align: center; }
.ci-floor-label { font-size: 12px; font-weight: 600; color: #166534; margin-bottom: 4px; }
.ci-floor-price { font-size: 22px; font-weight: 800; color: #16a34a; line-height: 1.1; margin-bottom: 6px; }
.ci-floor-note { font-size: 11px; color: #15803d; line-height: 1.4; }

/* Streaming chat cursor */
.chat-bubble.streaming .stream-cursor {
  color: var(--primary-green);
  animation: blink 0.7s infinite;
  font-weight: bold;
}
@keyframes blink { 0%,100% { opacity: 1; } 50% { opacity: 0; } }

/* Disclaimer: subtle, above nav, not floating */
.legal-disclaimer {
    position: static !important;
    background: transparent !important;
    font-size: 9px !important;
    opacity: 0.5 !important;
    padding: 8px 14px 80px !important;
    text-align: center;
}

/* ─── Estate & Succession Planner ─────────────────────────────────────────── */
.ep-disclaimer {
  background: #FFF7ED;
  border: 1px solid #FED7AA;
  border-radius: 12px;
  padding: 12px 16px;
  margin: 12px 16px;
  font-size: 12px;
  color: #92400E;
  line-height: 1.5;
}
.ep-disclaimer strong { color: #78350F; }

.ep-hero {
  background: #1E3A5F;
  color: #fff;
  padding: 24px 20px 32px;
  border-radius: 0 0 32px 32px;
  text-align: center;
}
.ep-hero-label {
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  opacity: 0.75;
  margin-bottom: 6px;
}
.ep-hero-value {
  font-size: 40px;
  font-weight: 900;
  font-family: 'Inter', sans-serif;
  margin: 4px 0;
}
.ep-hero-sub {
  font-size: 14px;
  opacity: 0.85;
  margin-top: 6px;
}
.ep-status-badge {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 20px;
  margin-top: 10px;
}
.ep-status-draft     { background: rgba(255,255,255,0.15); color: #fff; }
.ep-status-in_progress { background: #DBEAFE; color: #1D4ED8; }
.ep-status-reviewed  { background: #D1FAE5; color: #065F46; }
.ep-status-finalized { background: #D1FAE5; color: #065F46; }

.ep-section {
  padding: 0 16px;
  margin-top: 20px;
}
.ep-section-title {
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  color: #64748B;
  margin-bottom: 10px;
}

/* Asset breakdown bar */
.ep-asset-bar {
  background: #E2E8F0;
  border-radius: 8px;
  height: 12px;
  overflow: hidden;
  display: flex;
  margin-bottom: 12px;
}
.ep-asset-bar-seg { height: 100%; transition: width 0.4s ease; }
.ep-asset-land     { background: #1D4ED8; }
.ep-asset-equip    { background: #7C3AED; }
.ep-asset-livestock { background: #D97706; }
.ep-asset-capital  { background: #059669; }
.ep-asset-insurance { background: #0891B2; }
.ep-asset-other    { background: #64748B; }

.ep-asset-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}
.ep-legend-item {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  color: #475569;
}
.ep-legend-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}

/* Stakeholder cards */
.ep-stakeholder-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 8px;
}
.ep-stakeholder-card {
  background: #fff;
  border: 1px solid #E2E8F0;
  border-radius: 16px;
  padding: 14px 12px;
  position: relative;
}
.ep-stakeholder-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #EFF6FF;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  margin-bottom: 8px;
}
.ep-stakeholder-name {
  font-size: 14px;
  font-weight: 700;
  color: #0F172A;
  margin-bottom: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ep-stakeholder-role {
  font-size: 11px;
  color: #64748B;
  margin-bottom: 6px;
}
.ep-stakeholder-badge {
  display: inline-block;
  font-size: 10px;
  font-weight: 600;
  padding: 2px 7px;
  border-radius: 8px;
}
.ep-badge-owner    { background: #DBEAFE; color: #1E40AF; }
.ep-badge-spouse   { background: #FCE7F3; color: #9D174D; }
.ep-badge-successor { background: #D1FAE5; color: #065F46; }
.ep-badge-heir     { background: #FEF3C7; color: #92400E; }
.ep-badge-employee { background: #F3F4F6; color: #374151; }
.ep-badge-advisor  { background: #EDE9FE; color: #5B21B6; }
.ep-badge-other    { background: #F1F5F9; color: #475569; }
.ep-stakeholder-pct {
  font-size: 11px;
  color: #475569;
  margin-top: 4px;
}
.ep-stakeholder-del {
  position: absolute;
  top: 8px;
  right: 8px;
  background: none;
  border: none;
  font-size: 16px;
  color: #CBD5E1;
  cursor: pointer;
  padding: 2px 4px;
  min-width: 24px;
  min-height: 24px;
  line-height: 1;
}
.ep-stakeholder-del:active { color: #EF4444; }

.ep-add-btn {
  width: 100%;
  background: #fff;
  border: 2px dashed #CBD5E1;
  border-radius: 16px;
  padding: 14px;
  font-size: 14px;
  font-weight: 600;
  color: #64748B;
  cursor: pointer;
  text-align: center;
  margin-top: 6px;
  min-height: 44px;
}
.ep-add-btn:active { background: #F8FAFC; }

/* Document checklist */
.ep-doc-item {
  background: #fff;
  border: 1px solid #E2E8F0;
  border-radius: 12px;
  padding: 12px 14px;
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  min-height: 44px;
}
.ep-doc-item:active { background: #F8FAFC; }
.ep-doc-icon {
  font-size: 20px;
  flex-shrink: 0;
  width: 32px;
  text-align: center;
}
.ep-doc-info { flex: 1; min-width: 0; }
.ep-doc-title { font-size: 14px; font-weight: 600; color: #0F172A; }
.ep-doc-type  { font-size: 12px; color: #64748B; margin-top: 1px; }
.ep-doc-status {
  font-size: 11px;
  font-weight: 700;
  padding: 3px 9px;
  border-radius: 8px;
  flex-shrink: 0;
  white-space: nowrap;
}
.ep-doc-needed      { background: #FEE2E2; color: #991B1B; }
.ep-doc-in_progress { background: #FEF3C7; color: #92400E; }
.ep-doc-completed   { background: #D1FAE5; color: #065F46; }
.ep-doc-filed       { background: #DBEAFE; color: #1E40AF; }

/* Progress bar */
.ep-progress-wrap {
  background: #E2E8F0;
  border-radius: 8px;
  height: 8px;
  overflow: hidden;
  margin-bottom: 6px;
}
.ep-progress-bar {
  height: 100%;
  background: #16A34A;
  border-radius: 8px;
  transition: width 0.4s ease;
}

/* Timeline */
.ep-timeline {
  position: relative;
  padding-left: 28px;
}
.ep-timeline::before {
  content: '';
  position: absolute;
  left: 10px;
  top: 6px;
  bottom: 6px;
  width: 2px;
  background: #E2E8F0;
}
.ep-timeline-item {
  position: relative;
  margin-bottom: 14px;
}
.ep-timeline-dot {
  position: absolute;
  left: -22px;
  top: 3px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: 2px solid #E2E8F0;
  background: #fff;
}
.ep-timeline-dot.pending      { border-color: #CBD5E1; background: #fff; }
.ep-timeline-dot.in_progress  { border-color: #F59E0B; background: #FEF3C7; }
.ep-timeline-dot.completed    { border-color: #16A34A; background: #16A34A; }
.ep-timeline-label {
  font-size: 14px;
  font-weight: 600;
  color: #0F172A;
  line-height: 1.3;
}
.ep-timeline-date {
  font-size: 12px;
  color: #64748B;
  margin-top: 2px;
}
.ep-timeline-del {
  background: none;
  border: none;
  font-size: 13px;
  color: #CBD5E1;
  cursor: pointer;
  padding: 0;
  float: right;
  margin-left: 6px;
}

/* Action items */
.ep-action-item {
  background: #fff;
  border: 1px solid #E2E8F0;
  border-radius: 12px;
  padding: 12px 14px;
  margin-bottom: 8px;
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.ep-action-priority {
  font-size: 10px;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 6px;
  flex-shrink: 0;
  margin-top: 2px;
  text-transform: uppercase;
}
.ep-priority-critical { background: #FEE2E2; color: #991B1B; }
.ep-priority-high     { background: #FEF3C7; color: #92400E; }
.ep-priority-medium   { background: #DBEAFE; color: #1E40AF; }
.ep-priority-low      { background: #F1F5F9; color: #475569; }
.ep-action-text { font-size: 13px; color: #334155; line-height: 1.45; }

/* Bobbie insight */
.ep-bobbie-card {
  background: linear-gradient(135deg, #1E3A5F 0%, #2563EB 100%);
  color: #fff;
  border-radius: 20px;
  padding: 18px;
  margin: 0 0 16px;
}
.ep-bobbie-header {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  font-size: 14px;
  margin-bottom: 8px;
}
.ep-bobbie-text {
  font-size: 13px;
  line-height: 1.6;
  opacity: 0.95;
}

/* Wizard steps */
.ep-wizard-step {
  padding: 0 20px 24px;
}
.ep-wizard-progress {
  display: flex;
  gap: 6px;
  margin-bottom: 24px;
}
.ep-wizard-dot {
  flex: 1;
  height: 4px;
  border-radius: 4px;
  background: #E2E8F0;
}
.ep-wizard-dot.active  { background: #1E3A5F; }
.ep-wizard-dot.done    { background: #16A34A; }
.ep-wizard-title {
  font-size: 22px;
  font-weight: 800;
  color: #0F172A;
  margin-bottom: 6px;
}
.ep-wizard-sub {
  font-size: 14px;
  color: #64748B;
  margin-bottom: 24px;
  line-height: 1.5;
}
.ep-entity-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 20px;
}
.ep-entity-card {
  background: #fff;
  border: 2px solid #E2E8F0;
  border-radius: 14px;
  padding: 14px 12px;
  cursor: pointer;
  text-align: center;
  transition: border-color 0.15s, background 0.15s;
  min-height: 44px;
}
.ep-entity-card.selected {
  border-color: #1E3A5F;
  background: #EFF6FF;
}
.ep-entity-card-title {
  font-size: 13px;
  font-weight: 700;
  color: #0F172A;
}
.ep-entity-card-desc {
  font-size: 11px;
  color: #64748B;
  margin-top: 3px;
}

/* Checklist items */
.ep-check-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid #F1F5F9;
  min-height: 44px;
  cursor: pointer;
}
.ep-check-item:last-child { border-bottom: none; }
.ep-check-box {
  width: 22px;
  height: 22px;
  border-radius: 6px;
  border: 2px solid #CBD5E1;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 1px;
  transition: background 0.15s, border-color 0.15s;
}
.ep-check-box.checked {
  background: #16A34A;
  border-color: #16A34A;
  color: #fff;
}
.ep-check-text {
  font-size: 14px;
  color: #334155;
  line-height: 1.4;
}
.ep-check-text.checked-text { text-decoration: line-through; color: #94A3B8; }

/* Tax summary card */
.ep-tax-card {
  background: #fff;
  border: 1px solid #E2E8F0;
  border-radius: 16px;
  padding: 16px;
  margin-bottom: 12px;
}
.ep-tax-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 7px 0;
  border-bottom: 1px solid #F1F5F9;
  font-size: 14px;
}
.ep-tax-row:last-child { border-bottom: none; }
.ep-tax-label { color: #475569; }
.ep-tax-value { font-weight: 700; color: #0F172A; }
.ep-tax-value.danger { color: #DC2626; }
.ep-tax-value.safe   { color: #16A34A; }
.ep-tax-total-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 0 4px;
  font-size: 15px;
  font-weight: 800;
  color: #0F172A;
}

/* Modal-style overlay for estate planner forms */
.ep-modal-overlay {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.5);
  z-index: 9000;
  display: flex;
  align-items: flex-end;
}
.ep-modal {
  background: #fff;
  border-radius: 24px 24px 0 0;
  padding: 24px 20px 40px;
  width: 100%;
  max-height: 85vh;
  overflow-y: auto;
}
.ep-modal-title {
  font-size: 18px;
  font-weight: 800;
  color: #0F172A;
  margin-bottom: 18px;
}

/* Print styles */
@media print {
  .bottom-nav,
  .btn-back,
  .ep-add-btn,
  .ep-stakeholder-del,
  .ep-timeline-del,
  #ep-menu-btn,
  nav { display: none !important; }

  .sub-header { border-bottom: 1px solid #ccc; }
  .ep-hero { background: #1E3A5F !important; -webkit-print-color-adjust: exact; color-adjust: exact; }
  .ep-bobbie-card { background: #1E3A5F !important; -webkit-print-color-adjust: exact; color-adjust: exact; }
  .ep-disclaimer { border: 1px solid #ccc; margin-bottom: 12px; }
  body { font-size: 12px; }
}


/* Taller field map for field detail */
.field-map-container { height: 300px !important; }
@media (min-height: 700px) { .field-map-container { height: 360px !important; } }

/* ═══════════════════════════════════════════════════════════
   DARK MODE
   ═══════════════════════════════════════════════════════════ */
[data-theme="dark"] {
  --bg-main: #0F172A;
  --bg-cream: #0F172A;
  --card-bg: #1E293B;
  --white: #1E293B;
  --text-dark: #F1F5F9;
  --text-medium: #CBD5E1;
  --text-light: #94A3B8;
  --border: #334155;
  --light-green: #064E3B;
}
[data-theme="dark"] body { background: #0F172A; color: #F1F5F9; }
[data-theme="dark"] .screen { background: #0F172A; }
[data-theme="dark"] .dashboard-header { background: #1E293B; border-color: #334155; }
[data-theme="dark"] .bottom-nav { background: #1E293B; border-color: #334155; }
[data-theme="dark"] .sub-header { background: #1E293B; border-color: #334155; color: #F1F5F9; }
[data-theme="dark"] .sub-header h2 { color: #F1F5F9; }
[data-theme="dark"] .card, [data-theme="dark"] .signal-card, [data-theme="dark"] .field-card,
[data-theme="dark"] .position-card, [data-theme="dark"] .lease-card, [data-theme="dark"] .notif-item {
  background: #1E293B; border-color: #334155; color: #F1F5F9;
}
[data-theme="dark"] .tile-card { background: #1E293B; border-color: #334155; }
[data-theme="dark"] .tile-card-label { color: #CBD5E1; }
[data-theme="dark"] .tile-card-value { color: #F1F5F9; }
[data-theme="dark"] .pill-tab { background: #334155; color: #CBD5E1; border-color: #475569; }
[data-theme="dark"] .pill-tab.active { background: var(--primary-green); color: #fff; }
[data-theme="dark"] input, [data-theme="dark"] select, [data-theme="dark"] textarea {
  background: #334155; color: #F1F5F9; border-color: #475569;
}
[data-theme="dark"] .shop-icon-circle { background: #334155; border-color: #475569; }
[data-theme="dark"] .shop-icon-label { color: #CBD5E1; }
[data-theme="dark"] .welcome-inner { color: #F1F5F9; }
[data-theme="dark"] .chat-bubble.assistant { background: #334155; color: #F1F5F9; }
[data-theme="dark"] .chat-bubble.user { background: var(--primary-green); color: #fff; }
[data-theme="dark"] .modal-content, [data-theme="dark"] .modal-body { background: #1E293B; color: #F1F5F9; }
[data-theme="dark"] .section-header { color: #F1F5F9; }
[data-theme="dark"] .nav-item { color: #94A3B8; }
[data-theme="dark"] .nav-item.active { color: var(--primary-green); }
[data-theme="dark"] .legal-disclaimer { color: #475569 !important; }
[data-theme="dark"] .hero-price { color: #F1F5F9; }
[data-theme="dark"] .notif-dropdown { background: #1E293B; border-color: #334155; }
[data-theme="dark"] .btn-back { color: #F1F5F9; }
[data-theme="dark"] h1, [data-theme="dark"] h2, [data-theme="dark"] h3 { color: #F1F5F9; }
[data-theme="dark"] .field-map-container { background: #1E293B; }
[data-theme="dark"] .dash-divider { border-color: #334155; }
.theme-toggle-option.active { background: var(--primary-green); color: #fff; border-radius: 8px; }
[data-theme="dark"] .theme-toggle { background: #334155; border-color: #475569; }

/* ─── Hay Calendar ──────────────────────────────────────────────────────── */
.hay-alert { background: #F0FDF4; border: 1px solid #86EFAC; border-radius: 8px; padding: 10px 12px; font-size: 13px; color: #166534; margin-bottom: 10px; font-weight: 500; }
.hay-status-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; gap: 8px; }
.hay-cut-status { font-size: 15px; font-weight: 700; padding: 6px 14px; border-radius: 8px; }
.hay-status-cut { background: #DCFCE7; color: #166534; }
.hay-status-watch { background: #FEF9C3; color: #854D0E; }
.hay-status-wait { background: #FEE2E2; color: #991B1B; }
.hay-drying-est { font-size: 13px; color: #475569; }
.hay-next-window { font-size: 13px; color: #1E40AF; background: #EFF6FF; border-radius: 8px; padding: 8px 12px; margin-bottom: 10px; }
.hay-strip { display: flex; gap: 4px; overflow-x: auto; padding-bottom: 4px; }
.hay-day { flex: 1; min-width: 52px; border-radius: 8px; padding: 6px 4px; text-align: center; font-size: 11px; border: 1px solid #E2E8F0; }
.hay-day.hay-green { background: #F0FDF4; border-color: #86EFAC; }
.hay-day.hay-yellow { background: #FEFCE8; border-color: #FDE047; }
.hay-day.hay-red { background: #FEF2F2; border-color: #FECACA; }
.hay-day-name { font-weight: 600; color: #1E293B; margin-bottom: 2px; }
.hay-day-icon { font-size: 16px; }
.hay-day-hi { font-weight: 600; color: #475569; }
.hay-rain-bar { height: 4px; background: #E2E8F0; border-radius: 2px; margin: 3px 2px; overflow: hidden; }
.hay-rain-fill { height: 100%; background: #60A5FA; border-radius: 2px; }
.hay-rain-pct { font-size: 10px; color: #64748B; }
.hay-wind { font-size: 10px; color: #94A3B8; }
.hay-bale { font-size: 10px; margin-top: 2px; }
.hay-legend { display: flex; gap: 12px; justify-content: center; margin-top: 8px; font-size: 11px; color: #64748B; }
.hay-legend-item { display: flex; align-items: center; gap: 4px; }
.hay-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
.hay-dot.hay-green { background: #86EFAC; }
.hay-dot.hay-yellow { background: #FDE047; }
.hay-dot.hay-red { background: #FECACA; }

/* Position delete button */
.pos-delete-btn {
  display: block;
  width: 100%;
  padding: 8px;
  margin-top: 8px;
  background: #FEE2E2;
  color: #DC2626;
  border: 1px solid #FECACA;
  border-radius: 8px;
  font-size: 14px;
  cursor: pointer;
  min-height: 44px;
}
.pos-delete-btn:active { background: #FECACA; }

/* Iron Rule disclaimer */
.pos-iron-rule-note {
  font-size: 11px;
  color: #94A3B8;
  text-align: center;
  padding: 8px 12px;
  border-top: 1px solid var(--border);
  margin-top: 8px;
}

/* Field detail: square map */
.field-map-container { width: 100%; aspect-ratio: 1; max-height: 350px; border-radius: 12px; overflow: hidden; }

/* Soil nutrient quick view */
.soil-nutrients-quick { margin: 12px 0; }
.soil-nutrients-quick h4 { font-size: 14px; margin-bottom: 8px; }
.soil-nut-grid { display: flex; gap: 6px; flex-wrap: wrap; }
.soil-nut-badge { padding: 6px 10px; border-radius: 8px; text-align: center; min-width: 52px; }
.soil-nut-badge .nut-label { display: block; font-size: 10px; font-weight: 600; color: #64748B; text-transform: uppercase; }
.soil-nut-badge .nut-val { display: block; font-size: 14px; font-weight: 700; }
.nut-good { background: #DCFCE7; color: #166534; border: 1px solid #BBF7D0; }
.nut-low { background: #FEF2F2; color: #991B1B; border: 1px solid #FECACA; }

/* Radar section */
.radar-section { margin-bottom: 16px; }
.radar-section h4 { font-size: 14px; margin-bottom: 8px; }

/* Precip chart */
.precip-chart-section { margin-bottom: 16px; }
.precip-chart-section h4 { font-size: 14px; margin-bottom: 8px; }

/* ─── Spray Calendar Week View ─────────────────────────────────────────── */
.spray-cal-section { margin-bottom: 24px; position: relative; }
.spray-cal-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.spray-cal-arrow { width: 44px; height: 44px; border: 1px solid var(--border); border-radius: 12px; background: #fff; font-size: 18px; font-weight: 600; color: var(--text-dark); cursor: pointer; display: flex; align-items: center; justify-content: center; font-family: 'Inter', sans-serif; }
.spray-cal-arrow:active { background: #f1f5f9; }
.spray-cal-title { font-weight: 700; font-size: 15px; color: var(--text-dark); }
.spray-wind-slider-row { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; padding: 10px 14px; background: #fff; border: 1px solid var(--border); border-radius: 16px; }
.spray-wind-label { font-size: 13px; font-weight: 600; color: var(--text-dark); white-space: nowrap; }
.spray-wind-slider { flex: 1; height: 6px; -webkit-appearance: none; appearance: none; background: var(--border); border-radius: 3px; outline: none; }
.spray-wind-slider::-webkit-slider-thumb { -webkit-appearance: none; width: 22px; height: 22px; border-radius: 50%; background: var(--primary-green); cursor: pointer; border: 2px solid #fff; box-shadow: 0 1px 4px rgba(0,0,0,0.15); }
.spray-wind-slider::-moz-range-thumb { width: 22px; height: 22px; border-radius: 50%; background: var(--primary-green); cursor: pointer; border: 2px solid #fff; box-shadow: 0 1px 4px rgba(0,0,0,0.15); }
.spray-wind-value { font-size: 14px; font-weight: 700; color: var(--primary-green); white-space: nowrap; min-width: 52px; text-align: right; }
.spray-cal-grid { display: flex; flex-direction: column; gap: 6px; }
.spray-cal-day { background: #fff; border: 1px solid var(--border); border-radius: 16px; padding: 10px 12px; }
.spray-cal-day.spray-cal-today { border-color: var(--primary-green); border-width: 2px; }
.spray-cal-day-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.spray-cal-day-name { font-weight: 700; font-size: 14px; color: var(--text-dark); }
.spray-cal-day-date { font-size: 12px; color: #64748b; }
.spray-cal-hours { display: flex; gap: 3px; flex-wrap: wrap; }
.spray-cal-hour { min-width: 44px; min-height: 44px; border-radius: 10px; display: flex; align-items: center; justify-content: center; cursor: pointer; flex: 1; transition: transform 0.1s; }
.spray-cal-hour:active { transform: scale(0.93); }
.spray-cal-hour-label { font-size: 11px; font-weight: 600; color: #fff; pointer-events: none; }
.spray-cal-sprayable { background: var(--primary-green); }
.spray-cal-marginal { background: #94a3b8; }
.spray-cal-marginal .spray-cal-hour-label { color: #fff; }
.spray-cal-no-spray { background: #f1f5f9; }
.spray-cal-no-spray .spray-cal-hour-label { color: #94a3b8; }
.spray-cal-no-data { font-size: 12px; color: #94a3b8; text-align: center; padding: 10px 0; }
.spray-cal-badge { display: inline-block; margin-top: 8px; padding: 4px 10px; border-radius: 20px; font-size: 12px; font-weight: 700; color: var(--primary-green); background: #f0fdf4; border: 1px solid #bbf7d0; }
.spray-cal-tooltip { position: absolute; z-index: 20; background: #fff; border: 1px solid var(--border); border-radius: 14px; padding: 12px 14px; box-shadow: 0 4px 16px rgba(0,0,0,0.10); min-width: 200px; max-width: 260px; }
.spray-cal-tip-header { font-weight: 700; font-size: 13px; color: var(--text-dark); margin-bottom: 6px; }
.spray-cal-tip-row { font-size: 13px; color: #475569; padding: 2px 0; }

/* ─── Universal Export FAB ────────────────────────────────────────────── */
.export-fab-wrap {
  position: fixed;
  bottom: 80px;
  right: 16px;
  z-index: 999;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
}
.export-fab-wrap.hidden { display: none; }
.export-fab-btn {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: var(--primary-green);
  border: none;
  box-shadow: 0 4px 14px rgba(0,0,0,0.18);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: transform 0.15s, box-shadow 0.15s;
}
.export-fab-btn:active { transform: scale(0.92); }
.export-fab-btn:hover { box-shadow: 0 6px 20px rgba(0,0,0,0.24); }
.export-fab-menu {
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.14);
  border: 1px solid var(--border);
  overflow: hidden;
  min-width: 140px;
}
.export-fab-menu.hidden { display: none; }
.export-fab-opt {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 12px 16px;
  border: none;
  background: none;
  font-size: 14px;
  font-weight: 600;
  color: var(--text-dark);
  cursor: pointer;
  transition: background 0.12s;
}
.export-fab-opt:hover { background: #f1f5f9; }
.export-fab-opt svg { flex-shrink: 0; color: #64748b; stroke: #64748b; }

/* ─── Universal Print Stylesheet ──────────────────────────────────────── */
@media print {
  /* Hide non-essential UI */
  .bottom-nav,
  .export-fab-wrap,
  .sub-header .btn-back,
  .btn-icon-sm,
  .toast,
  .modal-backdrop,
  #toast,
  [class*="fab"],
  .nav-item,
  .demo-banner,
  .pwa-banner {
    display: none !important;
  }

  /* Show only the active screen */
  .screen { display: none !important; }
  .screen.active {
    display: block !important;
    position: static !important;
    overflow: visible !important;
    height: auto !important;
    min-height: 0 !important;
  }

  /* Clean formatting */
  body, .app-wrap, .screen {
    background: #fff !important;
    color: #000 !important;
    font-size: 12px !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  .app-wrap {
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  /* GrainGenius print header */
  body::before {
    content: "GrainGenius — Printed " attr(data-print-screen) " — " attr(data-date);
    display: block;
    text-align: center;
    font-size: 16px;
    font-weight: 700;
    color: #166534;
    padding: 12px 0 8px;
    border-bottom: 2px solid #166534;
    margin-bottom: 16px;
  }
  body::after {
    content: "Generated by GrainGenius • graingenius.app";
    display: block;
    text-align: center;
    font-size: 10px;
    color: #94a3b8;
    padding-top: 16px;
    border-top: 1px solid #e2e8f0;
    margin-top: 24px;
  }

  /* Card styling for print */
  .card, [class*="card"] {
    box-shadow: none !important;
    border: 1px solid #e2e8f0 !important;
    break-inside: avoid;
    page-break-inside: avoid;
  }

  /* Sub headers */
  .sub-header {
    background: #fff !important;
    border-bottom: 1px solid #e2e8f0 !important;
    position: static !important;
  }
  .sub-header h2 {
    color: #0f172a !important;
    font-size: 18px !important;
  }

  /* Page breaks */
  .screen > .sub-content { overflow: visible !important; }
  h2, h3 { page-break-after: avoid; }

  /* Links */
  a { color: #000 !important; text-decoration: underline !important; }

  /* Tables */
  table { border-collapse: collapse !important; width: 100% !important; }
  th, td { border: 1px solid #cbd5e1 !important; padding: 6px 8px !important; text-align: left !important; }
  th { background: #f1f5f9 !important; font-weight: 700 !important; }
}

/* ─── CropWatch Soil Temperature ────────────────────────────────────────── */
.cw-planting-section { margin-top: 10px; padding-top: 10px; border-top: 1px solid #E2E8F0; }
.cw-planting-title { font-size: 12px; font-weight: 700; color: #0F172A; margin-bottom: 6px; text-transform: uppercase; letter-spacing: 0.5px; }
.cw-plant-row { display: flex; align-items: center; gap: 6px; margin-bottom: 4px; font-size: 12px; }
.cw-plant-crop { font-weight: 600; color: #334155; min-width: 90px; }
.cw-plant-status { font-weight: 500; }
.cw-plant-ready { color: #15803D; }
.cw-plant-cold { color: #DC2626; }
@media (prefers-color-scheme: dark) {
  .cw-planting-title { color: #E2E8F0; }
  .cw-plant-crop { color: #CBD5E1; }
  .cw-planting-section { border-top-color: #334155; }
}

/* ─── Report Center Filters ─────────────────────────────────────────────── */
.rpt-filters {
  margin-bottom: 16px;
}
.rpt-filter-row {
  display: flex;
  gap: 10px;
}
.rpt-filter-select {
  flex: 1;
  min-height: 44px;
  padding: 8px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: #fff;
  font-size: 14px;
  font-weight: 600;
  color: var(--text-dark);
  -webkit-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2364748B' d='M2 4l4 4 4-4'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
}

/* ─── Report Center: comprehensive print stylesheet ─────────────────────── */
@media print {
  /* Hide all navigation and UI chrome */
  .bottom-nav,
  .sub-header .btn-back,
  .rpt-export-dropdown,
  .rpt-filters,
  .rpt-report-card,
  .rpt-card-grid,
  nav,
  .legal-disclaimer,
  #rv-export-btn {
    display: none !important;
  }

  /* Show details content without summary toggle */
  details[open] > summary { display: none !important; }
  details[open] > *:not(summary) { display: block !important; }

  /* Show print header */
  .rpt-print-header {
    display: block !important;
    text-align: center;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 2px solid #333;
  }
  .rpt-print-logo {
    font-size: 20px;
    font-weight: 900;
    color: #000;
  }
  .rpt-print-date {
    font-size: 11px;
    color: #666;
  }

  /* Make screens fill page */
  .screen {
    display: block !important;
    position: static !important;
    overflow: visible !important;
    height: auto !important;
  }
  .sub-content {
    overflow: visible !important;
    height: auto !important;
    padding: 0 !important;
  }
  #screen-report-viewer { display: block !important; }

  /* Report cards print cleanly */
  .rpt-card {
    break-inside: avoid;
    page-break-inside: avoid;
    border: 1px solid #ccc !important;
    box-shadow: none !important;
    margin-bottom: 10px;
  }

  /* Preserve colors for bars and indicators */
  .rpt-bar-fill,
  .rpt-position-fill {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  /* Tables print nicely */
  .rpt-table { font-size: 11px; }
  .rpt-table th {
    background: #f5f5f5 !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }
  .rpt-table td, .rpt-table th {
    border: 1px solid #ddd !important;
    padding: 4px 6px;
  }

  /* Rows */
  .rpt-row { border-bottom-color: #eee !important; }

  /* Highlight boxes */
  .rpt-highlight-good,
  .rpt-highlight-bad {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  /* Page setup */
  @page {
    margin: 0.5in;
    size: letter;
  }

  body {
    font-size: 12px;
    color: #000;
    background: #fff !important;
  }

  /* Sub header visible for title */
  .sub-header {
    border-bottom: 1px solid #ccc;
    padding: 8px 0;
    text-align: center;
  }
  .sub-header h2 {
    font-size: 18px;
    color: #000;
  }
}

/* ─── Auth: Forgot Password Success ──────────────────────────────────── */
.forgot-success {
  background: #f0fdf4;
  color: #166534;
  border: 1px solid #bbf7d0;
  border-radius: 10px;
  padding: 10px 14px;
  font-size: 13px;
  margin-bottom: 12px;
  text-align: center;
}

/* ─── Bobbie Chat Upgrade — Markdown + Enhanced Cards ───────────────── */

/* Markdown lists inside chat bubbles */
.chat-bubble ul.chat-list,
.chat-card-body ul.chat-list {
  margin: 6px 0;
  padding-left: 18px;
  list-style: disc;
}
.chat-bubble ul.chat-list li,
.chat-card-body ul.chat-list li {
  margin: 2px 0;
  line-height: 1.5;
}
.chat-bubble ol,
.chat-card-body ol {
  margin: 6px 0;
  padding-left: 22px;
}
.chat-bubble code,
.chat-card-body code {
  background: rgba(0,0,0,0.08);
  padding: 1px 5px;
  border-radius: 4px;
  font-size: 12px;
  font-family: 'SF Mono', 'Fira Code', monospace;
}
.chat-bubble em,
.chat-card-body em {
  font-style: italic;
}

/* Enhanced chat card styles for new intents */
.chat-card-body strong {
  color: var(--text-dark);
  font-weight: 700;
}
.chat-bubble.assistant.chat-card {
  color: var(--text-dark);
}

/* Scrollable chips row with fade edges */
.chat-chips {
  flex-wrap: nowrap;
  scrollbar-width: none;
  -ms-overflow-style: none;
  padding-bottom: 4px;
}
.chat-chips::-webkit-scrollbar {
  display: none;
}
.chip:hover {
  background: #E8F5E9;
  border-color: var(--primary-green);
}

/* Streaming bubble polish */
.chat-bubble.streaming {
  min-height: 32px;
}
.chat-bubble.assistant.streaming .stream-cursor {
  color: #fff;
}

/* Dark mode overrides for new elements */
[data-theme="dark"] .chat-bubble code,
[data-theme="dark"] .chat-card-body code {
  background: rgba(255,255,255,0.1);
  color: #e2e8f0;
}
[data-theme="dark"] .chat-card-body strong {
  color: #f1f5f9;
}
[data-theme="dark"] .chip:hover {
  background: #1e293b;
  border-color: var(--primary-green);
}

/* ─── Bobbie Chat Full-Height Fix ─────────────────────────────── */
#screen-agent .legal-disclaimer { display: none; }
#screen-agent .bottom-nav { flex-shrink: 0; }
#screen-agent .chat-messages { 
  flex: 1; 
  min-height: 0;
  padding-bottom: 8px; 
}
#screen-agent .chat-chips {
  flex-shrink: 0;
  overflow-x: auto;
  padding: 8px 16px;
  max-height: 50px;
}
#screen-agent .chat-input-bar {
  flex-shrink: 0;
  padding: 8px 16px;
  background: var(--white);
  border-top: 1px solid var(--border);
}

/* ─── Floating Bobbie FAB ─────────────────────────────────────── */
#bobbie-fab {
  position: fixed;
  bottom: 80px;
  right: 16px;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: var(--primary-green);
  border: 2px solid #fff;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 99;
  transition: transform 0.2s;
}
#bobbie-fab:active { transform: scale(0.92); }
/* Hide FAB on Bobbie chat screen and when export FAB is showing */
#screen-agent.active ~ #bobbie-fab { display: none; }
.screen.active[id="screen-agent"] ~ #bobbie-fab { display: none; }

/* ─── Bobbie Chat Upload Buttons ──────────────────────────────── */
.chat-upload-btn { flex-shrink: 0; }
#screen-agent .chat-input-bar {
  display: flex;
  align-items: center;
  gap: 2px;
}