@import "tailwindcss";
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200&display=swap');

@theme {
  --font-sans: "Plus Jakarta Sans", ui-sans-serif, system-ui, sans-serif;

  /* RestroMax color tokens (from Design/Admindashboard/culinary_logic/DESIGN.md) */
  --color-primary: #b1250c;
  --color-primary-container: #d43e23;
  --color-primary-fixed: #ffdad3;
  --color-primary-fixed-dim: #ffb4a5;
  --color-on-primary: #ffffff;
  --color-on-primary-container: #fffbff;
  --color-on-primary-fixed: #3e0400;
  --color-on-primary-fixed-variant: #8e1400;

  --color-secondary: #006e2b;
  --color-secondary-container: #83f894;
  --color-on-secondary: #ffffff;
  --color-on-secondary-container: #00722d;

  --color-error: #ba1a1a;
  --color-error-container: #ffdad6;
  --color-on-error: #ffffff;
  --color-on-error-container: #93000a;
  --color-warning-amber: #f2994a;

  --color-background: #fbf9f5;
  --color-on-background: #1b1c1a;
  --color-surface: #fbf9f5;
  --color-surface-white: #ffffff;
  --color-surface-bright: #fbf9f5;
  --color-surface-dim: #dbdad6;
  --color-surface-container-lowest: #ffffff;
  --color-surface-container-low: #f5f3ef;
  --color-surface-container: #e4e2de;
  --color-surface-container-high: #eae8e4;
  --color-surface-container-highest: #e4e2de;
  --color-surface-variant: #e4e2de;
  --color-on-surface: #1b1c1a;
  --color-on-surface-variant: #5a413b;

  --color-text-main: #1a1a1a;
  --color-text-muted: #8e8e93;
  --color-border-subtle: #eae6e0;

  --color-inverse-surface: #30312e;
  --color-inverse-on-surface: #f2f0ec;
  --color-outline: #8f706a;
  --color-outline-variant: #e3beb7;

  --color-brand: #e0472b;
  --color-brand-hover: #c93a20;
}

html {
  font-family: var(--font-sans);
}

body {
  background-color: var(--color-background);
  color: var(--color-on-background);
  -webkit-font-smoothing: antialiased;
}

/* Material Symbols Outlined */
.material-symbols-outlined {
  font-family: "Material Symbols Outlined";
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.icon-fill {
  font-variation-settings: "FILL" 1;
}

/* Elevation */
.shadow-ambient {
  box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.04);
}
.shadow-hover {
  box-shadow: 0px 8px 30px rgba(0, 0, 0, 0.08);
}
.card-shadow {
  box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.04);
}
.card-shadow:hover {
  box-shadow: 0px 8px 30px rgba(0, 0, 0, 0.08);
  transform: translateY(-2px);
  transition: all 0.2s ease;
}

/* Login form side dot pattern */
.bg-pattern {
  background-image: radial-gradient(#eae8e4 1px, transparent 1px);
  background-size: 20px 20px;
}

/* Hide scrollbars for horizontal rails / drawers */
.hide-scrollbar::-webkit-scrollbar {
  display: none;
}
.hide-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/* Analytics heat map cells */
.heat-cell {
  border-radius: 4px;
}
.heat-low {
  background-color: #fcece9;
}
.heat-med {
  background-color: #f09587;
}
.heat-high {
  background-color: #d43e23;
}

/* Analytics line chart */
.grid-line {
  stroke: #eae6e0;
  stroke-width: 1;
  stroke-dasharray: 4 4;
}
.line-path {
  fill: none;
  stroke: #b1250c;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.line-area {
  fill: url(#area-gradient);
}

/* Donut chart */
.donut-chart {
  width: 140px;
  height: 140px;
  border-radius: 50%;
  background: conic-gradient(
    #b1250c 0% 45%,
    #d43e23 45% 75%,
    #f2994a 75% 90%,
    #e4e2de 90% 100%
  );
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
.donut-hole {
  width: 90px;
  height: 90px;
  border-radius: 50%;
  background-color: #ffffff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

/* Thin scrollbar used by checkout */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: #dbdad6;
  border-radius: 4px;
}