/* カスタマイズ用CSS */

/* === 高倉みそ 季節デザインシステム === */
body {
  background-color: var(--bg-primary);
  color: var(--text-on-dark);
}

.ec-layoutRole__header {
  background-color: var(--bg-secondary);
  border-bottom: 2px solid var(--accent);
}

.ec-btn--action {
  background-color: var(--accent) !important;
  border-color: var(--accent-dark) !important;
}

/* 季節ヘッダー */
.ec-layoutRole__header {
  background-color: var(--bg-secondary) !important;
}
.ec-headerNaviRole {
  background-color: var(--bg-secondary) !important;
}
.ec-headerNaviRole a,
.ec-headerNaviRole span {
  color: var(--text-on-dark) !important;
}
.ec-headerCategoryNav {
  background-color: var(--bg-primary) !important;
}
.ec-headerCategoryNav a {
  color: var(--text-on-dark) !important;
}

/* ヘッダー強制上書き */
header.ec-layoutRole__header,
header.ec-layoutRole__header * {
  background-color: var(--bg-secondary) !important;
  color: var(--text-on-dark) !important;
}

/* ヒーロータイトル折り返し防止 */
.hk-hero__title {
  word-break: keep-all;
  overflow-wrap: normal;
}

/* 発酵カウンター位置調整 */
.hk-ferment {
  bottom: auto;
  top: auto;
  margin-top: 2rem;
  position: static;
}

/* ===== RECIPE ===== */
.hk-recipe {
  background: var(--bg-primary);
  padding: 8vw 8vw 6vw;
}
.hk-recipe__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 3rem;
  border-bottom: 1px solid var(--accent);
  padding-bottom: 1.5rem;
}
.hk-recipe__en {
  font-size: 10px;
  letter-spacing: 0.3em;
  color: var(--accent);
  font-weight: 700;
  display: block;
  margin-bottom: 0.5rem;
}
.hk-recipe__title {
  font-size: clamp(1.6rem, 3.5vw, 2.8rem);
  font-weight: 900;
  color: var(--text-on-dark);
  letter-spacing: -0.02em;
  margin: 0;
}
.hk-recipe__more {
  font-size: 12px;
  color: var(--accent);
  text-decoration: none;
  letter-spacing: 0.1em;
  border-bottom: 1px solid var(--accent);
  padding-bottom: 2px;
  white-space: nowrap;
}
.hk-recipe__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2vw;
}
.hk-recipe__item img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  display: block;
  filter: saturate(0.85);
  transition: filter 0.3s, transform 0.3s;
}
.hk-recipe__item:hover img {
  filter: saturate(1.2);
  transform: scale(1.02);
}
@media (max-width: 768px) {
  .hk-recipe__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 4vw;
  }
}

/* 発酵カウンター位置修正 */
.hk-hero {
  padding-bottom: 4rem;
}
.hk-ferment {
  grid-column: 1;
  grid-row: 2;
  padding: 0 6vw 3vw 8vw;
  align-self: end;
}

/* スマホ修正 */
@media (max-width: 768px) {
  .hk-hero__cta {
    margin-bottom: 1.5rem;
  }
  .hk-ferment {
    padding: 0 6vw 6vw 6vw;
  }
  .hk-product-card__img {
    aspect-ratio: 3/2;
  }
  .hk-hero__image {
    height: 55vw;
  }
}

/* レシピページ余白 */
.hk-recipe-page,
.hk-rd {
  padding-left: 5%;
  padding-right: 5%;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}

/* === Typography === */
:root {
  --font-serif-ja: 'Noto Serif JP', serif;
  --font-sans-ja: 'Noto Sans JP', sans-serif;
  --font-serif-en: 'Cormorant Garamond', serif;
}

body {
  font-family: var(--font-sans-ja);
  font-weight: 300;
  font-size: 17px;
  line-height: 1.9;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-serif-ja);
  font-weight: 700;
}

/* 欧文見出し・アクセント */
.hk-hero__catch,
.hk-recipe-page__en,
.hk-rd__num,
.hk-section__en,
.hk-marquee__text {
  font-family: var(--font-serif-en);
  font-style: italic;
}

/* 左右白背景を排除 */
html, body {
  background-color: var(--bg-primary);
}
.ec-layoutRole {
  background-color: var(--bg-primary);
}

