/* === プレゼント企画システム 専用スタイル === */

/* --- ヘッダーの重なり調整 --- */
/* 固定ページテンプレートと詳細ページで、ヘッダーの高さに応じてコンテンツ開始位置を調整 */
body.page-template-page-giveaway-archive #primary.content-area,
body.single-giveaway_project #primary.content-area {
  padding-top: 4em; /* PC/スマホ両方で十分な余白を確保 */
}

/* --- 企画一覧ページ (archive-giveaway_project.php) --- */
.giveaway-archive-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 1.5em;
  /* タイトルとの間に適切な余白を確保 */
  margin-top: 2em;
}

.giveaway-archive-card {
  display: block;
  text-decoration: none;
  color: inherit;
  background-color: #fff;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  overflow: hidden;
  transition: box-shadow 0.3s ease, transform 0.3s ease;
}

.giveaway-archive-card:hover {
  box-shadow: 0 5px 20px rgba(0,0,0,0.1);
  transform: translateY(-5px);
}

/* --- 詳細ページ ヘッダー枠線の追加 --- */
.single-giveaway_project #masthead {
  border-bottom: 3px solid #EEF4F9;
}

/* 詳細ページのタイトルボックスの上の余白をなくし、ボタンとの間隔を調整 */
.single-giveaway_project .entry-title {
    margin-top: 0 !important;
}

/* --- 企画詳細ページ (single-giveaway_project.php) --- */
.giveaway-project-single .post-thumbnail {
  margin-bottom: 2em;
}

/* PC表示でのアイキャッチ画像の最大幅を設定 */
@media (min-width: 769px) {
  .giveaway-project-single .post-thumbnail {
    max-width: 800px; /* 最大幅を800pxに制限 */
    margin-left: auto;
    margin-right: auto;
  }
}

.giveaway-project-single .post-thumbnail img {
  width: 100%;
  height: auto;
  border-radius: 8px;
  box-shadow: 0 4px 15px rgba(0,0,0,0.1);
}

.giveaway-project-single .giveaway-prizes-section {
  margin-top: 3em;
  padding-top: 2em;
  border-top: 1px solid #e0e0e0;
}

.giveaway-project-single .giveaway-prizes-section h2 {
  font-size: 1.6em;
  text-align: center;
  margin-bottom: 1.5em;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5em;
  color: #023875;
  background: none;
  border: none;
}

.giveaway-project-single .prize-card {
  display: flex;
  gap: 2em;
  background-color: #fff;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  padding: 2em;
  margin-bottom: 2em;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}

.giveaway-project-single .prize-card-image {
  width: 250px;
  flex-shrink: 0;
}

.giveaway-project-single .prize-card-image img {
  width: 100%;
  height: auto;
  border-radius: 5px;
}

.giveaway-project-single .prize-card-content {
  flex-grow: 1;
}

.giveaway-project-single .prize-card-title {
  margin-top: 0;
  font-size: 1.4em;
  color: #023875;
}

.giveaway-project-single .prize-card-meta {
  display: flex;
  gap: 1.5em;
  font-size: 0.9em;
  color: #666;
  margin-bottom: 1em;
}

.giveaway-project-single .prize-card-description {
  color: #333;
  margin-bottom: 1.5em;
  line-height: 1.7;
}

.giveaway-project-single .prize-card-delivery,
.giveaway-project-single .lottery-results {
  margin-top: 1.5em;
  padding-top: 1.5em;
  border-top: 1px dashed #ccc;
}

.giveaway-project-single .winner-numbers-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8em;
  margin-top: 1em;
}

.giveaway-project-single .winner-number-tag {
  background-color: #eef4f9;
  color: #333;
  padding: 0.3em 0.8em;
  border-radius: 15px;
  font-size: 0.9em;
  font-weight: bold;
}

.giveaway-project-single .winner-number-tag.is-declined {
  background-color: #e9ecef;
  color: #6c757d;
}
.giveaway-project-single .winner-number-tag.is-declined s {
    text-decoration-color: #adb5bd;
}

.giveaway-project-single .decline-notice {
  font-size: 0.85em;
  color: #666;
  background-color: #f8f9fa;
  border: 1px solid #e9ecef;
  padding: 0.8em 1em;
  margin-top: 1em;
  border-radius: 4px;
}

