/* forms: selects use the owner's chevron rule (appearance:none, inline SVG on the right, padding-right >= 40px); replaces the design's CSS-border arrow. */
body .sb-forms label:has(>select)::after { content: none; }
body .sb-forms select { -webkit-appearance: none; appearance: none; padding-right: 48px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9' fill='none' stroke='%23444' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1.5l6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 18px center; background-size: 14px 9px; }
/* required marker, help text and radio/checkbox groups (not in the design) */
body .sb-forms .req { color: var(--pb-primary); }
body .sb-forms .help { font-weight: 400; color: var(--pb-muted); font-size: var(--st-type-small); }
body .sb-forms fieldset.opts { border: 0; margin: 0; padding: 0; display: grid; gap: 4px; min-width: 0; }
body .sb-forms fieldset.opts legend { font-size: var(--st-type-label); font-weight: 500; padding: 0 0 8px; }
/* theme: submit button is a <button>, keep the design's look and never let the theme restyle it; arrow span is inline */
body .sb-forms .primary { cursor: pointer; gap: 8px; }
body .sb-forms .step-actions .primary[hidden], body .sb-forms .step-actions .quiet[hidden] { display: none !important; }
/* the dark band's text and the quote/credit stay readable */
body .sb-forms .quote { color: inherit; }
/* content looks sit inside the framework's own frame (base.css zeroes --st-space), so the design's own side padding goes; edge looks keep it. */
body .sb-forms:not(.sb-edge) > section { padding-inline: 0; }
/* theme removes link underlines; the design underlines the contact links */
body .sb-forms .contact a { text-decoration: underline; text-underline-offset: 5px; }
/* the status line (form result) keeps the design's line of space while empty */
body .sb-forms .status:empty { min-height: 1.55em; }


/* Branding Sizes: role overrides kept outside the generated category CSS. */
body .sb-forms .display { font-size: clamp(calc(var(--fs-titles) * .65), 4.0625vw, var(--fs-titles)) !important; }
body .sb-forms .quote { font-size: var(--fs-quotes) !important; }
body .sb-forms .f18 .intro h2 { font-size: clamp(calc(var(--fs-titles) * .65), 4.0625vw, var(--fs-titles)) !important; }
body .sb-forms .primary, body .sb-forms .quiet { font-size: var(--fs-buttons) !important; }

/* 3.6.10 fit pass. FRM-17: the help lines kept the page's muted gray inside the primary-color band and could not be
   read; inside the band they use the light muted tone. */
body:not(.cc-look-pre-3-6-10) .sb-forms .f17 .band { --pb-muted: var(--color-muted-on-dark); }
body:not(.cc-look-pre-3-6-10) .sb-forms .f17 .band .help { color: var(--color-muted-on-dark); }
/* FRM-18: the 200px intro rail broke the Titles-size heading ("FRM- / 18") and the paragraph two words a line. */
@media (min-width: 768px) {
  body:not(.cc-look-pre-3-6-10) .sb-forms .f18 .split { grid-template-columns: minmax(240px, 30%) minmax(0, 1fr); }
  body:not(.cc-look-pre-3-6-10) .sb-forms .f18 .intro h2 { font-size: clamp(calc(var(--fs-medium) * .75), 2.6vw, var(--fs-medium)) !important; }
}
/* FRM-17: field labels kept the page's dark label color on the primary band. */
body:not(.cc-look-pre-3-6-10) .sb-forms .f17 .band { --form-label-color: var(--pb-on-dark); }
body:not(.cc-look-pre-3-6-10) .sb-forms .f17 .band label { color: var(--pb-on-dark); }

/* 3.6.10: looks that paint their own band (FRM-10: the category's page color, a tint or a dark bar of their own)
   keep their light-row colors on a dark row, so they render the same on every row. The dark row only turned their
   text white (white on their own light band) and faded their surface color to an 8% tint. */
body:not(.cc-look-pre-3-6-10) .sb-blk.sb-blk.sb-forms.sb-edge.sb-dark:is(.sb-look-10) { --pb-text: var(--color-body, var(--color-headings)); --pb-muted: var(--color-muted); --pb-border: var(--color-line); --pb-surface: var(--color-surface, var(--color-fourth)); --form-label-color: inherit; color: var(--pb-text); }
body:not(.cc-look-pre-3-6-10) .sb-blk.sb-blk.sb-blk.sb-blk.sb-forms.sb-edge.sb-dark:is(.sb-look-10) .btn:not(.ghost):not(:is(.dark, .ink, .is-dark, .on-dark) *) { background: var(--btn-fill); color: var(--btn-color); border-color: var(--btn-border); }
body:not(.cc-look-pre-3-6-10) .sb-blk.sb-blk.sb-blk.sb-blk.sb-forms.sb-edge.sb-dark:is(.sb-look-10) .btn.ghost:not(:is(.dark, .ink, .is-dark, .on-dark) *) { background: transparent; color: var(--btn-outline); border-color: var(--btn-outline); }
body:not(.cc-look-pre-3-6-10) .sb-blk.sb-blk.sb-blk.sb-blk.sb-forms.sb-edge.sb-dark:is(.sb-look-10) .tlink:not(:is(.dark, .ink, .is-dark, .on-dark, .photo, .ov) *) { color: var(--color-link); }
/* 3.6.10: on a dark row the tint panels inside a look (CRD-14/17 cards, FRM-19's intro) fade like its surface color, so the
   row's white text stays readable on them. */
body:not(.cc-look-pre-3-6-10) .sb-blk.sb-blk.sb-forms.sb-dark:not(.sb-edge) { --pb-tint: color-mix(in srgb, var(--color-white) 12%, transparent); }
