/* Yield & Trim Loss Calculator — tool-specific styles */

.evvy-unit-toggle { display: inline-flex; gap: 0.35rem; flex-wrap: wrap; }
.evvy-unit-toggle .evvy-chip { padding: 0.2rem 0.55rem; font-size: 0.8rem; }
.evvy-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.evvy-item-input { font-size: 1.05rem; padding: 0.65rem 0.9rem; }

/* Note cards */
.evvy-note-card {
  display: flex; align-items: flex-start; gap: 0.7rem; margin-top: 1rem;
  padding: 0.85rem 1rem; border-radius: var(--evvy-radius, 8px); font-size: 0.9rem; line-height: 1.5;
  border-left: 3px solid var(--cluster-dark, #7C4A1A);
  background: color-mix(in srgb, var(--cluster-dark, #7C4A1A) 6%, transparent);
}
.evvy-note-card i { font-size: 1.15rem; color: var(--cluster-dark, #7C4A1A); margin-top: 0.1rem; }
.evvy-note-info { border-left-color: var(--evvy-text-secondary); background: color-mix(in srgb, var(--evvy-text-secondary, #64748b) 7%, transparent); }
.evvy-note-info i { color: var(--evvy-text-secondary); }

/* Menu planner */
.evvy-menu-list { display: flex; flex-direction: column; gap: 0.4rem; }
.evvy-menu-total { margin-top: 0.7rem; padding: 0.65rem 0.9rem; border-radius: var(--evvy-radius, 8px); background: var(--cluster-surface, #FDF3E7); font-size: 0.95rem; }
[data-bs-theme="dark"] .evvy-menu-total { background: var(--evvy-surface-alt, #12233a); }

.evvy-saved-item { display: flex; align-items: center; gap: 0.65rem; padding: 0.5rem 0.75rem; border: 1px solid var(--evvy-border-color, #DEE2E6); border-radius: var(--evvy-radius, 8px); background: var(--bs-body-bg, #fff); }
.evvy-saved-name { font-weight: 600; }
.evvy-saved-meta { color: var(--evvy-text-secondary); font-size: 0.82rem; flex: 1; }
.evvy-saved-del { border: none; background: transparent; color: var(--evvy-text-secondary); cursor: pointer; }
.evvy-saved-del:hover { color: #c0392b; }
[data-bs-theme="dark"] .evvy-saved-item { background: var(--evvy-surface-alt, #12233a); }

@media (max-width: 575.98px) {
  .evvy-two-col { grid-template-columns: 1fr; }
  .evvy-unit-toggle { width: 100%; margin-top: 0.4rem; }
  .evvy-results-row { grid-template-columns: 1fr !important; }
}