/* ReBBu Unified Web: the community page. */


.uw-room-list .uw-badge-hotel { min-width: 72px; text-align: center; }
.uw-occupancy { width: 70px; height: 8px; border-radius: 999px; background: var(--uw-night); overflow: hidden; flex: none; }
.uw-occupancy span { display: block; height: 100%; border-radius: 999px; background: linear-gradient(to right, var(--uw-classic-green), var(--uw-gold)); }
.uw-occupancy-text { width: 44px; text-align: right; flex: none; }

.uw-people { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); gap: 12px; }
.uw-people a { display: flex; flex-direction: column; align-items: center; text-decoration: none; gap: 2px; padding: 6px 2px; border-radius: var(--uw-radius-small); }
.uw-page .uw-people a { color: var(--uw-text); }
.uw-people a:hover { background: var(--uw-panel-raised); }
.uw-people img { image-rendering: pixelated; }
.uw-people span { font-size: 12px; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: flex; align-items: center; gap: 4px; }
.uw-people span.uw-online::before { content: ""; width: 14px; height: 8px; clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); background: var(--uw-ok); flex: none; }

.uw-tag-search { display: flex; gap: 8px; }
.uw-tag-search .uw-input { flex: 1; min-width: 0; padding: 7px 10px; }

/* the groups page: a search above cards of all groups */
.ug-search { display: flex; gap: 10px; max-width: 520px; margin: 0 0 24px 0; }
.ug-search .uw-input { flex: 1; min-width: 0; padding: 9px 12px; }
.ug-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(340px, 100%), 1fr)); gap: 18px; }
.ug-card { display: flex; gap: 16px; padding: 18px; border-radius: var(--uw-radius-small); background: var(--uw-panel-raised); }
.ug-badge { flex: none; display: grid; place-items: center; width: 72px; height: 72px; border-radius: var(--uw-radius-small); background: var(--uw-night); }
.ug-badge img { width: 39px; height: 39px; image-rendering: pixelated; }
.ug-main { min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.ug-main .uw-h3 { margin: 0; font-size: 18px; overflow-wrap: anywhere; }
.uw-page .ug-main .uw-h3 a { color: var(--uw-text); }
.uw-page .ug-main .uw-h3 a:hover { color: var(--uw-gold); }
.ug-desc { margin: 0; font-size: 14px; line-height: 1.5; color: var(--uw-muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ug-meta { margin: 4px 0 0 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ug-meta .uw-chip { background: var(--uw-night); }
.ug-state-open::before { background: var(--uw-ok); }
.ug-state-request::before { background: var(--uw-gold); }
.ug-state-closed::before { background: var(--uw-danger); }
.ug-forum { font-size: 14px; margin-left: 4px; }

/* Meine Gruppen: the role and the favourite as chips */
.ug-meta .ug-role-owner, .ug-meta .ug-favourite { background: var(--uw-gold); color: #3a2600; }
.ug-meta .ug-role-owner::before, .ug-meta .ug-favourite::before { background: #3a2600; }
.ug-meta .ug-role-admin::before { background: var(--uw-link); }
.ug-meta .ug-role-request::before { background: var(--uw-gold); }
.ug-new { margin-top: var(--uw-gap); max-width: 760px; }
.ug-new textarea { resize: vertical; }

@media (max-width: 560px) {
	.uw-occupancy, .uw-occupancy-text { display: none; }
}