/* --- レスポンシブ対応 --- */
@media (max-width: 768px) {
  .giveaway-project-single .prize-card {
    flex-direction: column;
    padding: 1.5em;
    gap: 1.5em;
  }
  .giveaway-project-single .prize-card-image {
    width: 100%;
    max-width: 300px;
    margin: 0 auto;
  }
  .giveaway-project-single .prize-card-title {
    font-size: 1.2em;
  }
}

/* --- 企画詳細ページ 戻るボタン --- */
.back-to-archive-link-wrapper {
  margin-bottom: 1em; /* タイトルボックスとの間の余白を調整 */
  text-align: left;
}

.back-to-archive-link {
  display: inline-block;
  padding: 0.8em 1.5em;
  background-color: #EEF4F9;
  color: #023875 !important;
  border: 1px solid #dbe8f3;
  border-radius: 5px;
  text-decoration: none;
  font-weight: bold;
  transition: background-color 0.2s, box-shadow 0.2s;
}

.back-to-archive-link:hover {
  background-color: #dbe8f3;
  box-shadow: 0 2px 5px rgba(0,0,0,0.05);
  color: #023875 !important;
}

/* プレゼント企画一覧ページでサイドバー全体を非表示にする */
body.page-template-page-giveaway-archive #secondary {
    display: none !important; /* !important を追加して確実に非表示にする */
}

/* トップページへのボタンを非表示にする */
/* elements.txtで確認したクラス名を使用 */
body.page-template-page-giveaway-archive .wp-block-nishiki-blocks-pro-button.contact_btn {
    display: none !important;
}

/* === プレゼント企画 管理ページ (page-execute-lottery.php) カードレイアウト === */

/* 企画一覧のグリッドコンテナ */
.giveaway-list {
  display: grid;
  /* 最小幅280pxのカードを配置し、画面幅に応じて列数を自動調整 */
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1.5em;
}

/* 各企画のカード */
.giveaway-card {
  background-color: #fff;
  border: 1px solid #e9ecef;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
  overflow: hidden; /* 角丸を画像に適用するため */
  display: flex;
  flex-direction: column; /* カード内の要素を縦に並べる */
  transition: transform 0.2s ease-out, box-shadow 0.2s ease-out;
}

.giveaway-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 6px 16px rgba(0,0,0,0.1);
}

/* 画像コンテナ (アスペクト比16:9) */
.giveaway-card-thumbnail {
  width: 100%;
  aspect-ratio: 16 / 9;
  background-color: #f8f9fa; /* 画像がない場合の背景色 */
}

.giveaway-card-thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* はみ出した部分をトリミングし、コンテナを埋める */
  display: block;
}

/* カードのコンテンツエリア */
.giveaway-card-content {
  padding: 1em 1.2em 1.2em;
  display: flex;
  flex-direction: column;
  flex-grow: 1; /* 残りの高さを埋める */
}

/* 企画タイトル */
.giveaway-card-title {
  font-size: 1.2em;
  font-weight: 600;
  margin: 0 0 0.5em 0;
  line-height: 1.4;
  color: #333;
}

/* ステータスラベル (準備中など) */
.giveaway-status {
  font-size: 0.85em;
  font-weight: bold;
  padding: 0.3em 0.8em;
  border-radius: 15px;
  color: #fff;
  align-self: flex-start; /* 左寄せで幅をコンテンツに合わせる */
  margin-bottom: 1em;
}

