/* Form controls. Sonny, Nov 2 (#90): one 12px corner on inputs, selects, textareas, and buttons.
   That is the ideas-form textarea radius. Height stays 44px. Set 1 focus ring stays.
   paper #F6EBD9 · brown #4B3317 · gray #70727C · yellow #FDBF68 · soft #D6D5D1 · line #C3B49F · white fields. */
:root{--fc-paper:#F6EBD9;--fc-brown:#4B3317;--fc-gray:#70727C;--fc-yellow:#FDBF68;--fc-soft:#D6D5D1;--fc-line:#C3B49F;--fc-r:12px;--fc-pill:12px;--fc-control:44px}

/* ---- Text fields, selects, textareas ---- */
body form.newsletter-form[data-layout] .email-row input,
.newsletter-form details input:not([type=checkbox]):not([type=radio]),.newsletter-form details select,.newsletter-form details textarea,
.feedback textarea,.feedback input[type="email"],
.pd-modal-fields input:not([type=checkbox]):not([type=radio]),.pd-modal-fields select,.pd-modal-fields textarea,
.dogwall-form input[type="text"],.dogwall-form input[type="email"],.dogwall-form input[type="file"],.dogwall-takedown input:not([type=checkbox]),.dogwall-takedown textarea,
#dog-form input:not([type=checkbox]),#dog-form textarea{
  height:var(--fc-control)!important;min-height:var(--fc-control)!important;padding:0 20px!important;font-size:16px!important;line-height:1.2;
  background:#fff!important;color:var(--fc-brown)!important;
  border:1.5px solid #70727C!important;border-radius:var(--fc-pill)!important;
  box-shadow:none!important;transition:border-color .15s}
.newsletter-form details textarea,.feedback textarea,.pd-modal-fields textarea,.dogwall-takedown textarea,#dog-form textarea,
#site textarea{height:auto!important;min-height:96px!important;padding:12px 20px!important;line-height:1.4;resize:vertical;border-radius:var(--fc-r)!important;border:1.5px solid #70727C!important;background:#fff!important}
body form.newsletter-form[data-layout] .email-row input::placeholder,.newsletter-form details ::placeholder,.feedback ::placeholder,.pd-modal-fields ::placeholder,.dogwall-form ::placeholder,.dogwall-takedown ::placeholder{color:var(--fc-gray)!important;opacity:1}
/* Select: native single-choice, custom chevron */
.newsletter-form details select,.pd-modal-fields select{appearance:none;-webkit-appearance:none;padding-right:44px!important;
  background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%234B3317' stroke-width='2'/%3E%3C/svg%3E") no-repeat right 16px center!important}
/* Hover */
.email-row input:hover,.newsletter-form details :is(input,select,textarea):hover,.feedback :is(textarea,input):hover,.pd-modal-fields :is(input,select,textarea):hover,.dogwall-form input:hover,.dogwall-takedown :is(input,textarea):hover{border-color:var(--fc-brown)!important}
.newsletter .newsletter-form .email-row input:hover,.newsletter .newsletter-form details :is(input,select,textarea):hover{border-color:var(--fc-paper)!important}
/* Disabled fields */
form :is(input,select,textarea):disabled{background:var(--fc-soft)!important;border-color:var(--fc-soft)!important;color:var(--fc-gray)!important}

/* ---- Focus: 3px brown ring (paper on the brown band) ---- */
#site form :is(input,select,textarea,button):focus-visible,.pd-modal :is(input,select,textarea,button):focus-visible,dialog form :is(input,select,textarea,button):focus-visible,
body form.newsletter-form[data-layout] .email-row :is(input,button):focus-visible{
  outline:3px solid var(--fc-brown)!important;outline-offset:2px!important;border-color:var(--fc-brown)!important}
#site .newsletter form :is(input,select,textarea,button,summary,a):focus-visible,
body .newsletter form.newsletter-form[data-layout] .email-row :is(input,button):focus-visible{outline-color:var(--fc-paper)!important;border-color:var(--fc-paper)!important}
#site .newsletter form .interest-field input[type=checkbox]:focus-visible{outline:0!important}
#site .newsletter form .interest-field label:has(input:focus-visible){outline:3px solid var(--fc-paper);outline-offset:3px}

/* ---- Buttons (submit, incl. disabled) ---- */
#site form button[type=submit],form.newsletter-form button[type=submit],.email-row button[type=submit],.dogwall-form button[type=submit],dialog form button[type=submit],.pd-modal-actions .button.primary,.feedback .button{
  height:var(--fc-control)!important;min-height:var(--fc-control)!important;padding:0 20px!important;border-radius:var(--fc-pill)!important;
  background:var(--fc-brown)!important;color:#fff!important;border:1px solid var(--fc-brown)!important;
  font-size:16px!important;font-weight:600!important;letter-spacing:0!important;line-height:1.2!important;
  box-shadow:none!important;transform:none;transition:background .15s,transform .1s;white-space:nowrap}
