.home-related-tasks {
  margin-top: 14px;
  padding-top: 13px;
  border-top: 1px solid #dce6ef;
}

.home-related-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 9px;
  color: #143b60;
}

.home-related-head strong {
  font-size: .78rem;
}

.home-related-head span {
  color: #6d8195;
  font-size: .68rem;
  font-weight: 750;
}

#homeRelatedTaskList {
  display: grid;
  gap: 7px;
}

.home-related-task {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  min-height: 53px;
  padding: 9px 11px;
  border: 1px solid #ecd99f;
  border-radius: 11px;
  background: #fff9e8;
}

.home-related-task > button {
  min-height: 34px;
  padding: 7px 9px;
  border: 0;
  border-radius: 8px;
  background: #f1ce63;
  color: #5f480e;
  font-size: .66rem;
  font-weight: 850;
}

.home-related-task > button:disabled {
  opacity: .6;
}

.home-related-task > span {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #fff;
  color: #b48108;
  font-weight: 900;
}

.home-related-task strong,
.home-related-task small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
}

.home-related-task strong {
  color: #604b19;
  font-size: .76rem;
}

.home-related-task small {
  margin-top: 4px;
  color: #8c7a4f;
  font-size: .64rem;
  white-space: nowrap;
}

#view-clients {
  padding: 0 2px;
}

#view-clients .clients-heading {
  gap: 16px;
  margin-bottom: 16px;
}

#view-clients .clients-heading h1 {
  font-size: 27px;
}

#view-clients .clients-heading p {
  margin-top: 7px;
  font-size: 13px;
  line-height: 1.4;
}

#view-clients .clients-heading > button {
  min-height: 44px;
  padding: 8px 2px;
  font-size: 14px;
}

#view-clients .clients-heading > button span {
  margin-right: 4px;
  font-size: 17px;
}

#view-clients .client-search {
  height: 52px;
  gap: 10px;
  padding: 0 15px;
  border-radius: 14px;
}

#view-clients .client-search > span {
  font-size: 21px;
}

#view-clients .client-search input {
  height: 49px;
  font-size: 14px;
}

#view-clients .client-create-row {
  grid-template-columns: minmax(0, 1fr) 58px;
  gap: 10px;
  margin-top: 10px;
}

#view-clients .client-create-row > button {
  height: 48px;
  border-radius: 12px;
  font-size: 14px;
}

#view-clients .client-create-row > button span {
  font-size: 18px;
}

#view-clients .client-create-row > strong b {
  font-size: 19px;
}

#view-clients .client-create-row > strong small {
  font-size: 9px;
}

#view-clients .client-filters {
  gap: 8px;
  margin: 12px 0;
}

#view-clients .client-filters button {
  min-height: 42px;
  padding: 9px 16px;
  font-size: 12px;
}

#view-clients .client-list-title {
  margin: 13px 2px 9px;
  font-size: 12px;
}

#view-clients .client-list-title > span {
  font-size: 11px;
}

#view-clients .client-contract-list {
  gap: 10px;
}

#view-clients .client-contract-card {
  min-height: 78px;
  grid-template-columns: 42px minmax(0, 1fr) 18px;
  gap: 11px;
  padding: 12px;
  border-radius: 15px;
}

#view-clients .client-contract-avatar {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  font-size: 18px;
}

#view-clients .client-contract-main > b {
  font-size: 14px;
}

#view-clients .client-contract-main > small {
  margin-top: 5px;
  font-size: 12px;
}

#view-clients .client-contract-main > span {
  margin-top: 5px;
  font-size: 11px;
}

#view-clients .client-contract-main > span i {
  width: 7px;
  height: 7px;
  margin-right: 5px;
}

#view-clients .client-contract-main em {
  margin-left: 8px;
  padding: 3px 7px;
}

#view-clients .client-contract-card > strong {
  font-size: 23px;
}

#view-clients .load-more {
  min-height: 46px;
  margin-top: 3px;
  font-size: 14px;
}

