/* HG Connect shared module frame: used on public Connect and HG Connect wp-admin.
   The inner padding, titles, rail layouts and interactions remain module-owned. */
.hg-connect-module-frame {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    background: #fff;
    border: 1px solid #dce7f5;
    border-radius: 15px;
    box-shadow: 0 10px 28px rgba(0, 29, 110, .08);
    overflow: hidden;
}

/* Dashboard: the OUTER workspace content is the single frame. The dashboard
   inner container and Profile Overview are not wrapped again. */
.hg-connect-wrapper .hg-active-tab-dashboard .hg-dashboard-content.hg-connect-module-frame {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    background: #fff;
    border: 1px solid #dce7f5;
    border-radius: 15px;
    box-shadow: 0 10px 28px rgba(0, 29, 110, .08);
}
@media (max-width: 768px) {
    .hg-connect-wrapper .hg-active-tab-dashboard .hg-dashboard-content.hg-connect-module-frame {
        margin-inline: 0;
        padding: 10px 12px 22px;
    }
}

/* Workspace tabs use the same frame as Activities / Communities / Notifications.
   Do not add a second mobile 9.5px gutter: the main HG Connect wrapper owns it. */
.hg-connect-wrapper .hg-dashboard-content-inner.hg-connect-module-frame {
    max-width: 100%;
    padding: 16px;
    overflow: visible;
}
@media (max-width: 768px) {
    .hg-connect-wrapper .hg-dashboard-content-inner.hg-connect-module-frame {
        width: 100%;
        max-width: 100%;
        margin-inline: 0;
        padding: 12px;
    }
}


/* Shared Community Hub header contract — one visual source for the five modules.
   The outer HG Connect wrapper (not this header) owns the 9.5px mobile gutter. */
.hg-community-hub-header{
    --hg-hub-primary:#001d6e;--hg-hub-soft:#f4f8ff;--hg-hub-border:#dce7f5;
    --hg-hub-text:#17233d;--hg-hub-muted:#66758c;
}
        .hg-community-hub-header{
            display:flex;
            gap:14px;
            align-items:center;
            justify-content:space-between;
            padding:15px 16px 13px;
            background:linear-gradient(135deg,#fff 0%,var(--hg-hub-soft) 100%);
            border-bottom:1px solid var(--hg-hub-border)
        }
        .hg-community-hub-heading{
            display:flex;
            min-width:0;
            align-items:center;
            gap:10px
        }
        .hg-community-hub-icon-badge{
            display:grid;
            width:40px;
            height:40px;
            flex:0 0 40px;
            place-items:center;
            color:var(--hg-hub-primary);
            background:#e8f0fb;
            border-radius:12px;
            font-size:19px
        }
        .hg-community-hub-title-wrap{min-width:0}
        .hg-connect-module-frame .hg-community-hub-title-wrap h2{
            margin:0 0 3px;
            color:var(--hg-hub-primary);
            font-size:16px;
            line-height:1.15
        }
        .hg-connect-module-frame .hg-community-hub-description{
            margin:0;
            color:var(--hg-hub-muted);
            font-size:11px;
            line-height:1.4
        }
        .hg-community-hub-role{
            display:inline-flex;
            min-height:28px;
            align-items:center;
            padding:5px 9px;
            color:var(--hg-hub-primary);
            background:#fff;
            border:1px solid var(--hg-hub-border);
            border-radius:999px;
            font-size:10px;
            font-weight:800;
            white-space:nowrap
        }

@media(max-width:560px){
    .hg-community-hub-header{align-items:flex-start;padding:12px}
    .hg-community-hub-role{display:none}
}

/* The shared heading reaches the frame edges; content keeps its own safe inset. */
.hg-dashboard-content-inner.hg-connect-module-frame > .hg-community-hub-header{
    margin:-16px -16px 14px;
}
.hg-activities-container.hg-connect-module-frame > .hg-community-hub-header,
.hg-bt-inbox.hg-connect-module-frame > .hg-community-hub-header{
    margin:-13px -13px 14px;
}
@media(max-width:768px){
    .hg-dashboard-content-inner.hg-connect-module-frame > .hg-community-hub-header{
        margin:-12px -12px 12px;
    }
}
@media(max-width:520px){
    .hg-bt-inbox.hg-connect-module-frame > .hg-community-hub-header{
        margin:-10px -10px 12px;
    }
}

/* PATCH 033: Public Profile uses the standard dashboard frame directly.
   Earnings uses its existing Activity module frame and identical shared header. */
.hg-connect-wrapper .hg-earnings-module.hg-connect-module-frame {
    --hg-earnings-frame-inset: clamp(10px, 2vw, 18px);
    padding: var(--hg-earnings-frame-inset);
}
.hg-connect-wrapper .hg-earnings-module.hg-connect-module-frame > .hg-community-hub-header {
    margin: calc(-1 * var(--hg-earnings-frame-inset))
            calc(-1 * var(--hg-earnings-frame-inset)) 14px;
}