/* 商品詳細ページ テキスト色 */
.ec-productRole__title,
.ec-productRole__description,
.ec-productRole__code,
.ec-productRole__category,
.ec-productRole__category a,
.ec-productRole__actions,
.ec-numberInput,
.ec-select {
  color: var(--text-on-dark) !important;
}

.ec-productRole hr {
  border-color: rgba(255,255,255,0.15);
}

.ec-productRole__category a {
  color: var(--accent) !important;
}

/* 商品一覧ページ テキスト色 */
.ec-shelfRole,
.ec-shelfGrid__item .ec-productItemRole__title,
.ec-productItemRole__title a,
.ec-productItemRole__price,
.ec-itemNav__nav a,
.ec-topicpath a,
.ec-topicpath li,
.ec-pageHeader h1,
.ec-shelfRole p {
  color: var(--text-on-dark) !important;
}

/* 商品一覧 テキスト色 */
.ec-topicpath__item a,
.ec-topicpath__item,
.ec-searchnavRole__counter,
.ec-shelfGrid__item a,
.ec-shelfGrid__item .price02-default,
.ec-shelfGrid__item p {
  color: var(--text-on-dark) !important;
}

/* カート・購入フロー テキスト色 */
.ec-cartRole,
.ec-cartRole__totalText,
.ec-cartTable,
.ec-cartTable th,
.ec-cartTable td,
.ec-cartItem__name a,
.ec-cartItem__price,
.ec-cartItem__amountSp,
.ec-orderRole,
.ec-orderRole p,
.ec-orderRole td,
.ec-orderRole th,
.ec-orderAccount p,
.ec-orderDelivery p,
.ec-orderDelivery__item,
.ec-orderPayment p,
.ec-borderedList li,
.ec-totalBox,
.ec-totalBox__price,
.ec-totalBox__taxLabel {
  color: var(--text-on-dark) !important;
}


/* カート・購入フロー：白背景・黒文字 */
.ec-cartRole,
.ec-orderRole {
  background-color: #fff !important;
  color: #333 !important;
}
.ec-cartRole .ec-cartTable,
.ec-cartRole .ec-cartTable th,
.ec-cartRole .ec-cartTable td,
.ec-cartRole .ec-cartItem__name a,
.ec-cartRole .ec-cartItem__price,
.ec-cartRole p,
.ec-orderRole p,
.ec-orderRole td,
.ec-orderRole th,
.ec-totalBox,
.ec-totalBox * {
  color: #333 !important;
  background-color: #fff !important;
}
/* ボタンは色を維持 */
.ec-cartRole .ec-blockBtn--action,
.ec-orderRole .ec-blockBtn--action {
  background-color: #de5d50 !important;
  color: #fff !important;
}
.ec-cartRole .ec-blockBtn--cancel,
.ec-orderRole .ec-blockBtn--cancel {
  background-color: #525263 !important;
  color: #fff !important;
}

/* カート余白調整 */
.ec-cartRole__progress {
  padding-top: 2rem !important;
}
.ec-cartRole__actions {
  padding-bottom: 2rem !important;
}

/* 配送方法ラベル文字色 */
.ec-orderDelivery__title,
.ec-orderDelivery__actions,
.ec-orderDelivery__actions label,
.ec-orderDelivery__actions span,
.ec-orderDelivery__ship,
.ec-orderDelivery__ship label,
.ec-orderDelivery__ship span,
.ec-orderDelivery__item {
  color: #333 !important;
}

/* お問い合わせ下部余白 */
.ec-orderMail {
  padding-bottom: 3rem !important;
}

/* 注文フォーム下部余白 */
.ec-orderRole {
  padding-bottom: 4rem !important;
}

/* SPメニュー不要ブロックを非表示 */
.ec-drawerRole .ec-newItemRole,
.ec-drawerRole .ec-eyecatchRole,
.ec-drawerRole .ec-topicRole,
.ec-drawerRole .ec-headerSearch {
  display: none !important;
}

/* SPメニュー：画像カテゴリーを非表示 */
.ec-drawerRole .ec-categoryRole {
  display: none !important;
}
/* SPメニュー：カテゴリー一覧の文字を黒に */
.ec-drawerRole .ec-itemNav__nav a,
.ec-drawerRole .ec-itemNav li a {
  color: #333 !important;
}



