/**
 * SwissFans 2.0 — Premium Creator Profile UI (Phase 1)
 *
 * Scope: body.sf-creator-profile-v2
 * Loaded only when feature flag creator_profile_ui_v2 is true.
 * Flag-off: this file is not enqueued → legacy profile unchanged.
 *
 * UI only. Legacy IDs, data-*, handlers, and payment/PPV hooks stay intact.
 */

/* ------------------------------------------------------------------ */
/* Tokens                                                              */
/* ------------------------------------------------------------------ */

body.sf-creator-profile-v2 {
  /* Aliased to the global design-system tokens (tokens.css) — no per-screen
     color deviations. */
  --sf-cp-max: 1480px;
  --sf-cp-bg: var(--sf-bg-page);
  --sf-cp-surface: var(--sf-bg-card);
  --sf-cp-card: var(--sf-bg-card);
  --sf-cp-card-soft: var(--sf-bg-elevated);
  --sf-cp-line: var(--sf-border-standard);
  --sf-cp-text: var(--sf-text-primary);
  --sf-cp-muted: var(--sf-text-secondary);
  --sf-cp-pink: #e91e8c;
  --sf-cp-pink-hover: #f0329a;
  --sf-cp-radius: 12px;
  --sf-cp-radius-sm: 12px;
  --sf-cp-shadow: 0 12px 32px rgba(8, 2, 18, 0.42);
  background-color: var(--sf-bg-page);
  background-image: var(--sf-bg-canvas);
  background-repeat: no-repeat;
  background-size: 100% 100%;
  color: var(--sf-cp-text);
}

/* Top bar: same purple card as Home — never solid black */
body.sf-creator-profile-v2 .header {
  background: transparent !important;
  border-bottom: none !important;
  box-shadow: none !important;
  padding: 0.35rem 0.55rem 0.15rem !important;
}

body.sf-creator-profile-v2 .header::before {
  display: none !important;
}

body.sf-creator-profile-v2 .sf-header {
  background: transparent !important;
  border-bottom: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body.sf-creator-profile-v2 .sf-top-bar,
body.sf-creator-profile-v2 .sf-top-bar--home {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 0.5rem !important;
  min-height: 52px !important;
  padding: 0.35rem 0.55rem !important;
  border-radius: 14px !important;
  border: 1px solid #2e1a32 !important;
  background: rgba(24, 16, 37, 0.94) !important;
  box-shadow: 0 8px 24px rgba(8, 2, 18, 0.35) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  color: #f7eef8 !important;
}

body.sf-creator-profile-v2 .sf-top-bar__wallet {
  background: linear-gradient(180deg, #26142a, #1c0f1f) !important;
  border: 1px solid rgba(225, 34, 146, 0.22) !important;
  color: #f7eef8 !important;
}

body.sf-creator-profile-v2 .profile_wrapper.sf-creator-profile-v2__root,
body.sf-creator-profile-v2 .sf-creator-profile-v2__root {
  background: transparent;
  overflow-x: clip;
}

/* ------------------------------------------------------------------ */
/* Layout width                                                        */
/* ------------------------------------------------------------------ */

body.sf-creator-profile-v2 .sf-cp-inner.i_profile_i_container,
body.sf-creator-profile-v2 .i_profile_i_container.sf-cp-inner {
  max-width: var(--sf-cp-max);
  width: min(100%, var(--sf-cp-max));
  margin-inline: auto;
  padding-top: 18px;
  padding-inline: 12px;
  box-sizing: border-box;
}

body.sf-creator-profile-v2 .profile_wrapper .th_middle .pageMiddle {
  max-width: var(--sf-cp-max);
  width: min(100%, var(--sf-cp-max));
  margin-inline: auto;
  padding-inline: 12px;
  box-sizing: border-box;
}

@media (min-width: 900px) {
  body.sf-creator-profile-v2 {
    --sf-cp-max: 1480px;
  }

  body.sf-creator-profile-v2 .sf-cp-inner.i_profile_i_container,
  body.sf-creator-profile-v2 .profile_wrapper .th_middle .pageMiddle {
    padding-inline: 18px;
  }
}

@media (min-width: 1280px) {
  body.sf-creator-profile-v2 {
    --sf-cp-max: 1480px;
  }
}

/* ------------------------------------------------------------------ */
/* Profile shell / cover                                               */
/* ------------------------------------------------------------------ */

body.sf-creator-profile-v2 .sf-cp-container.i_profile_container {
  position: relative;
  width: 100%;
}

body.sf-creator-profile-v2 .i_profile_cover_blur {
  opacity: 0.18;
  filter: blur(40px);
  transform: scale(1.15);
  pointer-events: none;
  max-height: 420px;
}

body.sf-creator-profile-v2 .sf-cp-infos.i_profile_infos_wrapper {
  background: var(--sf-cp-card-soft);
  border: 1px solid var(--sf-cp-line);
  border-radius: var(--sf-cp-radius);
  box-shadow: var(--sf-cp-shadow);
  overflow: hidden;
}

body.sf-creator-profile-v2 .sf-cp-cover.i_profile_cover {
  height: 340px;
  /* Must stay overflow: visible — the avatar (child, absolutely positioned
     with a negative bottom offset) needs to protrude past this box's edge.
     The actual cover photo is clipped/rounded on the media wrapper below. */
  overflow: visible;
  position: relative;
}

body.sf-creator-profile-v2 .sf-cp-cover-media.i_im_cover,
body.sf-creator-profile-v2 .sf-cp-cover .i_im_cover {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
  border-top-left-radius: var(--sf-cp-radius);
  border-top-right-radius: var(--sf-cp-radius);
  /* Shows whenever there is no real cover photo (no <img> rendered) —
     replaces the old solid-orange gender placeholder. */
  background: var(--sf-gradient-placeholder);
}

body.sf-creator-profile-v2 .sf-cp-cover .i_im_cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 30%;
  display: block;
}

body.sf-creator-profile-v2 .sf-cp-cover::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 42%;
  background: linear-gradient(to top, rgba(7, 7, 10, 0.88), transparent);
  pointer-events: none;
  z-index: 1;
}

