/* Legal Content page template
   -------------------------------------------------------------------- */

/* Deliberately no h1 / heading / body-copy / link styling here. Pages
   still on the default page template (page.php -> content-page.php) get
   their look from the site-wide rules in theme.css (the global html/body
   font + color, and the generic h1-h6/a rules) — there is no
   per-page-template override of that base typography anywhere else in
   this theme. This is reinforced by page-templates/legal-content.php
   itself mimicking the default template's wrapper structure (same
   .wrapper/#page-wrapper, #content, .row, main#main markup), minus the
   widget/sidebar area and the <article> wrapper — so pages on this
   template look like default-templated pages, just without those two
   things. This file follows the same convention: it only adds the one
   thing the default template's wrapper markup was supplying that this
   one doesn't (vertical spacing), and leaves headings, body copy, and
   links to inherit the shared site styles.

   NOTE: a previous round of direct edits to this file added h1/h2
   overrides and much larger spacing/padding values, which made Privacy
   Policy (on this template) look different from default-templated pages
   — the opposite of the above. Those values were moved to
   css/page-templates/california-privacy-request.css instead, which now
   has its own dedicated page template
   (page-templates/california-privacy-request.php), so that page keeps
   its own distinct, more bespoke look without this file (and whichever
   other pages use Legal Content, e.g. Privacy Policy) inheriting it. If
   Legal Content pages need to look different from default again, make
   that change here deliberately rather than assuming this file is still
   override-free. */
.page-template-legal-content .legal-content-page {
  padding: 30px 0;
}

/* Breathing room between stacked flexible-content blocks (Rich Text /
   CA Privacy Request Form) when more than one is added to a page. */
.page-template-legal-content .legal-content-page__rich-text + .ca-privacy-request-block,
.page-template-legal-content .ca-privacy-request-block + .legal-content-page__rich-text {
  margin-top: 32px;
}

/* CA Privacy Request Form block
   -------------------------------------------------------------------- */
/* In practice the CA Privacy Request Form block lives on its own
   California Privacy Request template now (with its own tuned styling in
   california-privacy-request.css), but the "Page - Legal Content" ACF
   field group's location rules still include this template too, so an
   editor COULD add that block to a Legal Content page. These rules keep
   it from rendering unstyled if that ever happens — kept DRY/modest
   (matching the Connect With Us page's #contact-form conventions) rather
   than the bespoke tuning the other template's CSS has. */

.page-template-legal-content .ca-privacy-page__overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.8);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
}

.page-template-legal-content .ca-privacy-page__overlay-text {
  font-size: 1.2rem;
  font-weight: 600;
  color: #333;
}

.page-template-legal-content .ca-privacy-page__success {
  background: #f0f7f0;
  border-left: 4px solid #5a9e5a;
  padding: 20px 24px;
  border-radius: 4px;
  margin-bottom: 24px;
  color: #2d5a2d;
}

.page-template-legal-content .ca-privacy-page__error {
  background: #fdf2f2;
  border-left: 4px solid #c0392b;
  padding: 12px 16px;
  border-radius: 4px;
  margin: 12px 0;
  color: #c0392b;
}

/* margin-top/-bottom only — not the "margin: 12px 0" shorthand — so we
   don't clobber Bootstrap's .row { margin-left: -15px; margin-right:
   -15px; }, which exists to cancel out its .col-* children's 15px
   padding and keep the row's content flush with whatever contains it.
   Zeroing that out (as shorthand would) pushes the whole form ~15px to
   the right of the surrounding Rich Text copy. */
.page-template-legal-content #ca-privacy-form .row {
  margin-top: 12px;
  margin-bottom: 12px;
}

.page-template-legal-content #ca-privacy-form label {
  display: block;
  font-weight: 600;
  margin-bottom: 6px;
  font-size: 0.95rem;
}

.page-template-legal-content #ca-privacy-form .required {
  color: #c0392b;
}

/* Matches the #contact-form input convention on the Connect With Us page:
   10px radius, #cac7c7 border, compact 5px/15px padding, no resize handle,
   no focus glow (outline: none, box-shadow: none), and the same fluid
   font-size used throughout that page's forms. */
.page-template-legal-content #ca-privacy-form input[type="text"],
.page-template-legal-content #ca-privacy-form input[type="email"],
.page-template-legal-content #ca-privacy-form input[type="tel"],
.page-template-legal-content #ca-privacy-form textarea {
  width: 100%;
  padding: 5px 15px;
  border: 1px solid #cac7c7;
  border-radius: 10px;
  outline: none;
  resize: none;
  box-shadow: none;
  font-size: calc(12px + (15 - 12)*((100vw - 300px)/(1920 - 300)));
  color: #333;
  background: #fff;
  transition: border-color 0.2s;
  box-sizing: border-box;
}

.page-template-legal-content #ca-privacy-form input:focus,
.page-template-legal-content #ca-privacy-form textarea:focus {
  border-color: #EF8A22;
  outline: none;
  box-shadow: none;
}

.page-template-legal-content .ca-privacy-page__radio-group {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 4px;
}

.page-template-legal-content .ca-privacy-page__radio {
  display: flex;
  align-items: center;
  gap: 10px;
}

.page-template-legal-content .ca-privacy-page__radio input[type="radio"] {
  width: auto;
  accent-color: #EF8A22;
  cursor: pointer;
}

.page-template-legal-content .ca-privacy-page__radio label {
  font-weight: 400;
  margin-bottom: 0;
  cursor: pointer;
}

.page-template-legal-content .ca-privacy-page__field-note {
  font-size: 0.9rem;
  color: #555;
  margin-bottom: 8px;
}

.page-template-legal-content .ca-privacy-page__warning {
  font-size: 0.85rem;
  color: #c0392b;
  background: #fdf2f2;
  border-left: 3px solid #c0392b;
  padding: 8px 12px;
  border-radius: 2px;
  margin-bottom: 10px;
}

/* Matches .contact-btn (used on Connect With Us) — same padding, radius,
   fixed font-size, and margin — kept as its own rule since .contact-btn's
   styles are scoped under #connect-with-us and aren't reusable site-wide
   as-is. The hover darken is a small addition on top of that convention. */
.page-template-legal-content .ca-privacy-page__submit-btn {
  display: inline-block;
  background: #EF8A22;
  color: #fff;
  padding: 5px 20px;
  border: none;
  border-radius: 10px;
  font-size: 15px;
  cursor: pointer;
  transition: background 0.2s;
  margin: 12px 0;
}

.page-template-legal-content .ca-privacy-page__submit-btn:hover {
  background: #d4731a;
}

.page-template-legal-content .ca-privacy-page__submit-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}