/*
 * 共通コンポーネントCSS（ボタン・カード・モーダル等）。
 * 02〜11ページ（ネイビー・ゴールドテーマ）の <style> 内で85〜90%重複していたルールを集約。
 * トップページ（editorial テーマ）専用のスタイルは assets/css/pages/top.css 側に置く。
 */

/* 万年筆カーソル（ホットスポットはペン先・左下） */
:root {
    --cursor-pen: url('/assets/images/3d-pen.svg') 1 23, auto;
}

html {
    cursor: var(--cursor-pen);
}

a,
button,
label,
select,
summary,
[role="button"],
input[type="checkbox"],
input[type="radio"],
input[type="submit"],
input[type="button"],
input[type="reset"],
.cursor-pointer {
    cursor: var(--cursor-pen);
}

input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="reset"]),
textarea,
[contenteditable="true"] {
    cursor: text;
}

[disabled],
.cursor-not-allowed {
    cursor: not-allowed;
}

body {
    background-color: #FAF7F0;
    color: #17202A;
    font-family: "Noto Sans JP", sans-serif;
    -webkit-font-smoothing: antialiased;
}

/* Section Accent Divider Line */
.gold-line-after::after {
    content: "";
    display: block;
    width: 48px;
    height: 1px;
    margin-top: 12px;
    background: #B9944B;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
::-webkit-scrollbar-track {
    background: #FAF7F0;
}
::-webkit-scrollbar-thumb {
    background: #B9944B;
    border-radius: 3px;
}

/* Custom Checkbox Styling */
input[type="checkbox"] {
    accent-color: #0B1828;
}

/* Buttons Transition */
.btn-navy-primary {
    background-color: #0B1828;
    color: #FAF7F0;
    border: 1px solid #0B1828;
    transition: all 0.25s ease;
}
/* <a> はデフォルト inline のため py-* が行ボックスに乗り本文と重なる。button 相当にする */
a.btn-navy-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.btn-navy-primary:hover {
    background-color: #B9944B;
    border-color: #B9944B;
    color: #07111F;
    transform: translateY(-1px);
}

.btn-gold-secondary {
    background-color: transparent;
    color: #0B1828;
    border: 1px solid #B9944B;
    transition: all 0.25s ease;
}
.btn-gold-secondary:hover {
    background-color: rgba(185, 148, 75, 0.12);
}

/* サイドバー付き記事ページ（利用ガイド・特定商取引法など）のスクロール連動ハイライト */
.sidebar-link.active {
    color: #B9944B;
    font-weight: 700;
    border-left: 3px solid #B9944B;
    padding-left: 0.75rem;
    background-color: #FAF7F0;
}

.sticky-nav-offset {
    scroll-margin-top: 100px;
}

/* 商品詳細ページ: カラースウォッチ選択ボタン */
.color-swatch-btn span:first-child {
    transition: all 0.2s ease;
}
.color-swatch-btn:hover span:first-child {
    transform: scale(1.08);
}
.color-swatch-btn.active span:last-child {
    color: #0B1828;
    font-weight: 700;
}

/* 商品詳細: 現在の色で取れない字幅 */
.variant-option-btn.variant-unavailable {
    opacity: 0.45;
    cursor: not-allowed;
    pointer-events: none;
}
.variant-option-btn.variant-unavailable .variant-unavailable-label {
    text-decoration: line-through;
}