/* My Account page (route: etype_login_v3.account) */

.path-etype-my-account {
  --acct-accent: #1a5fad;
  --acct-accent-deep: #0f3d75;
  --acct-coral: #ff5d5d;
  --acct-mint: #16a394;
  --acct-bg: #f4f6fb;
  --acct-card: #ffffff;
  --acct-line: #e3e7ef;
  --acct-text: #14161a;
  --acct-muted: #5b6473;
  --acct-radius: 12px;
  --acct-shadow: 0 6px 24px rgba(20, 30, 60, .07);
}

.path-etype-my-account .layout-container,
.path-etype-my-account .layout-container > div {
  background: var(--acct-bg);
}

/* ---------- Hero ---------- */
.path-etype-my-account .account-hero {
  max-width: 1200px;
  margin: 1.75rem auto 1rem;
  padding: 0 1rem;
}

.path-etype-my-account .account-hero__inner {
  position: relative;
  display: flex;
  align-items: center;
  gap: 1.5rem;
  padding: 1.75rem 2rem;
  border-radius: var(--acct-radius);
  color: #fff;
  background:
    radial-gradient(1200px 220px at 110% -10%, rgba(255, 255, 255, .14), transparent 60%),
    radial-gradient(900px 300px at -10% 110%, rgba(255, 255, 255, .08), transparent 60%),
    linear-gradient(135deg, var(--acct-accent-deep) 0%, var(--acct-accent) 55%, #2a86d6 100%);
  box-shadow: var(--acct-shadow);
  overflow: hidden;
  isolation: isolate;
}

.path-etype-my-account .account-hero__inner::after {
  content: "";
  position: absolute;
  inset: auto -40px -80px auto;
  width: 240px;
  height: 240px;
  background: radial-gradient(closest-side, rgba(255, 93, 93, .35), transparent 70%);
  z-index: -1;
}

.path-etype-my-account .account-hero__avatar {
  flex: 0 0 64px;
  width: 64px;
  height: 64px;
  display: grid;
  place-items: center;
  background: rgba(255, 255, 255, .14);
  border: 1px solid rgba(255, 255, 255, .35);
  backdrop-filter: blur(6px);
  border-radius: 50%;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.75rem;
  font-weight: 700;
  letter-spacing: .02em;
  color: #fff;
  text-transform: uppercase;
  box-shadow: 0 8px 20px rgba(0, 0, 0, .15) inset, 0 2px 6px rgba(0, 0, 0, .12);
}

.path-etype-my-account .account-hero__text { min-width: 0; }

.path-etype-my-account .account-hero__eyebrow {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .82);
  margin-bottom: .35rem;
}

.path-etype-my-account .account-hero__title {
  margin: 0 0 .4rem;
  font-size: clamp(1.45rem, 2.4vw, 2.05rem);
  font-weight: 700;
  line-height: 1.15;
  color: #fff;
}

.path-etype-my-account .account-hero__title em {
  font-style: normal;
  background: linear-gradient(90deg, #fff 0%, #ffe6c4 60%, #ffd0d0 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.path-etype-my-account .account-hero__lede {
  margin: 0;
  font-size: 1rem;
  line-height: 1.5;
  color: rgba(255, 255, 255, .92);
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
  align-items: center;
}

.path-etype-my-account .account-hero__pill {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .25rem .65rem;
  border-radius: 999px;
  font-size: .8rem;
  font-weight: 600;
  letter-spacing: .02em;
  background: rgba(22, 163, 148, .22);
  border: 1px solid rgba(255, 255, 255, .25);
  color: #c9fff5;
}

.path-etype-my-account .account-hero__pill i { color: #6fe6c8; }

/* ---------- Two-column layout ---------- */
.path-etype-my-account main.columns {
  max-width: 1200px;
  margin: 1rem auto 2.5rem;
  padding: 0 1rem;
  gap: 1.5rem;
  align-items: flex-start;
}

.path-etype-my-account .main-content-inner.column {
  flex: 1 1 auto;
  min-width: 0;
}

/* ---------- Iframe card ---------- */
.path-etype-my-account .region-content {
  position: relative;
  background: var(--acct-card);
  border-radius: var(--acct-radius);
  box-shadow: var(--acct-shadow);
  overflow: hidden;
  border: 1px solid var(--acct-line);
}

.path-etype-my-account .region-content::before {
  content: "Subscriber portal";
  display: block;
  padding: .65rem 1rem;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--acct-muted);
  background: linear-gradient(180deg, #fafbfd 0%, #f1f4f9 100%);
  border-bottom: 1px solid var(--acct-line);
}

.path-etype-my-account #ifrmAccountUpdateForm {
  width: 100%;
  min-height: 860px;
  border: 0;
  background: #fff;
  display: block;
}

/* ---------- Native My Account template ---------- */
.path-etype-my-account .etype-my-account {
  padding: 1.25rem 1.5rem 1.75rem;
}

.path-etype-my-account .etype-my-account__header {
  margin: 0 0 1.25rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--acct-line);
}

