/* SQL Formatter & Validator — scoped.
   Inputs, labels, buttons and messages come from the shared .ftb-tool block in
   core.css so every tool looks like one product. */

.ftb-tool-sql textarea{min-height:200px;font-family:var(--ftb-mono);
	font-size:var(--ftb-text-code);line-height:1.6;white-space:pre;
	overflow-wrap:normal;overflow-x:auto}
.ftb-tool-sql [data-ftb="output"]{background:var(--ftb-surface)}

.ftb-tool-sql .ftb-sql-settings{display:grid;gap:var(--ftb-space-4);
	grid-template-columns:1fr;margin-bottom:var(--ftb-space-5)}
@media (min-width:768px){
	.ftb-tool-sql .ftb-sql-settings{grid-template-columns:1.4fr 1fr 1fr auto;align-items:end}
}
.ftb-tool-sql .ftb-sql-settings .ftb-field{margin-bottom:0}

/* Verdict. Height reserved so it appearing never shifts the page (§10 CLS). */
.ftb-sql-verdict{margin-bottom:var(--ftb-space-5);padding:var(--ftb-space-4);
	border-radius:var(--ftb-radius);border-left:4px solid var(--ftb-border-strong);
	background:var(--ftb-surface);min-height:64px}
.ftb-sql-verdict-line{margin:0;font-size:var(--ftb-text-sm);
	line-height:var(--ftb-lh-snug);color:var(--ftb-text)}

/* Valid and invalid differ by border, background AND wording — never by colour
   alone (§9). The verdict text itself always names the outcome. */
.ftb-sql-verdict.is-valid{border-left-color:var(--ftb-success);
	background:var(--ftb-success-soft)}
.ftb-sql-verdict.is-valid .ftb-sql-verdict-line{color:var(--ftb-success)}
.ftb-sql-verdict.is-invalid{border-left-color:var(--ftb-error);
	background:var(--ftb-error-soft)}
.ftb-sql-verdict.is-invalid .ftb-sql-verdict-line{color:var(--ftb-error);
	font-weight:var(--ftb-fw-semi)}

.ftb-sql-note{margin:0 0 var(--ftb-space-5);padding:var(--ftb-space-4);
	font-size:var(--ftb-text-sm);line-height:var(--ftb-lh-snug);
	color:var(--ftb-text-muted);background:var(--ftb-surface);
	border-left:3px solid var(--ftb-primary);border-radius:var(--ftb-radius-sm)}

/* A dialect mismatch: not an error, but the output will not look like the
   input, so it needs to be visibly different from a clean pass. */
.ftb-sql-verdict.is-warn{border-left-color:var(--ftb-warning);
	background:var(--ftb-warning-soft)}
.ftb-sql-verdict.is-warn .ftb-sql-verdict-line{color:var(--ftb-warning);
	font-weight:var(--ftb-fw-semi)}

/* Dialect promoted above the input (see render.php). Constrained so it does
   not stretch to the full textarea width and read as a second input field. */
.ftb-tool-sql .ftb-sql-dialect-field { max-width: 22rem; margin-bottom: var(--ftb-space-4); }
.ftb-tool-sql .ftb-sql-dialect-field .ftb-tool-stat { margin-top: var(--ftb-space-2); }

/* The full issue list, shown when a query has more than one problem.
   Reporting only the first turns fixing a query into fix-repaste-repeat,
   which is the loop someone searching "fix my sql query" is already in. */
.ftb-sql-issues{margin:var(--ftb-space-3) 0 0;padding:0 0 0 var(--ftb-space-5);
  display:flex;flex-direction:column;gap:var(--ftb-space-2);
  font-size:var(--ftb-text-sm);line-height:var(--ftb-lh-snug)}
.ftb-sql-issues li{margin:0}
/* Errors and warnings are distinguished by their marker AND their wording,
   never by colour alone — §9 forbids colour as the only signal. */
.ftb-sql-issues li.is-error{color:var(--ftb-error)}
.ftb-sql-issues li.is-error::marker{content:"\2716  "}
.ftb-sql-issues li.is-warn{color:var(--ftb-warning)}
.ftb-sql-issues li.is-warn::marker{content:"\26A0  "}