/*!
Theme Name: hmr_helena_2026
Theme URI:
Author: HMR
Author URI:
Description: 日本語サイト向けのハイブリッド構成テーマ。theme.json とブロックエディタに対応しつつ、header.php / footer.php などの従来のテンプレート階層を維持する。
Version: 1.2.0
Requires at least: 6.6
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: hmr_helena_2026
Tags: block-styles, custom-logo, custom-menu, editor-style, featured-images, translation-ready, wide-blocks
*/

/* 幅広ブロックに幅広コンテンツ幅を指定 
 * 幅広のサイズは、1680pxにする。 
 * メディアクエリで、カスタム変数が使えないから、--wp--style--global--wide-size 
 */
@media screen and (min-width: 1680px) {
  #contents-container .alignwide {
    width: 1680px;
    margin-left: 50%;
    transform: translateX(-840px);
  }
}


/* 全幅ブロックに全幅コンテンツ幅を指定 
 * 100vwだと、スクロールバーの分隠れてしまうので、少し小さくする
 */
#main-contents>*.alignfull {
  width: 98vw;
  margin-left: 50%;
  transform: translateX(-50%);
}

/* グループブロックの中のブロックを全幅に対応させる。
 * 「コンテント幅を使用するインナーブロック」を有効にするため、
 * max-widthはデフォルトにする
 */
body #main-contents .is-layout-constrained> :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
  width: 100%;
  /*  max-width: none;*/
}

/* 画像　中央・左・右寄せ */
body #main-contents figure.alignleft {
  float: left;
  margin-inline-start: 0;
  margin-inline-end: 2em;
}

body #main-contents figure.alignright {
  float: right;
  margin-inline-start: 2em;
  margin-inline-end: 0;
}

body #main-contents figure.aligncenter:where(:not(.alignleft):not(.alignright):not(.alignfull)) {
  max-width: 1540px;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* スクリーンリーダー用テキスト
 * WordPressコアやプラグインが出力するマークアップ
 * （the_posts_navigation() / wp_list_comments() / comment_form() /
 *   get_search_form() / WP-PageNavi など）も .screen-reader-text を使うため、
 * テーマ側で定義して保証する。
 *
 * 同名ルールはコアの wp-block-library にも含まれるが、
 * wp_dequeue_style('wp-block-library') や高速化プラグインの
 * 未使用CSS削除で消えるため、そちらには依存しない。
 *
 * ※ .sr-only / .sr-only-focusable は css/style_design.css で別途定義。
 *    用途が異なるため統合しない。
 */
.screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  border: 0;
  clip-path: inset(50%);
  word-wrap: normal !important;
}

/* フォーカスされたときだけ表示する */
.screen-reader-text:focus {
  z-index: 100000;
  top: 5px;
  left: 5px;
  display: block;
  width: auto;
  height: auto;
  margin: 0;
  padding: 15px 23px 14px;
  overflow: visible;
  clip-path: none;
  font-size: 1em;
  line-height: normal;
  color: #444;
  background-color: #ddd;
  text-decoration: none;
}

/* スキップリンク（header.php で .screen-reader-text と併用）
 * 非表示とフォーカス時の表示は上の .screen-reader-text に任せ、
 * ここでは配色など見た目だけを上書きする。
 * 詳細度が同じ (0,2,0) のため、必ず .screen-reader-text:focus より後に置くこと。
 */
.skip-link:focus {
  color: #21251F;
  background-color: #F6F2EC;
  border: 1px solid #21251F;
  border-radius: 3px;
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.3);
}


/* 余白調整 */
/* .entry-content {
  padding-left: var(--wp--custom--gutter);
  padding-right: var(--wp--custom--gutter);
}

.entry-content>*.alignfull {
  margin-left: calc(var(--wp--custom--gutter) * -1);
  margin-right: calc(var(--wp--custom--gutter) * -1);
}
 */