/* Path: /css/user/style.css — Creator profile page */

@charset "UTF-8";

.user-page .user_top_margin {
    margin-top: 44px;
    transition: margin-top 0.3s ease;
}

.user-page #main_box {
    overflow-x: hidden;
    width: 100%;
    padding: 0 12px 72px;
    box-sizing: border-box;
}

body.feed-page.user-page #main_box,
body.feed-page.user-page .user_top_margin {
    background-color: #f5f7fa;
}

.user_page {
    max-width: 720px;
    margin: 0 auto;
}

.user_profile_card {
    margin-top: 8px;
}

.user_profile_author {
    align-items: center;
    gap: 12px;
}

.user_profile_author > a {
    display: inline-flex;
    flex-shrink: 0;
    line-height: 0;
}

.user_profile_name_block {
    flex: 1;
    min-width: 0;
}

.user_profile_name {
    margin: 0;
    font-size: 1.35rem;
    font-weight: 700;
    color: #222;
    line-height: 1.3;
}

.user_profile_name a,
.user_profile_name a:hover,
.user_profile_name a:visited {
    color: #222;
    text-decoration: none;
}

.user_profile_actions {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
    flex-shrink: 0;
}

.user_social_links {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid #eef2f6;
}

.user_social_link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 999px;
    background: #f0f4f8;
    color: #333;
    text-decoration: none;
    transition: background-color 0.15s ease, transform 0.15s ease;
}

.user_social_link:hover {
    background: #e4ebf3;
    transform: translateY(-1px);
}

.user_social_link_icon {
    width: 18px;
    height: 18px;
}

.user_profile_bio {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid #eef2f6;
    color: #333;
    font-size: 0.95rem;
    line-height: 1.7;
    white-space: normal;
    word-break: break-word;
}

.user_social_links + .user_profile_bio {
    margin-top: 10px;
    padding-top: 10px;
    border-top: none;
}

.user_profile_edit {
    margin: 10px 0 0;
    font-size: 0.85rem;
}

.user_profile_edit a {
    color: #2f6fed;
    text-decoration: none;
}

.user_profile_edit a:hover {
    text-decoration: underline;
}

.user_timeline_card,
.user_books_card {
    margin-top: 8px;
}

.user_section_title {
    margin: 0 0 12px;
    font-size: 1rem;
    font-weight: 700;
    color: #222;
}

.user_section_count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.5em;
    margin-left: 6px;
    padding: 2px 8px;
    border-radius: 999px;
    background: #eef2f6;
    color: #5c6b7a;
    font-size: 0.82rem;
    font-weight: 600;
}

.user_section_count_limited {
    background: #f3f4f6;
    color: #9aa5b1;
    letter-spacing: 0.08em;
}

.user_restricted_state {
    text-align: left;
}

.user_restricted_state .user_restricted_message {
    margin: 0;
}

.user_restricted_state .user_restricted_message + .user_restricted_message {
    margin-top: 8px;
}

.user_restricted_state a {
    color: #1E90FF;
    text-decoration: none;
}

.user_restricted_state a:hover {
    text-decoration: underline;
}

.user_timeline_list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.user_timeline_list .feed_comment_card {
    margin-top: 0;
}

.user_timeline_list .search_comment_author strong a,
.user_timeline_list .search_comment_author strong a:hover {
    text-decoration: none;
}

.user_timeline_list #more_button {
    margin-top: 8px;
    text-align: center;
}

.user_timeline_list #more_button button {
    min-width: 160px;
    padding: 10px 18px;
    border: 1px solid #d8dee6;
    border-radius: 999px;
    background: #fff;
    color: #333;
    font-size: 0.9rem;
    cursor: pointer;
}

.user_book_list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.user_book_item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    border: 1px solid #e8ecf0;
    border-radius: 12px;
    background: #fafbfc;
    color: #222;
    transition: background-color 0.15s ease, border-color 0.15s ease;
}

.user_book_item:hover {
    background: #f0f4f8;
    border-color: #d5dde6;
}

.user_book_link {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1;
    min-width: 0;
    color: inherit;
    text-decoration: none;
}

.user_book_bookmark_icon {
    width: 18px;
    height: 18px;
    margin-left: auto;
    flex-shrink: 0;
    cursor: pointer;
}

.user_book_icon {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}

.user_book_title {
    font-size: 0.95rem;
    font-weight: 600;
    line-height: 1.4;
}

.user_login_hint {
    margin-top: 12px;
    padding: 12px 14px;
    border-radius: 12px;
    background: #fff;
    border: 1px solid #e8ecf0;
    color: #5c6b7a;
    font-size: 0.9rem;
    line-height: 1.6;
}

.user_empty_timeline,
.user_empty_books {
    margin: 0;
}

@media (max-width: 480px) {
    .user_profile_author {
        flex-wrap: wrap;
    }

    .user_profile_actions {
        width: 100%;
        margin-left: 0;
        justify-content: flex-end;
    }
}