/* 会員登録：ラベルのみ文字色 */
.ec-registerRole label,
.ec-registerRole dt {
  color: var(--text-on-dark) !important;
}

/* 店舗情報・特定商取引法・汎用ページ */
.ec-storeRole dt,
.ec-storeRole dd,
.ec-storeRole p,
.ec-tradeRole dt,
.ec-tradeRole dd,
.ec-tradeRole p,
.ec-tradeRole th,
.ec-tradeRole td,
.ec-contactRole p,
.ec-contactRole label,
.ec-contactRole dt,
.ec-off1Grid p,
.ec-off1Grid h2,
.ec-off1Grid h3,
.ec-off1Grid li {
  color: var(--text-on-dark) !important;
}

/* 当サイトについて・特定商取引法：ラベル文字色 */
.ec-storeRole dt,
.ec-tradeRole dt,
.ec-borderedDefs dt {
  color: var(--text-on-dark) !important;
}

/* 当サイトについて・特定商取引法：内容文字色 */
.ec-storeRole dd,
.ec-storeRole p,
.ec-tradeRole dd,
.ec-tradeRole p,
.ec-borderedDefs dd {
  color: var(--text-on-dark) !important;
}

/* プライバシーポリシー：見出し文字色 */
.ec-off1Grid h2,
.ec-off1Grid h3,
.ec-heading-bold {
  color: var(--text-on-dark) !important;
}

/* 商品詳細：商品名文字色 */
.ec-productRole__title h2 {
  color: var(--text-on-dark) !important;
}

/* レシピ詳細：文字サイズ拡大 */
.hk-rd__ingredient,
.hk-rd__ingredient td,
.hk-rd__step,
.hk-rd__step p,
.hk-rd__body,
.hk-rd__body p {
  font-size: 1.05rem !important;
  line-height: 2 !important;
}
.hk-rd__serving {
  font-size: 1rem !important;
}

/* マイページ：文字色 */
.ec-mypageRole,
.ec-mypageRole p,
.ec-mypageRole td,
.ec-mypageRole th,
.ec-mypageRole dt,
.ec-mypageRole dd,
.ec-mypageRole span,
.ec-mypageRole h2,
.ec-mypageRole h3,
.ec-mypageRole .ec-orderRole__summary {
  color: var(--text-on-dark) !important;
}
.ec-mypageRole .ec-mypage__navItem a {
  color: var(--text-on-dark) !important;
}
.ec-mypageRole .ec-mypage__navItem--active a {
  color: var(--accent) !important;
}

/* マイページ：必須・郵便番号検索の色 */
.ec-mypageRole .ec-required {
  color: #de5d50 !important;
}
.ec-mypageRole .ec-zipInput a,
.ec-mypageRole .ec-zipInputHelp__inner {
  color: var(--text-on-dark) !important;
}

/* 退会ページ */
.ec-withdrawRole,
.ec-withdrawRole p,
.ec-withdrawRole__title,
.ec-withdrawRole__description {
  color: var(--text-on-dark) !important;
}

/* SPドロワー：二十四節気の背景色を適用 */
.ec-drawerRole {
  background-color: var(--bg-primary) !important;
}
.ec-drawerRole .ec-itemNav__nav a,
.ec-drawerRole .ec-itemNav li a,
.ec-drawerRole .ec-headerNav__item a,
.ec-drawerRole a {
  color: var(--text-on-dark) !important;
}
.ec-drawerRole .ec-itemNav,
.ec-drawerRole .ec-itemNav__nav,
.ec-drawerRole .ec-itemNav li,
.ec-drawerRole .ec-itemNav__nav > li,
.ec-drawerRole .ec-headerNav,
.ec-drawerRole .ec-headerNav__item {
  background-color: var(--bg-primary) !important;
  color: var(--text-on-dark) !important;
}
.ec-drawerRole .ec-itemNav li a,
.ec-drawerRole .ec-headerNav__item a {
  color: var(--text-on-dark) !important;
  background-color: transparent !important;
}