body.sf-creator-profile-v2 .sf-cp-avatar-wrap.i_profile_avatar_container {
  bottom: -72px;
  z-index: 2;
}

/* Gradient ring — .i_profile_avatar_wrp shrinks to the avatar size and its
   padding reveals the accent-gradient background as a 3px ring. The avatar
   itself gets a solid dark border creating a clean gap between ring and photo. */
body.sf-creator-profile-v2 .sf-cp-cover .i_profile_avatar_wrp {
  width: fit-content;
  margin: 0 auto;
  padding: 3px;
  border-radius: 50%;
  background: var(--sf-gradient-accent, linear-gradient(135deg, #e91e8c, #8b2fc9));
  box-shadow: 0 10px 26px rgba(139, 47, 201, 0.32);
}

body.sf-creator-profile-v2 .sf-cp-cover .i_profile_avatar {
  width: 144px;
  height: 144px;
  border: 3px solid var(--sf-bg-page, #150a16);
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.35);
  background-size: cover;
  background-position: center;
}

body.sf-creator-profile-v2 .sf-cp-cover .creator_badge {
  border-color: #1a1224;
  background-color: #1a1224;
}

/* ------------------------------------------------------------------ */
/* Name / handle / activity                                            */
/* ------------------------------------------------------------------ */

body.sf-creator-profile-v2 .sf-cp-info.i_u_profile_info {
  padding: 88px 18px 22px;
  align-items: center;
  gap: 0;
  display: flex;
  flex-direction: column;
}

/* Visual hierarchy without duplicating buttons / changing DOM handlers */
/* Kennzahlen (Beiträge/Follower/Fotos-Videos) direkt unter Name/Handle/Activity,
   NICHT isoliert unten auf der Seite (Bugfix — vorher order:8, ganz am Ende). */
body.sf-creator-profile-v2 .sf-cp-info > .sf-cp-name { order: 1; }
body.sf-creator-profile-v2 .sf-cp-info > .sf-cp-handle { order: 2; }
body.sf-creator-profile-v2 .sf-cp-info > .sf-cp-activity { order: 3; }
body.sf-creator-profile-v2 .sf-cp-info > .sf-cp-stats { order: 4; }
body.sf-creator-profile-v2 .sf-cp-info > .sf-cp-actions-primary { order: 5; }
body.sf-creator-profile-v2 .sf-cp-info > .sf-cp-actions-secondary { order: 6; }
body.sf-creator-profile-v2 .sf-cp-info > .i_profile_menu:not(.sf-cp-stats) { order: 7; }
body.sf-creator-profile-v2 .sf-cp-info > .sf-cp-bio-card { order: 8; }

body.sf-creator-profile-v2 .sf-cp-name.i_u_name,
body.sf-creator-profile-v2 .sf-cp-name.i_u_name a {
  font-size: 1.35rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--sf-cp-text);
  max-width: 100%;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.35rem;
  line-height: 1.25;
  overflow-wrap: anywhere;
  text-align: center;
}

/* Verified badge next to display name — blue seal + white check (not a solid blob).
   Legacy style.css sets `.i_pr_vs svg { fill:#1e88e5 }` which overrides child path
   fills and paints the checkmark the same blue as the seal. */
body.sf-creator-profile-v2 .sf-cp-name .i_pr_vs {
  display: inline-flex;
  align-items: center;
  padding: 0;
  margin-left: 0.15rem;
  color: #1e88e5;
  line-height: 1;
  vertical-align: middle;
}

body.sf-creator-profile-v2 .sf-cp-name .i_pr_vs svg {
  width: 18px !important;
  height: 18px !important;
  margin-left: 0 !important;
  fill: none !important;
  stroke: none !important;
  display: block;
}

body.sf-creator-profile-v2 .sf-cp-name .i_pr_vs svg path:first-child {
  fill: currentColor !important;
}

body.sf-creator-profile-v2 .sf-cp-name .i_pr_vs svg path:last-child {
  fill: #ffffff !important;
}

body.sf-creator-profile-v2 .sf-cp-handle {
  margin-top: 0.2rem;
  color: var(--sf-cp-muted);
  font-size: 0.95rem;
  font-weight: 500;
  letter-spacing: 0.01em;
  max-width: 100%;
  overflow-wrap: anywhere;
  text-align: center;
}

body.sf-creator-profile-v2 .sf-cp-activity,
body.sf-creator-profile-v2 .sf-cp-activity--muted {
  margin-top: 0.15rem;
  min-height: 0;
}

body.sf-creator-profile-v2 .sf-cp-activity--muted .i_p_lpt_online,
body.sf-creator-profile-v2 .sf-cp-activity--muted .i_p_lpt_offline {
  font-size: 0.72rem;
  font-weight: 400;
  opacity: 0.28;
  color: var(--sf-cp-muted) !important;
  letter-spacing: 0.01em;
}

body.sf-creator-profile-v2 .sf-cp-info .profile_level_circle {
  flex-shrink: 0;
}

/* ------------------------------------------------------------------ */
/* Actions                                                             */
/* ------------------------------------------------------------------ */

body.sf-creator-profile-v2 .sf-cp-actions-primary.i_p_items_box {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch;
  gap: 0.65rem;
  width: 100%;
  max-width: 560px;
  padding: 0.85rem 0 0.25rem;
  box-sizing: border-box;
}

/* Abonnieren + Trinkgeld nebeneinander in einer Zeile (design-system spec) —
   flex-basis:0 + equal flex-grow splits the row precisely in half regardless
   of gap/border/icon width (a percentage basis like calc(50% - Xpx) leaves
   near-zero rounding headroom and triggers spurious flex-wrap). */
body.sf-creator-profile-v2 .sf-cp-actions-primary .i_btn_become_fun,
body.sf-creator-profile-v2 .sf-cp-actions-primary .i_btn_unsubscribe {
  flex: 1 1 0;
  min-width: 140px;
  min-height: 46px;
  padding: 0.8rem 1.1rem;
  border-radius: 8px;
  font-size: 0.95rem;
  font-weight: 650;
  letter-spacing: 0.01em;
  box-sizing: border-box;
  transform: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
}

body.sf-creator-profile-v2 .sf-cp-actions-primary .i_btn_become_fun {
  background: var(--sf-gradient-accent, linear-gradient(135deg, #e91e8c, #8b2fc9));
  color: #ffffff;
  border-radius: 8px;
  box-shadow: 0 6px 18px rgba(139, 47, 201, 0.28);
}

body.sf-creator-profile-v2 .sf-cp-actions-primary .i_btn_become_fun:hover {
  filter: brightness(1.08);
  transform: none;
  box-shadow: 0 8px 22px rgba(139, 47, 201, 0.34);
}

body.sf-creator-profile-v2 .sf-cp-actions-primary .i_btn_unsubscribe {
  background: transparent;
  border: 0.5px solid var(--sf-border-secondary, #4a3450);
  color: #e6dbe8;
  border-radius: 8px;
}

body.sf-creator-profile-v2 .sf-cp-actions-primary .i_btn_send_to_point.sendPoint {
  flex: 1 1 0;
  min-width: 140px;
  min-height: 46px;
  padding: 0.8rem 1.1rem;
  border-radius: 8px;
  border: 0.5px solid var(--sf-border-secondary, #4a3450);
  background: transparent;
  color: #e6dbe8;
  font-weight: 650;
  box-sizing: border-box;
  justify-content: center;
}

body.sf-creator-profile-v2 .sf-cp-actions-primary .i_btn_send_to_point.sendPoint:hover {
  background: rgba(255, 255, 255, 0.06);
  border-color: #e91e8c;
}

body.sf-creator-profile-v2 .sf-cp-actions-secondary.i_p_cards {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 0.55rem;
  width: 100%;
  max-width: 560px;
  padding-top: 0.85rem;
  box-sizing: border-box;
}

body.sf-creator-profile-v2 .sf-cp-actions-secondary .i_btn_item,
body.sf-creator-profile-v2 .sf-cp-actions-secondary [id="i_btn_like_item"],
body.sf-creator-profile-v2 .sf-cp-actions-secondary .i_btn_like_item,
body.sf-creator-profile-v2 .sf-cp-actions-secondary .free_follow,
body.sf-creator-profile-v2 .sf-cp-actions-secondary .f_p_follow {
  min-height: 44px;
  min-width: 44px;
  border-radius: 999px;
  border: 1px solid var(--sf-cp-line);
  background: rgba(46, 26, 50, 0.65);
  color: #f7eef8;
  box-sizing: border-box;
}

/* Legacy style.css sets .i_btn_item svg { fill:#000 } — force readable icons */
body.sf-creator-profile-v2 .sf-cp-actions-secondary .i_btn_item svg,
body.sf-creator-profile-v2 .sf-cp-actions-secondary .newMessageMe svg,
body.sf-creator-profile-v2 .sf-cp-actions-secondary .uSubsModal svg,
body.sf-creator-profile-v2 .sf-cp-actions-secondary a svg,
body.sf-creator-profile-v2 .sf-cp-actions-secondary [id="i_btn_like_item"] svg,
body.sf-creator-profile-v2 .sf-cp-actions-secondary .free_follow svg,
body.sf-creator-profile-v2 .sf-cp-actions-secondary .f_p_follow svg {
  fill: #c4b3c6 !important;
  color: #c4b3c6 !important;
  stroke: #c4b3c6;
  opacity: 1 !important;
  width: 20px;
  height: 20px;
}

body.sf-creator-profile-v2 .sf-cp-actions-secondary .newMessageMe,
body.sf-creator-profile-v2 .sf-cp-actions-secondary .uSubsModal.ownTooltip,
body.sf-creator-profile-v2 .sf-cp-actions-secondary a.loginForm,
body.sf-creator-profile-v2 .sf-cp-actions-secondary .i_btn_item a {
  width: 44px;
  height: 44px;
  min-height: 44px;
  min-width: 44px;
  max-width: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border-radius: 999px;
  box-sizing: border-box;
}

/* Message = same round icon button as link/block (not a wide pill) */
body.sf-creator-profile-v2 .sf-cp-actions-secondary .i_btn_item:has(.newMessageMe),
body.sf-creator-profile-v2 .sf-cp-actions-secondary .i_btn_item:has(.uSubsModal),
body.sf-creator-profile-v2 .sf-cp-actions-secondary .i_btn_item:has(a[href*="chat"]),
body.sf-creator-profile-v2 .sf-cp-actions-secondary .i_btn_item:has(.loginForm) {
  width: 44px;
  height: 44px;
  min-width: 44px;
  max-width: 44px;
  padding: 0;
  background: rgba(46, 26, 50, 0.65);
  border-color: var(--sf-cp-line);
}

body.sf-creator-profile-v2 .sf-cp-actions-secondary .i_btn_item:has(.newMessageMe):hover,
body.sf-creator-profile-v2 .sf-cp-actions-secondary .i_btn_item:hover,
body.sf-creator-profile-v2 .sf-cp-actions-secondary .copyUrl:hover,
body.sf-creator-profile-v2 .sf-cp-actions-secondary [id="i_btn_like_item"]:hover {
  background: rgba(233, 30, 140, 0.14);
  border-color: rgba(233, 30, 140, 0.4);
}

body.sf-creator-profile-v2 .sf-cp-actions-secondary .i_btn_item:has(.newMessageMe):hover svg,
body.sf-creator-profile-v2 .sf-cp-actions-secondary .i_btn_item:hover svg,
body.sf-creator-profile-v2 .sf-cp-actions-secondary .copyUrl:hover svg,
body.sf-creator-profile-v2 .sf-cp-actions-secondary [id="i_btn_like_item"]:hover svg {
  fill: #f7eef8 !important;
  color: #f7eef8 !important;
  stroke: #f7eef8;
}

body.sf-creator-profile-v2 .sf-cp-actions-secondary [id="i_btn_like_item"],
body.sf-creator-profile-v2 .sf-cp-actions-secondary .free_follow,
body.sf-creator-profile-v2 .sf-cp-actions-secondary .f_p_follow {
  padding: 0.55rem 1rem;
  font-weight: 600;
}

body.sf-creator-profile-v2 .sf-cp-actions-secondary .copyUrl,
body.sf-creator-profile-v2 .sf-cp-actions-secondary .i_btn_item.ownTooltip {
  width: 44px;
  height: 44px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

body.sf-creator-profile-v2 .sf-cp-actions-primary .i_btn_become_fun:focus-visible,
body.sf-creator-profile-v2 .sf-cp-actions-primary .i_btn_send_to_point:focus-visible,
body.sf-creator-profile-v2 .sf-cp-actions-secondary .i_btn_item:focus-visible,
body.sf-creator-profile-v2 .sf-cp-actions-secondary [id="i_btn_like_item"]:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}

/* ------------------------------------------------------------------ */
/* Social / bio / stats                                                */
/* ------------------------------------------------------------------ */

body.sf-creator-profile-v2 .sf-cp-info .i_profile_menu {
  width: 100%;
  max-width: 100%;
}

body.sf-creator-profile-v2 .sf-cp-info .s_m_link a {
  min-width: 40px;
  min-height: 40px;
  border-radius: 999px;
  border: 1px solid var(--sf-cp-line);
  background: rgba(255, 255, 255, 0.03);
}

body.sf-creator-profile-v2 .sf-cp-bio-card.i_p_item_box {
  width: min(100%, 720px);
  margin: 0.85rem auto 0.35rem;
  padding: 14px;
  border-radius: 12px;
  border: 0.5px solid var(--sf-cp-line, #2e1a32);
  background: var(--sf-bg-card, #1c0f1f);
  box-sizing: border-box;
}

body.sf-creator-profile-v2 .sf-cp-bio.i_p_bio {
  color: var(--sf-text-primary, #f7eef8);
  font-size: 0.95rem;
  line-height: 1.6;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  text-align: left;
}

body.sf-creator-profile-v2 .sf-cp-bio.i_p_bio a {
  color: #e91e8c;
  text-decoration: none;
}

body.sf-creator-profile-v2 .sf-cp-bio.i_p_bio a:hover {
  text-decoration: underline;
}

body.sf-creator-profile-v2 .sf-cp-stats.i_profile_menu {
  /* Sits right under name/handle now (order:4) — no divider needed, this is
     the first content block, not a separator between two sections. */
  margin-top: 0.6rem;
  margin-bottom: 0.15rem;
  width: 100%;
}

/* Alle Kennzahlen (Beitraege/Bilder/Videos/Audios/Auktionen/Produkte)
   gleichzeitig sichtbar in einer Reihe — vorher horizontal scrollbar mit
   fester Mindestbreite pro Karte (min-width:92px), sodass auf Mobile nur
   eine Kennzahl auf den ersten Blick sichtbar war. Jetzt: gleich breite
   Spalten (flex:1 1 0), die sich an die verfuegbare Breite anpassen und
   nie umbrechen oder scrollen muessen. */
body.sf-creator-profile-v2 .sf-cp-stats-row.i_profile_menu_middle {
  display: flex;
  flex-wrap: nowrap;
  justify-content: stretch;
  align-items: stretch;
  gap: 0.4rem;
  width: 100%;
  overflow: visible;
  padding: 0.25rem 0.35rem 0.65rem;
  box-sizing: border-box;
}

body.sf-creator-profile-v2 .sf-cp-stats .i_profile_menu_item {
  flex: 1 1 0;
  min-width: 0;
  border-radius: 14px;
  border: 1px solid transparent;
  background: rgba(255, 255, 255, 0.03);
  transition: border-color 160ms ease, background 160ms ease, opacity 160ms ease;
}

body.sf-creator-profile-v2 .sf-cp-stats .i_profile_menu_item a {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.2rem;
  padding: 0.65rem 0.35rem;
  text-decoration: none;
  color: inherit;
  min-height: 72px;
  box-sizing: border-box;
}

body.sf-creator-profile-v2 .sf-cp-stats .i_p_sum {
  font-size: 1.1rem;
  font-weight: 750;
  color: var(--sf-cp-text);
  line-height: 1.1;
}

body.sf-creator-profile-v2 .sf-cp-stats .i_profile_menu_item_name {
  font-size: 0.68rem;
  font-weight: 500;
  color: var(--sf-cp-muted);
  text-transform: none;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

body.sf-creator-profile-v2 .sf-cp-stats .i_profile_menu_icon svg {
  width: 15px;
  height: 15px;
  opacity: 0.85;
  fill: #c4b3c6;
  color: #c4b3c6;
  stroke: #c4b3c6;
}

body.sf-creator-profile-v2 .sf-cp-stats .i_profile_menu_item.active_page_menu {
  border-color: rgba(195, 29, 142, 0.55);
  background: rgba(195, 29, 142, 0.12);
  box-shadow: inset 0 0 0 1px rgba(195, 29, 142, 0.18);
}

body.sf-creator-profile-v2 .sf-cp-stats .i_profile_menu_item.active_page_menu .i_p_sum {
  color: #ff8fd0;
}

body.sf-creator-profile-v2 .sf-cp-stats .i_profile_menu_item:focus-within {
  outline: 2px solid #fff;
  outline-offset: 2px;
}

/* Werte von 0 komplett ausblenden — Auktion/Shop/Audio etc. nur wenn vorhanden */
body.sf-creator-profile-v2 .sf-cp-stats .i_profile_menu_item.sf-cp-stat-zero {
  display: none !important;
}

@media (max-width: 420px) {
  body.sf-creator-profile-v2 .sf-cp-stats .i_profile_menu_item_name {
    font-size: 0.62rem;
  }
  body.sf-creator-profile-v2 .sf-cp-stats .i_p_sum {
    font-size: 1rem;
  }
  body.sf-creator-profile-v2 .sf-cp-stats .i_profile_menu_item a {
    padding: 0.55rem 0.2rem;
  }
}

/* ------------------------------------------------------------------ */
/* Feed cards on profile                                               */
/* ------------------------------------------------------------------ */

body.sf-creator-profile-v2 .profile_wrapper .th_middle .pageMiddle .i_post_body {
  background: var(--sf-cp-card);
  border: 1px solid var(--sf-cp-line);
  border-radius: var(--sf-cp-radius);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
  margin-bottom: 1rem;
  overflow: hidden;
}

body.sf-creator-profile-v2 .profile_wrapper .i_post_body_header {
  padding: 0.85rem 1rem 0.45rem;
  align-items: center;
  gap: 0.65rem;
}

body.sf-creator-profile-v2 .profile_wrapper .i_post_user_avatar img,
body.sf-creator-profile-v2 .profile_wrapper .i_post_body_header img {
  border-radius: 50%;
  object-fit: cover;
}

body.sf-creator-profile-v2 .profile_wrapper .i_post_username,
body.sf-creator-profile-v2 .profile_wrapper .i_post_username a {
  color: var(--sf-cp-text);
  font-weight: 650;
}

body.sf-creator-profile-v2 .profile_wrapper .i_post_shared_time,
body.sf-creator-profile-v2 .profile_wrapper .i_post_shared_time a {
  color: var(--sf-cp-muted);
  font-size: 0.8rem;
}

body.sf-creator-profile-v2 .profile_wrapper .i_post_text {
  color: #ececf2;
  font-size: 0.95rem;
  line-height: 1.55;
  padding: 0.35rem 1rem 0.75rem;
  overflow-wrap: anywhere;
}

body.sf-creator-profile-v2 .profile_wrapper .i_post_text a {
  color: #f0a8d6;
}

body.sf-creator-profile-v2 .profile_wrapper .i_post_image,
body.sf-creator-profile-v2 .profile_wrapper .i_post_image_container,
body.sf-creator-profile-v2 .profile_wrapper .i_post_video_container,
body.sf-creator-profile-v2 .profile_wrapper .video-js {
  border-radius: 0;
}

body.sf-creator-profile-v2 .profile_wrapper .i_post_image img,
body.sf-creator-profile-v2 .profile_wrapper .i_post_image_container img {
  width: 100%;
  max-width: 100%;
  height: auto;
  object-fit: cover;
  display: block;
}

body.sf-creator-profile-v2 .profile_wrapper .i_post_footer_container,
body.sf-creator-profile-v2 .profile_wrapper .i_post_footer {
  border-top: 1px solid var(--sf-cp-line);
  padding: 0.45rem 0.65rem;
}

body.sf-creator-profile-v2 .profile_wrapper .i_w_like_btn,
body.sf-creator-profile-v2 .profile_wrapper .i_w_comment_btn,
body.sf-creator-profile-v2 .profile_wrapper .i_w_share_btn,
body.sf-creator-profile-v2 .profile_wrapper .sendPoint {
  min-height: 40px;
}

/* ------------------------------------------------------------------ */
/* More creators bar — only at end of profile feed (after all posts)   */
/* ------------------------------------------------------------------ */

body.sf-creator-profile-v2 .profile_wrapper .i_postFormContainer_swiper,
body.sf-creator-profile-v2 .profile_wrapper .sf-home-section--creators,
body.sf-creator-profile-v2 .profile_wrapper .sf-profile-more-creators {
  display: flex !important;
  flex-direction: column !important;
  box-sizing: border-box !important;
  width: 100% !important;
  margin: 0.35rem 0 1.25rem !important;
  padding: 0.95rem 0.9rem 1rem !important;
  border-radius: var(--sf-cp-radius) !important;
  border: 1px solid var(--sf-cp-line) !important;
  background: var(--sf-cp-card) !important;
  background-image: none !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18) !important;
  overflow: hidden !important;
}

/* Always visible under the profile post stream (#moreType). New pages of
   posts append inside #moreType, so this bar stays at the visual bottom. */

body.sf-creator-profile-v2 .profile_wrapper .i_postFormContainer_swiper .i_right_box_header,
body.sf-creator-profile-v2 .profile_wrapper .sf-home-section__title {
  margin: 0 0 0.75rem !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--sf-cp-text) !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
}

body.sf-creator-profile-v2 .profile_wrapper .i_postFormContainer_swiper .swiper,
body.sf-creator-profile-v2 .profile_wrapper .i_postFormContainer_swiper .mySwiper {
  width: 100%;
  max-width: 280px;
  margin-inline: auto;
}

body.sf-creator-profile-v2 .profile_wrapper .i_postFormContainer_swiper .swiper-slide,
body.sf-creator-profile-v2 .profile_wrapper .i_postFormContainer_swiper .sf-creator-card--avatar {
  border-radius: 16px !important;
  overflow: hidden !important;
  border: 1px solid rgba(46, 26, 50, 0.85) !important;
  background: #1c0f1f !important;
  box-shadow: 0 10px 28px rgba(8, 2, 18, 0.45) !important;
  min-height: 240px !important;
}

/* No title/cover image — avatar-only card */
body.sf-creator-profile-v2 .profile_wrapper .i_postFormContainer_swiper .i_sub_u_cov {
  display: none !important;
}

body.sf-creator-profile-v2 .profile_wrapper .i_postFormContainer_swiper .i_sub_u_det {
  position: relative !important;
  bottom: auto !important;
  left: auto !important;
  width: 100% !important;
  min-height: 240px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #1c0f1f !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border-radius: 0 !important;
  padding: 1.35rem 0.85rem 1.1rem !important;
  box-sizing: border-box !important;
}

body.sf-creator-profile-v2 .profile_wrapper .i_postFormContainer_swiper .i_sub_u_det_container {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 100% !important;
}

body.sf-creator-profile-v2 .profile_wrapper .i_postFormContainer_swiper .i_sub_u_ava {
  width: 104px !important;
  height: 104px !important;
  margin: 0 auto 0.85rem !important;
  border: 3px solid rgba(233, 30, 140, 0.55) !important;
  border-radius: 9999px !important;
  overflow: hidden !important;
  box-shadow: 0 0 0 3px rgba(233, 30, 140, 0.12) !important;
  flex-shrink: 0 !important;
}

body.sf-creator-profile-v2 .profile_wrapper .i_postFormContainer_swiper .i_sub_u_ava .i_post_user_avatar,
body.sf-creator-profile-v2 .profile_wrapper .i_postFormContainer_swiper .i_sub_u_ava a {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
}

body.sf-creator-profile-v2 .profile_wrapper .i_postFormContainer_swiper .i_sub_u_ava img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  border-radius: 9999px !important;
}

body.sf-creator-profile-v2 .profile_wrapper .i_postFormContainer_swiper .i_sub_u_d {
  width: 100% !important;
  padding: 0 !important;
  color: #f7eef8 !important;
}

body.sf-creator-profile-v2 .profile_wrapper .i_postFormContainer_swiper .i_sub_u_name a {
  color: #f7eef8 !important;
  font-weight: 700 !important;
  font-size: 1.05rem !important;
}

body.sf-creator-profile-v2 .profile_wrapper .i_postFormContainer_swiper .i_sub_u_men a {
  color: #c4b3c6 !important;
}

body.sf-creator-profile-v2 .profile_wrapper .i_postFormContainer_swiper .i_p_items_box_ {
  display: flex !important;
  justify-content: center !important;
  gap: 0.4rem !important;
  margin-top: 0.65rem !important;
}

body.sf-creator-profile-v2 .profile_wrapper .i_postFormContainer_swiper .i_btn_item_box {
  color: #c4b3c6 !important;
  background: rgba(46, 26, 50, 0.75) !important;
  border: 1px solid rgba(138, 122, 141, 0.22) !important;
}

body.sf-creator-profile-v2 .profile_wrapper .i_postFormContainer_swiper .i_btn_item_box svg {
  fill: #c4b3c6 !important;
}

body.sf-creator-profile-v2 .profile_wrapper .horizontal_arrow {
  padding-top: 0.75rem !important;
}

body.sf-creator-profile-v2 .profile_wrapper .horizontal_arrow svg {
  fill: var(--sf-cp-pink) !important;
  width: 32px !important;
  height: 32px !important;
}

/* ------------------------------------------------------------------ */
/* Empty feed state (was white .noPost card)                           */
/* ------------------------------------------------------------------ */

body.sf-creator-profile-v2 .profile_wrapper .noPost,
body.sf-creator-profile-v2 .profile_wrapper .noPost.sf-feed-empty {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.75rem !important;
  width: 100% !important;
  margin: 0.25rem 0 1.1rem !important;
  padding: 1.75rem 1.25rem !important;
  box-sizing: border-box !important;
  border-radius: var(--sf-cp-radius) !important;
  border: 1px solid var(--sf-cp-line) !important;
  background:
    linear-gradient(165deg, rgba(233, 30, 140, 0.08), transparent 55%),
    var(--sf-cp-card) !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.16) !important;
  text-align: center !important;
}

body.sf-creator-profile-v2 .profile_wrapper .noPostIcon {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 64px !important;
  height: 64px !important;
  min-width: 64px !important;
  min-height: 64px !important;
  margin: 0 !important;
  border-radius: 9999px !important;
  border: 1px solid rgba(138, 122, 141, 0.28) !important;
  background: rgba(46, 26, 50, 0.55) !important;
}

body.sf-creator-profile-v2 .profile_wrapper .noPostIcon svg {
  width: 28px !important;
  height: 28px !important;
  fill: #8a7a8d !important;
}

body.sf-creator-profile-v2 .profile_wrapper .noPostNote {
  max-width: 32ch !important;
  margin: 0 !important;
  color: #c4b3c6 !important;
  font-size: 0.9rem !important;
  font-weight: 560 !important;
  line-height: 1.5 !important;
}

@media (max-width: 720px) {
  body.sf-creator-profile-v2 .profile_wrapper .i_postFormContainer_swiper,
  body.sf-creator-profile-v2 .profile_wrapper .sf-home-section--creators,
  body.sf-creator-profile-v2 .profile_wrapper .noPost,
  body.sf-creator-profile-v2 .profile_wrapper .noPost.sf-feed-empty {
    border-radius: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
  }
}

/* ------------------------------------------------------------------ */
/* Locked PPV on profile feed                                          */
/* ------------------------------------------------------------------ */

body.sf-creator-profile-v2 .profile_wrapper .onlySubs,
body.sf-creator-profile-v2 .profile_wrapper .onlyPremium {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 1rem;
  box-sizing: border-box;
  background: rgba(5, 5, 8, 0.42);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}

body.sf-creator-profile-v2 .profile_wrapper .onlySubsWrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.65rem;
  max-width: min(320px, 100%);
}

body.sf-creator-profile-v2 .profile_wrapper .onlySubs_icon {
  padding: 0.85rem;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: rgba(19, 19, 24, 0.6);
  box-shadow: 0 0 0 1px rgba(195, 29, 142, 0.22);
}

body.sf-creator-profile-v2 .profile_wrapper .onlySubs_icon svg {
  width: 32px;
  height: 32px;
  fill: #fff;
}

/* .premium_locked / .premium_locked_icon (PPV lock badge): fixed size,
 * shape and centering now live once, unscoped, in components.css. Only
 * add an accent border/glow here to match this page's tone. */
body.sf-creator-profile-v2 .profile_wrapper .premium_locked {
  border: 1px solid rgba(255, 255, 255, 0.16);
  box-shadow: 0 0 0 1px rgba(195, 29, 142, 0.22);
}

body.sf-creator-profile-v2 .profile_wrapper .onlySubs_note {
  color: #fff;
  font-size: 0.9rem;
  font-weight: 500;
  line-height: 1.45;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
}

body.sf-creator-profile-v2 .profile_wrapper .buyThisPost,
body.sf-creator-profile-v2 .profile_wrapper .prcsPost.buyThisPost {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  min-height: 44px;
  padding: 0.7rem 1.2rem;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(195, 29, 142, 0.94);
  color: #fff;
  font-size: 0.9rem;
  font-weight: 650;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.22);
}

body.sf-creator-profile-v2 .profile_wrapper .buyThisPost:hover,
body.sf-creator-profile-v2 .profile_wrapper .prcsPost.buyThisPost:hover {
  background: var(--sf-cp-pink-hover);
}

body.sf-creator-profile-v2 .profile_wrapper .buyThisPost:focus-visible,
body.sf-creator-profile-v2 .profile_wrapper .prcsPost:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}

body.sf-creator-profile-v2 .profile_wrapper .buyThisPost span {
  font-size: 1.05rem;
  font-weight: 700;
}

body.sf-creator-profile-v2 .profile_wrapper .buythistext,
body.sf-creator-profile-v2 .profile_wrapper .prcsPost.buythistext {
  color: rgba(255, 255, 255, 0.9);
  font-size: 0.85rem;
}

body.sf-creator-profile-v2 .profile_wrapper .fr_subs.uSubsModal {
  cursor: pointer;
}

/* ------------------------------------------------------------------ */
/* Tablet                                                              */
/* ------------------------------------------------------------------ */

@media (max-width: 1024px) {
  body.sf-creator-profile-v2 .sf-cp-cover.i_profile_cover {
    height: 270px;
  }

  body.sf-creator-profile-v2 .sf-cp-cover .i_profile_avatar {
    width: 124px;
    height: 124px;
  }

  body.sf-creator-profile-v2 .sf-cp-avatar-wrap.i_profile_avatar_container {
    bottom: -62px;
  }

  body.sf-creator-profile-v2 .sf-cp-info.i_u_profile_info {
    padding-top: 78px;
  }
}

/* ------------------------------------------------------------------ */
/* Mobile                                                              */
/* ------------------------------------------------------------------ */

@media (max-width: 720px) {
  body.sf-creator-profile-v2 {
    --sf-cp-max: 100%;
  }

  body.sf-creator-profile-v2 .sf-cp-inner.i_profile_i_container,
  body.sf-creator-profile-v2 .profile_wrapper .th_middle .pageMiddle {
    padding-inline: 0;
    max-width: 100%;
  }

  body.sf-creator-profile-v2 .sf-cp-infos.i_profile_infos_wrapper {
    border-radius: 0;
    border-left: 0;
    border-right: 0;
  }

  body.sf-creator-profile-v2 .sf-cp-cover.i_profile_cover {
    height: 210px;
  }

  body.sf-creator-profile-v2 .sf-cp-cover-media.i_im_cover,
  body.sf-creator-profile-v2 .sf-cp-cover .i_im_cover {
    border-radius: 0;
  }

  body.sf-creator-profile-v2 .sf-cp-cover .i_profile_avatar {
    width: 102px;
    height: 102px;
  }

  body.sf-creator-profile-v2 .sf-cp-avatar-wrap.i_profile_avatar_container {
    bottom: -50px;
  }

  body.sf-creator-profile-v2 .sf-cp-info.i_u_profile_info {
    padding: 66px 14px 18px;
  }

  body.sf-creator-profile-v2 .sf-cp-name.i_u_name,
  body.sf-creator-profile-v2 .sf-cp-name.i_u_name a {
    font-size: 1.2rem;
  }

  body.sf-creator-profile-v2 .sf-cp-actions-primary.i_p_items_box,
  body.sf-creator-profile-v2 .sf-cp-actions-secondary.i_p_cards {
    max-width: 100%;
    padding-inline: 0.25rem;
  }

  /* Subscribe + Tip stay side-by-side at ~50% each on mobile too (design
     system spec). Extra headroom is built in deliberately (small icon,
     tight-but-legible padding, no redundant icon margin) so the pair never
     falls back to stacking even with longer localized labels like
     "Trinkgeld senden" on a 360-390px screen. */
  body.sf-creator-profile-v2 .sf-cp-actions-primary .i_btn_become_fun,
  body.sf-creator-profile-v2 .sf-cp-actions-primary .i_btn_unsubscribe,
  body.sf-creator-profile-v2 .sf-cp-actions-primary .i_btn_send_to_point.sendPoint {
    min-width: 0;
    font-size: 0.78rem;
    padding: 0.75rem 0.45rem;
    gap: 0.3rem;
    line-height: 1.2;
    text-align: center;
  }

  body.sf-creator-profile-v2 .sf-cp-actions-primary .i_btn_become_fun svg,
  body.sf-creator-profile-v2 .sf-cp-actions-primary .i_btn_unsubscribe svg,
  body.sf-creator-profile-v2 .sf-cp-actions-primary .i_btn_send_to_point.sendPoint svg {
    width: 15px;
    height: 15px;
    min-width: 15px;
    margin-right: 0;
    flex-shrink: 0;
  }

  body.sf-creator-profile-v2 .sf-cp-bio-card.i_p_item_box {
    margin-inline: 0.65rem;
    width: calc(100% - 1.3rem);
    padding: 0.85rem 0.9rem;
  }

  body.sf-creator-profile-v2 .profile_wrapper .th_middle .pageMiddle .i_post_body {
    border-radius: 0;
    border-left: 0;
    border-right: 0;
  }

  body.sf-creator-profile-v2 .profile_wrapper .i_post_text {
    padding-inline: 0.85rem;
  }
}

@supports (padding: env(safe-area-inset-bottom)) {
  body.sf-creator-profile-v2 .sf-cp-info.i_u_profile_info {
    padding-left: max(14px, env(safe-area-inset-left));
    padding-right: max(14px, env(safe-area-inset-right));
  }
}

/* ------------------------------------------------------------------ */
/* Motion                                                              */
/* ------------------------------------------------------------------ */

@media (prefers-reduced-motion: reduce) {
  body.sf-creator-profile-v2 *,
  body.sf-creator-profile-v2 *::before,
  body.sf-creator-profile-v2 *::after {
    transition: none !important;
    animation: none !important;
  }
}

@media (prefers-reduced-motion: no-preference) {
  body.sf-creator-profile-v2 .sf-cp-actions-primary .i_btn_become_fun,
  body.sf-creator-profile-v2 .sf-cp-stats .i_profile_menu_item,
  body.sf-creator-profile-v2 .profile_wrapper .th_middle .pageMiddle .i_post_body {
    transition: background 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
  }
}