/*
 * /css/social_stage2.css
 * VMEREGI Design Stage 2
 * Детальний дизайн стрічки, картки поста, профілю та груп.
 * Підключається після базової дизайн-системи першого етапу.
 */

/* ===== Shared social layout ===== */
.vm-social-layout{
  width:100%;
  align-items:start;
}
.vm-feed-column,
.vm-profile-column,
.vm-group-column{
  min-width:0;
}
.vm-feed-left-rail .card-app,
.vm-feed-right-rail .card-app,
.vm-profile-left-rail .card-app,
.vm-profile-right-rail .card-app,
.vm-group-left-rail .card-app,
.vm-group-right-rail .card-app,
.vm-feed-left-rail .card,
.vm-feed-right-rail .card,
.vm-profile-left-rail .card,
.vm-profile-right-rail .card,
.vm-group-left-rail .card,
.vm-group-right-rail .card{
  border:1px solid var(--vm-border)!important;
  background:var(--vm-surface)!important;
  box-shadow:var(--vm-shadow-xs)!important;
}
.vm-feed-left-rail .card-header,
.vm-feed-right-rail .card-header,
.vm-profile-left-rail .card-header,
.vm-profile-right-rail .card-header,
.vm-group-left-rail .card-header,
.vm-group-right-rail .card-header{
  border-bottom:1px solid var(--vm-border)!important;
  background:transparent!important;
  color:var(--vm-text)!important;
}

