/**
 * SophiaDesign Elegant Commerce - 最終エレガントタイポグラフィ
 * Final Elegant Typography
 *
 * フォント構成:
 * - 見出し: Tangerine (筆記体)
 * - 本文: Raleway (サンセリフ)
 * - 数字: Lora (セリフ体・エレガント)
 *
 * 配置場所: /wp-content/plugins/SophiaDesign Elegant Commerce/assets/css/final-elegant-typography.css
 */

/* ===================================
   Google Fonts 読み込み
   =================================== */

@import url('https://fonts.googleapis.com/css2?family=Tangerine:wght@400;700&family=Raleway:wght@300;400;500;600;700&family=Lora:wght@400;500;600;700&family=Noto+Sans+JP:wght@300;400;500;600;700&family=Noto+Serif+JP:wght@400;500;600;700&display=swap');

/* ===================================
   見出し - Tangerine（エレガント筆記体）
   =================================== */

/* 商品タイトル（最強優先度） */
body .sdec-mist-title,
body .sdec-book-title,
body .sdec-mist-info h2,
body .sdec-mist-card h3,
body .sdec-book-card h3,
html body .sdec-mist-title,
html body .sdec-book-title,
html body .sdec-mist-info h2,
html body .sdec-mist-card h3,
html body .sdec-book-card h3 {
    font-family: 'Tangerine', 'Noto Serif JP', cursive !important;
    font-weight: 700 !important;
    font-size: 2.2rem !important;
    letter-spacing: 0.5px !important;
    line-height: 1.3 !important;
    color: #2d3748 !important;
}

/* セクション見出し（最強優先度） */
body h1, body h2, body h3, body h4, body h5, body h6,
html body h1, html body h2, html body h3, html body h4, html body h5, html body h6 {
    font-family: 'Tangerine', 'Noto Serif JP', cursive !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    color: #2d3748 !important;
}

h1 {
    font-size: 3rem !important;
}

h2 {
    font-size: 2.5rem !important;
}

h3 {
    font-size: 2rem !important;
}

h4 {
    font-size: 1.8rem !important;
}

h5 {
    font-size: 1.5rem !important;
}

h6 {
    font-size: 1.3rem !important;
}

/* 購入オプション見出し */
.sdec-form-section h3 {
    font-family: 'Tangerine', 'Noto Serif JP', cursive !important;
    font-weight: 700 !important;
    font-size: 2rem !important;
}

/* 香りのノート見出し */
.sdec-mist-notes-detail h4 {
    font-family: 'Tangerine', 'Noto Serif JP', cursive !important;
    font-weight: 700 !important;
    font-size: 1.8rem !important;
    color: #C4975C !important;
}

/* 合計金額見出し */
.sdec-total-price h3 {
    font-family: 'Tangerine', 'Noto Serif JP', cursive !important;
    font-weight: 700 !important;
    font-size: 1.8rem !important;
}

/* ギャラリータイトル */
.sdec-mist-gallery-title {
    font-family: 'Tangerine', 'Noto Serif JP', cursive !important;
    font-weight: 700 !important;
    font-size: 3.2rem !important;
}

/* ===================================
   本文 - Raleway（読みやすいサンセリフ）
   =================================== */

/* 基本テキスト */
body,
p,
div,
span,
li,
a {
    font-family: 'Raleway', 'Noto Sans JP', sans-serif !important;
    font-weight: 400 !important;
    letter-spacing: 0.3px !important;
}

/* 説明文 */
.sdec-mist-description,
.sdec-mist-description p,
.sdec-option-description {
    font-family: 'Raleway', 'Noto Sans JP', sans-serif !important;
    font-weight: 400 !important;
    font-size: 1rem !important;
    line-height: 1.8 !important;
    letter-spacing: 0.3px !important;
}

