/* ── Vibewatch Studio Theme ──
   Refined editorial aesthetic matching the Vibewatch brand.
   Warm ivory/teal palette, Syne headings, premium details.
*/

body {
  background: #F9F8F5 !important;
}

/* ── Typography ── */

[data-ui="Heading"],
[data-ui="Label"],
[data-testid="document-panel-document-title"],
h1, h2, h3 {
  font-family: 'Syne', system-ui, sans-serif !important;
  letter-spacing: -0.01em;
}

/* ── Surfaces ── */

[data-ui="Navbar"],
[data-ui="Pane"] > [data-ui="Card"]:first-child {
  background: #FFFFFF !important;
}

[data-testid="document-panel-scroller"] {
  background: #FAFAF8 !important;
}

/* ── Input Fields ── */

[data-ui="TextInput"] > div,
[data-ui="TextArea"] > div,
[data-ui="Select"] > div {
  border-color: #E4E1DA !important;
}

[data-ui="TextInput"] > div:focus-within,
[data-ui="TextArea"] > div:focus-within {
  border-color: #00C4A1 !important;
  box-shadow: 0 0 0 1px #00C4A1 !important;
}

/* ── Fieldsets ── */

[data-ui="Fieldset"] legend {
  font-family: 'Syne', system-ui, sans-serif !important;
  font-weight: 600;
  letter-spacing: -0.01em;
}

/* ── Buttons ── */

button[data-tone="positive"] {
  background: #00C4A1 !important;
  color: #141412 !important;
}

button[data-tone="positive"]:hover {
  background: #00DFC8 !important;
}

/* ── Pane Dividers ── */

[data-ui="PaneLayout"] > [data-ui="Pane"] + [data-ui="Pane"] {
  border-left-color: #E4E1DA !important;
}

/* ── Scrollbars ── */

::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: #D4D0C8;
  border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
  background: #B8B4AE;
}

/* ── Tabs ── */

[data-ui="TabList"] button[data-selected="true"] {
  color: #00C4A1 !important;
}

[data-ui="TabList"] button[data-selected="true"]::after {
  background: #00C4A1 !important;
}

/* ── Document List ── */

[data-ui="PaneItem"]:hover {
  background: #F2F0EB !important;
}

/* ── Badges ── */

[data-ui="Badge"][data-tone="positive"] {
  background: rgba(0, 196, 161, 0.1) !important;
  color: #00906C !important;
}

[data-ui="Badge"][data-tone="caution"] {
  background: rgba(249, 115, 22, 0.1) !important;
  color: #F97316 !important;
}

/* ── Portable Text Editor ── */

[data-testid="pt-editor"] [data-ui="Card"] {
  border-color: #E4E1DA !important;
}

/* ── Dialogs ── */

[data-ui="Dialog"] [data-ui="Card"] {
  border-radius: 12px !important;
}

/* ── Smooth Transitions ── */

button, a, [data-ui="PaneItem"] {
  transition: all 0.15s ease !important;
}