/* Coffee Brew Method 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 auto; gap: 1rem; align-items: start; }

.evvy-strength-readout {
  margin-left: auto;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--cluster-dark, #7C4A1A);
}

.evvy-espresso-note, .form-text { color: var(--evvy-text-secondary); }

/* Brew facts row */
.evvy-brew-facts {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.75rem;
  margin-top: 1rem;
}
.evvy-brew-fact {
  padding: 0.75rem 0.85rem;
  border: 1px solid var(--evvy-border-color, #DEE2E6);
  border-radius: var(--evvy-radius-lg, 12px);
  background: var(--bs-body-bg, #fff);
}
.evvy-brew-fact-k {
  display: block;
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--evvy-text-secondary);
  margin-bottom: 0.25rem;
}
.evvy-brew-fact-k i { color: var(--cluster-dark, #7C4A1A); }
.evvy-brew-fact-v { font-weight: 600; font-size: 0.95rem; line-height: 1.35; }
.evvy-gset { font-weight: 400; font-size: 0.8rem; color: var(--evvy-text-secondary); }

/* Pour schedule */
.evvy-pour-wrap { margin-top: 1.25rem; }
.evvy-pour-title { font-weight: 600; margin-bottom: 0.5rem; }
.evvy-pour-table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
.evvy-pour-table th {
  text-align: left; font-weight: 600; color: var(--evvy-text-secondary);
  border-bottom: 2px solid var(--evvy-border-color, #DEE2E6); padding: 0.5rem 0.65rem;
}
.evvy-pour-table td { padding: 0.5rem 0.65rem; border-bottom: 1px solid var(--evvy-border-color, #DEE2E6); }
.evvy-pour-table td:first-child { font-weight: 600; }
.evvy-pour-table th:not(:first-child), .evvy-pour-table td:not(:first-child) { text-align: right; }

/* Note / dial-in cards */
.evvy-note-card {
  display: flex; align-items: flex-start; gap: 0.7rem; margin-top: 0.85rem;
  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; }

/* Bean profiles */
.evvy-bean-list { display: flex; flex-direction: column; gap: 0.5rem; }
.evvy-bean-item {
  display: flex; align-items: center; gap: 0.65rem; flex-wrap: wrap;
  padding: 0.55rem 0.8rem; border: 1px solid var(--evvy-border-color, #DEE2E6);
  border-radius: var(--evvy-radius, 8px); background: var(--bs-body-bg, #fff);
}
.evvy-bean-name { font-weight: 600; }
.evvy-bean-meta { color: var(--evvy-text-secondary); font-size: 0.82rem; flex: 1; }
.evvy-bean-use {
  border: 1px solid var(--cluster-dark, #7C4A1A); background: transparent; color: var(--cluster-dark, #7C4A1A);
  border-radius: 50rem; padding: 0.15rem 0.75rem; font-size: 0.8rem; font-weight: 600; cursor: pointer;
}
.evvy-bean-use:hover { background: var(--cluster-dark, #7C4A1A); color: #fff; }
.evvy-bean-del { border: none; background: transparent; color: var(--evvy-text-secondary); cursor: pointer; font-size: 0.85rem; }
.evvy-bean-del:hover { color: #c0392b; }

/* Dark mode */
[data-bs-theme="dark"] .evvy-brew-fact,
[data-bs-theme="dark"] .evvy-bean-item {
  background: var(--evvy-surface-alt, #12233a);
}

/* Mobile */
@media (max-width: 575.98px) {
  .evvy-two-col { grid-template-columns: 1fr; }
  .evvy-brew-facts { grid-template-columns: 1fr; }
  .evvy-unit-toggle { width: 100%; margin-top: 0.4rem; }
}
