/* Styles for the legal checker, the reply classifier and the warm-up calculator. Builds on the .tool styles in site.css. */
.tool-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
.tool-grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.tool-field select, .tool-field input[type="date"], .tool-field input[type="number"] { font: 400 1rem/1.5 var(--sans); color: var(--ink); background: var(--paper); border: 1.5px solid #8f8a80; border-radius: 10px; padding: 10px 12px; width: 100%; min-height: 46px; }
.tool-field select:focus-visible, .tool-field input:focus-visible, .tool-field textarea:focus-visible { outline: 3px solid var(--ink); outline-offset: 1px; border-color: var(--ink); }
.tool-field .hint { font-size: .84rem; line-height: 1.45; color: var(--muted); }
.tool-check { display: flex; align-items: center; gap: 10px; margin: 0 0 14px; }
.tool-check input { width: 22px; height: 22px; accent-color: var(--go); flex: none; }
.tool-check label { font-size: .95rem; }
.tool-note.inline { display: inline; margin: 0 -6px 0 0; }
.tool-actions { margin-bottom: 14px; }

.verdict-card { margin: 8px 0 12px; padding: 18px 20px; border-radius: 16px; background: #f3f2ee; border-left: 6px solid #8f8a80; min-height: 8rem; }
.verdict-card[data-v="allowed"], .verdict-card[data-v="go"] { background: var(--go-soft); border-left-color: var(--go); }
.verdict-card[data-v="conditions"], .verdict-card[data-v="wait"] { background: var(--mark-soft); border-left-color: #8a6d00; }
.verdict-card[data-v="consent"], .verdict-card[data-v="stop"] { background: #fde8e6; border-left-color: #8f1c12; }
.prose .verdict-card p { margin: 0; }
.verdict-card .vlabel { font: 600 1.35rem/1.25 var(--sans); letter-spacing: -.01em; color: var(--ink); }
.verdict-card .vwhy { margin-top: 6px; color: var(--ink-2); font-size: .98rem; }
.prose .verdict-card .vnote { margin-top: 10px; font-size: .92rem; color: var(--ink); }
.verdict-card h3 { font: 600 .82rem/1.3 var(--sans); text-transform: uppercase; letter-spacing: .07em; color: var(--ink-2); margin: 18px 0 6px; }
.prose .verdict-card ul.vlist { margin: 0; padding-left: 1.2em; }
.verdict-card .vlist li { margin: 0 0 6px; font-size: .96rem; line-height: 1.5; color: var(--ink); }
.prose .verdict-card .vlinks { margin-top: 14px; font-size: .9rem; color: var(--ink-2); }
.verdict-card .vlinks a { color: var(--ink); font-weight: 600; }
.verdict-card .vlinks .vsrc { display: block; margin-top: 4px; }
.verdict-card[hidden], .verdict-card [hidden] { display: none; }
.tool textarea[readonly] { background: #f3f2ee; }
.table-wrap { overflow-x: auto; max-width: 100%; margin: 6px 0 4px; }
.table-wrap table.plain { display: table; min-width: 100%; }
.table-wrap table.plain th, .table-wrap table.plain td { min-width: 0; font-variant-numeric: tabular-nums; }
#gwc-table tr.target td { background: var(--go-soft); font-weight: 600; color: var(--ink); }
#gwc-table tr.skip td { color: var(--muted); }
#gwc-google .q { display: block; margin-top: 6px; padding-left: 12px; border-left: 3px solid rgba(20,20,20,.18); color: var(--ink-2); font-size: .92rem; }
@media (max-width: 640px) {
  .tool-grid, .tool-grid.three { grid-template-columns: minmax(0, 1fr); }
  .verdict-card { padding: 16px; }
  .verdict-card .vlabel { font-size: 1.2rem; }
  .table-wrap table.plain th, .table-wrap table.plain td { padding: 9px 8px; font-size: .86rem; }
}
