/*
Theme Name: CLIP WEB PRETHEME2026
Theme URI: https://clip-web.com
Description: 小規模企業向け伴走支援型Web制作会社「クリップ」のオリジナルテーマ
Author: WEB制作 クリップ
Version: 1.0.0
*/

/* * Tailwind CSSを使用しているため、ここには独自のスタイル定義は最小限に留めます。
 * 基本的なスタイリングはHTMLクラス内で行っています。
 */

/* WordPress特有のクラス調整（必要に応じて追記） */
.aligncenter {
    display: block;
    margin: 0 auto;
}
.alignleft {
    float: left;
    margin-right: 1.5em;
}
.alignright {
    float: right;
    margin-left: 1.5em;
}

/* 投稿本文（.post-content）のスタイル調整 */
/* TailwindのリセットCSSで失われる余白やリストスタイルを再定義します */
.post-content p {
    margin-bottom: 1.75em; /* 段落の下に余白を追加 */
    line-height: 1.8;
}

.post-content h2 {
    margin-top: 3em;
    margin-bottom: 1.5em;
    font-size: 1.5rem;
    font-weight: 700;
    color: #2C3E50; /* brand-navy */
    border-bottom: 2px solid #E67E22; /* brand-orange */
    padding-bottom: 0.5rem;
}

.post-content h3 {
    margin-top: 2.5em;
    margin-bottom: 1.25em;
    font-size: 1.25rem;
    font-weight: 700;
    color: #2C3E50;
    border-left: 4px solid #2C3E50;
    padding-left: 1rem;
}

.post-content h4 {
    margin-top: 2em;
    margin-bottom: 1em;
    font-size: 1.1rem;
    font-weight: 700;
    color: #2C3E50;
}

.post-content ul, 
.post-content ol {
    margin-bottom: 1.75em;
    padding-left: 1.5em;
}

.post-content ul {
    list-style-type: disc;
}

.post-content ol {
    list-style-type: decimal;
}

.post-content li {
    margin-bottom: 0.5em;
}

.post-content img {
    margin: 2em 0;
    max-width: 100%;
    height: auto;
    border-radius: 0.5rem;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
}

.post-content blockquote {
    margin: 2em 0;
    padding: 1.5em;
    border-left: 4px solid #E67E22;
    background-color: #FFF3E0; /* brand-lightOrange */
    color: #333;
    font-style: italic;
}

/* 水平線のスタイル（追加） */
.post-content hr {
    margin-top: 2.5em;
    margin-bottom: 2.5em;
    border: none;
    border-top: 1px solid #E2E8F0; /* 薄いグレー */
}

/* リンクのスタイル */
.post-content a {
    color: #E67E22;
    text-decoration: underline;
    transition: opacity 0.3s;
}
.post-content a:hover {
    opacity: 0.8;
    text-decoration: none;
}

/* ボックス内などで最後の要素の余白を打ち消す設定 */
/* これにより、枠線付きエリア内の最後の段落下の余白がなくなり、上下バランスが整います */
.post-content > *:last-child {
    margin-bottom: 0;
}

/* =========================================
   WordPress ブロックエディタのボタンスタイル調整
   ========================================= */
.wp-block-button__link {
    background-color: #E67E22 !important; /* brand-orange */
    color: #ffffff !important;
    border-radius: 9999px !important; /* full rounded */
    padding: 0.75rem 2rem !important; /* py-3 px-8 相当 */
    font-weight: 700 !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
    border: none !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important; /* shadow-md */
}

.wp-block-button__link:hover {
    opacity: 0.9 !important;
    transform: translateY(-2px); /* hover:-translate-y-0.5 */
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important; /* shadow-lg */
}

/* アウトラインスタイルのボタン（is-style-outline） */
.is-style-outline .wp-block-button__link {
    background-color: transparent !important;
    color: #2C3E50 !important; /* brand-navy */
    border: 2px solid #2C3E50 !important;
    box-shadow: none !important;
}

.is-style-outline .wp-block-button__link:hover {
    background-color: #2C3E50 !important;
    color: #ffffff !important;
    opacity: 1 !important;
}


/* =========================================
   要素ごとの調整用ユーティリティクラス
   ブロックエディタの「追加CSSクラス」に入力して使用
   ========================================= */

/* 線を消す */
.u-no-border {
    border: none !important;
}

/* 上の余白（マージン）をなくす */
/* !important をつけても space-y などの詳細度には勝てない場合があるため、
   space-y を打ち消す専用クラスを用意します */
.u-mt-0 {
    margin-top: 0 !important;
}

/* 下の余白（マージン）をなくす */
.u-mb-0 {
    margin-bottom: 0 !important;
}

/* 上の余白（パディング）をなくす */
.u-pt-0 {
    padding-top: 0 !important;
}

/* 下の余白（パディング）をなくす */
.u-pb-0 {
    padding-bottom: 0 !important;
}

/* 左の余白（パディング）をなくす */
.u-pl-0 {
    padding-left: 0 !important;
}

/* 背景色を白にする（背景グレーのセクション内などで使用） */
.u-bg-white {
    background-color: #ffffff !important;
}

/* 強制的に幅を100%にする */
.u-w-full {
    width: 100% !important;
    max-width: 100% !important;
}

/* =========================================
   space-y (Stack) 打ち消し・調整用クラス
   ========================================= */

/* 親要素に指定：子要素間の margin-top (space-y) を強制的に0にする */
.u-space-y-0 > :not([hidden]) ~ :not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-top: 0 !important;
    margin-bottom: 0 !important; /* 念のため上下とも消す */
}

/* 親要素に指定：最後の要素の margin-bottom を強制的に0にする */
/* 枠内の最後の余白を消したい場合に有効 */
.u-last-mb-0 > *:last-child {
    margin-bottom: 0 !important;
}