/**
 * デジタル庁デザインシステム β — sorane Std-17N-170 とのブリッジ
 * @see sorane/templates/default/assets/main.css
 * @see @digital-go-jp/design-tokens tokens-simple.css
 */

.kototoi-form,
.kototoi-admin {
  color-scheme: light;

  /* sorane テーマ変数があれば継承、なければ DA 既定 */
  --kototoi-font: var(--font-body, var(--font-family-sans, "Noto Sans JP", -apple-system, BlinkMacSystemFont, sans-serif));
  --kototoi-mono: var(--font-mono, var(--font-family-mono, "Noto Sans Mono", monospace));
  --kototoi-text: var(--text, #1a1a1c);
  --kototoi-muted: var(--muted, #626264);
  --kototoi-link: var(--link, #0017c1);
  --kototoi-link-hover: var(--color-primitive-blue-1000, #00118f);
  --kototoi-border: var(--border, #d8d8db);
  --kototoi-border-strong: var(--color-neutral-solid-gray-420, #949494);
  --kototoi-surface: var(--color-neutral-white, #ffffff);
  --kototoi-bg-subtle: var(--color-neutral-solid-gray-50, #f2f2f2);
  --kototoi-accent: var(--kototoi-link);
  --kototoi-accent-hover: var(--kototoi-link-hover);
  --kototoi-accent-subtle: var(--color-primitive-blue-50, #e8f1fe);
  --kototoi-focus: var(--focus-ring, #0017c1);
  --kototoi-error: var(--color-semantic-error-1, #ec0000);
  --kototoi-error-bg: var(--color-primitive-red-50, #fdeeee);
  --kototoi-success: var(--color-semantic-success-1, #259d63);
  --kototoi-success-bg: var(--color-primitive-green-50, #e6f5ec);
  --kototoi-warning-bg: var(--color-primitive-yellow-50, #fbf5e0);
  --kototoi-warning-text: var(--color-semantic-warning-yellow-2, #806300);

  --kototoi-weight-body: var(--weight-body, 400);
  --kototoi-weight-emphasis: var(--weight-emphasis, 600);
  --kototoi-weight-heading: var(--weight-heading, 700);

  --kototoi-radius: 4px;
  --kototoi-text-base: 17px;
  --kototoi-text-sm: 16px;
  --kototoi-text-xs: 14px;
  --kototoi-leading: 1.7;
  --kototoi-tracking: 0.02em;

  --kototoi-space-1: 0.25rem;
  --kototoi-space-2: 0.5rem;
  --kototoi-space-3: 0.75rem;
  --kototoi-space-4: 1rem;
  --kototoi-space-5: 1.25rem;
  --kototoi-space-6: 1.5rem;

  --kototoi-btn-min-height: 44px;
  --kototoi-shadow-1: 0 2px 8px 1px rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.3);
}

@media (prefers-reduced-motion: reduce) {
  .kototoi-form *,
  .kototoi-form *::before,
  .kototoi-form *::after,
  .kototoi-admin *,
  .kototoi-admin *::before,
  .kototoi-admin *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

.sorane {
  font-family: var(--kototoi-font);
  font-size: var(--kototoi-text-base);
  line-height: var(--kototoi-leading);
  color: var(--kototoi-text);
  max-width: 48rem;
  margin: 0 auto;
  padding: var(--kototoi-space-6) var(--kototoi-space-4);
}

.sorane__title { font-size: 1.5rem; font-weight: 700; margin: 0 0 0.25rem; }
.sorane__lead { color: var(--kototoi-muted); margin: 0 0 var(--kototoi-space-5); }
.sorane__panel {
  border: 1px solid var(--kototoi-border);
  border-radius: var(--kototoi-radius);
  padding: var(--kototoi-space-4);
  margin-bottom: var(--kototoi-space-4);
}
.sorane__stack { display: grid; gap: var(--kototoi-space-3); }
.sorane__input, .sorane__textarea {
  width: 100%;
  padding: var(--kototoi-space-2) var(--kototoi-space-3);
  border: 1px solid var(--kototoi-border-strong);
  border-radius: var(--kototoi-radius);
  font: inherit;
}
.sorane__textarea { min-height: 5rem; resize: vertical; }
.sorane__btn {
  display: inline-flex;
  padding: var(--kototoi-space-2) var(--kototoi-space-4);
  background: var(--kototoi-accent);
  color: #fff;
  border: none;
  border-radius: var(--kototoi-radius);
  cursor: pointer;
  font: inherit;
}
.sorane__btn--text { background: transparent; color: var(--kototoi-accent); border: none; }
.sorane__link { color: var(--kototoi-accent); cursor: pointer; text-decoration: underline; }
.sorane__meta { color: var(--kototoi-muted); font-size: var(--kototoi-text-sm); }
.sorane__message {
  border-left: 3px solid var(--kototoi-border);
  padding-left: var(--kototoi-space-3);
  margin: var(--kototoi-space-3) 0;
}
.sorane__message--agent { border-color: #e8c468; }
.sorane__status { margin-top: var(--kototoi-space-3); font-size: var(--kototoi-text-sm); }
.sorane__status--error { color: #b00020; }