@import "tailwindcss";

@config "../tailwind.config.js";

/* Map colors to Tailwind theme (v4) */
/* Using #1d2327 (WP admin dark) for foreground colors */
@theme {
  --color-background: oklch(1 0 0);
  --color-foreground: #1d2327;
  --color-card: oklch(1 0 0);
  --color-card-foreground: #1d2327;
  --color-popover: oklch(1 0 0);
  --color-popover-foreground: #1d2327;
  --color-primary: #1d2327;
  --color-primary-foreground: oklch(0.985 0 0);
  --color-secondary: oklch(0.97 0 0);
  --color-secondary-foreground: #1d2327;
  --color-muted: oklch(0.97 0 0);
  --color-muted-foreground: oklch(0.556 0 0);
  --color-accent: oklch(0.97 0 0);
  --color-accent-foreground: #1d2327;
  --color-destructive: oklch(0.577 0.245 27.325);
  --color-destructive-foreground: oklch(0.577 0.245 27.325);
  --color-border: oklch(0.922 0 0);
  --color-input: oklch(0.922 0 0);
  --color-ring: oklch(0.708 0 0);
  --radius-sm: 0.125rem;
  --radius-md: 0.375rem;
  --radius-lg: 0.5rem;
  --radius-xl: 0.75rem;
}

/* Scoped preflight - only inside .tailwind */
@layer base {
  .tailwind {
    *, ::after, ::before {
      box-sizing: border-box;
      border-width: 0;
      border-style: solid;
      border-color: var(--color-border);
    }
  }
}

/* Reset anchor styles to override WP admin */
.tailwind a {
  color: inherit !important;
  text-decoration: inherit !important;
  transition: opacity 0.15s ease;
}

.tailwind a:hover {
  opacity: 0.85;
}

/* Portal container for dialogs, dropdowns, etc. */
#tailwind-portal-root {
  position: relative;
  z-index: 999999;
}