@media (max-width: 360px) {
  #view-clients .clients-heading h1 { font-size: 25px; }
  #view-clients .client-contract-card { grid-template-columns: 40px minmax(0, 1fr) 16px; padding: 11px; }
  #view-clients .client-contract-avatar { width: 40px; height: 40px; }
}

#formDialog[data-type="client"] .dialog-card { padding: 24px 22px; }
#formDialog[data-type="client"] .dialog-head h2 { font-size: 24px; }
#formDialog[data-type="client"] .client-modal-form { gap: 15px; }
#formDialog[data-type="client"] label { gap: 7px; font-size: 14px; }
#formDialog[data-type="client"] label small { font-size: 11px; }
#formDialog[data-type="client"] input,
#formDialog[data-type="client"] textarea { min-height: 49px; padding: 13px 14px; border-radius: 12px; font-size: 14px; }
#formDialog[data-type="client"] textarea { min-height: 88px; }
#formDialog[data-type="client"] .complete-fields summary { padding: 15px 0; font-size: 14px; }
#formDialog[data-type="client"] .complete-fields summary span { font-size: 11px; }
#formDialog[data-type="client"] .client-modal-same-phone { display: flex; align-items: center; gap: 10px; min-height: 42px; padding: 8px 10px; border-radius: 10px; background: #f1f6fa; }
#formDialog[data-type="client"] .client-modal-same-phone input { width: 23px; min-height: 23px; height: 23px; padding: 0; accent-color: #0768ae; }
#formDialog[data-type="client"] .dialog-actions button { min-height: 49px; font-size: 14px; }

#view-tasks { padding: 0 2px; }
#view-tasks .contract-head { grid-template-columns: 42px minmax(0, 1fr) auto; gap: 11px; margin-bottom: 16px; }
#view-tasks .back-button { width: 42px; height: 42px; }
#view-tasks .contract-head h1 { font-size: 25px; }
#view-tasks .contract-head p { margin-top: 6px; font-size: 12px; line-height: 1.4; }
#view-tasks .contract-head-add { min-height: 43px; padding: 9px 12px; font-size: 12px; }
#view-tasks .contract-search { height: 51px; gap: 10px; padding: 0 14px; margin-bottom: 11px; border-radius: 13px; }
#view-tasks .contract-search > span { font-size: 20px; }
#view-tasks .contract-search input { font-size: 14px; }
#view-tasks .task-contract-filters { gap: 8px; margin: 12px 0; padding-bottom: 4px; }
#view-tasks .task-contract-filters button { min-height: 42px; padding: 9px 15px; font-size: 12px; }
#view-tasks .task-summary { gap: 8px; margin: 14px 0; }
#view-tasks .task-summary div { min-height: 66px; padding: 12px 8px; border-radius: 13px; }
#view-tasks .task-summary strong { font-size: 23px; }
#view-tasks .task-summary span { font-size: 11px; }
#view-tasks .task-contract-list { gap: 10px; }
#view-tasks .task-contract-card { grid-template-columns: minmax(0, 1fr) auto; gap: 11px; min-height: 83px; padding: 14px; border-radius: 14px; }
#view-tasks .task-card-main { gap: 5px; min-height: 50px; padding: 3px 0; }
#view-tasks .task-card-main strong { font-size: 14px; line-height: 1.35; }
#view-tasks .task-card-main span,
#view-tasks .task-card-main small { font-size: 12px; line-height: 1.35; }
#view-tasks .task-card-main em { font-size: 11px; }
#view-tasks .task-contract-done { width: auto; min-width: 78px; min-height: 42px; padding: 8px 11px; font-size: 12px; }

@media (max-width: 350px) {
  #view-tasks .contract-head { grid-template-columns: 38px minmax(0, 1fr) auto; gap: 8px; }
  #view-tasks .contract-head h1 { font-size: 23px; }
  #view-tasks .contract-head-add { padding-inline: 9px; }
  #view-tasks .task-contract-card { padding: 12px; gap: 8px; }
  #view-tasks .task-contract-done { min-width: 70px; padding-inline: 8px; }
}