/* === Writers Marketplace Admin — Design Tokens === */

:root {
  /* Light palette (content area) */
  --bg: #f7f1e8;
  --bg-deep: #f0e1cf;
  --surface: rgba(255, 252, 247, 0.84);
  --surface-strong: #fffaf3;
  --ink: #1e1a18;
  --muted: #6d6259;
  --line: rgba(62, 43, 29, 0.12);
  --accent: #df6d2d;
  --accent-deep: #b24b14;
  --leaf: #215849;
  --gold: #e6b84e;

  /* Dark sidebar palette */
  --sidebar-bg: #1a1410;
  --sidebar-ink: #c4b8a7;
  --sidebar-muted: #6d6259;
  --sidebar-active-bg: rgba(223, 109, 45, 0.15);
  --sidebar-active-text: #df6d2d;
  --sidebar-divider: rgba(255, 255, 255, 0.06);
  --sidebar-hover: rgba(255, 255, 255, 0.04);

  /* Border radius */
  --radius-sm: 12px;
  --radius-md: 16px;
  --radius-lg: 20px;
  --radius-xl: 26px;
  --radius-full: 999px;

  /* Shadows */
  --shadow-card: 0 8px 20px rgba(66, 37, 18, 0.06);
  --shadow-panel: 0 12px 28px rgba(66, 37, 18, 0.07);
  --shadow-elevated: 0 16px 34px rgba(66, 37, 18, 0.09);
  --shadow-accent: 0 12px 24px rgba(223, 109, 45, 0.25);

  /* Typography */
  --font-heading: "Space Grotesk", sans-serif;
  --font-body: "Outfit", sans-serif;

  /* Sidebar dimensions */
  --sidebar-width: 260px;
  --sidebar-collapsed-width: 72px;
  --navbar-height: 60px;
}

/* Reset */
*, *::before, *::after {
  box-sizing: border-box;
}

html {
  overflow-x: hidden;
}

body {
  margin: 0;
  font-family: var(--font-body);
  color: var(--ink);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

a {
  color: inherit;
  text-decoration: none;
}

img {
  max-width: 100%;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
}

/* === Custom Scrollbars === */

/* Sidebar — light-on-dark */
.sidebar::-webkit-scrollbar,
.sidebar__nav::-webkit-scrollbar {
  width: 5px;
}

.sidebar::-webkit-scrollbar-track,
.sidebar__nav::-webkit-scrollbar-track {
  background: transparent;
}

.sidebar::-webkit-scrollbar-thumb,
.sidebar__nav::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.10);
  border-radius: 4px;
}

.sidebar::-webkit-scrollbar-thumb:hover,
.sidebar__nav::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.22);
}

/* Table wrap — dark-on-light */
.table-wrap::-webkit-scrollbar {
  height: 6px;
}

.table-wrap::-webkit-scrollbar-track {
  background: rgba(62, 43, 29, 0.04);
  border-radius: 4px;
}

.table-wrap::-webkit-scrollbar-thumb {
  background: rgba(62, 43, 29, 0.15);
  border-radius: 4px;
}

.table-wrap::-webkit-scrollbar-thumb:hover {
  background: rgba(62, 43, 29, 0.28);
}

/* Firefox */
.sidebar,
.sidebar__nav {
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, 0.10) transparent;
}

.table-wrap {
  scrollbar-width: thin;
  scrollbar-color: rgba(62, 43, 29, 0.15) transparent;
}
