/*
Theme Name: MIKADO Child
Theme URI: https://yamazen-tokyo.com
Description: MIKADO (TCD071) の子テーマ
Author: Yamazen Tokyo
Author URI: https://yamazen-tokyo.com
Template: mikado_tcd071
Version: 1.0.0
Text Domain: mikado-child
*/

/* 親テーマのスタイルは functions.php で読み込み */

/* ==========================================================================
   カスタムスタイル（親テーマの追加CSSから移行）
   ========================================================================== */

/* Facebook埋め込みのセンタリング */
.wp-block-columns:has(iframe[src*="facebook.com"]) {
  text-align: center;
  padding-top: 20px;
}

/* 絵文字画像のベースライン補正 */
img.emoji,
img.wp-smiley {
  vertical-align: -0.12em;
}

/* ==========================================================================
   全ページ共通: ダークフッター
   ========================================================================== */

/* フッター全体を黒に */
.l-footer {
  background-color: #000000 !important;
}

.l-footer .p-footer-link {
  background-color: #000000 !important;
}

.l-footer .p-info,
.l-footer .p-footer-nav {
  background-color: transparent !important;
  background: transparent !important;
}

.l-footer .p-info {
  border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important;
}

/* フッターナビ文字色（縦書き含む） */
.l-footer .p-footer-nav a,
.l-footer .p-footer-nav--type1 .p-footer-nav__inner li a {
  color: #cccccc !important;
}

.l-footer .p-footer-nav a:hover,
.l-footer .p-footer-nav--type1 .p-footer-nav__inner li a:hover {
  color: #ffffff !important;
}

/* フッターロゴ・住所 */
.l-footer .p-info__logo a {
  color: #ffffff !important;
}

.l-footer .p-info__address {
  color: #aaaaaa !important;
}

/* SNSアイコン */
.l-footer .p-social-nav__item a {
  opacity: 0.7;
}

.l-footer .p-social-nav__item a:hover {
  opacity: 1;
}

/* コピーライトエリア */
.l-footer .p-copyright {
  background-color: #1a1a1a !important;
  color: #888888 !important;
}

.l-footer .p-copyright small {
  color: #888888 !important;
}

/* ==========================================================================
   全ページ共通: パンくずリスト（赤背景 → ゴールド）
   ========================================================================== */

.p-breadcrumb {
  background-color: #facb03 !important;
}

.p-breadcrumb a,
.p-breadcrumb span,
.p-breadcrumb li {
  color: #000000 !important;
}

.p-breadcrumb .p-breadcrumb__item::before,
.p-breadcrumb .p-breadcrumb__item::after {
  color: #000000 !important;
}

.p-breadcrumb a:hover {
  color: #333333 !important;
}

/* ==========================================================================
   全ページ共通: ダークヘッダー（下層ページ）
   ========================================================================== */

/* ヘッダー背景を黒に */
body:not(.home) .l-header {
  background-color: #000000 !important;
}