.path-etype-my-account .etype-my-account__header h2 {
  margin: 0 0 .25rem;
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--acct-text);
  letter-spacing: -.01em;
}

.path-etype-my-account .etype-my-account__publication {
  margin: 0;
  font-size: .85rem;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--acct-accent);
}

.path-etype-my-account .etype-my-account__section {
  position: relative;
  margin: 0 0 1.25rem;
  padding: 1.1rem 1.25rem 1.25rem;
  background: linear-gradient(180deg, #fbfcfe 0%, #f6f8fc 100%);
  border: 1px solid var(--acct-line);
  border-radius: 10px;
}

.path-etype-my-account .etype-my-account__section:last-of-type { margin-bottom: 0; }

.path-etype-my-account .etype-my-account__section h3 {
  display: flex;
  align-items: center;
  gap: .55rem;
  margin: 0 0 .85rem;
  padding-bottom: .65rem;
  border-bottom: 1px solid var(--acct-line);
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--acct-text);
  letter-spacing: -.005em;
}

.path-etype-my-account .etype-my-account__section h3::before {
  font-family: "Font Awesome 6 Free", fantasy;
  font-weight: 900;
  font-size: .9rem;
  display: inline-grid;
  place-items: center;
  width: 1.6rem;
  height: 1.6rem;
  border-radius: 6px;
  background: rgba(26, 95, 173, .12);
  color: var(--acct-accent);
}

.path-etype-my-account .etype-my-account__profile h3::before      { content: "\f007"; } /* user */
.path-etype-my-account .etype-my-account__subscription h3::before { content: "\f06b"; } /* gift */
.path-etype-my-account .etype-my-account__security h3::before     { content: "\f084"; } /* key */

.path-etype-my-account .etype-my-account__section dl {
  display: grid;
  grid-template-columns: minmax(140px, 200px) 1fr;
  gap: .55rem 1.25rem;
  margin: 0 0 1rem;
  font-size: .96rem;
  line-height: 1.45;
}

.path-etype-my-account .etype-my-account__section dt {
  font-weight: 600;
  color: var(--acct-muted);
  font-size: .85rem;
  letter-spacing: .02em;
  align-self: center;
}

.path-etype-my-account .etype-my-account__section dd {
  margin: 0;
  color: var(--acct-text);
  font-weight: 500;
  align-self: center;
  word-break: break-word;
}

/* Pill-style values for boolean fields */
.path-etype-my-account .etype-my-account__profile dd:nth-last-of-type(-n+2) {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .15rem .55rem;
  width: max-content;
  border-radius: 999px;
  font-size: .82rem;
  font-weight: 600;
  background: rgba(22, 163, 148, .12);
  color: #0f7a6e;
  border: 1px solid rgba(22, 163, 148, .25);
}

.path-etype-my-account .etype-my-account__profile dd:nth-last-of-type(-n+2)::before {
  content: "\f00c"; /* check */
  font-family: "Font Awesome 6 Free", fantasy;
  font-weight: 900;
  font-size: .72rem;
}

/* Buttons */
.path-etype-my-account .etype-my-account .button {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .55rem 1.1rem;
  border-radius: 8px;
  background: linear-gradient(135deg, var(--acct-accent) 0%, var(--acct-accent-deep) 100%);
  color: #fff;
  font-size: .92rem;
  font-weight: 600;
  text-decoration: none;
  border: 0;
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(15, 61, 117, .22);
  transition: transform 140ms ease, box-shadow 140ms ease, filter 140ms ease;
}

