/* «Αξιολόγηση» (ARCHITECTURE.md, ενότητα 7): η εσωτερική οθόνη με τις τρεις στήλες (α) σήμερα, (β) αγορά, (γ) ENERGYS.
   Χρώματα και αποστάσεις από την αρχή του app.css (docs/DESIGN.md). */

.evaluation-start { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 16px; }
.evaluation-start .button { flex: 1 1 220px; }
.evaluation-form { max-width: var(--reading-max); display: flex; flex-direction: column; gap: 14px; margin-top: 16px; }
.evaluation-form h2 { margin: 0; }
.evaluation-details { display: flex; flex-direction: column; gap: 4px; }
.evaluation-details .check span, .evaluation-actions .check span { min-width: 0; overflow-wrap: anywhere; }
.evaluation-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0 16px; }
.evaluation-grid .field { min-width: 0; }
.evaluation-grid .field.is-unclear input, .evaluation-grid .field.is-unclear select { border-color: var(--warning); box-shadow: 0 0 0 1px var(--warning); }

.evaluation-wait { display: flex; align-items: center; gap: 14px; }
.evaluation-wait h2 { margin: 0 0 4px; }
.evaluation-wait__dot { flex: none; width: 14px; height: 14px; border-radius: 50%; background: var(--green); animation: evaluation-pulse 1.2s ease-in-out infinite; }
@keyframes evaluation-pulse { 50% { opacity: 0.3; } }
@media (prefers-reduced-motion: reduce) { .evaluation-wait__dot { animation: none; } }

.evaluation-basis { margin: 0 0 12px; }
.evaluation-compare { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; margin-bottom: 16px; }
.evaluation-option {
    display: flex; flex-direction: column; gap: 6px; min-width: 0;
    padding: 16px; border-radius: var(--radius-lg); border: 1px solid var(--border); background: var(--surface);
}
.evaluation-option h2 { margin: 0; font-size: 17px; overflow-wrap: anywhere; }
.evaluation-option p { margin: 0; overflow-wrap: anywhere; }
.evaluation-option__tag { font-size: 12px; font-weight: 600; letter-spacing: 0.02em; color: var(--text-muted); text-transform: uppercase; }
.evaluation-option__cost { font-size: 26px; font-weight: 700; color: var(--ink); }
.evaluation-option--ours { border-color: var(--green); background: var(--active); }
.evaluation-option--ours .evaluation-option__tag { color: var(--ok); }
.evaluation-saving { font-weight: 600; color: var(--ok); }
.evaluation-saving--none { color: var(--text-muted); font-weight: 400; }
.evaluation-ai { margin-bottom: 16px; }
.evaluation-ai h2 { margin-top: 0; }
.evaluation-actions .card { display: flex; flex-direction: column; gap: 12px; }
.evaluation-actions h2 { margin: 0; }

@media (min-width: 700px) {
    .evaluation-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .evaluation-compare { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .evaluation-compare--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1100px) {
    .evaluation-review { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
    .evaluation-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}