@charset "UTF-8";
/* =============================================================
   公開ヘッダー(.t-siteHeader.wp-header)とアクセシビリティ・ツールバー
   ※ tailwind.css の preflight と管理画面CSS(mase_fuc_get_css)より後に読み込むこと。
     読み込みは partial/_head_tailwind.html.twig。
   ============================================================= */
/* --- モック準拠のヘッダー/ハンバーガー色 上書き(紺に統一) ---
   Teal公開ヘッダー(.wp-header)限定にスコープする。素の .t-siteHeader.close だと
   backend管理画面ヘッダー(=.wp-header 無し)の box-shadow まで消してしまう(デグレ)。 */
.t-siteHeader.wp-header.close {
    box-shadow: none;
    border-bottom: 1px solid #e5e7eb;
}
/* ハンバーガーの装飾/挙動は白背景ヘッダー(.wp-header)が対象。
   管理画面(/add 配下)も同じヘッダーを使うので、これ1つで両方に効く。
   PC でも常時表示にする(ログアウト等の導線をPCから辿れるようにするため)。 */
/* ハンバーガーボタン(モック準拠): 背景の四角なし・ラインは紺。タップ領域は確保し中央配置 */
.t-siteHeader.wp-header .overlayMenuOpenClose {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    font-size: 1.75rem; /* ☰ / ✕ のラインを大きめに */
    line-height: 1;
    background-color: transparent;
}
/* mase.css の ::before{width:2em} を打ち消し、中央に正確に配置 */
.t-siteHeader.wp-header .overlayMenuOpenClose::before {
    width: auto;
}
/* ハンバーガーは PC でも表示する(ログアウト等の導線をPCから辿れるようにするため)。
   PCはフルナビの右端、モバイルは従来どおり。 */
/* モック準拠: 開閉とも背景の四角なし・ラインは紺(ヘッダーは白なので✕も視認可) */
.t-siteHeader.wp-header .overlayMenuOpenClose:is(.close *),
.t-siteHeader.wp-header .overlayMenuOpenClose:is(.open *) {
    background-color: transparent;
    color: #102a43; /* primary-700 = 紺のライン */
}
/* ドロワーを開くと mase が .t-siteHeader.open で文字色を薄いグレー(--color-gray-light)に
   する(暗い全画面オーバーレイ前提の既定)。公開ヘッダーは開いていても白背景のままなので、
   ユーザー名など色指定の無い文字が読めなくなる。閉じている時と同じ既定色を維持する。 */
.t-siteHeader.wp-header.open {
    color: var(--initial-color, #262626);
}


/* --- 文字サイズ「大」時、デスクトップヘッダーを1行に収める(改行/見切れ防止) ---
   文字は拡大したまま(アクセシビリティ維持)、余白/ボタンpaddingのみ px 固定で詰める。
   通常サイズ(wp-font-lg 無し)には一切影響しない。 */
@media (min-width: 1024px) {
    /* ロゴは拡大しなくても視認性に影響しないため、大の時だけ高さを px 固定で抑える(最大の横幅削減) */
    html.wp-font-lg .t-siteHeader.wp-header img { height: 44px; }
    html.wp-font-lg .t-siteHeader.wp-header nav { column-gap: 14px; }
    html.wp-font-lg .t-siteHeader.wp-header .wp-header-actions { column-gap: 10px; }
    html.wp-font-lg .t-siteHeader.wp-header .wp-header-actions > div { column-gap: 8px; }
    html.wp-font-lg .t-siteHeader.wp-header .wp-header-actions .rounded-full { padding-left: 12px; padding-right: 12px; }
    html.wp-font-lg .t-siteHeader.wp-header .wp-header-actions .border-r { padding-right: 10px; }
}

/* --- 1024〜1279px でデスクトップヘッダーを1行に収める(改行防止) ---
   この帯域は Tailwind の .container が 1024px 固定(内寸 992px)なのに対し、
   ロゴ191 + ナビ475 + アクション311 + ハンバーガー44 + gap で 1044px 必要になり
   「ログイン / 企業登録 / 求職者登録」が2行目に落ちていた。
   項目は減らさず、余白・文字サイズ・ロゴ高さだけを px で詰めて収める
   (1280px 以上は内寸1248pxで余裕があるため従来どおり)。 */
@media (min-width: 1024px) and (max-width: 1279px) {
    .t-siteHeader.wp-header img { height: 40px; }
    .t-siteHeader.wp-header nav { column-gap: 12px; font-size: .9375rem; }
    .t-siteHeader.wp-header .wp-header-actions { column-gap: 10px; }
    .t-siteHeader.wp-header .wp-header-actions > div { column-gap: 6px; }
    .t-siteHeader.wp-header .wp-header-actions .rounded-full { padding-left: 12px; padding-right: 12px; }
    .t-siteHeader.wp-header .wp-header-actions .border-r { padding-right: 10px; }

    /* 文字サイズ「大」だと上の詰めだけでは収まらない(必要幅が約1.25倍=約1300px)。
       この帯域に限りナビを畳み、ロゴ+アクション+ハンバーガーの1行にする。
       ナビ項目はハンバーガーのドロワーに全て入っているので導線は失われない。 */
    html.wp-font-lg .t-siteHeader.wp-header nav { display: none; }
}

/* --- アクセシビリティ・ツールバー: モック(index3)準拠の高さに合わせる ---
   mase.css の button 既定の行高/固定高さ/余白を打ち消し、モックと同じ
   py-0.5(padding .125rem) + text-xs の行高(1rem) にする(バー高≒38px)。 */
.wp-a11y-bar button { height: auto; min-height: 0; line-height: 1rem; padding-top: .125rem; padding-bottom: .125rem; }
.wp-a11y-bar span { line-height: 1rem; }