.path-etype-my-account .etype-my-account .button:hover,
.path-etype-my-account .etype-my-account .button:focus {
  transform: translateY(-1px);
  filter: brightness(1.06);
  box-shadow: 0 6px 16px rgba(15, 61, 117, .28);
}

.path-etype-my-account .etype-my-account .button::after {
  content: "\f105"; /* chevron-right */
  font-family: "Font Awesome 6 Free", fantasy;
  font-weight: 900;
  font-size: .8rem;
  transition: transform 140ms ease;
}

.path-etype-my-account .etype-my-account .button:hover::after { transform: translateX(3px); }

.path-etype-my-account .etype-my-account__subscription .button {
  background: linear-gradient(135deg, var(--acct-coral) 0%, #d83c3c 100%);
  box-shadow: 0 4px 12px rgba(216, 60, 60, .22);
}

.path-etype-my-account .etype-my-account__subscription .button:hover {
  box-shadow: 0 6px 16px rgba(216, 60, 60, .3);
}

.path-etype-my-account .etype-my-account__security .button {
  background: linear-gradient(135deg, #5b6473 0%, #2f3742 100%);
  box-shadow: 0 4px 12px rgba(47, 55, 66, .22);
}

@media (max-width: 600px) {
  .path-etype-my-account .etype-my-account__section dl {
    grid-template-columns: 1fr;
    gap: .15rem 0;
  }
  .path-etype-my-account .etype-my-account__section dt {
    margin-top: .55rem;
  }
}

/* ---------- Empty / error state ---------- */
.path-etype-my-account .etype-my-account--empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 3rem 2rem 3.25rem;
}

.path-etype-my-account .etype-my-account__empty-icon {
  width: 76px;
  height: 76px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #fff3d6 0%, #ffe1a8 100%);
  color: #c77a00;
  font-size: 2rem;
  box-shadow: 0 8px 22px rgba(199, 122, 0, .18);
  margin-bottom: 1.1rem;
}

.path-etype-my-account .etype-my-account--empty h2 {
  margin: 0 0 .45rem;
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--acct-text);
  letter-spacing: -.01em;
}

.path-etype-my-account .etype-my-account--empty p {
  margin: 0 0 1.4rem;
  max-width: 460px;
  color: var(--acct-muted);
  font-size: .98rem;
  line-height: 1.5;
}

.path-etype-my-account .etype-my-account__empty-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  justify-content: center;
}

.path-etype-my-account .etype-my-account--empty .button {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .6rem 1.25rem;
  border-radius: 8px;
  background: linear-gradient(135deg, var(--acct-accent) 0%, var(--acct-accent-deep) 100%);
  color: #fff;
  font-size: .92rem;
  font-weight: 600;
  text-decoration: none;
  box-shadow: 0 4px 12px rgba(15, 61, 117, .22);
  transition: transform 140ms ease, box-shadow 140ms ease, filter 140ms ease;
}

.path-etype-my-account .etype-my-account--empty .button:hover {
  transform: translateY(-1px);
  filter: brightness(1.06);
  box-shadow: 0 6px 16px rgba(15, 61, 117, .28);
}

.path-etype-my-account .etype-my-account--empty .button--ghost {
  background: transparent;
  color: var(--acct-accent-deep);
  border: 1px solid var(--acct-line);
  box-shadow: none;
}

.path-etype-my-account .etype-my-account--empty .button--ghost:hover {
  background: #f3f6fb;
  filter: none;
  box-shadow: 0 2px 6px rgba(20, 30, 60, .06);
}

/* ---------- Sidebar ---------- */
.path-etype-my-account .region-sidebar {
  flex: 0 0 300px;
  background: var(--acct-card);
  border: 1px solid var(--acct-line);
  border-radius: var(--acct-radius);
  padding: 1.25rem 1rem;
  position: sticky;
  top: 1rem;
  box-shadow: var(--acct-shadow);
  overflow: hidden;
}

.path-etype-my-account .region-sidebar::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 4px;
  background: linear-gradient(90deg, var(--acct-accent) 0%, var(--acct-mint) 50%, var(--acct-coral) 100%);
}

