/* Recommendations view (#487). Every selector starts with .agc-recs. Mobile first: one column at 375px, two from 700px.
   The state badge always carries its word, so meaning never rests on colour. */
.agc-recs { font: 16px/1.45 system-ui, sans-serif; color: #1c1b19; max-width: 100%; box-sizing: border-box; }
.agc-recs *, .agc-recs *::before, .agc-recs *::after { box-sizing: inherit; }
.agc-recs-status { margin: 0 0 8px; font-weight: 600; }
.agc-recs-counts { list-style: none; margin: 0 0 12px; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: .9rem; }
.agc-recs-list { display: grid; grid-template-columns: 1fr; gap: 12px; }
.agc-recs-card { border: 1px solid #cfc9bd; border-radius: 8px; padding: 12px; background: #fff; min-width: 0; overflow-wrap: anywhere; }
.agc-recs-top { margin: 0 0 4px; }
.agc-recs-badge { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: .8rem; font-weight: 700; border: 2px solid #1c1b19; background: #fff; }
.agc-recs-badge[data-state="suggested"] { border-style: dashed; }
.agc-recs-badge[data-state="confirmed_decision"] { background: #e3eefb; }
.agc-recs-badge[data-state="dispatched"] { background: #fff6df; }
.agc-recs-badge[data-state="effect_verified"] { background: #e2f3e5; }
.agc-recs-badge[data-state="measured"] { background: #1c1b19; color: #fff; }
.agc-recs-state-help { font-size: .85rem; color: #4a463e; }
.agc-recs-action { margin: 4px 0 8px; font-size: 1.02rem; }
.agc-recs-fields { margin: 0 0 8px; }
.agc-recs-field { margin: 0 0 6px; }
.agc-recs-field dt { font-size: .8rem; color: #4a463e; }
.agc-recs-field dd { margin: 0; }
.agc-recs-missing { font-style: italic; color: #5c5750; }
.agc-recs-sub { margin: 8px 0 4px; font-size: .9rem; }
.agc-recs-evidence { margin: 0 0 8px; padding-left: 20px; font-size: .9rem; }
.agc-recs-caveat { margin: 4px 0; padding: 6px 8px; border-left: 4px solid #9a6b00; background: #fff6df; font-size: .85rem; }
.agc-recs-note { margin: 4px 0; font-size: .85rem; color: #4a463e; }
.agc-recs-more { min-height: 44px; margin-top: 12px; padding: 0 16px; font: inherit; border: 1px solid #1c1b19; border-radius: 8px; background: #fff; cursor: pointer; }
.agc-recs-more:focus-visible { outline: 3px solid #0b4f8a; outline-offset: 2px; }
@media (min-width: 700px) { .agc-recs-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