#site form button[type=submit]:hover:not(:disabled),dialog form button[type=submit]:hover:not(:disabled),.pd-modal-actions .button.primary:hover:not(:disabled){background:#3a2711!important;transform:none;box-shadow:none!important;filter:none}
#site form button[type=submit]:active:not(:disabled),dialog form button[type=submit]:active:not(:disabled){transform:scale(.97)!important;background:#2d1e0d!important}
/* On the brown band the primary flips to yellow fill + brown text (7.19:1) with a paper edge */
#site .newsletter form.newsletter-form button[type=submit],.newsletter form.newsletter-form button[type=submit]{background:var(--fc-yellow)!important;color:var(--fc-brown)!important;border-color:var(--fc-paper)!important}
#site .newsletter form.newsletter-form button[type=submit]:hover:not(:disabled){background:#fdcc85!important}
#site .newsletter form.newsletter-form button[type=submit]:active:not(:disabled){background:var(--fc-yellow)!important}
/* Disabled: soft fill, brown text (8.01:1) */
#site .newsletter form button[type=submit]:disabled,#site form button[type=submit]:disabled,form.newsletter-form button[type=submit]:disabled,.email-row button[type=submit]:disabled,dialog form button[type=submit]:disabled,.pd-modal-actions .button:disabled,.feedback .button:disabled{
  background:var(--fc-soft)!important;border-color:var(--fc-soft)!important;color:var(--fc-brown)!important;opacity:1!important;cursor:not-allowed}
