/* Shared workspace chrome for Manager, Member and Owner pages.
   Keep responsive header, account actions and reusable controls here. */
:root {
  --workspace-mobile-drawer-width:min(86vw,280px);
  --workspace-control-height:42px;
  --workspace-control-radius:10px;
}

.manager-clean-topbar,
.public-clean-topbar {
  justify-content:flex-end;
}
.manager-clean-topbar .workspace-drawer-trigger {margin-right:auto}
.manager-clean-topbar .header-dashboard,
.manager-clean-topbar .account-bell,
.manager-clean-topbar .header-inbox,
.manager-clean-topbar [data-account-inbox] {display:none!important}
.public-clean-topbar .header-controls {margin-left:auto}

@media(min-width:901px) {
  .workspace-content>.manager-clean-topbar {
    min-height:40px;
    padding-block:3px;
  }
  .manager-clean-topbar .header-controls,
  .manager-clean-topbar .header-display-controls {min-height:32px}
  .manager-clean-topbar .appearance-toggle,
  .manager-clean-topbar .header-display-controls select,
  .manager-clean-topbar .auto-update-controls button {
    min-height:32px;
    height:32px;
  }
}

.manager-clean-topbar .appearance-toggle,
.public-clean-topbar #public-theme {
  min-height:34px;
  min-width:74px;
  padding:4px 8px;
  justify-content:center;
  gap:7px;
  border-radius:var(--workspace-control-radius);
  font-weight:800;
}
.manager-clean-topbar .appearance-toggle .theme-art,
.public-clean-topbar #public-theme .theme-art {
  width:22px;
  height:22px;
  flex:0 0 22px;
}

