/* Central synchronization setup, hosted in GitRelease only. */
.sync-settings-dialog {
  width: min(640px, calc(100% - 28px));
}
.sync-settings-content {
  padding: 22px;
}
.sync-settings-content h3 {
  margin: 22px 0 10px;
  font-size: 0.88rem;
}
.sync-settings-content p,
.sync-settings-content li {
  color: #aaa;
  font-size: 0.76rem;
  line-height: 1.7;
}
.sync-settings-content ol {
  padding-left: 20px;
}
.sync-settings-content a {
  color: #b8ceff;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.sync-settings-status {
  padding: 16px;
  border: 1px solid #303030;
  border-radius: 16px;
  background: #080808;
}
.sync-settings-status strong {
  font-size: 0.8rem;
}
.sync-settings-status strong[data-state='success'] {
  color: var(--green);
}
.sync-settings-status strong[data-state='error'] {
  color: var(--amber);
}
.sync-settings-status p {
  margin-bottom: 12px;
}
.sync-settings-status .btn {
  width: 100%;
}
.sync-repositories {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin: 10px 0 0;
  padding: 0;
  list-style: none;
}
.sync-repositories li {
  max-width: 100%;
  padding: 4px 8px;
  border: 1px solid #292929;
  border-radius: 8px;
  background: #080808;
  overflow-wrap: anywhere;
}
.sync-repositories code {
  font-size: 0.64rem;
}
#syncSettingsForm .field {
  margin-top: 20px;
}
#githubReadToken {
  font-family: ui-monospace, monospace;
}
#syncSettingsForm .btn.primary {
  width: 100%;
}
.sync-settings-content .sync-token-note {
  font-size: 0.69rem;
  color: #999;
}
.sync-settings-content .sync-form-error {
  padding: 12px;
  border: 1px solid #6f3333;
  border-radius: 12px;
  color: #f3b4b4;
  overflow-wrap: anywhere;
}
.sync-settings-content .sync-form-success {
  padding: 12px;
  border: 1px solid #285c3e;
  border-radius: 12px;
  color: #9edbb5;
}
@media (max-width: 700px) {
  .sync-settings-content {
    padding: 16px;
  }
  .sync-settings-content p,
  .sync-settings-content li {
    font-size: 0.78rem;
  }
}
