/* T07: Config screen */
.config-head { display: flex; flex-direction: column; gap: 6px; padding: 0 4px; }
.config-back {
  display: inline-flex; align-items: center; gap: 2px; align-self: flex-start;
  min-height: var(--tap); margin: -8px 0 -4px -6px; padding: 0 8px 0 2px;
  font-size: 15px; text-decoration: none; border-radius: var(--r-input);
}
.config-sync { font-size: 12px; letter-spacing: .04em; }
.config-sync.s-synced { color: var(--ok); }
.config-sync.s-pending, .config-sync.s-offline { color: var(--warn); }
.config-sync.s-error { color: var(--danger); }

.config-card { padding: 12px; gap: 10px; }

.config-seg { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.config-seg-btn {
  min-height: 44px; padding: 0 12px;
  border-radius: var(--r-input); border: 1px solid var(--border);
  background: var(--bg); color: var(--text-2); font-size: 15px; cursor: pointer;
}
.config-seg-btn:hover { border-color: #3A4048; }
.config-seg-btn.on, .config-seg-btn.on:hover {
  border-color: #F0A63A; background: #3A2E17; color: #F6D79A; font-weight: 600; cursor: default;
}

.config-note { font-size: 13px; line-height: 1.45; padding: 0 2px; }
.config-link {
  background: none; border: 0; padding: 4px 0; margin: 0; cursor: pointer;
  color: var(--accent); font-size: 13px; text-decoration: underline; text-underline-offset: 2px;
}
.config-link:hover { color: #F6C57A; }

.config-json {
  font-family: var(--mono); font-size: 12px; line-height: 1.5;
  min-height: 0; white-space: pre; overflow: auto; tab-size: 2;
}
.config-err {
  font-size: 12px; color: var(--danger); overflow-wrap: anywhere;
  background: #3A1E1C; border: 1px solid #6B302C; border-radius: var(--r-input); padding: 8px 10px;
}

.config-actions { display: grid; grid-template-columns: 1fr; gap: 8px; }
@media (min-width: 560px) { .config-actions { grid-template-columns: repeat(3, 1fr); } }

.config-sheet-text { color: var(--text-2); font-size: 15px; }