/*
  Community smartphone adaptation module.
  Extracted from the former pages/70-community.css; keep after 71-community-compact-layout.css.
*/

/* =========================================================
   P298 — Community smartphone adaptation
   ========================================================= */
body.page-community,
html.page-community body,
body.page-community main.wrap--community{
  min-height:var(--community-vh, 100dvh);
}
body.page-community{
  overflow:hidden;
}
body.page-community .communityShell.panel{
  min-height:var(--community-vh, 100dvh);
  height:var(--community-vh, 100dvh);
  padding-top:max(6px, calc(var(--safe-top) + 6px));
  padding-right:max(6px, calc(var(--safe-right) + 6px));
  padding-bottom:max(6px, calc(var(--safe-bottom) + 6px));
  padding-left:max(6px, calc(var(--safe-left) + 6px));
}
.communityTopbar{
  position:relative;
  z-index:12;
}
.communityBoard__topRight,
.communityRoster__headActions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
}
.communityBoard__rosterBtn,
.communityRoster__close,
.communityRosterBackdrop{
  display:none;
}
.communityRoster__sections{
  min-height:0;
  overflow:auto;
}
.communityTopbar__left,
.communityTopbar__right,
.communityBoard__topLeft,
.communityBoard__topRight,
.communityBoard__heading,
.communityBoard__meta,
.communityMiniProfile__body,
.communityMessage__meta,
.communityComposer__statusWrap,
.communityComposerUploads__list,
.communitySearch,
.communityChannel__main,
.communityChannel__title,
.communityRosterCard__body,
.communityEmbedCard__top,
.communityLinkCard,
.communityUploadItem__meta{
  min-width:0;
}
.communityBoard__meta{
  justify-content:flex-end;
}
.communityComposer__input,
.communitySearch .input{
  -webkit-text-size-adjust:100%;
}

@media (max-width: 1120px){
  html.page-community,
  html.page-community body,
  body.page-community,
  body.page-community main.wrap--community,
  body.page-community .communityShell.panel{
    min-height:var(--community-vh, 100dvh);
    height:var(--community-vh, 100dvh);
  }
  body.page-community .communityShell.panel{
    overflow:hidden;
  }
  .communityWorkspace{
    grid-template-columns:1fr;
    grid-template-areas:none;
    gap:8px;
  }
  .communitySidebar{
    position:fixed;
    inset:max(8px, calc(var(--safe-top) + 8px)) auto max(8px, calc(var(--safe-bottom) + 8px)) max(8px, calc(var(--safe-left) + 8px));
    width:min(340px, calc(100vw - var(--safe-left) - var(--safe-right) - 16px));
    max-width:calc(100vw - var(--safe-left) - var(--safe-right) - 16px);
    max-height:calc(var(--community-vh, 100dvh) - var(--safe-top) - var(--safe-bottom) - 16px);
    z-index:40;
    transform:translateX(calc(-100% - 18px));
    transition:transform .18s ease, opacity .18s ease;
    opacity:0;
  }
  .communitySidebar.is-open{
    transform:translateX(0);
    opacity:1;
  }
  .communityDrawerBackdrop{
    position:fixed;
    inset:0;
    z-index:35;
    display:block;
    background:rgba(2,5,9,.62);
    border:none;
    padding:0;
    cursor:pointer;
  }
  .communityRoster{
    position:fixed;
    left:max(8px, calc(var(--safe-left) + 8px));
    right:max(8px, calc(var(--safe-right) + 8px));
    bottom:max(8px, calc(var(--safe-bottom) + 8px));
    max-height:min(72vh, calc(var(--community-vh, 100dvh) - var(--safe-top) - var(--safe-bottom) - 112px));
    z-index:42;
    transform:translateY(calc(100% + 18px));
    transition:transform .18s ease, opacity .18s ease;
    opacity:0;
    pointer-events:none;
  }
  .communityRoster.is-open{
    transform:translateY(0);
    opacity:1;
    pointer-events:auto;
  }
  .communityRosterBackdrop{
    position:fixed;
    inset:0;
    z-index:41;
    display:block;
    background:rgba(2,5,9,.62);
    border:none;
    padding:0;
    cursor:pointer;
  }
  .communityBoard__rosterBtn,
  .communityRoster__close,
  .communitySidebar__close,
  .communityBoard__channelsBtn{
    display:inline-flex;
  }
  .communityBoard{
    min-height:0;
    height:100%;
    max-height:100%;
  }
}

