/* NOTICE: There are layer conflicts between tailwindcss v4 and antd, hack for this. */
/* @layer theme, base, antd, components, utilities; */
/* @import "tailwindcss"; */

@import "tailwindcss/theme.css";
@import "tailwindcss/utilities.css";
@import "antd/dist/reset.css";

@custom-variant dark (&:where(.dark, .dark *));
@source inline("gap-{0,{1..96}}");
@source inline("grid-cols-{0,{1..12}}");

@theme {
  --color-background: var(---twColorBackground);
  --color-foreground: var(---twColorForeground);
  --color-primary: var(---twColorPrimary);
  --color-info: var(---twColorInfo);
  --color-success: var(---twColorSuccess);
  --color-warning: var(---twColorWarning);
  --color-error: var(---twColorError);
}

@layer base {
  :root {
    ---twColorBackground: #ffffff;
    ---twColorForeground: #141414;
    ---twColorPrimary: #f97316;
    ---twColorInfo: #478ce6;
    ---twColorSuccess: #59ab5c;
    ---twColorWarning: #daa93e;
    ---twColorError: #e5534b;
  }

  .dark {
    ---twColorBackground: #17191c;
    ---twColorForeground: #fafaf9;
    ---twColorPrimary: #ea580c;
    ---twColorInfo: #0969da;
    ---twColorSuccess: #1a7f37;
    ---twColorWarning: #eac54f;
    ---twColorError: #d1242f;
  }
}

@layer base {
  /* Reset ol, ul, dl */
  ol,
  ul,
  dl {
    margin-left: 0;
    margin-right: 0;
    padding-left: 1.25em;
  }

  /* Fix non-antd icon's position not correct */
  .ant-btn > .ant-btn-icon,
  svg.tabler-icon,
  svg.icon {
    line-height: 1;
  }

  /* Fix antd drawer title overflow */
  .ant-drawer .ant-drawer-title {
    overflow: hidden;
  }
}

@layer components {
  .container {
    @apply mx-auto max-w-320;
  }
}