/*
 * Community surfaces on other modules' pages (docs/PARITY-PLAN.md 1.7, 3.3): the home widget community.status
 * (boards Main, HomeDark, HomeDesktop) and the staff dashboard widget community.servers (board AdminDashboard).
 * Requested by the partials with $useStyle('community/surfaces.css'); tokens of core/app.css only. Where the widget
 * sits on the home page (the overlap with the hero) is the home page's CSS (Content).
 */

/* ---------------------------------------------------------------------------------------------- home: phone card */
.community-hs { gap: 10px; }
.community-hs__head { align-items: center; }
.community-hs__head h2 { font-size: 1.125rem; }
/* core follow-up: the boards draw the .section-title .more chevron with stroke 2.2 (core sets 2.4) */
.community-hs__head .more .icon { stroke-width: 2.2; }
.community-hs__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; list-style: none; margin: 0; padding: 0; }
.community-hs__grid li { display: flex; gap: 10px; align-items: center; min-width: 0; }
.community-hs__ic {
  width: 40px; height: 40px; border-radius: 12px; display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.community-hs__ic--ok { background: var(--c-success-soft); color: var(--c-success); }
.community-hs__ic--warn { background: var(--c-warning-soft); color: var(--c-warning); }
.community-hs__ic--bad { background: var(--c-danger-soft); color: var(--c-danger); }
.community-hs__ic--info { background: var(--c-primary-soft); color: var(--c-primary-deep); }
.community-hs__name { font-weight: 800; font-size: 14.5px; line-height: 1.2; margin-bottom: 3px; overflow-wrap: anywhere; }
/* the pill sits on the name's next line as on the board (baseline, not the core middle alignment) */
.community-hs__grid .pill { vertical-align: baseline; }

/* ---------------------------------------------------------------------------------------------- home: desktop strip */
.community-hs-strip { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 0; row-gap: 10px; padding: 14px 16px 14px 24px; border-radius: 20px; }
.community-hs-strip__seg {
  display: flex; align-items: center; gap: 12px; padding-right: 28px; margin-right: 28px; border-right: 1px solid var(--c-line);
}
.community-hs-strip__seg:last-of-type { border-right: 0; }
.community-hs-strip__ic {
  width: 44px; height: 44px; border-radius: 14px; display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.community-hs-strip__t { display: block; font-family: var(--font-display); font-weight: 600; font-size: 17px; line-height: 1.2; }
.community-hs-strip__s { font-size: 13px; color: var(--c-ink-2); }
.community-hs-strip__seg--time > .icon { color: var(--c-ink-2); flex-shrink: 0; }
.community-hs-strip__btn { margin-left: auto; }
/* the board's pills inherit the body line height (1.55): the same text box puts the label on the same pixel row */
.community-hs-strip .pill { line-height: 1.55; }

/* ---------------------------------------------------------------------------------------------- staff dashboard */
/* core follow-ups (bridged for this widget): the board's <strong> is "bolder" (700; core strong is 800), its pills
   inherit the 1.55 line height (core pills: 1.2). The head link chevron (stroke 2) is core's since PAR-FINAL. */
.community-servers-widget .dash-srv strong { font-weight: 700; }
.community-servers-widget .pill { line-height: 1.55; }