:root{
  --bg:#f5f5f7;
  --surface:#ffffff;
  --surface-alt:#eef0f4;
  --text:#1f2937;
  --text-secondary:#6b7280;
  --text-faint:#9398a1;
  --primary:#6d4aff;
  --primary-strong:#5436d6;
  --primary-soft:#ede9fe;
  --border:#d8dade;
  --mint:#0f9d68;
  --mint-soft:#d8f5e6;
  --rose:#d6406a;
  --rose-soft:#fbdfe7;
  --amber:#b9770e;
  --amber-soft:#fbecd0;
}
html.dark{
  --bg:#0f1117;
  --surface:#181b22;
  --surface-alt:#20242e;
  --text:#f4f4f5;
  --text-secondary:#a1a1aa;
  --text-faint:#71717a;
  --primary:#8b7dff;
  --primary-strong:#a395ff;
  --primary-soft:#2a2440;
  --border:#2e3340;
  --mint:#34d399;
  --mint-soft:#103226;
  --rose:#fb7185;
  --rose-soft:#3a1c25;
  --amber:#fbbf24;
  --amber-soft:#3a2c10;
}
html, body{ overflow-x: hidden; }
body{
  background:
    radial-gradient(circle at 15% -10%, color-mix(in srgb, var(--primary) 10%, transparent) 0%, transparent 50%),
    var(--bg);
  color: var(--text);
  transition: background-color .25s ease, color .25s ease;
}
.surface{ background: var(--surface); border: 1px solid var(--border); transition: background-color .25s ease, border-color .25s ease; }
.surface-alt{ background: var(--surface-alt); }
.card-shadow { box-shadow: 0 8px 24px -10px rgba(0,0,0,0.18); }
.soft-shadow { box-shadow: 0 4px 14px -8px rgba(0,0,0,0.20); }
input[type="number"]::-webkit-inner-spin-button { opacity: 1; }
.fade-in { animation: fade .35s ease; }
@keyframes fade { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
.spin { animation: spin 1s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
::placeholder{ color: var(--text-faint); }
.progress-track { background: var(--surface-alt); border: 1px solid var(--border); }
.progress-fill { background: linear-gradient(90deg, var(--primary), var(--primary-strong)); transition: width .4s ease; }
select, input[type="text"], input[type="number"]{ color: var(--text); }
.drag-handle{ cursor: grab; touch-action: none; }
.drag-handle:active{ cursor: grabbing; }
.sortable-ghost{ opacity: .4; }
.autocomplete-item:hover, .autocomplete-item.active{ background: var(--primary-soft); }
.icon-btn{ transition: transform .12s ease, background-color .15s ease; }
.icon-btn:active{ transform: scale(.92); }
.icon-btn:focus-visible{
  outline: 2px solid var(--primary);
  outline-offset: 2px;
}
.is-invalid{
  border-color: var(--rose) !important;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--rose) 20%, transparent);
}
.text-input-error{ color: var(--rose); }
/* Controle segmentado (escopo da busca / tipo no cadastro manual) */
.seg{ border: 1px solid var(--border); }
.seg-btn{
  display: inline-flex; align-items: center; gap: .375rem;
  padding: .375rem .75rem; border-radius: .85rem;
  font-size: .8125rem; font-weight: 600; color: var(--text-secondary);
  transition: background-color .15s ease, color .15s ease;
}
.seg-btn[aria-selected="true"]{ background: var(--surface); color: var(--primary); box-shadow: 0 2px 8px -4px rgba(0,0,0,0.25); }
.seg-btn:not([aria-selected="true"]):hover{ color: var(--text); }

.theme-toggle .sun-icon, .theme-toggle .moon-icon{ display:none; }
html:not(.dark) .theme-toggle .sun-icon{ display:block; }
html.dark .theme-toggle .moon-icon{ display:block; }

@media (max-width: 767px){
  #appShell{ padding-bottom: 1.25rem; }
}