/* 香りのノート成分 */
.sdec-mist-note-item,
.sdec-mist-note-item *,
.sdec-mist-notes,
.sdec-mist-note-group {
    font-family: 'Raleway', 'Noto Sans JP', sans-serif !important;
    font-weight: 400 !important;
    font-size: 0.95rem !important;
    line-height: 1.8 !important;
    letter-spacing: 0.4px !important;
}

/* ノートラベル（トップノート:、ミドルノート: など） */
.sdec-mist-note-item strong,
.sdec-mist-notes-detail strong,
.sdec-mist-note-label {
    font-family: 'Raleway', 'Noto Sans JP', sans-serif !important;
    font-weight: 700 !important;
    font-size: 0.85rem !important;
    letter-spacing: 1.2px !important;
    text-transform: uppercase !important;
}

/* オプションラベル */
.sdec-option-label {
    font-family: 'Raleway', 'Noto Sans JP', sans-serif !important;
    font-weight: 600 !important;
    font-size: 1.1rem !important;
    letter-spacing: 0.5px !important;
}

/* ボタンテキスト */
.sdec-add-to-cart-btn,
.sdec-mist-button,
button,
.button {
    font-family: 'Raleway', 'Noto Sans JP', sans-serif !important;
    font-weight: 700 !important;
    letter-spacing: 1.2px !important;
}

/* ===================================
   数字 - Lora（エレガントなセリフ体）
   =================================== */

/* 価格表示 */
.sdec-option-price,
.sdec-option-price *,
.sdec-total-price-value,
.sdec-total-price-value *,
.sdec-mist-price-value,
.sdec-mist-price-value *,
.sdec-book-price-value,
.sdec-book-price-value * {
    font-family: 'Lora', 'Noto Serif JP', serif !important;
    font-weight: 600 !important;
    letter-spacing: 0.5px !important;
    font-variant-numeric: lining-nums !important;
}

/* 購入オプションの価格 */
.sdec-option-price {
    font-size: 1.5rem !important;
}

/* 合計金額 */
.sdec-total-price-value,
#sdec-total-price-display {
    font-size: 2.5rem !important;
}

/* ギャラリーの価格 */
.sdec-mist-price-value {
    font-size: 1.5rem !important;
}

/* 数量入力 */
#sdec-quantity,
input#sdec-quantity,
input[type="number"] {
    font-family: 'Lora', 'Noto Serif JP', serif !important;
    font-weight: 600 !important;
    font-size: 1.3rem !important;
}

/* 数量入力スピナーを表示 */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    opacity: 1 !important;
    -webkit-appearance: auto !important;
    appearance: auto !important;
}

/* カート内の価格 */
.amount,
.woocommerce-Price-amount,
.woocommerce-Price-amount *,
bdi {
    font-family: 'Lora', 'Noto Serif JP', serif !important;
    font-weight: 600 !important;
}

/* 通貨記号（¥） */
.woocommerce-Price-currencySymbol {
    font-family: 'Lora', 'Noto Serif JP', serif !important;
}

/* 容量表示の数字部分（15ML, 100ml） */
.sdec-mist-volume {
    font-family: 'Lora', 'Noto Serif JP', serif !important;
    font-weight: 500 !important;
    font-size: 0.95rem !important;
}

/* ムエット価格 */
.sdec-mouillette-price,
.sdec-mouillette-total {
    font-family: 'Lora', 'Noto Serif JP', serif !important;
    font-weight: 600 !important;
}

/* カート合計 */
.order-total .amount,
.cart-subtotal .amount {
    font-family: 'Lora', 'Noto Serif JP', serif !important;
    font-weight: 700 !important;
}

/* ===================================
   特殊要素
   =================================== */