body:not(.home) .l-header--fixed {
  background-color: #000000 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}

/* ナビゲーション文字色を白に */
body:not(.home) .p-global-nav > ul > li > a {
  color: #ffffff !important;
}

body:not(.home) .p-global-nav > ul > li > a:hover {
  color: #cccccc !important;
}

/* メガメニューの背景 */
body:not(.home) .p-global-nav .p-megamenu {
  background-color: #111111 !important;
}

body:not(.home) .p-global-nav .p-megamenu a {
  color: #cccccc !important;
}

body:not(.home) .p-global-nav .p-megamenu a:hover {
  color: #ffffff !important;
}

/* ロゴテキスト色 */
body:not(.home) .l-header .l-header__logo a {
  color: #ffffff !important;
}

/* selectのoption（ドロップダウン内） */
.l-header select option {
  background: #333333;
  color: #ffffff;
  padding: 8px;
}

/* ハンバーガーアイコンを白に */
body:not(.home) .p-hamburger__bar,
body:not(.home) .c-hamburger__line {
  background-color: #ffffff !important;
}

/* ドロワーメニュー背景 */
body:not(.home) .p-drawer-nav {
  background-color: #111111 !important;
}

body:not(.home) .p-drawer-nav a {
  color: #cccccc !important;
}

/* ==========================================================================
   下層ページ（トップページ以外）: ダークテーマ
   ========================================================================== */

/* 本文エリア背景・文字 */
body:not(.home) .l-main {
  background-color: #1a1a1a;
  color: #e0e0e0;
}

/* bodyの背景も合わせる */
body:not(.home) {
  background-color: #1a1a1a;
}

/* ページタイトル・見出し（共通フォント・文字色） */
body:not(.home) h1,
body:not(.home) h2,
body:not(.home) h3,
body:not(.home) h4,
body:not(.home) h5,
body:not(.home) h6 {
  color: #ffffff;
  font-family:
    "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3",
    "Hiragino Mincho Pro", "Times New Roman", serif;
  font-weight: 400;
  letter-spacing: 0.08em;
}

/* ページタイトルの配置調整のみ維持 */
body:not(.home) .l-main h1 {
  text-align: center;
  font-size: 2em;
  line-height: 1.4;
  margin-bottom: 1.5em;
}

h1.h1::after {
  height: 1px !important;
}

h2.h2::before {
  height: 2px !important;
}

body:not(.home) .l-main .tourlink figcaption {
  color: #ffffff !important;
}

/* 段落・本文テキスト */
body:not(.home) p,
body:not(.home) li,
body:not(.home) td,
body:not(.home) th,
body:not(.home) label {
  color: #e0e0e0;
}

/* リンク */
body:not(.home) .l-main a {
  color: #cccccc;
}

body:not(.home) .l-main a:hover {
  color: #ffffff;
}

/* 水平線・区切り線 */
body:not(.home) hr {
  border-color: rgba(255, 255, 255, 0.15);
}

/* ==========================================================================
   下層ページ: アーカイブ（ブログ・過去実績）
   ========================================================================== */

/* 記事タイトル（2行制限を解除して全文表示） */
.p-article01__title,
.p-news-list__title {
  color: #e0e0e0 !important;
  display: block !important;
  -webkit-line-clamp: unset !important;
  -webkit-box-orient: unset !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  text-overflow: unset !important;
  white-space: normal !important;
}

/* 過去実績アーカイブ（トップページの過去実績セクションとデザインを統一） */
.p-news-list ul li.has_image a {
  background-color: #111111 !important; /* カード背景を漆黒より少し明るく */
  height: auto !important;
  min-height: 190px !important;
  display: flex !important;
  align-items: center;
}

@media (max-width: 767px) {
  .p-news-list ul li.has_image a {
    min-height: 0 !important;
    padding: 5px 0 !important;
  }
}

.p-news-list ul li.has_image .image {
  width: 50% !important;
  max-width: 260px !important;
  height: 160px !important;
  float: none !important;
  margin: 15px 0 15px 15px !important;
  flex-shrink: 0;
  overflow: hidden; /* 拡大時のはみ出し防止 */
}

@media (max-width: 767px) {
  .p-news-list ul li.has_image .image {
    width: 50% !important;
    height: 160px !important;
    margin: 10px !important;
    max-width: 260px !important;
  }
}

.p-news-list ul li.has_image .image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  transition: transform 0.3s ease;
}

/* ホバー時に画像を拡大（1.2倍） */
.p-news-list ul li.has_image a:hover .image img {
  transform: scale(1.2);
}

/* スライダー用の調整 */
.p-news-slider {
  margin: 0;
  overflow: hidden;
}

.p-news-slider__slide,
.p-news-slider__slide img {
  height: 160px !important;
}

.p-news-list ul li.has_image .info {
  position: static !important;
  transform: none !important;
  padding: 20px 40px !important;
  flex-grow: 1;
}

@media (max-width: 767px) {
  .p-news-list ul li.has_image .info {
    padding: 15px !important;
  }
}

body:not(.home) .p-news-list__title {
  font-size: 15px !important;
  line-height: 1.7 !important;
  margin-top: 5px !important;
}

@media (min-width: 768px) {
  body:not(.home) .p-news-list__title {
    font-size: 16px !important;
  }
}

@media (min-width: 992px) {
  body:not(.home) .p-news-list__title {
    font-size: 17px !important;
  }
}

