/* 要約テキストの表示問題を修正するためのスタイル */
.articles-archive-summary,
.article-detail-intro {
    width: 100% !important;
    max-width: 100% !important;
    white-space: normal !important;
    word-break: break-word !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    display: block !important;
    text-align: left !important;
}

.articles-archive-item,
.article-content,
.article-detail-container {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

.article-content {
    display: block !important;
}

/* クリック可能なカードのスタイル */
.articles-archive-item {
    cursor: pointer !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
    position: relative !important;
}

.articles-archive-item:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1) !important;
}

.articles-archive-item:active {
    transform: translateY(0) !important;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.05) !important;
}

/* コードブロックのスタイル調整 */
.code-block {
    position: relative !important;
}

.code-block .copy-button {
    position: absolute !important;
    top: 5px !important;
    right: 5px !important;
    display: none !important;  /* デフォルトでは非表示 */
    opacity: 0.9 !important;
    padding: 4px 8px !important;
    background-color: #f0f0f0 !important;
    border: 1px solid #ccc !important;
    border-radius: 3px !important;
    cursor: pointer !important;
    font-size: 12px !important;
    z-index: 10 !important;
    transition: opacity 0.2s ease !important;
}

.code-block:hover .copy-button {
    display: block !important;  /* マウスオーバー時に表示 */
}

.code-block .copy-button:hover {
    opacity: 1 !important;
    background-color: #e0e0e0 !important;
}