/* サイト名 - Tangerine エレガント筆記体（最強優先度） */
body .site-title,
body .site-title a,
body .site-branding .site-title,
body .site-branding .site-title a,
body header .site-title,
body header .site-title a,
html body .site-title,
html body .site-title a {
    font-family: 'Tangerine', 'Noto Serif JP', cursive !important;
    font-weight: 700 !important;
    font-size: 3.5rem !important;
    letter-spacing: 2px !important;
    background: linear-gradient(135deg, #C4975C 0%, #E8C99B 50%, #C4975C 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
    text-shadow: 0 2px 8px rgba(196, 151, 92, 0.2) !important;
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1) !important;
    display: inline-block !important;
}

/* サイト名 ホバー効果 - エレガントな輝き */
.site-title a:hover,
.site-branding .site-title a:hover,
header .site-title a:hover {
    background: linear-gradient(135deg, #D4AF37 0%, #F4E4C1 50%, #C4975C 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
    text-shadow: 0 4px 16px rgba(212, 175, 55, 0.4) !important;
    letter-spacing: 3px !important;
    transform: translateY(-2px) !important;
}

/* メニュー */
.site-navigation a,
.main-navigation a,
nav a {
    font-family: 'Raleway', 'Noto Sans JP', sans-serif !important;
    font-weight: 500 !important;
    font-size: 0.95rem !important;
    letter-spacing: 1.2px !important;
    text-transform: uppercase !important;
}

/* ===================================
   レスポンシブ調整
   =================================== */

@media (max-width: 768px) {
    .sdec-mist-title,
    .sdec-book-title {
        font-size: 2.5rem !important;
    }

    h1 {
        font-size: 3rem !important;
    }

    h2 {
        font-size: 2.8rem !important;
    }

    h3 {
        font-size: 2.5rem !important;
    }

    .sdec-total-price-value {
        font-size: 2.5rem !important;
    }

    .sdec-option-price {
        font-size: 1.3rem !important;
    }

    .site-title a {
        font-size: 2.8rem !important;
    }
}

@media (max-width: 480px) {
    .sdec-mist-title,
    .sdec-book-title {
        font-size: 2rem !important;
    }

    h1 {
        font-size: 2.5rem !important;
    }

    h2 {
        font-size: 2.2rem !important;
    }

    .sdec-total-price-value {
        font-size: 2rem !important;
    }

    .site-title a {
        font-size: 2.2rem !important;
    }
}

/* ===================================
   数字の完全強制適用（Lora）
   =================================== */

/* すべての価格関連要素 */
[class*="price"],
[class*="amount"],
[class*="total"],
[class*="Price"] {
    font-family: 'Lora', 'Noto Serif JP', serif !important;
}

/* 価格内のすべてのspan */
[class*="price"] span,
[class*="amount"] span,
[class*="total"] span,
[class*="Price"] span {
    font-family: 'Lora', 'Noto Serif JP', serif !important;
}

/* 数字を含む可能性のある要素を強制 */
.sdec-mist-price *,
.sdec-option-price *,
.sdec-total-price *,
.sdec-mist-price-value *,
.sdec-book-price-value *,
.amount *,
bdi * {
    font-family: 'Lora', 'Noto Serif JP', serif !important;
}

/* 具体的な要素を個別指定 */
span.sdec-option-price,
div.sdec-option-price,
span.sdec-mist-price-value,
div.sdec-mist-price-value,
span.sdec-total-price-value,
div.sdec-total-price-value {
    font-family: 'Lora', 'Noto Serif JP', serif !important;
}

/* WooCommerce価格 */
.woocommerce .amount,
.woocommerce .price,
.woocommerce-Price-amount.amount,
.woocommerce-Price-amount.amount bdi,
.woocommerce-Price-amount span,
.price span.amount,
.price .woocommerce-Price-amount {
    font-family: 'Lora', 'Noto Serif JP', serif !important;
}

/* カート内 */
.cart_totals .amount,
.cart_totals span,
.order-total .amount,
.cart-subtotal .amount {
    font-family: 'Lora', 'Noto Serif JP', serif !important;
}

/* ===================================
   フォントレンダリング最適化
   =================================== */

* {
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
    text-rendering: optimizeLegibility !important;
}