/* GG Master Compound V39 — centered header + transparent lion + truly global persistent dark mode. */

/* Header: profile / centered lion / more. Remove community-name text from the chrome. */
@media (max-width:820px){
  .gg-mobile-v17 .member-app:not(.flow-mode) > .community-head.gg-v39-header{
    direction:ltr!important;
    position:sticky!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    min-height:calc(72px + env(safe-area-inset-top))!important;
    padding:calc(7px + env(safe-area-inset-top)) 15px 7px!important;
    gap:10px!important;
    overflow:visible!important;
  }
  .gg-mobile-v17 .member-app:not(.flow-mode) > .community-head.gg-v39-header > .head-person{
    order:1!important;
    flex:0 1 min(35vw,145px)!important;
    width:auto!important;
    max-width:145px!important;
    min-width:96px!important;
    margin:0!important;
    justify-self:auto!important;
    z-index:2!important;
  }
  .gg-mobile-v17 .member-app:not(.flow-mode) > .community-head.gg-v39-header > .gg-v18-brand-mark,
  .gg-mobile-v17 .member-app:not(.flow-mode) > .community-head.gg-v39-header > .gg-v39-transparent-logo{
    position:absolute!important;
    z-index:2!important;
    left:50%!important;
    top:calc(50% + env(safe-area-inset-top)/2)!important;
    transform:translate(-50%,-50%)!important;
    width:52px!important;
    height:52px!important;
    margin:0!important;
    padding:0!important;
    object-fit:contain!important;
    object-position:center!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    filter:drop-shadow(0 3px 7px #0007)!important;
  }
  .gg-mobile-v17 .member-app:not(.flow-mode) > .community-head.gg-v39-header > .gg-v39-more-slot{
    order:3!important;
    flex:0 0 46px!important;
    width:46px!important;
    min-width:46px!important;
    height:46px!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    direction:ltr!important;
    text-align:right!important;
    z-index:2!important;
  }
  .gg-mobile-v17 .member-app:not(.flow-mode) > .community-head.gg-v39-header > .gg-v39-more-slot > :not(.gg-mobile-more){display:none!important}
  .gg-mobile-v17 .member-app:not(.flow-mode) > .community-head.gg-v39-header h1,
  .gg-mobile-v17 .member-app:not(.flow-mode) > .community-head.gg-v39-header .gg-v39-more-slot > span,
  .gg-mobile-v17 .member-app:not(.flow-mode) > .community-head.gg-v39-header .gg-v39-more-slot > p{display:none!important}
  .gg-mobile-v17 .member-app:not(.flow-mode) > .community-head.gg-v39-header .gg-mobile-more{
    position:static!important;
    grid-column:auto!important;
    grid-row:auto!important;
    display:grid!important;
    place-items:center!important;
    width:42px!important;
    height:42px!important;
    min-width:42px!important;
    margin:0!important;
    border:1px solid rgba(255,255,255,.13)!important;
    border-radius:50%!important;
    background:rgba(255,255,255,.045)!important;
    color:#fff!important;
  }
  .gg-mobile-v17 .member-app:not(.flow-mode) > .community-head.gg-v39-header .head-person strong{max-width:76px!important}
  .gg-mobile-v17 .member-app:not(.flow-mode) > .community-head.gg-v39-header .head-person small{max-width:76px!important}
}

/* One dark palette across the whole application, not only Community. */
html[data-theme="dark"]{color-scheme:dark!important;background:#090b09!important;--gg-mobile-bg:#090b09!important;--gg-mobile-surface:#111411!important;--gg-mobile-ink:#f5f6f3!important;--gg-mobile-muted:#a6aba5!important;--gg-mobile-line:#292d29!important}
html[data-theme="dark"] body,
html[data-theme="dark"] #root,
html[data-theme="dark"] .member-app,
html[data-theme="dark"] .member-app:not(.flow-mode) .product-body,
html[data-theme="dark"] .platform-page,
html[data-theme="dark"] .learning-page,
html[data-theme="dark"] .records-page,
html[data-theme="dark"] .majlis-watch-page,
html[data-theme="dark"] .public-post-page,
html[data-theme="dark"] .messages-layout,
html[data-theme="dark"] .conversation-inbox,
html[data-theme="dark"] .conversation-thread{
  background:#090b09!important;color:#f5f6f3!important;
}
html[data-theme="dark"] .section-head,
html[data-theme="dark"] .community-main,
html[data-theme="dark"] .feed,
html[data-theme="dark"] .embedded-community{background:transparent!important;color:#f5f6f3!important}

html[data-theme="dark"] .social-post,
html[data-theme="dark"] .community-inline-reel,
html[data-theme="dark"] .composer-launch,
html[data-theme="dark"] .structured-composer,
html[data-theme="dark"] .directory-member-card,
html[data-theme="dark"] .profile-card,
html[data-theme="dark"] .profile-shell,
html[data-theme="dark"] .notification-card,
html[data-theme="dark"] .notifications-list > *,
html[data-theme="dark"] .records-commandbar,
html[data-theme="dark"] .continue-majlis,
html[data-theme="dark"] .featured-majlis,
html[data-theme="dark"] .recording-card,
html[data-theme="dark"] .recording-grid article,
html[data-theme="dark"] .majlis-watch-shell > article,
html[data-theme="dark"] .v38-related,
html[data-theme="dark"] .member-grid > *,
html[data-theme="dark"] .messages-layout > .conversation-inbox,
html[data-theme="dark"] .messages-layout > .conversation-thread,
html[data-theme="dark"] .messages-layout > .conversation-inbox > button,
html[data-theme="dark"] .inbox-title,
html[data-theme="dark"] .thread-person{
  background:#111411!important;color:#f5f6f3!important;border-color:#292d29!important;
}
html[data-theme="dark"] .social-post h1,
html[data-theme="dark"] .social-post h2,
html[data-theme="dark"] .social-post h3,
html[data-theme="dark"] .social-post strong,
html[data-theme="dark"] .section-head h2,
html[data-theme="dark"] .inbox-title strong,
html[data-theme="dark"] .thread-person strong,
html[data-theme="dark"] .directory-member-card h3,
html[data-theme="dark"] .records-page h1,
html[data-theme="dark"] .records-page h2,
html[data-theme="dark"] .records-page h3,
html[data-theme="dark"] .majlis-watch-page h1,
html[data-theme="dark"] .majlis-watch-page h2{color:#f7f8f5!important}
html[data-theme="dark"] .social-post p,
html[data-theme="dark"] .social-post small,
html[data-theme="dark"] .directory-member-card p,
html[data-theme="dark"] .directory-member-card small,
html[data-theme="dark"] .records-page p,
html[data-theme="dark"] .records-page small,
html[data-theme="dark"] .message-search,
html[data-theme="dark"] .messages-layout small{color:#a6aba5!important}

html[data-theme="dark"] input,
html[data-theme="dark"] textarea,
html[data-theme="dark"] select,
html[data-theme="dark"] .message-search input,
html[data-theme="dark"] .conversation-thread > form input,
html[data-theme="dark"] .structured-composer input,
html[data-theme="dark"] .structured-composer textarea,
html[data-theme="dark"] .structured-composer select{
  background:#191c19!important;color:#f5f6f3!important;border-color:#303530!important;caret-color:#e2b238!important;
}
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder{color:#8e948e!important;opacity:1!important}

/* Messages must remain dark end-to-end. */
html[data-theme="dark"] .messages-layout .thread{background:#0d100d!important}
html[data-theme="dark"] .messages-layout .thread > p:not(.mine) > span,
html[data-theme="dark"] .messages-layout .thread > p:not(.mine) .message-copy{background:#252925!important;color:#fff!important}
html[data-theme="dark"] .messages-layout > section > form{background:rgba(13,16,13,.96)!important;border-color:#292d29!important}
html[data-theme="dark"] .attachment-card:not(.audio-card),
html[data-theme="dark"] .gg-v32-voice{background:#222622!important;color:#fff!important;border-color:#333833!important}

/* Bottom nav and More sheet follow the chosen appearance as well. */
html[data-theme="dark"] #gg-mobile-nav{background:rgba(16,19,16,.96)!important;border-color:#2b302b!important;box-shadow:0 14px 42px #0008!important}
html[data-theme="dark"] #gg-mobile-nav button{color:#9ca39c!important}
html[data-theme="dark"] #gg-mobile-nav button.active{background:#27281f!important;color:#fff!important}
html[data-theme="dark"] #gg-mobile-more-sheet > section,
html[data-theme="dark"] #gg-mobile-more-sheet .gg-sheet-grid button{background:#111411!important;color:#f5f6f3!important;border-color:#2c302c!important}

/* Majlis/learning library also follows Dark Mode fully. */
html[data-theme="dark"] .v38-youtube-library .recording-grid,
html[data-theme="dark"] .v38-related-grid{background:transparent!important}
html[data-theme="dark"] .v38-youtube-library .recording-grid a,
html[data-theme="dark"] .v38-related-card{color:#f5f6f3!important}
html[data-theme="dark"] .v38-youtube-library .recording-grid small,
html[data-theme="dark"] .v38-related-card small{color:#a2a8a2!important}