/* SPドロワー：ナビ項目の背景色を統一 */
.ec-drawerRole .ec-headerNav,
.ec-drawerRole .ec-headerNav__item {
  background-color: var(--bg-primary) !important;
}
.ec-drawerRole .ec-headerNav__item a,
.ec-drawerRole .ec-headerNav__itemLink {
  color: var(--text-on-dark) !important;
}
/* SPドロワー：新着情報を非表示 */
.ec-drawerRole .ec-newsRole {
  display: none !important;
}

/* SPドロワー：カートを見る〜ホームに戻るの背景色 */
.ec-drawerRole .ec-headerLinkArea,
.ec-drawerRole .ec-headerLink__list,
.ec-drawerRole .ec-headerLink__item {
  background-color: var(--bg-primary) !important;
  color: var(--text-on-dark) !important;
}
.ec-drawerRole .ec-headerLink__item span {
  color: var(--text-on-dark) !important;
}

/* SPドロワー：透過テスト */
.ec-drawerRole {
  opacity: 0.8 !important;
}

/* SPドロワー：カテゴリー一覧ヘッダー背景 */
.ec-headerCategoryArea__heading,
.ec-headerCategoryArea__heading p {
  background-color: var(--bg-primary) !important;
  color: var(--text-on-dark) !important;
}

/* SPドロワー：サブカテゴリートグル */
.ec-catNav__sub { display: none; padding-left: 1rem; }
.ec-catNav__toggle {
  display: flex; align-items: center; justify-content: space-between;
}
.ec-catNav__arrow {
  background: none; border: none; color: var(--text-on-dark);
  font-size: 1.4rem; padding: 0 0.5rem; cursor: pointer;
  transition: transform 0.2s;
}
.ec-catNav__arrow.is-open { transform: rotate(180deg); }

/* SPドロワー：サブカテゴリーインデント */
.ec-catNav__sub li a {
  padding-left: 1.5rem !important;
  font-size: 0.9rem !important;
  opacity: 0.85;
}

/* SPドロワー：仕切り線を非表示 */
.ec-drawerRole .ec-itemNav li,
.ec-drawerRole .ec-headerLink__item,
.ec-drawerRole .ec-catNav__sub li {
  border-bottom: none !important;
  border-top: none !important;
}

/* SPドロワー：カテゴリー上部の仕切り線も非表示 */
.ec-drawerRole .ec-itemNav__nav > li,
.ec-headerCategoryArea__heading {
  border-bottom: none !important;
  border-top: none !important;
}

/* SPドロワー：全仕切り線を強制削除 */
.ec-drawerRole *,
.ec-drawerRole li,
.ec-drawerRole a,
.ec-drawerRole ul {
  border: none !important;
  border-bottom: none !important;
  border-top: none !important;
}

/* ヘッダーロゴ中央寄せ */
.ec-headerRole {
  text-align: center;
}
.ec-headerTitle__title h1 a {
  justify-content: center;
}

/* ヘッダーロゴ：中央揃え強制 */
.ec-headerRole__title {
  display: flex !important;
  justify-content: center !important;
}

/* 送料タブ */
.stab-radio{display:none}
.stab-label{display:inline-block;padding:6px 16px;cursor:pointer;border:1px solid rgba(255,255,255,0.3);margin-right:4px;opacity:0.6}
.stab-radio:checked+.stab-label{opacity:1;background:rgba(255,255,255,0.15)}
.spanel{display:none}
#tab1:checked~#panel1,#tab2:checked~#panel2{display:block}

/* 送料テーブル */
.shipping-table{width:100%;border-collapse:collapse;font-size:.9rem;margin:8px 0 20px}
.shipping-table th,.shipping-table td{border:1px solid rgba(255,255,255,0.25);padding:6px 8px}
.shipping-table th{background:rgba(255,255,255,0.12);text-align:left}
.shipping-table td:last-child{text-align:right}
.shipping-table tr:nth-child(even){background:rgba(255,255,255,0.05)}

/* 送料タブボタン */
.shipping-tab-btn{display:inline-block;padding:6px 16px;margin-right:4px;border:1px solid rgba(255,255,255,0.3);opacity:0.6;text-decoration:none;color:inherit;cursor:pointer}
.shipping-tab-btn.is-active{opacity:1;background:rgba(255,255,255,0.15)}
