:root {
  --color-primary-50: rgb(254, 252, 232);
  --color-primary-100: rgb(254, 249, 195);
  --color-primary-200: rgb(254, 240, 138);
  --color-primary-300: rgb(253, 224, 71);
  --color-primary-400: rgb(250, 204, 21);
  --color-primary-500: rgb(234, 179, 8);
  --color-primary-600: rgb(202, 138, 4);
  --color-primary-700: rgb(161, 98, 7);
  --color-primary-800: rgb(133, 77, 14);
  --color-primary-900: rgb(113, 63, 18);
}

body:not(.sb-react-app) {
  background: linear-gradient(180deg, var(--bg-soft), var(--bg));
}

.bg-primary-600,
.bg-primary-500 {
  background-color: var(--accent);
}

.hover\:bg-primary-700:hover,
.hover\:bg-primary-600:hover {
  background-color: var(--accent-hover);
}

.text-primary-600,
.text-primary-700 {
  color: var(--accent-hover);
}

.border-primary-500,
.border-primary-600 {
  border-color: var(--accent);
}

.ring-primary-500,
.focus\:ring-primary-500:focus {
  --tw-ring-color: rgb(234, 179, 8);
}

.focus\:border-primary-500:focus {
  border-color: var(--accent-hover);
}

.from-primary-600 {
  --tw-gradient-from: rgb(202, 138, 4);
}

.to-primary-700 {
  --tw-gradient-to: rgb(161, 98, 7);
}

.min-h-screen .rounded-xl.border-slate-200,
.min-h-screen .rounded-2xl.border-slate-200 {
  border-color: rgba(234, 179, 8, 0.25) !important;
  box-shadow: 0 8px 32px rgba(28, 25, 23, 0.08) !important;
}

.bg-primary-50 {
  background-color: var(--accent-soft);
}

:root {
  --sb-safe-top: env(safe-area-inset-top, 0px);
}

body.sb-safe-area {
  padding-left: env(safe-area-inset-left, 0px);
  padding-right: env(safe-area-inset-right, 0px);
  padding-bottom: env(safe-area-inset-bottom, 0px);
  box-sizing: border-box;
}

body.sb-safe-area .min-h-screen {
  padding-top: max(var(--sb-safe-top), env(safe-area-inset-top, 24px)) !important;
  box-sizing: border-box;
}

body.sb-safe-area main {
  min-height: 100dvh;
}

[id="app-splash"].hidden {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

html.sb-auth-page [id="app-splash"] {
  display: none !important;
  pointer-events: none !important;
}

html.sb-auth-page [id="root"] {
  position: relative;
  z-index: 10;
}

html.sb-auth-page input,
html.sb-auth-page textarea,
html.sb-auth-page select {
  color: rgb(15, 23, 42) !important;
  -webkit-text-fill-color: rgb(15, 23, 42) !important;
  caret-color: rgb(15, 23, 42) !important;
  background-color: rgb(255, 255, 255) !important;
  pointer-events: auto !important;
}

html.sb-auth-page input:-webkit-autofill,
html.sb-auth-page input:-webkit-autofill:hover,
html.sb-auth-page input:-webkit-autofill:focus {
  -webkit-text-fill-color: rgb(15, 23, 42) !important;
  box-shadow: 0 0 0 1000px rgb(255, 255, 255) inset !important;
  caret-color: rgb(15, 23, 42) !important;
}