/*
 * FlexAuto Page Shell
 *
 * Single canonical wrapper that locks page geometry across all customer themes.
 * All sizing comes from CSS custom properties set by FlexAuto_Page_Shell::render_css_variables.
 *
 * Theme-isolation reset classes (flexauto-shell-iso-*) opt in/out of resets per
 * tenant preference (set in FlexAuto admin → WordPress UI → Layout).
 */

.flexauto-page-shell {
  box-sizing: border-box;
  width: 100%;
  margin-inline: auto;
  padding-inline: var(--flexauto-page-padding-inline, 1rem);
}

.flexauto-page-shell *,
.flexauto-page-shell *::before,
.flexauto-page-shell *::after {
  box-sizing: border-box;
}

/* Per-page-type max-width — driven by CSS variables emitted by render_open */
.flexauto-page-shell--product,
.flexauto-page-shell--ipbox,
.flexauto-page-shell--checkout {
  max-width: var(--flexauto-page-max-width-default, 960px);
}

.flexauto-page-shell--archive {
  max-width: var(--flexauto-page-max-width-archive, 1280px);
}

.flexauto-page-shell--renewal {
  max-width: var(--flexauto-page-max-width-renewal, 680px);
}

/* ---------------------------------------------------------------------------
 * Theme-isolation: typography reset
 * Active only when .flexauto-shell-iso-typography is on the shell.
 * ------------------------------------------------------------------------ */

.flexauto-page-shell.flexauto-shell-iso-typography {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  line-height: 1.5;
}

.flexauto-page-shell.flexauto-shell-iso-typography h1,
.flexauto-page-shell.flexauto-shell-iso-typography h2,
.flexauto-page-shell.flexauto-shell-iso-typography h3,
.flexauto-page-shell.flexauto-shell-iso-typography h4,
.flexauto-page-shell.flexauto-shell-iso-typography h5,
.flexauto-page-shell.flexauto-shell-iso-typography h6 {
  font-family: inherit;
  font-weight: 600;
  letter-spacing: normal;
  text-transform: none;
  margin: 0 0 0.5em;
}

.flexauto-page-shell.flexauto-shell-iso-typography p {
  margin: 0 0 1em;
}

.flexauto-page-shell.flexauto-shell-iso-typography a {
  color: inherit;
  text-decoration: none;
}

.flexauto-page-shell.flexauto-shell-iso-typography a:hover {
  text-decoration: underline;
}

/* ---------------------------------------------------------------------------
 * Theme-isolation: button reset
 * ------------------------------------------------------------------------ */

.flexauto-page-shell.flexauto-shell-iso-buttons button,
.flexauto-page-shell.flexauto-shell-iso-buttons .button,
.flexauto-page-shell.flexauto-shell-iso-buttons input[type="submit"],
.flexauto-page-shell.flexauto-shell-iso-buttons input[type="button"] {
  font-family: inherit;
  font-size: 1rem;
  letter-spacing: normal;
  text-transform: none;
  cursor: pointer;
}

/* ---------------------------------------------------------------------------
 * Theme-isolation: form-element reset
 * ------------------------------------------------------------------------ */

.flexauto-page-shell.flexauto-shell-iso-forms input,
.flexauto-page-shell.flexauto-shell-iso-forms select,
.flexauto-page-shell.flexauto-shell-iso-forms textarea {
  font-family: inherit;
  font-size: 1rem;
  letter-spacing: normal;
}