/* AUTO-GENERATED by design/scripts/build-go-templates.js — do not edit by hand.
   Source of truth: design/packages/
   Regenerate: pnpm --prefix design run build:go-templates
*/

/* ============================================================
   design/packages/tokens/tokens.css
   ============================================================ */

/**
 * Plato Design Tokens
 * CSS custom properties — import this first in any consumer.
 */
:root {
  /* Colors — aligned with Bulma */
  --plato-primary: #485fc7;
  --plato-primary-light: #eff1fb;
  --plato-success: #257953;
  --plato-success-light: #effaf5;
  --plato-danger: #cc0f35;
  --plato-danger-light: #feecf0;
  --plato-warning: #946c00;
  --plato-warning-light: #fffaeb;
  --plato-info: #296fa8;
  --plato-info-light: #eff5fb;

  /* Neutral */
  --plato-text: #363636;
  --plato-text-light: #7a7a7a;
  --plato-border: #dbdbdb;
  --plato-bg: #ffffff;
  --plato-bg-light: #f5f5f5;

  /* Spacing scale */
  --plato-space-1: 0.25rem;  /* 4px */
  --plato-space-2: 0.5rem;   /* 8px */
  --plato-space-3: 0.75rem;  /* 12px */
  --plato-space-4: 1rem;     /* 16px */
  --plato-space-5: 1.5rem;   /* 24px */
  --plato-space-6: 2rem;     /* 32px */
  --plato-space-8: 3rem;     /* 48px */

  /* Typography */
  --plato-font-sans: BlinkMacSystemFont, -apple-system, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --plato-font-mono: "SFMono-Regular", "Consolas", "Liberation Mono", Menlo, Courier, monospace;
  --plato-font-size-sm: 0.85rem;
  --plato-font-size-base: 1rem;
  --plato-font-size-md: 1.125rem;
  --plato-font-size-lg: 1.5rem;
  --plato-font-size-xl: 2rem;

  /* Shape */
  --plato-radius-sm: 2px;
  --plato-radius: 4px;
  --plato-radius-md: 6px;
  --plato-radius-lg: 8px;

  /* Shadows */
  --plato-shadow-sm: 0 1px 3px rgba(0,0,0,0.08);
  --plato-shadow: 0 4px 16px rgba(0,0,0,0.10);
  --plato-shadow-lg: 0 8px 32px rgba(0,0,0,0.14);
}

/* ============================================================
   design/packages/components/button/button.css
   ============================================================ */

/**
 * Button component — scoped overrides on top of Bulma's .button
 * Bulma already handles the base styles. These are Plato-specific additions.
 */

.button {
  border-radius: var(--plato-radius, 4px);
  font-family: var(--plato-font-sans);
  transition: opacity 0.15s ease, box-shadow 0.15s ease;
}

.button:not(.is-small):not(.is-medium):not(.is-large) {
  font-size: var(--plato-font-size-base, 1rem);
}

.button:focus-visible {
  outline: 2px solid var(--plato-primary, #485fc7);
  outline-offset: 2px;
}

.button:not(.is-outlined):not(.is-light):not([disabled]):hover {
  box-shadow: var(--plato-shadow-sm, 0 1px 3px rgba(0,0,0,0.08));
}

/* ============================================================
   design/packages/components/notification/notification.css
   ============================================================ */

/**
 * Notification component — scoped overrides on top of Bulma's .notification
 * Bulma already handles the base styles. These are Plato-specific additions.
 */

.notification {
  border-radius: var(--plato-radius-md, 6px);
  font-size: var(--plato-font-size-base, 1rem);
}

/* Ensure the delete button is reachable on all variants */
.notification .delete {
  position: absolute;
  right: 0.75rem;
  top: 0.75rem;
}

/* Subtle entrance animation */
.notification {
  animation: notification-in 0.15s ease-out;
}

@keyframes notification-in {
  from {
    opacity: 0;
    transform: translateY(-4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}