/*
 * OfficeNext-native Mallorca preset. The palette and Material 3 shape/elevation
 * cues are mapped from the effective public Office theme; no Radzen component
 * rules are included. This preset intentionally remains light-only to match
 * the Mallorca Office appearance.
 */
:root {
  --background: #f9f6f3;
  --foreground: #201e1b;
  --card: #ffffff;
  --card-foreground: #201e1b;
  --popover: #fbfaf8;
  --popover-foreground: #201e1b;
  --primary: #cc721f;
  --primary-foreground: #201e1b;
  --secondary: #71665b;
  --secondary-foreground: #ffffff;
  --muted: #f2eae3;
  --muted-foreground: #68635f;
  --accent: #ffddbc;
  --accent-foreground: #5d3400;
  --destructive: #b3261e;
  --destructive-foreground: #ffffff;
  --border: #ece5df;
  --input: #ece5df;
  --ring: #cc721f;
  --chart-1: #f0b075;
  --chart-2: #d4f075;
  --chart-3: #78f075;
  --chart-4: #75f0cf;
  --chart-5: #75b5f0;
  --sidebar: #f9f6f3;
  --sidebar-foreground: #201e1b;
  --sidebar-primary: #cc721f;
  --sidebar-primary-foreground: #201e1b;
  --sidebar-accent: rgba(255, 127, 0, 0.13);
  --sidebar-accent-foreground: #2b2219;
  --sidebar-border: #ece5df;
  --sidebar-ring: #cc721f;
  --ft-mallorca-grid-header-bg: #fbfaf8;
  --ft-mallorca-grid-header-border: #e6e0db;
  --ft-mallorca-grid-row-bg: #ffffff;
  --ft-mallorca-grid-row-alt-bg: #fbfaf8;
  --ft-mallorca-grid-row-hover-bg: #f2eae3;
  --ft-mallorca-grid-row-selected-bg: rgba(255, 127, 0, 0.13);
  --font-sans: "Roboto", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-serif: Georgia, serif;
  --font-mono: "JetBrains Mono", monospace;
  --radius: 0.5rem;
  --shadow-x: 0px;
  --shadow-y: 1px;
  --shadow-blur: 3px;
  --shadow-spread: 0px;
  --shadow-opacity: 0.15;
  --shadow-color: #45494f;
  --shadow-2xs: 0px 1px 2px hsl(30 12% 20% / 0.04);
  --shadow-xs: 0px 1px 3px hsl(30 12% 20% / 0.07);
  --shadow-sm: 0px 2px 5px hsl(30 12% 20% / 0.08), 0px 1px 2px hsl(30 12% 20% / 0.05);
  --shadow: 0px 3px 7px hsl(30 12% 20% / 0.09), 0px 1px 2px hsl(30 12% 20% / 0.05);
  --shadow-md: 0px 5px 12px -2px hsl(30 12% 20% / 0.12);
  --shadow-lg: 0px 9px 20px -4px hsl(30 12% 20% / 0.14);
  --shadow-xl: 0px 15px 30px -7px hsl(30 12% 20% / 0.16);
  --shadow-2xl: 0px 24px 48px -12px hsl(30 12% 20% / 0.22);
  --tracking-normal: 0em;
  --spacing: 0.25rem;
}

/* Match the effective legacy Mallorca surfaces while keeping OfficeNext's
   native components and interaction behavior. */
.ft-page-header-card {
  border-color: #f2eae3 !important;
  background: linear-gradient(135deg, rgba(255, 122, 0, 0.13) 0%, #fbfaf8 100%) !important;
}

.ft-grid-filter-card,
.ft-grid-title-card {
  border-color: #dee2e6 !important;
}

.ft-page-wrapper {
  background-color: #fff !important;
}

.ft-page-sticky-header {
  background-color: #f9f6f3 !important;
}

.ft-data-grid {
  background-color: var(--ft-mallorca-grid-row-bg) !important;
  color: var(--foreground);
}

:where(.ft-data-grid [data-slot="data-grid-header-cell"]) {
  background-color: var(--ft-mallorca-grid-header-bg) !important;
  border-block-end: 1px solid var(--ft-mallorca-grid-header-border) !important;
  border-inline-end: 0 !important;
  color: var(--foreground) !important;
}

.ft-data-grid [data-slot="data-grid-row"] > [data-slot="data-grid-cell"] {
  border-block-end: 1px solid var(--border) !important;
  border-inline-end: 0 !important;
  color: var(--foreground);
}

.ft-data-grid :is([data-slot="data-grid-header-cell"], [data-slot="data-grid-cell"]).ft-grid-action-column {
  border-inline-start: 1px solid var(--border) !important;
  box-shadow: -5px 0 5px -5px rgb(0 0 0 / 12%);
}

.ft-data-grid [data-slot="data-grid-row"] {
  --ft-grid-row-bg: var(--ft-mallorca-grid-row-bg);
  --ft-grid-row-hover-bg: var(--ft-mallorca-grid-row-hover-bg);
  --ft-grid-row-selected-bg: var(--ft-mallorca-grid-row-selected-bg);
  --ft-grid-row-backdrop: var(--ft-mallorca-grid-row-bg);
  background-color: transparent !important;
}

.ft-data-grid [data-slot="data-grid-body"] > [data-slot="data-grid-row"]:nth-child(even) {
  --ft-grid-row-bg: var(--ft-mallorca-grid-row-alt-bg);
}

.ft-data-grid [data-slot="data-grid-row"]:hover {
  --ft-grid-row-bg: var(--ft-grid-row-hover-bg);
}

.ft-data-grid [data-slot="data-grid-body"] > [data-slot="data-grid-row"]:is(
  [aria-selected="true"],
  [data-selected],
  [data-state="selected"]
) {
  --ft-grid-row-bg: var(--ft-grid-row-selected-bg);
}