/* 共通ホバー・テキスト設定 */
body:not(.home) .p-article01__title:hover,
body:not(.home) .p-news-list__title:hover {
  opacity: 0.6 !important;
}

body:not(.home) .p-article01__date,
body:not(.home) .p-article01__cat,
body:not(.home) .p-article01__cat a,
body:not(.home) .p-news-list__date,
body:not(.home) .p-news-list .p-date {
  color: #999999 !important;
}

body:not(.home) .p-article01__cat a:hover {
  color: #facb03 !important;
}

/* ページネーション */
body:not(.home) .p-pagination .page-numbers {
  background-color: #222222;
  color: #e0e0e0;
  border-color: rgba(255, 255, 255, 0.2);
}

body:not(.home) .p-pagination .page-numbers.current {
  background-color: #000000;
  color: #ffffff;
}

body:not(.home) .p-pagination .page-numbers:hover {
  background-color: #333333;
}

/* ==========================================================================
   下層ページ: お問合せフォーム
   ========================================================================== */

body:not(.home) input[type="text"],
body:not(.home) input[type="email"],
body:not(.home) input[type="tel"],
body:not(.home) textarea,
body:not(.home) select {
  background-color: #2a2a2a !important;
  color: #e0e0e0 !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
}

body:not(.home) input[type="text"]::placeholder,
body:not(.home) input[type="email"]::placeholder,
body:not(.home) input[type="tel"]::placeholder,
body:not(.home) textarea::placeholder {
  color: #888888 !important;
}

/* Contact Form 7 テーブル */
body:not(.home) .wpcf7 .wpcf7-form-control-wrap input,
body:not(.home) .wpcf7 .wpcf7-form-control-wrap textarea {
  background-color: #2a2a2a !important;
  color: #e0e0e0 !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
}

/* 送信ボタン（白枠透過デザイン・緑色を完全に解消） */
body:not(.home) .wpcf7 input[type="submit"],
body:not(.home) .wpcf7 .wpcf7-submit,
body:not(.home) .wp-block-button__link,
body:not(.home) .p-btn.p-btn__horizon {
  background: transparent !important;
  background-image: none !important;
  background-color: transparent !important;
  border: 1px solid #ffffff !important;
  color: #ffffff !important;
  transition: all 0.3s ease !important;
  box-shadow: none !important;
  /* 形状と余白の調整 */
  width: auto !important;
  min-width: 240px;
  padding: 18px 60px !important;
  border-radius: 50px !important;
  display: inline-block !important;
}

body:not(.home) .wpcf7 input[type="submit"]:hover,
body:not(.home) .wpcf7 .wpcf7-submit:hover,
body:not(.home) .wp-block-button__link:hover,
body:not(.home) .p-btn.p-btn__horizon:hover {
  background-color: #ffffff !important;
  color: #000000 !important;
}

/* ボタンの親要素で中央揃え */
body:not(.home) .wp-block-button {
  text-align: center !important;
}

/* ==========================================================================
   下層ページ: ブログ詳細ページ
   ========================================================================== */

/* カテゴリラベル等のボーダーをイエローに（添付通りのセレクタを適用） */
.p-entry__category {
  border-color: #facb03 !important;
}

/* 記事・固定ページ内のテーブル（会社概要等） */
body:not(.home) .p-entry__body table,
body:not(.home) .p-entry__content table,
body:not(.home) .wp-block-table table {
  border-collapse: collapse !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
  background-color: transparent !important;
  margin-bottom: 40px;
}

body:not(.home) .p-entry__body td,
body:not(.home) .p-entry__body th,
body:not(.home) .p-entry__content td,
body:not(.home) .p-entry__content th,
body:not(.home) .wp-block-table td,
body:not(.home) .wp-block-table th {
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  color: #eeeeee !important;
  padding: 1.2em 1.5em !important;
  background-color: transparent !important;
}

/* テーブルの見出し列（左側）の調整 */
body:not(.home) .p-entry__body th,
body:not(.home) .p-entry__content th,
body:not(.home) .wp-block-table th {
  background-color: rgba(255, 255, 255, 0.05) !important;
  font-weight: 600;
  text-align: left;
}

/* 引用ブロック */
body:not(.home) blockquote {
  border-left-color: rgba(255, 255, 255, 0.3);
  color: #cccccc;
}

