/* Treatly Glass — the restraint pass.
 * Instagram's polish is restraint: one heading face, few sizes, colour from
 * the content (the treats inside a card), not from the app around it. */

/* one face for a card's words: the title and its clock both in the heading face */
.gcard-title,
.wob .gcard-title,
.wob--hero .gcard-title,
.gcard-head .gcard-title {
  font-size: 21px !important;
  font-weight: 700 !important;
  letter-spacing: -0.015em !important;
}
.gcard-clock {
  font-family: var(--font-head, 'Poppins', var(--font-display)) !important;
  font-size: 21px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  color: rgba(255, 255, 255, 0.62) !important;
  text-shadow: none !important;
}
.gcard[data-tier='1'] .gcard-clock,
.gcard[data-tier='2'] .gcard-clock {
  color: rgba(255, 255, 255, 0.85) !important;
}
/* the last hour: red, clean (no smeared glow) */
.gcard[data-tier='3'] .gcard-clock,
.gcard[data-phase='final'] .gcard-clock {
  color: #ff5a4a !important;
  background: none !important;
  padding: 0 !important;
  box-shadow: none !important;
}

/* no date line under the name */
#today-date {
  display: none !important;
}

/* colour from the content only: no blue edge or pill on a friend's task */
.gcard-src {
  display: none !important;
}
.gcard--by-friend,
.gcard--by-treatly {
  box-shadow:
    inset 0 1.5px 0.5px rgba(255, 255, 255, 0.38),
    inset 0 0 0 1px rgba(255, 255, 255, 0.1),
    0 18px 40px rgba(0, 0, 0, 0.55) !important;
}
.g-pill.gcard-srctag {
  padding: 0 2px 0 0 !important;
  background: none !important;
  box-shadow: none !important;
  color: rgba(255, 255, 255, 0.55) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
/* the streak flame in the header: white, not orange */
#today-streak .gi,
.g-head [class*='streak'] .gi {
  color: #fff !important;
  filter: none !important;
}

/* shorter cards: as tall as what's on them */
.wob .gcard,
.wob--hero .gcard {
  height: 124px !important;
}
.wob .gcard.is-two,
.wob--hero .gcard.is-two {
  height: 148px !important;
}

/* no "What else are you putting off?" box on Home: the + in the bar adds */
#fill-today .g-fill-start,
#sc-today .g-compose {
  display: none !important;
}

/* every task box the same height: a long name ends in "…" on one line */
.wob .gcard,
.wob--hero .gcard,
.wob .gcard.is-two,
.wob--hero .gcard.is-two,
.gcard--friend.is-two:not(.is-open),
#sc-friends .wob .gcard {
  height: 124px !important;
}
.wob .gcard-title,
.wob--hero .gcard-title {
  -webkit-line-clamp: 1 !important;
  display: -webkit-box !important;
  white-space: normal;
  word-break: break-word;
}

/* ===================== Friends, clean like Home ===================== */
/* the header: plain icons, like Instagram's, not glass buttons */
#s-friends .g-head--row .g-btn.glass,
#s-friends .g-head--row .g-bell {
  background: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
#s-friends .g-head--row .g-btn .gi {
  width: 26px !important;
  height: 26px !important;
}
/* a friend's tasks: their face and name above, the cards below; no box round them */
#s-friends .g-list > .g-post-group {
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding: 0 !important;
  gap: 10px !important;
  border-radius: 0 !important;
  background: none !important;
  box-shadow: none !important;
}
#s-friends .g-post-group .g-post-head {
  padding: 0 2px !important;
}
#s-friends .g-post-group .g-post-head .g-avatar {
  width: 32px !important;
  height: 32px !important;
}
#s-friends .g-list {
  gap: 28px !important;
}
/* everything in the column the same width now there are no boxes to match */
#sc-friends .g-feed .g-fd-grid {
  margin-left: 0 !important;
  margin-right: 0 !important;
}
/* challenge and suggested cards: the same type as task cards */
#sc-friends .g-fd-art .g-fd-art-title,
#sc-friends .g-fd-art.is-dare .g-fd-art-title {
  font-size: 21px !important;
  font-style: normal !important;
  letter-spacing: -0.015em !important;
}
#sc-friends .g-fd-art .g-fd-art-line {
  font-size: 13.5px !important;
  color: rgba(255, 255, 255, 0.6) !important;
}
#sc-friends .g-fd-art.is-dare {
  min-height: 124px !important;
}
#sc-friends .g-fd + .g-fd {
  margin-top: 12px !important;
}
#s-friends .g-head--row .g-btn,
#s-friends .g-head--row .g-btn::before,
#s-friends .g-head--row .g-btn::after {
  background: none !important;
  box-shadow: none !important;
  border: 0 !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* Home's suggestions: one "Suggested" label above them, like "Done",
 * not a tag on every card; labels sit close to the cards they name */
#sc-today .g-fd-heading {
  display: block !important;
  margin: 0 !important;
  padding: 0 6px 10px !important;
}
#sc-today .g-feed {
  margin-top: 22px !important;
  padding-top: 0 !important;
  border-top: 0 !important;
}
#sc-today .g-fd-sugg-tag {
  display: none !important;
}
#sc-today .g-list > .g-section,
#sc-friends .g-list > .g-section {
  padding: 22px 6px 10px !important;
  margin: 0 !important;
}
#sc-today .g-list > .g-section:first-child,
#sc-friends .g-list > .g-section:first-child {
  padding-top: 4px !important;
}
/* suggested cards on Home: the same type as task cards */
#sc-today .g-fd-art .g-fd-art-title {
  font-size: 21px !important;
  letter-spacing: -0.015em !important;
}
#sc-today .g-fd-art .g-fd-art-line {
  font-size: 13.5px !important;
  color: rgba(255, 255, 255, 0.6) !important;
}
#sc-today .g-fd-sugg .g-fd-art {
  min-height: 124px !important;
  padding-top: 16px !important;
  padding-bottom: 16px !important;
}

/* Friends: a label sits right on what it names (the list's 28px gap is for
 * between friends), and a "Done" with nothing above it isn't needed at all */
#sc-friends .g-list > .g-section {
  padding: 4px 6px 0 !important;
  margin-bottom: -18px !important;
}
#sc-friends .g-list > .g-section:first-child {
  display: none !important;
}
#sc-friends .gh-duos-host {
  margin-bottom: 6px !important;
}

/* no shine streaks sweeping across cards or the add pane */
.gcard-sheen,
.g-fd-art-sheen,
.g-fd-art-sheen::before {
  display: none !important;
  animation: none !important;
}
#sheet-add .g-sheet.g-new::after,
#sheet-add.is-open .g-sheet.g-new::after {
  animation: none !important;
  background: none !important;
}