/* Load before the legacy style layers: their important declarations use layer priority. */
/* Owner-requested visual refresh. Presentation only; no layout, labels or state changes. */
@layer homeopati-owner-visual-refresh {
#homeopati-layout {
  --hp-refresh-ink: #16304a;
  --hp-refresh-muted: #50676c;
  --hp-refresh-green: #42766e;
  --hp-refresh-border: #d6e2dc;
  color: var(--hp-refresh-ink);
  background: #f4f7f3 !important;
}
#homeopati-layout main,
#homeopati-layout .studio-shell {
  background-color: #f4f7f3 !important;
}
#homeopati-layout :is(h1,h2,h3,h4) {
  color: var(--hp-refresh-ink) !important;
}
#homeopati-layout :is(.HPAboutArticle,.HPReading,.HPMembershipNew,.IFAuthLayout) {
  border-color: var(--hp-refresh-border) !important;
}
#homeopati-layout :is(.hp-choice-pane,.remedy-preview) {
  border-color: var(--hp-refresh-border) !important;
  box-shadow: 0 2px 8px rgb(22 48 74 / 4%) !important;
}
#homeopati-layout .HPSelectedColumn {
  background-color: #f0f6f1 !important;
  border-color: var(--hp-refresh-border) !important;
}
#homeopati-layout .selected-chip {
  color: #26594d !important;
  background-color: #e8f3e9 !important;
  border-color: #bfd7c6 !important;
}
#homeopati-layout :is(.HPPrimary,.IFPrimaryButton) {
  color: #fff !important;
  background: var(--hp-refresh-green) !important;
  border-color: var(--hp-refresh-green) !important;
}
#homeopati-layout :is(.HPPrimary,.IFPrimaryButton):hover {
  background: #345f59 !important;
  border-color: #345f59 !important;
}
#homeopati-layout a,
#homeopati-layout a:is(:hover,:visited,:active,:focus) {
  text-decoration: none !important;
}
#homeopati-layout :is(.HPReading,.HPAboutArticle) a {
  color: #32685f;
  font-weight: 600;
}
#homeopati-layout :is(a,button,input,select,textarea,summary):focus-visible {
  outline: 3px solid #39766f !important;
  outline-offset: 3px !important;
}
#homeopati-layout dialog {
  border-color: var(--hp-refresh-border) !important;
  box-shadow: 0 16px 48px rgb(22 48 74 / 18%) !important;
}
#homeopati-layout dialog::backdrop {
  background: rgb(22 48 74 / 32%);
}
/* Typography roles read from Alternativmedicin.se on 2026-11-06.
   Preserve the compact tool's type sizes; align weight by semantic role. */
#homeopati-layout {
  --hp-refresh-font: "Source Sans 3", system-ui, -apple-system, "Segoe UI", sans-serif;
  font-family: var(--hp-refresh-font) !important;
  font-size: 17px;
  font-weight: 400;
}
#homeopati-layout :is(button,input,select,textarea) {
  font-family: var(--hp-refresh-font) !important;
}
#homeopati-layout h1 { font-weight: 450 !important; }
#homeopati-layout :is(h2,h3,h4) { font-weight: 500 !important; }
#homeopati-layout :is(.HPHeroNew,.IFAuthIntro) h1 {
  font-size: clamp(32px, 3.6vw, 48px) !important;
  line-height: 1.16 !important;
}
#homeopati-layout :is(.HPAboutArticle,.HPReading,.HPPrinciples) h2 {
  font-size: 28px !important;
  line-height: 1.25 !important;
}
#homeopati-layout .HPPrinciples h3 {
  font-size: 18px !important;
  line-height: 1.3 !important;
}
#homeopati-layout :is(.HPAboutArticle,.HPReading) p {
  font-size: 17px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
}
#homeopati-layout .HPLead {
  font-size: 19px !important;
  font-weight: 400 !important;
  line-height: 1.55 !important;
}
#homeopati-layout .HPHeader nav a {
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
}
#homeopati-layout .HPHeader nav summary {
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
}
#homeopati-layout :is(.IFFormField,.IFCheckField),
#homeopati-layout .IFFormField :is(input,select,textarea) {
  font-size: 17px !important;
  font-weight: 400 !important;
  line-height: 1.7 !important;
}
#homeopati-layout .IFPrimaryButton {
  font-size: 17px !important;
  font-weight: 500 !important;
  line-height: 1.7 !important;
}
/* Source explanations are reader text, not an eyebrow or decorative label. */
#homeopati-layout dialog .v5-muted {
  font-size: 15px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
}
/* Native registration/account templates have IFAccountPage and no HP root id.
   Apply the same text roles without changing their layout or form behavior. */
