/* Generated from mockups/canvas/project/SiteContact.dc.html by site/tools/css-from-boards.js. Do not edit: change the board, then run the tool. */
/* ferr-css:start (generated by tools/fielderr.js: DESIGN-SYSTEM §8.4 field error and §8.17 inline alert, R-15; on the design-system tokens, so dark mode needs no rules of its own) */
html body .fld[aria-invalid="true"],html body .f2[aria-invalid="true"],html body input[aria-invalid="true"],html body textarea[aria-invalid="true"],html body [role="group"][aria-invalid="true"],html body .gl-card[aria-invalid="true"]{box-shadow:inset 0 0 0 2px var(--ui-bad)!important}
.ferr{display:flex;gap:6px;align-items:flex-start;margin:0;font:600 var(--ui-fs-label)/18px var(--ui-font);color:var(--ui-bad);text-align:left;white-space:normal;letter-spacing:0;text-transform:none}
.ferr svg{width:16px;height:16px;margin-top:1px;flex:none}
.falert{display:flex;gap:12px;align-items:flex-start;margin:0;padding:12px 16px;border-radius:var(--ui-radius-md);font:400 var(--ui-fs-body)/20px var(--ui-font);text-align:left;white-space:normal;letter-spacing:0}
.falert>svg{width:20px;height:20px;flex:none;margin-top:0}
.fa-b{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.fa-b>b{font-weight:700}
.fa-b>span{color:var(--ui-ink)}
.fa-acts{display:flex;gap:8px 14px;margin-top:8px;flex-wrap:wrap;align-items:center}
.fa-acts .btn{height:var(--ui-control-sm);min-height:var(--ui-control-sm);padding:0 14px;font-size:var(--ui-fs-label)}
.fa-lnk{border:0;background:none;padding:0;font:600 var(--ui-fs-label) var(--ui-font);color:var(--ui-link);cursor:pointer;text-decoration:underline}
.falert.bad{background:var(--ui-bad-bg);color:var(--ui-bad)}
.falert.warn{background:var(--ui-warn-bg);color:var(--ui-warn)}
.falert.ok{background:var(--ui-ok-bg);color:var(--ui-ok)}
.falert.info{background:var(--ui-info-bg);color:var(--ui-info)}
/* the customer's own website (.site-area) keeps the light tokens in dark mode (theme.js), so its errors stay as they are */
/* ferr-css:end */