.pd-modal-actions .button:not(.primary){height:var(--fc-control);min-height:var(--fc-control);border-radius:var(--fc-pill)!important;background:#fff!important;color:var(--fc-brown)!important;border:1px solid var(--fc-brown)!important}
/* Skip is a text link, not a second button. */
.pd-modal-actions .pd-skip{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 8px;color:var(--fc-brown);background:transparent;border:0;font-size:16px;font-weight:600;line-height:1.2;text-decoration:underline;text-underline-offset:3px}
.pd-modal-actions .pd-skip:hover{color:#3a2711}
.pd-modal-actions .pd-skip:focus-visible{outline:3px solid var(--fc-brown)!important;outline-offset:3px}
@media(max-width:560px){.pd-modal-actions .pd-skip{width:100%}}
/* Sign-up email row: one line at desktop, stacked full-width at <=760px; label never wraps */
body form.newsletter-form[data-layout] .email-row input{height:var(--fc-control)!important;min-height:var(--fc-control)!important}
@media(max-width:760px){body form.newsletter-form[data-layout] .email-row button[type=submit]{width:100%;max-width:none!important;white-space:nowrap!important;padding:0 16px!important;font-size:16px!important}}

/* ---- Service interest chips: real multi-select checkboxes, styled ---- */
.newsletter-form .interest-field{gap:10px!important}
.newsletter-form .interest-field label{display:inline-flex;align-items:center;gap:12px;min-height:44px!important;padding:0 14px 0 10px!important;
  border-radius:var(--fc-r)!important;background:#fff;color:var(--fc-brown);border:1px solid var(--fc-line)!important;font-weight:500;font-size:16px;cursor:pointer}
.newsletter-form .interest-field label:hover{border-color:var(--fc-brown)!important}
.newsletter-form .interest-field input[type=checkbox]{appearance:none;-webkit-appearance:none;width:24px!important;height:24px!important;flex:0 0 24px!important;margin:0!important;
  border-radius:7px;border:1.5px solid var(--fc-gray);background:#fff;display:grid;place-items:center;cursor:pointer}
.newsletter-form .interest-field input[type=checkbox]::after{content:"";width:6px;height:11px;border:solid #fff;border-width:0 2.5px 2.5px 0;transform:translateY(-1px) rotate(45deg);opacity:0}
.newsletter-form .interest-field input[type=checkbox]:checked{background:var(--fc-brown);border-color:var(--fc-brown)}
.newsletter-form .interest-field input[type=checkbox]:checked::after{opacity:1}
.newsletter-form .interest-field label:has(input:checked){border-color:var(--fc-brown)!important;box-shadow:inset 0 0 0 1px var(--fc-brown)}
.newsletter-form .interest-field label:has(input:disabled){background:var(--fc-soft);color:var(--fc-gray);cursor:not-allowed}
/* Same chips inside Tell Us More. The inline form does not show this step. */
form.newsletter-form > details.pd-step-two{display:none!important}
.pd-modal .interest-field{display:flex;flex-wrap:wrap;gap:10px;border:0;padding:0;margin:16px 0 4px;min-width:0;width:100%}
.pd-modal .interest-field legend{flex:1 0 100%;width:100%;font-weight:600;font-size:16px;line-height:1.3;margin:0 0 4px;padding:0;color:var(--fc-brown)}
.pd-modal .interest-field label{display:flex!important;align-items:center;gap:12px;min-height:48px!important;width:100%!important;margin:0!important;padding:0 14px!important;
  border-radius:var(--fc-r)!important;background:#fff;color:var(--fc-brown);border:2px solid var(--fc-line)!important;font-weight:500;font-size:16px;cursor:pointer}
.pd-modal .interest-field label:hover{border-color:var(--fc-brown)!important}
.pd-modal .interest-field label:has(input:checked){background:var(--fc-yellow,#FDBF68);color:var(--fc-brown);border-color:var(--fc-brown)!important;box-shadow:inset 0 0 0 2px var(--fc-brown)}
.pd-modal .interest-field input[type=checkbox]{appearance:none;-webkit-appearance:none;width:24px!important;height:24px!important;flex:0 0 24px!important;margin:0!important;padding:0!important;
  border-radius:7px;border:1.5px solid var(--fc-gray);background:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:none!important}
.pd-modal .interest-field input[type=checkbox]::after{content:"";width:6px;height:11px;border:solid #fff;border-width:0 2.5px 2.5px 0;transform:translateY(-1px) rotate(45deg);opacity:0}
.pd-modal .interest-field input[type=checkbox]:checked{background:var(--fc-brown);border-color:var(--fc-brown)}
.pd-modal .interest-field input[type=checkbox]:checked::after{opacity:1}
.pd-modal .interest-field input[type=checkbox]:focus-visible{outline:0!important}
.pd-modal .interest-field label:has(input:focus-visible){outline:3px solid var(--fc-brown)!important;outline-offset:3px}

/* ---- Inside Track consent (explicit opt-in, pending Lorei) ---- */
.newsletter-form .pd-consent{display:flex;align-items:flex-start;gap:12px;margin:18px 0 0;min-height:44px;max-width:52ch;font-size:16px;line-height:1.4;cursor:pointer;color:inherit}
.newsletter-form .pd-consent input[type=checkbox]{appearance:none;-webkit-appearance:none;width:24px!important;height:24px!important;flex:0 0 24px!important;margin:1px 0 0!important;padding:0!important;border-radius:7px;border:1.5px solid var(--fc-paper);background:#fff;display:grid;place-items:center;cursor:pointer}
.newsletter-form .pd-consent input[type=checkbox]::after{content:"";width:6px;height:11px;border:solid var(--fc-brown);border-width:0 2.5px 2.5px 0;transform:translateY(-1px) rotate(45deg);opacity:0}
.newsletter-form .pd-consent input[type=checkbox]:checked{background:var(--fc-yellow);border-color:var(--fc-yellow)}
.newsletter-form .pd-consent input[type=checkbox]:checked::after{opacity:1}
#site .newsletter form .pd-consent input[type=checkbox]:focus-visible{outline:0!important}
#site .newsletter form .pd-consent:has(input:focus-visible){outline:3px solid var(--fc-paper);outline-offset:3px;border-radius:8px}

/* ---- Small checkboxes elsewhere (dog wall consent / opt-out, dialog) ---- */
.dogwall-consent input[type=checkbox],.dogwall-optout input[type=checkbox],.pd-modal-fields input[type=checkbox]{width:24px;height:24px;accent-color:var(--fc-brown)}
.dogwall-consent,.dogwall-optout{min-height:44px}

/* ---- Details summary: 44px target ---- */
.newsletter-form summary{min-height:44px;display:flex;align-items:center}
.newsletter-form details label{font-weight:600;font-size:15px}

/* ---- Errors: never color alone. Thicker border + yellow inset bar + ⚠ icon + message ---- */
form :is(input,select,textarea)[aria-invalid="true"],form :is(input,select,textarea):user-invalid{
  border:2px solid var(--fc-brown)!important;box-shadow:inset 4px 0 0 var(--fc-yellow)!important}
.newsletter form :is(input,select,textarea)[aria-invalid="true"],.newsletter form :is(input,select,textarea):user-invalid{border-color:var(--fc-yellow)!important}
.form-status[data-state="error"],.form-note[data-state="error"],.pd-modal-status[data-state="error"]{
  display:block;position:relative;font-weight:600;padding:12px 14px 12px 40px;border-radius:var(--fc-r);border:2px solid currentColor;box-shadow:inset 4px 0 0 var(--fc-yellow)}
.form-status[data-state="error"]::before,.form-note[data-state="error"]::before,.pd-modal-status[data-state="error"]::before{content:"\26A0";position:absolute;left:14px;top:11px;font-size:1.1em;line-height:1.3}

/* Keep the verification live region exposed while empty, without visual spacing. */
.pd-verification-status:empty{margin:0;padding:0;border:0;box-shadow:none}