
/* ========================================================= 
   ここだけ触ればOK（サイト別テーマ）
   :root の値を変えるだけで色替え
   ========================================================= */
:root{
  /* ===== 基本カラー ===== */
  --bg: #FBFCF6;
  --surface: #FBFCF6;/*カード/パネル/セクションなど枠内の色*/
  --text: #444;
  --muted: #C71805; /*h3の日本語・システムのテーブルなど文字色*/
  --line: #8B1103; /*footer区切り線*/

  /* ===== ブランド ===== */  
  --brand: #f00; /*ギャラリー・キャストのサムネイル画像の下線色*/
  --brand-2: #f00;

  /* ===== Header / Nav ===== */
  --header-bg: #C71805;
  --nav-band-bg: linear-gradient(180deg, #C71805, #A81404 60%, #C71805);
  --nav-tab-border: #8B1103;
  --nav-en-color: #DFCA87;
  --nav-jp-color: #ddd;

  /* ===== Header info ===== */
  --brand__h1: #ddd; /* h1 */
  --hi-accent: #DFCA87; /*TEL*/
  --hi-muted:  #ddd;/*住所*/

  /* ===== Footer ===== */
  --footer-bg: #C71805;
  
  --footer-adress: #ddd;/*住所　営業時間　定休日*/
  --footer-tel: #DFCA87;
  --footer-copy: #ddd;

  /* ===== Card ===== */
  --card-bg: color-mix(in oklab, var(--surface) 78%, transparent);
  --card-border: color-mix(in oklab, var(--text) 10%, transparent);
  --card-row: color-mix(in oklab, var(--text) 8%, transparent);

  /* ===== 背景の光（演出） ===== */
  --bg-glow: rgba(122,162,255,.12);

  /* ===== News ===== */
  --news-line: #555;
  --news-date: #6b7280;
  --news-title: #7A542B;
  --news-hover: rgba(0,0,0,.03);
  --news-topline: rgba(0,0,0,.14);

  /* ===== Coupon / Ticket ===== */
  --ticket-line: #aaa;
  --ticket-badge: #f33;
  --ticket-accent: #960;/*タイトル*/

  /* ===== Event ===== */
  --event-card-line: #aaa;
  
 /* ===== ハンバーガー ===== */
  --hb-btn-bg: var(--header-bg);     
  --hb-btn-border: var(--nav-tab-border);  /* ボタン枠 */
  --hb-btn-ink: var(--nav-jp-color);       /* 三本線/× の色 */

  --hb-menu-bg: var(--header-bg);          /* メニュー背景 */
  --hb-menu-border: var(--nav-tab-border); /* メニュー枠/区切り線 */
  --hb-item-bg: var(--header-bg);          /* メニュー各行背景 */
  --hb-item-ink: var(--nav-en-color);      /* メニュー文字/矢印の色（＝今の --news-title と同じ） */

}




/* =========================================================
   ↓↓↓↓ここは基本触らない（保険上書き）↓↓↓↓
   - core.css に直書きが残ってる箇所が「変数だけでは変わらない」時の救済
   ========================================================= */

/* 背景（core側が直書きでも統一） */
body{
  background:
    radial-gradient(1200px 800px at 70% -10%, var(--bg-glow), transparent 55%),
    var(--bg);
}
/* header/footer 背景（coreが直書きでも上書き優先） */
.site-header{ background: var(--header-bg); }
.site-footer{ background: var(--footer-bg); }

/* header/footer 背景（coreが直書きでも上書き優先） */
.footer__address,
.footer__hours,
.footer__holiday,
.footer__sep{
	color: var(--footer-adress); }
.site-header{ background: var(--header-bg); }
.site-footer{ background: var(--footer-bg); }

/* footer tel / copy */
.footer__tel{ color: var(--footer-tel); }
.footer__tel a{ color: var(--footer-tel); }
.footer__copy{ color: var(--footer-copy); }

/* SP nav / hamburger（★ここだけ“ハンバーガー専用変数”に差し替え） */
@media (max-width:1049px){
  .hamburger{
    border-color: var(--hb-btn-border) !important;
    background: var(--hb-btn-bg) !important;
  }
  .hamburger span,
  .hamburger span::before,
  .hamburger span::after{
    background: var(--hb-btn-ink) !important;
  }

  .nav{
    background: var(--hb-menu-bg) !important;
    border-left-color: var(--hb-menu-border) !important;
  }
  .nav .nav__link,
  .nav a{
    background: var(--hb-item-bg) !important;
    border-top-color: var(--hb-menu-border) !important;
    color: var(--hb-item-ink) !important;

    /* 右端の縦線が出るケースの保険 */
    border-right: none !important;
  }
  .nav .nav__link::before,
  .nav a::before,
  .nav .nav__link::after,
  .nav a::after{
    color: var(--hb-item-ink) !important;
  }
}

/* News */
.news-list{ border-top-color: var(--news-line) !important; }
.news-row{ border-bottom-color: var(--news-line) !important; }
.news-row:hover{ background: var(--news-hover) !important; }
.news-row .date{ color: var(--news-date) !important; }
.news-row > a,
.news-row > span:not(.date):not(.more){ color: var(--news-title) !important; }
.card .news-list .news-row:first-child{ border-top-color: var(--news-topline) !important; }

/* Coupon / Event */
.ticket{ border-color: var(--ticket-line) !important; }
.ticket__corner{ background-color: var(--ticket-badge) !important; }
.ticket__section-title{ color: var(--ticket-accent) !important; }
.sd-events .sd-card{ border-color: var(--event-card-line) !important; }

/* Gallery */
.mloop__item{ background: var(--panel-0) !important; }
