/* =========================================
   GW Column — フロントエンド CSS
   ベースカラー: #076951（Blocksy --theme-palette-color-1）
   ========================================= */

/* ===== フォーム共通スタイル ===== */
.gw-column-form { max-width: 800px; margin: 0 auto; }
.gw-column-form .gw-field-group { margin-bottom: 24px; }
.gw-column-form .gw-label {
    font-size: 1.05em !important;
    font-weight: 700 !important;
    color: #333 !important;
    margin-bottom: 8px !important;
    display: block;
}
.gw-column-form .gw-input,
.gw-column-form .gw-textarea,
.gw-column-form .gw-select {
    font-size: 16px !important;
    padding: 12px !important;
    border-radius: 8px !important;
    border: 1px solid #ccc !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    background-color: #fafafa !important;
    line-height: 1.5 !important;
    -webkit-appearance: none;
}
.gw-column-form .gw-select { min-height: 48px !important; }
.gw-column-form .gw-input:focus,
.gw-column-form .gw-textarea:focus,
.gw-column-form .gw-select:focus {
    outline: none !important;
    border-color: var(--theme-palette-color-1, #076951) !important;
    background-color: #fff !important;
}
.gw-column-form-submit { text-align: center !important; margin-top: 36px !important; }
.gw-column-form-submit .gw-confirm-btn,
.gw-preview-actions .gw-submit-btn {
    background-color: var(--theme-palette-color-1, #076951) !important;
    color: #fff !important;
    border: none !important;
    cursor: pointer !important;
    font-weight: 700 !important;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1) !important;
    transition: all 0.2s ease !important;
    padding: 15px 40px !important;
    font-size: 1.1em !important;
    border-radius: 30px !important;
    display: inline-block !important;
    -webkit-appearance: none;
}
.gw-column-form-submit .gw-confirm-btn:hover,
.gw-preview-actions .gw-submit-btn:hover { opacity: 0.92; transform: translateY(-1px); }
.gw-preview-actions .gw-back-btn {
    background: #fff;
    color: #666;
    border: 1.5px solid #ccc;
    padding: 15px 30px;
    font-size: 1em;
    border-radius: 30px;
    cursor: pointer;
    font-weight: 700;
}
.gw-preview-actions .gw-back-btn:hover { background: #f5f5f5; }
.gw-checkbox-wrap { display: flex; align-items: center; font-size: 1em; color: #333; font-weight: 700; }
.gw-checkbox-wrap input[type="checkbox"] {
    margin-right: 10px;
    width: 20px; height: 20px;
    accent-color: var(--theme-palette-color-1, #076951);
}
.gw-column-step-heading {
    text-align: center;
    font-size: 1.25em;
    margin-bottom: 24px;
    color: #1a2230;
    padding-bottom: 12px;
    border-bottom: 2px solid var(--theme-palette-color-1, #076951);
}

/* プレビューカード */
.gw-preview-card { background: #fff; border: 1px solid #e0e0e0; border-radius: 12px; padding: 22px; box-shadow: 0 2px 6px rgba(0,0,0,0.04); }
.gw-preview-row { display: flex; gap: 15px; padding: 12px 0; border-bottom: 1px dashed #eee; }
.gw-preview-row:last-child { border-bottom: none; }
.gw-preview-label { font-weight: 700; color: #555; min-width: 100px; font-size: 0.92em; }
.gw-preview-value { flex: 1; color: #333; word-break: break-word; }
.gw-preview-row-content { flex-direction: column; gap: 8px; }
.gw-preview-content { background: #fafbfc; padding: 14px; border-radius: 8px; border: 1px solid #eee; line-height: 1.8; }
.gw-preview-content img { max-width: 100%; height: auto; }
.gw-preview-actions { display: flex; justify-content: center; gap: 14px; margin-top: 28px; flex-wrap: wrap; }
.gw-current-thumb { background: #fafbfc; border: 1px solid #eee; border-radius: 8px; padding: 12px; margin-bottom: 12px; }
@media (max-width: 600px) {
    .gw-preview-row { flex-direction: column; gap: 4px; }
    .gw-preview-label { min-width: auto; }
}

/* 投稿タイミング ラジオ */
.gw-schedule-radio-wrap { display: grid; gap: 8px; }
.gw-schedule-radio {
    display: flex; flex-direction: column;
    align-items: flex-start; gap: 2px;
    padding: 12px 14px;
    background: #fff;
    border: 1.5px solid #e0e4e8;
    border-radius: 10px;
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s;
    position: relative;
    padding-left: 40px;
}
.gw-schedule-radio input[type="radio"] {
    position: absolute; left: 14px; top: 50%; transform: translateY(-50%);
    width: 18px; height: 18px;
    accent-color: var(--theme-palette-color-1, #076951);
    margin: 0;
}
.gw-schedule-radio__main { font-weight: 700; font-size: 0.98em; color: #333; }
.gw-schedule-radio__note { font-size: 0.78em; color: #8893a0; line-height: 1.4; }
.gw-schedule-radio:hover { border-color: #b0bac5; background: #fafbfc; }
.gw-schedule-radio--active { border-color: var(--theme-palette-color-1, #076951); background: #f1faf6; }
.gw-schedule-radio--active .gw-schedule-radio__main { color: var(--theme-palette-color-1, #076951); }
@media (min-width: 560px) { .gw-schedule-radio-wrap { grid-template-columns: 1fr 1fr; } }

/* 絵文字ツールバー（日記準拠） */
.gw-emoji-toolbar {
    background: #f7f9fb;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: 8px 10px;
    margin-bottom: 8px;
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    align-items: center;
}
.gw-emoji-toolbar > span { font-size: 0.85em; color: #666; margin-right: 6px; }
.gw-emoji-btn {
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    padding: 4px 8px;
    font-size: 1.1em;
    cursor: pointer;
    line-height: 1;
    font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif;
}
.gw-emoji-btn:hover { background: #fef8e7; border-color: #f0c040; }

/* ===== 6種リアクション ===== */
.gw-react-wrap { margin: 20px 0; }
.gw-react-own-note {
    font-size: 0.85em; color: #555;
    background: #f7f9fb;
    border-left: 3px solid var(--theme-palette-color-1, #076951);
    padding: 10px 12px;
    border-radius: 6px;
    margin: 0 0 10px;
}
.gw-react-login-hint { font-size: 0.82em; color: #888; margin: 8px 2px 0; text-align: center; }
.gw-react-login-hint a { color: var(--theme-palette-color-1, #076951); font-weight: 700; text-decoration: underline; }
.gw-react-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
}
@media (min-width: 560px) { .gw-react-grid { grid-template-columns: repeat(6, 1fr); } }
.gw-react-btn {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 4px;
    background: #fff;
    border: 1.5px solid #e0e4e8;
    border-radius: 14px;
    padding: 10px 4px;
    cursor: pointer;
    color: #666;
    transition: all 0.15s;
    -webkit-appearance: none;
    font-family: inherit;
}
.gw-react-btn:hover { background: #fafbfc; border-color: #cdd4dc; }
.gw-react-btn:active { transform: scale(0.97); }
.gw-react-icon { line-height: 0; }
.gw-react-icon svg { display: block; }
.gw-react-label { font-size: 0.78em; font-weight: 600; line-height: 1.2; text-align: center; }
.gw-react-count { font-size: 0.85em; font-weight: 700; color: #888; }

/* アクティブ時はそのリアクションのカラーで光る */
.gw-react-btn.gw-react-active { background: #fff; }
.gw-react-btn.gw-react-active .gw-react-icon,
.gw-react-btn.gw-react-active .gw-react-label,
.gw-react-btn.gw-react-active .gw-react-count { color: var(--gw-react-color, #076951); }
.gw-react-btn.gw-react-active { border-color: var(--gw-react-color, #076951); box-shadow: 0 0 0 2px rgba(7,105,81,0.08); }

.gw-react-btn.gw-react-disabled { opacity: 0.6; cursor: not-allowed; }
.gw-react-large .gw-react-btn { padding: 14px 4px; }
.gw-react-large .gw-react-icon svg { width: 24px; height: 24px; }
.gw-react-compact .gw-react-btn { padding: 8px 4px; }
.gw-react-compact .gw-react-icon svg { width: 18px; height: 18px; }
.gw-react-compact .gw-react-label { font-size: 0.72em; }

/* ===== 著者紹介エリア（記事下） ===== */
.gw-column-author-intro {
    margin: 40px 0 24px;
    padding: 28px 24px;
    background: linear-gradient(135deg, #f1faf6 0%, #ffffff 60%);
    border: 1px solid #d6ecde;
    border-radius: 16px;
}
.gw-column-author-intro__inner { max-width: 720px; margin: 0 auto; }
.gw-column-author-intro__label {
    display: inline-block;
    font-size: 0.78em;
    color: #076951;
    background: #fff;
    border: 1px solid #cde7dd;
    padding: 3px 12px;
    border-radius: 16px;
    font-weight: 700;
    margin: 0 0 14px;
}
.gw-column-author-intro__head { display: flex; align-items: center; gap: 16px; margin-bottom: 14px; }
.gw-column-author-intro__avatar img {
    width: 80px; height: 80px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid #fff;
    box-shadow: 0 2px 6px rgba(0,0,0,0.08);
}
.gw-column-author-intro__title { flex: 1; min-width: 0; }
.gw-column-author-intro__name { margin: 0; font-size: 1.3em; font-weight: 800; color: #1a2230; }
.gw-column-author-intro__name a { color: inherit; text-decoration: none; }
.gw-column-author-intro__name a:hover { color: #076951; }
.gw-column-author-intro__role { margin: 4px 0 0; font-size: 0.85em; color: #678; }
.gw-column-author-intro__bio {
    margin: 0 0 18px;
    font-size: 0.95em;
    line-height: 1.7;
    color: #455;
}
.gw-column-author-intro__actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
.gw-column-author-intro__btn {
    display: inline-flex;
    align-items: center; justify-content: center;
    padding: 12px 22px;
    border-radius: 28px;
    font-weight: 700;
    font-size: 0.95em;
    text-decoration: none !important;
    transition: all 0.15s;
    flex: 1 1 220px;
    text-align: center;
}
.gw-column-author-intro__btn--primary {
    background: #076951;
    color: #fff !important;
    border: 1.5px solid #076951;
}
.gw-column-author-intro__btn--primary:hover { background: #0a8568; }
.gw-column-author-intro__btn--ghost {
    background: #fff;
    color: #076951 !important;
    border: 1.5px solid #076951;
}
.gw-column-author-intro__btn--ghost:hover { background: #f1faf6; }
@media (max-width: 540px) {
    .gw-column-author-intro { padding: 20px 16px; }
    .gw-column-author-intro__avatar img { width: 64px; height: 64px; }
    .gw-column-author-intro__name { font-size: 1.15em; }
}

/* ===== マイコラム一覧 ===== */
.gw-column-mylist { max-width: 900px; margin: 0 auto; padding: 16px; }
.gw-column-mylist-head { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; margin-bottom: 18px; }
.gw-column-mylist-head h2 { margin: 0; font-size: 1.4em; color: #1a2230; }
.gw-column-mylist-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.gw-column-mylist-btn {
    display: inline-block;
    padding: 8px 16px;
    border-radius: 20px;
    background: #fff;
    border: 1.5px solid #ddd;
    color: #555;
    font-size: 0.88em;
    font-weight: 700;
    text-decoration: none;
}
.gw-column-mylist-btn:hover { border-color: #076951; color: #076951; }
.gw-column-mylist-btn--primary { background: #076951; color: #fff !important; border-color: #076951; }
.gw-column-mylist-btn--primary:hover { background: #0a8568; color: #fff !important; }

.gw-column-flash {
    margin: 0 0 16px;
    padding: 10px 14px;
    background: #e7f7ef;
    border-left: 4px solid #19a37a;
    color: #15543e;
    border-radius: 6px;
    font-size: 0.92em;
}

.gw-column-mylist-items { list-style: none; padding: 0; margin: 0; display: grid; gap: 14px; }
.gw-column-mylist-item { display: flex; gap: 14px; background: #fff; border: 1px solid #eaeef2; border-radius: 12px; padding: 12px; }
.gw-column-mylist-thumb { width: 120px; height: 80px; object-fit: cover; border-radius: 8px; flex-shrink: 0; }
.gw-column-mylist-body { flex: 1; min-width: 0; }
.gw-column-mylist-title { margin: 0 0 6px; font-size: 1.02em; font-weight: 700; }
.gw-column-mylist-title a { color: #1a2230; text-decoration: none; }
.gw-column-mylist-title a:hover { color: #076951; }
.gw-column-mylist-meta { margin: 0 0 8px; font-size: 0.82em; color: #888; display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.gw-column-mylist-badge { display: inline-block; padding: 2px 9px; border-radius: 11px; font-size: 0.85em; font-weight: 700; }
.gw-column-mylist-badge--public  { background: #e9f3ef; color: #0a6a55; }
.gw-column-mylist-badge--members { background: #fff3e0; color: #b87300; }
.gw-column-mylist-badge--private { background: #f0f0f0; color: #555; }
.gw-column-mylist-badge--future  { background: #fff3cd; color: #856404; }
.gw-column-mylist-badge--trash   { background: #fde2e1; color: #a51c19; }

.gw-column-mylist-row-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.gw-column-act-btn {
    padding: 4px 14px !important;
    border-radius: 18px !important;
    background: #fff;
    border: 1.5px solid #ddd;
    color: #555 !important;
    font-size: 0.78em;
    font-weight: 700;
    text-decoration: none !important;
    cursor: pointer;
    -webkit-appearance: none;
}
.gw-column-act-btn:hover { border-color: #076951; color: #076951 !important; }
.gw-column-act-btn--danger { color: #c33 !important; }
.gw-column-act-btn--danger:hover { border-color: #c33; }
.gw-column-empty { text-align: center; padding: 40px 16px; color: #888; }

@media (max-width: 560px) {
    .gw-column-mylist-item { flex-direction: column; }
    .gw-column-mylist-thumb { width: 100%; height: 160px; }
}

/* ===== コラムアーカイブ／ショートコード共通カードスタイル
       （archive-gw_column.php / [gw_column_list] / [gw_column_top] / 専門家詳細から共有） ===== */
.gw-column-archive-wrap { max-width: 1160px; margin: 0 auto; padding: 36px 16px 60px; }
.gw-column-archive-head { margin-bottom: 28px; }
.gw-column-archive-head h1 { font-size: 1.6em; margin: 0 0 8px; color: #1a2230; font-weight: 800; }
.gw-column-archive-head p  { margin: 0; color: #667; font-size: 0.9em; }
.gw-column-archive-filterbanner { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-top: 14px; padding: 10px 14px; background: #f1faf6; border: 1px solid #cde7dd; border-radius: 10px; font-size: 0.88em; }
.gw-column-archive-filterbanner > span { color: #076951; font-weight: 700; }
.gw-column-archive-filterbanner a { padding: 4px 12px; border-radius: 16px; background: #fff; border: 1px solid #cde7dd; color: #076951; text-decoration: none; font-weight: 600; font-size: 0.9em; }
.gw-column-archive-filterbanner a:hover { background: #076951; color: #fff; }

.gw-column-archive-filter { display: flex; gap: 8px; flex-wrap: wrap; margin: 18px 0 28px; }
.gw-column-archive-filter a { display: inline-block; padding: 6px 16px; border-radius: 20px; font-size: 0.85em; font-weight: 700; text-decoration: none; border: 1.5px solid #ddd; color: #555; background: #fff; }
.gw-column-archive-filter a:hover,
.gw-column-archive-filter a.is-active { border-color: #076951; color: #076951; background: #e9f3ef; }

.gw-column-archive-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
@media (max-width: 900px) { .gw-column-archive-grid { grid-template-columns: repeat(2, 1fr); gap: 18px; } }
@media (max-width: 560px) {
    .gw-column-archive-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
    /* SP は2列でカードがコンパクトになるのでフォント・余白を縮小 */
    .gw-column-card__body { padding: 10px 12px 14px; }
    .gw-column-card__title { font-size: 0.92em; line-height: 1.4; }
    .gw-column-card__excerpt { font-size: 0.78em; line-height: 1.5; margin-bottom: 8px; }
    .gw-column-card__cats a { font-size: 0.68em; padding: 1px 7px; }
    .gw-column-card__author { gap: 6px; padding-top: 8px; font-size: 0.74em; }
    .gw-column-card__author img { width: 22px; height: 22px; }
    .gw-column-card__date { font-size: 0.9em; }
}

.gw-column-card { background: #fff; border-radius: 12px; overflow: hidden; box-shadow: 0 1px 4px rgba(0,0,0,0.05); transition: transform .2s, box-shadow .2s; display: flex; flex-direction: column; }
.gw-column-card:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.08); }
.gw-column-card__thumb { display: block; aspect-ratio: 16 / 10; background: #f1f4f8; overflow: hidden; }
.gw-column-card__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gw-column-card__body { padding: 14px 16px 18px; flex: 1; display: flex; flex-direction: column; }
.gw-column-card__cats { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 6px; }
.gw-column-card__cats a { font-size: 0.72em; padding: 2px 8px; border-radius: 12px; background: #e9f3ef; color: #076951; text-decoration: none; font-weight: 600; }
.gw-column-card__title { font-size: 1.02em; font-weight: 700; color: #1a2230; line-height: 1.45; margin: 0 0 8px; }
.gw-column-card__title a { color: inherit; text-decoration: none; }
.gw-column-card__title a:hover { color: #076951; }
.gw-column-card__excerpt { font-size: 0.85em; color: #555; line-height: 1.55; margin: 0 0 12px; flex: 1; }
.gw-column-card__author { display: flex; align-items: center; gap: 8px; margin-top: auto; padding-top: 10px; border-top: 1px solid #f0f0f0; font-size: 0.82em; }
.gw-column-card__author img { width: 26px; height: 26px; border-radius: 50%; object-fit: cover; }
.gw-column-card__author-name { color: #076951; font-weight: 700; text-decoration: none; }
.gw-column-card__author-name:hover { text-decoration: underline; }
.gw-column-card__date { color: #999; margin-left: auto; font-size: 0.92em; }

.gw-column-empty { text-align: center; padding: 60px 20px; color: #888; }
.gw-column-pagination { margin-top: 32px; text-align: center; }
.gw-column-pagination .nav-links { display: inline-flex; gap: 8px; flex-wrap: wrap; }
.gw-column-pagination a, .gw-column-pagination span { display: inline-block; padding: 8px 14px; border-radius: 20px; background: #fff; border: 1.5px solid #ddd; color: #555; text-decoration: none; font-weight: 700; font-size: 0.9em; }
.gw-column-pagination .current { background: #076951; color: #fff; border-color: #076951; }

/* ===== [gw_column_top] TOPページ用コラムコーナー ===== */
.gw-col-top { max-width: 1160px; margin: 48px auto; padding: 0 16px; }
.gw-col-top__head { text-align: center; margin-bottom: 24px; }
.gw-col-top__title { font-size: 1.6em; font-weight: 800; color: #1a2230; margin: 0 0 6px; }
.gw-col-top__lead { color: #667; font-size: 0.92em; margin: 0; }
.gw-col-top__grid { margin: 0; }
.gw-col-top__more { text-align: center; margin-top: 24px; }
.gw-col-top__more-btn {
    display: inline-block;
    padding: 12px 28px;
    border-radius: 28px;
    background: #076951;
    color: #fff !important;
    font-weight: 700;
    font-size: 0.95em;
    text-decoration: none !important;
    transition: background 0.15s;
}
.gw-col-top__more-btn:hover { background: #054f3e; }
.gw-col-top--empty {
    text-align: center;
    padding: 28px 16px;
    border: 1px dashed #d4dde0;
    border-radius: 12px;
    background: #fafbfc;
}
.gw-col-top__empty-text {
    margin: 0;
    color: #888;
    font-size: 0.95em;
    line-height: 1.7;
}
@media (max-width: 560px) {
    .gw-col-top { margin: 32px auto; }
    .gw-col-top__title { font-size: 1.3em; }
}

/* ===== [gw_column_list] 「もっと見る」ボタン ===== */
.gw-column-list-more { text-align: center; margin: 18px 0 4px; }
.gw-column-list-more__btn {
    display: inline-block;
    padding: 10px 22px;
    border-radius: 24px;
    background: #fff;
    color: #076951 !important;
    border: 1.5px solid #076951;
    font-weight: 700;
    font-size: 0.92em;
    text-decoration: none !important;
    transition: background 0.15s;
}
.gw-column-list-more__btn:hover { background: #f1faf6; }

/* ショートコード経由のグリッドは内側コンテンツ用にカード数を2〜3列に */
.gw-column-list-shortcode { margin: 0; }