/* コードブロック */
body:not(.home) pre,
body:not(.home) code {
  background-color: #111111;
  color: #e0e0e0;
}

/* ==========================================================================
   下層ページ: サイドバー & コンポーネント調整
   ========================================================================== */

/* アーカイブ・カテゴリ等のドロップダウン (添付1, 2) */
body:not(.home) .p-dropdown__title {
  background-color: #222222 !important;
  color: #ffffff !important;
}

body:not(.home) .p-dropdown__title::after {
  color: #ffffff !important;
}

body:not(.home) .p-dropdown__list li {
  background-color: #222222 !important;
  border-top: 0 !important;
}

body:not(.home) .p-dropdown__list a {
  color: #eeeeee !important;
}

body:not(.home) .p-dropdown__list a:hover {
  background-color: #333333 !important;
  color: #ffffff !important;
}

/* 検索ボックス等 */
body:not(.home) .n-widget-google-search-widget input {
  background-color: #222222 !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
}

/* メタボックス (添付3) */
body:not(.home) .c-meta-box {
  background: transparent !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  color: #eeeeee !important;
}

/* 記事前後ナビゲーション (添付4) */
body:not(.home) .p-nav01__item {
  background: transparent !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
}

body:not(.home) .p-nav01__item a {
  color: #eeeeee !important;
}

body:not(.home) .p-nav01__item:hover {
  background-color: rgba(255, 255, 255, 0.05) !important;
}

/* ==========================================================================
   全ページ共通: モバイルヘッダー（1199px以下）の最終調整
   最下部で以前のスタイルを確実に上書き
   ========================================================================== */

@media (max-width: 1199px) {
  /* ヘッダー背景を漆黒に */
  #js-header.l-header,
  body.home #js-header.l-header,
  body:not(.home) .l-header {
    background-image: none !important;
    background-color: #000000 !important;
    background: #000000 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
  }

  /* ハンバーガーメニューを白に（背景塗りを解除し、文字色のみ白く） */
  #js-menu-btn.p-menu-btn,
  #js-menu-btn.p-menu-btn::before,
  #js-menu-btn.p-menu-btn::after,
  #js-menu-btn.p-menu-btn span {
    background-color: transparent !important;
    color: #ffffff !important;
    box-shadow: none !important;
  }

  /* 多言語スイッチャー（select）をカプセル型に統一 */
  .l-header select,
  .l-header .pll-switcher select,
  select.pll-switcher-select,
  #lang_choice_1 {
    appearance: none !important;
    -webkit-appearance: none !important;
    background-color: transparent !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3E%3Cpath fill='%23ffffff' d='M0 2l4 4 4-4z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 10px center !important;
    border: 1px solid #ffffff !important;
    color: #ffffff !important;
    border-radius: 50px !important; /* 4px角丸を強制的に上書き */
    padding: 0 25px 0 15px !important;
    height: 34px !important;
    line-height: 32px !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    margin-right: 10px !important;
    outline: none !important;
    box-sizing: border-box !important;
  }
}

/* ==========================================================================
   全ページ共通: 多言語ボタン（PC版）の最終調整
   下層ページでの汎用フォームスタイル（body:not(.home) select）による上書きを完全に防ぐため、
   IDセレクタを使用して優先順位（Specificity）を最大化します。
   ========================================================================== */

@media (min-width: 1200px) {
  body #js-header select#lang_choice_1.pll-switcher-select,
  body .l-header select.pll-switcher-select,
  body .l-header .pll-switcher select {
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    background-color: transparent !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23ffffff' d='M6 8L1 3h10z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 12px center !important;
    background-size: 10px !important;
    border: 1px solid #ffffff !important;
    color: #ffffff !important;
    border-radius: 50px !important;
    padding: 0 30px 0 15px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    min-width: 100px !important;
    height: 34px !important;
    line-height: 32px !important;
    outline: none !important;
    box-sizing: border-box !important;
    cursor: pointer !important;
    display: inline-block !important;
    vertical-align: middle !important;
    margin: 0 !important;
  }

  body #js-header select#lang_choice_1.pll-switcher-select:hover {
    background-color: rgba(255, 255, 255, 0.1) !important;
    border-color: #ffffff !important;
  }
}