/* ============================================================
   BLOC_market 共通テーマ（bloc_ryutsu の配色・質感に寄せたもの）
   ============================================================ */
:root {
  --color-bg: #f9f6ee;
  --color-surface: #fffdfb;
  --color-surface-alt: #eef4ee;

  --color-primary: #6c8f78;
  --color-primary-dark: #486954;
  --color-primary-soft: #dcebe3;

  --color-text: #31413d;
  --color-text-muted: #716d73;
  --color-border: #d7d5c7;

  --color-success: #4a8f6a;
  --color-success-bg: #e4f3ea;
  --color-warn: #b8860b;
  --color-warn-bg: #fdf3dc;
  --color-danger: #b85c4a;
  --color-danger-bg: #fbe9e5;

  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 18px;

  --shadow-sm: 0 1px 2px rgba(30, 30, 20, 0.06);
  --shadow-md: 0 6px 20px rgba(30, 30, 20, 0.10);

  --font-base: "Noto Sans JP", "Hiragino Sans", "Yu Gothic UI", sans-serif;
}

* { box-sizing: border-box; }

body {
  font-family: var(--font-base);
  background-color: var(--color-bg);
  color: var(--color-text);
  -webkit-font-smoothing: antialiased;
}

a { color: var(--color-primary-dark); }

h1 {
  color: var(--color-text);
}

button, .btn {
  font-family: var(--font-base);
  background: var(--color-primary);
  color: #fff;
  border: none;
  border-radius: var(--radius-md);
  cursor: pointer;
  transition: background-color 0.15s ease, box-shadow 0.15s ease, transform 0.08s ease;
}
button:hover:not(:disabled), .btn:hover:not(:disabled) {
  background: var(--color-primary-dark);
}
button:disabled, .btn:disabled {
  background: var(--color-text-muted);
  cursor: not-allowed;
}

input, select, textarea {
  font-family: var(--font-base);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-surface);
  color: var(--color-text);
}
input:focus, select:focus, textarea:focus {
  outline: 2px solid var(--color-primary-soft);
  border-color: var(--color-primary);
}

/* ---- 全ツール共通のヘッダー（左：ログイン中、右上：ログアウト。ツール間の移動は nav.js のタブ） ---- */
.app-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
  font-size: 12px;
  color: var(--color-text-muted);
}
.app-header a {
  text-decoration: none;
}
.app-header-logout {
  white-space: nowrap;
}