/* One shared account row: identity stays left, logout stays right. */
.drawer-workspace-nav .sidebar-account {
  width:100%;
  margin-top:14px;
  padding-top:14px;
  border-top:1px solid var(--line);
}
.drawer-workspace-nav .sidebar-account-controls {
  display:grid;
  width:100%;
  grid-template-columns:minmax(0,1fr) 44px;
  align-items:center;
  justify-content:stretch;
  gap:12px;
}
.drawer-workspace-nav .sidebar-account-profile {
  display:grid;
  width:100%;
  min-width:0;
  min-height:58px;
  grid-template-columns:48px minmax(0,1fr);
  justify-self:start;
}
.drawer-workspace-nav .sidebar-account-avatar {width:46px;height:46px}
.drawer-workspace-nav .sidebar-account-heading {display:grid;min-width:0}
.drawer-workspace-nav .sidebar-account-logout {
  display:grid!important;
  width:42px;
  min-width:42px;
  height:42px;
  justify-self:end;
  border:1px solid color-mix(in srgb,var(--gold) 62%,var(--line));
  border-radius:50%;
  background:color-mix(in srgb,var(--gold) 13%,var(--panel2));
  color:var(--text);
  opacity:1;
  box-shadow:0 3px 12px #0003;
}
.drawer-workspace-nav .sidebar-account-logout .premium-logout-icon {
  width:38px;
  height:38px;
  opacity:1;
  filter:brightness(1.14) drop-shadow(0 0 4px color-mix(in srgb,var(--gold) 42%,transparent));
}
body.light .drawer-workspace-nav .sidebar-account-logout {
  background:color-mix(in srgb,var(--gold) 8%,#fff);
  box-shadow:0 3px 10px #17203322;
}

/* Logout uses the same contrast-safe treatment in the permanent desktop rail. */
.desktop-workspace-nav .sidebar-account-logout {
  display:grid!important;
  width:42px;
  min-width:42px;
  height:42px;
  place-items:center;
  border:1px solid color-mix(in srgb,var(--gold) 68%,var(--line));
  border-radius:50%;
  background:color-mix(in srgb,var(--gold) 14%,var(--panel2));
  opacity:1;
  box-shadow:0 3px 12px #0004;
}
.desktop-workspace-nav .sidebar-account-logout .premium-logout-icon {
  width:38px;
  height:38px;
  opacity:1;
  filter:brightness(1.18) drop-shadow(0 0 5px color-mix(in srgb,var(--gold) 48%,transparent));
}
body.light .desktop-workspace-nav .sidebar-account-logout {
  background:color-mix(in srgb,var(--gold) 8%,#fff);
}
body.workspace-sidebar-collapsed .desktop-workspace-nav .sidebar-account-logout {display:none!important}

/* Shared compact class summary for both organizer and member board views. */
.group-job-summary {
  grid-template-columns:minmax(100px,130px) minmax(0,1fr)!important;
  gap:7px!important;
  padding:6px 8px!important;
}
.group-job-summary>strong {font-size:11px!important}
.group-job-summary>div {gap:4px!important}
.group-job-chip {
  display:flex!important;
  align-items:center!important;
  min-width:74px!important;
  padding:3px 4px!important;
  grid-template-columns:15px auto minmax(32px,1fr)!important;
  column-gap:4px!important;
  border-radius:7px!important;
}
.group-job-chip>.class-image {width:15px!important;height:15px!important}
.group-job-chip b {font-size:11px!important;line-height:1!important}
.group-job-chip i {
  display:flex!important;
  align-items:center;
  gap:4px;
  font-size:8px!important;
  line-height:1.05;
  white-space:nowrap;
}
.group-job-chip i small {font-size:7px!important;line-height:1.05}

/* Member portal uses different markup; keep its class summary identical in scale. */
body[data-workspace="member"] .public-group-summary {
  grid-template-columns:minmax(100px,130px) minmax(0,1fr)!important;
  gap:7px!important;
  padding:6px 8px!important;
}
body[data-workspace="member"] .public-group-summary>strong {font-size:11px!important}
body[data-workspace="member"] .public-group-summary>div {gap:4px!important}
body[data-workspace="member"] .public-job-summary {
  flex:0 0 auto!important;
  min-width:74px!important;
  padding:3px 4px!important;
  gap:4px!important;
  border-radius:7px!important;
}
body[data-workspace="member"] .public-job-summary>img {width:15px!important;height:15px!important}
body[data-workspace="member"] .public-job-summary>b {font-size:11px!important}
body[data-workspace="member"] .public-job-summary>span {
  display:flex!important;
  align-items:center;
  gap:4px!important;
  font-size:8px!important;
  line-height:1.05!important;
  white-space:nowrap;
}
body[data-workspace="member"] .public-job-summary small {font-size:7px!important;line-height:1.05!important}

/* Shared two-row group heading used by manager and member views. */
.shared-group-head {position:relative!important}
.shared-group-identity {
  display:grid!important;
  width:100%!important;
  min-width:0;
  grid-template-rows:auto auto!important;
  gap:3px!important;
}
.shared-group-title {
  display:flex;
  min-width:0;
  align-items:center;
  justify-content:center;
  text-align:center;
}
.shared-group-title>h2,
.shared-group-title>h3 {margin:0}
.shared-group-meta {
  display:flex;
  width:100%;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.shared-group-count {justify-self:start;text-align:left}
.shared-group-field {justify-self:end;text-align:right}
body[data-workspace="manager"] .shared-group-head>.collapse-group {
  position:absolute;
  top:50%;
  left:9px;
  z-index:2;
  transform:translateY(-50%);
}
body[data-workspace="manager"] .shared-group-identity {padding-inline:38px}
body[data-workspace="manager"] .shared-group-title .inline-group-name {
  position:relative;
  display:inline-grid!important;
  width:auto!important;
  max-width:min(100%,430px);
  margin:0!important;
  place-items:center;
  gap:0!important;
}
body[data-workspace="manager"] .shared-group-title .inline-group-name .premium-edit-icon {
  position:absolute;
  right:calc(100% + 7px);
  width:21px;
  height:21px;
}
body[data-workspace="manager"] .shared-group-title .inline-group-name input {
  width:auto!important;
  max-width:100%!important;
  height:25px!important;
  text-align:center!important;
  font-size:20px!important;
  font-weight:900!important;
  line-height:1.15!important;
}
body[data-workspace="manager"] .shared-group-head {
  min-height:0!important;
  padding:5px 10px!important;
}
body[data-workspace="manager"] .shared-group-meta .shared-group-count {
  color:#fff;
  font-size:12px;
  font-weight:900;
  letter-spacing:1.2px;
}
body[data-workspace="manager"] .shared-group-meta .raid-field-badge {
  padding:2px 10px;
  font-size:12px;
}
body[data-workspace="member"] .public-lineup-head>.shared-group-identity {grid-column:1/-1}
body[data-workspace="member"] .public-lineup-head {
  min-height:0!important;
  padding:7px 12px!important;
}
body[data-workspace="member"] .shared-group-title h2 {
  justify-content:center;
  gap:7px;
  font-size:18px!important;
  line-height:1.15;
}
body[data-workspace="member"] .shared-group-meta .shared-group-count {font-size:12px;font-weight:800;letter-spacing:.04em}
body[data-workspace="member"] .shared-group-meta .shared-group-field>b {
  min-width:0;
  padding:3px 10px;
  font-size:12px;
}

/* Slightly taller than the original control without becoming a banner. */
body[data-workspace="manager"] .board-manage-groups {
  min-width:240px;
  min-height:48px;
  padding:9px 17px;
  font-size:15px;
  border-width:1px;
  border-radius:11px;
}
body[data-workspace="manager"] .board-manage-groups .ui-icon {width:21px;height:21px}

@media(max-width:900px) {
  .workspace-mobile-drawer {
    width:var(--workspace-mobile-drawer-width)!important;
    padding-top:10px!important;
    overflow:hidden!important;
  }
  .workspace-mobile-drawer .workspace-drawer-head {display:none!important}
  .workspace-mobile-drawer .drawer-workspace-nav {
    min-height:0;
    padding-bottom:82px!important;
    overflow-y:auto;
    overscroll-behavior:contain;
  }
  .drawer-workspace-nav>.workspace-nav-heading {
    display:grid!important;
    width:100%!important;
    position:sticky;
    top:0;
    z-index:5;
    flex:0 0 auto;
    background:linear-gradient(145deg,color-mix(in srgb,var(--gold) 10%,var(--panel)),var(--panel2));
    box-shadow:0 8px 14px color-mix(in srgb,var(--panel) 90%,transparent);
  }
  .drawer-workspace-nav .sidebar-account {
    display:grid!important;
    position:absolute;
    right:10px;
    bottom:10px;
    left:10px;
    z-index:6;
    margin:0;
    padding:10px 4px 4px;
    background:linear-gradient(to bottom,color-mix(in srgb,var(--panel) 90%,transparent),var(--panel) 18%);
    box-shadow:0 -9px 16px color-mix(in srgb,var(--panel) 92%,transparent);
  }
  /* Desktop collapsed state is stored globally; never let it collapse mobile drawer content. */
  body.workspace-sidebar-collapsed .drawer-workspace-nav>.workspace-nav-heading {
    display:grid!important;
  }
  body.workspace-sidebar-collapsed .drawer-workspace-nav .sidebar-account-heading {
    display:grid!important;
  }
  body.workspace-sidebar-collapsed .drawer-workspace-nav .sidebar-account-controls {
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 44px!important;
    justify-items:stretch!important;
    gap:12px!important;
  }
  body.workspace-sidebar-collapsed .drawer-workspace-nav .sidebar-account-profile {
    display:grid!important;
    width:100%!important;
    min-width:0!important;
    padding:5px!important;
    grid-template-columns:48px minmax(0,1fr)!important;
  }
  body.workspace-sidebar-collapsed .drawer-workspace-nav .sidebar-account-avatar {
    width:46px!important;
    height:46px!important;
    border-radius:14px;
  }
  body.workspace-sidebar-collapsed .drawer-workspace-nav .sidebar-account-name,
  body.workspace-sidebar-collapsed .drawer-workspace-nav .sidebar-account-logout {
    display:grid!important;
  }
  .workspace-content>.topbar {
    z-index:78!important;
    transition:transform .2s ease,width .2s ease;
  }
  body.workspace-drawer-open .workspace-content>.topbar {
    width:calc(100% - var(--workspace-mobile-drawer-width));
    transform:translateX(var(--workspace-mobile-drawer-width));
  }
  .workspace-mobile-drawer {z-index:80}
  .workspace-drawer-backdrop {z-index:79}

  .manager-clean-topbar {
    display:flex;
    min-height:58px;
    padding:8px 10px;
    flex-wrap:nowrap!important;
    align-items:center;
    gap:8px;
  }
  .manager-clean-topbar>.workspace-drawer-trigger {
    flex:0 0 auto;
    margin-right:auto;
    white-space:nowrap;
  }
  .manager-clean-topbar>.header-controls {
    display:flex!important;
    width:auto!important;
    max-width:calc(100% - 82px);
    margin-left:auto;
    flex:0 1 auto;
    flex-wrap:nowrap!important;
    align-items:center;
    justify-content:flex-end!important;
    gap:6px;
  }
  .manager-clean-topbar .auto-update-controls {flex:0 0 auto}
  .manager-clean-topbar .header-display-controls {
    display:flex;
    width:auto;
    flex:0 1 auto;
    grid-template-columns:none;
    align-items:center;
    gap:6px;
  }
  .manager-clean-topbar .header-display-controls select {
    width:auto;
    min-width:82px;
    max-width:112px;
  }
  .manager-clean-topbar .appearance-toggle span {display:inline!important;font-size:12px;font-weight:800}
  .manager-clean-topbar .appearance-toggle {
    min-width:74px;
    white-space:nowrap!important;
  }
  body[data-workspace="manager"] .board-manage-groups {
    width:auto;
    min-width:220px;
    min-height:48px;
    margin-left:auto;
    font-size:15px;
  }
  .group-job-summary,
  .public-group-summary {grid-template-columns:minmax(88px,112px) minmax(0,1fr)!important}
}

@media(max-width:560px) {
  :root {--workspace-mobile-drawer-width:min(82vw,270px)}
  .manager-clean-topbar>.header-controls {max-width:calc(100% - 70px)}
  .manager-clean-topbar .auto-update-controls label,
  .manager-clean-topbar .auto-update-controls span:not(.badge) {display:none}
  .manager-clean-topbar .header-display-controls select {min-width:66px;max-width:82px}
  .manager-clean-topbar .appearance-toggle {
    min-width:70px;
    padding-inline:6px;
    font-size:12px;
  }
  .manager-clean-topbar .appearance-toggle .theme-art {width:20px;height:20px;flex-basis:20px}
}
.workspace-actions a[href*="page=billing"]{display:none!important}

.manager-login-page{min-height:calc(100vh - 72px);display:grid;place-items:center;padding:32px 20px;background:radial-gradient(circle at 50% 25%,rgba(198,146,56,.12),transparent 34%)}
.manager-login-card{width:min(100%,440px);display:grid;justify-items:center;gap:16px;padding:42px;border:1px solid var(--line);border-radius:20px;background:var(--panel);box-shadow:0 24px 60px rgba(20,30,48,.13);text-align:center}
.manager-login-card h1,.manager-login-card p{margin:0}.manager-login-card p{color:var(--muted);line-height:1.7}.manager-login-card .google-button{width:100%;justify-content:center;margin-top:8px}.manager-login-mark{width:64px;height:64px;display:grid;place-items:center;border-radius:18px;background:var(--panel2);color:var(--gold)}.manager-login-mark svg{width:34px;height:34px}

.workspace-grid-rect{grid-template-columns:1fr!important;max-width:980px;gap:14px}
.workspace-card-rect{max-width:none!important;min-height:132px!important;display:grid!important;grid-template-columns:76px minmax(0,1fr) 28px;align-items:center;gap:20px;padding:22px 24px!important;border-radius:16px}
.workspace-card-rect .workspace-card-logo{width:68px!important;height:68px!important;border-radius:16px;overflow:hidden;background:var(--panel2);display:grid;place-items:center;font-size:28px;font-weight:700;color:var(--gold)}
.workspace-card-rect .workspace-card-logo img{width:100%;height:100%;object-fit:cover}.workspace-card-rect h2{margin:0 0 4px!important}.workspace-card-rect .workspace-owner{margin:10px 0 0}.workspace-card-meta{display:flex;gap:8px 20px;flex-wrap:wrap;color:var(--muted);font-size:13px;margin-top:10px}.workspace-card-arrow{font-size:40px;color:var(--gold);line-height:1}
.workspace-create-rect{max-width:980px;min-height:96px!important;display:flex;flex-direction:row;justify-content:flex-start;padding:20px 28px;gap:18px;border-radius:16px;text-align:left}.workspace-create-rect>span:first-child{font-size:34px}.workspace-create-rect small{display:block;margin-top:4px;color:var(--muted)}
@media(max-width:650px){.manager-login-card{padding:30px 22px}.workspace-card-rect{grid-template-columns:56px minmax(0,1fr) 18px;gap:12px;padding:16px!important}.workspace-card-rect .workspace-card-logo{width:54px!important;height:54px!important}.workspace-card-rect .between{align-items:flex-start}.workspace-card-rect .badge{font-size:10px}.workspace-card-arrow{font-size:30px}.workspace-create-rect{padding:16px 20px}}