body.IFAccountPage:not(#homeopati-layout) {
  --hp-refresh-font: "Source Sans 3", system-ui, -apple-system, "Segoe UI", sans-serif;
  font-family: var(--hp-refresh-font) !important;
  font-size: 17px;
  font-weight: 400;
}
.IFAccountPage:not(#homeopati-layout) :is(button,input,select,textarea) {
  font-family: var(--hp-refresh-font) !important;
}
.IFAccountPage:not(#homeopati-layout) .IFAuthIntro h1 {
  font-size: clamp(32px, 3.6vw, 48px) !important;
  font-weight: 450 !important;
  line-height: 1.16 !important;
}
.IFAccountPage:not(#homeopati-layout) :is(h2,h3,h4,legend) { font-weight: 500 !important; }
.IFAccountPage:not(#homeopati-layout) .IFAuthIntro p:not(.IFAccountKicker) {
  font-size: 17px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
}
.IFAccountPage:not(#homeopati-layout) :is(.IFAccountNav a,.IFAccessTabs a,.IFHeaderAccount) {
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
}
.IFAccountPage:not(#homeopati-layout) :is(.IFFormField,.IFCheckField),
.IFAccountPage:not(#homeopati-layout) .IFFormField :is(input,select,textarea) {
  font-size: 17px !important;
  font-weight: 400 !important;
  line-height: 1.7 !important;
}
.IFAccountPage:not(#homeopati-layout) .IFPrimaryButton {
  font-size: 17px !important;
  font-weight: 500 !important;
  line-height: 1.7 !important;
}
.IFAccountPage:not(#homeopati-layout) :is(.IFFieldFeedback,.IFTermsLink,.IFActivationNotice,.IFInformationMailHelp,.IFAccessEmailHint,.IFAccessProviderLabel,.IFAccessDivider) {
  font-size: 15px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
}
.IFAccountPage:not(#homeopati-layout) .LSCompactFooter,
.IFAccountPage:not(#homeopati-layout) .LSCompactFooter :is(li,a,span) {
  font-size: 15px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
}
.IFAccountPage:not(#homeopati-layout) a,
.IFAccountPage:not(#homeopati-layout) a:is(:hover,:visited,:active,:focus) { text-decoration: none !important; }
/* Account entry links retain the reference body-sized 17px/400 role. */
#homeopati-layout .HPHeader :is(a[data-ls-auth-link],a[href="/konto/login.php"],a[href="/konto/register.php"]),
.IFAccountPage:not(#homeopati-layout) .IFAccountHeader :is(.IFHeaderAccount,a[href="/konto/login.php"],a[href="/konto/register.php"]) {
  font-size: 17px !important;
  font-weight: 400 !important;
  line-height: 1.7 !important;
}
/* Shared navigation controls are outside the native nav element. */
#homeopati-layout .ls-chrome :is(.ls-directory-direct,.ls-menu-trigger),
.IFAccountPage:not(#homeopati-layout) .ls-chrome :is(.ls-directory-direct,.ls-menu-trigger) {
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
}
/* The coordinated mobile header narrows the wordmark container.
   Keep its original image inside that container, clear of the account links. */
@media (max-width: 760px) {
  #homeopati-layout .HPHeader.ls-chrome .HPBrand > span {
    flex: 1 1 auto;
    min-width: 0;
  }
  #homeopati-layout .HPHeader.ls-chrome .HPBrand strong img {
    max-width: 100% !important;
    height: auto !important;
  }
}
@media (max-width: 620px) {
  #homeopati-layout :is(.HPHeroNew,.IFAuthIntro) h1 { font-size: 36px !important; }
  .IFAccountPage:not(#homeopati-layout) .IFAuthIntro h1 { font-size: 36px !important; }
  #homeopati-layout :is(.HPAboutArticle,.HPReading,.HPPrinciples) h2 { font-size: 26px !important; }
}
}