.status-preparing { background-color: #f0ad4e; }
.status-active { background-color: #5cb85c; }
.status-finished { background-color: #777; }

/* ボタンエリア */
.giveaway-card-actions {
  margin-top: auto; /* ボタンをカードの最下部に配置 */
  display: flex;
  gap: 0.5em; /* ボタン間の隙間 */
  align-items: center;
}

/* カード内ボタンの共通スタイル */
.giveaway-card-actions .button {
    flex-grow: 1; /* ボタンの幅を均等にする */
    text-align: center;
    padding: 0.6em 0.5em;
    font-size: 0.85rem;
    font-weight: 600;
    border: 1px solid transparent;
    border-radius: 5px;
    text-decoration: none;
    color: #ffffff !important; /* 文字色を白で統一 */
    transition: background-color 0.2s ease, transform 0.2s ease;
    cursor: pointer;
    line-height: 1.5;
    white-space: nowrap; /* テキストの改行を防ぐ */
}

.giveaway-card-actions .button:hover {
    transform: translateY(-2px);
}

/* 企画編集ボタン (青) */
.giveaway-card-actions .button-edit {
    background-color: #007bff;
}
.giveaway-card-actions .button-edit:hover {
    background-color: #0069d9;
}

/* 抽選ページボタン (青) */
.giveaway-card-actions .button-lottery {
    background-color: #007bff;
}
.giveaway-card-actions .button-lottery:hover {
    background-color: #0069d9;
}

/* 発送処理ボタン (緑) */
.giveaway-card-actions .button-ship {
    background-color: #28a745;
    border-color: #28a745;
    /* 文字色は .giveaway-card-actions .button の
       color:#ffffff !important がそのまま効く */
}
.giveaway-card-actions .button-ship:hover {
    background-color: #218838;
    border-color: #1e7e34;
}

/* 削除ボタン (赤) */
.giveaway-card-actions .button-delete {
    background-color: #dc3545;
  cursor: pointer;
}
.giveaway-card-actions .button-delete:hover {
    background-color: #c82333;
}

/* 抽選ページ: 戻るボタンのラッパー */
.back-to-list-wrapper {
    margin-bottom: 2em;
}

/* --- 共通: モダンなグラデーションボタン --- */
.button-modern-gradient {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.8em; /* アイコンとテキストの間隔 */
    background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%); /* グラデーション背景 */
    color: #ffffff !important; /* !importantで親テーマのスタイルを上書き */
    border: none;
    border-radius: 50px; /* 角を丸くして柔らかい印象に */
    padding: 1em 2em;
    font-size: 1rem;
    font-weight: bold;
    text-decoration: none;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
    transition: transform 0.2s ease-out, box-shadow 0.2s ease-out;
    line-height: 1; /* テキストの行の高さを調整 */
}

.button-modern-gradient:hover,
.button-modern-gradient:focus {
    transform: translateY(-3px); /* 少し浮き上がる効果 */
    box-shadow: 0 7px 20px rgba(0, 0, 0, 0.25); /* 影を濃くする */
    color: #ffffff !important; /* ホバー時も文字色を白に保つ */
    background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%); /* ホバー時の背景も維持 */
}

.button-modern-gradient .dashicons {
    font-size: 1.3em;
    height: auto;
    width: auto;
}

/* === 企画作成ページ (page-create-giveaway.php) === */
.giveaway-creator-container .form-actions {
    display: flex;
    justify-content: flex-end; /* ボタンを右寄せ */
    gap: 1em; /* ボタン間の余白 */
    align-items: center;
    margin-top: 2em;
    border-top: 1px solid #e0e0e0;
    padding-top: 2em;
}

/* WordPressのデフォルトスタイルを上書きして幅を自動調整 */
.giveaway-creator-container .form-actions .button,
.giveaway-creator-container .form-actions button {
    width: auto;
    margin: 0;
}

/* キャンセルボタンのスタイル */
.giveaway-creator-container .form-actions .button-cancel {
    background-color: #6c757d; /* グレー */
    border-color: #6c757d;
    color: #ffffff !important;
    text-decoration: none;
}

.giveaway-creator-container .form-actions .button-cancel:hover {
    background-color: #5a6268;
    border-color: #5a6268;
}

/* === 7/8日ルール UI (page-execute-lottery.php) === */

/* オーバーレイの基準点として機能させる */
.prize-lottery-card {
  position: relative;
}

/* 確定オーバーレイのスタイル */
.giveaway-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(2, 56, 117, 0.85); /* サイトのメインカラー（濃い青）を半透明に */
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  border-radius: 8px; /* 親カードの角丸に合わせる */
  z-index: 10;
  opacity: 0;
  animation: fadeInOverlay 0.5s forwards;
  padding: 1em;
}

@keyframes fadeInOverlay {
  to {
    opacity: 1;
  }
}

.giveaway-overlay-content .dashicons {
  font-size: 48px;
  width: 48px;
  height: 48px;
  color: #5cb85c; /* 成功を示す緑色 */
}

.giveaway-overlay-content p { font-size: 1.4em; font-weight: bold; margin: 0.5em 0 0.2em; }
.giveaway-overlay-content small { font-size: 1em; opacity: 0.9; }

/* 辞退ボタンの無効化スタイル */
.decline-winner-button.is-disabled {
  color: #999 !important;
  text-decoration: none;
  cursor: not-allowed;
  pointer-events: none;
}