/* カスタムスタイル */

/* JAWS-UGのブランドカラーを活用 */
:root {
  --jawsug-orange: #ff8c00;
  --jawsug-blue: #1e88e5;
  --jawsug-dark: #212121;
}

/* ヘッダーのカスタマイズ */
.md-header {
  background: linear-gradient(45deg, var(--jawsug-orange), var(--jawsug-blue));
}

/* カードスタイル */
.md-typeset .admonition {
  border-radius: 8px;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

/* ナビゲーションのホバーエフェクト */
.md-nav__link:hover {
  color: var(--jawsug-orange);
  transition: color 0.3s ease;
}

/* コードブロックのスタイル改善 */
.md-typeset .highlight {
  border-radius: 6px;
  margin: 1em 0;
}

/* フッターのスタイル */
.md-footer {
  background-color: var(--jawsug-dark);
}

/* 日本語フォントの最適化 */
.md-typeset {
  font-family: "Roboto", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", sans-serif;
}

/* レスポンシブ画像 */
.md-typeset img {
  max-width: 100%;
  height: auto;
  border-radius: 4px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

/* ボタンスタイル */
.md-button {
  background-color: var(--jawsug-orange);
  border: none;
  border-radius: 6px;
  padding: 10px 20px;
  color: white;
  text-decoration: none;
  transition: background-color 0.3s ease;
}

.md-button:hover {
  background-color: var(--jawsug-blue);
}

/* テーブルの改善 */
.md-typeset table:not([class]) {
  border-radius: 6px;
  overflow: hidden;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

/* アニメーション */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

.md-content {
  animation: fadeIn 0.5s ease-out;
}