/* ===== Feed heading / filters ===== */
.vm-feed-heading{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  margin:4px 2px 14px;
}
.vm-feed-eyebrow{
  margin-bottom:3px;
  color:var(--vm-primary);
  font-size:.72rem;
  font-weight:850;
  letter-spacing:.09em;
  text-transform:uppercase;
}
.vm-feed-title{
  margin:0;
  color:var(--vm-text);
  font-size:clamp(1.35rem,2vw,1.7rem);
  font-weight:850;
  line-height:1.15;
}
.vm-feed-live-dot{
  width:10px;
  height:10px;
  margin-bottom:8px;
  border-radius:50%;
  background:var(--vm-success);
  box-shadow:0 0 0 6px color-mix(in srgb,var(--vm-success) 15%,transparent);
}
.vm-feed-filter-card{
  padding:7px!important;
  border:1px solid var(--vm-border)!important;
  border-radius:20px!important;
  background:var(--vm-surface-glass)!important;
  box-shadow:var(--vm-shadow-xs)!important;
  backdrop-filter:blur(16px);
}
.vm-feed-filter-card>div{
  min-height:48px;
}
.vm-feed-tabs{
  gap:4px;
  padding:2px;
  scrollbar-width:none;
}
.vm-feed-tabs::-webkit-scrollbar{display:none}
.vm-feed-tabs .nav-link{
  flex:0 0 auto;
  min-height:40px;
  padding:10px 15px!important;
  border-radius:14px!important;
  color:var(--vm-muted)!important;
  font-size:.88rem;
  font-weight:760;
  line-height:1;
  transition:color .16s ease,background .16s ease,box-shadow .16s ease,transform .16s ease;
}
.vm-feed-tabs .nav-link:hover{
  color:var(--vm-primary)!important;
  background:var(--vm-primary-soft)!important;
}
.vm-feed-tabs .nav-link.active{
  color:#fff!important;
  background:linear-gradient(135deg,var(--vm-primary),#7557e8)!important;
  box-shadow:0 9px 22px color-mix(in srgb,var(--vm-primary) 27%,transparent)!important;
}
.vm-feed-save{
  min-height:38px;
  border-radius:13px!important;
  white-space:nowrap;
}
.vm-welcome-card{
  position:relative;
  overflow:hidden;
  border:0!important;
  color:#fff!important;
  background:
    radial-gradient(circle at 88% 18%,rgba(255,255,255,.24),transparent 23%),
    linear-gradient(135deg,var(--vm-navigation),var(--vm-primary) 58%,var(--vm-accent))!important;
  box-shadow:var(--vm-shadow)!important;
}
.vm-welcome-card::after{
  content:"";
  position:absolute;
  right:-45px;
  bottom:-75px;
  width:220px;
  height:220px;
  border:34px solid rgba(255,255,255,.08);
  border-radius:50%;
}
.vm-welcome-card .text-muted{color:rgba(255,255,255,.76)!important}
.vm-welcome-card .btn-outline-secondary{border-color:rgba(255,255,255,.45)!important;color:#fff!important}
.vm-empty-feed{
  border:1px dashed var(--vm-border-strong)!important;
  background:linear-gradient(135deg,var(--vm-surface),var(--vm-surface-soft))!important;
}

/* ===== Composer ===== */
.vm-social-composer{
  position:relative;
  overflow:hidden;
  padding:16px!important;
  border:1px solid var(--vm-border)!important;
  border-radius:22px!important;
  background:var(--vm-surface)!important;
  box-shadow:var(--vm-shadow-sm)!important;
}
.vm-social-composer::before{
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:3px;
  background:linear-gradient(90deg,var(--vm-primary),var(--vm-secondary),var(--vm-accent));
}
.vm-post-create-identity{
  display:flex;
  align-items:center;
  gap:11px;
  padding:0 2px 2px;
}
.vm-post-create-avatar{
  width:42px;
  height:42px;
  flex:0 0 42px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border:3px solid var(--vm-surface);
  border-radius:50%;
  color:#fff;
  background:linear-gradient(135deg,var(--vm-primary),var(--vm-accent));
  box-shadow:0 0 0 1px var(--vm-border),0 7px 18px rgba(31,41,96,.12);
  font-size:.84rem;
  font-weight:850;
}
.vm-post-create-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.vm-post-create-person{display:flex;flex-direction:column;min-width:0;line-height:1.25}
.vm-post-create-person strong{color:var(--vm-text);font-size:.92rem;font-weight:820}
.vm-post-create-person span{overflow:hidden;color:var(--vm-muted);font-size:.77rem;text-overflow:ellipsis;white-space:nowrap}
.vm-social-composer .vm-post-create-textarea{
  min-height:92px!important;
  padding:15px 16px!important;
  border:1px solid transparent!important;
  border-radius:17px!important;
  color:var(--vm-text)!important;
  background:var(--vm-surface-soft)!important;
  font-size:1rem!important;
  box-shadow:inset 0 0 0 1px var(--vm-border)!important;
}
.vm-social-composer .vm-post-create-textarea::placeholder{color:var(--vm-muted)!important}
.vm-social-composer .vm-post-create-textarea:focus{
  border-color:var(--vm-border-strong)!important;
  background:var(--vm-surface)!important;
  box-shadow:var(--vm-focus)!important;
}
.vm-social-composer .vm-post-create-toolbar{
  padding-top:2px;
  border-top:1px solid var(--vm-border);
}
.vm-social-composer .vm-post-tool-btn,
.vm-social-composer .vm-post-file-btn,
.vm-social-composer .vm-post-secondary-btn,
.vm-social-composer .vm-post-schedule-input{
  min-height:40px!important;
  height:40px!important;
  border-color:var(--vm-border)!important;
  border-radius:13px!important;
  color:var(--vm-text-soft)!important;
  background:var(--vm-surface)!important;
  font-size:.84rem!important;
  font-weight:730!important;
}
.vm-social-composer .vm-post-tool-btn:hover,
.vm-social-composer .vm-post-file-btn:hover,
.vm-social-composer .vm-post-secondary-btn:hover{
  color:var(--vm-primary)!important;
  border-color:var(--vm-border-strong)!important;
  background:var(--vm-primary-soft)!important;
}
.vm-social-composer .vm-post-submit-btn{
  min-width:130px!important;
  height:42px!important;
  border-radius:14px!important;
  background:linear-gradient(135deg,var(--vm-primary),#7557e8)!important;
  box-shadow:0 10px 24px color-mix(in srgb,var(--vm-primary) 26%,transparent)!important;
}
.vm-social-composer .vm-post-files-hint,
.vm-social-composer .vm-post-file-name,
.vm-social-composer .vm-post-draft-status{color:var(--vm-muted)!important}
.vm-social-composer .vm-post-emoji-box,
.vm-social-composer .vm-post-poll-box,
.vm-social-composer .vm-post-link-preview{
  border-color:var(--vm-border)!important;
  background:var(--vm-surface-soft)!important;
}
.vm-social-composer .vm-post-poll-input,
.vm-social-composer .vm-post-emoji-btn{
  color:var(--vm-text)!important;
  border-color:var(--vm-border)!important;
  background:var(--vm-surface)!important;
}

/* ===== Unified post card ===== */
.vm-feed-post{
  overflow:visible;
  padding:17px!important;
  border:1px solid var(--vm-border)!important;
  border-radius:22px!important;
  background:var(--vm-surface)!important;
  box-shadow:var(--vm-shadow-sm)!important;
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}
.vm-feed-post:hover{
  border-color:var(--vm-border-strong)!important;
  box-shadow:var(--vm-shadow)!important;
  transform:translateY(-1px);
}
.vm-feed-post .vm-post-header{
  min-height:48px;
  margin-bottom:10px;
}
.vm-feed-post .vm-ava,
.vm-feed-post .g-post-userava{
  width:46px!important;
  height:46px!important;
  flex:0 0 46px!important;
  border:3px solid var(--vm-surface)!important;
  border-radius:50%!important;
  box-shadow:0 0 0 1px var(--vm-border),0 7px 18px rgba(31,41,96,.10)!important;
}
.vm-feed-post .post-author,
.vm-feed-post .g-post-authorline>.fw-semibold{
  color:var(--vm-text)!important;
  font-size:.96rem;
  font-weight:820!important;
  line-height:1.25;
}
.vm-feed-post .post-author a,
.vm-feed-post .g-post-authorline a{color:inherit;text-decoration:none}
.vm-feed-post .post-author a:hover,
.vm-feed-post .g-post-authorline a:hover{color:var(--vm-primary)}
.vm-feed-post .post-meta,
.vm-feed-post .g-post-subline{
  margin-top:3px;
  color:var(--vm-muted)!important;
  font-size:.76rem!important;
  line-height:1.35;
}
.vm-feed-post>.mt-2,
.vm-group-post-body>.mb-2{
  color:var(--vm-text-soft);
  font-size:.98rem;
  line-height:1.65;
  overflow-wrap:anywhere;
}
.vm-feed-post a{overflow-wrap:anywhere}
.vm-feed-post .vm-menu-btn{
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border-radius:50%!important;
  color:var(--vm-muted);
  font-size:1.35rem;
  line-height:1;
}
.vm-feed-post .vm-menu-btn:hover{color:var(--vm-primary);background:var(--vm-primary-soft)!important}
.vm-feed-post .vm-menu-box{
  border-color:var(--vm-border)!important;
  border-radius:15px!important;
  background:var(--vm-surface)!important;
  box-shadow:var(--vm-shadow)!important;
}
.vm-feed-post .vm-menu-item{color:var(--vm-text)!important}
.vm-feed-post .vm-menu-item:hover{background:var(--vm-surface-soft)!important}
.vm-feed-post .vm-sponsored-badge{
  padding:3px 8px!important;
  border:1px solid color-mix(in srgb,var(--vm-warning) 35%,transparent)!important;
  color:color-mix(in srgb,var(--vm-warning) 75%,var(--vm-text))!important;
  background:color-mix(in srgb,var(--vm-warning) 14%,transparent)!important;
}
.vm-feed-post .vm-repost-box{
  padding:13px!important;
  border:1px solid var(--vm-border)!important;
  border-radius:17px!important;
  color:var(--vm-text)!important;
  background:var(--vm-surface-soft)!important;
}
.vm-feed-post .post-attachments,
.vm-feed-post .g-post-att{margin-inline:-4px}
.vm-feed-post .attachments-single,
.vm-feed-post .attachments-grid,
.vm-feed-post .g-post-att{
  overflow:hidden;
  border-radius:18px;
}
.vm-feed-post .attachments-grid{gap:4px!important}
.vm-feed-post .att-img,
.vm-feed-post .g-att-img{border-radius:12px!important;background:var(--vm-surface-soft)!important}
.vm-feed-post .att-img img,
.vm-feed-post .g-att-img img{transition:transform .28s ease,filter .28s ease}
.vm-feed-post .att-img:hover img,
.vm-feed-post .g-att-img:hover img{transform:scale(1.025);filter:saturate(1.05)}
.vm-feed-post video{border-radius:18px!important}
.vm-feed-post audio{border-radius:13px;background:var(--vm-surface-soft)}
.vm-feed-post .lp-card-feed{
  margin-top:13px;
  border-color:var(--vm-border)!important;
  border-radius:17px!important;
  background:var(--vm-surface-soft)!important;
}
.vm-feed-post .lp-title{color:var(--vm-text)!important}
.vm-feed-post .lp-desc{color:var(--vm-text-soft)!important}
.vm-feed-post .lp-site{color:var(--vm-muted)!important}

/* ===== Post actions ===== */
.vm-post-actionbar{
  gap:5px!important;
  padding-top:11px;
  border-top:1px solid var(--vm-border);
}
.vm-post-actionbar form{margin:0!important}
.vm-post-actionbar .btn{
  min-height:36px;
  padding:7px 10px!important;
  border-color:transparent!important;
  border-radius:12px!important;
  color:var(--vm-muted)!important;
  background:transparent!important;
  font-size:.8rem!important;
  font-weight:730!important;
  box-shadow:none!important;
}
.vm-post-actionbar .btn:hover{
  color:var(--vm-primary)!important;
  background:var(--vm-primary-soft)!important;
}
.vm-post-actionbar .btn-success{
  color:var(--vm-success)!important;
  background:color-mix(in srgb,var(--vm-success) 13%,transparent)!important;
}
.vm-post-actionbar .btn-danger{
  color:var(--vm-danger)!important;
  background:color-mix(in srgb,var(--vm-danger) 12%,transparent)!important;
}
.vm-post-actionbar .btn-outline-warning{color:var(--vm-warning)!important}
.vm-post-actionbar .btn-outline-primary,
.vm-post-actionbar .btn-outline-info{color:var(--vm-primary)!important}

/* ===== Comments ===== */
.vm-post-comments-panel,
.vm-feed-post .g-comments-wrap{
  margin:13px -17px -17px!important;
  padding:13px 17px 16px!important;
  border-top:1px solid var(--vm-border);
  border-radius:0 0 22px 22px;
  background:color-mix(in srgb,var(--vm-surface-soft) 68%,var(--vm-surface));
}
.vm-post-comments-title,
.vm-feed-post .comments-title{
  color:var(--vm-text)!important;
  font-size:.8rem;
  font-weight:820;
  letter-spacing:.02em;
}
.vm-comment-composer textarea,
.vm-feed-post .g-comments-wrap textarea{
  min-height:46px!important;
  border:1px solid var(--vm-border)!important;
  border-radius:15px!important;
  color:var(--vm-text)!important;
  background:var(--vm-surface)!important;
  resize:vertical;
}
.vm-comment-composer textarea:focus,
.vm-feed-post .g-comments-wrap textarea:focus{border-color:var(--vm-border-strong)!important;box-shadow:var(--vm-focus)!important}
.vm-feed-post .comment-item{
  border-color:var(--vm-border)!important;
  background:var(--vm-surface)!important;
}

/* ===== Profile ===== */
.vm-profile-hero{
  --cover-h:310px!important;
  --avatar:126px!important;
  --overlap:62px!important;
  overflow:visible!important;
  border:1px solid var(--vm-border)!important;
  border-radius:24px!important;
  background:var(--vm-surface)!important;
  box-shadow:var(--vm-shadow)!important;
}
.vm-profile-cover{
  border-radius:24px 24px 0 0;
  background:var(--vm-navigation)!important;
}
.vm-profile-cover::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,transparent 48%,rgba(5,10,30,.28));
}
.vm-profile-cover .profile-cover-bg{filter:blur(22px) saturate(1.1)!important;opacity:.48!important}
.vm-profile-cover .profile-cover-img{object-fit:cover!important}
.vm-profile-cover .profile-cover-empty{
  background:
    radial-gradient(circle at 18% 35%,rgba(91,93,240,.86),transparent 29%),
    radial-gradient(circle at 82% 22%,rgba(236,72,153,.68),transparent 31%),
    linear-gradient(135deg,var(--vm-navigation),#2f45a6 58%,#1da3bc)!important;
}
.vm-profile-avatar{
  left:26px!important;
  right:auto!important;
  top:calc(var(--cover-h) - 68px)!important;
  width:var(--avatar)!important;
  height:var(--avatar)!important;
  padding:5px!important;
  border:0!important;
  border-radius:50%!important;
  background:var(--vm-surface)!important;
  box-shadow:0 0 0 1px var(--vm-border),0 18px 45px rgba(10,18,54,.24)!important;
}
.vm-profile-avatar img,
.vm-profile-avatar .profile-avatar-placeholder{
  border-radius:50%!important;
}
.vm-profile-head{
  min-height:168px;
  padding:27px 24px 22px 174px!important;
  color:var(--vm-text);
}
.vm-profile-name{
  color:var(--vm-text);
  font-size:1.55rem!important;
  font-weight:880!important;
  letter-spacing:-.02em;
}
.vm-profile-username{margin-top:2px;color:var(--vm-primary)!important;font-weight:680}
.vm-profile-head .profile-presence{margin-top:7px}
.vm-profile-head>.mt-1,
.vm-profile-head>.text-muted.small,
.vm-profile-head>.text-muted.small.mt-2{color:var(--vm-text-soft)!important}
.vm-profile-actions{
  position:relative;
  gap:7px!important;
}
.vm-profile-actions .btn{
  min-height:38px;
  padding:8px 13px!important;
  border-radius:13px!important;
  font-size:.8rem!important;
  font-weight:740!important;
}
.vm-profile-tabs-card{
  position:sticky;
  top:calc(var(--vm-topbar-height) + 12px);
  z-index:20;
  padding:6px!important;
  border:1px solid var(--vm-border)!important;
  border-radius:19px!important;
  background:color-mix(in srgb,var(--vm-surface) 92%,transparent)!important;
  box-shadow:var(--vm-shadow-xs)!important;
  backdrop-filter:blur(16px);
}
.vm-profile-tabs{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:5px!important;
  padding:0!important;
}
.vm-profile-tabs .profile-tab-link{
  min-width:0!important;
  height:44px!important;
  display:flex!important;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:0 10px!important;
  border:0!important;
  border-radius:13px!important;
  color:var(--vm-muted)!important;
  background:transparent!important;
  font-size:.84rem;
  font-weight:760;
  white-space:nowrap;
}
.vm-profile-tabs .profile-tab-link:hover{color:var(--vm-primary)!important;background:var(--vm-primary-soft)!important}
.vm-profile-tabs .profile-tab-link.is-active{
  color:#fff!important;
  background:linear-gradient(135deg,var(--vm-primary),#7557e8)!important;
  box-shadow:0 8px 20px color-mix(in srgb,var(--vm-primary) 25%,transparent)!important;
}
.profile-tab-icon{font-size:1rem;line-height:1}
.vm-profile-page .profile-album-card,
.vm-profile-page .profile-album-create-card,
.vm-profile-page .profile-friend-card,
.vm-profile-page .profile-section-card{
  border-color:var(--vm-border)!important;
  background:var(--vm-surface)!important;
  box-shadow:var(--vm-shadow-xs)!important;
}

/* ===== Groups ===== */
.vm-group-container{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
}
.vm-group-hero{
  overflow:visible!important;
  border:1px solid var(--vm-border)!important;
  border-radius:24px!important;
  background:var(--vm-surface)!important;
  box-shadow:var(--vm-shadow)!important;
}
.vm-group-cover{
  position:relative;
  height:300px!important;
  overflow:hidden;
  border-radius:24px 24px 0 0;
  background:var(--vm-navigation)!important;
}
.vm-group-cover::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 52%,rgba(4,8,26,.31));
  pointer-events:none;
}
.vm-group-cover img{object-fit:cover!important;background:var(--vm-navigation)!important}
.vm-group-cover .g-cover-ph{
  background:
    radial-gradient(circle at 22% 30%,rgba(67,211,229,.56),transparent 28%),
    radial-gradient(circle at 82% 18%,rgba(244,114,182,.48),transparent 30%),
    linear-gradient(135deg,var(--vm-navigation),#3149a6 57%,#168fae)!important;
}
.vm-group-head-card{
  min-height:160px;
  padding:24px!important;
  gap:18px!important;
  border-radius:0 0 24px 24px;
  color:var(--vm-text);
  background:var(--vm-surface)!important;
}
.vm-group-head-card .g-avatar-wrap{margin-top:-78px!important}
.vm-group-head-card .g-avatar{
  width:132px!important;
  height:132px!important;
  border:5px solid var(--vm-surface)!important;
  border-radius:24px!important;
  color:var(--vm-text-soft)!important;
  background:var(--vm-surface-soft)!important;
  box-shadow:0 18px 40px rgba(9,16,48,.23)!important;
}
.vm-group-head-card .g-head-title{
  color:var(--vm-text)!important;
  font-size:1.55rem!important;
  font-weight:880!important;
  letter-spacing:-.02em;
}
.vm-group-head-card .g-head-meta{color:var(--vm-muted)!important;font-size:.8rem!important}
.vm-group-head-card .g-head-about{max-width:760px;color:var(--vm-text-soft)!important;line-height:1.6}
.vm-group-head-card .g-head-actions{max-width:360px;gap:7px!important}
.vm-group-head-card .g-head-actions .btn,
.vm-group-head-card .g-links .btn{
  min-height:37px;
  padding:8px 12px!important;
  border-radius:12px!important;
  font-size:.78rem!important;
  font-weight:730!important;
}
.vm-group-tabs{
  position:sticky;
  top:calc(var(--vm-topbar-height) + 12px);
  z-index:19;
  display:flex;
  align-items:center;
  gap:5px;
  margin:-1px 0 16px;
  padding:7px;
  overflow:auto;
  border:1px solid var(--vm-border);
  border-radius:18px;
  background:color-mix(in srgb,var(--vm-surface) 92%,transparent);
  box-shadow:var(--vm-shadow-xs);
  backdrop-filter:blur(16px);
  scrollbar-width:none;
}
.vm-group-tabs::-webkit-scrollbar{display:none}
.vm-group-tabs a{
  flex:1 0 auto;
  min-height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:8px 14px;
  border-radius:12px;
  color:var(--vm-muted);
  text-decoration:none;
  font-size:.83rem;
  font-weight:760;
  white-space:nowrap;
}
.vm-group-tabs a:hover{color:var(--vm-primary);background:var(--vm-primary-soft)}
.vm-group-tabs a.is-active{color:#fff;background:linear-gradient(135deg,var(--vm-primary),#7557e8);box-shadow:0 8px 20px color-mix(in srgb,var(--vm-primary) 25%,transparent)}
.vm-group-events-card,
.vm-group-composer-card{
  border:1px solid var(--vm-border)!important;
  border-radius:20px!important;
  background:var(--vm-surface)!important;
  box-shadow:var(--vm-shadow-xs)!important;
}
.vm-group-events-card .border{border-color:var(--vm-border)!important;background:var(--vm-surface-soft)!important}
.vm-group-post{padding:0!important}
.vm-group-post-body{padding:17px!important}
.vm-group-post .g-post-subline a{color:var(--vm-primary)!important}
.vm-group-post .g-comments-wrap{margin-inline:-17px!important;margin-bottom:-17px!important}

/* ===== Dark theme corrections ===== */
html[data-theme="dark"] .vm-feed-post .text-muted,
html[data-theme="dark"] .vm-profile-head .text-muted,
html[data-theme="dark"] .vm-group-head-card .text-muted{color:var(--vm-muted)!important}
html[data-theme="dark"] .vm-feed-post .btn-outline-dark,
html[data-theme="dark"] .vm-group-head-card .btn-outline-dark{color:var(--vm-text-soft)!important}
html[data-theme="dark"] .vm-feed-post .form-control,
html[data-theme="dark"] .vm-group-post .form-control{color:var(--vm-text)!important;background:var(--vm-surface)!important}
html[data-theme="dark"] .vm-feed-post .vm-menu-box{box-shadow:0 20px 55px rgba(0,0,0,.42)!important}

/* ===== Responsive ===== */
@media (min-width:1200px){
  .vm-feed-page{grid-template-columns:minmax(190px,230px) minmax(520px,730px) minmax(210px,270px)!important;justify-content:center}
  .vm-profile-page,
  .vm-group-page{grid-template-columns:minmax(185px,220px) minmax(620px,850px) minmax(200px,250px)!important;justify-content:center}
}
@media (max-width:1199.98px) and (min-width:992px){
  .vm-feed-page,
  .vm-profile-page,
  .vm-group-page{grid-template-columns:minmax(0,1fr) 250px!important}
  .vm-feed-left-rail,
  .vm-profile-left-rail,
  .vm-group-left-rail{display:none!important}
}
@media (max-width:767.98px){
  .vm-feed-filter-card{border-radius:17px!important}
  .vm-feed-filter-card>div{align-items:stretch!important}
  .vm-feed-filter-card form{display:none}
  .vm-feed-tabs{width:100%}
  .vm-feed-tabs .nav-link{padding:10px 13px!important}
  .vm-feed-heading{margin-top:0}
  .vm-social-composer{padding:13px!important;border-radius:18px!important}
  .vm-social-composer .vm-post-create-tools{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px!important}
  .vm-social-composer .vm-post-tool-btn,
  .vm-social-composer .vm-post-file-wrap,
  .vm-social-composer .vm-post-file-trigger,
  .vm-social-composer .vm-post-file-btn{width:100%!important}
  .vm-social-composer .vm-post-file-name{display:none}
  .vm-feed-post{padding:14px!important;border-radius:18px!important}
  .vm-post-comments-panel,
  .vm-feed-post .g-comments-wrap{margin:12px -14px -14px!important;padding:12px 14px 14px!important;border-radius:0 0 18px 18px}
  .vm-post-actionbar{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));width:100%}
  .vm-post-actionbar>form,
  .vm-post-actionbar>a{width:100%}
  .vm-post-actionbar .btn{width:100%;justify-content:center}
  .vm-profile-hero{--cover-h:220px!important;--avatar:104px!important;--overlap:48px!important;border-radius:20px!important}
  .vm-profile-cover{border-radius:20px 20px 0 0}
  .vm-profile-avatar{left:18px!important;top:calc(var(--cover-h) - 52px)!important}
  .vm-profile-head{min-height:175px;padding:66px 16px 17px!important}
  .vm-profile-name{font-size:1.28rem!important}
  .vm-profile-actions{gap:6px!important}
  .vm-profile-tabs-card,
  .vm-group-tabs{top:calc(var(--vm-topbar-height) + 7px)}
  .vm-profile-tabs{display:flex!important;overflow:auto;scrollbar-width:none}
  .vm-profile-tabs::-webkit-scrollbar{display:none}
  .vm-profile-tabs .profile-tab-link{flex:0 0 auto;padding:0 13px!important}
  .vm-group-cover{height:220px!important;border-radius:20px 20px 0 0}
  .vm-group-head-card{display:block!important;padding:16px!important;border-radius:0 0 20px 20px}
  .vm-group-head-card .g-avatar-wrap{display:inline-block;margin-top:-62px!important;margin-bottom:8px}
  .vm-group-head-card .g-avatar{width:100px!important;height:100px!important;border-radius:20px!important}
  .vm-group-head-card .g-head-title{font-size:1.3rem!important}
  .vm-group-head-card .g-head-actions{justify-content:flex-start;margin-top:14px;max-width:none}
  .vm-group-tabs a{flex:0 0 auto}
}
@media (max-width:480px){
  .vm-post-create-person span{max-width:190px}
  .vm-post-actionbar{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .vm-profile-tabs .profile-tab-link span:last-child{display:none}
  .vm-profile-tabs .profile-tab-link{width:44px;padding:0!important}
  .profile-tab-icon{font-size:1.1rem}
}