@media (max-width: 900px){
  .communityTopbar{
    padding:6px 8px;
  }
  .communityTopbar__left{
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    align-items:center;
    gap:6px;
    width:100%;
  }
  .communityTopbar__right{
    gap:6px;
  }
  .communityMiniProfile{
    width:100%;
  }
  .communityMiniProfile__meta{
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .communityBoard,
  .communitySidebar,
  .communityRoster{
    border-radius:14px;
  }
  .communityBoard__top{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:start;
    gap:8px;
  }
  .communityBoard__topLeft{
    width:100%;
    align-items:flex-start;
  }
  .communityBoard__topRight{
    justify-self:end;
    align-items:flex-end;
    flex-direction:column;
    gap:6px;
  }
  .communityBoard__meta{
    display:none;
  }
  .communityBoard__rosterBtn{
    min-height:32px;
    padding:0 10px;
    border-radius:10px;
    white-space:nowrap;
  }
  .communityBoard__title{
    font-size:17px;
  }
  .communityBoard__desc{
    margin-top:2px;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    overflow:hidden;
  }
  .communityHistory{
    padding:6px;
  }
  .communityMessages{
    gap:6px;
    padding-right:0;
  }
  .communityMessage__body{
    max-width:min(90%, 100%);
  }
  .communityComposer{
    padding:8px;
    border-radius:14px;
  }
  .communityComposer__toolbar,
  .communityComposer__bottom,
  .communityComposer__toolbarLeft,
  .communityComposer__toolbarRight{
    gap:6px;
  }
  .communityComposer__toolbarLeft{
    width:100%;
  }
  .communityComposer__bottom{
    flex-direction:column;
    align-items:stretch;
  }
  .communityComposer__actions,
  .communityComposer__actions .btn{
    width:100%;
  }
  .communityUploadItem{
    flex:1 1 100%;
    max-width:100%;
  }
  .communityRoster__sections{
    gap:8px;
  }
  .communityMediaGrid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
  .communityMediaGrid.is-single{
    grid-template-columns:minmax(0, 1fr);
  }
}

@media (max-width: 640px){
  body.page-community .communityShell.panel{
    gap:6px;
    padding-top:max(6px, calc(var(--safe-top) + 4px));
    padding-right:max(6px, calc(var(--safe-right) + 4px));
    padding-bottom:max(6px, calc(var(--safe-bottom) + 4px));
    padding-left:max(6px, calc(var(--safe-left) + 4px));
  }
  .communityTopbar{
    display:grid;
    grid-template-columns:1fr;
    align-items:stretch;
    gap:6px;
  }
  .communityTopbar__left,
  .communityTopbar__right{
    width:100%;
  }
  .communityTopbar__right .btn{
    width:100%;
    justify-content:center;
  }
  .communityMiniProfile{
    grid-template-columns:36px minmax(0,1fr);
    padding:4px 8px 4px 4px;
  }
  .communityMiniProfile__avatar{
    width:36px;
    height:36px;
    border-radius:10px;
  }
  .communityBoard__top{
    grid-template-columns:minmax(0,1fr);
  }
  .communityBoard__topRight{
    justify-self:stretch;
    width:100%;
    align-items:stretch;
  }
  .communityBoard__rosterBtn,
  .communityBoard__channelsBtn{
    width:100%;
    justify-content:center;
  }
  .communityBoard__title{
    font-size:16px;
  }
  .communityBoard__desc,
  .communitySidebar__hint,
  .communityRoster__hint,
  .communityComposer__hint,
  .communityComposer__status,
  .communityComposer__counter,
  .communityMessage__time,
  .communityMessage__edited,
  .communityMessage__deleted,
  .communityMiniProfile__meta,
  .communityChannel__count,
  .communityRoster__count{
    font-size:11px;
  }
  .communitySearch{
    min-height:38px;
  }
  .communitySearch .input,
  .communityComposer__input{
    font-size:16px;
  }
  .communityChannel{
    min-height:40px;
    padding:7px 9px;
  }
  .communityChannel__titleText{
    font-size:13px;
  }
  .communityChannel__count,
  .communityUnread{
    min-width:18px;
    height:18px;
    padding:0 6px;
  }
  .communityMessage{
    grid-template-columns:28px minmax(0,1fr);
    gap:6px;
  }
  .communityMessage__avatar,
  .communityRosterCard__avatar{
    width:28px;
    height:28px;
    border-radius:9px;
  }
  .communityMessage__body{
    max-width:92%;
    padding:9px 10px;
    border-radius:15px;
  }
  .communityMessage__name{
    font-size:12px;
  }
  .communityMessage__text{
    font-size:13px;
    line-height:1.42;
  }
  .communityMessage__actions{
    opacity:1;
    pointer-events:auto;
  }
  .communityComposer{
    padding:7px;
  }
  .communityComposer__toolbarLeft{
    flex-wrap:wrap;
  }
  .communityComposer__input{
    min-height:66px;
    max-height:128px;
  }
  .communityComposer__hint--inline{
    width:100%;
  }
  .communitySidebar{
    width:min(92vw, 340px);
  }
  .communityRoster{
    left:max(6px, calc(var(--safe-left) + 6px));
    right:max(6px, calc(var(--safe-right) + 6px));
    bottom:max(6px, calc(var(--safe-bottom) + 6px));
    border-radius:16px;
  }
  .communityRoster__head,
  .communityRoster__headActions{
    gap:6px;
  }
}

@media (max-width: 420px){
  .communityTopbar__back,
  .communityTopbar .btn,
  .communityBoard__rosterBtn,
  .communityComposer__toolbar .btn,
  .communityComposer__actions .btn{
    min-height:32px;
    padding:0 8px;
    font-size:12px;
  }
  .communityBoard__topLeft{
    gap:6px;
  }
  .communityBoard__channelsBtn{
    width:100%;
  }
  .communityComposer__toolbarLeft,
  .communityComposer__toolbarRight{
    width:100%;
  }
  .communityComposer__toolbar .btn{
    width:100%;
    justify-content:center;
  }
  .communityComposer__hint--inline{
    display:block;
  }
  .communityMediaGrid{
    grid-template-columns:1fr;
  }
  .communityLinkCard,
  .communityEmbedCard__top{
    padding:8px 9px;
  }
}