@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');

/* ============================================
   記事本文のスタイル設定（post-content.css が参照）
   --------------------------------------------
   値は公開サイトの assets/css/styles.css に合わせています。
   ここを変更すると管理画面のエディタと公開ページの
   両方に同時に反映されます。
   ============================================ */
:root {
    /* 基本タイポグラフィ（styles.css の body と同じ値） */
    --post-font-family: 'Noto Sans JP', sans-serif;
    --post-font-size: 18px;
    --post-line-height: 2;
    --post-font-weight: 400;
    --post-text-color: #242424;
    --post-letter-spacing: 0.05em;
    --post-font-feature-settings: "palt";

    /* 見出し（リセットCSSにより太字にならないため本文と同じ太さを継承） */
    --post-heading-font-weight: inherit;

    /* 段落が続く場合の間隔 */
    --post-paragraph-gap: 1em;

    /* 段落の行間（post_style.css / procurement/style.css と同じ値）
       本文全体の行間（--post-line-height）とは別に、
       リンクを含まない段落だけこの値になります */
    --post-paragraph-line-height: 1.5;

    /* PDF / Word へのリンク（styles.css の .post-content-body と同じ値）
       相対パスは管理画面と公開ページで解決先が変わるため絶対パスで指定する */
    --post-file-link-color: #242424;
    --post-file-icon-pdf: url('/assets/images/icon-pdf.png');
    --post-file-icon-docx: url('/assets/images/icon-word.png');
}
/*
 * サイト別カスタマイズ用スタイル
 *
 * このファイルはサイトごとにカスタマイズするスタイルを定義します。
 * 主にフロントエンド（プレビュー画面や公開ページ）で使用されるボタンの見た目などを
 * サイトのデザインに合わせて編集してください。
 *
 * カスタマイズ方法:
 * php artisan vendor:publish --tag=artcms-site-css
 * でpublish後、public/customize/css/site-parts.css を編集してください。
 */

/* ============================================
   リンクボタン・モーダルボタンの見た目は
   customize/css/post-content.css に移動しました。
   サイトごとの調整は上部の --post-button-* 変数で行ってください。
   ============================================ */

/* ============================================
   段落の行間（サイト固有の慣習）
   --------------------------------------------
   公開ページでは post_style.css（お知らせ・採用情報）と
   procurement/style.css（調達情報）が、リンクを含まない段落だけ
   line-height を 1.5 に落としています。
   リンクを含む段落は本文の行間（--post-line-height）のままです。

   管理画面ではこれらを読み込まないため、同じ条件をここに定義して
   本文領域の 3 面（公開 / プレビュー / エディタ）を揃えます。
   ============================================ */
:is(.post-content, .ql-editor, .ql-bubble .ql-editor, .trumbowyg-editor) p:not(:has(a)) {
    line-height: var(--post-paragraph-line-height, 1.5);
}

/* ============================================
   本文内 PDF / Word リンクの見た目（サイト固有の慣習）
   --------------------------------------------
   公開ページでは styles.css が .post-content-body /
   .procurement-content-body 配下の PDF・docx リンクを
   「本文色・下線なし・右端にファイル種別アイコン」で表示しています。
   管理画面では styles.css を読み込まないため、同じ見た目を
   本文領域の 3 面（公開 / プレビュー / エディタ）に定義します。

   相対パスはページの URL を基準に解決され、管理画面と公開ページで
   解決先が変わってしまうため、必ず絶対パスで指定してください。
   ============================================ */
:is(.post-content, .ql-editor, .ql-bubble .ql-editor, .trumbowyg-editor)
a:not(.ql-link-button, .ql-modal-button):is([href$=".pdf"], [href$=".docx"]) {
    display: inline-block;
    padding-right: 2rem;
    color: var(--post-file-link-color, #242424);
    text-decoration: none;
    background-size: 1.5rem;
    background-repeat: no-repeat;
    background-position: right 0 center;
}

:is(.post-content, .ql-editor, .ql-bubble .ql-editor, .trumbowyg-editor)
a:not(.ql-link-button, .ql-modal-button)[href$=".pdf"] {
    background-image: var(--post-file-icon-pdf, url('/assets/images/icon-pdf.png'));
}

:is(.post-content, .ql-editor, .ql-bubble .ql-editor, .trumbowyg-editor)
a:not(.ql-link-button, .ql-modal-button)[href$=".docx"] {
    background-image: var(--post-file-icon-docx, url('/assets/images/icon-word.png'));
}

:is(.post-content, .ql-editor, .ql-bubble .ql-editor, .trumbowyg-editor)
a:not(.ql-link-button, .ql-modal-button):is([href$=".pdf"], [href$=".docx"]):hover {
    opacity: 0.6;
}

/* Quill のバブルテーマは本文中のリンクすべてに吹き出し用の ::before / ::after を
   持つため、アイコン表示の妨げにならないよう打ち消します。 */
:is(.ql-editor, .ql-bubble .ql-editor)
a:not(.ql-link-button, .ql-modal-button):is([href$=".pdf"], [href$=".docx"])::before,
:is(.ql-editor, .ql-bubble .ql-editor)
a:not(.ql-link-button, .ql-modal-button):is([href$=".pdf"], [href$=".docx"])::after {
    content: none;
}