/* Only the workbench keeps a project photo banner. */
body[data-app-surface="mobile"] .mobile-content[data-page-code]:not([data-page-code="M02"])::before {
  content: none !important;
  display: none !important;
}

body[data-app-surface="mobile"] .mobile-app .mobile-content[data-page-code="M70"]::before {
  content: none !important;
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
}

body[data-app-surface="mobile"] .mobile-content:is([data-page-code="M04"], [data-page-code="M05"], [data-page-code="M70"], [data-page-code="M80"]) {
  padding: 12px 12px calc(24px + var(--safe-bottom));
  background: #f1f5f8;
}

body[data-app-surface="mobile"] .mobile-content:is([data-page-code="M04"], [data-page-code="M05"], [data-page-code="M70"], [data-page-code="M80"]) > .mobile-project-card--root {
  margin: 10px 12px 0;
  overflow: hidden;
  border: 0;
  border-radius: 12px;
  box-shadow: none;
}

body[data-app-surface="mobile"] .mobile-project-card--root .mobile-project-summary {
  min-height: 96px;
  padding: 13px;
}

body[data-app-surface="mobile"] .mobile-project-card--root .mobile-project-summary h2 {
  max-width: 255px;
  font-size: 17px;
  line-height: 23px;
}

body[data-app-surface="mobile"] .mobile-project-card--root .mobile-project-summary p {
  margin-top: 5px;
  font-size: 11px;
}

body[data-app-surface="mobile"] .mobile-project-card--M04 .mobile-project-summary {
  background-image: linear-gradient(180deg, rgb(6 44 91 / 8%) 30%, rgb(4 30 68 / 82%) 100%), url("../assets/site-main.jpg");
}

body[data-app-surface="mobile"] .mobile-project-card--M05 .mobile-project-summary,
body[data-app-surface="mobile"] .mobile-project-card--M70 .mobile-project-summary {
  background-image: linear-gradient(180deg, rgb(6 44 91 / 8%) 30%, rgb(4 30 68 / 82%) 100%), url("../assets/site-project-02.jpg");
}

body[data-app-surface="mobile"] .mobile-project-card--M80 .mobile-project-summary {
  background-image: linear-gradient(180deg, rgb(6 44 91 / 8%) 30%, rgb(4 30 68 / 82%) 100%), url("../assets/skyline-blue/site-hero-mobile-v2.webp");
}

/* Tickets stay visually distinct from business and system updates. */
body[data-app-surface="mobile"] .mobile-content[data-page-code="M04"] .mobile-filter-tabs {
  margin: 0 0 12px;
  border: 1px solid #e4ebf4;
  border-radius: 12px;
  background: #edf3fa;
}

body[data-app-surface="mobile"] .mobile-content[data-page-code="M04"] .mobile-task-card-list {
  display: grid;
  margin: 0;
  gap: 10px;
}

body[data-app-surface="mobile"] .mobile-content[data-page-code="M04"] .mobile-task-card {
  display: grid;
  margin: 0;
  padding: 14px;
  gap: 7px;
  border: 1px solid #e8eef6;
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 4px 14px rgb(21 54 91 / 5%);
}

body[data-app-surface="mobile"] .mobile-task-card > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 28px;
}

body[data-app-surface="mobile"] .mobile-task-card__type {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #5b7090;
  font-size: 13px;
}

body[data-app-surface="mobile"] .mobile-task-card__type .ui-icon {
  display: grid;
  width: 38px;
  height: 38px;
  padding: 9px;
  border-radius: 12px;
  color: #1377e8;
  background: #edf5ff;
}

body[data-app-surface="mobile"] .mobile-task-card--safety .mobile-task-card__type .ui-icon {
  color: #e85454;
  background: #fff0f0;
}

body[data-app-surface="mobile"] .mobile-content[data-page-code="M04"] .mobile-card-list.mobile-task-card-list > article.mobile-task-card > h3 {
  margin: 0 0 0 46px !important;
  color: #142f52;
  font-size: 16px;
  line-height: 23px;
}

body[data-app-surface="mobile"] .mobile-task-card-summary,
body[data-app-surface="mobile"] .mobile-task-deadline {
  margin: 0 0 0 46px;
  color: #657996;
  font-size: 12px;
  line-height: 18px;
}

body[data-app-surface="mobile"] .mobile-task-deadline b {
  color: #df4c42;
}

body[data-app-surface="mobile"] .mobile-task-card .mobile-card-action {
  justify-self: end;
  min-height: 32px;
  margin-top: 0;
  padding: 0 2px 0 8px;
  color: #087fa8;
  font-size: 14px;
}

/* The message center is an event feed; assigned work stays in the ticket center. */
body[data-app-surface="mobile"] .mobile-message-section {
  margin: 0 -12px;
  padding: 0 12px;
}

body[data-app-surface="mobile"] .mobile-message-section > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 54px;
  border-bottom: 1px solid #e7edf4;
}

body[data-app-surface="mobile"] .mobile-message-section > header h2 {
  margin: 0;
  color: #17365b;
  font-size: 18px;
  font-weight: 700;
}

body[data-app-surface="mobile"] .mobile-message-section > header span {
  color: #7486a1;
  font-size: 12px;
}

body[data-app-surface="mobile"] .mobile-message-list {
  display: grid;
  gap: 0;
  border: 0;
  border-radius: 0;
  background: #fff;
  box-shadow: none;
}

body[data-app-surface="mobile"] .mobile-message-list > button {
  position: relative;
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) 8px;
  min-height: 86px;
  padding: 14px 0;
  gap: 10px;
  border: 0;
  border-bottom: 1px solid #e7edf4;
  border-radius: 0;
  color: inherit;
  text-align: left;
  background: #fff !important;
}

body[data-app-surface="mobile"] .mobile-message-list > button.is-unread {
  background: #fbfdff !important;
}

body[data-app-surface="mobile"] .mobile-message-list > button > span {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  color: #1683e7;
  background: #edf5ff;
}

body[data-app-surface="mobile"] .mobile-message-list > button.is-success > span {
  color: #13a363;
  background: #eaf9f0;
}

body[data-app-surface="mobile"] .mobile-message-list > button.is-info > span {
  color: #1683e7;
  background: #edf5ff;
}

body[data-app-surface="mobile"] .mobile-message-list > button > div > header {
  display: flex;
  justify-content: space-between;
  gap: 8px;
}

body[data-app-surface="mobile"] .mobile-message-list header b {
  color: #17365b;
  font-size: 14px;
}

body[data-app-surface="mobile"] .mobile-message-list time,
body[data-app-surface="mobile"] .mobile-message-list small {
  color: #7688a2;
  font-size: 11px;
}

body[data-app-surface="mobile"] .mobile-message-list p {
  margin: 5px 0 0;
  color: #637895;
  font-size: 12px;
  line-height: 18px;
}

body[data-app-surface="mobile"] .mobile-message-list small {
  display: none;
}

body[data-app-surface="mobile"] .mobile-message-list > button > i {
  width: 6px;
  height: 6px;
  margin-top: 5px;
  border-radius: 50%;
  background: #1687f8;
}


/* Keep the banner separate from the assistant/profile information cards. */
body[data-app-surface="mobile"] .mobile-content:is([data-page-code="M70"], [data-page-code="M80"]) > .mobile-project-card--root { margin-bottom:12px !important; }
