@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

html{
  --font-sans: "Inter", ui-sans-serif, system-ui, sans-serif;
    --color-brand-brown: #68403A;
    --color-brand-yellow: #F8DC59;
}

body {  
   --color-hl: #F8DC59;
    --color-bg-main: #68403A;
    --color-text-main: #ffffff;
    --color-card-bg: #68403A;
    --color-border-main: rgba(255, 255, 255, 0.1);
    --color-bg-subtle: rgba(255, 255, 255, 0.1);
    --color-bg-muted: rgba(255, 255, 255, 0.1);
    --color-bg-nav: #68403A;
}

body.light-mode {
  --color-hl: #F8DC59;
  --color-bg-main: #fcfaf9;
  --color-text-main: #4a3735;
  --color-card-bg: #ffffff;
  --color-border-main: rgba(128, 95, 91, 0.1);
  --color-bg-subtle: rgba(128, 95, 91, 0.05);
  --color-bg-muted: rgba(128, 95, 91, 0.08);
  --color-bg-nav: rgba(252, 250, 249, 0.8);
}

body {
  background-color: var(--color-bg-main);
  color: var(--color-text-main);
  
}

  .bg-brand-yellow { background-color: var(--color-brand-yellow); }
  .bg-theme-card { background-color: var(--color-card-bg); }
  .border-theme { border-color: var(--color-border-main); }
  .bg-theme-nav { background-color: var(--color-bg-nav); }
  .bg-theme-subtle { background-color: var(--color-bg-subtle); }
  .bg-theme-muted { background-color: var(--color-bg-muted); }
  .text-theme-muted { color: color-mix(in srgb, var(--color-text-main), transparent 30%); }
  .text-brand-brown { color: var(--color-brand-brown); }
  .text-brand-yellow { color: var(--color-brand-yellow); }
  .text-hl { color: var(--color-hl); }
  
  .no-scrollbar::-webkit-scrollbar {
    display: none;
  }
  .no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
  }

.imgmask{
	background-color: #805f5b;	
	width: 100%;
	height: 100%;
	opacity: 0.4;
}