/* simple_community Board Skin - Responsive Styles */

/* Responsive (Mobile) */
@media (max-width: 768px) {
    
    /* Buttons Mobile */
    .board_buttons { padding: 15px; display: flex; flex-direction: column; gap: 8px; }
    .board_buttons .left, .board_buttons .right { display: flex; flex-direction: column; width: 100%; gap: 8px; }
    .board_buttons .right { flex-direction: row; flex-wrap: wrap; }
    .board_buttons .right .btn-zzan-simple.primary { flex: 1; order: -1; width: 100%; min-width: 100%; height: 44px; font-size: 15px; }
    .board_buttons .right .btn-zzan-simple.util { flex: 1; height: 40px; }
    .btn-zzan-simple { width: 100%; height: 40px; padding: 0 15px; font-size: 14px; border-radius: 8px; }
    
    /* Pagination Mobile */
    .pagination { padding: 15px 10px; gap: 3px; }
    .pagination a, .pagination strong { min-width: 30px; height: 30px; font-size: 12px; border-radius: 6px; }
    
    /* Search Mobile */
    .board_search { padding: 15px; }
    .board_search form { display: flex; flex-wrap: wrap; gap: 8px; }
    .board_search select { width: 100%; height: 40px; }
    .board_search .search_input_wrap { width: 100%; display: flex; position: relative; }
    .board_search input { flex: 1; height: 40px; width: 100% !important; margin: 0 !important; padding-right: 45px; }
    .board_search .btn_search { position: absolute; right: 0; top: 0; height: 40px; width: 40px; display: flex; align-items: center; justify-content: center; margin: 0; }

    .board_list_manager_mobile { display: block; }

    /* Read & Write Mobile Padding */
    .read_header, .read_content, .read_files, .write_header .i_title, .write_options, .write_guest, .write_footer { padding: 20px 15px; text-align: left !important; }
    
    .write_header { flex-direction: column; align-items: stretch; }
    .write_header .category_wrap { padding: 15px 15px 0 15px; order: -1; }
    .write_header .category_wrap select { width: 100%; height: 40px; }
    .write_header .i_title { border-bottom: none; }
    .board_form_wrap { padding: 20px 15px; }
    .board_comments { padding: 20px 15px; }
    .read_title { font-size: 20px; text-align: left !important; justify-content: flex-start !important; }
    .read_meta { display: flex; flex-direction: column; gap: 2px; text-align: left !important; align-items: flex-start !important; }
    .read_meta .meta_row { display: flex; align-items: center; gap: 15px; flex-wrap: wrap; }
    .read_meta .meta_row:first-child .author::after { content: '·'; margin-left: 6px; color: #e2e8f0; }
    .read_meta .meta_row:last-child { color: var(--text-mute); font-size: 13px; }
    .read_meta .meta_row:last-child .read::after { content: '·'; margin: 0 6px; color: #e2e8f0; }
    .read_meta .author, .read_meta .date, .read_meta .read, .read_meta .vote { display: inline-flex; width: auto; border: none; padding: 0; margin: 0; }
    .write_header .i_title { font-size: 18px; }

    /* Level Badge Tooltip Mobile (Redundant, as basic style in common.css is now left-aligned) */

    /* Author Activity Mobile */
    .author_activity_area { padding: 20px 15px; }
    .author_activity_lists { flex-direction: column; gap: 25px; }
    .author_activity_lists > div:first-child { border-right: none !important; border-bottom: 1px solid #f1f5f9; }
    .author_activity_lists .recent_list li:nth-child(n+3) { display: none; }

    /* Guest Writing Mobile */
    .write_guest .guest_grid { grid-template-columns: 1fr; gap: 15px; }
    .write_guest .input_wrap input { height: 46px; }

    /* Comment Form Mobile */
    .comment_form { padding: 20px 15px; margin-left: -15px; margin-right: -15px; }
    .comment_campaign { padding: 0 15px 15px 15px; }
    .comment_guest { padding: 0 15px 15px 15px; }
    .comment_guest .guest_grid { grid-template-columns: 1fr; }
    .comment_form .buttons { padding: 0 15px; }

}