.path-etype-my-account .region-sidebar h2 {
  margin: .25rem 0 .85rem;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--acct-muted);
}

.path-etype-my-account .region-sidebar ul.menu {
  list-style: none;
  margin: 0;
  padding: 0 0 1rem;
}

.path-etype-my-account .region-sidebar li.menu-item { margin: 0; }

.path-etype-my-account .region-sidebar li a {
  position: relative;
  display: flex;
  align-items: center;
  gap: .7rem;
  padding: .65rem .75rem;
  border-radius: 8px;
  color: var(--acct-text);
  text-decoration: none;
  font-size: .98rem;
  font-weight: 500;
  transition: background-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.path-etype-my-account .region-sidebar li a::before {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  font-size: .95rem;
  width: 1.3em;
  text-align: center;
  color: var(--acct-accent);
  transition: transform 160ms ease, color 160ms ease;
  content: "\f105"; /* default: chevron-right */
}

.path-etype-my-account .region-sidebar li a[href="/e-edition"]::before          { content: "\f1ea"; } /* newspaper */
.path-etype-my-account .region-sidebar li a[href*="/e-edition/"]::before        { content: "\f1ea"; } /* newspaper (prod paths) */
.path-etype-my-account .region-sidebar li a[href="/forms-submissions"]::before  { content: "\f15c"; } /* file-lines */
.path-etype-my-account .region-sidebar li a[href*="custom-login-page"]::before  { content: "\f2f6"; } /* right-to-bracket */
.path-etype-my-account .region-sidebar li a[href="/etype-login"]::before        { content: "\f2f6"; } /* right-to-bracket */
.path-etype-my-account .region-sidebar li a[href="/user/login"]::before         { content: "\f2f6"; } /* right-to-bracket */
.path-etype-my-account .region-sidebar li a[href="/etype-my-account"]::before   { content: "\f007"; } /* user */
.path-etype-my-account .region-sidebar li a[href="/user"]::before               { content: "\f007"; } /* user */
.path-etype-my-account .region-sidebar li a[href^="/user/logout"]::before       { content: "\f2f5"; } /* right-from-bracket */
.path-etype-my-account .region-sidebar li a[id="etype_login_subscribe"]::before { content: "\f155"; } /* dollar-sign */

.path-etype-my-account .region-sidebar li a::after {
  content: "\f105"; /* chevron-right */
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  margin-left: auto;
  color: transparent;
  transition: color 160ms ease, transform 160ms ease;
}

.path-etype-my-account .region-sidebar li a:hover,
.path-etype-my-account .region-sidebar li a:focus {
  background: linear-gradient(90deg, #eaf2fc 0%, #f3f8ff 100%);
  color: var(--acct-accent-deep);
  transform: translateX(2px);
}

.path-etype-my-account .region-sidebar li a:hover::after,
.path-etype-my-account .region-sidebar li a:focus::after {
  color: var(--acct-accent);
  transform: translateX(2px);
}

.path-etype-my-account .region-sidebar li a.is-active {
  background: linear-gradient(135deg, var(--acct-accent-deep), var(--acct-accent));
  color: #fff;
}

.path-etype-my-account .region-sidebar li a.is-active::before,
.path-etype-my-account .region-sidebar li a.is-active::after { color: #fff; }

/* Footer note inside sidebar (decorative) */
.path-etype-my-account .region-sidebar::after {
  content: "Need help? Contact support";
  display: block;
  margin-top: .9rem;
  padding-top: .8rem;
  border-top: 1px dashed var(--acct-line);
  font-size: .78rem;
  color: var(--acct-muted);
  text-align: center;
}

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
  .path-etype-my-account main.columns {
    flex-direction: column;
    padding: 0 .75rem;
  }
  .path-etype-my-account .region-sidebar {
    flex: 1 1 auto;
    width: 100%;
    position: static;
  }
  .path-etype-my-account .account-hero { margin: 1rem .75rem; padding: 0; }
  .path-etype-my-account .account-hero__inner { padding: 1.25rem 1.25rem; gap: 1rem; }
  .path-etype-my-account .account-hero__avatar { flex-basis: 52px; width: 52px; height: 52px; font-size: 1.4rem; }
}