/* memorare crm: the CRM in the memorare design (ibl_theme tokens, memorarem/snippets). Loaded by the
   CRM page from crm.memorare.ai, outside the image; it only sets the CRM's own theme variables
   (--t-*) and a few sizes, so it changes without a rebuild. Rules start with html.light so they win over
   the CRM's own styles, which load after this file. */
/* .light.light: the CRM repeats its theme on inner panels (.light), so this has to win everywhere */
.light.light {
  /* type: the memorare font, a little larger than the CRM's 13px */
  --t-font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --t-font-color-primary: #4E5460;
  --t-font-color-secondary: #6b7280;
  --t-font-color-tertiary: #9ca3af;
  --t-font-color-light: #b3b9c4;
  --t-font-color-extra-light: #d1d5db;

  /* surfaces: soft grey page, white panels */
  --t-background-primary: #ffffff;
  --t-background-secondary: #fafbfc;
  --t-background-tertiary: #f5f7fa;
  --t-background-quaternary: #eef1f5;
  --t-background-transparent-lighter: rgba(78, 84, 96, 0.03);
  --t-background-transparent-light: rgba(78, 84, 96, 0.05);
  --t-background-transparent-medium: rgba(78, 84, 96, 0.09);
  --t-background-transparent-strong: rgba(78, 84, 96, 0.16);
  --t-background-transparent-blue: rgba(0, 120, 255, 0.08);

  /* borders */
  --t-border-color-light: #eef0f3;
  --t-border-color-medium: #e5e7eb;
  --t-border-color-strong: #d1d5db;
  --t-border-color-blue: #b9d3ff;
  --t-border-radius-sm: 7px;
  --t-border-radius-md: 12px;

  /* the memorare blue (primary #0078FF) as the CRM's blue and accent scale */
  --t-color-blue: #0078ff;
  --t-color-blue1: #fafcff; --t-color-blue2: #f5f8ff; --t-color-blue3: #eaf1ff; --t-color-blue4: #dce8ff;
  --t-color-blue5: #ccddff; --t-color-blue6: #b9d3ff; --t-color-blue7: #9fc1ff; --t-color-blue8: #7aa9ff;
  --t-color-blue9: #0078ff; --t-color-blue10: #006be6; --t-color-blue11: #005fcc; --t-color-blue12: #0b2a55;
  --t-accent-accent1: #fafcff; --t-accent-accent2: #f5f8ff; --t-accent-accent3: #eaf1ff; --t-accent-accent4: #dce8ff;
  --t-accent-accent5: #ccddff; --t-accent-accent6: #b9d3ff; --t-accent-accent7: #9fc1ff; --t-accent-accent8: #7aa9ff;
  --t-accent-accent9: #0078ff; --t-accent-accent10: #006be6; --t-accent-accent11: #005fcc; --t-accent-accent12: #0b2a55;
  --t-accent-primary: #dce8ff; --t-accent-secondary: #dce8ff; --t-accent-tertiary: #eaf1ff; --t-accent-quaternary: #f5f8ff;
  --t-tag-background-blue: #eaf1ff;
  --t-illustration-icon-color-blue: #7aa9ff;
}
html.light { font-size: 14px; }

/* the left menu as in the memorare apps: small uppercase section titles, plain line icons, the open
   item in light blue */
html.light .section-title-label { text-transform: uppercase; letter-spacing: 0.06em; font-weight: 600; color: #9ca3af; }
html.light a.navigation-drawer-item { border-radius: 7px; }
html.light .navigation-drawer-item [class*="_root_j2xk4"] { background: transparent !important; }
html.light .navigation-drawer-item svg.tabler-icon { stroke: #6b7280 !important; }
html.light a.navigation-drawer-item[aria-current="page"] { background: #eaf1ff !important; }
html.light a.navigation-drawer-item[aria-current="page"],
html.light a.navigation-drawer-item[aria-current="page"] * { color: #0078ff !important; }
html.light a.navigation-drawer-item[aria-current="page"] svg.tabler-icon { stroke: #0078ff !important; }

/* main buttons (the CRM's blue text buttons, e.g. "New Student"): the memorare gradient */
html.light button[class*="_button_1kfus_"][data-variant="primary"][data-accent="blue"] {
  background: linear-gradient(to right, #baceff, #0078ff) !important;
  color: #fff !important; border-color: transparent !important;
}
html.light button[class*="_button_1kfus_"][data-variant="primary"][data-accent="blue"]:hover { background: linear-gradient(to right, #a9bdff, #0069e0) !important; }